小池宏幸
https://gyazo.com/15914dced4eaa032cba2d3c4b7e17c12
自己紹介
筑波大学 大学院 工学研究科 電子・情報工学専攻 修士修了。2000年にソニー株式会社に入社。リコメンデーション技術や画像検索技術の開発に従事。2006年に株式会社ゼータ・ブリッジに入社。事業マネージャとして画像認識事業を立ち上げる。2010年5月に Piascore 株式会社（旧 プラスアド株式会社）を創業、代表取締役に就任。2010年度 独立行政法人 情報処理推進機構(IPA)未踏ソフトウェア事業 スーパークリエータ。 趣味では、クラシックピアノ（主にショパン）を弾く。 SNS
管理しているScrapbox
UserCSS
プレゼンモード
code:style.css
}
.app.presentation .page {
width: 1200px;
}
.app.presentation .line.section-title {
font-size: 3.0vw;
font-weight:bold;
}
.app.presentation .line {
font-size: 2.5vw;
line-height: 1.7em;
/*font-family: 'Sawarabi Gothic', sans-serif;*/
/*font-family: 'Sawarabi Mincho', sans-serif;*/
}
code:style.css
/* 一覧カードを小さくする */
/*
.two-two {
width: 114px !important;
height: 130px !important;
}
.two-two .icon {
padding-top: 30px !important;
}
.two-two .title {
height: 0px !important;
}
.page-list .grid li,
.related-page-list .grid li.page-list-item,
.related-page-list .grid li.relation-label {
width: 114px !important;
height: 130px !important;
}
*/
UserScript
code:script.js
document.querySelector('.app')
.insertAdjacentHTML('beforeend', '<div id="presentation-progress" style="display:none"></div>')
document.querySelector('.app')
.insertAdjacentHTML('beforeend', `<style media="screen">
display: block !important;
z-index: 100; position: fixed; bottom: 0; left: 0; width: 100vw;
text-align: center; line-height: 1;
font-size: x-small; /* 📝バーの高さを変えたいときはフォントサイズを変えてね */
--bar-color: #fc0; /* 📝プログレスバーの色 */ --bar-bgcolor: #eee; /* 📝プログレスバーの背景色 */ --complete: 0;
background: linear-gradient(to right,
var(--bar-color) var(--complete), var(--bar-bgcolor) var(--complete), var(--bar-bgcolor))
}
</style>`);
(() => {
const updateProgress = () => {
const sections = Array.from(document.querySelectorAll('.section-title'))
const currentPos = sections.findIndex(e => {
return window.getComputedStyle(e, null).getPropertyValue('display') != 'none'
}) + 1
const complete = currentPos / sections.length * 100
const progressBarElem = document.getElementById('presentation-progress')
progressBarElem.style.setProperty('--complete', complete + '%')
progressBarElem.innerText = ${currentPos} / ${sections.length}
}
const appObserver = new MutationObserver(mutations => {
mutations.forEach(mutation => {
const addedStyles = Array.from(mutation.addedNodes).filter(node => node.tagName == 'STYLE')
if (addedStyles.length) {
// プレゼンモード開始？
// STYLEタグも MutationObserver で監視したかったけど無理ぽいのでキーイベント拾います
window.addEventListener('keydown', updateProgress)
updateProgress()
}
const removedStyles = Array.from(mutation.removedNodes).filter(node => node.tagName == 'STYLE')
if (removedStyles.length) {
// プレゼンモード終了？
window.removeEventListener('keydown', updateProgress)
}
})
})
appObserver.observe(document.querySelector('.app'), { childList: true })
})()
code:script.js
// 選択した文字列にマーカー
scrapbox.PopupMenu.addButton({
title: 'マーカー',
onClick: text => [# ${text}]
})
Ctrl+Tで日時入力
code:script.js
scrapbox.TimeStamp.addFormat(']YYYY/MM[/DD HH:mm')
code:script.js
scrapbox.PageMenu.addMenu({
title: '見出し',
onClick: () => {
scrapbox.PageMenu('見出し').removeAllItems()
for (let line of scrapbox.Page.lines) {
if (!line.section.start) continue
if (!line.text.startsWith("[* ") && !line.text.startsWith("[** ") && !line.text.startsWith("[*** ")) continue
if (!line.nodes) continue
const image = ""
const noIcon = false
// hogeとhogeは先頭をインデントする。
const marginLeft = line.text.startsWith("[* ") ? " - " : ""
const marginLeft2 = line.text.startsWith("[** ") ? "・" : ""
const title = marginLeft + marginLeft2 + renderPlainText(line.nodes)
const onClick = () => location.hash = line.id
scrapbox.PageMenu('見出し').addItem({ title, image, onClick })
}
}
})
function renderPlainText(node) {
if (node instanceof Array) return node.map(node => renderPlainText(node)).join('')
if (typeof node === 'string') return node
switch (node.type) {
case 'icon':
case 'strong-icon':
return node.unit.page
}
return renderPlainText(node.children)
}
function getIconUrl(node) {
if (/icon/.test(node.type)) {
return /api/pages/${node.unit.project||scrapbox.Project.name}/${node.unit.page}/icon
}
if (node instanceof Array) {
return node.map(getIconUrl).find(img => img)
}
return null
}
code:script.js
scrapbox.PopupMenu.addButton({
title: 'NewPage',
onClick: text => {
const lines = text.split(/\r\n/g) .trim()
.replace(/\^\+.icon\]/gm, '')
const projectRoot = (() => {
const tmp = location.href.split('/')
tmp.pop()
return tmp.join('/')
})()
const currentPageTitle = decodeURIComponent(location.href.split(/\//g).pop())
lines.unshift(from [${currentPageTitle}])
const body = encodeURIComponent(lines.join('\n'))
window.open(${projectRoot}/${title}?body=${body})
return [${title}]
}
})
code:script.js
$('body').attr('data-daiiz-rel-bubble', 'off'); // 関連ページを吹き出し表示する
$('body').attr('data-daiiz-text-bubble', 'on'); // リンク先ページのテキストを表示する
$('body').attr('data-daiiz-icon-button', 'on'); // アイコンをボタンにする