Vamp Records

読:『Software Design 2012年1月号』

Posted by ivoryworks on 2011/12/24 13:40 No comments

Android受託開発の奥義

ビジネス寄りの特集タイトルだけど内容的には、受託開発についての文章は半分にも満たないので、表紙だけ見て買ったり買わなかったりしないこと。

シェルスクリプトの連載始まりました。

Gunma.web #7 で喋ってきました『エダカリン！』

　先日のGunma.web #7で発表してきました。
　今回はLTでなく10分程度の発表です。LTじゃないのは初めて。

20111217 gunmaweb#7 エダカリン！

View more presentations from ivoryworks

　テーマはツリーデータの枝刈りで、かなり昔に作成したWebアプリ実用 R アナグラミングを題材にしてローマ字アナグラミングのデータ構造をいじくりまわすという趣旨です。

　実用 R アナグラミングは、ANIを(アニ|アンイ)の複数読みができないというバグを抱えたまま数年放置していたアプリなのですが、今回Gunma.webの発表機会もあって取り組んでみました。
　今回作成したライブラリは、まだアプリに取り込んでないのでバグは抱えたままです（というか元の作りが悪くて単純なI/Fの差し替えで対応できない）。そのうち差し替えます。

　今回のソースコードはgithubに置いてあります。disってください。

romaji-anagram
https://github.com/ivoryworks/romaji-anagram

　発表後、具体的な処理について質問がいくつかあって、お茶を濁すような形で説明してしまったのですが、詳しくははコード見てください。ごめんなさい。

　それと、これは個人的なポリシーなのですが、今回のスライドにソースコード載せてません。今後も私のスライドにソースコードが載ることはありませんし、（たぶん）これまでも無かったと思います。
　理由はいくつかありますが、一番大きいのはGunma.webが言語に特化した勉強会でないからです。
　今回の題材はPHPで書いていますが、PHPerのプログラマーの方にも非PHPerのプログラマーの方にも非プログラマーの方にも同じくらいのInputになるように心がけています。
　LTだったら1枚のスライドに長くて十数秒しか割けないとか、スライドなのであまり小さな文字は書けないとか、そもそもコードがダメとか小さな理由はいくつもあるのですが、まあそういった事なので今後ともよろしく。

Gunma.web #7 に行ってきたよ

Posted by ivoryworks on 2011/12/20 19:30 No comments

　2011/12/17 Gunma.web に参加してきました。(ATND)

　会場はこれまでと趣向を変えて前橋プラザ元気21の会議室で行いました。
　予定人数18名のところ満席となり過去最多。初参加の方々も！
　そしてLT3本、発表3本とボリュームあって内容も充実してました。人数多いと楽しいね。もちろん自分も発表してきました。

　会場満席のためプロジェクタ置いたり接続するPC置いたりするスペースが無く、食事用に用意した弁当つまり登利平の鳥めし言うなればソウルフードトリメシの箱を用いてプロジェクター台を急設しました。すごい！Gunma.web断然すごい！
　こちらのレポートに写真あるから見てね。ヒドいから。

　以下レポート。いつも簡単ですみません。スライド等へのリンクは順次ここに張られると思うのでそちら参照のこと。

「あじゃいるについて」[LT] @hatori_
　Gunma.web初LTでトップバッターですが、内容の前にまず、デスクトップPCでLTに取り組もうとする姿勢が会場を震撼させました。これがGunma.webです。違います。
　テーマはアジャイル。初LTということもあり、5分オーバーで延長でも全て語りつくぜず残念だったと思います。アジャイルはデカすぎるのでLTにするなら更にターゲット絞ると良かったかもしれません。

「エダカリン！」@ivoryworks
　10分くらい喋りました。詳細は別エントリします。とりあえずスライドこちら。

「javascript の MVC」@kanayannet
　主催者の発表。個人的に大きなjavascript書かないのでフレームワークとかMVCとか、いまひとつピンと来ないのですが、新しい事を知る良い機会になりました。勉強会はこのように『普段漁らない情報』を得られる（しかも説明付き！）という所が素晴らしいと思っています。

「プログラマになれないあなたのための言語戦略」 @parrot_studio
　安定の発表。~~あまりの情報過多でスピーカーが酸欠になるという事態になっ~~　すみません。間違えました。そういった事態にはなってません。今回の発表の中では一番楽しかったです。
　プログラミング言語にはそれぞれ得手不得手があります。プログラミング言語を習得するに越したことはないですが、得手不得手をお互いに補うような構成で身につけると問題や課題の解決に対するアプローチの数が変わってきます。
　「そういう言語がある事を知っている」だけでも良いと思っています。時間的に許されるなら必要になった時に習得するのでも良いです。ただそれには前もって存在を知っておく必要があります。おそらく1つないし2つの言語を扱える人は、新たな言語を習得するのにそれほど時間を必要としません。今回の発表はその良い機会だったと思います。

