大人の二乗

イヤフォン付けて電車で座ってると
女学生が二人乗ってきた。

会話はあいにく聞こえない。

二人とも似たような格好して、似たような髪の色にして、広告の北川ケイコみたいな化粧して。

対面に座っている、結婚式の披露宴でも参加するかのような格好をしている、黒で統一された濃いテカテカグレーの靴を履いた、30代の女性の控えた美しさが対照的だった。

そういえば、今日の国立科学博物館はキタネーオヤジとウルセーガキと綺麗なママで一杯だったなぁ。
コンピューター博物館に行こうと思ったら、日本にないんだってな。
ってことで、コンピューターコーナーがあるってネットに書いてあったから、上野の博物館に足を運んだって訳よ。
そしたらさ、今日からインカマチュピチュ展じゃない。
いやー、もう文系はねぇ。
って思いながら1400円払って中に入った。
まぁミーハーよ。

インカ帝国の興亡。
山脈に棚田を作り水路を造り民を食わせ他民族を侵略し従わせ。
侵略され滅んだ文明。
文字を持たない人々。
彼らが書いた小説でもあったら是非とも読んでみたい。
戦争を起こし、他民族を侵略した王。
スペイン人に殺された王。
釈尊はなかなか鋭い事を言ったもんだ。
諸行無常
是生滅法
生滅滅已
寂滅為楽

いやいや、こんなものを見に来たのではない。
コンピューターの未来に対するヒントはないかと、思って来たのだ。
電子計算機は作業を効率化させた。
それにより社会はさらに加速する。
40年ほど前に国鉄に大型のコンピューターが導入され、座席予約システムが構築された。
これにより便利に、そして素早く予約が出来るようになった、という。
なるほど、って。40年前かよ。
ふむぅぅぅ。
コンピューターの未来か。

しかし、まぁ、コンピューターコーナーは狭いなぁ。
工作機械やら、人工衛星やら、江戸時代の科学資料やら、零戦やらおいてはあるが、これだけか。
国産自動車のオートモの設計図がおいてある。
見る。
意味がわからないが、親父の話とかみ合わせて落ち着いて見れば、わかるぞ。
これは後輪駆動部のデフで、これはシャフトだな。
そーすると、これがトランスミッションで、そこから一本の棒が座席の横にあるわけだ。
なるほど。
内燃機関をつんだ車の構造は進化してないんだな。
大衆化はしたけど、車の過去と過去から見る現在はさして変わってないんだな。
そこに入るのが電気自動車か。
車という用途は変わっていない。
コンピューターの用途は多岐にわたる。
コンピューターの未来か。


電車の隣が一席あいたので、そのうちの一人が座る。

あいにく会話は聞こえない。
曲が終わったタイミングで会話が耳に入った。

「でさ、ミカ何て答えたと思う？」
「なんて？」
「大人の事情だ、って。」

笑いが吹き出しそうになって、堪えた。
お前も大人だろ。おい。
子供なのか？
あ？
いや、大人ぶってたいんだろうな。
体は大人なのによ。
大人なのによ。

会話がなかなかバカらしくて面白いぞ。
頑張って聞くことにした。

「んで、彼女のパパ頭良いらしくて。青学出て不動産はじめたんだって」
「すごいねー」
「アオガクよアオガク」

またしても笑いそうになった。
アオガクで頭が良いとか言っちゃうんだから、たぶん余程のバカなんだろう。
顔は絶対にニヤニヤしている。
聞かないようにつとめた。
これこそ大人の事情である。

Indexed Databaseの使い方 03

Indexed Databaseについての第三番目の記事になります。
正直ここまで書いて、後悔してます。
なんでかって？
あまり準備もせずに書いてるからです。
読者の皆様は、実際に動く例を見せてくれって思ってるかもしれません。
見せたいのも山々ですが、JavaScriptを独学で作ったので、非常に醜く、見せるのは恥ずかしいコードでして。
だからといって、この記事のために1からプログラム書くには、まだJavaScriptとjQuery勉強途中で微妙です。
ごめんね。
見たい方はコメント残して下さい。
読みにくいですよ。

前回までのおさらい。

var dbName = "databasename";
var dbVersion = 1;
var indexedDB = window.indexedDB || window.webkitindexedDB || window.mozIndexedDB;
var request = indexedDB.open(dbName,dbVersion);

request.onupgradeneeded() = function(event){

var db = event.target.result;

var objectStore = db.createObjectStore("objectstorename",{keyPath:"key"})

objectStore.createIndex("firstIndex","firstIndexKeyPath");

objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"})

}

