E/D
by
shiiiiir
2016-11-08 [2016/11/08 16:48:00]
入力した内容をURLデコード、エンコードします。
@@ -14,7 +14,7 @@
return document.createElement(tag);
};
- // 起動中にブックマークレットを起動すると終了
+ // 起動中にブックマークレットを再度起動すると終了
if (getById(app_id)) {
getById(app_id).parentNode.removeChild(getById(app_id));
return;
/*
* @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
- Greasemonkey 等で利用する場合の .user.js へのリンクです。
- Loader
- @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
- Metadata
- コード中にコメントで @xxx と書かれたメタデータの JSON です。