HOKYPOKY.BLOG

iTunesの熱い機能

love iTunes

検索に「love」と入れて、虫眼鏡アイコンから「曲」にチェックいれればMYラブソングコンピの出来上がり!!

コレ聞いてると泣けます。

雑誌のような段組みができる jQuery plugin「MULTICOL.」

CDATA[HTML上で段組みを実現するjQuery Plugin、[MULTICOL. を公開しました。

去年くらいに作ったんだけど、jQueryのプラグイン化と安定性 / 速度を少し改良してGPLライセンスで公開します。

  • 商用OK
  • 再配布OK
  • 表記はすること
  • ソースは公開すること
  • といったオープンソースのライセンスらしいです。

    これを使えば、HTMLではできなかった雑誌のような美しい段組みが実現できるようになります。
    設置方法もなるべく簡単にしました。

    こういうのを公開するのは始めてなんだけど、できることなら広まってほしいなぁ。
    そんで使ってもらったり、改良されてもっと凄いものにしてほしい。

    ホントは広めるのも作った人の責任なんだけど、ちょっと認知度がないんでどうにかならんものかな。

    サンプル・詳細・ダウンロードはこちらから:MULTICOL.

    何もする気がしない

    がんばれがんばれできるできるぜーったいできるがんばれもっとやれるって!
    やれる気持の問題だがんばれがんばれそこだ!!
    そこだあきらめるな絶対にがんばれ積極的にポジティブにがんばれがんばれ北京だってがんばってるんだから!!!

    YouTube

    ——————– 8<

    諦めんなよ…
    諦めんなよ、お前!!
    どうしてそこでやめるんだ、そこで!!
    もう少し頑張ってみろよ!
    ダメダメダメダメダメ、諦めたら
    周りのこと思えよ、応援してる人たちのこと思ってみろって。
    あともうちょっとのところなんだから。
    俺だってこのマイナス10度のところ、しじみが取れるって頑張ってんだよ!
    絶対やってみろ!必ず目標を達成できる!
    だからこそNever Give Up!!

    YouTube

    ——————– 8<

    なんとなく生きてんじゃないんですか?
    迷ってんじゃないですか?
    イキイキしたい!簡単ですよ。
    過去のことを思っちゃダメだよ。
    何であんなことしたんだろ…って怒りに変わってくるから。
    未来のことも思っちゃダメ。大丈夫かな、あはぁ~ん。
    不安になってくるでしょ?
    ならば、一所懸命、一つの所に命を懸ける!
    そうだ!今ここを生きていけば、みんなイキイキするぞ!!

    YouTube

    ——————– 8<

    お米食べろっ!

    よし、テンション上がってきた!

    AlchemyをLeopardで試す

    今日はAdobeからいっぱい発表ありましたね。

    なんとなく理解したけどそれが今後どうなるかはちょっと理解できませんでした。

    まぁそれはともかくCのソースがFlashで動く!というAlchemyを早速試してみました。

    サンプルをコンパイルするまで。

    まずFlash Player 10とFlex SDK 3.2+が必要らしいです。
    というわけでとりあえずダウンロードしてインストールしましょう。
    しかもFlex SDKとかちょうどキチンとインストールしておきたかった。
    Flash Player 10は入っていたので割愛。

    Flex SDK 3.2

    インストーラーなどは特になく、適当な場所にファイルを解凍するだけ。

    ただ、デスクトップなどに置くとさすがによくないので、フォルダをflexとリネームしてユーザーディレクトリ直下に置くとかします。(デスクトップは極力ファイル置かない派)

    ボクはXcodeをいれているので、/Developer/SDKs/flex_sdk_3と配置して

    $ cd /Developer/SDKs
    $ sudo ln -s flex_sdk_3 flex

    と、ハードリンクを作って配置しました。
    flex/bin内にあるmxmlcというファイルがコンパイラなのですが、Terminalから呼ぶのは~/flex/bin/mxmlcとか/Developer/SDKs/flex/bin/mxmlcとかしないといけないのでパスを通して置きます。

    $ cd
    $ open -a pico .bash_profile

    でファイルに以下を追加

    export PATH=~/flex/bin:$PATH

    または

    export PATH=~/Developer/flex/bin:$PATH

    としておけばTerminalからどこからでもmxmlcとすればコンパイルできるようになります。

    さて、ここからAlchemyです。
    以下よりダウンロードしてきます。

    Alchemy Toolkit Package

    そのまま解凍して適当な場所に置きます。

    $ cd /Path/to/SomePlace/alchemy-darwin-v0.4a	//展開したフォルダ

    コンパイルの準備をします。

    $ ./config
    $ source alchemy-setup
    //一時的に、alchemyのパスを通す
    $ source alchemy-setup
    $ alc-on

    それと、すこし話が反れますが、本記事は「やったことメモ」みたいな感じなので、
    とりあえず他にもいろいろコンパイルしたけどものせるのは一番シンプルなやつにします。

    HelloFlash

    $ cd samples/HelloFlash
    $ gcc HelloFlash.c

    するとa.exeができるので実行してみると、

    $ ./a.exe
    /Developer/SDKs/flex/bin/adl _sb_1650/app.xml 2> /tmp/adl.trace & echo $!
    Hello Flash! // <-- 動いた!

    よし、おしまい。

    ほんとは貶したい

    今日の昼、「嘘がついたことがあるよ。」という言葉は真実でしかないと話しながら、
    さらにこんなことを考えてた。

    —————————————- 8<

    ほんとはみんなを貶したい。

    自分が一番でいたい。

    そして、自分は嘘がつけない。
    全くつかないわけではないけど嘘をつくとそれを嫌だと思う。

    だからすばらしいものを見たとき、
    本当は貶したいけど、貶せない自分がいる。

    そんな自分との付き合い方が分かってきたのか、
    最近ではそれを自分のやる気に持っていくことができるようになってた。

    だからそれに気がついて、それを嫌だと思った。

    —————————————- 8<

    「ハッピーターンが食べたい」ってね。

    new function() {} と (function(){})() の違い

    まずいきなりですが、JavaScript、全てが関数であり、クラスです。

    var str = "hello";

    は以下のように書き換えられます。

    var str = new String("hello");

    そして全ての関数はクラスとなります。
    クロージャを使った形だと

    var myClass = function () {
        this.hello = function () {
            alert("hello");
        }
    }
    var instance = new myClass ();
    instance.hello(); //hello

    prototypeを使った形だと

    var myClass = function () {}
    myClass.protorype.hello = function () {
        alert("hello");
    }
    var instance = new myClass();
    instance.hello(); //hello

    とすることもできます。
    このあたりもクロージャとprototypeの違いがあるらしいんですが本題ではないので割愛。
    ってかよくわかってない。

    もうちょっと寄り道します。

    JavaScriptではnewするとインスタンスになります。
    つまりJavaScriptは全て関数で、newというのは、インスタンスを作るということ。
    classというものはなく、逆にいうと全部クラスなので特にclassと定義することはありません。
    “”,(),{}はnew String(),new Array(),new Object()の略。
    さらにnewしたものはインスタンスなのでさらにnewすることはできません。
    だから

    var str = "hello";
    var instance = new str();

    とはできません。
    またnewすると中身が実行されます。
    これがコンストラクタとなります。

    一方でjavascriptの関数の実行方法は二通りあります。

    foo();
    (foo)();

    二通りある理由がよくわかりませんがとりあえず二通りあります。
    寄り道の寄り道をすると()はArrayということだったので以下のような関数を実行してみたんですが、

    function func1 () {
        alert("function 1");
    }
    function func2 () {
        alert("function 2");
    }
    (func1,func2)();

    結果は「function 2」となりました。このあたりが謎。

    話を少し戻します。
    関数では名前をつけることができます。
    また、変数に関数を詰め込むことができます。

    関数に名前をつけたパターン。

    function myFunc () {
        alert("myFunc");
    }

    変数に関数を詰め込んだパターン

    var myFunc = function () {
        alert("myFunc");
    }

    この二つの違いは結構簡単で、関数に名前をつけたパターンは、スクリプト実行の最初に定義されます。
    つまり以下はエラーになりません。

    myFunc();
    function myFunc () {
        alert("myFunc");
    }

    逆に変数に関数を詰め込んだパターンだと以下はエラーになります。
    一応先にvarで定義してもエラーになります。

    var myFunc;
    myFunc();
    myFunc = function () {
        alert("myFunc");
    }

    こうするとうまくいきます。

    var myFunc;
    myFunc = function () {
        alert("myFunc");
    }
    myFunc();

    じゃあこの変数に詰め込んだ関数とはなんでしょう。
    言葉を使い簡単に説明すると無名関数といいます。

    名前をもって生まれたものと、生まれたあとで名前をつけられたものの違いですね。
    もちろん、無名関数でないものも変数につめることはできます。

    var myFunc2 = myFunc;
    function myFunc () {
        alert("myFunc");
    }

    以上をふまえて new function() {} と (function(){})() の違いを説明します。
    やっと本題なんですが、この記事だけみると逆に上の二つは明らかに違うのが分かると思うんですが、実は挙動としてはほぼ一緒なんです。
    簡単に言うと、「即実行される関数」という感じです。

    キーワードになるのが無名関数。

    function () {}

    これを単純に無名関数じゃなくすると

    function someFunction () {}

    という風になります。
    someFunctionという名前にしました。

    それをそれぞれnewや()()で呼び出してみると

    new function () {}

    つまりこれは

    new someFunction();

    となり

    (function () {})();

    こっちは

    (someFunction)();

    となります。

    newはインスタンスとして実行するということ。
    ()()は関数呼び出しでした。

    newの場合は無名関数クラスをnewしていて、そのコンストラクタが実行されています。
    だから即実行されていました。
    ()()の場合は、もともと関数を実行するという意味。

    つまりクラスとして使う場合はnew。
    関数を即実行する場合は()()を使うということになります。

    この二つが実際にどう影響をあたえるかというと、newはインスタンスになるのでthisのフォーカスがインスタンスになります。
    対して()()の場合はインスタンスでもなんでもないので、親のthisを継承します。

    個人的にはnew function(){}派なのですが、どうやら(function(){})()派も多いみたいです。
    でも、ここらへんが分かってればどっちでも大丈夫そうです。

    長いメモになってしまった。
    去年もこのあたりについて調べたんですがようやく理解できました。  
    プログラムって大変。パソコン偉い。

    時間がない

    最近Twitterを見ているとみんなほんとに時間がなさそう。
    それだけが今のボクのモチベーション。

    「やりたい」と「やってる」はちげーんだよ。

    そんな愚痴っぽくなった2008年ももう終わりを迎えようとしてますね。

    ボクは9月に今の会社に入ったので、4年目。
    3年があっという間にたちました。

    最初の年は、鬼ディレクターに鍛えてもらった。
    その話をすると、いつもは「いや、もうあの人のことはいいですよ」とか話を反らしてたりするんだけど、ほんとは感謝している。
    当人はボクのことほんとに嫌いとかそんなん超越して無関心だったと思いますが。
    実はボクを一番変えてくれた人です。
    そんなカミングアウト。

    2年目は会社にも慣れてきて、なんとなくJavaScriptとか覚えてきて独学でいろいろ蒔いた種が一つ芽がでた雰囲気。
    田口さんが、ちょうど制作のリーダーになってくれたのが大きかったかな。
    ボクも晴れて社員になって、自分の後輩ができて、会社に貢献できるようになってきた感じ。

    3年目はちょっと迷った。
    ちょうど勢いで飛び出した中でその初速がなくなった感じ。
    でもHTML/CSS/JavaScriptは結構できるようになってきたし、サーバーサイドやFlashなんかの理解も少し芽がでてきた。
    あと「WEB」が分かってきた。なにがインターネットの強みなのかとかそういうのが大分理解できたと思っている。
    「やること」と「やりたいこと」をうまく会社に言えたのが大きな進歩。
    そしてそれを認めてくれた会社に感謝。

    そんで4年目。
    正直この1年は勝負だと思っている。
    というのも今までは無闇矢鱈にいろんなことに手をだしてきたんだけど、それらの芽をどうやって太い木にするか、そして森にするかという感じだなー。
    正直不安だらけで毎日めっちゃ眠いけど、それでもなんとか頑張ってます。
    30才くらいの人たちと比べて非難されるケースが増えてきたのもなんかうれしい。

    さて、今日の動画は懐かしのアヴリルラヴィーンというわけなんですが、この曲の最後のサビが冬に聴くとめっちゃテンションあがります。
    iPodを頭から聴いてると「A」vrilなんで、結構よくかかります。

    テンション上がる一言張っときます。

    Wednesday, Thursday

    水曜日は9時に会社が閉店。

    時間を持て余したので餃子食べて、そのままのノリでPS3を購入。

    ソフトはLittle Big Planetを買ったんだけどがまたおもしれーんだ。
    キャラクターかわいいしね。

    そしてPS3は思ってたよりすごいね。
    さすが最新ハードなだけあると思った。

    木曜日はLittle Big Planetをやろうと思うでしょ?
    でも帰り際に、次の日は会社の同僚が誕生日だというもんだから、とりあえずAirアプリ作ってみた。
    最近は、会社の同じチームの人が誕生日で気が向いたら、何か作ってプレゼントしている。

    作ったのは写真ブログをそのまま写真立てにするアプリ。
    簡単にいえばRSSを解析して表示するだけのアプリ。

    で、はじめてAirアプリをつくってみたんだけど、HTML, CSS, JavaScriptだけでも結構おもしろいものつくれるんだと実感。

    しかも、基本的にIEのこと考えなくてもいいのですごくラクチン。
    とりあえずPNGがデフォルトできれいに使えるからUI的にもすごく助かるね。

    そんなこんなの水木で、ほんとはブログ書くような話だったんだけど時間もたってしまったし簡単に書いておしまい。

    動画はLittle Big Planetより。ミュージックプレイヤーを作った人のステージ。
    Little Big PlanetとAirについてはもっかいちゃんと書けたらいいな。
    せめてAirはまとめたい。

    Ruby on Rails の環境構築メモ

    • OS: Mac OS X Leopard (10.5)
    • MacBook (intel)
    • Terminalはデフォルト

    Xcode3.0をインストール

    Macを買うと付いてくるディスクよりXcode3.0をインストールする。
    これをいれることでMacにDevelop機能がいろいろと追加されて便利。
    多少ディスクスペースはつかうものの、入れていて損はない。

    CDなくした場合はAppleのサイトよりDLできたはず。

    Terminal.appをつかってRails環境をインストール

    Terminalをつかっていろいろインストールします。
    MacPortとRubyGemという二つのインストーラを使います。
    これらは登録された名前のものを呼び出すとそれをインストールしてくれるエージェントみたいなものです。
    二つ使うのは野菜は八百屋、魚は魚屋みたいな感じ。MacPortはスーパー。RubyGemはRuby専門店ってとこでしょうか。

    なのでMacPortはMacに関するもの。RubyGemはrubyに関するものと考えていいでしょう。
    まずはMacPortをインストールしなくてはいけません (もう頭がめちゃくちゃw)

    1. http://www.macports.org/よりmacportをDL&インストール
    2. ~/.bash_profile(ない場合は作成)に以下を追加し、portコマンドにパスを通す
      export PATH=~/bin:/opt/local/bin:/opt/local/sbin/:$PATH

      ~/.bash_profileを開くにはTerminalにて

      $ cd ~/
      $ open .bash_profile

      ファイルがなかったら

      $ pico .bash_profile

      コピペして”Ctrl+O(オー)”、そのままEnterで保存。”Ctrl+X”で終了。

    3. ターミナルにて以下を入力し、MacPortを最新情報にアップデート
      $ sudo port selfupdate

       

    4. MacPortを使ってrubygemをインストール (時間かかる)
      $ sudo port install rb-rubygems
    5. RubyGemを使ってrailsをインストール
      $ sudo gem install rails
    6. RubyGemを使ってsqlite3をインストール
      $ sudo gem install sqlite3-ruby
    7. MacPortを使ってImageMagickをインストール (時間かかる、30分くらいかかるかも)
      $ sudo port install ImageMagick
    8. RubyGemを使ってRMagickをインストール
      $ sudo gem install rmagick

    サーバー編

    ApacheのモジュールとしてRailsを構築
    Phusion Passenger(http://www.modrails.com/)を使います。

    以下http://www.modrails.com/install.htmlより抜粋

     

    1. RubyGemよりpassengerをインストール
      $ sudo gem install passenger
      $ sudo passenger-install-apache2-module
    2. passenger-install-apache2-moduleを実行するといろいろきかれます。
      Press Enter to continue, or Ctrl-C to abort.
      > Enter 
      (省略)
      
      Press Enter to continue. 
      [Enterを押す前に]
      1. 上の太字をコピー(LoadModule〜という白い3行のやつ)
      2. Finderにて"Shift+Cmd+G"して/etc/apache2と入力httpd.confを開く
      3. LoadModuleといっぱい書かれている下に(1)をペースト。
      4. Terminalに戻る
      > Enter 

      最後までいったら”Ctrl+D”でターミナル終了 

    3.  VirtualHostを設定します。さっきのhttpd.confに下記を設定 [あくまで設置例です] 
      NameVirtualHost *:80ServerName localhost
      DocumentRoot /Users/ユーザー名/Sites/public_html
      
      ServerName アプリ名(半角英数)
      DocumentRoot /Users/ユーザー名/Sites/アプリ名/public

      Terminalにて

      $ cd /etc
      $ sudo pico hosts

      127.0.0.1 localhostの行の後ろに”(半角スペース)アプリ名”を入れます。そのまま保存

      これはlocalhostとURLバーに入れた場合は普通にpubli_html内サーバールートとして動きます。
      そしてアプリ名をURLバーに入れるとrailsフォルダ内がrailsアプリとして動きます。

      127.0.0.1というIPが「自分」という暗黙のルールになっていて、
      /etc/hostsというファイルにてlocalhostはこのIPに予約されていて、「アプリ名」もこのIPに予約。
      (ちなみにここにgoogle.comといれるとgoogleではなく自分のpublic_htmlが表示される。)

    4. apacheを再起動/起動
      $ sudo apachectl -t> Syntax OKと表示されたら
      $ sudo apachectl restart

    railsでhello world

    VirtualHostにてSites/アプリ名/publicとしたので、今回はhelloWorldというアプリを作成しましょう。
    httpd.confに以下を追加。

    ServerName helloWorld
    DocumentRoot /Users/ユーザー名/Sites/helloWorld/public

    では最速で作っていきます。

    Terminalにて

    $ cd ~/Sites	//サイトフォルダに移動
    $ rails helloWorld	//helloWorldアプリ作成
    $ cd helloWorld	//helloWorldに移動
    $ ruby script/generate contoller HelloWorld	//HelloWorldコントローラー作成

    Finderにてサイトフォルダ内にhelloWorldができていると思います。
    また、helloWorld内にapp/controllers/hello_world_controller.rbができているのでこれを編集します。

    class HelloWorldController < ApplicationController
    def index
    @message = "Hello World"
    end
    end

    以上に内容を差し替える。
    これはHelloWorldの挙動を指定するところで、
    def indexは単純にhello_worldでアクセスされたときに表示する挙動
    @message = “Hello World”はView(後述)でmessageを呼ぶとHello Worldとして表示されます。

    次にViewを作成します。
    アプリ/app/viewsにhello_worldフォルダ内にindex.rhtmlを作成します。

    とだけ入力して保存。

    見てみましょう。

    Terminalにて

    $ cd /etc
    $ sudo pico hosts
    127.0.0.1 localhost helloWorldと編集
    $ sudo apachectl restart

    http://helloWorld/hello_worldにアクセスする。

    これでrailsが動いているところまで確認できました。

    猫になりたい

    今日は11月11日。

    ポッキーの日。

    時計を見たら11時13分。

    それと楽しみにしていたラジオが聴けなかった。

    あと革ジャン着た。

    さすがに冬になってきた。

    携帯ストラップ買った。

    iPhoneなのに。

    どこにつけんねん。

    かわいかったんだよね。

    いっぱい話したけど本音は控えめだった。

    そんな嘘つきな自分。

    道を聞かれてわからなかった。

    すこしずつタイミングがずれた一日。

    っていうか

    猫になりたい。

    みたいな。