Skip to content

Instantly share code, notes, and snippets.

View leaysgur's full-sized avatar
🫖

Yuji Sugiura leaysgur

🫖
131 followers · 60 following
View GitHub Profile
@leaysgur
leaysgur / recognition.js
Created January 18, 2018 06:53
Continuous recognition by SpeechRecognition API
const recognitions = [];
function R() {
const recognition = new window.SpeechRecognition();
recognition.onresult = function(ev) {
const resultText = ev.results[0][0].transcript;
console.warn(resultText);
};
@leaysgur
leaysgur / postcss-multi-entry.js
Created January 30, 2018 06:13
Enable multiple entries with postcss-cli.
const path = require('path');
const { spawn } = require('child_process');
const flags = process.argv.slice(2);
const config = require('./postcss.config.js');
// Parse postcss.config.js's extra fileds like webpack.config.js
const entries = [];
for (const [name, src] of Object.entries(config.entry)) {
const input = path.join(config.context, src);
@leaysgur
leaysgur / karma.conf.js
Created March 30, 2018 07:27
Use Karma x rollup x chrome:headless to test MobX x WebRTC app
module.exports = function(config) {
config.set({
frameworks: ['jasmine'],
files: [
// XXX: need to load as external to avoid multiple instance issue
'./node_modules/mobx/lib/mobx.umd.js',
'__tests__/**/*.test.js',
],
preprocessors: {
'__tests__/**/*.test.js': ['rollup'],
@leaysgur
leaysgur / 1:run.sh
Last active April 16, 2018 01:27
Try sdpSemantics: "unified-plan" on Chrome Canary
# 1. run with flag
/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary --enable-blink-features=WebRTCUnifiedPlan
# 2. open chrome://flags and enable `Experimental Web Platform features`
@leaysgur
leaysgur / get-local-ip.js
Created June 6, 2018 07:38
Minimum function to get local IP address.
function getLocalIP() {
let ip;
return new Promise(async (resolve, reject) => {
const pc = new RTCPeerConnection({});
pc.createDataChannel('dummy');
pc.addEventListener('icecandidate', ev => {
if (!ev.candidate) {
pc.close();
ip ? resolve(ip) : reject(new Error('IP not found'));
}
@leaysgur
leaysgur / format-date.js
Last active July 18, 2018 02:26
WebComponents to format date strings by Intl.DateTimeFormat()
class FormatDate extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: 'open' });
this._render();
}
_render() {
const textContent = this._getBaseText(this.textContent);
const date = this._getFormatted(
textContent,
@leaysgur
leaysgur / cam-diff.js
Last active October 28, 2018 06:14
import pixelmatch from './pixelmatch.js';
const W = 640 / 2;
const H = 480 / 2;
main().catch(console.error);
async function main() {
// アプリの画面をつくる
const { $video, $setupButton, $diffButton } = initView();
// カメラ映像をとってくる
@leaysgur
leaysgur / index.html
Created November 7, 2018 05:17
Use MessageChannel with ServiceWorker
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ServiceWorker Messaging Test</title>
</head>
<body>
<script src="./main.js"></script>
</body>
</html>
@leaysgur
leaysgur / index.html
Created November 29, 2018 08:29
WebRTC 1 peer connection w/ N streams
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script src="./main.js"></script>
<script>main();</script>
</body>
@leaysgur
leaysgur / memo.md
Created November 30, 2018 01:52
Use .y4m file for fake stream in Chrome 
open "/Applications/Google Chrome.app/" --args --use-fake-device-for-media-stream --use-file-for-fake-video-capture="/path/to/example.y4m"

ってすると、フラグ有効状態でChromeが立ち上がる。

getUserMedia()すると、ローカルストリームの代わりに指定した.y4mの動画が使われるので、おじさんを見ながら開発しなくていい。