cleaned up code, added icon, removed ribbon icon

Author: juliang22

README.md

@@ -21,7 +21,7 @@ This plugin solves this issue by allowing you to:
   - Title that is pasted when 'Open Video Player' hotkey is used
 
 ## Usage
-- Highlight a video url and select either the Ribbon clock icon or use the 'Open Video Player' hotkey
+- Highlight a video url and use the 'Open Video Player' hotkey
 - Jot down notes and anytime you want to insert a timestamp, press the registered hotkey
 - Toggle pausing/playing the video by using hotkey (my default is option space)
 - Open videos at the timestamp you left off on (this is reset if plugin is disabled)

main.js

@@ -1,28 +1,20 @@
-import { Editor, MarkdownView, Notice, Plugin, } from 'obsidian';
+import { Editor, MarkdownView, Plugin, } from 'obsidian';
 import ReactPlayer from 'react-player/lazy'
 
 import { VideoView, VIDEO_VIEW } from './view/VideoView';
 import { TimestampPluginSettings, TimestampPluginSettingTab, DEFAULT_SETTINGS } from 'settings';
-import { SetupVideoModal } from 'ribbonModal';
 
 
 const ERRORS: { [key: string]: string } = {
 	"INVALID_URL": "\n> [!error] Invalid Video URL\n> The highlighted link is not a valid video url. Please try again with a valid link.\n",
-	"NO_ACTIVE_VIDEO": "\n> [!caution] Select Video\n> A video needs to be opened before using this hotkey.\n Click the TimestampVideo ribbon icon or highlight your video link and input your 'Open video player' hotkey to register a video.\n",
+	"NO_ACTIVE_VIDEO": "\n> [!caution] Select Video\n> A video needs to be opened before using this hotkey.\n Highlight your video link and input your 'Open video player' hotkey to register a video.\n",
 }
 
 export default class TimestampPlugin extends Plugin {
 	settings: TimestampPluginSettings;
 	player: ReactPlayer;
 	setPlaying: React.Dispatch<React.SetStateAction<boolean>>;
 	editor: Editor;
-	// Helper function to validate url and activate view
-	validateURL = (url: string) => {
-		url = url.trim();
-		if (!ReactPlayer.canPlay(url)) return ERRORS["INVALID_URL"];
-		if (this.settings.noteTitle) return "\n" + this.settings.noteTitle
-		return "";
-	}
 
 	async onload() {
 		// Register view
@@ -34,17 +26,6 @@ export default class TimestampPlugin extends Plugin {
 		// Register settings
 		await this.loadSettings();
 
-		// Create ribbon button that opens modal to use for inserting video url
-		this.addRibbonIcon("clock", "Timestamp Notes", () => {
-			new SetupVideoModal(this.app, async (url) => {
-				new Notice(`Opening, ${url}!`)
-				this.validateURL(url);
-				// Activate the view with the valid link
-				this.activateView(url);
-				if (this.editor) this.editor.replaceSelection("```timestamp-url \n " + url + "\n ```\n");
-			}).open();
-		});
-
 		// Markdown processor that turns timestamps into buttons
 		this.registerMarkdownCodeBlockProcessor("timestamp", (source, el, ctx) => {
 			// Match mm:ss or hh:mm:ss timestamp format
@@ -85,7 +66,7 @@ export default class TimestampPlugin extends Plugin {
 				button.style.color = this.settings.urlTextColor;
 
 				button.addEventListener("click", () => {
-					this.editor ? this.activateView(url, this.editor) : this.activateView(url);
+					this.activateView(url, this.editor);
 				});
 			} else {
 				if (this.editor) {
@@ -99,14 +80,18 @@ export default class TimestampPlugin extends Plugin {
 			id: 'trigger-player',
 			name: 'Open video player (copy video url and use hotkey)',
 			editorCallback: (editor: Editor, view: MarkdownView) => {
-				// Get selected text and match against video url to convert link to video video id => also triggers activateView in validateURL
+				// Get selected text and match against video url to convert link to video video id
 				const url = editor.getSelection().trim();
 
 				// Activate the view with the valid link
 				if (ReactPlayer.canPlay(url)) {
 					this.activateView(url, editor);
-					editor.replaceSelection("```timestamp-url \n " + url + "\n ```\n");
+					this.settings.noteTitle ?
+						editor.replaceSelection("\n" + this.settings.noteTitle + "\n" + "```timestamp-url \n " + url + "\n ```\n") :
+						editor.replaceSelection("```timestamp-url \n " + url + "\n ```\n")
 					this.editor = editor;
+				} else {
+					editor.replaceSelection(ERRORS["INVALID_URL"])
 				}
 				editor.setCursor(editor.getCursor().line + 1)
 			}
@@ -119,11 +104,11 @@ export default class TimestampPlugin extends Plugin {
 			editorCallback: (editor: Editor, view: MarkdownView) => {
 				if (!this.player) {
 					editor.replaceSelection(ERRORS["NO_ACTIVE_VIDEO"])
+					return
 				}
 
-				const leadingZero = (num: number) => num < 10 ? "0" + num.toFixed(0) : num.toFixed(0);
-
 				// convert current video time into timestamp
+				const leadingZero = (num: number) => num < 10 ? "0" + num.toFixed(0) : num.toFixed(0);
 				const totalSeconds = Number(this.player.getCurrentTime().toFixed(2));
 				const hours = Math.floor(totalSeconds / 3600);
 				const minutes = Math.floor((totalSeconds - (hours * 3600)) / 60);
@@ -156,7 +141,7 @@ export default class TimestampPlugin extends Plugin {
 	}
 
 	// This is called when a valid url is found => it activates the View which loads the React view
-	async activateView(url: string, editor: Editor = null) {
+	async activateView(url: string, editor: Editor) {
 		this.app.workspace.detachLeavesOfType(VIDEO_VIEW);
 
 		await this.app.workspace.getRightLeaf(false).setViewState({

main.ts

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-timestamp-notes",
 	"name": "Timestamp Notes",
-	"version": "1.0.6",
+	"version": "1.0.7",
 	"minAppVersion": "0.12.0",
 	"description": "This plugin allows side-by-side notetaking with videos. Annotate your notes with timestamps to directly control the video and remember where each note comes from.",
 	"author": "Julian Grunauer",