読者です 読者をやめる 読者になる 読者になる

#daiizメモ

フレンチフライ トリュフ塩仕立て

技術ネタはてブ数が多いごはん情報

スポンサーリンク

Scrapboxのページ数の推移を可視化するUserScript

Scrapboxプロジェクト内のページ数の推移を可視化したかった.作成したものは Scrapbox のUserScriptと自前で組んだ簡単なウェブアプリの2パートから成る.うまくいくと専用レポートページでページ数の変化の折れ線図を確認できる.

以下の例ではまだ3日分のデータしかないので見栄えは良くないが,今後蓄積データが増えていくことで,直近30日分のページ数がプロットされる.

f:id:daiiz:20170418035914p:plain
自分のプロジェクトでの例

仕組み

  1. ページ一覧画面の右下ページ数をクリックして自前のウェブアプリに以下のデータを送信
    • ページ数
    • テーマ名 (今後,折れ線図のデザインで使おうと考えている)
    • プロジェクト名 (URLの一部ではなく,画面左上に表示されているもの)
    • f:id:daiiz:20170418035203p:plain
  2. ウェブアプリにデータを保存・蓄積
  3. レポートページにアクセスされたら蓄積されたページ数の日別変化を折れ線図で表示

準備

下記のような UserScript を自分のページのscript.jsに追加.

var daiizPageCounter = function () {
     var dLog = {
         'page': 0,
         'theme': 'default',
         'project': ''
     };
     var $p = $('div.page-list-status-bar');
     $p.on('click', function (e) {
         var $t = $(e.target).closest('div.page-list-status-bar');
         dLog.page = +$t.text().match(/\d+/)[0];
         dLog.project = $('#app-container').find('.navbar-brand > .title').text();
         $.ajax({
             'url': 'https://daiiz-apps.appspot.com/sb/p/a',
             'method': 'POST',
             'dataType': 'json',
             'data': JSON.stringify(dLog)
         }).done(function (data) {});
     });
     var $links = $('link');
     for (var i = 0; i < $links.length; i++) {
         var href = $links[i].href;
         if (href.match(/\/themes\//) !== null) {
             dLog.theme = href.split('/themes/')[1].split('.css')[0];
             break;
         }
     }
     $p.css({cursor: 'pointer'});
 };
 window.setTimeout(daiizPageCounter, 1000 * 3);
スポンサーリンク

記録手順

  • Scrapboxプロジェクトのページ一覧画面で右下に表示されているpages欄をときどきクリックするだけで良い.
f:id:daiiz:20170418032103p:plain
  • この数字をクリックすると上述のデータが自前のウェブアプリに送信されて,日付情報を付加して保存される.
  • ウェブアプリ側の設定は不要で,初回リクエスト受信時に自動でデータ蓄積の準備が整い,レポートページにアクセスするためのURL (例: https://daiiz-apps.appspot.com/sb/p/daiiz) が作成される.レポートページは,プロジェクトの private / public に関係なく,URLを知っている人が誰でもアクセスできる.
  • 1日最低1回クリックして送信すれば,毎日の最新ページ数を保存していける.

製作開始時点はGitHubの芝生ふうのデザインで可視化しようと思ったが,Scrapboxでは折れ線図の方が勢いが見れて良いだろうと思いこうなった.

今日の午後は健康診断なので,当日の昼食だけでもヘルシーなネタにしようということで,魚のスモール弁当です.

このスモール弁当は対角線の長さが短すぎて割り箸が収まらない.帰宅後やることリストを書き出したら全部こなすのに推定5時間くらい必要な試算となってつらい気持ちでいる.つらい気持ちになりすぎると健康診断に良くないから明るくいこうと思う.

一昨日くらいに書くべきで先延ばしになっている記事は,後ほどしっかり書きますのでよろしくお願いします.

【日記】骨なしケンタッキー(オニオン&コンソメ)を食べた

土曜日なのでケンタッキーへ行ってきた.帰りに雨に降られた,今週3回目.

骨なしケンタッキーシリーズの新しい商品「サクサク骨なしケンタッキー(オニオン&コンソメ)」を食べた.これは美味しい.ケンタッキーのチキンは骨があった方が旨いとかどこかで書いた気もするけれど,このチキンは一味違う.少し小振りだったので次回食べるときは2個くらいいけそう.

https://svgscreenshot.appspot.com/c/x/0c4e945c10dd273e55d2c7e97fafda6e.png
↑カーソルを乗せて影ができるとタイトル部分がクリックできます.クリックすると商品ページが開きます.(PCのみ)

Scapboxとブログのうまい連携方法を考えているので,今後の記事のタグ付け (カテゴリ割り当て) がシンプル (控えめ) になっていくかもしれない.

  • 研究室の棟から爆速で行けるセブンイレブンで買った
  • コンビニ弁当の良いところ
    • 並ばずに,席を待たずに,すぐに温かいものが食べられる
    • 自室で食べるので食事中に何か思いついたら直ちに作業にスイッチできる
  • スモールサイズの弁当
    • スモールだけど対角線の長さは割りばしよりも少し長いので,終わった箸を収納できる
  • miilに投稿APIがあればこのページを素早く生成できそう
    • miil投稿と同時にGyazoりたい

Image