ダダ漏れ日記

[Go] Windowsで実行した時、窓を表示させない

2016-07-08T16:05:00.001+09:00

例えば、デスクトップでそのexeをダブルクリックした時、あのDOS窓を開きません！

Goでは、ビルドオプションで設定できるんですって！
こんなのあるなんて知らなかったー。
痒いところに手が届くわー。

go build -ldflags="-H windowsgui"

こんな機能に用があるの、自分だけかもしれないけど。

[Dart+Polymer] Polymer1.0対応に伴いBraking Change! マジか??

2015-10-16T18:27:00.001+09:00

Dartが1.12になるのに伴い、Polymerが1.0に切り替わったらしく、サンプルを見てみた。

どんだけ変えるのかと。
今までの全く無駄じゃん！

Polymer Dart 1.0 Developer Guide
https://github.com/dart-lang/polymer-dart/wiki#10-developer-guide

@observableが@propertyに変更

さらに、2way-bindingするには、
@Property(notify: true)
と宣言しなくてはいけない。（"P"が大文字なのに注意）

プロパティへの値のセットに専用メソッドを使用する

@observable String hoge;
...
void updateHoge() => hoge = "gg";

これが下のように変わります。

@property
String hoge;
...
void updateHoge() => set("hoge","gg");

じゃないと、HTML側が更新されないです。

イベントの取り方が変わった

イベントの取り方はいくつかあるようです。

方法１：@Listenアノテーション

HTML側はidだけ設定します。Dart側でどのIDのどのイベントを受けるかをメソッド単位で設定します。

<button id="hoge">発射</button>

@Listen("hoge.click")
void fire(e,[_]) => print("hoge");

方法２：onにListenする案外ベタな方法

attached() {
  $["hoge"].on["click"].listen( (e)=>print("hoge") );
}

プロパティの変更イベントで受ける

以前はプロパティ名に"Changed"を付けた名前のメソッドが自動的に呼ばれたものが、@Listenアノテーションに統一されています。

@Property(notify:true)
String hoge;

@Listen("hoge-changed")
void hogeKawatta(e,[_]) => print("Kitsune!");

このとき、プロパティは2Way-bindingにする必要があるらしいですよ。

っていうか、[_]って何？

Dart Editorサポート終了

2015-07-12T16:03:00.001+09:00

そうですか。
Dart Editorは今後サポートしないのですか。

About Dart Editorを開いてもバージョンアップのチェックが表示されないからおかしいと思ってたんですよね。

まあDart Edtior、超中途半端でしたね。

今後はWebStorm推奨ですか〜。
有料じゃないですか〜。

プロジェクト移行しなきゃなぁー。
面倒くさいなー。

[Polymer+Dart] 逆引きPolymer

2015-06-10T18:30:00.000+09:00

Polymer 1.0なんてニュースもありますね。
Dart + Polymerも、ようやく実用レベルに達したような気もしてきたこの頃。

というわけで豆知識。

Polymerのレイアウト支援機能

horizontalとかflexとかのキーワードを属性に書くだけでレイアウトしてくれちゃうぞ。

<div horizontal layout>
<div>hoge</div>
<div flex>fuga</div>
</div>

これで横に並べてくれちゃう。"hoge"はサイズ固定。
https://www.polymer-project.org/0.5/docs/polymer/layout-attrs.html
でも、Polymer1.0にこの機能ないんだね…。Styleシートで行うようになっているようだ。なるほど。

プロパティにChangeリスナーを張る

プロパティ名の後に"Changed"と書いたメソッドを作成すると、そのプロパティが変更された後に呼ばれる！

@observable String hoge;
void hogeChanged() => print("hoge")
----
<input type="text" value="{{hoge}}">

これでinputの入力文字を変更する度にhogehoge出力されるぞ。
そんな便利なこと許されますかね！

idでHtmlElement検索

<div id="hoge"></div>
---
var d = $['hoge'] as DivElement;

これイケるッス。
でも、途中にtemplateが入ると検索が届かなくなります。要注意！

ある条件でElementを隠したい

あるElementを表示したりしなかったりすることは<template if="">でも可能ですが、そうじゃない方法もあります。

