privateページ埋め込みUserscript
これをメインの方と紐づけたいなーとずっと思っていた
タグまで紐付けなくていいから、せめて同じプロジェクト内で管理したい
Userscriptでiframe埋め込みをして、privateを表示 ページ開くたびに動くと思ってたら、違った
これでページ遷移時に呼ばれるようにするかな
追記
muta
例
(というかjavascriptの勝手がわからん)
まあ動くのでヨシ!
この概念めっちゃ知りたいtkgshn.icon
ScrapboxのUserScriptの管理がワークスペースの全部に反映しなきゃいけないからめんどくさいんだけど、Githubとかに.json置いて、自分のページに読み込ませるコード置いとくだけで良い感じになる?
解説記事等あげてくれるとありがたいです🥺tkgshn.icon*7
blu3mo.iconそんな面倒なことはやっていない
ScrapboxのAPIで、scrapbox.io/api/code/bluemountain-theme/XXX/script.jsから「XXX」ページのscript.jsを読み込める
それをimportしているだけ
普通にiframeで出すだけだと細すぎるので、.col-pageのmax-width制限をその時だけ取り払うようにした
2021-05-04 20:40:22 indentがずれてたので直しましたtakker.icon
あといくつかコードを単純化しました
🙏🙏blu3mo.icon
indentはtabにしますか?spaceにしますか?takker.icon
blu3mo.iconさんの好みに合わせたいと思います
spaceを一応いつもは使ってますblu3mo.icon
(わざわざありがとうございます🙇♂️🙇♂️)
ただのお節介なのでお気になさらずtakker.icon
目の前の課題をやる気がしなくて別のことしてるとか口が裂けても言えない
code:script.js
let lastTitle = "";
function presentPrivateFrameIfInPrivatePage() {
lastTitle = scrapbox.Page.title;
const page = document.getElementsByClassName("page")0; const colPage = document.getElementsByClassName("col-page")0; const privateFrame = document.getElementById('privateFrame');
privateFrame?.remove();
const privateLink = document.getElementById('privateLink');
privateLink?.remove();
console.log(colPage);
colPage.classList.remove("ignore-max-width");
//var pagename = document.location.pathname.split("/").pop();
↑pagenameはページのタイトルで合っていますか?
だとすると↓はprivate-で始まるページに対してのみ処理している?
です、そういう仕様だったと思います
あ、今は使用していない感じですか?takker.icon
今は使ってないですblu3mo.icon
(今久しぶりに見て、やっぱり便利かもと思い始めてます)
Scrapboxってコード中に文字挟んでも繋がるんですねblu3mo.icon
code:script.js
if(!scrpabox.Page.title.startsWith("private-")) return;
console.log("addFrame");
page.insertAdjacentHTML('afterbegin',
<iframe id='privateFrame' style='width:100%; height:100vh;' src='https://scrapbox.io/blu3mo-private/${pagename.slice(8, pagename.length)}</iframe>);
page.insertAdjacentHTML('afterbegin',
<a id='privateLink' href='https://scrapbox.io/blu3mo-private/${scrapbox.Page.title.slice(8)}">Go to the page</a>);
colPage.classList.add("ignore-max-width");
}
code:script.js
presentPrivateFrameIfInPrivatePage();
const observer = new MutationObserver((mutation)=>{
if (lastTitle === location.href) return;
presentPrivateFrameIfInPrivatePage();
});
observer.observe(document.getElementsByClassName("page-wrapper")0, {attributes: true, attributeFilter: "class"}); code:style.css
.ignore-max-width {
max-width: 100% !important;
}