T/U box Fork

    @@ -1,50 +1,71 @@ /* - * @title タイトルとかのコピー - * @description 出てきたやつをクリックするとクリップボードに入ります。外枠をダブルクリックすると消えます。 - * @include * - * @license MIT License + * @title T/U box + * @description easy copyable title/url box; click to copy, double-click outer to close + * @include http://* + * @include https://* + * @contributor pacochi http://let.hatelabo.jp/pacochi/let/hJme3OvVzN41 + * @license MIT License https://opensource.org/licenses/MIT * @javascript_url */ - // タイトルコピーするために入れたアドオンが次々使えなくなっていくからこれでしのぐっていう用途 + // http://eslint.org/demo/ + // ECMA Version [6] + // [x] browser (() => { - - // 元のコード: https://gist.github.com/noromanba/d730ccf3ae5e6916cd60 - const canonical = (document.querySelector('head meta[property="og:url"][content]') || {}).content || - (document.querySelector('head link[rel="canonical"][href]') || {}).href || - location.href; + // https://gist.github.com/noromanba/d730ccf3ae5e6916cd60 + const canonical = (document.querySelector([ + 'head meta[property="og:url"][content]' + ]) || {}).content || + (document.querySelector([ + 'head link[rel="canonical"][href]' + ]) || {}).href || + location.href; const title = document.title; const hatenalink = `[${canonical}:title=${title}]`; - const base = document.body.appendChild(Object.assign(document.createElement('div'), { - id: 'copy-buttons', - style: 'background-color: white; border: 1px solid silver;padding: 1em; position: fixed; top: 0; left: 0; z-index: 2147483646;' - })); - base.addEventListener('dblclick', e => { - document.body.removeChild(e.target); + const box = document.body.appendChild(Object.assign(document.createElement('div'), { + id: 'copy-buttons', + style: ` + background-color: white; + border: 1px solid silver; + padding: 1em; + position: fixed; + top: 0; + left: 0; + z-index: ${Number.MAX_SAFE_INTEGER || Number.MAX_VALUE}; + `})); + box.addEventListener('dblclick', e => { + box.parentNode.removeChild(box); e.stopPropagation(); + }); - }, false); - - [{ label: 'CanonicalURL', value: canonical }, - { label: 'タイトル', value: title }, - { label: 'はてな記法', value: hatenalink }].forEach(({label, value}) => { - - base.appendChild(Object.assign(document.createElement('label'), { - style: 'display: block; color: black; background-color: silver;', - textContent: `${label}: ` + // TBD alignment + [ + { label: 'CanonicalURL', value: canonical }, + { label: 'Title', value: title }, + { label: 'HatenaSyntax', value: hatenalink } + ].forEach(({label, value}) => { + box.appendChild(Object.assign(document.createElement('label'), { + style: ` + display: block; + color: black; + background-color: silver; + text-align: left; + `, + textContent: `${label}: ` })).appendChild(Object.assign(document.createElement('input'), { - style: 'color: black; background-color: silver; margin: 0.5em;', - value: value + style: ` + color: black; + background-color: silver; + margin: 0.5em; + `, + value })).addEventListener('click', e => { - e.target.select(); document.execCommand('copy'); e.stopPropagation(); - - }, false); - + }); }); + })(); - })();
  • /*
     * @title T/U box
     * @description easy copyable title/url box; click to copy, double-click outer to close
     * @include http://*
     * @include https://*
     * @contributor	pacochi	http://let.hatelabo.jp/pacochi/let/hJme3OvVzN41
     * @license MIT License	https://opensource.org/licenses/MIT
     * @javascript_url
     */
    
    // http://eslint.org/demo/
    //  ECMA Version [6]
    //  [x] browser
    
    (() => {
    	// https://gist.github.com/noromanba/d730ccf3ae5e6916cd60
    	const canonical = (document.querySelector([
    			'head meta[property="og:url"][content]'
    		]) || {}).content ||
    		(document.querySelector([
    			'head link[rel="canonical"][href]'
    		]) || {}).href ||
    		location.href;
    	const title = document.title;
    	const hatenalink = `[${canonical}:title=${title}]`;
    
    	const box = document.body.appendChild(Object.assign(document.createElement('div'), {
    		id: 'copy-buttons',
    		style: `
    			background-color: white;
    			border: 1px solid silver;
    			padding: 1em;
    			position: fixed;
    			top: 0;
    			left: 0;
    			z-index: ${Number.MAX_SAFE_INTEGER || Number.MAX_VALUE};
    	`}));
    	box.addEventListener('dblclick', e => {
    		box.parentNode.removeChild(box);
    		e.stopPropagation();
    	});
    
    	// TBD alignment
    	[
    		{ label: 'CanonicalURL', value: canonical },
    		{ label: 'Title', value: title },
    		{ label: 'HatenaSyntax', value: hatenalink }
    	].forEach(({label, value}) => {
    		box.appendChild(Object.assign(document.createElement('label'), {
    			style: `
    				display: block;
    				color: black;
    				background-color: silver;
    				text-align: left;
    			`,
    			textContent: `${label}: `
    		})).appendChild(Object.assign(document.createElement('input'), {
    			style: `
    				color: black;
    				background-color: silver;
    				margin: 0.5em;
    			`,
    			value
    		})).addEventListener('click', e => {
    			e.target.select();
    			document.execCommand('copy');
    			e.stopPropagation();
    		});
    	});
    })();
    
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。