<div hidden?="{{flag}}"></div>
<button on-click="{{hoge}}">出てこい</button>
---
@observable flag = true;
void hoge() {
flag = false;
}

templateを使わないので、$[]検索も届きます。
っていうか?=って何ヨ？
Polymer1.0では、$=になっているようだ。

俺イベント

fire('hoge', detail: {'message': "hogehoge"});

ってやると、

<div on-hoge="{{fuga}}"></div>

ってキャッチできるそうですよ。

イベントってDOMツリーを遡上するのね

<div on-change="{{hoge}}">
<input type="radio" name="h" value="A">
<input type="radio" name="h" value="B">
</div>

radioボタンのon-changeがdivでキャッチ出来るんだと。

[Dart] Async時代のSleep

2015-05-16T23:23:00.000+09:00

Ver. 1.9.0にて「Asynchrony Support: Phase 2」となり、非同期処理が劇的に書きやすくなった。

もう、thenとか要らない。

そう、then free。

それはオレたちのフリーダム！

そして中カッコ地獄からの卒業

そんな時代に捧げるSleepの実現方法。

await new Future.delayed(const Duration(milliseconds:500), (){} );

…長いな。

[Go] static fileを返すだけのweb serverを作ってみた

2015-01-08T18:25:00.002+09:00

静的なファイルを返すだけのSimpleなWeb Serverを、Go言語で作ってみた。

テスト用のHTMLとして、
c:/webroot/webフォルダにhoge.htmlを適当に作ってくれ。

go run webserver.go
で実行。

ブラウザを立ち上げて、下記のURLを表示してみてくれ！
http://localhost:8085/web/hoge.html

hoge.htmlが表示されるはずだ。

今回のポイントは・・・

http.HandleFuncってpathの最後に"/"つけると、ディレクトリ指定になるんだね
Goでファイルを読み込む方法
WriteでbufをSliceして渡すのがGoっぽくてイイネ！Javaだとlength指定が必要だもんね
defer、ちょっ、コレ、ラクちんだわ～。もうtry..finallyとかタイプしたくない。
ラベル付きbreakも地味にいいわ～。これがあってswitchが生きる。

結論。
やればやるほどGo言語。

[Go] http HandleFunc Tips

2015-01-08T17:02:00.002+09:00

/hogeにアクセスされた時、fを呼ぶ

http.HandleFunc("/hoge",f)

/hogeディレクトリにアクセスされた場合、fを呼ぶ

http.HandleFunc("/hoge/",f)

/hoge/aaaでも、/hoge/aa/bbでもヒットする。

正規表現でルーティングしたい場合、工夫が必要。
一旦、ディレクトリ指定で受け取り、自前でルーティングするのだ。うむむ、なるほど～。

[Go] mapのソート

2014-10-31T17:50:00.000+09:00

配列のソートは強力だけど、
mapのソートは、JavaのTreeSetみたいには行かないようだね。

[Go] Push配信サーバーを作ってみた

2014-10-30T16:02:00.000+09:00

GoでPush配信サーバーを作ってみた。

go run gopush.go
で実行すると8085ポートで待ち受け開始。

別のターミナルとかで、
curl -v http://localhost:8085/con?key=hoge
ってやると配信を受けられる。

ブラウザとかで、
http://localhost:8085/api/push?key=hoge&mes=hello
にアクセスすると、ターミナルにhelloが通知されるよ！

このkeyで通知先を変更するのだ。

こんなの簡単に作れちゃうGo言語、すごいね！

goroutine(go/channel/select)が強力すぎて、Javaのwait/notifyとか戻れないよ！

[Go] http、chunked、切断検知、TimeOut、channelのclose

2014-10-28T16:08:00.003+09:00

Push配信するhttpサーバーを目指すサンプル。

盛り込んだ要素は下記の通り。

httpサーバー
→普通です。すみません。
Transfer-Encoding: chunked
→しょっぱなにw.WriteHeader(http.StatusOK)、
　そして、w.(http.Flusher).Flush()
goroutine&channel
time.Sleep
→渡す値は、単位を掛ける。
channelのcloseとその検知方法
→close()は組み込み関数。
　そしてchannel受信には2番目の戻り値があることを知れ
timeoutを仕掛ける方法
time.Afterでchannelゲットだぜ
通信切断の検知方法
→w.(http.CloseNotifier).CloseNotify()でchannelゲットだぜ
複数channelの同時受信
→selectをforで無限ループだぜ。あとラベル付きbreak。
ロギング
→log.Println()だぜ。

