first WIP of a Resource Manager organized by type of resources

Author: p01

src/build-application/build_resource_manager_1_0.js

@@ -2,6 +2,11 @@
 
 window.app.builders.ResourceManager["1.0"] = function(service)
 {
+  // p01 WIP resource views
+  new cls.ResourceTestView('resource_tree_view','Tree View');
+  //new cls.ResourceTestView('resource_search', 'Search');
+
+
   new cls.ResourceManagerAllView('resource_all', ui_strings.M_VIEW_LABEL_ALL_RESOURCES, 'scroll resource-manager', '', '');
   //new cls.ResourceManagerFontView('resource_fonts', "Fonts", 'scroll', '', '');
   //new cls.ResourceManagerImageView('resource_images', "Images", 'scroll', '', '');

src/client-en.xml

@@ -479,6 +479,8 @@ window.load_screen_timeout = window.setTimeout(function()
 <script src="./resource-manager/resourcemanager.1.0.events.onresponsefinished.js"/>
 <script src="./resource-manager/documentmanager.1.0.events.onabouttoloaddocument.js"/>
 
+<script src="./resource-manager/resource_test_view.js"/>
+
 
 <script src="./network/network_service.js"/>
 <script src="./network/network_view.js"/>

src/client/client.js

@@ -580,10 +580,16 @@ ui_framework.layouts.network_rough_layout =
 
 ui_framework.layouts.resource_rough_layout =
 {
-    dir: 'v',
-    width: 1000,
-    height: 1000,
-    children: [ { height: 1000, tabbar: { id: "resources", tabs: ['resource_all'] } } ]
+  dir:'h', width:1000,height:700,
+  children:
+  [
+    {
+      width: 700, tabbar: { id:'resources_tree', tabs: ['resource_tree_view'] }
+    },
+    {
+      width: 300, tabbar: { id: "resources", tabs: ['resource_all'], _is_hidden: true }
+    }
+  ]
 };
 
 ui_framework.layouts.utils_rough_layout =

src/resource-manager/resource_all_view.js

@@ -56,6 +56,14 @@ cls.ResourceManagerAllView = function(id, name, container_class, html, default_h
 
   this._render_main_view = function(container)
   {
+    container.clearAndRender(
+        ['div',
+         ['p', "let's deprecate this view please..."],
+         'class', 'info-box'
+        ]
+      );
+    return;
+
     var ctx = this._service.get_resource_context();
     if (ctx && ctx.resources.length)
     {
@@ -157,7 +165,11 @@ cls.ResourceManagerAllView = function(id, name, container_class, html, default_h
       },
       host: {
         label: ui_strings.S_RESOURCE_ALL_TABLE_COLUMN_HOST,
-        getter: function(res) { return res.urltype == 4 ? res.human_url : cls.ResourceUtil.url_host(res.url) },
+        getter: function(res) { return (
+
+[res.frameID, cls.ResourceManagerService.instance._frames[res.frameID].parentFrameID]
+
+            )+' > '+(res.urltype == 4 ? res.human_url : cls.ResourceUtil.url_host(res.url)) },
       },
       path: {
         label: ui_strings.S_RESOURCE_ALL_TABLE_COLUMN_PATH,
@@ -196,13 +208,13 @@ cls.ResourceManagerAllView = function(id, name, container_class, html, default_h
   {
     this._loading = true;
     this._table = null;
-    this.update();
+//    this.update();
   }.bind(this);
 
   this._on_documentloaded_bound = function()
   {
     this._loading = false;
-    this.update();
+//    this.update();
   }.bind(this);
 
   var eh = window.eventHandlers;

src/resource-manager/resource_service.js

@@ -10,66 +10,76 @@ cls.ResourceManagerService = function(view)
   }
   cls.ResourceManagerService.instance = this;
 
-  this._current_context = null;
   this._view = view;
+  this._context = null;
 
   this._enable_content_tracking = function()
   {
     this._res_service.requestSetResponseMode(null, [[3, 1]]);
-  }
+  };
 
   this._on_abouttoloaddocument_bound = function(msg)
   {
     var data = new cls.DocumentManager["1.0"].AboutToLoadDocument(msg);
-    // if not a top resource, just ignore. This usually means it's an iframe
-    if (data.parentDocumentID) { return; }
-    this._current_context = new cls.ResourceContext();
+    if (!data.parentFrameID)
+    {
+      this._context = new cls.ResourceContext(data);
+    }
+    if (this._context)
+    {
+      this._context.update("abouttoloaddocument", data);
+    }
   }.bind(this);
 
   this._on_urlload_bound = function(msg)
   {
-    if (!this._current_context) { return; }
+    if (!this._context){ return; }
+
     var data = new cls.ResourceManager["1.0"].UrlLoad(msg);
+      //bail if we get dupes. Why do we get dupes? fixme
+      //if (data.resourceID in this._current_document.resourcemap) { return }
 
-    //bail if we get dupes. Why do we get dupes? fixme
-    //if (data.resourceID in this._current_document.resourcemap) { return }
-    this._current_context.update("urlload", data);
+    this._context.update("urlload", data);
+    this._view.update();
   }.bind(this);
 
   this._on_urlredirect_bound = function(msg)
   {
-    if (!this._current_context) { return; }
+    if (!this._context){ return; }
 
     var data = new cls.ResourceManager["1.0"].UrlRedirect(msg);
     // a bit of cheating since further down we use .resouceID to determine
     // what resource the event applies to:
     data.resourceID = data.fromResourceID;
-    this._current_context.update("urlredirect", data);
+    this._context.update("urlredirect", data);
   }.bind(this);
 
   this._on_urlfinished_bound = function(msg)
   {
-    if (!this._current_context) { return; }
+    if (!this._context){ return; }
+
     var data = new cls.ResourceManager["1.0"].UrlFinished(msg);
-    this._current_context.update("urlfinished", data);
+    this._context.update("urlfinished", data);
   }.bind(this);
 
   this._on_response_bound = function(msg)
   {
-    if (!this._current_context) { return; }
+    if (!this._context){ return; }
+
     var data = new cls.ResourceManager["1.0"].Response(msg);
-    this._current_context.update("response", data);
+    this._context.update("response", data);
   }.bind(this);
 
   this._on_debug_context_selected_bound = function()
   {
-    this._current_context = null;
+    this._context = null;
     this._view.update();
   }.bind(this);
 
   this.init = function()
   {
     this._res_service = window.services['resource-manager'];
+    
     this._res_service.addListener("urlload", this._on_urlload_bound);
     this._res_service.addListener("response", this._on_response_bound);
     this._res_service.addListener("urlredirect", this._on_urlredirect_bound);
@@ -81,7 +91,7 @@ cls.ResourceManagerService = function(view)
 
   this.get_resource_context = function()
   {
-    return this._current_context;
+    return this._context;
   };
 
   /**
@@ -96,9 +106,14 @@ cls.ResourceManagerService = function(view)
 
   this.get_resource_for_id = function(id)
   {
-    if (this._current_context)
+    if (this._topFrameID)
     {
-      return this._current_context.get_resource(id);
+      for (var i in this._frames)
+      {
+        var res = this._current_context.get_resource(id);
+        if (res){ return res; }
+      }
+      //return this._current_context.get_resource(id);
     }
     return null;
   };
@@ -118,44 +133,67 @@ cls.ResourceManagerService = function(view)
     var tag = window.tagManager.set_callback(null, callback);
     const MAX_PAYLOAD_SIZE = 10 * 1000 * 1000; // allow payloads of about 10 mb.
     this._res_service.requestGetResource(tag, [rid, [typecode, 1, MAX_PAYLOAD_SIZE]]);
-  }
+  };
 
   this.init();
 };
 
-
-cls.ResourceContext = function()
+cls.ResourceContext = function(data)
 {
-  this.resources = [];
+//  this.resources = [];
+  this.resourcesDict = {};
+  this.frames = {};
 
   this.update = function(eventname, event)
   {
-    var res = this.get_resource(event.resourceID);
+    if (eventname == "abouttoloaddocument")
+    {
+      var frame = event;
+      frame.closed = !!event.parentFrameID;
+      frame.groups = { markup: {closed:true,ids:{}}, css: {closed:true,ids:{}}, script: {closed:true,ids:{}}, image: {closed:true,ids:{}}, other: {closed:true,ids:{}} };
+      this.frames[ event.frameID ] = frame;
+      return;
+    }
 
+    var res = this.get_resource(event.resourceID);
     if (eventname == "urlload" && !res)
     {
       res = new cls.Resource(event.resourceID);
-      this.resources.push(res);
+      res.frameID = event.frameID;
+//      this.resources.push(res);
+      this.resourcesDict[ res.id ] = res;
     }
     else if (!res)
     {
       // ignoring. Never saw an urlload, or it's allready invalidated
-      return
+      return;
     }
 
     res.update(eventname, event);
 
     if (res.invalid)
     {
-      this.resources.splice(this.resources.indexOf(res), 1);
+      delete this.resourcesDict[ res.id ];
+//      this.resources.splice(this.resources.indexOf(res), 1);
+    }
+    else if (eventname == "urlfinished")
+    {
+      // push the resourceID into the proper group
+      var frame = this.frames[res.frameID];
+      var type = res.type;
+      if (!frame.groups[type]){ type='other'; }
+
+      //if (frame.groups[type].ids.indexOf( res.id )==-1)
+        frame.groups[type].ids[ res.id ]=1;
     }
   }
 
   this.get_resource = function(id)
   {
-    return this.resources.filter(function(e) { return e.id == id; })[0];
+    return this.resourcesDict[ id ];
+//    return this.resources.filter(function(e) { return e.id == id; })[0];
   };
-
+/*
   this.get_resources_for_types = function()
   {
     var types = Array.prototype.slice.call(arguments, 0);
@@ -169,46 +207,56 @@ cls.ResourceContext = function()
     var filterfun = function(e) { return mimes.indexOf(e.mime) > -1; };
     return this.resources.filter(filterfun);
   };
-
+/*
   this.get_resource_groups = function()
   {
-    var imgs = this.get_resources_for_type("image");
-    var stylesheets = this.get_resources_for_mime("text/css");
-    var markup = this.get_resources_for_mime("text/html",
+    return this._groups;
+    var imgs = this.get_resources_for_types("image");
+    var stylesheets = this.get_resources_for_mimes("text/css");
+    var markup = this.get_resources_for_mimes("text/html",
                                              "application/xhtml+xml");
-    var scripts = this.get_resources_for_mime("application/javascript",
+    var scripts = this.get_resources_for_mimes("application/javascript",
                                               "text/javascript");
 
     var known = [].concat(imgs, stylesheets, markup, scripts);
     var other = this.resources.filter(function(e) {
       return known.indexOf(e) == -1;
     });
     return {
-      images: imgs, stylesheets: stylesheets, markup: markup,
+      markup: markup, images: imgs, stylesheets: stylesheets, 
       scripts: scripts, other: other
     }
   }
+*/
 }
 
 cls.Resource = function(id)
 {
-  this.id = id;
-  this.finished = false;
-  this.url = null;
-  this.location = "No URL";
-  this.result = null;
-  this.mime = null;
-  this.encoding = null;
-  this.size = 0;
-  this.type = null;
-  this.urltype = null;
-  this.invalid = false;
+  this._init(id);
+}
+
+var ResourcePrototype = function()
+{
+  this._init = function(id)
+  {
+    this.id = id;
+    this.finished = false;
+    this.url = null;
+    this.location = "No URL";
+    this.result = null;
+    this.mime = null;
+    this.encoding = null;
+    this.size = 0;
+    this.type = null;
+    this.urltype = null;
+    this.invalid = false;
+  }
 
   this.update = function(eventname, eventdata)
   {
     if (eventname == "urlload")
     {
-      this.url = eventdata.url;
+      this.url = new URI( eventdata.url );
       this.urltype = eventdata.urlType;
       // fixme: complete list
       this.urltypeName = {0: "Unknown", 1: "HTTP", 2: "HTTPS", 3: "File", 4: "Data" }[eventdata.urlType];
@@ -218,7 +266,7 @@ cls.Resource = function(id)
     {
       if (!this.url)
       {
-        this.url = eventdata.url;
+        this.url = new URI( eventdata.url );
       }
       this.result = eventdata.result;
       this.mime = eventdata.mimeType;
@@ -259,7 +307,7 @@ cls.Resource = function(id)
     }
     else if (this.mime.toLowerCase() == "application/octet-stream")
     {
-      this.type = cls.ResourceUtil.path_to_type(this.url);
+      this.type = cls.ResourceUtil.path_to_type(this.url.filename);
     }
     else
     {
@@ -269,7 +317,6 @@ cls.Resource = function(id)
 
   this._humanize_url = function()
   {
-    this.human_url = this.url;
     if (this.urltype == 4) // data URI
     {
       if (this.type)
@@ -281,5 +328,10 @@ cls.Resource = function(id)
         this.human_url = "data URI";
       }
     }
+    else
+    {
+      this.human_url = this.url.url;
+    }
   }
 }
+cls.Resource.prototype = new ResourcePrototype();