docs/development/js_style.rst

   1 ================
   2 JavaScript Style
   3 ================
   4
   5 Style
   6 =====
   7
   8 There are many different JavaScript coding styles but we are using `Idiomatic JavaScript`_ style in Booktype. There is one exception, we do not use extra space inside parentheses.
   9
  10
  11
  12 How to check
  13 =============
  14
  15 We are using `JSHint`_, a tool that helps to detech errors and potential problems in JavaScript code.
  16
  17 First you need to install it:
  18
  19 .. code-block:: bash
  20
  21     $ npm install jshint -g
  22
  23 We have prepared configuration file for our coding style in **scripts/jshintrc** file. You can either install it globally or specify path to the config file each time you execute jshint.
  24
  25 .. code-block:: bash
  26
  27     $ jshint --config Booktype/scripts/jshintrc toc.js
  28
  29     toc.js: line 61, col 44, A leading decimal point can be confused with a dot: '.6'.
  30     toc.js: line 69, col 64, Strings must use singlequote.
  31     toc.js: line 77, col 49, Missing space after 'if'.
  32     toc.js: line 85, col 82, Strings must use singlequote.
  33     toc.js: line 85, col 102, Strings must use singlequote.
  34     toc.js: line 85, col 103, Trailing whitespace.
  35     toc.js: line 86, col 83, Strings must use singlequote.
  36     toc.js: line 87, col 79, Strings must use singlequote.
  37     toc.js: line 88, col 79, Strings must use singlequote.
  38     toc.js: line 88, col 88, Strings must use singlequote.
  39     toc.js: line 89, col 85, Strings must use singlequote.
  40     toc.js: line 91, col 80, Missing space after 'function'.
  41
  42
  43 Read more in the official documentation how to integrate this tool inside of your text editor or IDE - http://www.jshint.com/install/.
  44
  45
  46 Examples
  47 ========
  48
  49 Spaces
  50 ------
  51
  52 Never mix spaces and tabs. Please check your editor is correctly configured to use whitespace instead of tab. For readability we recommend setting two spaces representing a real tab.
  53
  54
  55 Good
  56 --------------------------
  57
  58 ::
  59
  60     if (condition) {
  61       doSomething();
  62     }
  63
  64     while (condition) {
  65       iterating++;
  66     }
  67
  68     var Chapter = Backbone.Model.extend({
  69       defaults: {
  70         chapterID: null,
  71         title: "",
  72         urlTitle: "",
  73         isSection: false,
  74         status: null
  75       }
  76     });
  77
  78     this.refresh = function () {
  79       var $this = this,
  80         lst = win.booktype.editor.data.chapters.chapters;
  81
  82       jquery.each(lst, function (i, item) {
  83         $this.refreshItem(item);
  84       });
  85
  86       this._checkForEmptyTOC();
  87     };
  88
  89     var DEFAULTS = {
  90       panels: {
  91         'edit': 'win.booktype.editor.edit',
  92         'toc' : 'win.booktype.editor.toc',
  93         'media' : 'win.booktype.editor.media'
  94       },
  95
  96       styles: {
  97         'style1': '/static/edit/css/style1.css',
  98         'style2': '/static/edit/css/style2.css',
  99         'style3': '/static/edit/css/style3.css'
 100       },
 101
 102       tabs: {
 103         'icon_generator': function (tb) {
 104           var tl = '';
 105
 106           if (!_.isUndefined(tb.title)) {
 107             if (tb.isLeft) {
 108               tl = 'rel="tooltip" data-placement="right" data-original-title="' + tb.title + '"';
 109             } else {
 110               tl = 'rel="tooltip" data-placement="left" data-original-title="' + tb.title + '"';
 111             }
 112           }
 113
 114           return '<a href="#" id="' + tb.tabID + '"' + tl + '><i class="' + tb.iconID + '"></i></a>';
 115         }
 116       }
 117     }
 118
 119
 120
 121
 122
 123
 124
 125 .. _Idiomatic JavaScript: https://github.com/rwaldron/idiomatic.js/
 126 .. _JSHint: http://www.jshint.com/
 127
 128
 129
 130