jscs integration + config

src/modules/JavaScript.js

@@ -10,6 +10,9 @@ define([
   , "main/clientOnly!dijit/form/Button"
   , "main/clientOnly!dijit/form/ToggleButton"
   , "main/clientOnly!./javascript/Formatter4"
+  , "main/clientOnly!./javascript/formatSettingsDlg"
+  , "main/clientOnly!dijit/form/DropDownButton"
+  , "main/config"
 ], function(
   declare
   , Base
@@ -22,19 +25,17 @@ define([
   , Button
   , ToggleButton
   , Formatter
+  , formatSettingsDlg
+  , DropDownButton
+  , config
 ){
 
-  var checker;
+  var mChecker;
   var getFormatter = function(){
-    if (!checker){
-      var Checker = Formatter();
-      checker = new Checker();
-      checker.registerDefaultRules();
-      checker.configure( {
-        preset: 'mdcs'
-      } );
+    if (!mChecker){
+      mChecker = Formatter();
     };
-    return checker;
+    return mChecker;
   };
 
   var additionalSubtypes = {
@@ -77,22 +78,67 @@ define([
     }
 
     , format: function(){
-      var checker = getFormatter();
-      this.mirror.set("value", checker.formatString(this.get("content").text));
+      var self = this;
+      config.get("codemirror-jscsPreset").then(function(preset){
+        var Checker = getFormatter();
+        var checker = new Checker();
+        checker.registerDefaultRules();
+
+        preset = preset || "mdcs";
+        checker.configure( {
+          preset: preset
+        } );
+        self.mirror.set("value", checker.formatString(self.get("content").text));
+      });
     }
 
+
+    // so special implementations can override it
+    , setCodemirrorValue: function(parValue){
+      if (this.mirror && this.mirror.get("autoJscsFormat")){
+        var preset = this.mirror.get("jscsPreset") || "mdcs";
+        var Checker = getFormatter();
+        var checker = new Checker();
+        checker.registerDefaultRules();
+
+        preset = preset || "mdcs";
+        checker.configure( {
+          preset: preset
+        } );
+        this.mirror.set("value", checker.formatString(parValue));
+      }else{
+        return this.inherited(arguments);
+      };
+    }
+
+
     , buildRendering: function(){
       var ret = this.inherited(arguments);
 
+
+      this.mirror.setJscs(getFormatter());
+
+
+      return ret;
+    }
+
+    , createMenu: function(){
+      var menu = this.inherited(arguments);
+      this.syntaxSettingsBtn = this.ownObj(new DropDownButton({
+        label: "Format cfg.",
+        dropDown: formatSettingsDlg()
+      }));
+      menu.addChild(this.syntaxSettingsBtn);
+
       this.formatBtn = this.ownObj(new Button({
         onClick: lang.hitch(this, "format")
         , label: "format"
       })); 
-      this.menu.addChild(this.formatBtn);
-
+      menu.addChild(this.formatBtn);
 
-      return ret;
+      return menu;
     }
+
 
 
   });

src/modules/Text.js

@@ -301,10 +301,19 @@ define([
     , _setContentAttr: function(parContent){
       this._set("content", parContent);
       if (this.mirror){
-        this.mirror.set("value", this.content.text);
+        //this.mirror.set("value", this.content.text);
+        this.setCodemirrorValue(this.content.text);
         this.mirror.set("mode", this.content.contentType);
       };
     }
+
+    // so special implementations can override it
+    , setCodemirrorValue: function(parValue){
+      if (this.mirror){
+        this.mirror.set("value", parValue);
+      };
+    }
+
     , _getContentAttr: function(){
       if (this.mirror){
         this.content.text = this.mirror.get("value");

src/modules/javascript/formatSettingsDlg.js

@@ -0,0 +1,190 @@
+define([
+  "dojo/_base/declare"
+  , "dijit/TooltipDialog"
+  , "main/clientOnly!codemirror4/theme/all"
+  , "main/clientOnly!dijit/form/Select"
+  , "dojo/_base/array"
+  , "dojo/_base/lang"
+  , "dojox/layout/TableContainer"
+  , "dojo/topic"
+  , "main/config"
+  , "dijit/form/CheckBox"
+  , "modules/text/codeMirrorSettings"
+  , "dijit/form/HorizontalSlider"
+  , "sol/convenient/Delayed"
+
+  , "codemirror4/keymap/emacs"
+  , "codemirror4/keymap/vim"
+], function(
+  declare
+  , TooltipDialog
+  , allThemes
+  , Select
+  , array
+  , lang
+  , TableContainer
+  , topic
+  , config
+  , CheckBox
+  , codeMirrorSettings
+  , HorizontalSlider
+  , Delayed
+){
+  var Dlg = declare([TooltipDialog], {
+    buildRendering: function(){
+      this.inherited(arguments);
+      var self = this;
+
+      this.table = this.ownObj(new TableContainer({
+        "class": "codeMirrorSettingsTable"
+        , labelWidth: 220
+      }));
+      this.table.placeAt(this.containerNode);
+
+      var onChangeFun = function(parValue){
+        if (!self.startedComplete){
+          return;
+        };
+        codeMirrorSettings.set(this.setting, parValue);
+      };
+      var valueSetFun = function(parValue){
+        this.set("value", parValue);
+      };
+      var onChangeCheckBoxFun = function(parValue){
+        if (!self.startedComplete){
+          return;
+        };
+        if (this.get("checked")){
+          codeMirrorSettings.set(this.setting, true);
+        }else{
+          codeMirrorSettings.set(this.setting, false);
+        };
+      };
+      var valueSetCheckBoxFun = function(parValue){
+        if (parValue){
+          this.set("checked", true);
+        }else{
+          this.set("checked", false);
+        };
+      };
+
+      var settingsStructure = [new Select({
+        options: [{
+          label: "jshint"
+          , value: "jshint"
+        },{
+          label: "jscs"
+          , value: "jscs"
+        },{
+          label: "jshint + jscs"
+          , value: "jshint+jscs"
+        }]
+        , label: "Syntax Check"
+        , setting: "javascriptSyntax"
+        , valueSet: valueSetFun
+        , onChange: onChangeFun
+
+      }), new Select({
+        options: [{
+          label: "airbnb"
+          , value: "airbnb"
+        },{
+          label: "crockford"
+          , value: "crockford"
+        },{
+          label: "google"
+          , value: "google"
+        },{
+          label: "jquery"
+          , value: "jquery"
+        },{
+          label: "mdcs"
+          , value: "mdcs"
+        },{
+          label: "wikimedia"
+          , value: "wikimedia"
+        },{
+          label: "yandex"
+          , value: "yandex"
+        }]
+        , label: "jscs preset"
+        , setting: "jscsPreset"
+        , valueSet: valueSetFun
+        , onChange: onChangeFun
+
+      }), new CheckBox({
+        label: "format after loading"
+        , setting: "autoJscsFormat"
+        , valueSet: valueSetCheckBoxFun
+        , onChange: onChangeCheckBoxFun
+      })];
+
+
+
+
+      var settingsMap = {};
+      array.forEach(settingsStructure, function(entry){
+        settingsMap[entry.setting] = entry;
+      });
+
+      var doneBoo = false;
+      var handle = codeMirrorSettings.on("settings", function(settings){
+        if (handle){
+          handle.remove();
+        };
+        doneBoo = true;
+        var s;
+        for (s in settings){
+          if (settingsMap[s]){
+            settingsMap[s].valueSet(settings[s]);
+          };
+        };
+        self.checkStarted(2);
+      });
+      if (doneBoo){
+        handle.remove();
+      };
+
+      array.forEach(settingsStructure, function(entry){
+        self.table.addChild(entry);
+      });
+
+    }
+    , checkStarted: function(par){
+      if (par == 1){
+        this.started1 = true;
+      };
+      if (par == 2){
+        this.started2 = true;
+      };
+      if (this.started1 && this.started2)
+      {
+        this.startedComplete = true;
+      }
+    }
+    , startup: function(){
+      if (this._started){
+        return;
+      };
+      this.inherited(arguments);
+      var self = this;
+      setTimeout(function(){
+        self.checkStarted(1);
+      }, 0);
+    }
+    , destroy: function(){
+      //debugger; // this should not happen !!!
+      // i shall not be destroyed !
+      return;
+    }
+
+  });
+
+  var dlg;
+  return function(){
+    if (!dlg){
+       dlg = new Dlg({});
+    };
+    return dlg;
+  };
+});

src/modules/text/codeMirrorSetable.js

@@ -12,5 +12,8 @@ define([
     , autoComplete: true
     , keyMap: "default"
     , highlightSelectionMatches: null
+    , javascriptSyntax: "jshint"
+    , jscsPreset: "mdcs"
+    , autoJscsFormat: false
   };
 });

src/modules/text/codeMirrorSettings.js

@@ -20,17 +20,20 @@ define([
     };
     settingsDef.resolve(loadedSettings);
   };
-  var getValue = function(parValue){
+  var getValue = function(parValue, parDefault){
     config.get("codemirror-" + parValue).then(function(value){
       --valCnt;
+      if (value === undefined){
+        value = parDefault;
+      };
       loadedSettings[parValue] = value;
       checkValCnt();
     });
   };
 
   for (var valname in codeMirrorSetable){
     ++valCnt;
-    getValue(valname);
+    getValue(valname, codeMirrorSetable[valname]);
   };
   --valCnt;
   checkValCnt();

src/modules/text/settingsDlg.js

@@ -30,7 +30,7 @@ define([
   , HorizontalSlider
   , Delayed
 ){
-  Dlg = declare([TooltipDialog], {
+  var Dlg = declare([TooltipDialog], {
     buildRendering: function(){
       this.inherited(arguments);
       var self = this;