Archive@2007/09

all 19 results.
first
prev
1
2
next
last

「AIRで付箋紙アプリケーションを作ろう！」をやったよ。

[Think IT] 第1回：付箋紙アプリケーションを作ろう！をやってみたよ。バックエンドは Django とか Pylons でやった訳ですが。

「これ、このままじゃ動かないんじゃ？」なところを調べながら作ってみて、一応一通り動くところまで作った（つもり）。恥をさらす為にも、書いたソース（抜粋）載せておこう。

以下、 menu.mxml 。

<mx:Script>
<![CDATA[

public var stickies:Array = new Array();


public function create():void
{
    var sticky:Sticky = new Sticky();
    sticky.show();
    stickies.push(sticky);

}//END: create.


public function load():void
{
    // re initialize stickies.
    for (var i:int = 0; i < stickies.length; i++)
    {
        stickies[i].window.close();
        delete stickies[i];
    }

    var request:URLRequest = new URLRequest("http://localhost:5000/stickies.xml");
    request.method = 'GET';
    var loader:URLLoader = new URLLoader();
    loader.addEventListener(Event.COMPLETE, function (evt:Event):void
    {
        var items:XMLList = (new XML(evt.target.data)).items.child('item');
        if (items.length() > 0)
        {
            for each (var item:XML in items)
            {
                var sticky:Sticky = new Sticky();
                sticky.id = item.id;
                sticky.editor.text = item.body;
                sticky.window.x = item.x * Capabilities.screenResolutionX;
                sticky.window.y = item.y * Capabilities.screenResolutionY;
                sticky.window.width = item.width;
                sticky.window.height = item.height;
                sticky.show();
                stickies.push(sticky);
            }
        }
    });
    loader.load(request);

}//END: load.


public function save():void
{
    for each (var sticky:Sticky in stickies)
    {
        var request:URLRequest;
        if (sticky.id > 0)
        {
            request = new URLRequest('http://localhost:5000/stickies/'+sticky.id);
            if (sticky.editor.text.length > 0)
            {
                request.method = 'PUT';
            }
            else
            {
                request.method = 'DELETE';
            }
        }
        else
        {
            if (sticky.editor.text.length > 0)
            {
                request = new URLRequest('http://localhost:5000/stickies');
                request.method = 'POST';
            }
            else
            {
                continue;
            }
        }
        var variables:URLVariables = new URLVariables();
        variables.x = sticky.window.x / Capabilities.screenResolutionX;
        variables.y = sticky.window.y / Capabilities.screenResolutionY;
        variables.width = sticky.window.width;
        variables.height = sticky.window.height;
        variables.body = sticky.editor.text;
        request.data = variables;

        var loader:URLLoader = new URLLoader();
        loader.load(request);

    }

}//END: save.
]]>
</mx:Script>

本編は [Think IT] 第1回：付箋紙アプリケーションを作ろう！でお楽しみください。

まだまだ日本語が化けまくりですが、 Adobe AIR は面白い！

ps. Pygments のActionScriptハイライトは0.9からなのかぁ。残念。

Posted at:: 2007/09/30 20:58:52; 2 Comments; 0 TrackBacks

Tags:: ActionScript; AIR; Flash

Trackback:: http://humming.via-kitchen.com/2007/09/30/tried-make-stickies-on-adobe-air/trackback/

TextMateでvimキーバインド

ViMate っていう TextMate で vim のキーバインドを使えるようにするプラグイン。

結構前に入れたものの、使い勝手がイマイチで使ってなかった。

改めて使ってみると結構いい感じ。一通り良く使うものは実装されてるっぽいよ。でも、やっぱり \C-[ はダメみたい。 escape は遠いんだよなぁ。

実際使うにはまだもうちょっと。入れといても邪魔にはならないから良いけどね。

Posted at:: 2007/09/30 04:51:51; 0 Comments; 0 TrackBacks

Tags:: plugin; TextMate; vim

Trackback:: http://humming.via-kitchen.com/2007/09/30/vim-keybind-on-textmate/trackback/

Adobe AIRを触ってみたよ。

Adobe AIR を触ってみたよ。インストーラを作るところまで調べたので、忘れないように自分用メモ。

何はともあれ Adobe Labs - Homepage からAIRのインストーラを落として来てインストール。

次に、開発に必要な Flex 3 SDK を Adobe Labs - Flex 3 Software Development Kit から落としてしてくる。展開すると必要なものが一式入っているものの、インストーラは入ってないらしい。ので、展開したものをそのまま使う。

今回は /usr/local の下に移動して、 PATH を通した。

$ unzip flex3sdk_b1_061107.zip
$ mv flex3sdk_b1_061107 /usr/local/flex3sdk
$ PATH="/usr/local/flex3sdk/bin:${PATH}"

whichとかしてみて、 PATH が通っているか確認。

$ which adl
/usr/local/flex3sdk/bin/adl

好きなディレクトリに移動して、テスト用のファイルを作って行く。とりあえずhello worldを表示するだけのものを作る事に。

まずはHelloWorld-app.xmlを作る。

<?xml version="1.0" encoding="UTF-8"?>
<application
    xmlns="http://ns.adobe.com/air/application/1.0.M4"
    appId="com.gmail.mode.0renge.HelloWorld"
    version="1.0"
>
    <name>HelloWorld</name>
    <description>Show only Hello World!.</description>
    <rootContent
        systemChrome="standard"
    >HelloWorld.swf</rootContent>
</application>

次にHelloWorld.as。

package
{
    import flash.display.*;
    import flash.text.*;

    public class HelloWorld extends Sprite
    {
        public function HelloWorld()
        {
            var txt:TextField = new TextField();
            txt.autoSize = TextFieldAutoSize.LEFT;
            txt.text = "Hello World!";
            addChild(txt);
        }
    }
}

HelloWorld.asを amxmlc を使ってコンパイル。

$ amxmlc HelloWorld.as
Loading configuration file /usr/local/flex3sdk/frameworks/air-config.xml
This beta will expire on Wed Oct 31 00:00:00 JST 2007.
/path/to/current/HelloWorld.swf (649 bytes)

adl を使ってプレビューしてみる。

$ adl HelloWorld-app.xml

ちゃんと表示されれば一通り上手くいってる。（と思う。）ので、インストーラを adt を使って作成する。

$ adt -package HelloWorld.air HelloWorld-app.xml HelloWorld.swf

出来上がったHelloWorld.airでインストールしてみて、ちゃんと表示されれば上手くいってるハズ。コンパイルする時にエラーがあれば教えてくれるので、特に迷うところは無いと思う。

FlashとかActionScriptとか、もっと覚えないとなぁ。

Posted at:: 2007/09/29 17:25:28; 0 Comments; 0 TrackBacks

Tags:: ActionScript; AIR; Flash

Trackback:: http://humming.via-kitchen.com/2007/09/29/adobe-air-memo/trackback/

stripe野良プラグインを修正

946 な方から色々指摘を受けて修正しました。

CSSの指定からクラス名の指定にした。
tableの場合の修正。

/**
 *  stripe.js
 */
jQuery.fn.extend({

    stripe : function (o)
    {
        o = o || {};
        var even = o.even || 'even';
        var odd = o.odd || 'odd';

        return this.each(function ()
        {
            switch (this.nodeName.toLowerCase())
            {
                case 'ul':
                case 'ol':
                    jQuery(this).children('li:even')
                    .addClass(even)
                    .end().children('li:odd')
                    .addclass(odd);
                    break;

                case 'table':
                    jQuery(this).children('tbody')
                    .children('tr:even')
                    .addClass(even)
                    .end().children('tr:odd')
                    .addClass(odd);
                    break;

                default:
                    break;

            }//END: switch.

        });//END: each.

    }//END: stripe.

});//END: jQuery.fn.extend.

しょせんは野良な訳ですがｗ

って思ってたら 946 な人のこんなエントリーが。なんだ、プラグインじゃなくて良かったのか。

Posted at:: 2007/09/25 20:29:54; 2 Comments; 0 TrackBacks

Tags:: JavaScript; jQuery; plugin

Trackback:: http://humming.via-kitchen.com/2007/09/25/modified-jquery-stripe-nora-plugin/trackback/

jQueryで複数のボタンから1つのスクリプトへPOSTする

WEBプログラマー＋WEBデザイナーなZARU日記さんのコチラのエントリーより。

「 jQuery を使ってAjaxで複数のボタンから１つのスクリプトへPOSTする。」ってのを、自分なりにちょっとやってみたよ。(X)HTMLの構成に左右されますが、こんな感じでいかがでしょう？

まずはHTMLはこんな感じのを用意。ちょっとやりやすく変えてます。

<div>
    <input type="text" name="textarea1" id="textarrea1" />
    <input type="hidden" name="id1" id="id1" />
    <input type="button" value="post" />
</div>
<div>
    <input type="text" name="textarea2" id="textarrea2" />
    <input type="hidden" name="id2" id="id2" />
    <input type="button" value="post" />
</div>
<div>
    <input type="text" name="textarea3" id="textarrea3" />
    <input type="hidden" name="id3" id="id3" />
    <input type="button" value="post" />
</div>

で、 jQuery ではこんな感じ。

<script type="text/javascript">
//<![CDATA[
$(function ()
{
    // divの中にあるtype="button"なinputにイベントを設定。
    $('div input:button').click(function ()
    {
        // ボタンの親要素(div)をjQueryでラップ。
        var $$ = $(this).parent('div');

        // 必要な値を持ってくる。
        var options = {
            'textdata'  : $$.children('input:text').val(),
            'id'        : $$.children('input:hidden').val()
        }

        // スクリプトへPOST。
        $.post('post.php', options, function (data)
        {
            // 後処理とかする。
        });
    });

});
//]]>
</script>

とりあえずコレで動く（ハズ）。けど、なんか汚いし手数が多い気がする。 divで括った意味もそんなに無くなってるしなぁ。

なので、divをformに変更してみる。

<form action="post.php" method="post">
    <input type="text" name="textarea1" id="textarrea1" />
    <input type="hidden" name="id1" id="id1" />
    <input type="submit" value="post" />
</form>
<form action="post.php" method="post">
    <input type="text" name="textarea2" id="textarrea2" />
    <input type="hidden" name="id2" id="id2" />
    <input type="submit" value="post" />
</form>
<form action="post.php" method="post">
    <input type="text" name="textarea3" id="textarrea3" />
    <input type="hidden" name="id3" id="id3" />
    <input type="submit" value="post" />
</form>

これだと jQuery ではこんな感じ。

<script type="text/javascript">
//<![CDATA[
$(function ()
{
    $('form').submit(function ()
    {
        // サブミットされたformを軸にする。
        $.post(this.action,
        $('input:text, input:hidden', this).serialize(),
        function (data)
        {
            // 後処理。
        });

        // 実際のsubmit処理をキャンセル。
        return false;
    });
});
//]]>
</script>

かなりすっきりした気がする。実際は他との衝突を避ける為に、もうちょっと手を加えなくちゃダメだろうけど。

WEBプログラマー＋WEBデザイナーなZARU日記さんの趣旨とかけ離れてしまっていたらすいません。

Posted at:: 2007/09/24 16:43:54; 2 Comments; 0 TrackBacks

Tags:: JavaScript; jQuery

Trackback:: http://humming.via-kitchen.com/2007/09/24/post-from-plural-to-one-script-on-jquery/trackback/

jQueryでstripeな野良プラグイン

気の向くままにまた jQuery の野良プラグイン。

今度はリストとかテーブルをシマ模様にしてみたよ。 $.stripeSettings に全体共通の設定を仕込んでおいて、 $(...).stripe の引数で上書きする。どっちも省略出来るけど、どっちかやらないと何も変わらない。

内容はこんな感じ。

/**
 *  stripe.js
 */
if (jQuery.stripeSettings === window.undefined)
    jQuery.stripeSettings = {};

jQuery.stripeSettings.even  = {};
jQuery.stripeSettings.odd   = {};

jQuery.fn.extend({

    stripe : function (o)
    {
        o = o || {};
        // Override default settings.
        var even = jQuery.extend({}, jQuery.stripeSettings.even, o.even || {});
        var odd = jQuery.extend({}, jQuery.stripeSettings.odd, o.odd || {});

        return this.each(function ()
        {
            switch (this.nodeName.toLowerCase())
            {
                case 'ul':
                case 'ol':
                    jQuery(this).children('li:even')
                    .css(even)
                    .end().children('li:odd')
                    .css(odd);
                    break;

                case 'table':
                    $self = jQuery(this);
                    if ($self.children('tbody').size() > 0)
                    {
                        $self = $self.children('tbody');
                    }

                    $self.children('tr:even')
                    .css(even)
                    .end().children('tr:odd')
                    .css(odd);
                    break;

                default:
                    break;

            }//END: switch.

        });//END: each.

    }//END: stripe.

});//END: jQuery.fn.extend.

実際使うときはこんな感じ。

<script type="text/javascript" charset="utf-8">
//<![CDATA[
$(function ()
{
    // 全体の設定。
    $.stripeSettings = {
        even    : {
            'background-color'  : '#ffa0a0'
        },
        odd     : {
            'background-color'  : '#a0a0ff'
        }
    };

    // id="hige"の中のtableにstripeを付ける。
    $('#hige table').stripe();

    // 個別にオーバーライドする場合。
    var settings = {
        even    : {
            'background-color'  : '#ffa0a0'
        }
    };

    // class="stripe"なul, ol, tableにstripeを付ける。
    $('.stripe').stripe(settings);
});
//]]>
</script>

引数は色だけに固定してないので、 jQuery から渡せるCSSは一通り渡せる（ハズ）。

やっつけな部分が見え隠れしてたりするものの、まぁそのへんはご愛嬌。 946 な方、またもサンプルが用意出来てなくてすいません。

Posted at:: 2007/09/24 03:44:19; 0 Comments; 0 TrackBacks

Tags:: JavaScript; jQuery; plugin

Trackback:: http://humming.via-kitchen.com/2007/09/24/jquery-stripe-nora-plugin/trackback/

jQueryでpopupな野良プラグイン

jQuery でpopupなプラグインを作ってみたよ。

たしか既に公開されてるのがあったような気がするけど、引数の種類とか思い出す為にも自作してみた。

jQuery.extend({//START: jQuery.extend.

    /**
     *  flattenAttrs.
     */
    flattenAttrs : function (o, s)
    {
        var retval = []
        $.each(o||{}, function (k, v)
        {
            retval.push(k+'='+v);
        });
        return retval.join(s||',');

    }//END: flattenAttrs.

});//END: jQuery.extend.

jQuery.fn.extend({//START: jQuery.fn.extend.

    /**
     *  popup.
     */
    popup : function (name, options)
    {
        var settings = {
            'titlebar'      : 'no',
            'resizable'     : 'yes',
            'scrollbars'    : 'yes',
            'left'          : screen.width,
            'top'           : screen.height,
            'width'         : screen.availWidth,
            'height'        : screen.availHeight
        }
        options = jQuery.extend({}, settings, options||{});
        name = name || 'piggy';

        return this.filter('a[href]')
        .click(function (evt)
        {
            window
            .open(this.href, name, jQuery.flattenAttrs(options))
            .focus();

            return false;
        })
        .end();

    }//END: popup.

});//END: jQuery.fn.extend.

これを読み込ませておいて、使うときはこんな感じ。

<script type="text/javascript">
//<![CDATA[
    $(function (){

        $('a.popup').popup();

    });
//]]>
</script>

見事に車輪です。

Posted at:: 2007/09/23 05:23:52; 0 Comments; 0 TrackBacks

Tags:: JavaScript; jQuery; plugin

Trackback:: http://humming.via-kitchen.com/2007/09/23/jquery-popup-nora-plugin/trackback/

Djangoのコンテクストプロセッサーを使ってみたよ。

Django のコンテクストプロセッサーを使ってみたよ。

サイト名とかドメインとか決まりきったものを、ビューから渡したりテンプレートタグにしたりするのもどうかなぁ？と思ってた。

スパムとかさんの djblogkit をのぞいてみると、 TEMPLATE_CONTEXT_PROCESSORS に自作のコンテクストプロセッサーを追加して、テンプレートに変数を渡してる。ので、コレを参考にして（ほぼパクって）やってみる。

# vim: fileencoding=utf-8 :

from django.conf import settings
from django.contrib.sites.models import Site, RequestSite

def site(request):
    """
    サイト名とドメインをテンプレートに落とす。
    """
    # django.contrib.sitesがインストールされてるかチェック。
    if Site._meta.installed:
        current_site = Site.objects.get_current()
    else:
        current_site = RequestSite(request)

    # サイト名の取得。
    if hasattr(settings, 'SITE_NAME'):
        SITE_NAME = settings.SITE_NAME
    elif hasattr(current_site, 'name'):
        SITE_NAME = current_site.name
    else:
        SITE_NAME = u''

    # ドメインの取得。
    if hasattr(settings, 'SITE_DOMAIN'):
        SITE_DOMAIN = settings.SITE_DOMAIN
    elif hasattr(current_site, 'domain'):
        SITE_DOMAIN = current_site.domain
    else:
        SITE_DOMAIN = u''

    return {
        'SITE_NAME'     : SITE_NAME,
        'SITE_DOMAIN'   : SITE_DOMAIN,
    }


def path_info(request):
    """
    PATH_INFOをテンプレートに落とす。
    """
    # request_pathにすべき？
    return {
        'PATH_INFO' : request.path,
    }

コレを context_processors.py とかにして適当な場所に保存。今回はとりあえず試しなのでプロジェクトディレクトリ直下に保存してみた。で、組み込む為に settings.py に設定を追記する。

TEMPLATE_CONTEXT_PROCESSORS の項目自体は、デフォルトだと settings.py には無い。ので、 django.conf.global_settings.py からコピペして持ってくる。

TEMPLATE_CONTEXT_PROCESSORS = (
    'django.core.context_processors.auth',
    'django.core.context_processors.debug',
    'django.core.context_processors.i18n',
    'django.core.context_processors.media',
    'myproject.context_processors.site',        # <--- コレを追記
    'myproject.context_processors.path_info',   # <--- コレを追記
#    'django.core.context_processors.request',
)

これでテンプレートに変数として落ちて来てる（ハズ）。毎回レスポンスにセットする様な変数なんかは、コンテクストプロセッサー使った方が全然楽ちん。だという事を今更知ったよ。

Posted at:: 2007/09/23 04:52:25; 0 Comments; 0 TrackBacks

Tags:: Django; templates

Trackback:: http://humming.via-kitchen.com/2007/09/23/use-context-processor-on-django/trackback/

vimもろもろ

vim の設定で久々にぐっとくるのを、 sh1.2 pyblosxom さんのコチラのエントリーにて発見。特にファイル名補完の設定は、個人的にかなり嬉しい。

set wildmode=list:longest

って書いておくと、 :e でファイル移動する際の補完機能がいい感じ。

好みはあるものの、個人的にはこっちの方が好き。ちゃんと下に候補を出してくれるのとか素敵過ぎます。

普段は vi Complete Key Binding List とか Vimの全オプションを参考にさせてもらってるのですが、ヒマな時にもうちょっと眺めてみて、良い設定とか探してみよう。

Posted at:: 2007/09/21 23:33:28; 2 Comments; 0 TrackBacks

Tags:: vim

Trackback:: http://humming.via-kitchen.com/2007/09/21/something-of-vim/trackback/

MacPortsのvimでトラブったメモ

MacPorts がおかしくなっていたらしく、再インストールしてみたら vim が入らなくなっちゃったよ。どうやら p7zip が上手くインストール出来ないらしい。

具体的にはこんな感じのエラーが出る。

$ sudo port install vim +cscope +huge +kaoriya +python +ruby +cocoa
--->  Fetching p7zip
--->  Attempting to fetch patch-install.sh from http://svn.macports.org/repository/macports/distfiles/p7zip
--->  Attempting to fetch patch-install.sh from http://svn.macports.org/repository/macports/distfiles/general/
--->  Attempting to fetch patch-install.sh from http://svn.macports.org/repository/macports/downloads/p7zip
Error: Target org.macports.fetch returned: fetch failed
Error: The following dependencies failed to build: p7zip
Error: Status 1 encountered during processing.

色々調べてみると、MacOSX用にコンパイルされた p7zip を /opt/local/bin にコピペすると上手く行くらしい。 krmathis' homepage からダウンロード出来るけど、今回は運良く再インストール前のツリーを消さずにおいてあったのでそれをコピペして試してみる。

$ sudo cp /opt/old_local/bin/7za /opt/local/bin/7za
$ sudo cp -R /opt/old_local/lib/p7zip /opt/local/lib/

これでもう一度 vim をインストールしてみる。

$ sudo port install vim +cscope +huge +kaoriya +python +ruby +cocoa
--->  Fetching vim
--->  Attempting to fetch 7.1.001 from ftp://ftp.vim.org/pub/vim/patches/7.1
--->  Attempting to fetch 7.1.002 from ftp://ftp.vim.org/pub/vim/patches/7.1
...
--->  Verifying checksum(s) for vim
--->  Extracting vim
--->  Applying patches to vim
--->  Configuring vim
--->  Building vim with target all
--->  Staging vim into destroot
--->  Installing vim 7.1.100_0+cocoa+cscope+huge+kaoriya+python+ruby
--->  Activating vim 7.1.100_0+cocoa+cscope+huge+kaoriya+python+ruby
--->  Cleaning vim

今度は上手く行ったっぽいよ。念のため一通りテストしてみたけど、ちゃんと動いてるしね。このエントリーも gvim で書いてみたけど、問題なく書けたよ。素敵。

MacPorts の p7zip がインストール出来るようになるまで、とりあえずコレで回避しておこう。

Posted at:: 2007/09/16 18:28:02; 0 Comments; 0 TrackBacks

Tags:: Mac; MacPorts; vim

Trackback:: http://humming.via-kitchen.com/2007/09/16/installation-trouble-of-vim-on-mac/trackback/

all 19 results.
first
prev
1
2
next
last

Humming Via Kitchen