Fix DFL-3718, Do no localize the classname in the Resource Tree

Author: p01

src/resource-manager/resource_service.js

@@ -12,14 +12,6 @@ cls.ResourceInspector = function(network_logger)
   var HIGHLIGHT_CLASSNAME = "resource-highlight";
 
   var THROTTLE_DELAY = 250;
-  var TYPE_GROUP_MAPPING = {
-    "markup": ui_strings.S_HTTP_LABEL_FILTER_MARKUP,
-    "css": ui_strings.S_HTTP_LABEL_FILTER_STYLESHEETS,
-    "script": ui_strings.S_HTTP_LABEL_FILTER_SCRIPTS,
-    "image": ui_strings.S_HTTP_LABEL_FILTER_IMAGES,
-    "font": ui_strings.S_HTTP_LABEL_FILTER_FONTS,
-    "*": ui_strings.S_HTTP_LABEL_FILTER_OTHER
-  };
 
   this._network_logger = network_logger;
 
@@ -56,6 +48,19 @@ cls.ResourceInspector = function(network_logger)
       this.detail_view = window.views.resource_detail_view;
   };
 
+  this.get_group_order = function()
+  {
+    this.get_views();
+    if (this.group_order == null && this.tree_view != null)
+    {
+      this.group_order = this.tree_view.get_group_order();
+      this.group_order_type_index = {};
+      this.group_order.forEach( function(g, i) {
+        this.group_order_type_index[g.type] = i;
+      }, this);
+    }
+  }
+
   this._update = function(msg)
   {
     this.get_views();
@@ -95,7 +100,8 @@ cls.ResourceInspector = function(network_logger)
       ctx.collapsed = this._collapsed_hash;
 
       // get the order of the groups of resources,
-      ctx.group_order = this.tree_view.get_group_order();
+      this.get_group_order();
+      ctx.group_order = this.group_order;
 
       ctx.document_resource_hash = {};
 
@@ -136,7 +142,7 @@ cls.ResourceInspector = function(network_logger)
           if (!hash.hasOwnProperty(id))
           {
             hash[id] = d.depth > 1;
-            ctx.group_order.forEach(function(g) { hash[id + "_" + g] = true; });
+            ctx.group_order.forEach(function(g) { hash[id + "_" + g.type] = true; });
           }
         }
 
@@ -166,10 +172,10 @@ cls.ResourceInspector = function(network_logger)
           return false;
         }
 
-        r.group = TYPE_GROUP_MAPPING[r.type] || TYPE_GROUP_MAPPING["*"];
+        r.group = this.group_order_type_index.hasOwnProperty(r.type) ? r.type : ctx.group_order.last.type;
         r.same_origin = cls.ResourceUtil.sameOrigin(d.url, r);
 
-        r.full_id = d.pivot_id + "_" + ctx.group_order.indexOf(r.group) + r.group + "_" + r.uid;
+        r.full_id = d.pivot_id + "_" + this.group_order_type_index[r.group] + r.group + "_" + r.uid;
         r.pivot_id = d.pivot_id + "_" + r.group;
         r.is_hidden = ctx.collapsed[r.pivot_id] == true;
 

src/resource-manager/resource_style.css

@@ -382,10 +382,10 @@ h2 .resource-different-origin
 .resource-tree-window-label,
 .resource-tree-document-label,
 .resource-tree-group-markup-label,
-.resource-tree-group-stylesheets-label,
-.resource-tree-group-scripts-label,
-.resource-tree-group-images-label,
-.resource-tree-group-fonts-label,
+.resource-tree-group-css-label,
+.resource-tree-group-script-label,
+.resource-tree-group-image-label,
+.resource-tree-group-font-label,
 .resource-tree-group-other-label
 {
   font-weight: bold;
@@ -415,22 +415,22 @@ h2 .resource-different-origin
   background-image: url("../ui-images/type_markup.png");
 }
 
-.resource-tree-group-stylesheets-label
+.resource-tree-group-css-label
 {
   background-image: url("../ui-images/type_style.png");
 }
 
-.resource-tree-group-scripts-label
+.resource-tree-group-script-label
 {
   background-image: url("../ui-images/type_script.png");
 }
 
-.resource-tree-group-images-label
+.resource-tree-group-image-label
 {
   background-image: url("../ui-images/type_picture.png");
 }
 
-.resource-tree-group-fonts-label
+.resource-tree-group-font-label
 {
   background-image: url("../ui-images/type_font.png");
 }

src/resource-manager/resource_templates.js

@@ -165,7 +165,7 @@ window.templates.resource_tree || (window.templates.resource_tree = new function
 	this.resource_group = function(context, resources, d, g)
 	{
 		var resources = resources.filter(function(r) {
-			return r.group == g;
+			return r.group == g.type;
 		});
 
 		var resource_count = resources.length;
@@ -181,22 +181,22 @@ window.templates.resource_tree || (window.templates.resource_tree = new function
 			return;
 
 		var depth = d.depth + 1;
-		var extras = this._expander_extras(context, d.pivot_id + "_" + g, depth);
+		var extras = this._expander_extras(context, d.pivot_id + "_" + g.type, depth);
 
 		flat_list.push(
 			["li",
 				["h2",
 					extras.tpl.button,
 					["span",
-						g,
-						"class", "resource-tree-group-" + g.toLowerCase() + "-label"
+						g.ui_string,
+						"class", "resource-tree-group-" + g.type.toLowerCase() + "-label"
 					],
 					" ",
 					["span",
 						String(resource_count),
 						"class", "resource-tree-count"
 					],
-					"class", "resource-tree-group resource-tree-group-" + g.toLowerCase()
+					"class", "resource-tree-group resource-tree-group-" + g.type.toLowerCase()
 				].concat(extras.tpl.h2),
 			].concat(extras.tpl.li)
 		);

src/resource-manager/resource_tree_view.js

@@ -11,12 +11,12 @@ cls.ResourceTreeView = function(id, name, container_class, html, default_handler
   //	const
   var THROTTLE_DELAY = 250;
   var GROUP_ORDER = [
-    ui_strings.S_HTTP_LABEL_FILTER_MARKUP,
-    ui_strings.S_HTTP_LABEL_FILTER_STYLESHEETS,
-    ui_strings.S_HTTP_LABEL_FILTER_SCRIPTS,
-    ui_strings.S_HTTP_LABEL_FILTER_IMAGES,
-    ui_strings.S_HTTP_LABEL_FILTER_FONTS,
-    ui_strings.S_HTTP_LABEL_FILTER_OTHER
+    {"type": "markup", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_MARKUP},
+    {"type": "css", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_STYLESHEETS},
+    {"type": "script", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_SCRIPTS},
+    {"type": "image", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_IMAGES},
+    {"type": "font", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_FONTS},
+    {"type": "other", "ui_string": ui_strings.S_HTTP_LABEL_FILTER_OTHER}
   ];
 
   this._next_render_time = 0;