initial F

by noromanba 2018-07-19 [2018/07/19 05:28:20]
(Forked from initial B by noromanba)

reset pointed element font size

@@ -1,30 +1,62 @@
 /*
- * @title initial B
- * @description reset font size/family
+ * @title initial F
+ * @description reset pointed element font size
  * @include http://*
  * @include https://*
- * @license MIT License http://opensource.org/licenses/MIT
+ * @contributor noromanba   http://let.hatelabo.jp/noromanba/let/hLHUj4za1NIc
+ * @license     MIT License https://opensource.org/licenses/MIT
  * @javascript_url
  */
 
-// ready to use @run-at document-start
+// via
+// http://h.hatena.ne.jp/a-kuma3/227137860056298438
+// c.f.
+// http://neos21.hatenablog.com/entry/2018/01/01/080000
+//  https://codepen.io/Neos21/pen/JOVRJe/
 
-// TBD extract content javascript
-// https://github.com/hatena/extract-content-javascript
-// http://let.hatelabo.jp/noromanba/let/gYC-yoLNt8-ANg
+// TODO
+// - clean inline properties
+// - lookup original font-size
+// - clean listener
+// - strict history management
+//
+// TBD
+// - Esc or other key to cancel
+// - :hover
+// - functions extraction
+// - extract content javascript
+//  https://github.com/hatena/extract-content-javascript
+//  http://let.hatelabo.jp/noromanba/let/gYC-yoLNt8-ANg
 (() => {
     'use strict';
 
-    const wall = document.head || document.body;
+    const body = document.body;
+    body.style.cursor = 'zoom-in';
 
-    wall.append(Object.assign(document.createElement('style'), {
-        charset: 'utf-8',
-        textContent: [
-            '* {',
-                'font-size: initial !important;',
-                'font-family: initial !important;',
-            '}',
-        ].join('\n'),
-    }));
+    const hist = new Map();
+    const enlarge = (evt) => {
+        // https://developer.mozilla.org/en-US/docs/Web/API/DocumentOrShadowRoot/elementFromPoint
+        const node = document.elementFromPoint(evt.x, evt.y);
+        // single-click guard
+        if (hist.has(node)) return;
+
+        hist.set(node, getComputedStyle(node).fontSize);
+
+        //node.style.setProperty('font-size', 'initial' 'important');
+        node.style.fontSize = 'initial';
+        node.style.cursor = 'not-allowed';
+
+        // TBD other event; e.g. key combination
+        node.addEventListener('dblclick', evt => {
+            const node = evt.target;
+
+            node.style.fontSize = hist.get(node);
+            hist.delete(node);
+
+            node.style.cursor = 'zoom-in';
+            //body.removeEventListener(evt.name, enlarge);
+        });
+    };
+    body.addEventListener('click', enlarge);
 })();
 

• /*
   * @title initial F
   * @description reset pointed element font size
   * @include http://*
   * @include https://*
   * @contributor noromanba   http://let.hatelabo.jp/noromanba/let/hLHUj4za1NIc
   * @license     MIT License https://opensource.org/licenses/MIT
   * @javascript_url
   */
  
  // via
  // http://h.hatena.ne.jp/a-kuma3/227137860056298438
  // c.f.
  // http://neos21.hatenablog.com/entry/2018/01/01/080000
  //  https://codepen.io/Neos21/pen/JOVRJe/
  
  // TODO
  // - clean inline properties
  // - lookup original font-size
  // - clean listener
  // - strict history management
  //
  // TBD
  // - Esc or other key to cancel
  // - :hover
  // - functions extraction
  // - extract content javascript
  //  https://github.com/hatena/extract-content-javascript
  //  http://let.hatelabo.jp/noromanba/let/gYC-yoLNt8-ANg
  (() => {
      'use strict';
  
      const body = document.body;
      body.style.cursor = 'zoom-in';
  
      const hist = new Map();
      const enlarge = (evt) => {
          // https://developer.mozilla.org/en-US/docs/Web/API/DocumentOrShadowRoot/elementFromPoint
          const node = document.elementFromPoint(evt.x, evt.y);
          // single-click guard
          if (hist.has(node)) return;
  
          hist.set(node, getComputedStyle(node).fontSize);
  
          //node.style.setProperty('font-size', 'initial' 'important');
          node.style.fontSize = 'initial';
          node.style.cursor = 'not-allowed';
  
          // TBD other event; e.g. key combination
          node.addEventListener('dblclick', evt => {
              const node = evt.target;
  
              node.style.fontSize = hist.get(node);
              hist.delete(node);
  
              node.style.cursor = 'zoom-in';
              //body.removeEventListener(evt.name, enlarge);
          });
      };
      body.addEventListener('click', enlarge);
  })();
  
  

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

  このページへの個別リンクです。

  RAW

  書かれたコードへの直接のリンクです。

  Packed

  文字列が圧縮された書かれたコードへのリンクです。

  Userscript

  Greasemonkey 等で利用する場合の .user.js へのリンクです。

  Loader

  @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。

  Metadata

  コード中にコメントで @xxx と書かれたメタデータの JSON です。