Implemented separate tabs for unpacked apps and extensions in App Developer Tools.

BUG=237277

Review URL: https://chromiumcodereview.appspot.com/15810003

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@202840 0039d316-1c4b-4281-b951-d872f2087c98

chrome/app/generated_resources.grd

@@ -5432,6 +5432,12 @@ Make sure you do not expose any sensitive information.
       <message name="IDS_APPS_DEVTOOL_EXTENSIONS_INSTALLED" desc="Text for the word 'Extensions'.">
         Extensions
       </message>
+      <message name="IDS_APPS_DEVTOOL_NO_UNPACKED_INSTALLED" desc="Text that lets the user know that no unpacked apps or extensions are installed.">
+        No unpacked applications or extensions.
+      </message>
+      <message name="IDS_APPS_DEVTOOL_UNPACKED_INSTALLED" desc="Text for the word 'Unpacked' (unpacked app or extension).">
+        Unpacked
+      </message>
       <message name="IDS_EXTENSIONS_NONE_INSTALLED_SUGGEST_GALLERY" desc="Text on next line after IDS_EXTENSIONS_NONE_INSTALLED that suggests the user look in the gallery for extensions to install.">
         Want to <ph name="BEGIN_LINK">&lt;a target="_blank" href="$1"&gt;</ph>browse the gallery<ph name="END_LINK">&lt;/a&gt;<ex>&lt;/a&gt;</ex></ph> instead?
       </message>

chrome/browser/extensions/api/developer_private/developer_private_api.cc

@@ -1109,8 +1109,9 @@ bool DeveloperPrivateGetStringsFunction::RunImpl() {
   SET_STRING("appsDevtoolNoApps", IDS_APPS_DEVTOOL_NO_APPS_INSTALLED);
   SET_STRING("appsDevtoolApps", IDS_APPS_DEVTOOL_APPS_INSTALLED);
   SET_STRING("appsDevtoolExtensions", IDS_APPS_DEVTOOL_EXTENSIONS_INSTALLED);
-  SET_STRING("appsDevtoolNoExtensions",
-             IDS_EXTENSIONS_NONE_INSTALLED);
+  SET_STRING("appsDevtoolNoExtensions", IDS_EXTENSIONS_NONE_INSTALLED);
+  SET_STRING("appsDevtoolUnpacked", IDS_APPS_DEVTOOL_UNPACKED_INSTALLED);
+  SET_STRING("appsDevtoolNoUnpacked", IDS_APPS_DEVTOOL_NO_UNPACKED_INSTALLED);
   SET_STRING("appsDevtoolTitle", IDS_APPS_DEVTOOL_TITLE);
   SET_STRING("extensionSettingsGetMoreExtensions", IDS_GET_MORE_EXTENSIONS);
   SET_STRING("extensionSettingsExtensionId", IDS_EXTENSIONS_ID);

chrome/browser/resources/apps_debugger/css/items.css

@@ -120,7 +120,8 @@ html[dir='rtl'] #search {
 }
 
 #no-extensions-message,
-#no-apps-message {
+#no-apps-message,
+#no-unpacked-message {
   font-weight: bold;
 }
 
@@ -129,14 +130,17 @@ html[dir='rtl'] #search {
 }
 
 #no-extensions,
-#no-apps {
-  margin: 10px 10px;
+#no-apps,
+#no-unpacked {
+  margin: 10px;
 }
 
 .loading #no-extensions,
 .loading #no-apps,
-#extension-settings-list:not(.empty-item-list) ~ #no-extensions,
-#app-settings-list:not(.empty-item-list) ~ #no-apps,
+.loading #no-unpacked,
+#packed-extension-list:not(.empty-item-list) ~ #no-extensions,
+#packed-app-list:not(.empty-item-list) ~ #no-apps,
+#unpacked-list:not(.empty-item-list) ~ #no-unpacked,
 .empty-item-list {
   display: none;
 }

chrome/browser/resources/apps_debugger/js/items_list.js

