基本情報

このページではIoTコンテンツ(Visitor Counter)を「編集」できます。編集したコンテンツは、プロジェクトの一覧ページでは元のコンテンツを置き換えて表示されます。新しい項目として足したい場合は「 フォーク」してください。

※写真URLは.jpg, .jpeg, .pngのいずれかで終わるもの、またはGyazoへアップロードされたページのURL(https://gyazo.com/hogehogeなど)に対応しています。

※IoTコンテンツの説明、エントリポイントに関する情報 main: index.js およびf3jsモジュールへの依存情報 dependencies: { f3js: (略) } は、この欄の内容とマージされるため記入不要です。

カードのプレビュー
Visitor Counter
'16/3/14 11:10
Count visitors and shows the number.
arc@dmz

プライベートコンテンツ

このコンテンツはすでに公開されているのでプライベートにできません。「 フォーク」ならプライベートにできます。

ソースコード

マイコン・小型コンピュータのプログラムのソースコードを記述してください。f3jsパッケージをrequireすることで筐体設計が可能です。詳しくはAPIドキュメントをご覧ください。

var f3js = require('f3js'); var x = 5 /* Offset x [0, 100] */ , y = 5 /* Offset y [0, 100] */; f3js.drawRectangle(x, y, 195, 70); // load drivers. var grove = require('jsupm_grove'); var groveMotion = require('jsupm_biss0001'); var GCL = require("jsupm_grovecircularled"); var tm1637 = require('jsupm_tm1637'); var LCD = require('jsupm_i2clcd'); // instantiate a circular led driver. var circle = new GCL.GroveCircularLED(3, 2); // Initialize 4-digit display and Jhd1313m1 LCD display var display = new tm1637.TM1637(4, 5); var myLcd = new LCD.Jhd1313m1(0, 0x3E, 0x62); myLcd.setColor(255, 0, 0); // put the circular led and displays. f3js.add(circle, x + 30, y + 30); f3js.add(display, x + 80, y + 20); f3js.add(myLcd, x + 150, y + 27.5); //f3js.drawRectangle(x + 105, y + 37.5, 5, 10); var level = 0, colon = true; function rotateSpinner() { var date = new Date(); var time = ("0" + (date.getHours()+9).toString()).slice(-2) + ("0" + date.getMinutes().toString()).slice(-2); display.writeString(time); display.setColon(colon); circle.setSpinner(level ++); if (level > 24) level = 0; } var circleInterval = setInterval(rotateSpinner, 100); // instantiate a motion sensor. var sensor = new groveMotion.BISS0001(8); // put the motion sensor. f3js.add(sensor, x + 80, y + 50); f3js.drawRectangle(x + 55, y + 44, 5, 10); var counter = 0, lastTime = 0; function readSensorValue() { var date = new Date(); // detect motion. if (sensor.value() > 0) { console.log('o ' + date.toString()); var time = date.getTime(); if (time - lastTime > 5000) { countUp(); } lastTime = date.getTime(); } colon = !colon; } function countUp() { counter ++; var counterString = '' + counter; if (counter % 10 === 1) counterString += 'st'; else if (counter % 10 === 2) counterString += 'nd'; else if (counter % 10 === 3) counterString += 'rd'; else counterString += 'th'; myLcd.setColor(255, 0, 0); myLcd.setCursor(0,0); myLcd.write(counterString + ' visitor'); myLcd.setCursor(1,0); myLcd.write('running on f3.js'); } var sensorInterval = setInterval(readSensorValue, 1000); process.on('SIGINT', function() { clearInterval(circleInterval); clearInterval(sensorInterval); });
カスタマイズ

このコンテンツにはカスタマイズできる項目がありません。

表示オプション
ソースコード中で変数宣言にコメントをつけるとカスタマイズ項目としてGUIウィジェットが表示されます。グレーアウトしているウィジェットはユーザが提案した項目で、ソースコード末尾の変数宣言に対応しています。

設計のダウンロード

モジュール

このプロジェクトは組み立てにモジュールを必要としません。

レイアウト
プログラム

ログインしないと使えない機能です。