Trace-Based Systems - Silex Team

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
This page is **deprecated**. Wee keep it only for archival purposes.

Please visit the [[https://taaabselements.github.io/|newer documentation]].

====== Taaabs Documentation ======
===== Common Prerequisites =====
Taaabs is a single page application using ''[[https://www.polymer-project.org/|Polymer]]'' and running in a browser.
Taaabs is written in ''HTML'' and ''JavaScript''.
Taaabs use ''[[https://github.com/gulpjs/gulp/tree/master/docs|gulp]]'' as Task-Runner/build tool, ''[[https://docs.npmjs.com/|npm]]'' and ''[[http://bower.io/|bower]]'' for dependency management.
Theses tools needs ''[[https://nodejs.org/en/|Node.js]]'' runtime environment.

''node'' and ''npm'' should be installed with your distribution package manager (apt-get, yum, pacman...) if possible and if the version packaged for your distribution is the actual stable Node.js version. 
At least you need a ''node'' version >= 0.12.7 and ''npm'' version >= 2.14.1.

You can check theses version with ''node --version'' and ''npm --version''.

If your distribution package manager cannot, no problem, you can download and install node (since v0.12, npm is packaged inside node, so you don't need to install it separatly) [[https://nodejs.org/en/download/|Download Node.js]].

Assuming now you have ''node'', ''npm'' properly installed.

We use ''npm'' for installing build tools and build dependencies.

===== Clone the project =====
''git clone git@github.com:liris-tweak/taaabs.git''

''cd taaabs/''

===== Gulp =====
Then, you need to install gulp, as an executable application. 
''[sudo] npm install -g gulp'' will install ''gulp'' for you in ''/usr/lib/node_modules/'' and the executable will be available as a link on ''/usr/bin''.

Now you can try the command ''gulp'' in your terminal. If you see in the standard output something like "local gulp not found", you have succefully installed ''gulp''.

If you got a message like ''gulp: command not found'', please read [[https://docs.npmjs.com/getting-started/installing-npm-packages-globally|Installing npm packages globally]] and this[[https://docs.npmjs.com/getting-started/fixing-npm-permissions|Fixing npm permissions]]

The ''gulp'' working principle is to check the configuration file of a project and perform the tasks described there.
This configuration file is named by convention 'gulpfile.js'.
To run the task 'foo' described in the configuration, you write ''gulp foo''.

===== Bower =====
Then, you can install ''bower'', as an executable application. ''[sudo] npm install -g bower'' will install ''bower'' for you in the same way as explained before.

Now you can try the command ''bower'' in your terminal. If ''bower'' is installed correctly you can see a short manual about how to use ''bower''. A thorough reading of this message is not necessary, but might be entertaining.

===== Installing build dependencies =====
Then, you must fetch the build dependencies of the project: ''npm install -d''. When you run this command, ''npm'' read the ''package.json'' file which contains developers dependencies. By default, theses dependencies are stored in the ''node_modules/'' directory at the root of the project. The ''-d'' option in ''npm'' means that you want to install the dependencies declared as ''"devDependencies"'' in the ''package.json'' file.

===== Installing client-side dependencies =====
Then, you must fetch the client-side dependencies of the project: ''bower install''. ''bower'' will read the ''bower.json'' and by default theses dependencies are stored in the ''bower_components/'' directory at the root of the project. 

====== Development Worflow ======

===== JSHint =====
We use [[http://jshint.com/docs/|JSHint]] to check suspicious usage in the JavaScript code inside Taaabs. This application take JavaScript code, parse it, and do some syntaxic/semantic checking. 

When building ''Taaabs'' (using ''gulp'' command), JSHint run a check on all files inside app/ directory. 
<note warning>If you ignore these warnings, the building process cannot complete.</note>

We suggest you to 
I suggest that you regularly scan your code using


===== JSCS =====

===== Project Directory Structure =====
''app/'': Directory containing sources of the application.

''bower.json'': A file describing client-side dependencies of the project.

''bower_components/'': Directory containing client-side dependencies.

''dist/'': Contains the "production" files (this directory can be served by an HTTP server like Apache, Nginx)

''gulpfile.js'': File describing the build process.

''node_modules/'': Directory containing build dependencies (or server-side dependencies for Node.js based server applications). 

''package.json'': A file describing build dependencies of the project. (usually this folder contains server-side dependencies for Node.js based server applications)

''.bowerrc'': Configuration file for ''bower''

''.jscsrc'': configuration file for JSCS (JSCS is a code style linter for programmatically enforcing your style guide). 

''.jshintrc'': configuration file for JSHint (JSHint is a tools to detect suspicious usage in programs written in JavaScript).

''wct.conf.json'': A file desbribing Unit tests

===== Running the development web server =====

When you are modifing sources files of ''Taaabs'', you can see a continuous updated version on your browser.
To do this, use ''gulp serve'', and open http://localhost:3000/ in Chromium browser or Chrome browser.


===== Run the simple webserver =====
''gulp simpleserver''

Then open http://localhost:8080/dist/ .