@@ -5,14 +5,17 @@
 cr.define('apps_dev_tool', function() {
   'use strict';
 
-  // The list of all apps & extensions.
+  // The list of all packed/unpacked apps and extensions.
   var completeList = [];
 
-  // The list of all apps.
-  var appList = [];
+  // The list of all packed apps.
+  var packedAppList = [];
 
-  // The list of all extensions.
-  var extensionList = [];
+  // The list of all packed extensions.
+  var packedExtensionList = [];
+
+  // The list of all unpacked apps or extensions.
+  var unpackedList = [];
 
   /** const*/ var AppsDevTool = apps_dev_tool.AppsDevTool;
 
@@ -52,10 +55,13 @@ cr.define('apps_dev_tool', function() {
    * Refreshes the app.
    */
   function reloadAppDisplay() {
-    var extensions = new ItemsList($('extension-settings-list'), extensionList);
-    var apps = new ItemsList($('app-settings-list'), appList);
+    var extensions = new ItemsList($('packed-extension-list'),
+                                   packedExtensionList);
+    var apps = new ItemsList($('packed-app-list'), packedAppList);
+    var unpacked = new ItemsList($('unpacked-list'), unpackedList);
     extensions.showItemNodes();
     apps.showItemNodes();
+    unpacked.showItemNodes();
   }
 
   /**
@@ -63,17 +69,20 @@ cr.define('apps_dev_tool', function() {
    * @param {string} filter Curent string in the search box.
    */
   function rebuildAppList(filter) {
-    appList = [];
-    extensionList = [];
+    packedAppList = [];
+    packedExtensionList = [];
+    unpackedList = [];
 
     for (var i = 0; i < completeList.length; i++) {
       var item = completeList[i];
       if (filter && item.name.toLowerCase().search(filter.toLowerCase()) < 0)
         continue;
-      if (item.isApp)
-        appList.push(item);
+      if (item.is_unpacked)
+        unpackedList.push(item);
+      else if (item.isApp)
+        packedAppList.push(item);
       else
-        extensionList.push(item);
+        packedExtensionList.push(item);
     }
   }
 

chrome/browser/resources/apps_debugger/main.html

@@ -41,6 +41,7 @@ found in the LICENSE file.
           </div>
           <div id="tabs-header-container">
             <tabs id="tabs" tabindex="0">
+              <tab i18n-content="appsDevtoolUnpacked"></tab>
               <tab i18n-content="appsDevtoolApps"></tab>
               <tab i18n-content="appsDevtoolExtensions"></tab>
             </tabs>
@@ -48,19 +49,25 @@ found in the LICENSE file.
           <div id="header-bottom-gradient"></div>
         </div>
         <tabpanels id="tab-panels">
-          <!-- Apps Tab -->
-          <tabpanel id="apps-tab">
-            <div id="app-settings-list" class="empty-extension-list">
+          <!-- Unpacked -->
+          <tabpanel id="unpacked-tab">
+            <div id="unpacked-list" class="empty-extension-list"></div>
+            <div id="no-unpacked">
+              <span id="no-unpacked-message"
+                  i18n-content="appsDevtoolNoUnpacked"></span>
             </div>
+          </tabpanel>
+          <!-- Apps Tab -->
+          <tabpanel id="packed-apps-tab">
+            <div id="packed-app-list" class="empty-extension-list"></div>
             <div id="no-apps">
               <span id="no-apps-message"
                   i18n-content="appsDevtoolNoApps"></span>
             </div>
           </tabpanel>
           <!-- Extensions Tab -->
-          <tabpanel id="extensions-tab">
-            <div id="extension-settings-list" class="empty-extension-list">
-            </div>
+          <tabpanel id="packed-extensions-tab">
+            <div id="packed-extension-list" class="empty-extension-list"></div>
             <div id="no-extensions">
               <span id="no-extensions-message"
                   i18n-content="appsDevtoolNoExtensions"></span>