From ef32189e9b44ff263ecf48f0ccae29f5fe720b72 Mon Sep 17 00:00:00 2001
From: Peter Flynn <pflynn@adobe.com>
Date: Sat, 30 Aug 2014 00:19:46 -0700
Subject: [PATCH 01/11] Simple help string in Themes dialog referring user to
 Extension Manager. Not clickable yet, since the workflows get a little tricky
 (does it appear over top of Themes dialog? does dropdown update when you come
 back? what if Extension Manager triggers a restart? etc.)

---
 src/htmlContent/themes-settings.html       | 1 +
 src/nls/root/strings.js                    | 1 +
 src/styles/brackets_patterns_override.less | 4 ++++
 3 files changed, 6 insertions(+)

diff --git a/src/htmlContent/themes-settings.html b/src/htmlContent/themes-settings.html
index 299763fff98..a37c4f669b0 100644
--- a/src/htmlContent/themes-settings.html
+++ b/src/htmlContent/themes-settings.html
@@ -12,6 +12,7 @@ <h1 class="dialog-title">{{Strings.THEMES_SETTINGS}}</h1>
                         <option style="text-align:left;" value="{{name}}" data-target="theme">{{displayName}}</option>
                         {{/themes}}
                     </select>
+                    <p class="note-below-controls">{{Strings.GET_MORE_THEMES}}</p>
                 </div>
             </div>
 
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js
index 487a523ed58..06e42c12744 100644
--- a/src/nls/root/strings.js
+++ b/src/nls/root/strings.js
@@ -424,6 +424,7 @@ define({
     
     // Strings for themes-settings.html and themes-general.html
     "CURRENT_THEME"                        : "Current Theme",
+    "GET_MORE_THEMES"                      : "To get more themes, use Extension Manager.",
     "USE_THEME_SCROLLBARS"                 : "Use Theme Scrollbars",
     "FONT_SIZE"                            : "Font Size",
     "FONT_FAMILY"                          : "Font Family",
diff --git a/src/styles/brackets_patterns_override.less b/src/styles/brackets_patterns_override.less
index 48c821106b8..bc3bfa271d5 100644
--- a/src/styles/brackets_patterns_override.less
+++ b/src/styles/brackets_patterns_override.less
@@ -1928,5 +1928,9 @@ code {
         input[type='checkbox'] {
              margin-top: 8px;
         }
+        
+        .note-below-controls {
+            margin: 4px 0 -6px 0;
+        }
      }
  }

From 5e0c18f3c1025e9f7a3862854518745772571f66 Mon Sep 17 00:00:00 2001
From: Peter Flynn <pflynn@adobe.com>
Date: Thu, 11 Sep 2014 13:28:56 -0700
Subject: [PATCH 02/11] More tweaks for Themes usability: * Show message in
 Extension Manager about how to switch themes * Link <label>s in Themes dialog
 to their corresponding controls * Eliminate big blank space at bottom of
 Themes dialog

---
 src/extensibility/ExtensionManagerViewModel.js |  1 +
 src/htmlContent/extension-manager-dialog.html  |  1 -
 src/htmlContent/themes-settings.html           | 18 +++++++++---------
 src/nls/root/strings.js                        |  2 +-
 src/styles/brackets.less                       |  5 -----
 src/styles/brackets_patterns_override.less     |  3 ++-
 6 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/src/extensibility/ExtensionManagerViewModel.js b/src/extensibility/ExtensionManagerViewModel.js
index 107fc29642e..c63763dfb71 100644
--- a/src/extensibility/ExtensionManagerViewModel.js
+++ b/src/extensibility/ExtensionManagerViewModel.js
@@ -514,6 +514,7 @@ define(function (require, exports, module) {
      */
     function ThemesViewModel() {
         ExtensionManagerViewModel.call(this);
+        this.infoMessage = Strings.REGISTRY_THEMES_INFO;
     }
 
     // Inheritance setup
diff --git a/src/htmlContent/extension-manager-dialog.html b/src/htmlContent/extension-manager-dialog.html
index c7528a73a7a..06ea1b7337b 100644
--- a/src/htmlContent/extension-manager-dialog.html
+++ b/src/htmlContent/extension-manager-dialog.html
@@ -4,7 +4,6 @@
             {{#showRegistry}}
                 <li><a href="#registry" class="registry" data-toggle="tab"><img src="styles/images/extension-manager-registry.svg"/><br/>{{Strings.EXTENSIONS_AVAILABLE_TITLE}}</a></li>
                 <li><a href="#themes" class="themes" data-toggle="tab"><img src="styles/images/themes-icon.svg"/><br/>{{Strings.EXTENSIONS_THEMES_TITLE}}</a></li>
-                <!--<li><a href="#updates" class="updates" data-toggle="tab"><img src="styles/images/extension-manager-updates.svg"/><br/>{{Strings.EXTENSIONS_UPDATES_TITLE}}</a></li>-->
             {{/showRegistry}}
             <li><a href="#installed" class="installed" data-toggle="tab"><span class="notification"></span><img src="styles/images/extension-manager-installed.svg"/><br/>{{Strings.EXTENSIONS_INSTALLED_TITLE}}</a></li>
         </ul>
diff --git a/src/htmlContent/themes-settings.html b/src/htmlContent/themes-settings.html
index a37c4f669b0..eba8d973f6a 100644
--- a/src/htmlContent/themes-settings.html
+++ b/src/htmlContent/themes-settings.html
@@ -5,9 +5,9 @@ <h1 class="dialog-title">{{Strings.THEMES_SETTINGS}}</h1>
     <div class="modal-body">
         <form class="form-horizontal">
             <div class="control-group">
-                <label class="control-label">{{Strings.CURRENT_THEME}}:</label>
+                <label class="control-label" for="themes-theme-dropdown">{{Strings.CURRENT_THEME}}:</label>
                 <div class="controls">
-                    <select>
+                    <select id="themes-theme-dropdown">
                         {{#themes}}
                         <option style="text-align:left;" value="{{name}}" data-target="theme">{{displayName}}</option>
                         {{/themes}}
@@ -17,28 +17,28 @@ <h1 class="dialog-title">{{Strings.THEMES_SETTINGS}}</h1>
             </div>
 
             <div class="control-group">
-                <label class="control-label">{{Strings.USE_THEME_SCROLLBARS}}:</label>
+                <label class="control-label" for="themes-chk-themeScrollbars">{{Strings.USE_THEME_SCROLLBARS}}:</label>
                 <div class="controls">
                     {{#settings.themeScrollbars}}
-                        <input type="checkbox" data-target="themeScrollbars" checked>
+                        <input type="checkbox" id="themes-chk-themeScrollbars" data-target="themeScrollbars" checked>
                     {{/settings.themeScrollbars}}
                     {{^settings.themeScrollbars}}
-                        <input type="checkbox" data-target="themeScrollbars">
+                        <input type="checkbox" id="themes-chk-themeScrollbars" data-target="themeScrollbars">
                     {{/settings.themeScrollbars}}
                 </div>
             </div>
 
             <div class="control-group">
-                <label class="control-label">{{Strings.FONT_SIZE}}:</label>
+                <label class="control-label" for="themes-input-fontSize">{{Strings.FONT_SIZE}}:</label>
                 <div class="controls">
-                    <input type="text" data-target="fontSize" value="{{settings.fontSize}}">
+                    <input type="text" id="themes-input-fontSize" data-target="fontSize" value="{{settings.fontSize}}">
                 </div>
             </div>
 
             <div class="control-group">
-                <label class="control-label">{{Strings.FONT_FAMILY}}:</label>
+                <label class="control-label" for="themes-input-fontFamily">{{Strings.FONT_FAMILY}}:</label>
                 <div class="controls">
-                    <input type="text" data-target="fontFamily" value="{{settings.fontFamily}}">
+                    <input type="text" id="themes-input-fontFamily" data-target="fontFamily" value="{{settings.fontFamily}}">
                 </div>
             </div>
         </form>
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js
index 06e42c12744..04787e7eda4 100644
--- a/src/nls/root/strings.js
+++ b/src/nls/root/strings.js
@@ -519,10 +519,10 @@ define({
     "NO_EXTENSIONS"                        : "No extensions installed yet.<br>Click on the Available tab above to get started.",
     "NO_EXTENSION_MATCHES"                 : "No extensions match your search.",
     "REGISTRY_SANITY_CHECK_WARNING"        : "NOTE: These extensions may come from different authors than {APP_NAME} itself. Extensions are not reviewed and have full local privileges. Be cautious when installing extensions from an unknown source.",
+    "REGISTRY_THEMES_INFO"                 : "To switch between installed themes, use View > Themes\u2026",
     "EXTENSIONS_INSTALLED_TITLE"           : "Installed",
     "EXTENSIONS_AVAILABLE_TITLE"           : "Available",
     "EXTENSIONS_THEMES_TITLE"              : "Themes",
-    "EXTENSIONS_UPDATES_TITLE"             : "Updates",
     
     "INLINE_EDITOR_NO_MATCHES"             : "No matches available.",
     "CSS_QUICK_EDIT_NO_MATCHES"            : "There are no existing CSS rules that match your selection.<br> Click \"New Rule\" to create one.",
diff --git a/src/styles/brackets.less b/src/styles/brackets.less
index a1c2e99a398..467bdf32ba1 100644
--- a/src/styles/brackets.less
+++ b/src/styles/brackets.less
@@ -2013,11 +2013,6 @@ label input {
     padding: 2px;
 }
 
-.theme-settings .modal-body {
-    min-height: 300px;
-    max-height: 300px;
-}
-
 .theme-settings .label {
     padding: 4px !important;
 }
diff --git a/src/styles/brackets_patterns_override.less b/src/styles/brackets_patterns_override.less
index bc3bfa271d5..74c9e757daf 100644
--- a/src/styles/brackets_patterns_override.less
+++ b/src/styles/brackets_patterns_override.less
@@ -1930,7 +1930,8 @@ code {
         }
         
         .note-below-controls {
-            margin: 4px 0 -6px 0;
+            margin: 4px 0 -3px 0;
+            color: @bc-text-thin-quiet;
         }
      }
  }

From 320fb35edf4af1ac4bfa90f40f45c53c471ed23e Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 12:07:51 -0400
Subject: [PATCH 03/11] Adding ability to apply a theme when its installed from
 the registry

---
 src/extensibility/ExtensionManager.js |  24 +---
 src/extensibility/Package.js          |  12 +-
 src/utils/ExtensionLoader.js          |   7 +-
 src/view/ThemeManager.js              | 154 ++++++++++++++++----------
 4 files changed, 111 insertions(+), 86 deletions(-)

diff --git a/src/extensibility/ExtensionManager.js b/src/extensibility/ExtensionManager.js
index 319b50e118e..1588879c7be 100644
--- a/src/extensibility/ExtensionManager.js
+++ b/src/extensibility/ExtensionManager.js
@@ -142,23 +142,6 @@ 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
-     *
-     * @param {string} id of the theme extension to load
-     */
-    function loadTheme(id) {
-        var extension = extensions[id];
-        if (extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme) {
-            ThemeManager.loadPackage(extension.installInfo);
-        }
-    }
-
-
     /**
      * @private
      * Sets our data. For unit testing only.
@@ -227,8 +210,10 @@ define(function (require, exports, module) {
      * When an extension is loaded, fetches the package.json and stores the extension in our map.
      * @param {$.Event} e The event object
      * @param {string} path The local path of the loaded extension's folder.
+     * @param {Package.OperationTypes} operationType Tells if the package is being installed or updated
+     * @param {boolean} newInstall Flag to tell if the entension being loaded is a new install
      */
-    function _handleExtensionLoad(e, path) {
+    function _handleExtensionLoad(e, path, operationType) {
         function setData(id, metadata) {
             var locationType,
                 userExtensionPath = ExtensionLoader.getUserExtensionPath();
@@ -257,8 +242,7 @@ define(function (require, exports, module) {
                 status: (e.type === "loadFailed" ? START_FAILED : ENABLED)
             };
             synchronizeEntry(id);
-            loadTheme(id);
-            $(exports).triggerHandler("statusChange", [id]);
+            $(exports).triggerHandler("statusChange", [id, operationType]);
         }
 
         ExtensionUtils.loadPackageJson(path)
diff --git a/src/extensibility/Package.js b/src/extensibility/Package.js
index 6cee87b062c..03aecc82c23 100644
--- a/src/extensibility/Package.js
+++ b/src/extensibility/Package.js
@@ -58,6 +58,11 @@ define(function (require, exports, module) {
         NEEDS_UPDATE: "NEEDS_UPDATE",
         DISABLED: "DISABLED"
     };
+    
+    var OperationTypes = {
+        INSTALL: "install",
+        UPDATE: "update"
+    };
 
     /**
      * @private
@@ -151,8 +156,8 @@ define(function (require, exports, module) {
                 destinationDirectory    = ExtensionLoader.getUserExtensionPath(),
                 disabledDirectory       = destinationDirectory.replace(/\/user$/, "/disabled"),
                 systemDirectory         = FileUtils.getNativeBracketsDirectoryPath() + "/extensions/default/";
-            
-            var operation = _doUpdate ? "update" : "install";
+
+            var operation = _doUpdate ? OperationTypes.UPDATE : OperationTypes.INSTALL;
             extensionManager[operation](path, destinationDirectory, {
                 disabledDirectory: disabledDirectory,
                 systemExtensionDirectory: systemDirectory,
@@ -171,7 +176,7 @@ define(function (require, exports, module) {
                             // On Windows, it looks like Node converts Unix-y paths to backslashy paths.
                             // We need to convert them back.
                             baseUrl: FileUtils.convertWindowsPathToUnixPath(result.installedTo)
-                        }, "main").then(function () {
+                        }, "main", operation).then(function () {
                             d.resolve(result);
                         }, function () {
                             d.reject(Errors.ERROR_LOADING);
@@ -506,4 +511,5 @@ define(function (require, exports, module) {
     exports.installUpdate = installUpdate;
     exports.formatError = formatError;
     exports.InstallationStatuses = InstallationStatuses;
+    exports.OperationTypes = OperationTypes;
 });
diff --git a/src/utils/ExtensionLoader.js b/src/utils/ExtensionLoader.js
index 654af078a0b..4d46ea55e4f 100644
--- a/src/utils/ExtensionLoader.js
+++ b/src/utils/ExtensionLoader.js
@@ -227,11 +227,12 @@ define(function (require, exports, module) {
      * @param {!string} name, used to identify the extension
      * @param {!{baseUrl: string}} config object with baseUrl property containing absolute path of extension
      * @param {!string} entryPoint, name of the main js file to load
+     * @param {Package.OperationTypes} operationType Tells if the package is being installed or updated
      * @return {!$.Promise} A promise object that is resolved when the extension is loaded, or rejected
      *              if the extension fails to load or throws an exception immediately when loaded.
      *              (Note: if extension contains a JS syntax error, promise is resolved not rejected).
      */
-    function loadExtension(name, config, entryPoint) {
+    function loadExtension(name, config, entryPoint, operationType) {
         var promise = new $.Deferred();
 
         // Try to load the package.json to figure out if we are loading a theme.
@@ -247,9 +248,9 @@ define(function (require, exports, module) {
                 return loadExtensionModule(name, config, entryPoint);
             })
             .then(function () {
-                $(exports).triggerHandler("load", config.baseUrl);
+                $(exports).triggerHandler("load", [config.baseUrl, operationType]);
             }, function (err) {
-                $(exports).triggerHandler("loadFailed", config.baseUrl);
+                $(exports).triggerHandler("loadFailed", [config.baseUrl, operationType]);
             });
     }
 
diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index 902173dcf67..183fccaa877 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -35,6 +35,8 @@ define(function (require, exports, module) {
         ThemeSettings      = require("view/ThemeSettings"),
         ThemeView          = require("view/ThemeView"),
         AppInit            = require("utils/AppInit"),
+        ExtensionManager   = require("extensibility/ExtensionManager"),
+        Package            = require("extensibility/Package"),
         PreferencesManager = require("preferences/PreferencesManager"),
         prefs              = PreferencesManager.getExtensionPrefs("themes");
 
@@ -207,31 +209,6 @@ define(function (require, exports, module) {
     }
 
 
-    /**
-     * Get current theme object that is loaded in the editor.
-     *
-     * @return {Theme} the current theme instance
-     */
-    function getCurrentTheme() {
-        if (!currentTheme) {
-            currentTheme = loadedThemes[prefs.get("theme")] || loadedThemes[defaultTheme];
-        }
-
-        return currentTheme;
-    }
-
-
-    /**
-     * Gets all available themes
-     * @return {Array.<Theme>} collection of all available themes
-     */
-    function getAllThemes() {
-        return _.map(loadedThemes, function (theme) {
-            return theme;
-        });
-    }
-
-
     /**
      * @private
      * Process and load the current theme into the editor
@@ -240,21 +217,19 @@ define(function (require, exports, module) {
      *    corresponding new css/less and scrollbar information
      */
     function loadCurrentTheme() {
-        var theme = getCurrentTheme();
-
-        var pending = theme && FileUtils.readAsText(theme.file)
+        var pending = currentTheme && FileUtils.readAsText(currentTheme.file)
             .then(function (lessContent) {
-                return lessifyTheme(lessContent.replace(commentRegex, ""), theme);
+                return lessifyTheme(lessContent.replace(commentRegex, ""), currentTheme);
             })
             .then(function (content) {
                 var result = extractScrollbars(content);
-                theme.scrollbar = result.scrollbar;
+                currentTheme.scrollbar = result.scrollbar;
                 return result.content;
             })
             .then(function (cssContent) {
-                $("body").toggleClass("dark", theme.dark);
+                $("body").toggleClass("dark", currentTheme.dark);
                 styleNode.text(cssContent);
-                return theme;
+                return currentTheme;
             });
 
         return $.when(pending);
@@ -262,29 +237,88 @@ define(function (require, exports, module) {
 
 
     /**
-     * Refresh current theme in the editor
+     * Refresh current theme in the editor.  It handle two type of refresh, soft and hard refresh.
+     * - A soft refresh simply causes the editor to reload the current theme.
+     * - A hard refresh will cause the theme file to be reloaded from disk and reprocessed.
      *
-     * @param {boolean} force Forces a reload the current theme.  It reload the theme file.
+     * @param {boolean} force To trigger a soft or hard refresh
+     * @return {$.Promise} Which resolves when refresh is done, or rejected if refreshing fails.
      */
     function refresh(force) {
-        if (force) {
-            currentTheme = null;
-        }
-
-        $.when(force && loadCurrentTheme()).done(function () {
+        return $.when(force && loadCurrentTheme()).done(function () {
             var editor = EditorManager.getActiveEditor();
             if (!editor || !editor._codeMirror) {
                 return;
             }
 
-            var cm = editor._codeMirror;
-            ThemeView.updateThemes(cm);
+            ThemeView.updateThemes(editor._codeMirror);
         });
     }
 
 
     /**
-     * Loads a theme from a file.
+     * Get current theme object that is loaded in the editor.
+     *
+     * @return {Theme} the current theme instance
+     */
+    function getCurrentTheme() {
+        return currentTheme;
+    }
+
+
+    /**
+     * Sets the theme with the given name as the current theme.  Only themes that
+     * have been loaded in the ThemeManager can be set as current themes.  If the
+     * theme to be set as current is already set, then a soft refresh is done and
+     * no updates will occur.
+     *
+     * @param {string} themeName is the name of the theme to be set as current.
+     */
+    function setCurrentTheme(themeName) {
+        // Only themes that have been loaded can be set as current themes
+        if (!loadedThemes.hasOwnProperty(themeName)) {
+            return;
+        }
+
+        if (prefs.get("theme") !== themeName) {
+            prefs.set("theme", themeName);
+        }
+
+        // If the theme to be set as current is already current, then we don't have anymore
+        // work to do here...  We do a courtesy soft refresh
+        if (currentTheme && currentTheme.name === themeName) {
+            refresh(); // Do soft refresh
+            return;
+        }
+
+        // Save off the current theme
+        currentTheme = loadedThemes[themeName] || loadedThemes[defaultTheme];
+
+        // Refresh editor with the new theme
+        refresh(true).done(function () {
+            // Process the scrollbars for the editor
+            ThemeView.updateScrollbars(currentTheme);
+        });
+
+        // Expose event for theme changes
+        $(exports).trigger("themeChange", currentTheme);
+    }
+
+
+    /**
+     * Gets all available themes that have been loaded in the ThemeManager.
+     *
+     * @return {Array.<Theme>} collection of all available themes
+     */
+    function getAllThemes() {
+        return _.map(loadedThemes, function (theme) {
+            return theme;
+        });
+    }
+
+
+    /**
+     * Loads a theme from a file and makes the theme available in the ThemeManager for used.
      *
      * @param {string} fileName is the full path to the file to be opened
      * @param {Object} options is an optional parameter to specify metadata
@@ -294,19 +328,18 @@ define(function (require, exports, module) {
     function loadFile(fileName, options) {
         var deferred         = new $.Deferred(),
             file             = FileSystem.getFileForPath(fileName),
+            theme            = new Theme(file, options),
             currentThemeName = prefs.get("theme");
 
         file.exists(function (err, exists) {
-            var theme;
-
             if (exists) {
-                theme = new Theme(file, options);
                 loadedThemes[theme.name] = theme;
                 ThemeSettings._setThemes(loadedThemes);
 
                 // For themes that are loaded after ThemeManager has been loaded,
                 // we should check if it's the current theme.  If it is, then we just
                 // load it.
+
                 if (currentThemeName === theme.name) {
                     refresh(true);
                 }
@@ -322,7 +355,7 @@ define(function (require, exports, module) {
 
 
     /**
-     * Loads a theme from an extension package.
+     * Loads a theme from an extension package and makes the theme available in the ThemeManager for use.
      *
      * @param {Object} themePackage is a package from the extension manager for the theme to be loaded.
      * @return {$.Promise} promise object resolved with the theme to be loaded from the pacakge
@@ -334,24 +367,12 @@ define(function (require, exports, module) {
 
 
     prefs.on("change", "theme", function () {
-        // Make sure we don't reprocess a theme that's already loaded
-        if (currentTheme && currentTheme.name === prefs.get("theme")) {
-            return;
-        }
-
-        // Refresh editor with the new theme
-        refresh(true);
-
-        // Process the scrollbars for the editor
-        ThemeView.updateScrollbars(getCurrentTheme());
-
-        // Expose event for theme changes
-        $(exports).trigger("themeChange", getCurrentTheme());
+        setCurrentTheme(prefs.get("theme"));
     });
 
     prefs.on("change", "themeScrollbars", function () {
         refresh();
-        ThemeView.updateScrollbars(getCurrentTheme());
+        ThemeView.updateScrollbars(currentTheme);
     });
 
     // Monitor file changes.  If the file that has changed is actually the currently loaded
@@ -371,10 +392,23 @@ define(function (require, exports, module) {
     });
 
 
+    $(ExtensionManager).on("statusChange", function (evt, id, operationType) {
+        var extension = ExtensionManager.extensions[id];
+        if (extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme) {
+            loadPackage(extension.installInfo).done(function (theme) {
+                if (operationType === Package.OperationTypes.INSTALL || operationType === Package.OperationTypes.UPDATE) {
+                    setCurrentTheme(theme.name);
+                }
+            });
+        }
+    });
+
+    
     exports.refresh         = refresh;
     exports.loadFile        = loadFile;
     exports.loadPackage     = loadPackage;
     exports.getCurrentTheme = getCurrentTheme;
+    exports.setCurrentTheme = setCurrentTheme;
     exports.getAllThemes    = getAllThemes;
 
     // Exposed for testing purposes

From 719090dac8703b6584ed011fb5dbfd004fd1c884 Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 15:23:20 -0400
Subject: [PATCH 04/11] Make settings in themes dialog live preview

---
 src/view/ThemeSettings.js | 58 +++++++++++++++++++++++++--------------
 1 file changed, 37 insertions(+), 21 deletions(-)

diff --git a/src/view/ThemeSettings.js b/src/view/ThemeSettings.js
index 9e7516d640f..80ce83c9db2 100644
--- a/src/view/ThemeSettings.js
+++ b/src/view/ThemeSettings.js
@@ -73,6 +73,26 @@ define(function (require, exports, module) {
         return result;
     }
 
+    /**
+     * @private
+     * Applies setting's value to the correct place.  Either as a preference or in the ViewCommandHandler.
+     * Settings that go in the ViewCommandHandler as only for font settings at this point.
+     */
+    function applySetting(setting, value) {
+        var setterFn;
+
+        if (defaults.hasOwnProperty(setting)) {
+            prefs.set(setting, value);
+        } 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](value);
+            }
+        }
+    }
+
     /**
      * Opens the settings dialog
      */
@@ -100,46 +120,42 @@ define(function (require, exports, module) {
             .on("change", "[data-target]:checkbox", function () {
                 var $target = $(this);
                 var attr = $target.attr("data-target");
-                newSettings[attr] = $target.is(":checked");
+
+                if (attr) {
+                    newSettings[attr] = $target.is(":checked");
+                    applySetting(attr, newSettings[attr]);
+                }
             })
-            .on("input", "[data-target]:text", function () {
+            .on("input", "[data-target]:text", _.debounce(function () {
                 var $target = $(this);
                 var attr = $target.attr("data-target");
-                newSettings[attr] = $target.val();
-            })
+
+                if (attr) {
+                    newSettings[attr] = $target.val();
+                    applySetting(attr, newSettings[attr]);
+                }
+            }, 500))
             .on("change", function () {
                 var $target = $(":selected", this);
                 var attr = $target.attr("data-target");
 
                 if (attr) {
-                    prefs.set(attr, $target.val());
+                    newSettings[attr] = $target.val();
+                    applySetting(attr, newSettings[attr]);
                 }
             });
 
         Dialogs.showModalDialogUsingTemplate($template).done(function (id) {
-            var setterFn;
-
-            if (id === "save") {
+            if (id === "cancel") {
                 // Go through each new setting and apply it
                 Object.keys(newSettings).forEach(function (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]);
-                        }
-                    }
+                    applySetting(setting, currentSettings[setting]);
                 });
-            } else if (id === "cancel") {
-                // Make sure we revert any changes to theme selection
-                prefs.set("theme", currentSettings.theme);
             }
         });
     }
 
+
     /**
      * Interface to set the themes that are available to chose from in the setting dialog
      * @param {ThemeManager.Theme} themes is a collection of themes created by the ThemeManager

From 4f7686d19bc972295a16a05aee7214b39a4eb149 Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 16:00:22 -0400
Subject: [PATCH 05/11] Cleaned out the way theme settings was getting themes
 pushed to it by theme manager.  theme settings just reads all available
 themes directly from theme manager instead.

---
 src/view/ThemeManager.js  |  1 -
 src/view/ThemeSettings.js | 18 ++----------------
 2 files changed, 2 insertions(+), 17 deletions(-)

diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index 183fccaa877..d6ac0813ca3 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -334,7 +334,6 @@ define(function (require, exports, module) {
         file.exists(function (err, exists) {
             if (exists) {
                 loadedThemes[theme.name] = theme;
-                ThemeSettings._setThemes(loadedThemes);
 
                 // For themes that are loaded after ThemeManager has been loaded,
                 // we should check if it's the current theme.  If it is, then we just
diff --git a/src/view/ThemeSettings.js b/src/view/ThemeSettings.js
index 80ce83c9db2..3177b629324 100644
--- a/src/view/ThemeSettings.js
+++ b/src/view/ThemeSettings.js
@@ -31,15 +31,11 @@ define(function (require, exports, module) {
         Dialogs             = require("widgets/Dialogs"),
         Strings             = require("strings"),
         ViewCommandHandlers = require("view/ViewCommandHandlers"),
+        ThemeManager        = require("view/ThemeManager"),
         settingsTemplate    = require("text!htmlContent/themes-settings.html"),
         PreferencesManager  = require("preferences/PreferencesManager"),
         prefs               = PreferencesManager.getExtensionPrefs("themes");
 
-    /**
-     * @type {Object}
-     * Currently loaded themes that are available to choose from.
-     */
-    var loadedThemes = {};
 
     /**
      * Object with all default values that can be configure via the settings UI
@@ -99,9 +95,8 @@ define(function (require, exports, module) {
     function showDialog() {
         var currentSettings = getValues();
         var newSettings     = {};
-        var themes          = _.map(loadedThemes, function (theme) { return theme; });
         var template        = $("<div>").append($settings).html();
-        var $template       = $(Mustache.render(template, {"settings": currentSettings, "themes": themes, "Strings": Strings}));
+        var $template       = $(Mustache.render(template, {"settings": currentSettings, "themes": ThemeManager.getAllThemes(), "Strings": Strings}));
 
         // Select the correct theme.
         var $currentThemeOption = $template
@@ -156,14 +151,6 @@ define(function (require, exports, module) {
     }
 
 
-    /**
-     * Interface to set the themes that are available to chose from in the setting dialog
-     * @param {ThemeManager.Theme} themes is a collection of themes created by the ThemeManager
-     */
-    function setThemes(themes) {
-        loadedThemes = themes;
-    }
-
     /**
      * Restores themes to factory settings.
      */
@@ -175,7 +162,6 @@ define(function (require, exports, module) {
     prefs.definePreference("theme", "string", defaults.theme);
     prefs.definePreference("themeScrollbars", "boolean", defaults.themeScrollbars);
 
-    exports._setThemes = setThemes;
     exports.restore    = restore;
     exports.showDialog = showDialog;
 });

From 9f9aa7d63500e4f109af0d6049d17667ac68795d Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 16:27:13 -0400
Subject: [PATCH 06/11] Refactored handling of default theme when the current
 theme is removed

---
 src/view/ThemeManager.js  | 21 +++++++++++----------
 src/view/ThemeSettings.js | 35 ++++++++++++++++-------------------
 2 files changed, 27 insertions(+), 29 deletions(-)

diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index d6ac0813ca3..0eecf885515 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -43,7 +43,7 @@ define(function (require, exports, module) {
     var loadedThemes    = {},
         currentTheme    = null,
         styleNode       = $(ExtensionUtils.addEmbeddedStyleSheet("")),
-        defaultTheme    = "thor-light-theme",
+        defaultTheme    = "light-theme",
         commentRegex    = /\/\*([\s\S]*?)\*\//mg,
         scrollbarsRegex = /((?:[^}|,]*)::-webkit-scrollbar(?:[^{]*)[{](?:[^}]*?)[}])/mgi,
         stylesPath      = FileUtils.getNativeBracketsDirectoryPath() + "/styles/",
@@ -262,7 +262,7 @@ define(function (require, exports, module) {
      * @return {Theme} the current theme instance
      */
     function getCurrentTheme() {
-        return currentTheme;
+        return (currentTheme && loadedThemes[currentTheme.name]) || loadedThemes[defaultTheme];
     }
 
 
@@ -292,7 +292,7 @@ define(function (require, exports, module) {
         }
 
         // Save off the current theme
-        currentTheme = loadedThemes[themeName] || loadedThemes[defaultTheme];
+        currentTheme = loadedThemes[themeName];
 
         // Refresh editor with the new theme
         refresh(true).done(function () {
@@ -371,7 +371,7 @@ define(function (require, exports, module) {
 
     prefs.on("change", "themeScrollbars", function () {
         refresh();
-        ThemeView.updateScrollbars(currentTheme);
+        ThemeView.updateScrollbars(getCurrentTheme());
     });
 
     // Monitor file changes.  If the file that has changed is actually the currently loaded
@@ -403,12 +403,13 @@ define(function (require, exports, module) {
     });
 
     
-    exports.refresh         = refresh;
-    exports.loadFile        = loadFile;
-    exports.loadPackage     = loadPackage;
-    exports.getCurrentTheme = getCurrentTheme;
-    exports.setCurrentTheme = setCurrentTheme;
-    exports.getAllThemes    = getAllThemes;
+    exports.refresh          = refresh;
+    exports.loadFile         = loadFile;
+    exports.loadPackage      = loadPackage;
+    exports.getCurrentTheme  = getCurrentTheme;
+    exports.setCurrentTheme  = setCurrentTheme;
+    exports.getAllThemes     = getAllThemes;
+    exports.defaultThemeName = defaultTheme;
 
     // Exposed for testing purposes
     exports._toDisplayName     = toDisplayName;
diff --git a/src/view/ThemeSettings.js b/src/view/ThemeSettings.js
index 3177b629324..f79791040d5 100644
--- a/src/view/ThemeSettings.js
+++ b/src/view/ThemeSettings.js
@@ -42,7 +42,7 @@ define(function (require, exports, module) {
      */
     var defaults = {
         "themeScrollbars": true,
-        "theme": "light-theme"
+        "theme": ThemeManager.defaultThemeName
     };
 
 
@@ -57,7 +57,7 @@ define(function (require, exports, module) {
      *
      * @return {Object} a collection with all the settings
      */
-    function getValues() {
+    function getCurrentSettings() {
         var result = {};
 
         Object.keys(defaults).forEach(function (key) {
@@ -74,7 +74,7 @@ define(function (require, exports, module) {
      * Applies setting's value to the correct place.  Either as a preference or in the ViewCommandHandler.
      * Settings that go in the ViewCommandHandler as only for font settings at this point.
      */
-    function applySetting(setting, value) {
+    function setSetting(setting, value) {
         var setterFn;
 
         if (defaults.hasOwnProperty(setting)) {
@@ -90,21 +90,18 @@ define(function (require, exports, module) {
     }
 
     /**
-     * Opens the settings dialog
+     * Opens the settings dialog for themes
      */
     function showDialog() {
-        var currentSettings = getValues();
+        var currentSettings = getCurrentSettings();
         var newSettings     = {};
-        var template        = $("<div>").append($settings).html();
-        var $template       = $(Mustache.render(template, {"settings": currentSettings, "themes": ThemeManager.getAllThemes(), "Strings": Strings}));
+        var templateData    = {"settings": currentSettings, "themes": ThemeManager.getAllThemes(), "Strings": Strings};
+        var $template       = $(Mustache.render($("<div>").append($settings).html(), templateData));
 
         // Select the correct theme.
         var $currentThemeOption = $template
-            .find("[value='" + currentSettings.theme + "']");
-        
-        if ($currentThemeOption.length === 0) {
-            $currentThemeOption = $template.find("[value='" + defaults.theme + "']");
-        }
+            .find("[value='" + ThemeManager.getCurrentTheme().name + "']");
+
         $currentThemeOption.attr("selected", "selected");
 
         $template
@@ -118,7 +115,7 @@ define(function (require, exports, module) {
 
                 if (attr) {
                     newSettings[attr] = $target.is(":checked");
-                    applySetting(attr, newSettings[attr]);
+                    setSetting(attr, newSettings[attr]);
                 }
             })
             .on("input", "[data-target]:text", _.debounce(function () {
@@ -127,7 +124,7 @@ define(function (require, exports, module) {
 
                 if (attr) {
                     newSettings[attr] = $target.val();
-                    applySetting(attr, newSettings[attr]);
+                    setSetting(attr, newSettings[attr]);
                 }
             }, 500))
             .on("change", function () {
@@ -136,7 +133,7 @@ define(function (require, exports, module) {
 
                 if (attr) {
                     newSettings[attr] = $target.val();
-                    applySetting(attr, newSettings[attr]);
+                    setSetting(attr, newSettings[attr]);
                 }
             });
 
@@ -144,7 +141,7 @@ define(function (require, exports, module) {
             if (id === "cancel") {
                 // Go through each new setting and apply it
                 Object.keys(newSettings).forEach(function (setting) {
-                    applySetting(setting, currentSettings[setting]);
+                    setSetting(setting, currentSettings[setting]);
                 });
             }
         });
@@ -152,14 +149,14 @@ define(function (require, exports, module) {
 
 
     /**
-     * Restores themes to factory settings.
+     * Restores themes settings to factory settings.
      */
     function restore() {
-        prefs.set("theme", defaults.theme);
+        prefs.set("theme", ThemeManager.defaultThemeName);
         prefs.set("themeScrollbars", defaults.themeScrollbars);
     }
 
-    prefs.definePreference("theme", "string", defaults.theme);
+    prefs.definePreference("theme", "string", ThemeManager.defaultThemeName);
     prefs.definePreference("themeScrollbars", "boolean", defaults.themeScrollbars);
 
     exports.restore    = restore;

From 5560ceb7101f3c098828a535505c022d0d46c32b Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 16:30:13 -0400
Subject: [PATCH 07/11] Cleaned up where default theme name is read from in the
 setting dialog... More like reverting.

---
 src/view/ThemeSettings.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/view/ThemeSettings.js b/src/view/ThemeSettings.js
index f79791040d5..16527b13218 100644
--- a/src/view/ThemeSettings.js
+++ b/src/view/ThemeSettings.js
@@ -152,11 +152,11 @@ define(function (require, exports, module) {
      * Restores themes settings to factory settings.
      */
     function restore() {
-        prefs.set("theme", ThemeManager.defaultThemeName);
+        prefs.set("theme", defaults.theme);
         prefs.set("themeScrollbars", defaults.themeScrollbars);
     }
 
-    prefs.definePreference("theme", "string", ThemeManager.defaultThemeName);
+    prefs.definePreference("theme", "string", defaults.theme);
     prefs.definePreference("themeScrollbars", "boolean", defaults.themeScrollbars);
 
     exports.restore    = restore;

From 61c095eda0412771116460bca9f47fcba82f53d3 Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Tue, 16 Sep 2014 21:39:11 -0400
Subject: [PATCH 08/11] Removed condition to set the current theme when
 updating a theme.  We only want to set the current theme when a new one is
 installed

---
 src/view/ThemeManager.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index 0eecf885515..b5824aa0b91 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -395,7 +395,8 @@ define(function (require, exports, module) {
         var extension = ExtensionManager.extensions[id];
         if (extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme) {
             loadPackage(extension.installInfo).done(function (theme) {
-                if (operationType === Package.OperationTypes.INSTALL || operationType === Package.OperationTypes.UPDATE) {
+                // Set the newly installed theme as the current theme.
+                if (operationType === Package.OperationTypes.INSTALL) {
                     setCurrentTheme(theme.name);
                 }
             });

From b5d6e15fe568c9e8019dc0f2d67408b2abdf3deb Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Wed, 24 Sep 2014 11:31:58 -0400
Subject: [PATCH 09/11] Removed extra jsdoc param

---
 src/extensibility/ExtensionManager.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/extensibility/ExtensionManager.js b/src/extensibility/ExtensionManager.js
index 1588879c7be..cb193d38369 100644
--- a/src/extensibility/ExtensionManager.js
+++ b/src/extensibility/ExtensionManager.js
@@ -211,7 +211,6 @@ define(function (require, exports, module) {
      * @param {$.Event} e The event object
      * @param {string} path The local path of the loaded extension's folder.
      * @param {Package.OperationTypes} operationType Tells if the package is being installed or updated
-     * @param {boolean} newInstall Flag to tell if the entension being loaded is a new install
      */
     function _handleExtensionLoad(e, path, operationType) {
         function setData(id, metadata) {

From ef3e1ba49c655d4204b4814bc85caa6dd1450e10 Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Thu, 16 Oct 2014 15:11:52 -0400
Subject: [PATCH 10/11] Removed circular dependency in ThemeSettings and
 ViewCommandler.  That was causing issue where I couldn't remove ThemeManager
 from ExtensionManager

---
 src/extensibility/ExtensionManager.js |  3 +--
 src/view/ThemeManager.js              | 23 ++++++++++++++---------
 src/view/ViewCommandHandlers.js       |  4 ++--
 3 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/extensibility/ExtensionManager.js b/src/extensibility/ExtensionManager.js
index 47264390182..ebfbc214d89 100644
--- a/src/extensibility/ExtensionManager.js
+++ b/src/extensibility/ExtensionManager.js
@@ -45,8 +45,7 @@ define(function (require, exports, module) {
         ExtensionUtils   = require("utils/ExtensionUtils"),
         FileSystem       = require("filesystem/FileSystem"),
         Strings          = require("strings"),
-        StringUtils      = require("utils/StringUtils"),
-        ThemeManager     = require("view/ThemeManager");
+        StringUtils      = require("utils/StringUtils");
 
     // semver.browser is an AMD-compatible module
     var semver = require("extensibility/node/node_modules/semver/semver.browser");
diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index cd51b846965..407eda46871 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -32,9 +32,8 @@ define(function (require, exports, module) {
         FileUtils          = require("file/FileUtils"),
         EditorManager      = require("editor/EditorManager"),
         ExtensionUtils     = require("utils/ExtensionUtils"),
-        ThemeSettings      = require("view/ThemeSettings"),
         ThemeView          = require("view/ThemeView"),
-        AppInit            = require("utils/AppInit"),
+        ThemeSettings      = require("view/ThemeSettings"),
         ExtensionManager   = require("extensibility/ExtensionManager"),
         Package            = require("extensibility/Package"),
         PreferencesManager = require("preferences/PreferencesManager"),
@@ -348,6 +347,11 @@ define(function (require, exports, module) {
         var fileName = themePackage.path + "/" + themePackage.metadata.theme.file;
         return loadFile(fileName, themePackage.metadata);
     }
+    
+    
+    function showSettingsDialog() {
+        ThemeSettings.showDialog();
+    }
 
 
     prefs.on("change", "theme", function () {
@@ -389,13 +393,14 @@ define(function (require, exports, module) {
     });
 
     
-    exports.refresh          = refresh;
-    exports.loadFile         = loadFile;
-    exports.loadPackage      = loadPackage;
-    exports.getCurrentTheme  = getCurrentTheme;
-    exports.setCurrentTheme  = setCurrentTheme;
-    exports.getAllThemes     = getAllThemes;
-    exports.defaultThemeName = defaultTheme;
+    exports.refresh            = refresh;
+    exports.loadFile           = loadFile;
+    exports.loadPackage        = loadPackage;
+    exports.getCurrentTheme    = getCurrentTheme;
+    exports.setCurrentTheme    = setCurrentTheme;
+    exports.getAllThemes       = getAllThemes;
+    exports.defaultThemeName   = defaultTheme;
+    exports.showSettingsDialog = showSettingsDialog;
 
     // Exposed for testing purposes
     exports._toDisplayName     = toDisplayName;
diff --git a/src/view/ViewCommandHandlers.js b/src/view/ViewCommandHandlers.js
index ce9f75e04ce..a6ab0404cde 100644
--- a/src/view/ViewCommandHandlers.js
+++ b/src/view/ViewCommandHandlers.js
@@ -41,7 +41,7 @@ define(function (require, exports, module) {
         EditorManager       = require("editor/EditorManager"),
         PreferencesManager  = require("preferences/PreferencesManager"),
         DocumentManager     = require("document/DocumentManager"),
-        ThemeSettings       = require("view/ThemeSettings"),
+        ThemeManager        = require("view/ThemeManager"),
         MainViewManager     = require("view/MainViewManager"),
         AppInit             = require("utils/AppInit"),
         _                   = require("thirdparty/lodash");
@@ -459,7 +459,7 @@ define(function (require, exports, module) {
 
     /** Open theme settings dialog */
     function _handleThemeSettings() {
-        ThemeSettings.showDialog();
+        ThemeManager.showSettingsDialog();
     }
 
 

From 68dc4fec13870eb852eba59ae6133d69b268e3d3 Mon Sep 17 00:00:00 2001
From: Miguel Castillo <mcastillo@symphono.com>
Date: Thu, 16 Oct 2014 15:16:47 -0400
Subject: [PATCH 11/11] Changed how the package communicates the operation of
 install/update to a property of the installInfo rather then part of the
 updateStatus message

---
 src/extensibility/ExtensionManager.js | 5 +++--
 src/view/ThemeManager.js              | 4 ++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/extensibility/ExtensionManager.js b/src/extensibility/ExtensionManager.js
index ebfbc214d89..2c6d0b0cdb6 100644
--- a/src/extensibility/ExtensionManager.js
+++ b/src/extensibility/ExtensionManager.js
@@ -236,10 +236,11 @@ define(function (require, exports, module) {
                 metadata: metadata,
                 path: path,
                 locationType: locationType,
-                status: (e.type === "loadFailed" ? START_FAILED : ENABLED)
+                status: (e.type === "loadFailed" ? START_FAILED : ENABLED),
+                operationType: operationType
             };
             synchronizeEntry(id);
-            $(exports).triggerHandler("statusChange", [id, operationType]);
+            $(exports).triggerHandler("statusChange", [id]);
         }
 
         ExtensionUtils.loadPackageJson(path)
diff --git a/src/view/ThemeManager.js b/src/view/ThemeManager.js
index 407eda46871..0b57297bb27 100644
--- a/src/view/ThemeManager.js
+++ b/src/view/ThemeManager.js
@@ -382,10 +382,10 @@ define(function (require, exports, module) {
 
     $(ExtensionManager).on("statusChange", function (evt, id, operationType) {
         var extension = ExtensionManager.extensions[id];
-        if (extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme) {
+        if (extension && extension.installInfo && extension.installInfo.metadata && extension.installInfo.metadata.theme) {
             loadPackage(extension.installInfo).done(function (theme) {
                 // Set the newly installed theme as the current theme.
-                if (operationType === Package.OperationTypes.INSTALL) {
+                if (extension.installInfo.operationType === Package.OperationTypes.INSTALL) {
                     setCurrentTheme(theme.name);
                 }
             });