request.onsuccess()=function(){

var db = event.target.result;

var transaction = db.transaction("objectstorename", "readwrite");

var objectStore = transaction.objectStore("objectstorename");

objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"});

transaction.oncomplete=function(event){

 alert("追加完了");

 }

transaction.onerror = function(event) {

 alert ('追加失敗.');

 }

db.close()

}

重ねて申し上げますが、Indexed DBの開発にはサーバーが必要です。

では、インストールされたDBを見てみましょう。

Google Chrome、FirefoxまたはOperaを使いましょう。

こんな記事書いていて、言うのもなんですが、Indexed DBはまだ使い物にならないので、システムのアーキテクチャー考え直した方が良いと思いますよ。

Google Chrome、Operaの場合はデベロッパーツールを開きます。

そして、開いたツールのResourcesをクリックします。

Firefoxの場合、Web Consoleですね。

Cookiesとか、Session Storage、Local Storageとかと一緒にIndexed DBというのがあると思います。

Indexed DBを開くと、データベースがあると思います。

なかったら、インストール出来てないか、ドメインが違う場合があります。

データベースをクリックするとObjectStoreがあります。

なかったら、上手くインストール出来てません。

その場合は、Versionをあげてonupgradeneededで再設定するか、データベースファイルを消して再インストールする必要があります。

データベースのファイルは環境によって違いますが、各ブラウザのプロファイルディレクトリーの下にあります。

各ObjectStoreを開いてみましょう。

db.createObjectStore("objectstorename",{keyPath:"key"})で作ったものです。

ObjectStore自体が、KeyValueペアのデータ構造を持っています。

ObjectStoreのKeyはKeyPathで指定したKeyです。

各ObjectStoreの下に、各Indexがあります。

この各IndexはValueのIndexになります。

もし、ObjectStore内のデータがkey:｛date: "2016-02-14", firstIndex:"pugera",secondIndex: "warosu"｝という連想配列だったとします。

このObjectStoreに、インデックスを付けます。

objectStore.createIndex("firstIndex","firstIndexKey");

objectStore.createIndex("secondIndex","secondIndexKey");

こうすることで、keyはもちろんのこと、firstIndexまたはsecondIndexを使って、該当のデータにアクセスすることができます。
この場合、dateのインデックスは付けていないので、dateでデータを参照する事は出来ません。

ObjectStoreのKeyPathを使ったアクセスの方法は、

request.onsuccess()=function(){//まずDBとの接続をして

var db = event.target.result;//DBを見つけて

var transaction = db.transaction("objectstorename", "readwrite");//ObjectStoreとの接続方法を指定し、

var objectStore = transaction.objectStore("objectstorename");//ObjectStoreを指定する。

var objectRequest = objectStore.get("key")//KeyPathのバリュー

//indexを用いる場合は

var findex = objectStore.index('firstIndex');

var firstRequest = findex.key('pugera')

var sindex = objectStore.index('secondIndex');

var secondRequest = findex.key('warosu');

};

こんな感じになります。

長くなったので、今回はこの辺で。

Firefox OS終了のお知らせ

スマートフォン向けのOSの新星として期待されていたFirefox OSの開発が終了するそうです。
残念というか、なんというか。
なんだかなぁ、って感じですが、賢明な判断だと思います。
もう少し、せめてWindows10が出る前に普及しちゃえばよかったかもしれませんが、Win10が無料で攻めている所に、攻め込んでいくのもアレですからね。
Ubuntu Phoneはどうなるんでしょうかね。

Mozillaも諦めたわけでは無くて、IoT向けにOSの開発を進めるとかで。
どうしてもOS作りたいんですね。
ラズパイに乗っけられるOS枠を狙うんですかね。
オープンソースソフトウェア同士の苛烈なパイの奪いになるのかな？
リナックスもMozillaも仲良くしようよ。

でも、そうだよなぁ。
HTML5とJavaScriptでプログラムを組めるようするのだろうから、ややこしいLinuxの事とか省略できるなら、それはそれで大きなアドバンテージなのかも知れないね。
インフォメーションテクノロジーの世界は今日も発展の毎日ですなぁ。

Firefox OS搭載の携帯がauから出ていましたね。
飛びつかなくてよかったぁ。
出たとき迷った。
けどね、学んだんですよ。
早すぎても良いことないって。

