Skip to content
This repository has been archived by the owner on Oct 22, 2021. It is now read-only.

Commit

Permalink
✨ Optional list view in fsDisp
Browse files Browse the repository at this point in the history 
* Add optional list view in file browser, which also displays file type, size and last accessed timestamp
* Add Ctrl+Shift+L keyboard shortcut to toggle list view
* Add fsListView setting - defaults to false
  • Loading branch information
@GitSquared
GitSquared committed May 11, 2019
1 parent 77899c1 commit 7fa92d2
Show file tree
Hide file tree
Showing 4 changed files with 115 additions and 6 deletions.
1 change: 1 addition & 0 deletions src/_boot.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@ if (!fs.existsSync(settingsFile)) {
allowWindowed: false,
excludeThreadsFromToplist: true,
hideDotfiles: false,
fsListView: false,
experimentalGlobeFeatures: false,
experimentalFeatures: false
}, 4));
Expand Down
16 changes: 15 additions & 1 deletion src/_renderer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,7 +337,7 @@ async function initUI() {

document.getElementById("main_shell").setAttribute("style", "opacity: 0;");
document.body.innerHTML += `
<section id="filesystem" style="width: 0px;" class="${window.settings.hideDotfiles ? "hideDotfiles" : ""}">
<section id="filesystem" style="width: 0px;" class="${window.settings.hideDotfiles ? "hideDotfiles" : ""} ${window.settings.fsListView ? "list-view" : ""}">
</section>
<section id="keyboard" style="opacity:0;">
</section>`;
Expand Down Expand Up @@ -705,6 +705,14 @@ window.openSettings = async () => {
<option>${!window.settings.hideDotfiles}</option>
</select></td>
</tr>
<tr>
<td>fsListView</td>
<td>Show files in a more detailed list instead of an icon grid</td>
<td><select id="settingsEditor-fsListView">
<option>${window.settings.fsListView}</option>
<option>${!window.settings.fsListView}</option>
</select></td>
</tr>
<tr>
<td>experimentalGlobeFeatures</td>
<td>Toggle experimental features for the network globe</td>
Expand Down Expand Up @@ -758,6 +766,7 @@ window.writeSettingsFile = () => {
allowWindowed: (document.getElementById("settingsEditor-allowWindowed").value === "true"),
excludeThreadsFromToplist: (document.getElementById("settingsEditor-excludeThreadsFromToplist").value === "true"),
hideDotfiles: (document.getElementById("settingsEditor-hideDotfiles").value === "true"),
fsListView: (document.getElementById("settingsEditor-fsListView").value === "true"),
experimentalGlobeFeatures: (document.getElementById("settingsEditor-experimentalGlobeFeatures").value === "true"),
experimentalFeatures: (document.getElementById("settingsEditor-experimentalFeatures").value === "true")
};
Expand Down Expand Up @@ -924,6 +933,11 @@ function registerKeyboardShortcuts() {
window.fsDisp.toggleHidedotfiles();
});

// Toggle list view in fsDisp
globalShortcut.register("Control+Shift+L", () => {
window.fsDisp.toggleListview();
});

// Hide on-screen keyboard visual feedback (#394)
globalShortcut.register("Control+Shift+P", () => {
window.keyboard.togglePasswordMode();
Expand Down
48 changes: 47 additions & 1 deletion src/assets/css/filesystem.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,52 @@ div#fs_disp_container > * > h3 {
overflow: hidden;
}

section#filesystem:not(.list-view) > div#fs_disp_container > div > h4 {
display: none;
}

section#filesystem.list-view > div#fs_disp_container {
grid-template-columns: 1fr;
grid-auto-rows: 2vh;
grid-gap: 0.5vh;
padding-right: 0.5vh;
}

section#filesystem.list-view > div#fs_disp_container:not(.disks) > * {
width: auto;
height: 2vh;
flex-direction: row;
justify-content: flex-start;
}

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > svg {
height: 2vh;
margin: 0;
width: auto;
margin-right: 2%;
}

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > h3 {
max-height: unset;
padding-top: .2vh;
text-align: left;
width: 32%;
}

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > h4 {
font-size: 1.3vh;
font-weight: normal;
padding-top: .2vh;
text-align: right;
overflow: hidden;
}

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > h4:nth-of-type(1) { width: 15%; }

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > h4:nth-of-type(2) { width: 10%; }

section#filesystem.list-view > div#fs_disp_container:not(.disks) > div > h4:nth-of-type(3) { width: 38%; }

div#fs_disp_container.disks {
display: flex;
align-items: center;
Expand All @@ -108,7 +154,7 @@ div#fs_disp_container.disks > * {
max-width: 8vw;
}