「プログラマのための中間CA証明書入門」[LT] @tsurumau
　SSLの証明書のやり取りは過去に勉強したはずなのにすっかり忘れてました。いやいや憶えたからかもしれない。
　個人的にオレオレ証明書じゃなくて正規の証明書を扱うことは今後もないと思いますが、サービス利用側としてもしっかりとした知識を持っておく必要あると思っています。

「でこぼこの光と影」[LT] @某じょし
　UIにおいてのエンボスのはなし。実は昔、ドット絵でボタンたくさん作ったことがあって、光源とハイライト＆シャドーについて勉強しました。
　その時の光源は左上にあったのですが、今回の説明および例として挙げられたUIでは真上にある事を知り驚きました。
　そう言えば、MacのアクアUIの頃から光源が真上にあるデザインが増えてきたような気がします。

　以上。発表の後は主催者からの連絡事項と懇談で幕を閉じました。
　参加者の中からLTやる人（やりたい人）増えてきて個人的に嬉しいです。

参加者のレポート
Gunma.web#7 開催報告 @kanayannet
　オフィシャルレポート。各発表へのリンクはこちら参照。

Gunma.web #7 (on 2011/12/17) まとめ – どっかのBlogの前置きのような @parrot_studio
毎度Gunma.webのレポートで情報量ダントツ。ありがとうございます。

gunma.webにおじゃましてきたよ！ @craim
初参加の上レポートありがとうございます。
個人的には参加レポートがもっと増えてくれば良いかなと思います。振り返り重要。

日記：Gunma.web #7　に参加してきました　#gunmaweb
安定の秘境感ありがとうございます。
こちらも初参加＆レポートです。

　実は、群馬 ITグルメの会 #2 という2次会があったのですが残念ながら参加できませんでした。前回の#1も不参加で残念至極。

Fedora16 on Thinkpad X220

Posted by ivoryworks on 2011/12/14 21:14 No comments

　3月に買ったばかりのThinkPadをこのまえ失くしちゃって、あまりのショックで落ち込んで我を失ったり気を失ったりしてたら、ある日 ThinkPad X202 が手元に届いていました。

　Windows7が入ってたのですが、リカバリ領域ごと消してリリースされたばかりのFedora16をインストール（最初からOS入ってないモデル出して欲しい）。ひとつ前のFedora15からGNOME3が採用されて、X201以前に使用していたGNOME2とはだいぶ異なる外観に（GNOME2に比べたらかなりスタイリッシュですね）。

　操作感もGNOME2とは大きく異なって、というかほとんど別物で、かなり戸惑ったりしてますが（Webで調べるまでシャットダウンの方法がわからなかった）なんとか頑張っていこうと思います。

Fedora 16のシャットダウンの方法
これはどうもマルチユーザーで使用することを考え、他のユーザーが使用中に間違って
シャットダウンをしないように考慮したものと見られます。

　ナルホドー。

　これまで（GNOME2時代）テーマの変更やGUIのカスタマイズなどには手をつけてませんでしたが、ちょっと色々と試してみようかな。

読:『入門 HTML5』

Posted by ivoryworks on 2011/11/27 08:36 No comments

HTMLに関わる書籍は暫く買ってなかったのでひさしぶり。

最後に買ったのは『Web標準の教科書』なので、6年前ということになる。

HTML5については、理解が中途半端な感じなので、姿勢を正して勉強してみます。

読:『Software Design 2011年12月号』

Posted by ivoryworks on 2011/11/18 21:18 コメントは受け付けていません。

表紙に「うんこ」と書かれたIT系書籍始めて見ました。
「うんこ演算」と書かれています。

とりあえず「イケてるGitの使い方」から読もうかな。

早くイケたいです。

カラーコードの輝度を操作する(YCbCr値変換)

Posted by ivoryworks on 2011/11/10 11:00 コメントは受け付けていません。