Androidの最初の端末G1に飛びついた過去があります。
ってのもiPhoneじゃフラッシュ対応して無くて、Travianっていうブラゲが出来ないから、っていう理由でね。
実際に携帯でやってみると、もっさり重たくて使い物にならない。
最初はまっとうなアプリがなかった。
そして、色々なアプリが1年くらいして出てきた。
新しいアプリはOSのバージョンが2以上とかになってた。
そして、OSのバージョンアップが1.6以上にならなくて、プゲラって事になった。
そのころモトローラから新しい機種が出てて、とても悔しい思いをした。

iPad初期も飛びついた事をここで告白しておこう。
もちろん、今思うとプゲラだと思う。
なんでかって？
まず、第一に云いたいのはアプリのなさ。
そして、1年くらいしたらアプリがそろってきた。
新しいiPadが出てきて、新しいOSが出てくる。
iOS5からアップデート出来ないって、何よ。
アプリがOSに対応してないって何よ。

初期の製品ってテスト段階がある程度終わった完成版ベータだって事に気がついてしまったんだよね。
その後お客から色々とクレームなりレビューが出て、それを反映した製品が出てくる。
その中で、初期の色々のなモノが切り捨てられていく。
切り捨てられていく製品を買ったユーザーって、何ですかね。

そういう経緯があって、新製品には飛びつかない事にした。
ちょっと遅いくらいが良いんだよね。
スレッガー中尉じゃないけどさ、MAYA段階ってのがあって、（Most Advanced Yet Acceptable）、ギリギリのラインを行くなら、僕の場合ちょっと遅くした方が良いって経験を通して学んだ。


プログラムが出来なかった当時、ただのコンスーマーだったから、こういうプゲラが起きたのだろう。
もし、出来ていたなら、アプリがないことを良いことに初期のマーケットにグイグイ行けたかもしれない。
がしかし、グイグイ行ったところでFirefoxOSアプリをグイグイ作ったところで、OSが終了したらプゲラだ。

あー、Ubuntu Phoneが気になるなぁ・・・

Indexed Databaseの使い方 02

前回の記事では、Indexed　DBの作成の仕方を説明しました。
今回の記事では、作成したデータベースにデータを入れていきます。

前回のおさらいです。

コードは以下になります。

var dbName = "databasename";
var dbVersion = 1;
var indexedDB = window.indexedDB || window.webkitindexedDB || window.mozIndexedDB;

var request = indexedDB.open(dbName,dbVersion);

request.onupgradeneeded() = function(event){

var db = event.target.result;
var objectStore = db.createObjectStore("objectstorename",{keypath:"key"})
objectStore.createIndex("firstIndex","firstIndexKeyPath");
}

少し話がずれますが、大事なことなので、作成環境について説明します。
Indexed DBの作成は、HTML5とJavaScriptですが、サーバーが必要になります。
何故なら、Indexed DBはSame Origin Policyを使っています。
これはドメインが違ったら、データベースにアクセス出来ないようになっている、ということです。
XSS（クロスサイトスクリプティング）予防のためです。


では、本題のデータを入れていく話に戻りましょう。

request.onupgradeneeded() = function(event){

var db = event.target.result;
var objectStore = db.createObjectStore("objectstorename",{keyPath:"key"})
objectStore.createIndex("firstIndex","firstIndexKeyPath");
objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"})
}

これは、こういう事です。
{objectstorename:{key:"キーのバリュー",firstIndexKeyPath:"firstIndexのバリュー"}}
この方法は、onupgradeneededの時に、データを入れる方法です。
が、基本的の形は一緒です。objectStore.add()で入れます。

いつもアップグレードする訳ではありません。
なので、普通の場合はこうなります。
request.onsuccess()=function(){
var db = event.target.result;
var transaction = db.transaction("objectstorename", "readwrite");
var objectStore = transaction.objectStore("objectstorename");
objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"});

transaction.oncomplete=function(event){
alert("追加完了");
}
transaction.onerror = function(event) {
alert ('追加失敗.');
}
db.close()
}
となります。

この時点で、もうよくわからない？
もがいてください笑

データベースの消し方はindexedDB.deleteDatabase("データベース名");となるので、

var req = indexedDB.deleteDatabase(dbName);

req.onblocked = function(){
 alert("Got Blocked on Deleting Database. Please close other tabs and reload.");
 };
req.onsuccess = function(){
 alert("Deleted Database Successfully");
}; 
req.onerror=function(){
 alert("Error on Deleting Database");
};
となります。

エラーやブロックされる場合は、実力行使ですね。

実際のファイルを消すという方法もあります。

Indexed Databaseの使い方 01

HTML5で使えるデータベースのIndexed DBの使い方のメモです。
2016年1月現在のAPIです。
現段階では準拠なので、正式決定の際に変更の場合があります。
APIが変更になったら、使えない場合があるので、確認してください。

