Some more changes

main.ts

@@ -1,90 +1,50 @@
-import { App, Editor, MarkdownView, Modal, Notice, Plugin, PluginSettingTab, Setting } from 'obsidian';
+import { App, Editor, MarkdownView, Plugin, PluginSettingTab, Setting } from 'obsidian';
 
-// Remember to rename these classes and interfaces!
+interface CodeBlockPluginSettings {
-
-interface MyPluginSettings {
 	mySetting: string;
 }
 
-const DEFAULT_SETTINGS: MyPluginSettings = {
+const DEFAULT_SETTINGS: CodeBlockPluginSettings = {
 	mySetting: 'default'
 }
 
-export default class MyPlugin extends Plugin {
+export default class CodeBlockPlugin extends Plugin {
-	settings: MyPluginSettings;
+	settings: CodeBlockPluginSettings;
 
 	async onload() {
 		await this.loadSettings();
 
-		// This creates an icon in the left ribbon.
-		const ribbonIconEl = this.addRibbonIcon('dice', 'Coders 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('Nisse!');
-
-		// 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: 'Code block',
-			name: 'Sample editor command',
+			name: 'Toggle code block',
 			editorCallback: (editor: Editor, view: MarkdownView) => {
+				console.log(this.settings);
 				const selection = editor.getSelection();
+				if (selection.length == 0) {
+					editor.replaceSelection('```\n\n```\n');
+					return;
+				}
+
 				const hljs = require('highlight.js/lib/common');
-				console.log(hljs);
 				const highlight = hljs.highlightAuto(selection, ["java", "javascript", "sql", "kotlin", "python", "groovy", "xml", "html", "yaml", "typescript"]);
 				const language = highlight.language;
 				console.log(highlight);
-				const sel = selection.length == 0 ? '\n' : selection;
+				console.log(selection);
-				const lang = selection.length == 0 || language == undefined ? '' : language;
+				console.log(language);
-				console.log(sel);
 
-				editor.replaceSelection('```' + lang + '\n' + sel + '\n```' + '\n');
+				editor.replaceSelection('```' + language + '\n' + selection + '\n```' + '\n');
-			}
-		});
-		// 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));
+		this.addSettingTab(new CodeBlockTab(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) => {
+		this.registerDomEvent(document, 'paste', (event: ClipboardEvent) => {
-			console.log('click', evt);
+			const paste = (event.clipboardData).getData('text');
+			console.log('paste', paste);
 		});
-
-		// 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));
 	}
 
 	onunload() {
@@ -100,26 +60,11 @@ export default class MyPlugin extends Plugin {
 	}
 }
 
-class SampleModal extends Modal {
-	constructor(app: App) {
-		super(app);
-	}
 
-	onOpen() {
+class CodeBlockTab extends PluginSettingTab {
-		const {contentEl} = this;
+	plugin: CodeBlockPlugin;
-		contentEl.setText('Woah!');
-	}
 
-	onClose() {
+	constructor(app: App, plugin: CodeBlockPlugin) {
-		const {contentEl} = this;
-		contentEl.empty();
-	}
-}
-
-class SampleSettingTab extends PluginSettingTab {
-	plugin: MyPlugin;
-
-	constructor(app: App, plugin: MyPlugin) {
 		super(app, plugin);
 		this.plugin = plugin;
 	}
@@ -129,7 +74,7 @@ class SampleSettingTab extends PluginSettingTab {
 
 		containerEl.empty();
 
-		containerEl.createEl('h2', {text: 'Settings for my awesome plugin.'});
+		containerEl.createEl('h2', {text: 'Settings for code-block plugin.'});
 
 		new Setting(containerEl)
 			.setName('Setting #1')

package-lock.json

@@ -8,15 +8,13 @@
 			"name": "obsidian-sample-plugin",
 			"version": "1.0.1",
 			"license": "MIT",
-			"dependencies": {
-				"algorithmia": "^0.3.10"
-			},
 			"devDependencies": {
 				"@types/node": "^16.11.6",
 				"@typescript-eslint/eslint-plugin": "^5.2.0",
 				"@typescript-eslint/parser": "^5.2.0",
 				"builtin-modules": "^3.2.0",
 				"esbuild": "0.13.12",
+				"highlight.js": "^11.5.1",
 				"obsidian": "latest",
 				"tslib": "2.3.1",
 				"typescript": "4.4.4"
@@ -397,11 +395,6 @@
 				"url": "https://github.com/sponsors/epoberezkin"
 			}
 		},
-		"node_modules/algorithmia": {
-			"version": "0.3.10",
-			"resolved": "https://registry.npmjs.org/algorithmia/-/algorithmia-0.3.10.tgz",
-			"integrity": "sha512-earvZTSBf+Kuu25AArC6T5yjBXy+uMnkFTGLerSoOZRy2J5WqHMDE0I7dfYMa2qnIvEc5Vd6wcBc4Dl+dyNDlg=="
-		},
 		"node_modules/ansi-regex": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -1268,6 +1261,15 @@
 				"node": ">=8"
 			}
 		},
+		"node_modules/highlight.js": {
+			"version": "11.5.1",
+			"resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.5.1.tgz",
+			"integrity": "sha512-LKzHqnxr4CrD2YsNoIf/o5nJ09j4yi/GcH5BnYz9UnVpZdS4ucMgvP61TDty5xJcFGRjnH4DpujkS9bHT3hq0Q==",
+			"dev": true,
+			"engines": {
+				"node": ">=12.0.0"
+			}
+		},
 		"node_modules/ignore": {
 			"version": "5.2.0",
 			"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz",
@@ -2181,11 +2183,6 @@
 				"uri-js": "^4.2.2"
 			}
 		},
-		"algorithmia": {
-			"version": "0.3.10",
-			"resolved": "https://registry.npmjs.org/algorithmia/-/algorithmia-0.3.10.tgz",
-			"integrity": "sha512-earvZTSBf+Kuu25AArC6T5yjBXy+uMnkFTGLerSoOZRy2J5WqHMDE0I7dfYMa2qnIvEc5Vd6wcBc4Dl+dyNDlg=="
-		},
 		"ansi-regex": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -2807,6 +2804,12 @@
 			"dev": true,
 			"peer": true
 		},
+		"highlight.js": {
+			"version": "11.5.1",
+			"resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.5.1.tgz",
+			"integrity": "sha512-LKzHqnxr4CrD2YsNoIf/o5nJ09j4yi/GcH5BnYz9UnVpZdS4ucMgvP61TDty5xJcFGRjnH4DpujkS9bHT3hq0Q==",
+			"dev": true
+		},
 		"ignore": {
 			"version": "5.2.0",
 			"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz",

styles.css

@@ -1,4 +0,0 @@
-/* Sets all the text color to red! */
-body {
-    color: red;
-}