Change the system to not use a stylesheet at all and work based on inline styling
This commit is contained in:
Oliver Akins
parent
8349757af4
commit
68953651dc
3 changed files with 35 additions and 109 deletions
|
|
@ -1,5 +1,4 @@
|
|||
import FileHider from "../main";
|
||||
import { findStyleSheet } from "../utils";
|
||||
|
||||
// The command used to toggle the visibility.
|
||||
export class VisibilityToggleCommand {
|
||||
|
|
@ -8,9 +7,6 @@ export class VisibilityToggleCommand {
|
|||
id: 'oa-fh-toggle-visibility',
|
||||
name: 'Toggle Visibility',
|
||||
callback: () => {
|
||||
if (!plugin.style) {
|
||||
plugin.style = findStyleSheet();
|
||||
};
|
||||
plugin.toggleVisibility();
|
||||
}
|
||||
});
|
||||
|
|
|
|||
100
src/main.ts
100
src/main.ts
|
|
@ -1,70 +1,61 @@
|
|||
import { ManageHiddenDirectories } from './settings/manageHiddenFolders';
|
||||
import { VisibilityToggleCommand } from './commands/toggleVisibility';
|
||||
import { VisibilityToggleSetting } from './settings/hiddenToggle';
|
||||
import { App, Plugin, PluginSettingTab, TFolder } from 'obsidian';
|
||||
import { App, Notice, Plugin, PluginSettingTab, TFolder } from 'obsidian';
|
||||
import { ManageHiddenFiles } from './settings/manageHiddenFiles';
|
||||
import { createStyleLine, findStyleSheet } from './utils';
|
||||
import { changePathVisibility } from './utils';
|
||||
|
||||
interface FileHiderSettings {
|
||||
hidden: boolean;
|
||||
hiddenFiles: string[];
|
||||
hiddenFolders: string[];
|
||||
hiddenList: string[];
|
||||
};
|
||||
|
||||
|
||||
export default class FileHider extends Plugin {
|
||||
settings: FileHiderSettings = {
|
||||
hidden: true,
|
||||
hiddenFiles: [],
|
||||
hiddenFolders: [],
|
||||
hiddenList: [],
|
||||
};
|
||||
|
||||
style: CSSStyleSheet|null = null;
|
||||
|
||||
hasRibbon: boolean = false;
|
||||
|
||||
async onload() {
|
||||
await this.loadSettings();
|
||||
|
||||
this.registerEvent(
|
||||
this.app.workspace.on(`file-menu`, (menu, file) => {
|
||||
if (!this.style) {
|
||||
this.style = findStyleSheet();
|
||||
};
|
||||
if (file instanceof TFolder) {
|
||||
menu.addItem((i) => {
|
||||
if (this.settings.hiddenFolders.includes(file.path)) {
|
||||
if (this.settings.hiddenList.includes(file.path)) {
|
||||
i.setTitle(`Unhide Folder`)
|
||||
.setIcon(`eye`)
|
||||
.onClick(() => {
|
||||
this.unhideFolder(file.path);
|
||||
this.unhidePath(file.path);
|
||||
});
|
||||
} else {
|
||||
i.setTitle(`Hide Folder`)
|
||||
.setIcon(`eye-off`)
|
||||
.onClick(() => {
|
||||
let rule = createStyleLine(`folder`, file.path);
|
||||
this.style.insertRule(rule);
|
||||
this.settings.hiddenFolders.push(file.path);
|
||||
changePathVisibility(file.path, this.settings.hidden);
|
||||
this.settings.hiddenList.push(file.path);
|
||||
this.saveSettings();
|
||||
});
|
||||
};
|
||||
});
|
||||
} else {
|
||||
menu.addItem((i) => {
|
||||
if (this.settings.hiddenFiles.includes(file.path)) {
|
||||
if (this.settings.hiddenList.includes(file.path)) {
|
||||
i.setTitle(`Unhide File`)
|
||||
.setIcon(`eye`)
|
||||
.onClick((e) => {
|
||||
this.unhideFile(file.path);
|
||||
this.unhidePath(file.path);
|
||||
});
|
||||
} else {
|
||||
i.setTitle(`Hide File`)
|
||||
.setIcon(`eye-off`)
|
||||
.onClick((e) => {
|
||||
let rule = createStyleLine(`file`, file.path);
|
||||
this.style.insertRule(rule);
|
||||
this.settings.hiddenFiles.push(file.path);
|
||||
changePathVisibility(file.path, this.settings.hidden);
|
||||
this.settings.hiddenList.push(file.path);
|
||||
this.saveSettings();
|
||||
});
|
||||
};
|
||||
|
|
@ -73,8 +64,13 @@ export default class FileHider extends Plugin {
|
|||
})
|
||||
);
|
||||
|
||||
this.app.workspace.onLayoutReady(() => {
|
||||
for (const path of this.settings.hiddenList) {
|
||||
changePathVisibility(path, this.settings.hidden);
|
||||
};
|
||||
});
|
||||
|
||||
new VisibilityToggleCommand(this);
|
||||
this.initialLoadStyle();
|
||||
this.addSettingTab(new FileHiderSettingsTab(this.app, this));
|
||||
}
|
||||
|
||||
|
|
@ -82,27 +78,6 @@ export default class FileHider extends Plugin {
|
|||
this.saveSettings();
|
||||
};
|
||||
|
||||
/*
|
||||
This is the method that handles re-hiding files when Obsidian starts, or
|
||||
when the plugin is reloaded after being unloaded/disabled.
|
||||
*/
|
||||
async initialLoadStyle() {
|
||||
console.log(`attempting to get the stylesheet`)
|
||||
this.style = findStyleSheet();
|
||||
if (this.style) {
|
||||
for (var file of this.settings.hiddenFiles) {
|
||||
let r = createStyleLine(`file`, file);
|
||||
this.style.insertRule(r);
|
||||
};
|
||||
for (var folder of this.settings.hiddenFolders) {
|
||||
let r = createStyleLine(`folder`, folder);
|
||||
this.style.insertRule(r);
|
||||
};
|
||||
return
|
||||
};
|
||||
setTimeout(() => this.initialLoadStyle(), 1_000);
|
||||
};
|
||||
|
||||
/*
|
||||
Loads the config settings, with defaults created where needed.
|
||||
*/
|
||||
|
|
@ -119,44 +94,19 @@ export default class FileHider extends Plugin {
|
|||
Enables/Disables the file visibility based. (gets the stylesheet if needed)
|
||||
*/
|
||||
toggleVisibility() {
|
||||
if (!this.style) {
|
||||
this.style = findStyleSheet();
|
||||
};
|
||||
this.style.disabled = this.settings.hidden;
|
||||
this.settings.hidden = !this.settings.hidden;
|
||||
this.saveSettings();
|
||||
};
|
||||
|
||||
unhideFolder(folder: string) {
|
||||
let i = this.settings.hiddenFolders.indexOf(folder);
|
||||
this.settings.hiddenFolders.splice(i, 1);
|
||||
|
||||
// Find and remove the CSS style from the system
|
||||
for (var j in this.style.cssRules) {
|
||||
let rule = this.style.cssRules[j];
|
||||
if (rule.cssText == createStyleLine(`folder`, folder)) {
|
||||
this.style.deleteRule(parseInt(j));
|
||||
};
|
||||
for (const path of this.settings.hiddenList) {
|
||||
changePathVisibility(path, this.settings.hidden);
|
||||
};
|
||||
this.saveSettings();
|
||||
};
|
||||
|
||||
unhideFile(file: string) {
|
||||
let i = this.settings.hiddenFiles.indexOf(file);
|
||||
this.settings.hiddenFiles.splice(i, 1);
|
||||
|
||||
// Find and remove the CSS style from the system
|
||||
for (var j in this.style.cssRules) {
|
||||
try { parseInt(j) } catch (e) { console.log(`skipping`, j); continue; };
|
||||
|
||||
let rule = this.style.cssRules[j];
|
||||
if (rule.cssText == createStyleLine(`file`, file)) {
|
||||
this.style.deleteRule(parseInt(j));
|
||||
break;
|
||||
};
|
||||
};
|
||||
unhidePath(path: string) {
|
||||
let i = this.settings.hiddenList.indexOf(path);
|
||||
changePathVisibility(path, false);
|
||||
this.settings.hiddenList.splice(i, 1);
|
||||
this.saveSettings();
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
|
|
|||
40
src/utils.ts
40
src/utils.ts
|
|
@ -1,32 +1,12 @@
|
|||
import { Notice } from "obsidian";
|
||||
|
||||
/**
|
||||
* Creates a CSS rule that is used to hide the file or folder from the file
|
||||
* explorer when it is enabled.
|
||||
*
|
||||
* @param type The type of file it is
|
||||
* @param path The full filepath of the file/folder from the root of the vault
|
||||
* @returns The CSS string that is used to target the file or folder
|
||||
*/
|
||||
export function createStyleLine(type: string, path: string) {
|
||||
return `.nav-${type} > [data-path="${path}"] { display: none; }`;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Locates the File Hider stylesheet within Obsidian to allow us to modify it
|
||||
* dynamically, for enabling and disabling it in order to show/hide the files
|
||||
* and directories in the file explorer
|
||||
*
|
||||
* @returns The stylesheet if it was found
|
||||
*/
|
||||
export function findStyleSheet() {
|
||||
for (var i in document.styleSheets) {
|
||||
let style = document.styleSheets[i];
|
||||
//@ts-ignore
|
||||
let content = style?.ownerNode?.innerText;
|
||||
if (content && content.startsWith(`/* FILE HIDER */`)) {
|
||||
return style;
|
||||
};
|
||||
export function changePathVisibility(path: string, hide: boolean) {
|
||||
let n = document.querySelector(`[data-path="${path}"]`);
|
||||
if (!n) {
|
||||
return;
|
||||
};
|
||||
let p = n.parentElement
|
||||
if (hide) {
|
||||
p.style.display = `none`
|
||||
} else {
|
||||
p.style.display = ``;
|
||||
};
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue