WEB/システム/IT技術ブログ

MNP(携帯電話番号ポータビリティー)でSoftbankからauに乗り換えました。

初めて携帯を持ってから十数年、一度もキャリアを変更したことがなかったので、乗り換えは今回が初めてです。
正確には、ツーカーから、J-PHONE、vodafone、ソフトバンクと会社は何度も変わりましたが。

そんな中、意識せずとも契約内容はコロコロと変わり、10年前に説明を受けたものとはまったく異なった内容になっています。はっきりと思い出せませんが、確か10年前には使えば使うほど、年々基本料金が安くなるといった内容だったような。
得をしているのか、損をしているのか、複雑すぎて分からないですね。

今回の契約更新内容を残しておいて、10年後に見たらどう印象を受けるのか、そのためにメモを残してみようと思いました。
乗り換えを検討中の方にも参考にしていただければと思います。

今回はKineticJSで生成したオブジェクトにイベントを登録してみます。

KineticJSでは、シェイプオブジェクトに対して、マウスオーバー、クリックやドラッグなどのマウスイベントを検出することができます。

実装方法は以下のようにオブジェクトに対して、イベントを登録するだけです。

    var rect = new Kinetic.Rect({
        x:100, 
        y:25, 
        width:100, 
        height:50, 
        stroke:"red"
    });
	rect.on("mouseover", function(){ 
		alert("Mouse Over");
	});
	rect.on("mouseout", function(){
		alert("Mouse Out");
	});
	rect.on("click", function(){
		alert("Click");
	});

サンプルでは、赤枠の四角形に対して、マウスオーバー、マウスアウト、クリックでメッセージを出力するように作成してみました。
ベースとなるソースは前回までに取り上げたので割愛します。

jQueryでオブジェクトのアニメーションなどを実装する場合に「jquery.easie.js」を使って動きを滑らかに表現することができます。
jquery.easie.js

以前に、jQueryのイージングプラグインを紹介しましたが、「jquery.easie.js」の方がより直観的で、容易にカスタマイズが可能です。
「jQuery Easing Plugin」でjQueryのアニメーションにイージング効果をつける

CakePHP2系がリリースされてしばらく経つので、そろそろ安定してきたかなと思い、実際にCakePHP1.3.6からCakePHP2.1.3へ移行してみました。
以下は、アップグレードに伴い、実際に作業した内容をまとめたものです。

ちなみに、CakePHP2.1.3はインストール済みのものとします。

ファイル名のルールがキャメルケースへ

これまでスネークケースであったファイル名のルールが以下のようにキャメルケースになります。また複数形の「s」も排除されています。

/controllers/pages_controller.php ⇒ /Controller/PageController.php
/views/pages/display.ctp ⇒ /View/Pages/display.ctp

コンポーネントの継承が変わる

コンポーネントクラスはこれまで「Object」を継承していましたが、以下のように「Component」を継承するようになりました。

class TestComponent extends Component {

HTC Desireを使い始めてからもうすぐ2年ですが、使い勝手にも限界を感じるようになってきたので、乗り換えを検討しています。

当初、Androidスマートフォンのラインナップの中では、他社と比較しても「HTC Desire Softbank X06HTII」は間違いなく優秀だったと思います。
初代Android端末ということもあって、他の機種では
「Flashが再生されない」
「時期がきてもOSが1.6からアップデートできない」
「スペックが低く動きがカクカクして使い物にならない」
など、いろいろと不満を周りから聞かされましたが、HTC Desireは比較的そのような問題はありませんでした。

HTCは海外メーカー(台湾)であることから、おさいふケータイが利用できない、ワンセグが受信できないなどのデメリットも確かにありました。
しかし、日常からそれらを利用していない私のようなユーザーからみれば、何の問題にもなりませんでした。

以前にWindows環境下でフリーソフト「OpenVPN」を利用したルーティング方式のVPN環境の構築方法を解説しました。
OpenVPNを使ってVPN環境構築(ルーティング方式)
今回はその続編で、ブリッジ方式を解説します。

前回と同様にクライアントはWindows 7、サーバはWindows XPで、共にOpenVPN 2.2.2をインストール済みとします。
また、証明書と鍵の作成など各種設定も終え、ルーティング方式での接続が可能な状態とします。

サーバ設定

こちらでは、主にルーティング方式との設定項目の相違点をみていきます。

サーバの設定ファイル「OpenVPNconfigserver.ovpn」をテキストエディタで開きます。

Windows7でWebdavやVPNを用いてネットワークドライブを使用する場合、ファイル表示速度やファイル転送速度が異常に遅い場合があります。

いろいろと試していたのですが、解決策が見つかったのでここに残しておきます。

まずIEを起動して、「インターネットオプション」を開きます。
次にタブ「接続」を選択し、「ローカルエリアネットワーク(LAN)の設定」の「LANの設定」をクリックします。
そして下図のように、「自動構成」の「設定を自動的に検出する」のチェックを外します。

今回は技術的なお話ではなく、Webの将来について考えてみたことを書き留めてみたいと思います。

Web制作では日々のお仕事でデザイン、コーディングというフローを淡々とこなしているわけですが、これが10年、20年と続けられるものなのかという話しがよく出ます。
「Webの業界は進展がめまぐるしいので、これが永遠と続くとは考えづらい。」
「どんなに時代が発展したとしてもベースとしてこの作業フローは残る。」
など、いろいろと意見は飛び交いますが、たいてい漠然とした話題で終始します。

そこで今回、近い将来、デザインとコーディングという業務に最も影響を及ぼすであろうCSS3について、具体的に考えてみました。

前回まで、図やテキストを描いたりしていましたが、今回はもう少しだけ複雑な図を、機能を使って書いてみます。

線を描いてみる

関数Lineを使えば、自由にラインをひくことができます。

	var line= new Kinetic.Line({
		points: [10, 10, 50, 50, 140, 30, 220, 80], 
		x:10, 
		y:10, 
		stroke:"green"
	});

x軸、y軸をピクセル数でポイントを指定し、そのポイント間に線を引いてくれます。
つまり、この設定では(10, 10) (50, 50) (140, 30) (220, 80)の4点が線で結ばれ、一つのラインを描写しています。

今更ながら、VPN環境が整ったので、その手順をメモしておきます。

VPNには、接続先の端末と1対1でつながるルーティング方式と、接続先のLAN環境に参加するブリッジ方式があります。
今回はルーティング方式についてのお話です。

また、VPNはさまざまな環境で利用可能ですが、今回のOS環境はWindowsとします。接続元となるクライアント環境はWindows 7で、接続先のサーバ環境はWidows XPとします。
さらに、接続に利用するポート番号はデフォルトの1194と仮定します。

VPNソフトをインストールする

VPNソフトはいろいろありますが、有償のものが多いです。フリー版もありますが、ほとんどの場合が機能制限付です。
そんな中でも、コストパフォーマンスの高い「OpenVPN」を今回は利用します。
OpenVPN – Open Source VPN
こちらのサイトで迷子になることがあるのですが、クライアント、サーバいずれも、以下のページの「Installers and source packages」の「Windows Installer」からソフトをダウンロードします。
http://openvpn.net/index.php/download.html
ダウンロードした実行ファイルをクリックし、ナビゲーション通りに進めればインストールは完了します。
ちなみに、今回の例でのOpenVPNでのバージョンは「2.2.2」です。


インストール時に、ネットワークアダプタが追加されます。通常では「ローカル エリア接続2」などとして追加されますが、以後に扱いやすくするために名前を「Tap」などに変更しておきます。

Monthly Archives