mirror of
https://github.com/gapmiss/blur.git
synced 2026-07-22 07:50:29 +00:00
v0.0.1
This commit is contained in:
gapmiss
parent
9dc5d3df94
commit
186d4966d2
9 changed files with 2404 additions and 164 deletions
25
.gitignore
vendored
25
.gitignore
vendored
|
|
@ -1,22 +1,3 @@
|
|||
# vscode
|
||||
.vscode
|
||||
|
||||
# Intellij
|
||||
*.iml
|
||||
.idea
|
||||
|
||||
# npm
|
||||
node_modules
|
||||
|
||||
# Don't include the compiled main.js file in the repo.
|
||||
# They should be uploaded to GitHub releases instead.
|
||||
main.js
|
||||
|
||||
# Exclude sourcemaps
|
||||
*.map
|
||||
|
||||
# obsidian
|
||||
data.json
|
||||
|
||||
# Exclude macOS Finder (System Explorer) View States
|
||||
.DS_Store
|
||||
.hotreload
|
||||
.DS_Store
|
||||
node_modules
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2023 gapmiss
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
94
main.js
Normal file
94
main.js
Normal file
|
|
@ -0,0 +1,94 @@
|
|||
/*
|
||||
THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
|
||||
if you want to view the source, please visit the github repository of this plugin
|
||||
*/
|
||||
|
||||
var __defProp = Object.defineProperty;
|
||||
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
||||
var __getOwnPropNames = Object.getOwnPropertyNames;
|
||||
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
||||
var __export = (target, all) => {
|
||||
for (var name in all)
|
||||
__defProp(target, name, { get: all[name], enumerable: true });
|
||||
};
|
||||
var __copyProps = (to, from, except, desc) => {
|
||||
if (from && typeof from === "object" || typeof from === "function") {
|
||||
for (let key of __getOwnPropNames(from))
|
||||
if (!__hasOwnProp.call(to, key) && key !== except)
|
||||
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
||||
}
|
||||
return to;
|
||||
};
|
||||
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
||||
|
||||
// main.ts
|
||||
var main_exports = {};
|
||||
__export(main_exports, {
|
||||
buildPostProcessor: () => buildPostProcessor,
|
||||
default: () => BlurPlugin
|
||||
});
|
||||
module.exports = __toCommonJS(main_exports);
|
||||
var import_obsidian = require("obsidian");
|
||||
var BlurPlugin = class extends import_obsidian.Plugin {
|
||||
async onload() {
|
||||
this.registerMarkdownCodeBlockProcessor("blur", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownCodeBlockProcessor("blur-brick", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownCodeBlockProcessor("blur-bone", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownPostProcessor(buildPostProcessor());
|
||||
console.log("%c Obsidian Blur Plugin loaded", "color:lime;");
|
||||
}
|
||||
onunload() {
|
||||
console.log("%c Obsidian Blur Plugin unloaded", "color:lime;");
|
||||
}
|
||||
async blurBlockHandler(type, source, el, ctx) {
|
||||
const element = document.createRange().createContextualFragment(source);
|
||||
let input = element;
|
||||
if (el.className === "block-language-blur-brick") {
|
||||
const block = el.createEl("div", { cls: "blur-brick-block" });
|
||||
let inputElement;
|
||||
inputElement = block.createEl("div", { text: "", cls: "blur-brick-innerblock" });
|
||||
source.split(/\W+/).forEach((w) => {
|
||||
let word = w.trim();
|
||||
if (word !== "") {
|
||||
inputElement.appendChild(createEl("code", { text: word, cls: "blur-brick" }));
|
||||
}
|
||||
});
|
||||
} else if (el.className === "block-language-blur-bone") {
|
||||
const block = el.createEl("div", { cls: "blur-bone-block" });
|
||||
let inputElement;
|
||||
inputElement = block.createEl("div", { text: "", cls: "blur-bone-innerblock" });
|
||||
source.split(/\W+/).forEach((w) => {
|
||||
let word = w.trim();
|
||||
if (word !== "") {
|
||||
inputElement.appendChild(createEl("code", { text: word, cls: "blur-bone" }));
|
||||
}
|
||||
});
|
||||
} else if (el.className === "block-language-blur") {
|
||||
const block = el.createEl("div", { cls: "blur-block" });
|
||||
let inputElement;
|
||||
console.log(source);
|
||||
inputElement = block.createEl("div", { text: source, cls: "blur-innerblock" });
|
||||
}
|
||||
}
|
||||
};
|
||||
function buildPostProcessor() {
|
||||
return (el) => {
|
||||
el.findAll("code").forEach((code) => {
|
||||
console.log(code);
|
||||
let text = code.innerText.trim();
|
||||
if (text.startsWith("~[]")) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass("blur-brick");
|
||||
code.innerText = blur;
|
||||
} else if (text.startsWith("~{}")) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass("blur-inline");
|
||||
code.innerText = blur;
|
||||
} else if (text.startsWith("~()")) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass("blur-bone");
|
||||
code.innerText = blur;
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
196
main.ts
196
main.ts
|
|
@ -1,137 +1,87 @@
|
|||
import { App, Editor, MarkdownView, Modal, Notice, Plugin, PluginSettingTab, Setting } from 'obsidian';
|
||||
import { MarkdownPostProcessor, Plugin} from 'obsidian';
|
||||
|
||||
// Remember to rename these classes and interfaces!
|
||||
|
||||
interface MyPluginSettings {
|
||||
interface BlurPluginSettings {
|
||||
mySetting: string;
|
||||
}
|
||||
|
||||
const DEFAULT_SETTINGS: MyPluginSettings = {
|
||||
const DEFAULT_SETTINGS: BlurPluginSettings = {
|
||||
mySetting: 'default'
|
||||
}
|
||||
|
||||
export default class MyPlugin extends Plugin {
|
||||
settings: MyPluginSettings;
|
||||
enum ComponentChoice {
|
||||
Default = "Default",
|
||||
}
|
||||
|
||||
export default class BlurPlugin extends Plugin {
|
||||
settings: BlurPluginSettings;
|
||||
|
||||
async onload() {
|
||||
await this.loadSettings();
|
||||
|
||||
// This creates an icon in the left ribbon.
|
||||
const ribbonIconEl = this.addRibbonIcon('dice', 'Sample Plugin', (evt: MouseEvent) => {
|
||||
// Called when the user clicks the icon.
|
||||
new Notice('This is a notice!');
|
||||
});
|
||||
// Perform additional things with the ribbon
|
||||
ribbonIconEl.addClass('my-plugin-ribbon-class');
|
||||
|
||||
// This adds a status bar item to the bottom of the app. Does not work on mobile apps.
|
||||
const statusBarItemEl = this.addStatusBarItem();
|
||||
statusBarItemEl.setText('Status Bar Text');
|
||||
|
||||
// This adds a simple command that can be triggered anywhere
|
||||
this.addCommand({
|
||||
id: 'open-sample-modal-simple',
|
||||
name: 'Open sample modal (simple)',
|
||||
callback: () => {
|
||||
new SampleModal(this.app).open();
|
||||
}
|
||||
});
|
||||
// This adds an editor command that can perform some operation on the current editor instance
|
||||
this.addCommand({
|
||||
id: 'sample-editor-command',
|
||||
name: 'Sample editor command',
|
||||
editorCallback: (editor: Editor, view: MarkdownView) => {
|
||||
console.log(editor.getSelection());
|
||||
editor.replaceSelection('Sample Editor Command');
|
||||
}
|
||||
});
|
||||
// This adds a complex command that can check whether the current state of the app allows execution of the command
|
||||
this.addCommand({
|
||||
id: 'open-sample-modal-complex',
|
||||
name: 'Open sample modal (complex)',
|
||||
checkCallback: (checking: boolean) => {
|
||||
// Conditions to check
|
||||
const markdownView = this.app.workspace.getActiveViewOfType(MarkdownView);
|
||||
if (markdownView) {
|
||||
// If checking is true, we're simply "checking" if the command can be run.
|
||||
// If checking is false, then we want to actually perform the operation.
|
||||
if (!checking) {
|
||||
new SampleModal(this.app).open();
|
||||
}
|
||||
|
||||
// This command will only show up in Command Palette when the check function returns true
|
||||
return true;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// This adds a settings tab so the user can configure various aspects of the plugin
|
||||
this.addSettingTab(new SampleSettingTab(this.app, this));
|
||||
|
||||
// If the plugin hooks up any global DOM events (on parts of the app that doesn't belong to this plugin)
|
||||
// Using this function will automatically remove the event listener when this plugin is disabled.
|
||||
this.registerDomEvent(document, 'click', (evt: MouseEvent) => {
|
||||
console.log('click', evt);
|
||||
});
|
||||
|
||||
// When registering intervals, this function will automatically clear the interval when the plugin is disabled.
|
||||
this.registerInterval(window.setInterval(() => console.log('setInterval'), 5 * 60 * 1000));
|
||||
this.registerMarkdownCodeBlockProcessor("blur", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownCodeBlockProcessor("blur-brick", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownCodeBlockProcessor("blur-bone", this.blurBlockHandler.bind(this, null));
|
||||
this.registerMarkdownPostProcessor(
|
||||
buildPostProcessor()
|
||||
);
|
||||
console.log("%c Obsidian Blur Plugin loaded", 'color:lime;');
|
||||
}
|
||||
|
||||
|
||||
onunload() {
|
||||
|
||||
console.log("%c Obsidian Blur Plugin unloaded", 'color:lime;');
|
||||
}
|
||||
|
||||
async loadSettings() {
|
||||
this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
|
||||
}
|
||||
|
||||
async saveSettings() {
|
||||
await this.saveData(this.settings);
|
||||
}
|
||||
}
|
||||
|
||||
class SampleModal extends Modal {
|
||||
constructor(app: App) {
|
||||
super(app);
|
||||
}
|
||||
|
||||
onOpen() {
|
||||
const {contentEl} = this;
|
||||
contentEl.setText('Woah!');
|
||||
}
|
||||
|
||||
onClose() {
|
||||
const {contentEl} = this;
|
||||
contentEl.empty();
|
||||
}
|
||||
}
|
||||
|
||||
class SampleSettingTab extends PluginSettingTab {
|
||||
plugin: MyPlugin;
|
||||
|
||||
constructor(app: App, plugin: MyPlugin) {
|
||||
super(app, plugin);
|
||||
this.plugin = plugin;
|
||||
}
|
||||
|
||||
display(): void {
|
||||
const {containerEl} = this;
|
||||
|
||||
containerEl.empty();
|
||||
|
||||
containerEl.createEl('h2', {text: 'Settings for my awesome plugin.'});
|
||||
|
||||
new Setting(containerEl)
|
||||
.setName('Setting #1')
|
||||
.setDesc('It\'s a secret')
|
||||
.addText(text => text
|
||||
.setPlaceholder('Enter your secret')
|
||||
.setValue(this.plugin.settings.mySetting)
|
||||
.onChange(async (value) => {
|
||||
console.log('Secret: ' + value);
|
||||
this.plugin.settings.mySetting = value;
|
||||
await this.plugin.saveSettings();
|
||||
}));
|
||||
async blurBlockHandler(type: ComponentChoice, source: string, el: HTMLElement, ctx: any): Promise<any> {
|
||||
const element:any = document.createRange().createContextualFragment(source)
|
||||
let input = element
|
||||
// console.log(input);
|
||||
if (el.className==='block-language-blur-brick') {
|
||||
const block = el.createEl("div", {cls: "blur-brick-block"})
|
||||
let inputElement: HTMLElement
|
||||
inputElement = block.createEl("div", {text: '', cls: "blur-brick-innerblock"})
|
||||
source.split(/\W+/).forEach((w:string) => {
|
||||
let word = w.trim();
|
||||
if (word !== '') {
|
||||
inputElement.appendChild(createEl('code', {text: word, cls: "blur-brick" }));
|
||||
}
|
||||
})
|
||||
}
|
||||
else if (el.className==='block-language-blur-bone') {
|
||||
const block = el.createEl("div", {cls: "blur-bone-block"})
|
||||
let inputElement: HTMLElement
|
||||
inputElement = block.createEl("div", {text: '', cls: "blur-bone-innerblock"})
|
||||
source.split(/\W+/).forEach((w:string) => {
|
||||
let word = w.trim();
|
||||
if (word !== '') {
|
||||
inputElement.appendChild(createEl('code', {text: word, cls: "blur-bone"}));
|
||||
}
|
||||
})
|
||||
}
|
||||
else if (el.className==='block-language-blur') {
|
||||
const block = el.createEl("div", {cls: "blur-block"})
|
||||
let inputElement: HTMLElement
|
||||
console.log(source);
|
||||
inputElement = block.createEl("div", {text: source, cls: "blur-innerblock"})
|
||||
}
|
||||
}
|
||||
}
|
||||
export function buildPostProcessor(): MarkdownPostProcessor {
|
||||
return (el) => {
|
||||
el.findAll("code").forEach((code) => {
|
||||
console.log(code);
|
||||
let text = code.innerText.trim();
|
||||
if (text.startsWith('~[]')) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass('blur-brick');
|
||||
code.innerText=blur;
|
||||
}
|
||||
else if (text.startsWith('~{}')) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass('blur-inline');
|
||||
code.innerText=blur;
|
||||
}
|
||||
else if (text.startsWith("~()")) {
|
||||
let blur = text.substring(3).trim();
|
||||
code.addClass('blur-bone');
|
||||
code.innerText=blur;
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +1,11 @@
|
|||
{
|
||||
"id": "obsidian-sample-plugin",
|
||||
"name": "Sample Plugin",
|
||||
"version": "1.0.0",
|
||||
"id": "obsidian-blur",
|
||||
"name": "Obsidian Blur",
|
||||
"version": "0.0.1",
|
||||
"minAppVersion": "0.15.0",
|
||||
"description": "This is a sample plugin for Obsidian. This plugin demonstrates some of the capabilities of the Obsidian API.",
|
||||
"author": "Obsidian",
|
||||
"authorUrl": "https://obsidian.md",
|
||||
"fundingUrl": "https://obsidian.md/pricing",
|
||||
"description": "Obsidian plugin that enables an alternate display of blocks of text.",
|
||||
"author": "@gapmiss",
|
||||
"authorUrl": "https://github.com/gapmiss",
|
||||
"fundingUrl": "https://obsmd.io",
|
||||
"isDesktopOnly": false
|
||||
}
|
||||
|
|
|
|||
2140
package-lock.json
generated
Normal file
2140
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "obsidian-sample-plugin",
|
||||
"version": "1.0.0",
|
||||
"description": "This is a sample plugin for Obsidian (https://obsidian.md)",
|
||||
"name": "obsidian-blur",
|
||||
"version": "0.0.1",
|
||||
"description": "Obsidian plugin that enables an alternate display of blocks of text.",
|
||||
"main": "main.js",
|
||||
"scripts": {
|
||||
"dev": "node esbuild.config.mjs",
|
||||
|
|
|
|||
70
styles.css
70
styles.css
|
|
@ -1,8 +1,62 @@
|
|||
/*
|
||||
|
||||
This CSS file will be included with your plugin, and
|
||||
available in the app when your plugin is enabled.
|
||||
|
||||
If your plugin does not need CSS, delete this file.
|
||||
|
||||
*/
|
||||
:root {
|
||||
--obsidian-blur-bone-border-radius:1.33em;
|
||||
--obsidian-blur-bone-line-height:1;
|
||||
--obsidian-blur-brick-border-radius:.33em;
|
||||
--obsidian-blur-brick-line-height:1;
|
||||
--obsidian-blur-filter:3.3px;
|
||||
}
|
||||
body.theme-dark {
|
||||
--obsidian-blur-brick-color:hsla(220,100%,100%,.33);
|
||||
--obsidian-blur-bone-color:hsla(220,100%,100%,.33);
|
||||
}
|
||||
body.theme-light {
|
||||
--obsidian-blur-brick-color:hsla(220,19%,6%,.33);
|
||||
--obsidian-blur-bone-color: hsla(220,19%,6%,.33);
|
||||
}
|
||||
div.blur-block {
|
||||
filter: blur(var(--obsidian-blur-filter)) !important;
|
||||
-webkit-filter: blur(var(--obsidian-blur-filter)) !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.obsidian-blur-hover div.blur-block:hover {
|
||||
filter: blur(0px) !important;
|
||||
-webkit-filter: blur(0px) !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
code.blur-inline {
|
||||
filter: blur(var(--obsidian-blur-filter)) !important;
|
||||
-webkit-filter: blur(var(--obsidian-blur-filter)) !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.obsidian-blur-hover code.blur-inline:hover {
|
||||
filter: blur(0) !important;
|
||||
-webkit-filter: blur(0px) !important;
|
||||
}
|
||||
code.blur-bone {
|
||||
background-color: var(--obsidian-blur-bone-color) !important;
|
||||
border-radius: var(--obsidian-blur-bone-border-radius) !important;
|
||||
color: transparent !important;
|
||||
line-height: var(--obsidian-blur-bone-line-height) !important;
|
||||
}
|
||||
.obsidian-blur-hover code.blur-bone:hover {
|
||||
background-color: transparent !important;
|
||||
color: inherit !important;
|
||||
}
|
||||
code.blur-brick {
|
||||
background-color: var(--obsidian-blur-brick-color) !important;
|
||||
border-radius: var(--obsidian-blur-brick-border-radius) !important;
|
||||
color: transparent !important;
|
||||
line-height: var(--obsidian-blur-brick-line-height) !important;
|
||||
}
|
||||
.obsidian-blur-hover code.blur-brick:hover {
|
||||
background-color: transparent !important;
|
||||
color: inherit !important;
|
||||
}
|
||||
.blur-bone-innerblock code.blur-bone {
|
||||
margin-right: 10px !important;
|
||||
margin-block: calc(2 + var(--obsidian-blur-bone-line-height)px);
|
||||
}
|
||||
.blur-brick-innerblock code.blur-brick {
|
||||
margin-right: 3px;
|
||||
padding-right: 6px;
|
||||
}
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
{
|
||||
"1.0.0": "0.15.0"
|
||||
"0.0.1": "0.15.0"
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue