STB single page application framework

Provides development environment and base components in a form of CommonJS modules for set-top box software production.

This framework is targeted on the client side and requires a building stage with Webpack or Browserify.

Getting Started

Node.js and NPM should be installed beforehand. Please follow the official instruction.

stb is available as an npm package and should be installed globally:

npm install -g stb gulp

In Linux this can be done as a root:

sudo npm install -g stb gulp

Usage

Create a new folder for your project and move to it:

mkdir myapp
cd myapp

Run the generator from within the new folder to create all necessary files and folders:

stb init

In order to just update main framework files in the existing project:

stb update

To install all necessary package dependencies:

npm install

To start working with a project it's necessary to make initial build and start all servers:

gulp

Full list of available tasks:

Name	Description
build	rebuild everything
img	remove and copy all images
jade	compile all HTML files from Jade sources
less	compile all Less files into a set of css files with maps
lint	analyse JavaScript code for potential errors and problems
logger	WebSocket server to translate log messages from STB to a desktop console
open	open the default web browser with the given page (API docs, develop/release build, weinre)
pack	pack a specific build into zip archive
proxy	proxy js code execution from a desktop browser to STB
repl	read-eval-print loop task
serve	start all watchers and servers
ssh	remote access to the STB device
static	serve files in the build directory
watch	monitor files and rebuild
webpack	compile all CommonJS modules into a single js file
weinre	WEb INspector REmote debugger server

After the gulp serve command the start page should open in the default browser. This page should be accessible remotely on the STB device via http://external_ip_address:8000/develop.html address.

It's possible to suppress a browser opening with

gulp serve open

In case remote access to STB device is enabled and configured in application ./config/ssh.js it's possible to activate one of the remote commands:

gulp serve ssh:develop

where remote commands are listed in the ssh config file.

At runtime the development mode has a set of useful function available via keyboard shortcuts:

Keys	Description
Numpad .	reload the page CSS
Numpad 0	reload the page in the current resolution
Numpad 1	reload the page in NTSC
Numpad 2	reload the page in PAL
Numpad 3	reload the page in 720p
Numpad 4	reload the page in 1080p
Numpad 5	draw debug grid with indicators
Numpad 6	stress-testing based on gremlins.js for the emulation mode
Numpad 7	Spy-js tracing/debugging/profiling activation and deactivation
Numpad 8	FireBug Lite console activation

Illustrations of most approaches and components can be found in the demo application.

Help files generated from JSDocs comments in framework modules are available online.

Spy-js use with WebStorm

1. Make sure you have folder "tmp" in your home directory.
2. Menu > Run > Edit configuration > add new spy-js configuration.
3. Clear "URL to trace" field.
4. Disable "Automatically configure system proxy" option.
5. Run this configuration.
6. Run stb application with similar command gulp default ssh:develop.
7. Activate spy-js with Numpad 7 key.

Structure

Path	Description
bin	main command-line script available globally
test	QUnit tests files (units and static)
tpl	a new application directory structure with all app/config/task files

Technologies

• Node.js
• Gulp
• Webpack
• UglifyJs
• Jade
• Qunit
• Less
• ESLint
• weinre
• code-proxy
• gremlins.js

Contribution

If you have any problem or suggestion please open an issue here. Pull requests are welcomed with respect to the JavaScript Code Style and included ESLint rules.

License

stb is released under the GPL-3.0 License.