indicator reviver

    @@ -1,6 +1,6 @@ /* - * @title revive indicator - * @description revive saving indicator on Hatena::Let + * @title indicator revived + * @description revive "[saving...]" indicator on Hatena::Let * @include *://let.hatelabo.jp/l * @license MIT License https://opensource.org/licenses/MIT * @javascript_url @@ -11,5 +11,45 @@ // c.f. // http://h.hatena.ne.jp/noromanba/227136362604995923 -(document.body.querySelector('img#auto_save_icon') || {}).src = 'https://d.hatena.ne.jp/images/indicator.gif'; void 0; +(() => { + const indicator = document.body.querySelector([ + 'img[src]#auto_save_icon' + ]); + if (!indicator) return; + + // TBD data URI + const throbber = { + original: 'https://web.archive.org/web/20100511175314if_/http://r.hatena.ne.jp/images/indicator.gif', + circlesmall: 'https://s.hatena.ne.jp/images/load.gif', + // same as original + circlelarge: 'https://d.hatena.ne.jp/images/indicator.gif', + // thx id:a-kuma3 + // http://h.hatena.ne.jp/a-kuma3/83461036272149214 + squaredots: 'https://cdn-ak.b.st-hatena.com/images/loading.gif', + }; + + indicator.src = throbber.squaredots; + + // TBD + // - CSSnize + // - align by flexbox + // original style fixes + indicator.style.verticalAlign = 'text-top'; + + const checkbox = document.body.querySelector([ + 'input[type="checkbox"]#autosave' + ]); + if (!checkbox) return; + + // XXX see Rendering Engine + // TODO omit IIFE + checkbox.style.verticalAlign = (() => { + if (navigator.userAgent.includes('Chrome')) { + return 'middle'; + } + if (navigator.userAgent.includes('Firefox')) { + return 'text-top'; + } + })(); +})();
  • /*
     * @title indicator revived
     * @description revive "[saving...]" indicator on Hatena::Let
     * @include *://let.hatelabo.jp/l
     * @license MIT License https://opensource.org/licenses/MIT
     * @javascript_url
     */
    
    // inspired
    // http://let.hatelabo.jp/pacochi/let/hJmc3OPAv48G
    
    // c.f.
    // http://h.hatena.ne.jp/noromanba/227136362604995923
    (() => {
        const indicator = document.body.querySelector([
            'img[src]#auto_save_icon'
        ]);
        if (!indicator) return;
    
        // TBD data URI
        const throbber =  {
            original:    'https://web.archive.org/web/20100511175314if_/http://r.hatena.ne.jp/images/indicator.gif',
            circlesmall: 'https://s.hatena.ne.jp/images/load.gif',
            // same as original
            circlelarge: 'https://d.hatena.ne.jp/images/indicator.gif',
            // thx id:a-kuma3
            // http://h.hatena.ne.jp/a-kuma3/83461036272149214
            squaredots:  'https://cdn-ak.b.st-hatena.com/images/loading.gif',
        };
    
        indicator.src = throbber.squaredots;
    
        // TBD
        // - CSSnize
        // - align by flexbox
        // original style fixes
        indicator.style.verticalAlign = 'text-top';
    
        const checkbox = document.body.querySelector([
            'input[type="checkbox"]#autosave'
        ]);
        if (!checkbox) return;
    
        // XXX see Rendering Engine
        // TODO omit IIFE
        checkbox.style.verticalAlign = (() => {
            if (navigator.userAgent.includes('Chrome')) {
                return 'middle';
            }
            if (navigator.userAgent.includes('Firefox')) {
                return 'text-top';
            }
        })();
    })();
    
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2018/05/15 08:34:14 - 2018-05-15
  2. 2018/05/15 04:27:34 - 2018-05-15
  3. 2018/05/15 03:36:12 - 2018-05-15
  4. 2018/05/12 08:47:40 - 2018-05-12