From e79a0b8d774c6adb7b1d098388106f85c0cbdd7f Mon Sep 17 00:00:00 2001 From: Sven Slootweg Date: Mon, 11 Apr 2016 05:29:51 +0200 Subject: [PATCH] Initial work on fileset-browser component --- package.json | 2 + src/components/fileset-browser/component.tag | 54 +++++++++++-- src/filesystem/list-directory.js | 84 ++++++++++++++++++++ 3 files changed, 134 insertions(+), 6 deletions(-) create mode 100644 src/filesystem/list-directory.js diff --git a/package.json b/package.json index 8003e47..2e63ea0 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "dependencies": { "bhttp": "^1.2.1", "bluebird": "^3.3.4", + "byte-size": "^2.0.0", "chalk": "^1.1.3", "document-ready-promise": "^3.0.1", "electron-prebuilt": "^0.37.5", @@ -28,6 +29,7 @@ "gulp-sass": "^2.2.0", "ia-headers": "^1.0.0", "jquery": "^2.2.3", + "natural-sort": "^1.0.0", "rfr": "^1.2.3", "riot": "^2.3.18", "uuid": "^2.0.1", diff --git a/src/components/fileset-browser/component.tag b/src/components/fileset-browser/component.tag index 96026db..c782fe2 100644 --- a/src/components/fileset-browser/component.tag +++ b/src/components/fileset-browser/component.tag @@ -1,16 +1,58 @@ fileset-browser - strong Fileset browser goes here + .browser + .entry(each="{entry in entries}" class="{folder: entry.type === 'folder'}") + span.filename {entry.name} + span.size(hide="{entry.type === 'folder'}") {entry.size} - style(scoped). - strong { - color: red; + style(scoped, type="scss"). + .browser { + background-color: #e8e8e8; + border: 1px solid gray; + + .entry { + font-size: 14px; + background: linear-gradient(to bottom, #efefef 0%,#e5e5e5 100%); + padding: 4px 6px; + + &.folder { + background: linear-gradient(to bottom, #e2e2e2 0%,#d4d4d4 100%); + } + + .filename { + font-weight: 600; + } + + .size { + float: right; + color: gray; + } + } } script. - let $ = require("jquery") + const $ = require("jquery"); + const path = require("path"); + const byteSize = require("byte-size"); + const xtend = require("xtend"); + const rfr = require("rfr"); + const listDirectory = rfr("lib/filesystem/list-directory"); + + Promise.try(() => { + return listDirectory(path.join(__dirname, "../../../")); + }).map((entry) => { + return xtend(entry, { + size: byteSize(entry.size, {units: "iec"}) + }); + }).then((entries) => { + this.entries = entries; + this.update(); + }); + + /* this.on("mount", () => { $("strong", this.root).on("click", () => { this.trigger("click"); }); - }); \ No newline at end of file + }); + */ \ No newline at end of file diff --git a/src/filesystem/list-directory.js b/src/filesystem/list-directory.js new file mode 100644 index 0000000..e32d4ea --- /dev/null +++ b/src/filesystem/list-directory.js @@ -0,0 +1,84 @@ +'use strict'; + +const Promise = require("bluebird"); +const fs = Promise.promisifyAll(require("fs")); +const path = require("path"); +const naturalSort = require("natural-sort"); + +function statComplete(target) { + return Promise.try(() => { + return Promise.try(() => { + return fs.lstatAsync(target); + }).then((stats) => { + if (stats.isSymbolicLink()) { + return Promise.try(() => { + return fs.statAsync(target); + }).then((targetStats) => { + return { + stats: targetStats, + linkStats: stats + } + }); + } else { + return { + stats: stats + } + } + }); + }) +} + +function getType(stats) { + if (stats.isSymbolicLink()) { + return "link"; + } else if (stats.isDirectory()) { + return "folder"; + } else if (stats.isFile()) { + return "file"; + } else { + return "other"; + } +} + +module.exports = function(basePath) { + return Promise.try(() => { + return fs.readdirAsync(basePath); + }).map((entry) => { + let fullPath = path.join(basePath, entry); + + return Promise.try(() => { + return statComplete(fullPath); + }).then((stats) => { + let type, targetType; + + if (stats.linkStats != null) { + type = "link"; + targetType = getType(stats.stats); + } else { + type = getType(stats.stats); + targetType = type; + } + + return { + type: type, + targetType: targetType, + name: entry, + path: fullPath, + modified: stats.stats.mtime, + size: stats.stats.size + } + }) + }).then((entries) => { + let sorter = naturalSort(); + + return entries.sort((entryA, entryB) => { + if (entryA.targetType == "folder" && entryB.targetType != "folder") { + return -1; + } else if (entryB.targetType == "folder" && entryA.targetType != "folder") { + return 1; + } else { + return sorter(entryA.name, entryB.name); + } + }); + }); +} \ No newline at end of file