　カラーコード(#000000)の輝度を操作する処理を書きました(JavaScript)。
　カラーコードをYCbCr値に変換して輝度(Y)を操作することで実現しています。

　これはコトバパレットの実装の一部で、任意の色をを明るくしたり暗くしたりする必要があり、元々PHPで実装していました。
　今回のバージョンアップでクライアント側でも必要となり(Canvas)、JavaScriptで書き直しました。

function ctrlBrightness(cCode, value)
/* カラーコードと輝度の増減値を渡し、変換後のカラーコードを得ます */

function setBrightness(cCode, value)
/* カラーコードと輝度を渡し、変換後のカラーコードを得ます */

　また、以下の処理を関数化し、カラーコード、RGB値、YCbCr値の相互変換が行えるようにしています。

・カラーコード→RGB値
・カラーコード→YCbCr値
・RGB値→カラーコード
・RGB値→YCbCr値
・YCbCr値→カラーコード
・YCbCr値→RGB値

　なお、カラーコードには、6桁表記(#000000)と3桁表記(#000)がありますが双方に対応しています。
　但し、戻り値のカラーコードは全て6桁表記に統一されます。
　カラーネームとrgb値には対応していません。

　実装にあたり以下を参考にしました。

色空間 – Wikipedia
http://ja.wikipedia.org/wiki/色空間

RGB→YCbCr・YCbCr→RGB
http://eseuta.mine.nu/colorspace.html

　短いので貼り付けますが、GitHubにも置いてあります。
https://github.com/ivoryworks/colorcode-brightness.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133

/*
* Control brightness to ColorCode
*
* @param string cCode ColorCode(CSS format #000000 or #000)
* @param float value Brightness offset value
* @return string ColorCode(CSS format #000000)
*/
function ctrlBrightness(cCode, value) {
var ycbcr = colorCode2Ycbcr(formatColorCode(cCode));
ycbcr[0] = roundOff(ycbcr[0]+value, 255, -255);
return ycbcr2ColorCode(ycbcr);
}

/**
* Brightness set to ColorCode
*
* @param string cCode ColorCode(CSS format #000000 or #000)
* @param float value Brightness value(0 to 255)
* @return string ColorCode(CSS format #000000)
*/
function setBrightness(cCode, value) {
var ycbcr = colorCode2Ycbcr(formatColorCode(cCode));
ycbcr[0] = roundOff(value);
return ycbcr2ColorCode(ycbcr);
}

/**
* Convert ColorCode to YCbCr value
*
* @param string cCode ColorCode(CSS format #000000 or #000)
* @return array YCbCr value([0]==Y, [1]==Cb, [2]==Cr)
*/
function colorCode2Ycbcr(cCode) {
var rgb = colorCode2Rgb(formatColorCode(cCode));
return rgb2Ycbcr(rgb);
}

/**
* Convert YCbCr value to ColorCode
*
* @param array YCbCr value([0]==Y, [1]==Cb, [2]==Cr)
* @return string ColorCode(CSS format #000000)
*/
function ycbcr2ColorCode(ycbcr) {
var rgb = ycbcr2Rgb(ycbcr);
return rgb2ColorCode(rgb);
}

/**
* Convert RGB value to YCbCr value
*
* @param array RGB value([0]==R, [1]==G, [2]==B)
* @return array YCbCr value([0]==Y, [1]==Cb, [2]==Cr)
*/
function rgb2Ycbcr(rgb) {
var y = 0.298912 * rgb[0] + 0.586611 * rgb[1] + 0.114477 * rgb[2];
var cb = -0.16877709556951089920871620499976 * rgb[0] - 0.33122290443048910079128379500024 * rgb[1] + 0.5 * rgb[2];
var cr = 0.5 * rgb[0] - 0.41835760988634807613309598795016 * rgb[1] - 0.081642390113651923866904012049843 * rgb[2];
return new Array(y, cb, cr);
}

/**
* Convert YCbCr value to RGB value
*
* @param array YCbCr value([0]==Y, [1]==Cb, [2]==Cr)
* @return array RGB value([0]==R, [1]==G, [2]==B)
*/
function ycbcr2Rgb(ycbcr) {
var r = ycbcr[0] + 1.402176 * ycbcr[2];
var g = ycbcr[0] - 0.71448921433795138515984187135938 * ycbcr[2] - 0.34561921433795138515984187135938 * ycbcr[1];
var b = ycbcr[0] + 1.771046 * ycbcr[1];
return new Array(roundOff(r), roundOff(g), roundOff(b));
}

/**
* Convert ColorCode to RGB value
*
* @param string cCode ColorCode(CSS format #000000 or #000)
* @return array RGB value([0]==R, [1]==G, [2]==B)
*/
function colorCode2Rgb(cCode) {
cCode = formatColorCode(cCode);
return new Array(
parseInt(cCode[1]+cCode[2], 16)
,parseInt(cCode[3]+cCode[4], 16)
,parseInt(cCode[5]+cCode[6], 16)
);
}

/**
* Convert RGB value to ColorCode
*
* @param array RGB value([0]==R, [1]==G, [2]==B)
* @return string cCode ColorCode(CSS format #000000)
*/
function rgb2ColorCode(rgb) {
return '#'+('0'+rgb[0].toString(16).toUpperCase()).slice(-2)
+('0'+rgb[1].toString(16).toUpperCase()).slice(-2)
+('0'+rgb[2].toString(16).toUpperCase()).slice(-2);
}

/**
* Round off value(0 - 255)
*
* @param int value integer value
* @return int integer value(0...255)
*/
function roundOff(value, high, low) {
if (high == undefined) { high = 255; }
if (low == undefined) { low = 0; }
if (value > high) {
return high;
} else if (value < low) {
return low;
}
return Math.floor(value);
}

/**
* ColorCode formatting
*
* @param string cCode ColorCode(CSS format #000000 or #000)
* @return string cCode ColorCode(CSS format #000000)
*/
function formatColorCode(cCode) {
if (cCode.match(/^#[0-9A-F]{6}/i)) {
return cCode;
} else if (cCode.match(/^#[0-9A-F]{3}/i)) {
return '#'+cCode[1]+cCode[1]+cCode[2]+cCode[2]+cCode[3]+cCode[3];
} else {
return '#000000';
}
}