SurfaceでprocessingのVideo.Capture映像が緑がかりフレームレートが落ちる現象について

現象・症状

gyazo.com
フレームレートが1前後で全体的に緑がかった映像しか取得出来ない

発生する環境

- Surface Book初代(Surface Pro4でも起こる)
- Processing2系,Processing3.3.6(執筆時点)

- Skype等の他のビデオソフトでも起こる場合があるらしい

解決策

現状なさそう

回避策

外付けUSBカメラを使う
Processingの場合は、Captureのコンストラクタに渡すCapture.list();の配列番号を変えれば良い

原因

Windows Helloなどで用いるカメラの距離センサーの値が緑として合成されてる映像を取得してしまっていると考えられます
ドライバーを更新しろとぐぐったらありますが、最新版でも起こります

cronでnpm startしようと思ったらハマった

起こった現象

実行されない

解決策

0 * * * * cd /home/user/hoge/ && npm start

cron側でcdしてコマンドを叩く

解決まで

cronが動いてるか確認する

service crond status

起動してるか確認する

cat /var/log/cron

メールを設定してみる

MAILTO="hogehuga@gmail.com"
0 * * * * start.sh

詳しいエラーログがメールで届く

nanoを指定してcronを編集したい

export VISUAL=nano; crontab -e

drawingソフトをWebで動かす時のTips

この記事はMojirageアドベントカレンダーの25日目の記事です。
matatsuna.hatenablog.com

Snapsvg

SVGで描画をするためのライブラリです
http://snapsvg.io/

PEP

ディバイスやブラウザごとに違うpointerイベントの差を吸収してくれます
mojirageでは基本全てPEPのpointerを使って入力してます
github.com
サンプルデモのサイトがあるのでわかりやすいです
http://jquery.github.io/PEP/
属性にtouch-action="none"を入れいないと動かないブラウザがあるので注意です

touch-action:none

CSSのtouch-action:noneでスマホでのブラウザのズームを抑えることが出来ます
PEPの属性とは別で、これはbodyのcssに入れるといいです
developers.google.com
developer.mozilla.org

preventDefault

アクションに必要なボタンバーやシークバーがあるnav以外を動かしたらpreventDefaultで止めるということをしてます
これをすることで、要素が下に動いたり、ページのリロードなどの現象を止めることができます

const nav = document.querySelector('nav');
document.addEventListener('touchmove', (e) => {
    if (!isDescendant(nav, e.target)) {
        e.preventDefault();
    }
});
function isDescendant(parent, child) {
    var node = child.parentNode;
    while (node != null) {
        if (node == parent) {
            return true;
        }
       node = node.parentNode;
    }
    return false;
}

stackoverflow.com

最後に

どうにか、一人アドベントカレンダー最終日まで完走することができました
途中、忙しくて5日分を一気に書くという呆れたことをしてしまい申し訳ありませんでした
足掛け1年以上かけてwebシステムなんとか作り上げて、発表できてかなり達成感に浸ってます
しかし、これだけでは済まされず、すでに次の実装が決まってますので、一段落つき次第また記事にします
それでは、メリークリスマス、良いお年をー