WorkFlowyで選択項目をトップに移動するブックマークレット
まず、移動の操作を確認してみる。
testscript.jsvar s = WF.getSelection();
"" == s && s.push(WF.focusedItem());
var t = s[0].getParent();
WF.moveItems(s, t, 0);moveItemsの適切な引き数がわからず時間がかかったけども、とりあえず上で大丈夫。
あとは、ショートカットキー。option + command + u がよかったがブラウザに使われているので代わりにpにする。
script.jsjavascript:(function(){document.body.addEventListener('keydown',event => {if (event.altKey && event.metaKey){if(event.keyCode===80){var s = WF.getSelection(); "" == s && s.push(WF.focusedItem());var t = s[0].getParent();WF.moveItems(s, t, 0);}}});})();さて。
ブックマークには以下を書いて、このページを参照できるように。
javascript:(function(d,s){ s=d.createElement('script');s.src='https://scrapbox.io/api/code/rashitamemo/WorkFlowy%E3%81%A7%E9%81%B8%E6%8A%9E%E9%A0%85%E7%9B%AE%E3%82%92%E3%83%88%E3%83%83%E3%83%97%E3%81%AB%E7%A7%BB%E5%8B%95%E3%81%99%E3%82%8B%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF%E3%83%AC%E3%83%83%E3%83%88/script.js';d.body.appendChild(s);})(document)
参照:
2024/8/24
拡張機能を使い、自動的に読み込まれるようにする。
ex_scrip.jsconsole.log("スクリプトが読み込まれました")
const scriptText = `
(function(){document.body.addEventListener('keydown',event => {
if (event.metaKey && event.key==='ArrowRight'){
event.preventDefault();
var s = WF.focusedItem();
if (s.isExpanded()){
WF.collapseItem(s);
}else{
var t = s.getParent();
WF.editItemName(t);
WF.collapseItem(t);
if(t.getParent().getParent()==null){
WF.zoomOut();
}
}
}
if(event.key==='ArrowUp' && event.altKey && event.metaKey){
event.preventDefault();
const currentItem = WF.focusedItem()
const NextItem = currentItem.getNextVisibleSibling()
var s = WF.getSelection();
"" == s && s.push(WF.focusedItem());
let t = s[0].getParent();
WF.moveItems(s, t, 0);
WF.editItemName(NextItem);
}
});})();
`
const scriptbody = document.createElement("script")
scriptbody.innerHTML = scriptText
document.body.appendChild(scriptbody);
console.log("ショートカットキーを追加しました")
移動後に、カーソルを下の項目（ないし上の項目）の先頭におきたいが、末尾になってしまう。
対処方法はちょっと思いつかない。
選択範囲を生成するのはたぶんうまくいかない気がする。
以下を呼んでやり方を見出せた。
ex_01.scirptconsole.log("スクリプトが読み込まれました")
const scriptText = `
(function(){document.body.addEventListener('keydown',event => {
if (event.metaKey && event.key==='ArrowRight'){
event.preventDefault();
var s = WF.focusedItem();
if (s.isExpanded()){
WF.collapseItem(s);
}else{
var t = s.getParent();
WF.editItemName(t);
WF.collapseItem(t);
if(t.getParent().getParent()==null){
WF.zoomOut();
}
}
}
if(event.key==='ArrowUp' && event.altKey && event.metaKey){
event.preventDefault();
console.log("pとoptionキーが押されました")
const currentItem = WF.focusedItem()
NextItem = currentItem.getPreviousVisibleSibling()
var s = WF.getSelection();
"" == s && s.push(WF.focusedItem());
let t = s[0].getParent();
WF.moveItems(s, t, 0);
WF.editItemName(NextItem);
const target = NextItem.getElement()
console.log(target)
const node = target.children[0].children[2].children[0].childNodes[0]
console.log(node)
const editorRange = document.createRange()
const editorSel = window.getSelection()
editorRange.setStart(node, 0)
editorRange.collapse(true)
editorSel.removeAllRanges()
editorSel.addRange(editorRange)
}
});})();
`
const scriptbody = document.createElement("script")
scriptbody.innerHTML = scriptText
document.body.appendChild(scriptbody);
console.log("ショートカットキーを追加しました")本当は子要素の連鎖ではなく、要素のクラスで絞り込んだ方がいいと思うが当面はこうする。