tkskkd
https://gyazo.com/fa209a7008afe7010636269c1fbe5db8
名前
懸田 剛
TaKeShi KaKeDa → tkskkd
SNS
みたい世界のビジョン
これからずっと、人々が、自分らしく、ありのままで、生きる喜びを、感じられる世界
自然の営みと違うことなく、生きとし生けるものと共生できる世界
その人の可能性を最大限に活かせる世界
モットー
Think globally, Act locally, Ship globally.
Fail early, Lean a lot.
Make Your Joy Yourself.
特長
とりあえずやってみよう!
他と違うことをしよう!
動物占いは「孤高の狼」
もっといいやり方考えよう!
まず自分で考えてやってみよう!
整理が下手・・・
Webで見れるポートフォリオ
ランニングログ
所属組織・団体
チアアップえひめ 共同ファウンダー
UserScripts
code:script.js
(() => {
if (!webkitSpeechRecognition) return
const isMobile = () => /mobile/i.test(navigator.userAgent)
const writeText = text => {
console.log('writeText', text)
document.querySelector('.text-input').focus()
document.execCommand('insertText', null, text)
}
const recognition = new webkitSpeechRecognition()
if (!isMobile()) recognition.continuous = true
recognition.onresult = (e) => {
writeText(item.transcript + '\n')
}
let enable = false
scrapbox.PageMenu.addMenu({
title: 'speech input',
})
scrapbox.PageMenu('speech input').addItem({
title: () => (enable ? 'Stop' : 'Start') + ' speech input',
onClick: () => {
if (!enable) recognition.start()
else recognition.stop()
if (!isMobile()) enable = !enable
}
})
})()
tweet menu
code:script.js
scrapbox.PageMenu.addItem({
title: 'Tweet',
onClick: () => window.open(https://twitter.com/intent/tweet?url=${encodeURIComponent(location.href)}&text=${encodeURIComponent(window.scrapbox.Page.title)})
})
文字数カウント
code:script.js
scrapbox.PageMenu.addItem({
title: () => {
if (!scrapbox.Page.lines) return
const chars = scrapbox.Page.lines.map(line => line.text.length).reduce((a,b) => a + b)
const words = scrapbox.Page.lines.map(line => line.text.split(/\s+/).length).reduce((a,b) => a + b)
return ${chars}文字 ${words}単語 ${scrapbox.Page.lines.length}行
},
onClick: () => null
})
選択範囲 tweet popup
code:script.js
scrapbox.PopupMenu.addButton({
title: 'Tweet',
onClick: text => {
const lines = text
.map(line => line.replace(/[\\]/g, '').replace(/^\s+/, '')) lines.push(location.href)
const url = https://twitter.com/intent/tweet?&text=${encodeURIComponent(lines.join('\n'))}
const width = 550
const height = 420
const option = width=${width},height=${height},left=${(window.innerWidth - width) / 2},top=${(window.innerHeight - height) / 2},scrollbars=yes,resizable=yes,toolbar=no,location=yes
window.open(url, '_blank', option)
}
})
文字カウント
code:script.js
scrapbox.PopupMenu.addButton({
title: function (text) {
const chars = text.replace(/\r\n/g, '').length const words = text.trim().split(/\r\n\s+/).length return ${chars}c ${words}w
},
onClick: () => null
})
日付書式
code:script.js
scrapbox.TimeStamp.addFormat("]YYYY/MM/DD[ HH:mm:ss")
scrapbox.TimeStamp.addFormat("]YYYY/MM/DD[")
scrapbox.TimeStamp.addFormat("]YYYY/MM[")
選択範囲に引用符
code:script.js
scrapbox.PopupMenu.addButton({
title: 'quote',
onClick: text => text.split(/\n/).map(line => > ${line}).join('\n')
})
見える文字数カウンター
code:script.js
const __appliedProject__ = scrapbox.Project.name
const __charCounterSetup__ = setInterval(function() {
// ページが準備できるのを待ちたいので、スクリプトがロードされてから3秒くらいしたら処理開始↓↓
if (document.getElementById('editor') && scrapbox.Page.lines)
clearInterval(__charCounterSetup__)
else
return // ページの準備ができてないときはまた3秒待つ
// 下準備
const $id = id => document.getElementById(id)
const $query = q => document.querySelector(q)
const fmt = n => new Intl.NumberFormat('en-US').format(n).padStart(6)
// 文字数カウンター表示用のエレメントを作ってく
const linesText = $query('.lines').innerText.trim()
const chars = linesText.split(/\s+/).join('').length
var counterWrapper = document.createElement('div')
counterWrapper.id = '__charCounter__'
counterWrapper.innerHTML = <span>${fmt(chars)} chars</span> +
'<pre id="__charCounterPopup__" style="opacity:0"></pre>'
$id('editor').appendChild(counterWrapper)
const counter = $query('#__charCounter__ span')
const popup = $id('__charCounterPopup__')
// 文字数カウンターにマウスカーソルを乗せたときに詳細をポップアップする
counter.addEventListener('mouseover',
function() {
const linesText = $query('.lines').innerText.trim()
const chars = linesText.split(/\s+/).join('').length
const words = linesText.split(/\s+/).length
popup.innerHTML = ${fmt(chars)} chars\n +
${fmt(words)} words\n +
${fmt(scrapbox.Page.lines.length)} lines
popup.style.opacity = 1
})
// 文字数カウンターからマウスカーソルが離れたら詳細ポップアップを見えなくする
counter.addEventListener('mouseout', function() { popup.style.opacity = 0 })
// 文字数のみを数え直す関数
const updateCounter = function() {
if ($query('.presentation')
|| scrapbox.Project.name !== __appliedProject__) {
// プレゼンモードになってたり、よそのプロジェクトを表示してたら文字数カウンターを非表示にする
counterWrapper.style.display = 'none'
} else if (scrapbox.Page.lines) {
// ここで数え直ししてます
const linesText = $query('.lines').innerText.trim()
const chars = linesText.split(/\s+/).join('').length
counter.innerText = ${fmt(chars)} chars
counterWrapper.style.display = 'block'
}
}
// 数え直すタイミングは、テキスト入力時とペースト時
$id('text-input').addEventListener('input', updateCounter)
$id('text-input').addEventListener('paste', updateCounter)
// 何もしなくても3秒ごとに数え直す
setInterval(updateCounter, 3000)
}, 3000)
選択文字列をプロジェクト内で検索
code:script.js
// 選択された文字列をScrapboxプロジェクト内で検索する
// Scapbox検索ボックスを使ったときと同じ結果ページを開く
scrapbox.PopupMenu.addButton({
title: 'SB内検索',
onClick: function (text) {
var projectName = 'shio';
}
});
Gyazoに飛ぶメニュー
code:script.js
scrapbox.PageMenu.addMenu(
{title:"Gyazo",
})
全角半角変換
code:script.js
scrapbox.PopupMenu.addButton({
title: 'format',
onClick: text => text.split('\n').map(function(line) {
return line.replace(/^\s*/g, s => s.replace(/\s/g, '\t'))
.replace(/ /g, '')
.replace(/ぁ-ん|ァ-ヴ゙/g, s => String.fromCharCode(s.charCodeAt(0) + 1)) .replace(/A-Za-z0-9/g, s => String.fromCharCode(s.charCodeAt(0) - 0xFEE0)) .replace('(', '(')
.replace(')', ')')
.replace(/\S\(/g, s => s.charAt(0) + ()
.replace(/\)\S/g, s => ') ' + s.charAt(1))
.replace(/\S.*/g, s => s.charAt(0) + ' ' + s.slice(1))
.replace(/.*\S/g, s => s.slice(0, -1) + ' ' + s.slice(-1))
}).join('\n')
})
箇条書きナンバリング
code:script.js
scrapbox.PopupMenu.addButton({
title: 'No.',
onClick: text => text.split(/\n/).map((line, index) => ${index+1}. ${line}).join('\n')
})
Zen Mode
code:script.js
scrapbox.PageMenu.addItem({
title: 'Zen mode',
onClick: (e) => {
var bg = 'white' // ここにお好きな背景色を入れてね(テーマの背景が黒なら black で)
var style = document.getElementById('__zen__')
if (style) { style.remove(); e.currentTarget.innerText = 'Zen mode'; return }
else e.currentTarget.innerText = String.fromCharCode(0x02713) + ' Zen mode'
var css = body, .page { background-color:${bg} !important; background-image:none !important } +
'.navbar:not(:hover), .line .telomere:not(:hover), .col-page-side:not(:hover) { opacity:0 }'
style = document.createElement('style')
style.setAttribute('id', '__zen__')
style.appendChild(document.createTextNode(css))
document.head.appendChild(style)
}
})
UserCSS
code:style.css
//@import "/api/code/shio/黒いUserCSS/style.css";
吹き出しのような装飾
code:style.css
.deco-\{, .deco-\} {
font-size: 1em;
padding: 0.1em 0.2em 0.1em 0.2em;
border-radius: 0.4em;
margin: auto 0.3em;
display: inline-block;
max-width: calc(100% - 100px);
vertical-align: top;
}
.deco-\{:before {
position: absolute;
margin: 0;
padding: 0;
transform: translateX(-100%) translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0 0.6em 0.6em;
border-style: solid;
}
.deco-\}:after {
position: absolute;
margin: 0;
padding: 0;
transform: translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0.6em 0.6em 0;
border-style: solid;
}
.deco-\!:before, .deco-\!:after {
}
.deco-\{ a,
.deco-\} a {
}
重要な部分を赤くする
code:style.css
.deco-\! {
padding: 0.1em 0.2em 0.1em 0.2em;
}