まず始めに、データベースの名前を変数に入れます。
var dbName = "databasename";
次に、データベースのバージョンを整数で変数に入れます。
var dbVersion = 1;
小数点を入れると、動きません。
次にブラウザーが違う場合でも動くように
var indexedDB = window.indexedDB || window.webkitindexedDB || window.mozIndexedDB;
と、indexedDBの変数を作ります。

この三つが必要となる変数です。
では、Indexed DBに接続しましょう。

接続には、indexedDB.open（データベースの名前,データベースのバージョン）となります。
今回の例の場合は、
indexedDB.open(dbName,dbVersion)で開きます。
これを変数に入れます。
var request = indexedDB.open(dbName,dbVersion);

読者の中で、疑問に思う方もいるでしょう。
「え？データベース作ってないのに、接続すんの？」
はい、そうなんです。
無くても接続なんです。

ここが、第一関門。
request.onupgradeneeded()で、データベースを作成します。
これの理屈はこうです。
データベースが無い場合はバージョン0と認識されます。
また、もしデータベースが存在して、そのバージョンがdbVersionより小さい場合は、データベースのアップグレードが行われます。

では、データベースの中を作っていきましょう。
Indexed DBはMongo DBのようなモノです。
テーブルはありませんが、テーブルの変わりに、ObjestStoreというモノを作ります。
ObjectStoreは連想配列です。
createObjectStore()で、ObjectStoreを作ります。
createObjectStore("ObjectStore名",{keyPath:"keypathname"})
最初の引数は、ObjectStoreの名前、関係DBでいうテーブル名です。
その次の引数は、連想配列になります。Keyはkeypath（プライマリーキーみたいなモノ）、ValueはkeyPathの名前になります。
そして、ObjectStoreの中にcreateIndex()でIndexを作り、各Indexがデータフィールドとなります。
createIndex("インデックス","インデックスキーパス",{unique:false})は最低二つの引数を必要とします。最後の{unique:false}はオプションです。{unique:true}とすると、同じデータが入らなくなります。

request.onupgradeneeded() = function(event){
var db = event.target.result;
var objectStore = db.createObjectStore("objectstorename",{keyPath:"key"})
objectStore.createIndex("firstIndex","firstIndexKeyPath");
}

これで、データベースが出来ました。
次の記事でデータベースにデータの入れ方を書きます。

Windows Store Appについて 01

Windows Store Appを甘く見ていました。
よくよくよく、考えてみると、面白いですね。
まさに、モバイルアプリ戦国時代と例えることが出来ると思います。
どういうことか、説明しましょう。

モバイル端末の革命はiPhoneから始まったと考えてみましょう。
小型コンピュータであった携帯電話が、さらにコンピュータ化しました。
iモードなどでアプリをダウンロードし、携帯にアプリを入れる時代は来ていましたが、App Storeの登場により、モバイル端末アプリ市場が急速に拡大しました。
これに追随するように、Android端末が出ました。
スマートフォンの普及が進むにつれて、各陣営はアプリの市場を手に入れました。

また、開発者にとってもおいしい話でした。
アプリを販売し収入を得たり、アプリからの広告で収入を得たり、既存のWebアプリの市場を奪っていきました。
Webという共通のプラットフォームから脱却し、OS空間でのアプリという市場。OSの元締めからしたら、おいしい話です。

Windows8からモバイル端末を意識した、Store Appが出来ました。完全に、OS空間でのアプリ市場を見据えたモノです。
私は、てっきり、C#を使った一つの言語空間だとばかり思っていました。

しかし！！！

Javascript、HTML、CSSを使ってアプリの作成が出来るという、WebアプリもStore Appで利用できるという、開発者にとってはありがたい話です。
iOS用、Android用と、開発者はそれぞれの言語を理解し、場合によっては勉強する必要があります。
HTML、CSS、Javascriptを使えるフロントエンドデベロッパーが、アプリを作れるというのは、とんでもない開発者の囲い込み/取り込みのようにしか私には思えません。

今後、HTML5が発展・普及するにつれて、Webアプリは、今までパイを奪ってきたモバイルアプリ市場から、パイを奪い返すことになります。
アプリをダウンロードせずに、URLにアクセスするだけで使えるアプリ。
HTML5についてる、IndexedDBを使ったアプリは今後増えることでしょう。

IndexedDBの問題点は、まだ技術的に確定していないことです。
2014年に、IndexedDBを使ったアプリを開発したことがありますが、その時は泣きを見ました。
DBへの接続方法が、大きく変わり、ブログで公開されている方法を試してみても動かなかったのです。

