1. iwata-n

    Posted

    iwata-n
Changes in title
+[JavaScript]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する
Changes in tags
Changes in body
Source | HTML | Preview
@@ -0,0 +1,99 @@
+https://twitter.com/kozeni_shkt/status/709743397196541953
+http://www.b-ch.com/ttl/index.php?ttl_c=467
+
+[[iOS]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する](http://qiita.com/oubakiou/items/b9b78b00906415d056b2)のJavaScript版です。
+
+Mac+Firefoxで動作確認した。Macの照度センサーはカメラの辺りにある。
+
+# ホスティング
+http://iwata-n.github.io/GetWild-js/
+
+localStorageに設定値を記憶しているのでブラウザ閉じても、また開けばすぐに使えるはず
+
+# 実装
+https://github.com/iwata-n/GetWild-js
+
+``` html
+<!DOCTYPE html>
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<meta charset="utf-8">
+<title>GetWild</title>
+<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
+<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
+
+<div id="value">CurrentValue: -</div>
+<div id="threshold">-</div>
+<div id="slider" style=" margin:5px;width: 700px;"></div>
+<input id="url" type="text" value="" style=" margin:5px;width: 700px;"/>
+
+<script>
+$(function() {
+ var isGetWild = false;
+ var threshold = 100;
+ var getwild_url = "https://youtu.be/LgBxze0ye94?t=1m45s";
+
+ // GetWild退勤
+ function getWildAndTouch() {
+ window.open(getwild_url);
+ }
+
+ // 設定値読み込み
+ if ("url" in localStorage) {
+ getwild_url = localStorage["url"];
+ }
+ if ("threshold" in localStorage) {
+ threshold = localStorage["threshold"];
+ }
+
+ // Url
+ $("#url").val(getwild_url)
+ $("#url").on("change", () => {
+ getwild_url = $("#url").val();
+ localStorage["url"] = getwild_url;
+ });
+
+ // しきい値設定
+ $("#threshold").html(threshold);
+ $( "#slider" ).slider({
+ max:1000,
+ min:0,
+ value:threshold,
+ step: 1,
+ slide: (event, ui) => {
+ threshold = ui.value;
+ localStorage["threshold"] = threshold;
+ $("#threshold").html(threshold);
+ }
+ });
+
+ // センサ
+ window.addEventListener('devicelight', function(event) {
+ var lux = event.value;
+ $("#value").html("CurrentValue: " + lux + 'lux');
+ if (lux < threshold) {
+ if (!isGetWild) {
+ isGetWild = true;
+ getWildAndTouch();
+ }
+ } else {
+ isGetWild = false;
+ }
+ });
+});
+</script>
+
+```
+
+# メモ
+- 2016/4月現在では、照度センサーが使えるブラウザがFireFoxしかない
+- Youtubeを新しいタブで開いているからポップアップ許可が必要
+- Youtubeの再生開始時に広告が入るとGetWild退勤じゃなくてCM退勤になる
+- devicelightイベントがロード時に発生しないのか、初期値が取れない
+
+# 他のGetWild退勤方法
+
+- [[iOS]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する](http://qiita.com/oubakiou/items/b9b78b00906415d056b2) [oubakiou氏](http://qiita.com/oubakiou)
+- [[Android]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する](http://qiita.com/napplecomputer/items/6afa7866c99becf56a0d) [napplecomputer氏](http://qiita.com/napplecomputer)
+- [[Arduino]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する](http://qiita.com/Shinichi-Ohki@github/items/1edbe910c8659b20b3fd) [Shinichi-Ohki氏](http://qiita.com/Shinichi-Ohki@github)
+- [[windows10]部屋の灯りが消えたら自動でGet Wildを再生してGet Wild退勤する](http://qiita.com/iwata-n@github/items/0ace766ee98326723b5f) 自分