aptana studio2の環境構築

前回「aptana studioを入れてみた」でaptana studioの日本語化に付いて書きましたが
AptanaStudio.iniの最後の行に
-javaagent:plugins/jp.sourceforge.mergedoc.pleiades/pleiades.jar=
を書き加える必要が有ったようです
会社で出来たのに何で家で出来ないんだ？？？？と悩んでしまいましたorz
http://www.skuare.net/2010/02/_aptana_studio_20_zen-coding.html

あと、個人的な設定として一応shift-jis化
「ウィンドウ」 「設定」「一般」「ワークスペース」
に「shift-jis」と直打ち。
ただutf-8の方が圧倒的に便利なので
ファイルごとに変えるときは
「編集」「エンコードの設定」から変更できますがファイルのエンコード変換は出来ないのでべつのテキストエディターなどで変更して置いて、正しく読めないときに指定する感じ。

次にエディター部分の表示フォントの変更
「設定」「一般」「外観」「色とフォント」
の
「基本」「テキスト・フォント」
を
M+2VM+IPAG circleの11pt
に変更
ただタブが見えなくなるのが難点。解決方法模索中
最後に
「設定」「Aptana」「エディター」「HTML」「フォーマット」
からデフォルトを別名を付けて編集
インデントをタブにして、改行禁止にliを追加、インデント禁止にhtml,head,body等を追加。
ここら辺は最適設定を現在模索中。

Jqueryを使ってTwitterの自分の発言を取得する！！

したかったこと
ブログのツイッター表示するフラッシュのツール重くない？
ならユー自分で作っちゃいなＹＯ！

条件
忍者ブログはサーバーサイドスクリプトが使えないし自分も書けないのでJqueryを使う。
よって、ログインは出来ないから
http://twitter.com/suzrin
で見られる発言だけになっちゃうけどよしとしよう

まずツイッターの仕様を調べた！
ここが大変だった。
上で書いたログインしないでも取得出来る
http://twitter.com/suzrin
の発言をJqueryでとりたいのに大抵のやつは認証後のAPIの話でさっぱり
で、実は
http://twitter.com/suzrin
のソースコードに書いてある
http://twitter.com/statuses/user_timeline/hogehoge.rss
を
http://twitter.com/statuses/user_timeline/suzrin
にするとデータにアクセス出来ることに気が付いた