盛りだくさんだぜ～

[Go] Chunked Transferで返すHTTPサーバー

2014-10-24T14:27:00.003+09:00

HTTPのストリーミングサーバーのいわゆるLong Pollingってヤツ。

net/httpを使う普通のやり方に加えて、
ポイントは

WriteHeaderを先に呼ぶ
http.ResponseWriterをFlushする

ってこと。
Transfer-Encodingヘッダをchunkedにするとか、
Content-Lengthヘッダをセットしてはいけないとか、
は、勝手にやってくれる。

これを起動したならば、curlコマンドで試してみませう。

curl -v http://localhost:8085/

ヘッダが表示され、

< HTTP/1.1 200 OK
< Date: Fri, 24 Oct 2014 05:14:14 GMT
< Content-Type: text/plain; charset=utf-8
< Transfer-Encoding: chunked

その5秒後に

one

その5秒後に

two

が表示される！

[Angular.dart] 試してみた

2014-10-23T11:21:00.001+09:00

バージョンが1.0.0になったし、
Angular.Dartを試してみた。

まずは、Angular.Dartサイトのチュートリアルからサンプルをダウンロード。

なるほどなるほど。

っていうか、{{name}}って見えてますけど。

ng-cloakを設定しなければイカン？

してもダメですけど。

Dart版では、自力でdisplay:noneを設定しなければいけないとのこと。

・・・まあいいや。
次、Chapter_02。

Controllerねぇ～。
へぇ～。
って、ビルドエラー出ましたけど。
どういうこと？？

おっと、Dart版ではControllerがボツってることが判明。
なぬ～？？

よく考えてみたら、普通にDartのクラスで良いので確かに不要だわな。

っていうか、チュートリアル更新してよ。

急にこのサイト信用できなくなったよ、もう。

JS版とDart版の違いをまとめたサイトがこちら。
http://victorsavkin.com/post/86909839576/angulardart-1-0-for-angularjs-developers-introduction

上記サイトにリンク貼ってあるサンプルはこちら。
https://github.com/vsavkin/angulardart-sample-app

公式から飛べるけど、やりたい事別サンプルはこちら。
https://github.com/shailen/angulardart-samples/tree/master/mini_samples#angulardart-mini-samples

[Dart] Polymer : 独自selectを作ってみた

2014-10-22T17:23:00.000+09:00

HTMLのselectって基本的にワナが多いよね。

Polymerでのselectも正直言って不便。

valueでは初期値が渡せないのでselectedIndexでやるしかないのだが、indexって扱いづらい。
<select value="{{src}}">

というわけで、いい加減イヤになって、独自のカスタムselectを作ってみた。
（Paper Elementsを使うとちゃんとしているのかなー？）

こんな感じ。でも、IEとFirefoxでは動かないんだよね！ $['select']が正しく効かないのよ。 Polymerって一体いつ使い物になるのか？って感じだよね…。 Angularにするかな…。

[Dart] Polymer : カスタムフィルタを作成する

2014-10-21T17:17:00.001+09:00

PolymerでWebアプリを作っている時、
値段を表示したい時とかあるじゃないですか。

<div>スマイル{{ price }}円</div>

ってやるじゃないですか。
でも、値段って大抵3桁毎にカンマ付けないと怒られるじゃないですか。

というわけで、Dart側で、

var nf = new NumberFormat("#,##0","ja_JP");
price = nf.format(rowPrice);

とかやるのちょっとバカバカしいじゃないですか。
っていうか、こういうのって表示の問題だと思うんですよね！
であれば、MDVでいうとViewであるHTML側でなんとかならんのかと。

って思ってたのですが、
そういうとき、Polymerのカスタムフィルタ機能でなんとかなりそう。

[HTML側]

<div>スマイル{{ price | priceformat }}円</div>

[Dart側]

NumberFormat nf = new NumberFormat("#,##0","ja_JP");

String priceformat( String str ) => nf.format(str);

以上。

