E/D

by shiiiiir 2016-11-08 [2016/11/08 16:48:00]

入力した内容をURLデコード、エンコードします。

@@ -29,7 +29,7 @@
   i_space.placeholder = 'input area';
   i_space.style.cssText = 'width:100%;height:100px;display:block;';
 
-  // 出力エリアエリア
+  // 出力用エリア
   var o_space = cElm('textarea');
   o_space.placeholder = 'output area';
   o_space.readOnly = 'true';

• /*
   * @title E/D
   * @description 入力した内容をURLデコード、エンコードします。
   * @include http://*
   * @license MIT License
   * @require 
   */
  (function () {
    var app_id = 'E/D';
    var getById = function (id) {
      return document.getElementById(id);
    };
    var cElm = function (tag) {
      return document.createElement(tag);
    };
  
    // 起動中にブックマークレットを再度起動すると終了
    if (getById(app_id)) {
      getById(app_id).parentNode.removeChild(getById(app_id));
      return;
    }
  
    var div = cElm('div');
    div.id = 'E/D';
    div.style.cssText = 'position:fixed;top:0;left:0;z-index:2147483647;width:33%;text-align:left;';
  
    // 入力用エリア
    var i_space = cElm('textarea');
    i_space.placeholder = 'input area';
    i_space.style.cssText = 'width:100%;height:100px;display:block;';
  
    // 出力用エリア
    var o_space = cElm('textarea');
    o_space.placeholder = 'output area';
    o_space.readOnly = 'true';
    o_space.style.cssText = 'width:100%;height:100px;display:block;';
  
    // ツールバー
    var toolbar = cElm('span');
  
    // エンコード/デコードボタン
    var btn_enc = cElm('button');
    btn_enc.textContent = 'E/D';
    btn_enc.onclick = function () {
      o_space.value = '[ENC] : ' + encodeURIComponent(i_space.value) + '\n[DEC] : ' + decodeURIComponent(i_space.value);
    };
    toolbar.appendChild(btn_enc);
  
    // リセットボタン
    var btn_rst = cElm('button');
    btn_rst.textContent = 'Reset';
    btn_rst.onclick = function () {
      i_space.value = '';
      o_space.value = '';
    };
    toolbar.appendChild(btn_rst);
  
    // エリア拡張ボタン
    var btn_exp = cElm('button');
    btn_exp.textContent = 'Expand';
    btn_exp.onclick = function () {
      var target = getById('E/D');
      var width = '33%';
      var height = '100px';
      if (target.style.width == '33%') {
        width = '66%';
        height = '200px';
      } else if (target.style.width == '66%') {
        width = '100%';
        height = '300px';
      }
      target.style.width = width;
      i_space.style.width = '100%';
      o_space.style.width = '100%';
      i_space.style.height = height;
      o_space.style.height = height;
    };
    toolbar.appendChild(btn_exp);
  
    // クローズボタン
    var btn_close = cElm('button');
    btn_close.textContent = 'Close';
    btn_close.onclick = function () {
      getById('E/D').parentNode.removeChild(getById('E/D'));
    };
    toolbar.appendChild(btn_close);
  
    div.appendChild(toolbar);
    div.appendChild(i_space);
    div.appendChild(o_space);
    document.body.appendChild(div);
  
    // 入力エリアにフォーカス
    i_space.focus();
  }) ();
  

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

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

  RAW

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

  Packed

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

  Userscript

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

  Loader

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

  Metadata

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