From 09ae51eab9bbd8932f2af64a6056042751a6621f Mon Sep 17 00:00:00 2001 From: Thomas Wilburn Date: Fri, 20 Mar 2015 13:25:22 -0700 Subject: [PATCH] Start with on-demand rendering for projects New-style nodes are responsible for their own rendering --- js/main.js | 3 +- js/project/node.js | 85 ++++++++++++++++++++++++++++++++++++++++++++++ js/project/tree.js | 27 +++++++++++++++ 3 files changed, 114 insertions(+), 1 deletion(-) create mode 100644 js/project/node.js create mode 100644 js/project/tree.js diff --git a/js/main.js b/js/main.js index 433c2d2..992c8f7 100644 --- a/js/main.js +++ b/js/main.js @@ -8,7 +8,8 @@ require([ "sessions", "util/manos", "util/i18n", - "ui/projectManager", + "project/tree", + //"ui/projectManager", "ui/keys", "fileManager", "ui/menus", diff --git a/js/project/node.js b/js/project/node.js new file mode 100644 index 0000000..4eb5d88 --- /dev/null +++ b/js/project/node.js @@ -0,0 +1,85 @@ +define(["util/manos", "util/dom2"], function(M) { + + var noop = function() {}; + + var Node = function(entry) { + this.entry = entry; + this.name = entry.name + this.isOpen = true; + this.isDirty = true; + this.isDir = entry.isDirectory; + this.children = []; + }; + + Node.prototype = { + entry: null, + isOpen: false, + isDirty: false, + isDir: false, + path: null, + name: null, + parent: null, + children: null, + element: null, + toggle: function(done) { + + }, + render: function(done) { + var self = this; + done = done || noop; + if (!this.element) return done(); + var a = this.element.find("a.label"); + if (!a) { + a = document.createElement("a"); + a.className = "label"; + this.element.append(a); + } + a.innerHTML = this.name; + if (!this.isOpen) return done(); + if (this.isDirty && this.isDir) { + this.readdir(function() { + self.renderChildren(done); + }); + } else { + this.renderChildren(done); + } + }, + renderChildren: function(done) { + var ul = this.element.find("ul.children"); + if (!ul) { + ul = document.createElement("ul"); + ul.className = "children"; + this.element.append(ul); + } + M.map(this.children, function(item, i, c) { + if (!item.element) { + var li = document.createElement("li"); + item.element = li; + ul.append(li); + } + item.render(); + }, done) + }, + readdir: function(done) { + var self = this; + var reader = this.entry.createReader(); + var entries = []; + var collect = function(list) { + if (!list.length) return complete(); + entries.push.apply(entries, list); + reader.readEntries(collect); + }; + var complete = function() { + self.children = entries.map(function(entry) { + return new Node(entry); + }); + done(); + }; + reader.readEntries(collect); + + } + }; + + return Node; + +}); \ No newline at end of file diff --git a/js/project/tree.js b/js/project/tree.js new file mode 100644 index 0000000..244872e --- /dev/null +++ b/js/project/tree.js @@ -0,0 +1,27 @@ +define([ + "project/node", + "command", + "util/dom2"], +function(Node, command) { + + var directories = []; + var container = document.find(".project"); + container.addClass("show"); + var tree = container.find(".tree"); + + command.on("project:add-dir", function() { + chrome.fileSystem.chooseEntry({ type: "openDirectory" }, function(entry) { + var root = new Node(entry); + directories.push(root); + var element = document.createElement("ul"); + var rootElement = document.createElement("li"); + tree.append(element); + element.append(rootElement); + root.element = rootElement; + root.isOpen = true; + root.render(); + + }) + }); + +}); \ No newline at end of file