次に、どのデータ形式でデータを受け取るか？というと
Jqueryで使えるのは
$.ajax
$.getJSON
の二種類しか判らない
他の方法なんか判らないからJSONで貰うことにする
http://twitter.com/statuses/user_timeline/suzrin.json
とすることでJSONP形式で返してくれるらしい。
しかもクロスドメインを考慮されたJSONPと言う形式でjqueryで取得すると自動的にオブジェクトになるらしいエロイ。
でJqueryのサンプルをみると
$(document).ready(function(){
$.getJSON(url,data,fn()
});
となっているから
urlはhttp://twitter.com/statuses/user_timeline/suzrin.json
dataはよくわからいから適当にjqueryにしてみた
でfunction(data)
とするとdataに発言データが格納されるはず

まとめると
$(document).ready(function(){
var url = http://twitter.com/statuses/user_timeline/suzrin.json;
var param='jquery';
$.getJSON(url,param,function(data)
});
となる

でもだめだった。どうやらurlに'callback=?'というのが必要らしい
要するに
var url = http://twitter.com/statuses/user_timeline/suzrin.json?callback=?;
これはAPIリファレンスかなんかに書いてあった気がする
調べたときにどこで見つけたのかメモっておかないのは悪い癖だなぁ

で書き直すと
$(document).ready(function(){
var url = http://twitter.com/statuses/user_timeline/suzrin.json?callback=?;
var param='jquery';
$.getJSON(url,param,function(data)
});
でOK

次に取得したJSONデータを加工しなくちゃ行けない
JSONでーたというのは
var foo = {hoge:'hogehoge',piyo:'piyopiyo'}
と言う形式らしい。
これって配列？と思ってfoo[hoge]とするとhogehogeが帰ってこない
hogeがundifinedだって言われる。
文字列じゃないとダメなのは当たり前だよねorz
foo['hoge']
でhogehoge
が帰ってくる
でもツイッターのデータは凄い数だし階層も三階層くらい有りそうだからこの書き方だと面倒だ
というので調べたらどうやらオブジェクトとして扱えるからクラスを繋げて書けばいいと言う謎の構文が！
foo.hoge
でhogehoge
が帰ってくるらしい
・・・・・！？これってJqueryのメソッドチェーンと一緒か！
javascriptを少し判った気がした瞬間でした
で、あらかじめ調べて於いた発言が入っているのは
'text'
らしいので
data.text
で発言が取得できるはず！早速組み込んでみる

$(document).ready(function(){
var url = http://twitter.com/statuses/user_timeline/suzrin.json?callback=?;
var param='jquery';
$.getJSON(url,param,function(data)
$('body').append(data.text);
});

これが動かない。何で動かないのか判らないからここで一番時間を使った
で、ブレークポイントを$.getJSONの行に設定してリロードを繰り返しながら眺めてたら、dataにデータは入ってるので展開してみてみたら謎の０～２０の数字の中にデータが入っている！
・・・・・！？これって最新の２０発言がまとめて帰ってきてたのね・・・・orz
なので一番目の発言は
data.text
ではなく
data[0].text
あとはこれをforで回してあげて

$(document).ready(function(){
var url = http://twitter.com/statuses/user_timeline/suzrin.json?callback=?;
var param='jquery';
$.getJSON(url,param,function(data){
var twit = '';
for (i=0;i<data.length;i++){
twit += '<li>'+data[i].text+'</li>'
}
$('div').html('<ol>'+twit+'</ol>');
}
)
});

以上で取得、簡単な加工完了！
つっかれたーーーー
けど勉強になりました
少し時間取れたらUI作ってブログにくみこもうっと

追記！！！
var userName = 'あなたのアカウント名'
var url = http://twitter.com/statuses/user_timeline/'+userName+'.json?callback=?;
と言う感じにsuzrinの部分をお目当てのアカウント名にしないと私の発言を取得してしまうので注意してくださいね！！

aptana studioを入れてみた

Eclipseベース？のweb系統合開発環境の「aptana studio 2」を入れてみたのでまとめ！
まず公式からDL。
現在は3がβで出てますけどプラグインとかがよくわからないことになっているので安定版の2を入れてみる
解凍、インストールしたらEclipse用の日本語化プラグインPleiadesをダウンロード。
こっちも解凍して「features」「plugins」をこぴぺ
付属のcmdバッチを使って-cleanで一回起動。
http://technolog.jp/software/797
らへんを参考に。
これで日本語か完了。
次にあらかじめインストールしてあるjreのlibからcharsets.jarをaptanaのjre\lib内にこぴぺ
window/prefarence/general/workspaceからshift_jisを手入力で設定。
これでshift_jisが使えるようになる
http://gtubo.gpoint.co.jp/qa4620000.html
らへんを参考に。
最後にファイヤーウォールを切ってからjquery pluginをaptanaのメイン画面myspaceから選んでインストール
左側のペイン内にあるreferences/global referencesからjqueryにチェックを入れて完了
さらに編集中のファイル内にjqueryのリンクを貼るとコードヒントが出るようになる

結構大変だった＞＜；；

jquery版LightBox導入後

 セレクターの書き方が不味かったみたい
普通のリンクにも効いてしまっていて画像を続けて見られないですね
.not()とか使えば良いのかな？
忙しいのでとりあえず放置で（滝汗

JQuery版LightBox

忍者の広告のせいだと思うんだけど
オーバーレイの灰色バック、画面下まで届かない！
のに気が付いてjsファイル改造するのに15分近く悩んだorz
取りあえず画面の高さ取得する変数がオーバーレイの高さの関数の引数に入ってる行見つけて
そこに50px足しておいた

スクロールバーが出てないページでスクロールバーが出るようになっちゃうけどまぁいいか・・・

ブロック要素内でテキストを縦中央に配置する方法

どっかで読んだの忘れないうちにメモ
上手く動くかどうかは未確認

a {
display : block ;
}
とかしたときに、縦方向中央にそろえたいことがあるはず！

見もふたもない話
display : table-cell;
vertical:align;
を使う
IEに対応させるために
display : inline-block
zoom:1;
で上手くいくらしい

overflowかけられなくなるのが弱点なのですね

HTMLとCSSコーディング中

http://mmm.namidaame.com/
頑張ってコーディング中これからはちょこちょこ更新したいな・・・

画面のデザインが悪いって？
あー、うんなんだ



爆発しろヽ（`Д´）ﾉ