About/広辞苑無料検索/Custom JS guide

About/広辞苑無料検索/Custom JS guide

当「広辞苑無料検索」サービスは Custom JS (Custom JavaScript) を対応しています。それを利用して、当サービス全ての機能を変更またカスタマイズすることができます。

Custom JS 方法:当サービスの検索フォームで「⚙」(設定)ボタンをクリックして、設定ダイアログの「カスタマイズ JS」 入力欄で自分好みの JavaScript を入力する。Custom JSコンテンツはページDOMの"<body>"Elementの真っ先にロードされる。

Custom JavaScript Guide

Background & Basics

  • This service is built using React and Redux frameworks with server side rendering enabled. In the client side, the root React element is being rendered in DOM "load" event handle.
  • All user-generated data (config, word notebook, search activity, and others) are stored in the client side (browser) only using IndexedDB and / or localStorage.
  • It's providing a optional cloud-based sync feature which uses the user's own Google Drive / Google sheets to sync user-generated data across multiple devices.

Global hook variables

You can use the following global variables in your Custom JavaScript. You should wait the DOM "load" event to use these variables.

  • window.__APP__ : The top-most React component (<App />) instance. (Only available after the DOM "load" event)
  • window.__STORE__ : The redux store.
  • window.__ACTIONS__ : An object which contains all redux actions that our codes are using.
  • window.__DATA__ : Object. Store some exposed global (Modifiable) data.
  • window.__USERCONFIG__ : User config data. (Read-only)
  • window.__USERCONFIG_LOCAL__ : The local only user config data. (writable)
  • window.__DB__ : the dexie.js(IndexedDB wrapper library) instance, used to storage word notes / search activities.
    • window.__DB__.meta
    • window.__DB__.notebook
    • window.__DB__.history
    • window.__DB__.deletedNotebook

window.__DATA__

properties

  • externalSearchSites : Array.「外部サイト検索」機能のサイトリスト。Each item format:
{
  name: "Weblio辞書",
  url: "https://www.weblio.jp/content/%s", // replace the search keyword with "%s"
  // iconUrl: "https://www.weblio.jp/favicon.ico", // optional
}

Custom JavaScript Examples

「外部サイト検索」リストにサイトを追加

window.addEventListener("load", () => {
  window.__DATA__.externalSearchSites.push({name: "Weblio英和辞典", url: "https://ejje.weblio.jp/content/%s"})
});

Programmatically update /set user config

window.__STORE__.dispatch(window.__ACTIONS__.updateUserConfig({
  sitename: "MyDict"
}));

(By default the updateUserConfig action will merge the provided config object with the current one)

Use different config in different machines while still syncing

You can apply different config to individual machine while still syncing others by combining the "deviceId" (端末のID) config item and the __USERCONFIG_LOCAL__ hook variable. For example:

var deviceId = window.__USERCONFIG__.deviceId || "";

if( deviceId.match(/^phone\b/) ) {
  window.__USERCONFIG_LOCAL__ = {
    defaultDict: "大辞林",
  }
}

Last update: 2021-05-09 12:05:07 UTC