Windows Store Appは、Web Appに対応している。
なんというズルでしょうか。
Visual Studioになんで、JavaScriptがあるんだろう、と思っていました。
ふと気になって、Windows Store App JavaScriptと調べて見ると、げげげげーと。
2014年当時から、出来てたのに、そんなこともしらずにWebApp作ってましたよ。
まぁ、Windowsのモバイル端末やStore Appがどれほど普及してるかは、別問題ですけど、Windowsですよ。
でかいマーケットだと思いますよ。
どーですか、フロントエンドデベロッパーの皆さん。
Windows Store App作りませんか？

Winforms動的テキストボックス

C#のWinformsでのお話。 動的にテキストボックスをフォームに出力するにはどうすれば良いのか、と思案にくれていました。 ある条件では、テキストボックスを1個。ある条件では、3個。はたまた、ある条件では10個などなど、ダイナミックにテキストボックスを表示する方法はないのかと。 HTMLをつかったWebベースだったら簡単にできますが、Winformsの場合、フォームの大きさが決まってるし、下に下に伸ばすにも、下にあるエレメントも動かさないといけないしなぁ。 HTMLだったら、簡単なのに！！ そういう風に思って、困っていました。 あるとき、気がつきました。 データグリッドビューじゃね？と。 Datagridviewだったら、横にスクロールバーついてるし、勝手に可変調節してくれて、Rowごとのデータもアクセスが可能じゃんか！ Datagridviewにデータバウンドせず、カラムの編集をする。 そしてカラムの追加をする。 この時に、カラムの属性を選択する。 ボタン、チェックボックス、コンボボックス、イメージ、リンク、テキストボックス。 例 品目  数量 というグリッドビューを作ります。 品目はデータベースから引っぱってきて、数量はユーザーインプットとします。 品目のカラムはコンボボックスにします。数量はテキストボックスにします。 品目は、データベースから引っぱってきて、かつ、入力時にデータベースに書き込むので、品目IDが必要になりますから、コンボボックスにします。 行の追加後に、データソースを指定してあげましょう。 データソースが無い場合は、データセットを入れましょう。このあたりの手順は、コンボボックスのデータベースからのデータソース設定手順と同じです。 DisplayMemberを品目名に、ValueMemberを品目IDにします。 あとは、LoadのFunctionとデータ確認などなど必要な関数を入れていきましょう。 一件落着ですね。 見た目は悪いけど、必要な事項はこれで満たせる！ したいことと、出来ること、よくよく考えて、頭の中で寝かせると、あるとき思いつきますよね。 こういう現象出来る人間でよかった！

Excelゾンビの殺し方

C#上でExcelを開いたりすると、Excelのプロセスが残る場合がありますね。 メモリを解放、GC等を適切に処理しないと起こる現象です。 なので、プログラムからExcelを使う場合、Excelファイルに書き込んで保存するのが一般的な方法です。 しかし、ファイルに保存するのが嫌だ、ファイル名与えたりするのも面倒くさい。 そのまま、Excelのウィンドウを開いて、表示したいという方もいるはず。 しかし、そういう構造でプログラムを組む場合、該当のExcelプロセスの管理をプログラム側がする必要があります。 Excelのウィンドウを開いたまま、プログラムを閉じた場合、管理外になってしまうしぁ。 開いたら開きっぱなし、という構造にすると、Excelのプロセスが残って、Excelゾンビってのになってしまう。 寝る前に思いついた邪道な方法を公開します。 ムチャクチャですよ。 プログラミング的に正しいのか、わかりませんが。 効果はあります。 プロセスの中のExcelでウィンドウのタイトルが無いのが、ゾンビです。 だったら、そのプロセスをKillしてしまえば良いじゃん。 foreach (System.Diagnostics.Process clsProcess in System.Diagnostics.Process.GetProcesses())//すべてのプロセスを一個ずつ見て {      if (clsProcess.ProcessName.Equals("EXCEL"))//プロセスの名前がExcelの物がある場合、      {           if (clsProcess.MainWindowTitle == "")//該当プロセスのメインウィンドウのタイトルが無い場合           {                clsProcess.Kill();//該当プロセスを終了してください。           }      } } どうでしょう。 これで、Excelゾンビプロセスは終了が出来ます。 ネットで調べたけど、この方法を紹介してる人は居ませんでしたね。 邪道ですね。こんなの思いつくの、最低のプログラマーだけですね。ふふふ。 副作用はあると思うので、用法はよく考えて使って下さい。