【HTML】mmenuで右からスライドメニューを出す【javascript】

ちゃんとリファレンス読みましょう>俺

デモを見てたら、scriptはこう書く模様。

jQuery(document).ready(function( $ ) {
    $("#menu").mmenu({
        "offCanvas": {
            "position": "right"
        }
    });
});

(ToCoStick)Node.jsでシリアル通信してブラウザでグラフ表示(ccchart)

Node.jsのお勉強が必要になり、ひと段落したからメモ。

TWE-Liteから33msecごとにデータが送られてくると想定。
アナログ入力1の値を読み取り、wsモジュールを使ってccchartに送る。

以下、ソース。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=480">
<title>TWE-Lite Monitor by ccchart</title>
</head>
<body>

<script src="ccchart-min.js" charset="utf-8"></script>

<canvas id="hoge"></canvas>
<script>

var chartdata = {
	"config": {
		"width": (window.innerWidth-60) ,
		"height": (window.innerHeight-60)/1.2,
		"lineWidth": 2,
		"xScaleSkip": 33,
		"useVal": "no",
		"bg": "#000",
		"colorSet": ["#00FF00",],
		"maxY": 2000,
		"minY": 0,
		"maxWsColLen": 333
  },

  "data": [
    ["時間"],
    ["電圧"]
  ]
};

ccchart
  .init('hoge', chartdata)
  .ws('ws://127.0.0.1:3001')
  .on('message', ccchart.wscase.someColsAtATime);

</script>


</body>
</html>

ccchartTest.js

var WsServer = require('ws').Server;
var ws = new WsServer({port : 3001});
var express = require('express');
var serialport = require('serialport');

const ARRAY_NUM = 333;
var dataArr = new Array(ARRAY_NUM);
var time = 0;	//in msec

clearArray();
function clearArray(){
	var now = new Date();
	var hour = ZeroFormat(now.getHours(),2);
	var min = ZeroFormat(now.getMinutes(),2);
	var sec = ZeroFormat(now.getSeconds(),2);
	var nowStr = hour + ":" + min + ":" + sec;
	
	for(i = 0;i < ARRAY_NUM;i++){
		dataArr.push([[nowStr],[1000.0]]);
	}
	//console.log(dataArr);
}

broadcast();
function broadcast(volt){
	var tid = setInterval( function(){
		ws.clients.forEach(function(client){
			client.send(JSON.stringify(dataArr));
//			console.log(dataArr);
			
		});
	}, 100);	//100msec毎に送信
}



var portName = 'COM3';
var sp = new serialport.SerialPort(portName,{
	baudRate: 115200,
	dataBits: 8,
	parity: 'none',
	stopBits: 1,
	flowControl: false,
	//parser: '\n'//serialport.parsers.readLine("\n");
});

sp.on('open', function(){
	console.log('serial port open');
})
sp.on('data',function(input){
	var inBuffer = new Buffer(input, 'ascii');

	if(inBuffer.length < 49){
		return;
	}
	
	var inStr = inBuffer.toString('ascii',37,39);
	var volt = 1.0 * (parseInt(inStr,16) * 16);	//10進に変換,16倍して電圧にも変換,1.0倍してfloatに変換
//	console.log(volt);
	addData(volt);
	
});

function addData(volt){
	var now = new Date();
	var hour = ZeroFormat(now.getHours(),2);
	var min = ZeroFormat(now.getMinutes(),2);
	var sec = ZeroFormat(now.getSeconds(),2);
	var nowStr = hour + ":" + min + ":" + sec;

	dataArr.shift();	//最初の要素を取り除いて、
	dataArr.push([[nowStr],[volt]]);	//push
}

/**
 * [関数名] ZeroFormat
 * [機 能] ゼロ埋め
 * [説 明] 数値が指定した桁数になるまで数値の先頭をゼロで埋める
 *
 * @param  integer num    数値
 * @param  integer max    桁数
 * @return integer tmpS   ゼロ埋め後の数値
 */
function ZeroFormat(num,max){
    var tmp=""+num;
    while(tmp.length<max){
        tmp="0"+tmp;
    }
    return tmp;
}

ZeroFormat関数は
http://phpjavascriptroom.com/exp.php?f=include/js/formcheck/zero2.inc&ttl=%E6%95%B0%E5%80%A4%E3%81%AE%E5%85%88%E9%A0%AD%E3%82%92%E3%82%BC%E3%83%AD%E3%81%A7%E5%9F%8B%E3%82%81%E3%82%8B
を使わせて頂きました。

(HTML)VLC WebプラグインでGoPro HERO3のプレビュー表示

タイトルのまんま。

1.VLC Media Playerをインストールする。
 このとき、Webプラグインを必ずインストールする。
2.以下の通りHTMLファイルを作成

<!DOCTYPE HTML>
<html>
<title>VLCプラグインのテスト</title>
<body>

<embed type="application/x-vlc-plugin"
       pluginspage="http://www.videolan.org"
       width="640"
       height="480"
       id="vlc"
       target="http://10.5.5.9:8080/live/amba.m3u8"/>
</body>
</html>

とりあえず、GoPro本体のWifiパスワードとかは必要ない。
あと、現時点ではChromeでは動かなかった。Firefoxでのみ確認。
参考にしたのは以下のサイト。ありがとうございます。

VLC の Web Pluginを利用した動画配信試験 (Xsrv)

(Android)API Level 17未満で動的にIDを設定する(Java)

タイトルの通りの必要に迫られたので、ググってみたら、generateViewID()メソッドが出てきた。
後々も使いそうなのでメモ。

