Merge pull request #8492 from MiguelCastillo/fonts

dangoor · dangoor · commit 93bea997a445 · 2014-07-22T11:19:18.000-04:00
Fonts api with Themes integrated
diff --git a/src/styles/brackets_codemirror_override.less b/src/styles/brackets_codemirror_override.less
@@ -75,6 +75,15 @@
     border-bottom: 2px solid #78B2F2;
 }
 
+/**
+ * These classes are set to inline-block because they are spans and they need block dimension properties when
+ * when calculation height and width.
+ */
+.CodeMirror-searching,
+.CodeMirror-matchingtag,
+.CodeMirror-matchingbracket {
+    display: inline-block;
+}
 
 span.cm-keyword {color: @accent-keyword;}
 span.cm-atom {color: @accent-atom;}
diff --git a/src/themes/FontCommandsManager.js b/src/themes/FontCommandsManager.js
diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
@@ -27,9 +27,6 @@
 define(function (require, exports, module) {
     "use strict";
 
-    // FontsCommandsManager will be going away soon when we add font size management in Brackets.
-    require("themes/FontCommandsManager");
-
     var _                  = require("thirdparty/lodash"),
         FileSystem         = require("filesystem/FileSystem"),
         FileUtils          = require("file/FileUtils"),
@@ -345,21 +342,6 @@ define(function (require, exports, module) {
         ThemeView.updateScrollbars(getCurrentTheme());
     });
 
-    prefs.on("change", "fontSize", function () {
-        refresh();
-        ThemeView.updateFontSize();
-    });
-
-    prefs.on("change", "lineHeight", function () {
-        refresh();
-        ThemeView.updateLineHeight();
-    });
-
-    prefs.on("change", "fontFamily", function () {
-        refresh();
-        ThemeView.updateFontFamily();
-    });
-
     // Monitor file changes.  If the file that has changed is actually the currently loaded
     // theme, then we just reload the theme.  This allows to live edit the theme
     FileSystem.on("change", function (evt, file) {
@@ -377,9 +359,6 @@ define(function (require, exports, module) {
     });
 
 
-    ThemeView.updateFonts();
-    ThemeView.updateScrollbars();
-
     exports.refresh         = refresh;
     exports.loadFile        = loadFile;
     exports.loadPackage     = loadPackage;
diff --git a/src/view/ThemeSettings.js b/src/view/ThemeSettings.js
@@ -27,12 +27,13 @@
 define(function (require, exports, module) {
     "use strict";
 
-    var _                  = require("thirdparty/lodash"),
-        Dialogs            = require("widgets/Dialogs"),
-        Strings            = require("strings"),
-        PreferencesManager = require("preferences/PreferencesManager"),
-        settingsTemplate   = require("text!htmlContent/themes-settings.html"),
-        prefs              = PreferencesManager.getExtensionPrefs("themes");
+    var _                   = require("thirdparty/lodash"),
+        Dialogs             = require("widgets/Dialogs"),
+        Strings             = require("strings"),
+        ViewCommandHandlers = require("view/ViewCommandHandlers"),
+        settingsTemplate    = require("text!htmlContent/themes-settings.html"),
+        PreferencesManager  = require("preferences/PreferencesManager"),
+        prefs               = PreferencesManager.getExtensionPrefs("themes");
 
     /**
      * @type {Object}
@@ -44,9 +45,6 @@ define(function (require, exports, module) {
      * Object with all default values that can be configure via the settings UI
      */
     var defaults = {
-        "fontSize": 12,
-        "lineHeight": 1.25,
-        "fontFamily": "'SourceCodePro-Medium', ＭＳ ゴシック, 'MS Gothic', monospace",
         "customScrollbars": true,
         "theme": "thor-light-theme"
     };
@@ -64,9 +62,16 @@ define(function (require, exports, module) {
      * @return {Object} a collection with all the settings
      */
     function getValues() {
-        return _.transform(defaults, function (result, value, key) {
+        var result = {};
+
+        Object.keys(defaults).forEach(function (key) {
             result[key] = prefs.get(key);
         });
+
+        result.fontFamily = ViewCommandHandlers.getFontFamily();
+        result.fontSize   = ViewCommandHandlers.getFontSize();
+        result.lineHeight = ViewCommandHandlers.getLineHeight();
+        return result;
     }
 
     /**
@@ -109,9 +114,21 @@ define(function (require, exports, module) {
             });
 
         Dialogs.showModalDialogUsingTemplate($template).done(function (id) {
+            var setterFn;
+
             if (id === "save") {
+                // Go through each new setting and apply it
                 Object.keys(newSettings).forEach(function (setting) {
-                    prefs.set(setting, newSettings[setting]);
+                    if (defaults.hasOwnProperty(setting)) {
+                        prefs.set(setting, newSettings[setting]);
+                    } else {
+                        // Figure out if the setting is in the ViewCommandHandlers, which means it is
+                        // a font setting
+                        setterFn = "set" + setting[0].toLocaleUpperCase() + setting.substr(1);
+                        if (typeof ViewCommandHandlers[setterFn] === 'function') {
+                            ViewCommandHandlers[setterFn](newSettings[setting]);
+                        }
+                    }
                 });
             } else if (id === "cancel") {
                 // Make sure we revert any changes to theme selection
@@ -133,21 +150,13 @@ define(function (require, exports, module) {
      */
     function restore() {
         prefs.set("theme", defaults.theme);
-        prefs.set("fontSize", defaults.fontSize + "px");
-        prefs.set("lineHeight", defaults.lineHeight);
-        prefs.set("fontFamily", defaults.fontFamily);
         prefs.set("customScrollbars", defaults.customScrollbars);
     }
 
-
     prefs.definePreference("theme", "string", defaults.theme);
-    prefs.definePreference("fontSize", "string", defaults.fontSize + "px");
-    prefs.definePreference("lineHeight", "number", defaults.lineHeight);
-    prefs.definePreference("fontFamily", "string", defaults.fontFamily);
     prefs.definePreference("customScrollbars", "boolean", defaults.customScrollbars);
 
     exports._setThemes = setThemes;
-    exports._defaults  = defaults;
     exports.restore    = restore;
     exports.showDialog = showDialog;
 });
diff --git a/src/view/ThemeView.js b/src/view/ThemeView.js
@@ -34,48 +34,7 @@ define(function (require, exports, module) {
         PreferencesManager = require("preferences/PreferencesManager"),
         prefs              = PreferencesManager.getExtensionPrefs("themes");
 
-
-    var templates = {
-        $lineHeight: $("<style type='text/css' id='lineHeight'>").appendTo("head"),
-        $fontSize: $("<style type='text/css' id='fontSize'>").appendTo("head"),
-        $fontFamily: $("<style type='text/css' id='fontFamily'>").appendTo("head"),
-        $scrollbars: $("<style id='scrollbars'>").appendTo("head")
-    };
-
-
-    function clearFonts() {
-        // Remove this tag that is intefering with font settings set in this module
-        $("#codemirror-dynamic-fonts").remove();
-    }
-
-
-    function updateLineHeight() {
-        clearFonts();
-        var value = prefs.get("lineHeight");
-        templates.$lineHeight.text(".CodeMirror-lines{" + "line-height: " + value + "; }");
-    }
-
-
-    function updateFontSize() {
-        clearFonts();
-        var value = prefs.get("fontSize");
-        templates.$fontSize.text(".CodeMirror{" + "font-size: " + value + " !important; }");
-    }
-
-
-    function updateFontFamily() {
-        clearFonts();
-        var value = prefs.get("fontFamily");
-        templates.$fontFamily.text(".CodeMirror{" + "font-family: " + value + " !important; }");
-    }
-
-
-    function updateFonts() {
-        clearFonts();
-        updateLineHeight();
-        updateFontSize();
-        updateFontFamily();
-    }
+    var $scrollbars = $("<style id='scrollbars'>").appendTo("head");
 
 
     /**
@@ -88,9 +47,9 @@ define(function (require, exports, module) {
         theme = theme || {};
         if (prefs.get("customScrollbars")) {
             var scrollbar = (theme.scrollbar || []).join(" ");
-            templates.$scrollbars.text(scrollbar || "");
+            $scrollbars.text(scrollbar || "");
         } else {
-            templates.$scrollbars.text("");
+            $scrollbars.text("");
         }
     }
 
@@ -130,10 +89,6 @@ define(function (require, exports, module) {
     }
 
 
-    exports.updateFonts      = updateFonts;
-    exports.updateLineHeight = updateLineHeight;
-    exports.updateFontSize   = updateFontSize;
-    exports.updateFontFamily = updateFontFamily;
     exports.updateScrollbars = updateScrollbars;
     exports.updateThemes     = updateThemes;
     exports.setDocumentMode  = setDocumentMode;
diff --git a/src/view/ViewCommandHandlers.js b/src/view/ViewCommandHandlers.js