本家のPolymerでは、HTML側でfilterに引数を設定することも可能なのだが、内部のソース(polymer_expressions/eval.dart)を見た感じ、無理じゃね？という感じ。

[Dart] Futureサンプル連鎖編

2014-10-16T15:17:00.001+09:00

Futureがまだ直感的に使えない。
パッと出てこない。

下記は、Futureを連鎖させるサンプル。
FutureAの次にFutureBをやりたい時に使う。

HttpRequest.getString("http://hoge.com/")
.then( (str) {
var result = str+"hoge";
return new Future.value(result);
})
.then( (r) {
print(r); // http://hoge.com/から取得した文字列にhogeを追加したもの
})

[Dart] Polymer : Shadow Elementの取得

2014-10-06T17:03:00.001+09:00

Shadow Element（ほんまもんのHtmlElement）を取得するには、
PolymerElementの$を使う。

jQueryっぽいが、ここにはidしか指定できない。
（だって、Map<String,Element>だ）

しかも、制限があって、template if等で消される可能性のあるものは検索できないようだ。
（polymer[0.12.2+1]で確認）

<polymer-element>
<template>
<div id="hoge"> // ←これは取得可能

<template if="{{ visible }}">
<div id="fuga"> // ←これは取得できない
</div>
</template>

</div>
<template>
</polymer-element>

polymerの各種ケースのサンプル

https://github.com/dart-lang/polymer-dart-patterns

[Dart] Polymer : inputのchangeイベント

2014-10-06T16:55:00.000+09:00

inputでのon-changeイベントは、focusをlostした時の意味。

編集内容の変更をリアルタイムでウォッチするイベントはon-inputだ。

ただそれだけ。

Dart : packagesが空になってPub Getでエラーが出るようになった件

2014-09-10T23:57:00.000+09:00

ある日、Dart Editorで謎の赤バッテンがでるようになった。

packageのimportで「そんなpackageねぇ！」みたなエラーが出ていた。

そんなはずない、と思いつつpackageのツリーを見てみると、確かに一部のpackageが空になっている。

その時は、gitでbranchの切り替えを頻繁にやっていた。そのせいかもしれないなぁ、と思いつつ、Pub Getをやってみるも、

Unhandled exception:
Uncaught Error: FileSystemException: Cannot open file, path =...

とエラーが出て進まず。

万事休す…と思って、ネットの情報を漁っていたら…ありました。
https://groups.google.com/a/dartlang.org/forum/m/#!msg/editor/Sel-OJd-vfw/1Z2z0wYvY08J

PubのCacheを削除するといいよ！ということらしいです。

というわけでこの情報通り、
AppData/Roaming/Pub/Cache/hosted
の
pub.dartlang.org
を削除したらPub Getが通るようになって無事解決です！

このネットの情報では、「Windowsのsymlinkはhellだよ！」みたいなセリフがありました。
いつもはMacでやっているのですが、たまたまWindowsでやらざるを得なくて、いざやったらコレだよ。
Windowsなんとかしてください。

っていうか、Dart Editorのバージョン上げて今までのソースが動かなくなるのが怖くて、サブ機のWindowsで試したんだよね。Dartもそろそろ落ち着いて頂きたい！

[Dart] Dartでパースしてくれない日付について

2014-04-07T13:37:00.001+09:00

DartのDateTime.parseでは、
"2014-04-01T01:02:03+09:00"
の文字列をなぜか解析してくれない。
これってRFC3339でもISO8601でも定義されていると思うんだがー。
ホントにトホホだよ！

というわけでDateFormatを使用した回避方法。

まず、intlパッケージをインストール
pubspec.yamlのdependenciesに「intl:any」を追記する。

dependencies:

intl: any

続いてソース。

import 'package:intl/intl.dart';

…

var df = new DateFormat("y-M-dTH:m:sZ");
var t = df.parse("2010-10-12T13:20:30+09:00");

print(t)
print(t.toUtc())

これで出力内容は、

2010-10-12 13:20:30.000

2010-10-12 04:20:30.000Z

となる。

面倒すなぁ。

[Dart] コマンドラインアプリのためのDart資料

2014-01-07T10:45:00.000+09:00

