/takker/✅リンク先へスクロールする機能をscrapbox-userscript-stdに入れ

generated at 2/16/2025, 5:03:15 PM
✅リンク先へスクロールする機能をscrapbox-userscript-stdに入れ
UserScriptからリンク先へスクロールする機能を使えるようにする
scrapbox-userscript-stdに入れる

実装
任意のpageTransitionContextを発行する機能
何らかのクリックイベントの後にリンク先へスクロールする機能を発動させたいときに使う
2023-01-05 09:25:02 コード書けた
PRしちゃうか。
tsexport interface Link {
  project: string;
  title: string;
}

export type PageTransitionContext = {
  type: "page";
  from: Link;
  to: Link;
} | {
  type: "search";
  query: string;
  to: Link;
};

export const pushPageTransition = (context: PageTransitionContext):void => {
  const pageTransitionContext = JSON.parse(localStorage.getItem("pageTransitionContext"));
  const value = context.type === "page" ? 
    context.from.project === context.to.project ?
      context.from.title === context.to.title ? {
        titleHint: context.to.title
      } : {
        linkFrom: context.from.title
      }
    : {
      linkFrom: `/${context.from.project}/${context.to.title}`
  } : {
    searchQuery: context.query,
  };
  pageTransitionContext[`page_${toTitleLc(context.to.title)}`] = value;
  localStorage.setItem(
    "pageTransitionContext",
    JSON.stringify(pageTransitionContext),
  );
};
 open() に pushTransitionContext を内蔵する
JSからページ遷移したいときなどに使う

用途例
UserScriptで作ったリンクにリンク先へスクロールする機能を入れる
takker99/ScrapBubbleやtakker99/scrapbox-incremental-fulltext-search、local graph (Obsidian)など

2023-01-05
13:19:44 merged
12:57:10 テスト中
13:18:26 おわり

テスト
✅このページから、このページを参照しているページへ飛ぶ
✅ページBのページAに言及している箇所に飛ぶ
✅/B/ページC中の/A/ページDに言及している箇所に飛ぶ
バグ発見
12:59:03 修正完了
✅/B/ページAの query という文字列が最初に出現する位置に飛ぶ
 titleHint もまあ問題なさそう
server側で処理されているから、あまり詳しいことはわからない
jsimport { pushTransitionContext, open } from "./deps.js";

open("villagepump", "2023/01/04", {
  context: {
    type: "search",
    query: "[takker.icon]"
  }
});
build
deps.tsexport { pushTransitionContext, open } from "https://raw.githubusercontent.com/takker99/scrapbox-userscript-std/page-transition/browser/dom/mod.ts";
deps.jsvar c=e=>e.replaceAll(" ","_").toLowerCase();var a=e=>[...e].map((n,t)=>n===" "?"_":!g.includes(n)||t===e.length-1&&x.includes(n)?encodeURIComponent(n):n).join(""),g='@$&+=:;",',x=':;",';var u=e=>{let n=JSON.parse(localStorage.getItem("pageTransitionContext")??""),t=e.type==="page"?e.from.project===e.to.project?e.from.title===e.to.title?{titleHint:e.to.title}:{linkFrom:e.from.title}:{linkFrom:`/${e.from.project}/${e.from.title}`}:{searchQuery:e.query};n[`page_${c(e.to.title)}`]=t,localStorage.setItem("pageTransitionContext",JSON.stringify(n))};var h=(e,n,t)=>{let r=new URL(`/${e}/${a(n)}`,location.href);if(t?.body&&(r.search=`?body=${encodeURIComponent(t.body)}`),t?.id&&(r.hash=`#${t.id}`),t?.context&&u({...t?.context,to:{project:e,title:n}}),t?.newTab!==!1&&(t?.newTab===!0||e!==scrapbox.Project.name)){window.open(r);return}if(t?.reload!==!1&&(t?.reload===!0||e!==scrapbox.Project.name)){window.open(r,"_self");return}let o=document.createElement("a");o.href=r.toString(),document.body.append(o),o.click(),o.remove()};export{h as open};

#2023-01-05 09:25:11 
#2023-01-04 12:38:06 
#2023-01-01 01:35:58 