node package manager

zombiebox

ZombieBox


ZombieBox is a JavaScript framework for development of Smart TV and STB applications.

Why ZombieBox?

  • It's cross-platform;
  • It leverages strongly typed JavaScript by Google Closure Compiler and modern ECMAScript;
  • It provides set of typical solutions for TV, such as spatial navigation or remote logging;
  • It produces fast application that have a small size and a minimum of 3th party code;

Getting started

Install ZombieBox CLI tool:

npm install -g zombiebox-cli

Create empty project:

zb init /path/to/empty/dir

Install dependencies:

npm install

Run development server:

zb run

Platforms

ZombieBox supports a lot of modern Smart TV and STB platforms and also bunch of legacy but high-demand platforms, which let deliver your application to a maximum number of devices.

List of supported platforms:

Platform Package Version
Browsers zombiebox-platform-pc
Headless browsers zombiebox-platform-headless
Samsung Tizen (2015+) zombiebox-platform-tizen
Samsung Orsay (2012-2014) zombiebox-platform-samsung
LG webOS (2014+) zombiebox-platform-webos
LG NetCast (2012-2014) zombiebox-platform-lg
Dune STB zombiebox-platform-dune
Eltex STB zombiebox-platform-eltex
Tvip STB zombiebox-platform-tvip
MAG STB zombiebox-platform-mag
MAG 250 STB zombiebox-platform-mag250

Installation of a new platform is easy and nothing more than installation of a new npm package with further saving in the dependencies.

For example, you have decided to install Samsung Orsay platform:

npm i zombiebox-platform-samsung --save

Then you should configure the installed platform for building of a distribution package:

// Your config.js
 
module.exports = () => ({
    samsung: {
        // Some platform-specific configuration
    }
});

Finally, build the package:

zb build samsung

Extensions:

Extension is a special npm package that extends default functionality of the framework. For usage just install package via npm and save it in the dependencies.

List of available extensions:

Description Package Version
Set of basic TV-oriented components zombiebox-extension-ui
Set of grid components zombiebox-extension-grid
I18n support zombiebox-extension-i18n
Tools for Pixel Perfect testing zombiebox-extension-pixelperfect
Popup "About" zombiebox-extension-about
Lodash library integration zombiebox-extension-lodash

Configuration

Configuration file is a module that exports function returning configuration object.

By default, the framework will try to find file config.js in the root of the project, but you can set custom path by passing --config path to the CLI commands.

Configuration object:

  • appNamespace (required) - namespace of the app;

  • codeSources (optional) - object of alias: file path pairs;

  • tempalteLocations (optional) - array of paths to use for templates locating, alongside with default path templates;

  • build.exclude (optional) - array of relative to web directory/file paths to exclude;

  • build.inlineCSSResources (optional, false by default) - use or not base64 encoding for images in CSS files;

  • jsLibs (optional) - array of relative to web file paths to inline by <script> tag;

  • scripts (optional) - array of file paths to compile;

  • compilation.externs (optional) - array of file paths to use as compilation externs;

  • compilation.exclude (optional) - array of file paths to exclude from compilation;

  • compilation.flags (optional) - object of name: value pairs to pass as compiler flags;

  • compilation.level (optional, ADVANCED_OPTIMIZATIONS by default) - one of Closure Compiler Compilation Levels;

  • web.port (optional, 1337 by default) - development server port;

  • web.proxy (optional) - object of alias: url pairs for development server proxying;

  • web.enableRawProxy (optional, false by default) - development server proxying through /proxy/?url=%url%;

  • resolutions (optional, PAL, QHD, HD, FULL_HD by default) - array of supported by the app resolutions. Resolution is represented by an object with name, width and height keys;

  • styles (optional) - array of CSS file paths;

  • stylesExclude (optional) - array of CSS file paths to exclude;

  • stylesOrder (optional) - array of string/regexps patterns to resolve CSS files order. Pattern index represents the priority;

  • stylesTransformOptions (optional, {browsers: 'for last 100 versions'} by default) - postcss-cssnext options;

  • services (optional) - array of DI services. Service is represented by an object with class and _group keys;

  • servicesAutodetect (optional) - array of DI auto detection entries. Entry is represented by a string or an object with keys group, namespace and directory;

CLI commands

  • zb init <path> - generates project skeleton interactively;
  • zb run [--config=<configPath>] - starts development server;
  • zb build <platforms> [--config=<configPath>] [--enableConsole] - build a distribution package;
  • zb buildCode [--config=<configPath>] - generates code that located in .code-cache;
  • zb (addScene|addPopup|addWidget) <name> [--base=<string>] - generates boilerplate code for UI components;

Documentation

English

Russian

License

Copyright (c) 2011-2017, Interfaced. All rights reserved.
If you have any questions about license, please write to licensing@zombiebox.tv.


This library is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NON-INFRINGEMENT OF THIRD-PARTY INTELLECTUAL PROPERTY RIGHTS.