Themes in Brackets core

src/brackets.js

@@ -102,6 +102,7 @@ define(function (require, exports, module) {
         NativeApp               = require("utils/NativeApp"),
         DeprecationWarning      = require("utils/DeprecationWarning"),
         ViewCommandHandlers     = require("view/ViewCommandHandlers"),
+        ThemeManager            = require("themes/ThemeManager"),
         _                       = require("thirdparty/lodash");
 
     // DEPRECATED: In future we want to remove the global CodeMirror, but for now we

src/command/Commands.js

@@ -109,6 +109,7 @@ define(function (require, exports, module) {
     exports.SORT_WORKINGSET_BY_NAME     = "view.sortWorkingSetByName";  // WorkingSetSort.js            _handleSortWorkingSetByName()
     exports.SORT_WORKINGSET_BY_TYPE     = "view.sortWorkingSetByType";  // WorkingSetSort.js            _handleSortWorkingSetByType()
     exports.SORT_WORKINGSET_AUTO        = "view.sortWorkingSetAuto";    // WorkingSetSort.js            _handleAutomaticSort()
+    exports.THEMES                      = "view.themes";                // MenuCommands.js              Settings.open()
 
     // NAVIGATE
     exports.NAVIGATE_NEXT_DOC           = "navigate.nextDoc";           // DocumentCommandHandlers.js   handleGoNextDoc()

src/command/DefaultMenus.js

@@ -111,6 +111,8 @@ define(function (require, exports, module) {
          * View menu
          */
         menu = Menus.addMenu(Strings.VIEW_MENU, Menus.AppMenuBar.VIEW_MENU);
+        menu.addMenuItem(Commands.THEMES);
+        menu.addMenuDivider();
         menu.addMenuItem(Commands.VIEW_HIDE_SIDEBAR);
         menu.addMenuDivider();
         menu.addMenuItem(Commands.VIEW_INCREASE_FONT_SIZE);

src/extensibility/ExtensionManager.js

@@ -44,9 +44,11 @@ define(function (require, exports, module) {
         Package          = require("extensibility/Package"),
         Async            = require("utils/Async"),
         ExtensionLoader  = require("utils/ExtensionLoader"),
+        ExtensionUtils   = require("utils/ExtensionUtils"),
         FileSystem       = require("filesystem/FileSystem"),
         Strings          = require("strings"),
-        StringUtils      = require("utils/StringUtils");
+        StringUtils      = require("utils/StringUtils"),
+        ThemeManager     = require("themes/ThemeManager");
 
     // semver.browser is an AMD-compatible module
     var semver = require("extensibility/node/node_modules/semver/semver.browser");
@@ -132,6 +134,21 @@ define(function (require, exports, module) {
 
         $(exports).triggerHandler("registryUpdate", [id]);
     }
+
+
+    /**
+     * @private
+     * Verifies if an extension is a theme based on the presence of the field "theme"
+     * in the package.json.  If it is a theme, then the theme file is just loaded by the
+     * ThemeManager
+     */
+    function loadTheme(id) {
+        var extension = extensions[id];
+        if ( extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme ) {
+            ThemeManager.loadFile(extension.installInfo.path + "/" + extension.installInfo.metadata.theme);
+        }    
+    }
+
 
     /**
      * @private
@@ -185,30 +202,6 @@ define(function (require, exports, module) {
         return result.promise();
     }
 
-    /**
-     * @private
-     * Loads the package.json file in the given extension folder.
-     * @param {string} folder The extension folder.
-     * @return {$.Promise} A promise object that is resolved with the parsed contents of the package.json file,
-     *     or rejected if there is no package.json or the contents are not valid JSON.
-     */
-    function _loadPackageJson(folder) {
-        var file = FileSystem.getFileForPath(folder + "/package.json"),
-            result = new $.Deferred();
-        FileUtils.readAsText(file)
-            .done(function (text) {
-                try {
-                    var json = JSON.parse(text);
-                    result.resolve(json);
-                } catch (e) {
-                    result.reject();
-                }
-            })
-            .fail(function () {
-                result.reject();
-            });
-        return result.promise();
-    }
 
     /**
      * @private
@@ -245,10 +238,11 @@ define(function (require, exports, module) {
                 status: (e.type === "loadFailed" ? START_FAILED : ENABLED)
             };
             synchronizeEntry(id);
+            loadTheme(id);
             $(exports).triggerHandler("statusChange", [id]);
         }
 
-        _loadPackageJson(path)
+        ExtensionUtils.loadPackageJson(path)
             .done(function (metadata) {
                 setData(metadata.name, metadata);
             })

src/nls/root/strings.js

@@ -330,6 +330,7 @@ define({
     "CMD_SORT_WORKINGSET_BY_NAME"         : "Sort by Name",
     "CMD_SORT_WORKINGSET_BY_TYPE"         : "Sort by Type",
     "CMD_SORT_WORKINGSET_AUTO"            : "Automatic Sort",
+    "CMD_THEMES"                          : "Themes",
 
     // Navigate menu Commands
     "NAVIGATE_MENU"                       : "Navigate",

src/themes/CodeMirrorAddons.js

@@ -0,0 +1,40 @@
+/**
+ * Brackets Themes Copyright (c) 2014 Miguel Castillo.
+ *
+ * Licensed under MIT
+ */
+
+
+/*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
+/*global $, define, require */
+
+define(function () {
+    "use strict";
+
+    var CodeMirror = require("thirdparty/CodeMirror2/lib/codemirror");
+
+    function initAddons() {
+        // Set some default value for codemirror...
+        CodeMirror.defaults.highlightSelectionMatches = true;
+        CodeMirror.defaults.styleSelectedText = true;
+    }
+
+    function init() {
+        var deferred = $.Deferred();
+
+        /**
+        *  This is where is all starts to load up...
+        */
+        require([
+            "thirdparty/CodeMirror2/addon/selection/mark-selection",
+            "thirdparty/CodeMirror2/addon/search/match-highlighter"
+        ], deferred.resolve);
+
+        return deferred.done(initAddons).promise();
+    }
+
+    return {
+        ready: init()
+    };
+});
+

src/themes/DefaultSettings.js

@@ -0,0 +1,29 @@
+/**
+ * Brackets Themes Copyright (c) 2014 Miguel Castillo.
+ *
+ * Licensed under MIT
+ */
+
+
+/*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
+/*global $, define, require */
+
+define(function(require) {
+    "use strict";
+
+    var FileUtils = require("file/FileUtils");
+    var cm_path   = FileUtils.getNativeBracketsDirectoryPath() + "/thirdparty/CodeMirror2";
+
+    return {
+        "fontSize": 12,
+        "lineHeight": '1.3em',
+        "fontType": "'SourceCodePro-Medium', ＭＳ ゴシック, 'MS Gothic', monospace",
+        "customScrollbars": true,
+        "theme": ["default"],
+        "paths": [
+            {path:require.toUrl("./") + "../../themes"},
+            {path:require.toUrl("./theme/")},
+            {path:cm_path + "/theme"}
+        ]
+    };
+});

src/themes/FontCommandsManager.js

@@ -0,0 +1,44 @@
+/**
+ * Brackets Themes Copyright (c) 2014 Miguel Castillo.
+ * @author Brad Gearon
+ *
+ * Licensed under MIT
+ */
+
+/*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
+/*global $, define, require */
+
+define(function (require) {
+    "use strict";
+
+    var Settings            = require("themes/Settings"),
+        DefaultSettings     = require("themes/DefaultSettings"),
+        ViewCommandHandlers = require("view/ViewCommandHandlers"),
+        PreferencesManager  = require("preferences/PreferencesManager");
+
+    function ViewCommandsManager () {
+        $(ViewCommandHandlers).on("fontSizeChange", updateThemeFontSize);
+        $(Settings).on("change:fontSize", updateBracketsFontSize);
+        updateBracketsFontSize();
+    }
+
+    function updateThemeFontSize (evt, adjustment, fontSize /*, lineHeight*/) {
+        Settings.setValue("fontSize", fontSize);
+    }
+
+    function updateBracketsFontSize() {
+        var fontSize = Settings.getValue("fontSize"),
+            fontSizeNumeric = Number(fontSize.replace(/px|em/, "")),
+            fontSizeOffset = fontSizeNumeric - DefaultSettings.fontSize;
+
+        if(!isNaN(fontSizeOffset)) {
+            PreferencesManager.setViewState("fontSizeAdjustment", fontSizeOffset);
+            PreferencesManager.setViewState("fontSizeStyle", fontSize);
+        }
+    }
+
+    // Let's make sure we use Themes fonts by default
+    return {
+        init: ViewCommandsManager
+    };
+});

src/themes/FontSettings.js

@@ -0,0 +1,65 @@
+/**
+ * Brackets Themes Copyright (c) 2014 Miguel Castillo.
+ *
+ * Licensed under MIT
+ */
+
+
+/*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
+/*global $, define, require */
+
+define(function () {
+    "use strict";
+
+    var $lineHeight = $("<style type='text/css' id='lineHeight'>").appendTo("head"),
+        $fontSize = $("<style type='text/css' id='fontSize'>").appendTo("head"),
+        $fontType = $("<style type='text/css' id='fontType'>").appendTo("head");
+
+    var Settings = null;
+
+
+    function FontSettings(_settings) {
+        Settings = _settings;
+        $(Settings).on("change:lineHeight", FontSettings.updateLineHeight);
+        $(Settings).on("change:fontSize", FontSettings.updateFontSize);
+        $(Settings).on("change:fontType", FontSettings.updateFontType);
+        FontSettings.update();
+    }
+
+
+    FontSettings.updateLineHeight = function () {
+        clearFonts();
+        var value = Settings.getValue("lineHeight");
+        $lineHeight.text(".CodeMirror{" + "line-height: " + value + "; }");
+    };
+
+
+    FontSettings.updateFontSize = function () {
+        clearFonts();
+        var value = Settings.getValue("fontSize");
+        $fontSize.text(".CodeMirror{" + "font-size: " + value + " !important; }");
+    };
+
+
+    FontSettings.updateFontType = function () {
+        clearFonts();
+        var value = Settings.getValue("fontType");
+        $fontType.text(".CodeMirror{" + "font-family: " + value + " !important; }");
+    };
+
+
+    FontSettings.update = function () {
+        clearFonts();
+        FontSettings.updateLineHeight();
+        FontSettings.updateFontSize();
+        FontSettings.updateFontType();
+    };
+
+
+    function clearFonts() {
+        // Remove this tag that is intefering with font settings set in this module
+        $("#codemirror-dynamic-fonts").remove();
+    }
+
+    return FontSettings;
+});

src/themes/LICENSE

@@ -0,0 +1,21 @@
+ Copyright (c) 2014 Miguel Castillo.
+
+ Licensed under MIT
+
+ Permission is hereby granted, free of charge, to any person obtaining a
+ copy of this software and associated documentation files (the "Software"),
+ to deal in the Software without restriction, including without limitation
+ the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ and/or sell copies of the Software, and to permit persons to whom the
+ Software is furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in
+ all copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
+ DEALINGS IN THE SOFTWARE.

src/themes/MenuCommands.js

@@ -0,0 +1,19 @@
+/**
+ * Brackets Themes Copyright (c) 2014 Miguel Castillo.
+ *
+ * Licensed under MIT
+ */
+
+
+/*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
+/*global $, define, require */
+
+define(function(require) {
+    "use strict";
+    var Commands       = require("command/Commands"),
+        CommandManager = require("command/CommandManager"),
+        Strings        = require("strings"),
+        Settings       = require("themes/Settings");
+
+    CommandManager.register(Strings.CMD_THEMES, Commands.THEMES, Settings.open);
+});