import java.util.concurrent.atomic.AtomicInteger;

//http://tools.oesf.biz/android-4.3.0_r2.2/xref/frameworks/base/core/java/android/view/View.java#sNextGeneratedId
//のまんま

public class IdGenerater {
    private static final AtomicInteger sNextGeneratedId = new AtomicInteger(1);

    public static int GenerateID(){
        while(true) {
	    final int result = sNextGeneratedId.get();
	        int newValue = result + 1;
		if (newValue > 0x00FFFFFF) newValue = 1;
		    if (sNextGeneratedId.compareAndSet(result, newValue)) {
			return result;
		    }
		}
	}
}

QtCreator3.3.2でandroid開発メモ1

AndroidManifest.xmlを直接いじるとき(例えばportrait指定とか)

プロジェクトの「ビルド」内、Build Android APKのAndroid内、
"Create Templlates"ボタンを押すとAndroidManifest.xmlが生成される?

以降はプロジェクトの「その他のファイル」内にAndroidManifest.xmlが現れるので、普通に編集可能。

ZXing.NetでQRコード読み取り(C#)

仕事で必要になったのでメモ。
ZXingのバグ?か、BarcodeReader.Decodeメソッドに食わせる画像によっては、
例外発生するみたい。
(公式のサンプルプログラムでも同様の現象を確認)

private BarcodeReader barcodeReader = new BarcodeReader();    //クラスのメンバとする

public Form1() {
    InitializeComponent();

    barcodeReader.AutoRotate = true;
    barcodeReader.TryInverted = true;
            
}

private string readQR(Bitmap bmp) {
    string ret = "(not found)";

    try {
        Result result = barcodeReader.Decode(bmp);
        if (result != null) {
            ret = result.Text;
        }
        }
        catch {
            //ZXingのバグ?barcodeReader.Decodeに失敗することがある ver 0.14.0.0 で確認
        }

        return ret;
    }
}

Qt(MinGW)+Freeglutでティーポットくるくるできたよ~

ようやくできた。忘れないうちにメモメモ。

環境はWin8.1+Qt5.3(MinGW)+freeglut-MinGW-2.8.1。

 

freeglutは解凍したファイルを以下のようにコピー。

・includeフォルダ内のGLフォルダ→Qt\Tools\mingw482_32\i686-w64-mingw32\includeへ

・libフォルダの中身→Qt\Tools\mingw482_32\i686-w64-mingw32\libへ

 

 で、コードは以下の通り。

.proファイル

QT       += core gui opengl

TARGET = OpenGLTest
TEMPLATE = app

SOURCES += main.cpp\
        mainwindow.cpp \
    glwidget.cpp

HEADERS  += mainwindow.h \
    glwidget.h

FORMS    += mainwindow.ui

LIBS += -lfreeglut


main.cpp

#include "mainwindow.h"
#include 
#include <GL/glut.h>

int main(int argc, char *argv[])
{
    glutInit(&argc,argv);
    QApplication a(argc, argv);

    MainWindow w;
    w.show();

    return a.exec();
}


MainWindow.h

    #ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include 

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H


MainWindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}


glwidget.h

#ifndef GLWIDGET_H
#define GLWIDGET_H

#include 
#include 
#include <GL/glut.h>

class GLWidget : public QGLWidget
{
    Q_OBJECT
public:
    explicit GLWidget(QWidget *parent = 0);

    void initializeGL();
    void paintGL();
    void resizeGL(int w, int h);

    void mousePressEvent(QMouseEvent *e);

private:
    QTimer timer;

};

#endif // GLWIDGET_H

glwidget.cpp

#include "glwidget.h"
#include <GL/glut.h>
#include <GL/glu.h>
#include 

GLWidget::GLWidget(QWidget *parent) :
    QGLWidget(parent)
{
    connect(&timer,SIGNAL(timeout()),this,SLOT(updateGL()));
    timer.start(16);
}

void GLWidget::initializeGL(){
    glClearColor(0.2,0.2,0.2,1);
    glEnable(GL_DEPTH_TEST);
    glEnable(GL_LIGHT0);
    glEnable(GL_LIGHTING);
    glEnable(GL_COLOR_MATERIAL);

}


void GLWidget::paintGL(){
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glRotatef(0.5, 1,1,1);
    glColor3f(1,0.6,0);
    glutSolidTeapot(0.6);
//    glBegin(GL_TRIANGLES);
//        glColor3f(1,0,0);
//        glVertex3f(-0.5, -0.5, 0);
//        glColor3f(0,1,0);
//        glVertex3f( 0.5, -0.5, 0);
//        glColor3f(0,0,1);
//        glVertex3f( 0.0,  0.5, 0);
//    glEnd();
}

void GLWidget::resizeGL(int w, int h){
    glViewport(0,0,w,h);
    glMatrixMode(GL_PROJECTION);
    glLoadIdentity();
    gluPerspective(45,(float)w/h,0.01,100.0);
    glMatrixMode(GL_MODELVIEW);
    glLoadIdentity();
    gluLookAt(0,0,5, 0,0,0, 0,1,0);
}

void GLWidget::mousePressEvent(QMouseEvent *e){
    //if mouse clicked,timer will stop

    if(e->button() == Qt::LeftButton){
        if(timer.isActive()){
            timer.stop();
        }
        else{
            timer.start();
        }
    }
}

んで、実行結果はこんな感じ。

f:id:ossannt:20140711190854p:plain

 

Ubuntuとかだったら楽勝だったのに、Win上では1週間くらいかかった・・・。

わかってしまえばどうってことないのよねorz