サーバーサイドもしくはコマンドラインアプリのためのDartのサンプルが用意された。
Dartはブラウザアプリだけではないよ、ってことを本気で言いに来たようだ。

Dart By Example

https://www.dartlang.org/dart-by-example/#dart-io-and-command-line-apps

載っている情報は下記の通り。

ファイル関連

ファイル操作、ディレクトリ操作、シンボリックリンクの作成
文字列の読み込み、書き込み
バイト配列の読み込み、書き込み
テンポラリファイル、ディレクトリの作成

'package:http/http.dart'を使ったHTTPリクエスト

GET＆POST
※同じサーバーに連続してリクエストするときClientを再利用する技が目からウロコ
レスポンスの読み込み。文字列もしくはバイナリで。

'package:http_server/http_server.dart'を使ったWebサーバー

バインド…HttpServer（これはdart:io）
ファイルを返すだけのディレクトリ専用クラス…VirtualDirectory
特定のURLパターンで処理を振り分ける…Router, UrlPattern

その他

Socket通信…ServerSocket, Socket
WebSocket…WebSocketTransformer, WebSocket
OS情報取得…Platform.environment, Platform.operationgSystem
スクリプト自身のパスを取得…Platform.script
外部コマンドの実行…Process
URLやファイルパスの連結、分解、相対パス化、解析…'package:path/path.dart'

[Go言語] 豆知識、小ネタ

2013-12-13T13:23:00.001+09:00

まだまだよくわかっていないGo言語。
何をするにもどん詰まる。とにかく小ネタを記録する。

byte配列を文字列(string)に変換する

var s = make([]byte,10)
s[0] = 'a'
fmt.Printf("result=%s",string(s) )

stringをbyte配列に変換する

s := "test"
b := []byte(s)

何でも入るmapを作る(keyは文字列)

m := make(map[string]interface{})
m["first"] = "test"
fmt.Printf("result=%s",m )

mapをJSON化する

"encoding/json"のimportが必要

m := make(map[string]interface{})
m["f"] = "test"
r,_ := json.Marshal(m);

fmt.Printf("result=%s",string(r) )

JSON文字列をmap化する

"encoding/json"と"strings"のimportが必要

s := strings.NewReader(`{"f":"test"}`)

d := json.NewDecoder( s )

m2 := make(map[string]interface{})

d.Decode(&m2)

fmt.Printf("result=%s",m2 )

TimeをJSON化する

time.Timeはjson.MarshalでJSON化してくれないようだ。

というわけで、マニュアルでJSON化。

t := time.Now()

s,_ := t.MarshalJSON()

fmt.Printf( "%s", s )

stringからReaderを作成する

import (
  "strings"
)
s := strings.NewReader(`{"f":"test"}`)

Readerからbyte配列に変換する

import (
  "bytes"
  "strings"
)

r := strings.NewReader("hoge")
var buf bytes.Buffer
buf.ReadFrom(r)
b := buf.Bytes()

文字列リテラルのダブルクォートの代わり

HTMLでは、文字列リテラルを定義するのにダブルクォーテーションの他にシングルクォートが使えるがGo言語ではできないようだ。

