妻がなかなかお風呂に入らない、夜更しをする。そんな悩みを解決したいと思って「おやすみタイマー」というガジェットを作りました。
デモ動画
動作デモ
設定画面
システム概要
システム概要は以下の図の通りです。
時刻設定はブラウザから設定でき、設定ファイル(JSON)に保存が可能です。
設定された時刻になると音声が流れます。
使用した部品は以下の通りです。
- obniz Board 1Y
- Grove_MP3(https://obniz.com/ja/sdk/parts/Grove_MP3/README.md)
- 接続ケーブル(obniz BoardとGrove_MP3)
- スピーカー
汚いですが、結線した状態の写真です。
ソースコード
ソースコード
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://unpkg.com/obniz@3.x/obniz.js" crossorigin="anonymous" ></script>
<title>おやすみタイマー</title>
</head>
<body>
<div id="obniz-debug"></div>
<div class="container">
<h1>おやすみタイマー</h1>
<h2>設定した時間になると音声が流れます</h2>
<form>
<p>お風呂時間<input type="time" id="bathTimeText"></p>
<p>おやすみ時間<input type="time" id="sleepTimeText"></p>
<button type="button" id="saveButton">保存</button>
</form>
</div>
<script>
//put your obniz ID
var obniz = new Obniz("OBNIZ_ID_HERE");
var sleepSoundFlg = false;
var bathSoundFlg = false;
var sleepTime;
var bathTime;
var mp3;
var filename = "setting.json";
GetSettingJsonData();
//during obniz connection
obniz.onconnect = async function() {
$("#saveButton").on("click", async function() {
var saveData = { sleepTime:$("#sleepTimeText").val(), bathTime:$("#bathTimeText").val()};
var form = new FormData();
form.append('file', new Blob([JSON.stringify(saveData)]), filename);
await fetch('/users/me/repo/'+ filename,{
method: "POST",
body: form,
credentials: "include"
})
.then(result => {
sleepTime = $("#sleepTimeText").val();
bathTime = $("#bathTimeText").val();
console.log('Success:', result);
alert("設定を保存しました。")
})
.catch(error => {
console.error('Error:', error);
alert("設定の保存に失敗しました。")
});
});
mp3 = obniz.wired("Grove_MP3", {gnd:0, vcc:1, mp3_rx:2, mp3_tx:3});
await mp3.initWait();
function MatchTime(){
var nowTime = new Date();
var nowHour = set2fig( nowTime.getHours() );
var nowMin = set2fig( nowTime.getMinutes() );
var nowTimeMsg = nowHour + ":" + nowMin;
console.log(`nowTime=${nowTimeMsg}, sleepTime=${sleepTime}, bathTime=${bathTime}`);
if(sleepTime == nowTimeMsg){
if(!sleepSoundFlg){
sleepSoundFlg = true;
mp3.play(1);
obniz.display.print('Sleep Sound On');
}
}else{
sleepSoundFlg = false;
}
if(bathTime == nowTimeMsg){
if(!bathSoundFlg){
bathSoundFlg = true;
mp3.play(2);
obniz.display.print('Bath Sound On');
}
}else{
bathSoundFlg = false;
}
}
setInterval(MatchTime,5000);
};
function GetSettingJsonData(){
var data = fetch('/users/me/repo/'+ filename ,{ method: "GET", credentials: "include" }).then(res=>res.json())
.then(function(json) {
$("#sleepTimeText").val(json.sleepTime);
$("#bathTimeText").val(json.bathTime);
console.log(`sleepTime=${json.sleepTime}, bathTime=${json.bathTime}`);
sleepTime = json.sleepTime;
bathTime = json.bathTime;
});
}
function set2fig(num) {
// 桁数が1桁だったら先頭に0を加えて2桁に調整する
var ret;
if( num < 10 ) { ret = "0" + num; }
else { ret = num; }
return ret;
}
</script>
</body>
</html>
1
-
tomo2020
さんが
2021/05/08
に
編集
をしました。
(メッセージ: 初版)
ログインしてコメントを投稿する