Skip to content

Contributing to Riak Control

cmeiklejohn edited this page Feb 13, 2013 · 6 revisions

Configuration

Building and Configuring Riak Control

For information on installation and configuration your Riak cluster, and Riak Control, see Getting-Started-With-Development.

Branching and Code Review

Style Guidelines

When developing JavaScript functionality, please be sure to run your code through JSHint and fix any errors/warnings. In addition to this, we also test JavaScript functionality on all browsers, Firefox, Chrome, Safari and IE >= version 9.

When developing Erlang functionality, please be sure to run dialyzer on your code, via the provided make dialyzer target.

Please also work to avoid line-wraps at 72 characters, and keep your functions small and testable. We don't have much test coverage, but we hope to change this.

Branching

When developing your feature, be sure to fork the riak_control repository, and commit your work to a branch created off of the master branch.

Code Review

When you've completed your feature, open a pull request against the basho/riak_control repository, and a Basho engineer will get back to you with feedback regarding your feature.

Development and Tooling

Framework

Riak Control's user interface is built using Ember.js and its persistence layer Ember Data. In future releases, we will be using D3.js for interactive visualizations.

Compiling

Riak Control can be compiled by running rebar compile. If you need to rebuild assets, but want to skip the dependencies, you can run rebar compile skip_deps=true or make app.

Templating

Templates in Riak Control are authored in Handlebars.js. These templates are wrapped in compile blocks, and concatenated into one JavaScript file included by the browser. The rebar_js_handlebars_plugin takes care of building this when compiling (as part of rebar compile). To add a new template, see the rebar.config file.

The following excerpt from rebar.config shows that all templates from the doc_root will be concatenated into one file, called generated/templates.js, which will wrap each template in an Ember.TEMPLATES[templatename] = Ember.Handlebars.compile block.

{js_handlebars, [
    {doc_root,   "priv/admin/js/templates"},
    {out_dir,    "priv/admin/js"},
    {target,     "Ember.TEMPLATES"},
    {compiler,   "Ember.Handlebars.compile"},
    {templates,  [{"generated/templates.js", ["application.hbs", "snapshot.hbs", "cluster.hbs", "ring.hbs", "partition_filter.hbs", "pagination_item.hbs"]}]}
]}.

Styling

CSS for Riak Control is authored using Stylus. When changes are made to each stylus file, rebar compile will build the correct output file using the rebar_js_stylus_plugin.

The following excerpt from rebar.config shows that files from the stylesheets section will be compiled and created in the out_dir. The stylus compiler is itself written in Node.js, and needs to be installed with npm install stylus. If the compiler is not present, rebar will skip this compilation step.

{js_stylus, [
    {stylus_path,   "/usr/local/bin/stylus"},
    {doc_root,      "priv/admin/css"},
    {out_dir,       "priv/admin/css/compiled"},
    {stylesheets,   ["style.styl"]}
]}.

Asset Concatenation

Riak Control concatenates all of its required assets using the rebar_js_concatenator_plugin, as part of the rebar compile phase.

The following excerpt from rebar.config shows that we're building a vendor.js file which contains all of the applications dependencies.

{js_concatenator, [
    {doc_root,        "priv/admin/js/vendor"},
    {out_dir,         "priv/admin/js"},
    {concatenations,  [{"generated/vendor.js", ["jquery-1.7.2.js", "jquery-ui-1.8.16.custom.min.js", "handlebars-1.0.0.beta.6.js", "ember-latest.js", "ember-data-latest.js", "minispade.js"], []}]}
]}.