Merge pull request #209 from PKM-er/feat/hover

Feat/hover

manifest.json

@@ -1,8 +1,8 @@
 {
 	"id": "surfing",
 	"name": "Surfing",
-	"version": "0.8.16",
-	"minAppVersion": "1.0.0",
+	"version": "0.9.0",
+	"minAppVersion": "1.4.0",
 	"description": "Surf the Net in Obsidian.",
 	"author": "Boninall & Windily-cloud",
 	"authorUrl": "https://github.com/Quorafind",
@@ -12,4 +12,4 @@
 		"爱发电": "https://afdian.net/a/boninall",
 		"支付宝": "https://cdn.jsdelivr.net/gh/Quorafind/.github@main/IMAGE/%E6%94%AF%E4%BB%98%E5%AE%9D%E4%BB%98%E6%AC%BE%E7%A0%81.jpg"
 	}
-}
+}

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "surfing",
-	"version": "0.8.16",
+	"version": "0.9.0",
 	"description": "Use surfing to surf the net in Obsidian.",
 	"main": "main.js",
 	"scripts": {

src/App.css

@@ -810,6 +810,10 @@ div[data-type^="surfing-tab-tree"] ul li {
 	width: 800px;
 }
 
-.surfing-hover-popover .surfing-hover-popover-container, .surfing-hover-popover .wb-view-content.node-insert-event {
+.surfing-embed-website {
+	height: 800px;
+}
+
+.surfing-hover-popover .surfing-hover-popover-container, .surfing-hover-popover .wb-view-content.node-insert-event, .surfing-embed-website .surfing-embed-website-container, .surfing-embed-website .surfing-embed-website-container .wb-view-content.node-insert-event {
 	height: 100%;
 }

src/component/suggester/bookmarkSuggester.ts

@@ -79,6 +79,8 @@ export class BookmarkSuggester extends TextInputSuggest<Bookmark> {
 			return;
 		}
 
+		console.log(item.url);
+
 		SurfingView.spawnWebBrowserView(false, { url: item.url });
 		this.close();
 		return;

src/component/suggester/searchSuggester.ts

@@ -46,10 +46,12 @@ export class SearchEngineSuggester extends TextInputSuggest<string> {
 		if (/^\s{0,}$/.test(currentInputValue)) return;
 
 		const currentSearchEngine = this.searchEngines.find((engine) => engine.name === item);
+		console.log(currentSearchEngine, item);
+
+
 		const url = (currentSearchEngine ? currentSearchEngine.url : SEARCH_ENGINES[0].url);
 
 		const finalUrl = getComposedUrl(url, currentInputValue);
-
 		SurfingView.spawnWebBrowserView(false, {url: finalUrl});
 	}
 }

src/surfingIndex.ts

@@ -7,7 +7,7 @@ import {
 	MarkdownPreviewRendererStatic,
 	MarkdownView,
 	Menu, Modal, moment,
-	Notice,
+	Notice, parseYaml,
 	Plugin, requireApiVersion,
 	setIcon,
 	TFile,
@@ -63,6 +63,8 @@ export default class SurfingPlugin extends Plugin {
 		this.updateEmptyLeaves(false);
 		this.registerContextMenu();
 		this.registerCustomURI();
+		this.registerCodeBlock();
+		this.registerHoverPopover();
 
 		this.registerHoverPopover();
 
@@ -80,6 +82,8 @@ export default class SurfingPlugin extends Plugin {
 		this.registerCustomIcon();
 		this.patchEmptyView();
 		this.patchMarkdownPreviewRenderer();
+
+
 		if (requireApiVersion("1.1.0") && this.settings.useWebview) {
 			this.patchCanvasNode();
 			this.patchCanvas();
@@ -134,7 +138,7 @@ export default class SurfingPlugin extends Plugin {
 	private addHeaderAndSearchBar(currentView: ItemView) {
 		if (!currentView) return;
 		// Check if new leaf's view is empty, else return.
-		if (currentView.getViewType() != "empty") return;
+		if (currentView.getViewType() != "empty" && currentView.getViewType() !== 'home-tab-view') return;
 		// Check if the "New tab" view has already been processed and has a header bar already.
 		if (!currentView.headerEl.children[2].hasClass("web-browser-header-bar")) {
 			const headerBar = new HeaderBar(currentView.headerEl.children[2], this, currentView);
@@ -146,6 +150,7 @@ export default class SurfingPlugin extends Plugin {
 			});
 		}
 
+		if(app.plugins.getPlugin('home-tab')) return;
 		const emptyStateEl = (currentView.contentEl.children[0] as HTMLElement).hasClass("empty-state") ? currentView.contentEl.children[0] as HTMLElement : null;
 		if (!emptyStateEl) return;
 		if (!emptyStateEl.hasClass("wb-page-search-bar") && this.settings.showSearchBarInPage) {
@@ -176,14 +181,20 @@ export default class SurfingPlugin extends Plugin {
 		if (!currentView) return;
 
 		// Check if new leaf's view is empty, else return.
-		if (currentView.getViewType() != "empty") return;
+		if (currentView.getViewType() != "empty" && currentView.getViewType() !== 'home-tab-view') return;
 
 		// Check if the "New tab" view has already been processed and has a header bar already.
 		if (currentView.headerEl.children[2].hasClass("wb-header-bar")) {
 			currentView.headerEl.children[2].empty();
 			currentView.headerEl.children[2].removeClass("wb-header-bar");
 		}
 
+		// Remove config icon
+		if (currentView.contentEl.children[1]?.hasClass("surfing-settings-icon")) {
+			currentView.contentEl.children[1]?.detach();
+		}
+
+		if(app.plugins.getPlugin('home-tab')) return;
 		// Remove in page search bar
 		if (currentView.contentEl.children[0].hasClass("wb-page-search-bar") && this.settings.showSearchBarInPage) {
 			currentView.contentEl.children[0].children[1]?.detach();
@@ -192,16 +203,16 @@ export default class SurfingPlugin extends Plugin {
 			currentView.contentEl.children[0].removeClass("wb-page-search-bar");
 		}
 
-		// Remove config icon
-		if (currentView.contentEl.children[1]?.hasClass("surfing-settings-icon")) {
-			currentView.contentEl.children[1]?.detach();
-		}
+
 	}
 
 	// Update all leaf contains empty view when restart Obsidian
 	private updateEmptyLeaves(removeHeader?: boolean) {
 		const emptyLeaves = this.app.workspace.getLeavesOfType("empty");
-		emptyLeaves.forEach((leaf) => {
+		const homeTabLeaves = this.app.workspace.getLeavesOfType("home-tab-view");
+
+		const targetLeaves = [...emptyLeaves, ...homeTabLeaves];
+		targetLeaves.forEach((leaf) => {
 			if (leaf.view instanceof ItemView) {
 				if (!removeHeader) this.addHeaderAndSearchBar(leaf.view);
 				if (removeHeader) this.removeHeaderAndSearchBar(leaf.view);
@@ -482,7 +493,27 @@ export default class SurfingPlugin extends Plugin {
 		addIcon('surfing', `<svg t="1669432317981" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1590" data-darkreader-inline-fill="" width="100" height="100"><path d="M330.926 1023.978c-11.78 0-21.328-9.562-21.328-21.344v-42.652c0-11.782 9.546-21.344 21.328-21.344s21.342 9.562 21.342 21.344v42.652c0 11.782-9.56 21.344-21.342 21.344z" fill="#EAAD7A" p-id="1591" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#e2a36a;"></path><path d="M650.892 273.08C624.644 115.932 579.958 16.656 578.052 12.532a21.332 21.332 0 0 0-25.904-11.5c-1.406 0.468-35.186 11.28-70.262 24.842-20.936 8.062-37.998 15.466-50.7 21.936-22.046 11.25-32.014 20.092-35.358 31.404-2.578 7.188-24.764 54.842-48.232 105.246-39.138 84.088-92.746 199.27-136.086 298.016-23.796 54.248-41.92 97.714-53.84 129.212-21.952 57.998-20.89 69.652-17.204 78.872 4.172 10.466 13.282 21.842 82.808 55.342 36.28 17.466 85.76 39.278 147.07 64.902 104.088 43.464 207.894 83.372 208.926 83.746 2.468 0.968 5.062 1.438 7.656 1.438 3.124 0 6.218-0.688 9.124-2.062a21.284 21.284 0 0 0 11.124-12.532c35.308-106.152 55.808-217.832 60.84-331.952 4.034-91.246-1.716-184.21-17.122-276.362z" fill="#ED5564" p-id="1592" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#cc5b60;"></path><path d="M650.892 273.08C624.644 115.932 579.958 16.656 578.052 12.532a21.332 21.332 0 0 0-25.904-11.5c-0.656 0.218-8.31 2.686-19.842 6.592a21.938 21.938 0 0 1 3.094 4.906c1.89 4.124 46.59 103.4 72.84 260.548 15.376 92.152 21.154 185.116 17.124 276.362-5.06 114.12-25.53 225.798-60.872 331.952a21.216 21.216 0 0 1-3.282 6.156c11.28 4.406 17.81 6.906 18.06 7 2.468 0.968 5.062 1.438 7.656 1.438 3.124 0 6.218-0.688 9.124-2.062a21.284 21.284 0 0 0 11.124-12.532c35.308-106.152 55.808-217.832 60.84-331.952 4.034-91.244-1.716-184.208-17.122-276.36z" fill="#FFFFFF" opacity=".2" p-id="1593" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#ebe3d5;"></path><path d="M181.622 874.642c0 2.468 0.406 4.938 1.266 7.282 0.954 2.624 9.89 26.124 32.092 49.934 21.014 22.562 58.2 49.436 115.948 49.436h383.996c128.744 0 186.428-91.588 188.834-95.494a21.314 21.314 0 0 0 3.156-11.156H181.622z" fill="#F4BE8E" p-id="1594" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#ecb177;"></path><path d="M685.924 584.064c-6.782-2.25-13.532-3.876-19.562-5.062a1292.052 1292.052 0 0 1-3.656 42.81c12.844 3.032 24.876 7.936 29.188 13.686-7.25 3.718-26.344 10.906-73.402 17.844-42.218 6.218-97.95 11-161.196 13.75-122.15 5.342-251.97 2.376-315.686-7.218-11.656-1.782-22.514 6.25-24.28 17.904-1.75 11.656 6.264 22.53 17.92 24.28 44.826 6.75 118.102 10.376 199.598 10.376 39.28 0 80.496-0.844 121.336-2.594 64.154-2.718 121.274-7.5 165.118-13.78 71.778-10.312 92.806-22.438 102.368-30.686 10.406-8.938 12.594-18.75 12.594-25.376 0-14.688-6.562-41.466-50.34-55.934z" fill="#434A54" p-id="1595" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#555755;"></path></svg>`)
 	}
 
+
+	private registerCodeBlock() {
+		this.registerMarkdownCodeBlockProcessor(
+			"surfing", (source: string, el: HTMLElement, ctx: MarkdownPostProcessorContext) => {
+				const yaml = parseYaml(source);
+				if(!yaml || !yaml.url) return;
+
+				const url = yaml.url;
+				el.toggleClass('surfing-embed-website', true)
+
+				const parentEl = el.createEl('div', {
+					cls: 'surfing-embed-website-container'
+				})
+				const webView = new PopoverWebView(parentEl, url);
+				webView.onload();
+			}
+		)
+	}
+
 	private registerHoverPopover() {
+		if(!this.settings.hoverPopover) return;
 		this.registerEditorExtension(
 			EditorView.domEventHandlers({
 				mouseover: (e: MouseEvent, editorView: EditorView) => {
@@ -717,6 +748,7 @@ export default class SurfingPlugin extends Plugin {
 	}
 
 	private patchEmptyView() {
+
 		const patchEmptyView = () => {
 			const leaf = app.workspace.getLeavesOfType("empty").first();
 			const view = leaf?.view;

src/surfingPluginSetting.ts

@@ -22,6 +22,7 @@ export interface SurfingSettings {
 	defaultSearchEngine: string;
 	customSearchEngine: SearchEngine[];
 	ignoreList: string[];
+	hoverPopover: boolean;
 	alwaysShowCustomSearch: boolean;
 	showOtherSearchEngines: boolean;
 	showSearchBarInPage: boolean;
@@ -79,6 +80,7 @@ export const DEFAULT_SETTINGS: SurfingSettings = {
 		name: 'duckduckgo',
 		url: 'https://duckduckgo.com/?q=',
 	}],
+	hoverPopover: true,
 	ignoreList: ["notion", "craft"],
 	alwaysShowCustomSearch: false,
 	showOtherSearchEngines: false,
@@ -373,6 +375,8 @@ export class SurfingSettingTab extends PluginSettingTab {
 
 	private generateGeneralSettings(tabName: string, wbContainerEl: HTMLElement) {
 		this.addOpenInSameTab(tabName, wbContainerEl);
+		this.addHoverPopover(tabName, wbContainerEl);
+
 		this.addRefreshButton(tabName, wbContainerEl);
 		this.addHighlightFormat(tabName, wbContainerEl);
 		this.addMarkdownPath(tabName, wbContainerEl);
@@ -682,6 +686,24 @@ export class SurfingSettingTab extends PluginSettingTab {
 		this.addSettingToMasterSettingsList(tabName, setting.settingEl, settingName);
 	}
 
+	private addHoverPopover(tabName: string, wbContainerEl: HTMLElement) {
+		const settingName = 'Hover Popover';
+		const settingDesc = 'Show a popover when hover on the link.';
+		const setting = new Setting(wbContainerEl)
+			.setName(settingName)
+			.setDesc(settingDesc)
+			.addToggle((toggle) => {
+				toggle
+					.setValue(this.plugin.settings.hoverPopover)
+					.onChange(async (value) => {
+						this.plugin.settings.hoverPopover = value;
+						this.applySettingsUpdate();
+					});
+			});
+
+		this.addSettingToMasterSettingsList(tabName, setting.settingEl, settingName, settingDesc);
+	}
+
 	private addReplaceIframeInCanvas(tabName: string, wbContainerEl: HTMLElement) {
 		const settingName = t('[Experimental] Replace Iframe In Canvas') + t('(Reload to take effect)');
 		const setting = new Setting(wbContainerEl)

src/surfingView.ts

@@ -854,7 +854,9 @@ export class SurfingView extends ItemView {
 		} else if ((!(url.startsWith("file://") || (/\.htm(l)?/g.test(url))) && !urlRegEx2.test(encodeURI(url))) || !(/^(https?|file):\/\//g.test(url))) {
 			// If url is not a valid FILE url, search it with search engine.
 			const allSearchEngine = [...SEARCH_ENGINES, ...this.plugin.settings.customSearchEngine];
-			const currentSearchEngine = allSearchEngine.find((engine) => engine.name === this.plugin.settings.defaultSearchEngine);
+			const currentSearchEngine = allSearchEngine.find((engine) => engine.name.toLowerCase() === this.plugin.settings.defaultSearchEngine);
+			console.log(currentSearchEngine, allSearchEngine, this.plugin.settings.defaultSearchEngine)
+
 			// @ts-ignore
 			url = (currentSearchEngine ? currentSearchEngine.url : SEARCH_ENGINES[0].url) + url;
 		}

versions.json

@@ -47,5 +47,6 @@
 	"0.8.13": "1.0.0",
 	"0.8.14": "1.0.0",
 	"0.8.15": "1.0.0",
-	"0.8.16": "1.0.0"
-}
+	"0.8.16": "1.0.0",
+	"0.9.0": "1.4.0"
+}