div.fs_disp_showDisks > svg, div.fs_disp_up > svg {
section#filesystem:not(.list-view) div.fs_disp_showDisks > svg, section#filesystem:not(.list-view) div.fs_disp_up > svg {
width: 4vh !important;
margin-bottom: 0.5vh;
margin-top: 0.5vh;
Expand Down
56 changes: 52 additions & 4 deletions src/classes/filesystem.class.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ class FilesystemDisplay {
const path = require("path");
this.cwd = [];
this.iconcolor = `rgb(${window.theme.r}, ${window.theme.g}, ${window.theme.b})`;
this._formatBytes = (a,b) => {if(0==a)return"0 Bytes";var c=1024,d=b||2,e=["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"],f=Math.floor(Math.log(a)/Math.log(c));return parseFloat((a/Math.pow(c,f)).toFixed(d))+" "+e[f]};
this.fileIconsMatcher = require("./assets/misc/file-icons-match.js");
this.icons = require("./assets/icons/file-icons.json");
this.edexIcons = {
Expand Down Expand Up @@ -127,14 +128,24 @@ class FilesystemDisplay {

this.toggleHidedotfiles = () => {
if (window.settings.hideDotfiles) {
container.setAttribute("class", "");
container.classList.remove("hideDotfiles");
window.settings.hideDotfiles = false;
} else {
container.setAttribute("class", "hideDotfiles");
container.classList.add("hideDotfiles");
window.settings.hideDotfiles = true;
}
};

this.toggleListview = () => {
if (window.settings.fsListView) {
container.classList.remove("list-view");
window.settings.fsListView = false;
} else {
container.classList.add("list-view");
window.settings.fsListView = true;
}
};

this.readFS = async dir => {
if (this.failed === true || this._reading) return false;
this._reading = true;
Expand Down Expand Up @@ -182,6 +193,8 @@ class FilesystemDisplay {
};

if (typeof fstat !== "undefined") {
e.lastAccessed = fstat.mtime;

if (fstat.isDirectory()) {
e.category = "dir";
e.type = "dir";
Expand All @@ -197,6 +210,7 @@ class FilesystemDisplay {
if (fstat.isFile()) {
e.category = "file";
e.type = "file";
e.size = fstat.size;
}
} else {
e.type = "system";
Expand Down Expand Up @@ -332,12 +346,17 @@ class FilesystemDisplay {
}

let icon = "";
let type = "";
switch(e.type) {
case "showDisks":
icon = this.icons.showDisks;
type = "--";
e.category = "showDisks";
break;
case "up":
icon = this.icons.up;
type = "--";
e.category = "up";
break;
case "symlink":
icon = this.icons.symlink;
Expand All @@ -353,35 +372,64 @@ class FilesystemDisplay {
break;
case "edex-theme":
icon = this.edexIcons.theme;
type = "eDEX-UI theme";
break;
case "edex-kblayout":
icon = this.edexIcons.kblayout;
type = "eDEX-UI keyboard layout";
break;
case "edex-settings":
icon = this.edexIcons.settings;
type = "eDEX-UI config file";
break;
case "system":
icon = this.edexIcons.settings;
break;
case "edex-themesDir":
icon = this.edexIcons.themesDir;
type = "eDEX-UI themes folder";
break;
case "edex-kblayoutsDir":
icon = this.edexIcons.kblayoutsDir;
type = "eDEX-UI keyboards folder";
break;
default:
icon = this.icons[this.fileIconsMatcher(e.name)];
if (e.type === "dir") type = "folder";
let iconName = this.fileIconsMatcher(e.name);
icon = this.icons[iconName];
if (typeof icon === "undefined") {
if (e.type === "file") icon = this.icons.file;
if (e.type === "dir") icon = this.icons.dir;
if (e.type === "dir") {
icon = this.icons.dir;
}
if (typeof icon === "undefined") icon = this.icons.other;
} else {
type = iconName.replace("icon-", "");
}
break;
}

if (type === "") type = e.type;

if (typeof e.size === "number") {
e.size = this._formatBytes(e.size);
} else {
e.size = "--";
}
if (typeof e.lastAccessed === "object") {
e.lastAccessed = e.lastAccessed.toString().substr(0, e.lastAccessed.toString().indexOf(" ("));
} else {
e.lastAccessed = "--";
}

filesDOM += `<div class="fs_disp_${e.type}${hidden} animationWait" onclick="${cmd}">
<svg viewBox="0 0 ${icon.width} ${icon.height}" fill="${this.iconcolor}">
${icon.svg}
</svg>
<h3>${e.name}</h3>
<h4>${type}</h4>
<h4>${e.size}</h4>
<h4>${e.lastAccessed}</h4>
</div>`;
});
this.filesContainer.innerHTML = filesDOM;
Expand Down

1 comment on commit 7fa92d2

@GitSquared
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Forgot to link the issue, it's #502

Please sign in to comment.