その代わりにGo言語では`（バッククォート）を使う。へぇ〜

[Dart] PolymerでObservableにsetterを使う

2013-12-12T12:39:00.002+09:00

observableのプロパティに、setterを使いたいときってあるよね。

こんな感じ。


String _title = "";
@observable String get title => _title;
set title( String t ) => _title = "hoge $t";

で、html側で{{title}}ってやるわけですが。
でも、これ動きません！

titleの実体がfunctionだからだと思いますが、変更イベントが飛ばないのです。

というわけで、自分で変更イベントを飛ばせばOKとのこと。
具体的には、setterを下記のように変更します。

set title( String t ) {
_title = notifyPropertyChange( #title, _title, t );
}

notifyPropertyChangeの仕様は下記の通り。

dynamic notifyPropertyChange(Symbol field, Object oldValue, Object newValue)

戻り値はnewValueとなっています。
そして、これをするとgetterの@observableが不要になります。つまり、observableに頼らず、自前で変更イベントを出せるってことですね。

…っていうか、#titleって何ヨ？
本来、const Symbol("title")としなければいけないっぽいが、表記を省略できるってことかね？

参考資料：

同様の質問
https://groups.google.com/a/dartlang.org/forum/#!topic/web-ui/hxCqmwjnLIA

まさにこれのサンプル
https://github.com/sethladd/dart-polymer-dart-examples/tree/master/web/setter_with_observable_property_change

[Dart] PolymerElementを動的に作成

2013-12-11T18:12:00.001+09:00

PolymerElementを状況に応じて動的に作成すること、したいよね〜。

Seth Laddのサンプルによると、ore-tagというカスタムタグがあるとして、

querySelector("#place").childlen.add( new Element.tag("ore-tag") );

とすればいけるとのこと。

確かにこれで問題なく動くのだが、ワナがひとつ。
Pub Buildすると正しく動かんのだ、これが。

具体的には、enteredViewが呼ばれない。グハッ！

バグじゃね？

[Dart] ゲーム作ってみた

2013-12-10T18:42:00.000+09:00

Dartでゲーム作ってみたよ。

http://www.niku-mansei.com/contents/05club/club04game00.html

Canvasバリバリ系。
フレームはいわゆるsetTimerで取っている。

スマホでも動作するけど古い端末だとちょっと重いかも。
描画をキレイにするために、実は倍の解像度で描画してるんだが（いわゆるRetina対応）それが原因っぽい。

しかし、Dartは楽ちんですな〜。
もう、JavaとかObjective-Cとかやる気しないな〜。

[Dart] Polymer 資料＆豆知識

2013-11-29T19:05:00.001+09:00

DartでWebアプリを作るならPolymerってヤツを使わずにはいれないよね。
ということで、下記、勉強のための資料。

豆知識

on-clickのコールバックメソッドの引数は決まっている。

void handle(Event e, var detail, Element target )

on-clickのコールバックに独自の引数を渡したい時は独自attributeを使う。

HTML
<td on-click="{{handle}}" data-key="{{data.key}}">

Dart
void handle(Event e, var detail, Element target ) {
var hoge = target.attributes['data-key'];
...
}

PolymerElementにて表示開始を取る時は、enteredView()をオーバーライドする。

void enteredView() {
print("表示されたなう");
}

PolymerElement内でquerySelectorするときはshadowRootを使う。

void enteredView() {
var e = this.shadowRoot.querySelector("#mes");
e.text = "表示されたなう";
}

PolymerプロジェクトをJavaScriptアプリとしてエクスポート

通常のDartプロジェクトはdart2jsを使うんだが、Polymerプロジェクトの場合は、「Pub Build」を使うんだと。以前はPub deployとか--deployオプションとか存在していたけど、現在はこのPub Buildに一本化されている。
手順は下記の通り。

pubspec.yamlのentry_pointsが正しいことを確認。
pubspec.yamlをOverviewで開いて「Run pub build」をクリック。もしくは、エントリポイントのhtmlを右クリックし、「Build Polymer App」を実行。もしくは、build.dartをRun。
しばらく待つと、結果がbuildフォルダにエクスポートされる。
buildフォルダのエントリポイントとなるhtmlを右クリックし「Run as JavaScript」を実行。

おっと、packagesの中身まで実体化されているじゃないですか。こりゃ便利！
もしかしたら通常のDartプロジェクトもPub Buildできるのかしら〜！

htmlからアクセスするプロパティには@publishedが必要

DartのクラスのプロパティにPolymerのhtmlからアクセスしようとするじゃないですか。これ実は「@published」が必要なんですよ。知ってました？

<div>{{hoge.fuga}}</div>　←htmlでこうなっていたら…

class Hoge {
@published String fuga;　←こうする必要がある！
}

これが無くてもDartrium上で平気で動いちゃうのでホンマかいなと思うのですが、なんとこれ、Pub Buildすると動かなくなるんですよ！！
難読化されたソースでエラーが出るとホント心折れそうになりますよ！

querySelectorで取得したElementからPolymerElementのインスタンスを取得

下記のようなPolymerElementのカスタムタグが入っているとして…
<hoge-hoge id="hoge"></hoge-hoge>

xtagを使用すればインスタンス取得可！
var e = querySelector("#hoge");
var p = e.xtag as PolymerElement; ←ですよ！知ってました？