Hi, basing on this thread and proceeding by trial cause I’m ignorant of coding and scripts, I assembled a script for my custom web clipper bookmarklet.
It simply fetch text from sites with just some customizations on headlines, dates, YAML and filenames.
It works perfectly for both Chrome and Brave desktop version but doesn’t work with the respective android mobile apps.
In that case it creates in Obsidian a note (with the right filename format) with just the the web address to the web page I wanted to capture.
My script is this:
javascript: Promise.all([import('https://unpkg.com/[email protected]?module'), import('https://unpkg.com/@tehshrike/[email protected]'),]).then(async ([{
default: Turndown
}, {
default: Readability
}]) => {
/* Optional vault name */
const vault = "Note";
/* Optional folder name such as "Clippings/" */
const folder = "";
/* Optional tags */
let tags = "clippings";
/* parse and lightly clean the site's meta keywords content into tags, if present */
if (document.querySelector('meta[name="keywords" i]')) {
var keywords = document.querySelector('meta[name="keywords" i]').getAttribute('content').split(',');
keywords.forEach(function (keyword) {
let tag = ' ' + keyword.split(' ').join('');
tags += tag;
});
}
function getSelectionHtml() {
var html = "";
if (typeof window.getSelection != "undefined") {
var sel = window.getSelection();
if (sel.rangeCount) {
var container = document.createElement("div");
for (var i = 0, len = sel.rangeCount; i < len; ++i) {
container.appendChild(sel.getRangeAt(i).cloneContents());
}
html = container.innerHTML;
}
} else if (typeof document.selection != "undefined") {
if (document.selection.type == "Text") {
html = document.selection.createRange().htmlText;
}
}
return html;
}
const selection = getSelectionHtml();
const {
title,
byline,
excerpt,
content
} = new Readability(document.cloneNode(true)).parse();
function getFileName(fileName) {
var userAgent = window.navigator.userAgent,
platform = window.navigator.platform,
windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'];
if (windowsPlatforms.indexOf(platform) !== -1) {
fileName = fileName.replace(':', '').replace(/[/\\?%*|"<>]/g, '-');
} else {
fileName = fileName.replace(':', '').replace(/\//g, '-').replace(/\\/g, '-');
}
return fileName;
}
const fileName = getFileName(title);
if (selection) {
var markdownify = selection;
} else {
var markdownify = content;
}
if (vault) {
var vaultName = '&vault=' + encodeURIComponent(`${vault}`);
} else {
var vaultName = '';
}
const markdownBody = new Turndown({
headingStyle: 'atx',
hr: '~~~',
bulletListMarker: '-',
codeBlockStyle: 'fenced',
emDelimiter: '*',
}).turndown(markdownify);
var date = new Date();
function convertDate(date) {
var yyyy = date.getFullYear().toString();
var mm = (date.getMonth() + 1).toString();
var dd = date.getDate().toString();
var mmChars = mm.split('');
var ddChars = dd.split('');
return yyyy + '-' + (mmChars[1] ? mm : "0" + mmChars[0]) + '-' + (ddChars[1] ? dd : "0" + ddChars[0]);
}
const today = convertDate(date);
/* "convertDateb" created by me to have dots instead of dashes in date */
function convertDateb(date) {
var yyyy = date.getFullYear().toString();
var mm = (date.getMonth()+1).toString();
var dd = date.getDate().toString();
var mmChars = mm.split('');
var ddChars = dd.split('');
return yyyy + '.' + (mmChars[1]?mm:"0"+mmChars[0]) + '.' + (ddChars[1]?dd:"0"+ddChars[0]);
}
/* "todayb" created by me to have dots instead of dashes in date */
const todayb = convertDateb(date);
/* my custom YAML front matter */
const fileContent =
"---\n"
+ "alias:" + "\n"
+ "tags:" + "\n"
+ "source:" + "\n"
+ "date: " + todayb + "\n"
+ "---\n\n"
+ "# " + title + "\n\n"
+ "**" + excerpt + "**" + "\n\n"
+ document.URL + "\n\n"
+ today + "\n\n"
+ markdownBody ;
// This function must be called in a visible page, such as a browserAction popup
// or a content script. Calling it in a background page has no effect!
async function copyContent() {
try {
await navigator.clipboard.writeText(fileContent);
} catch (err) {
console.error('Failed to copy: ', err);
}
}
copyContent();
document.location.href = "obsidian://advanced-uri?"
+ "vault=" + vaultName
+ "&clipboard=true"
+ "&mode=new"
+ "&filepath=" + encodeURIComponent(folder + todayb +" - " + fileName);
})
Can anyone help me figure out what is wrong?
P:S. For me it’s more important that it works on mobile because for desktop there are many extensions like MarkDownload that can do the same. For mobile, no