07月26日 

Web関係

ドットコーダーセッション2で喋ってきました

生きてますよw

この放置っぷり…スイマセン…orz

最近はネイティブなiPadアプリにも手を出したりしてて、もうちょっとしたらお見せできるかと思います。

そんな近況ですが、この頃なにかと顔を出してるドットコーダーのゆるふわ会に行って喋ってきました。今回のテーマはjQuery。基礎的な所は他の人が話すので、応用的な内容で喋って欲しい、と。
こういう喋る内容ってターゲット層にバラつきがあるので、どこら辺にターゲットを置いて内容を決めるのかが難しいところではあるのですが…

まーボチボチjQueryのメソッドをちょいと使った感じで且つJavascriptのTips的なことも盛り込める「画像切り替えスライダー」を作ることをテーマにしてみました。というのも、先日のコーディング案件で作ったばかりだったんで…(ちゃんと受注元にも許可を貰いましたよw)
実際に使用されている物の方が参考にもなりません?

ちょっと他のプレゼンターがゆるふわな雰囲気だったので、一人お堅い感じで進めてしまいましたが…何かの参考になったりモチベーションの向上の一助になれたとしたら発表者冥利に尽きます。不手際とかお叱りの言葉もありましたら真摯に受け止めたいと思います。。。
少しずつ発表には慣れてきましたが、いやー喉がカラカラでひっつく感じでしたよ。まだまだ緊張しながらの発表です。

もうちょっと全体的な雰囲気とか感じ取りながら話せるようにならねば、といった感じです。

しかしjQueryっていつになっても人気の話題ですねぇ。

06月21日 

バー

フォトログ

週末記

ここ最近は打ち合わせばかりで実作業がなかなかありません。面白そうな小話もシガラミがあって出せない感じ。ま、出せる時が来ればw

今年は数年振りに蛍を見に行くことが出来ました。落ち着きますね(ただし蚊に10箇所以上刺されながら…orz)。

さてさて週末ですが、同業者と京都で飲んでうっかり終電を逃し、話題のカプセルホテルに泊まる企画に参加してきました。えぇ、ついうっかりです。うっかり終電を逃してしまうので、事前にホテルの予約をしておきましたw

飲むお店は仕事仲間のカメラマンに紹介して貰ったフレンチバールの「ONZE」。初めて行った時もバカバカワイン飲んで終電を逃したのですが、その時はツレと二人でタクシーで帰りましたけどねw
なにしろ料理が旨い。メニューが魅力的。思ってるより量が多い。パンが大きい。落花生は掴み取りw

終電を逃しちゃいけない人がリアルに終電を逃しそうになったりしながらも、満足頂けた様で1つめのミッション終了。ちなみに今回もワインをボトルでバカバカ空けて行き、一人5,000円ほどでしたw

ONZE

飲み足りない人たちはさらにバーへ繰り出して行ったのですが、連日飲みが続いている自分はお先にドロンさせて頂き、第2の目的であるオサレカプセルホテル「nine hours」へ。カプセルホテルながら洗練されたデザインで建築系の賞を受賞しまくってるなう、なところ。twitterを使ったプロモーションや客からの要望収集・対応など新しい試みも取り入れられてます。

カプセルの中も一般的な物と異なり、広さを感じさせるサイズ。圧迫感がありません。ありがちなテレビなどは無く、入眠・起床の事を考えられた照明システムが入っています。起床時間を設定しSleepを押すとだんだん暗くなり、設定時間の30分前からじわじわと明るくなっていきます。

じわじわ暗くなるのが気になって、いちいち目を開けて確認。朝も明かりが付く前から目が覚めてしまい、じわじわ明るくなるのを観察してました。えぇ、まったく意味なしw

京都観光だけでなく、ちょっとリフレッシュしてみたい時など、是非是非足を運んでみてください。

nine hours

おまけ。
プランター菜園で一人気を吐くレモンバームの花が咲きました。

06月09日 

jQTouch

jQTouch – 画面遷移の前にデータ処理

jQTouchネタが多いですね。案件で蓄積してるノウハウの小出しですw

あるボタンやリストをタップした時、画面が遷移する前にデータの取得やら処理を行いたい、という状況は多いかと思います。タップのイベントを拾って処理して、処理後に遷移すればOK。ということで

JAVASCRIPT:
  1. $('#hoge').tap(function() {
  2.     // 処理
  3.  
  4.     jQT.goTo('#next', 'slide');
  5. });

上のネタはどこかのブログでも記事にされていたのを見たことがあるのですが、実はこれだけだと連打や他のボタンをタップしてしまうと画面遷移でブッ飛びます…orz
LocalDBに保存してる分でも後処理によってはタイムラグも発生するし、Ajaxで外部のDBサーバーに問い合わせするとボチボチ時間が掛かったりして余裕で連続タップされてしまうわけで。

こんな時は単純にフラグ立てちゃえばいいですね。

JAVASCRIPT:
  1. $('#hoge').tap(function() {
  2.     if (!tapNow) {
  3.         tapNow = true;
  4.  
  5.         // 処理
  6.     }
  7. });

フラグを倒すタイミングはページの遷移が終了した時で良いので

JAVASCRIPT:
  1. $('body > div').bind('pageAnimationEnd', function(event, info) {
  2.     touchNow = false;
  3. });

で一括でフラグを倒すことが出来ます(エラー発生時などは個別に対応が必要ですが)

さらに、slideを繰り返すとgoBackでリストの.activeが解除されない(?)という謎なアレがあるので、ついでに

JAVASCRIPT:
  1. $('body> div').bind('pageAnimationEnd', function(event, info) {
  2.     touchNow = false;
  3.  
  4.     if (info.direction == "in") {
  5.         $(this).find('a.active').removeClass('active');
  6.     }
  7. });

としておけば解除されますよ。

という小ネタでした。

06月02日 

jQTouch

jQTouchちらつき対応(6/4追記)

ここ数日jQTouchでiPad用ローカルアプリを作ってるんですが、jQTouchオフィシャルではiPad用に2カラムを制御するための仕様策定が進んでいるようですね。

お手軽にiPhone・iPadの動きを伴ったjQTouchですが、画面遷移時に遷移後の画面が一瞬チラついたりして少し微妙な点があります。ソースを追って見たところ、アニメーションにはCSS3のアニメーション機能を使っているようです。
アニメーションを開始させるタイミングで、適したCSSをJSで指定してあげることで要素をアニメーションさせ、終わった段階でアニメーション用CSSを外してあげる。

ちらつきが発生する原因としては、アニメーション終了でCSSを外す時に同時にdisplay:noneになるのですが、ブラウザの仕様(?)で一瞬ちらつくみたいです。

ということで色々と対策を考えてdisplay:noneだけタイミングをずらしてみたりとか試してみたのですが上手く行かず。。。で、ググって見たら出てきました…orz

jqtouch.js

JAVASCRIPT:
  1. function animatePages(from, ...
  2.  
  3. scrollTo(0, 0);
  4.  
  5. // 追加ここから
  6. var toStart = 'translateX(' + (backwards ? '-' : '') + window.innerWidth + 'px)';
  7. // 6/4追記ここから
  8. if (animation.name == 'slideup' && backwards != true) {
  9.     toStart = 'translateY(0px)';
  10. }
  11. // 追記ここまで
  12. fromPage.css( 'webkitTransform', toStart );
  13. // 追加ここまで
  14.  
  15. var callback = function(event) {
  16.     // 追加1行
  17.     fromPage.css( 'webkitTransform', '');
  18.  
  19.     if (animation)

(元ネタのページは失念です。。。)

元のソースに手を入れるのは気が引けるところですが、これでバッチリちらつきを無くすことが出来ます。お悩みの方は是非お試し下さいませ。

(6/4追記)
slideupのアニメーションで、遷移前のページが消えてしまう為、ソース改変の一部を変更しました。
ちなみにドキュメントには書かれてない(?)と思うんですが、縦スライドさせたいときは「slideup」ですが、任意で横スライドさせたい場合は「slide」です。

05月31日 

javascript

jQueryでアニメーションさせるとき


jQueryに限った話では無いかとも思うのですが…

ブロック要素をスライドさせたりしてアニメーションさせる時、表示がガタガタと乱れて見苦しい時があります。そんな時は…

アニメーションさせるブロック要素に「overflow:hidden」を指定するとよろし。というTips

スクロールバーが既に出てるブロック要素なら、アニメーションの開始直前に指定してあげれば見た目上にはあまり違和感無しです。
んでここからが大事で、iPhone用のWebアプリを作る時にそれっぽいUIを実現することが出来る「jQTouch」。画面遷移アニメーションで結構ガタつきます。
そんな時にもこのTips、画面単位のDIVにoverflow:hiddenを指定してあげると(多少w)改善されます。

ちなみにローカルアプリをHTML+CSS+JSで構築し、DBにはHTML5のClient-side Databaseを使いましたが、PhoneGapでアプリ化しても何のトラブルも無くiPadアプリとして使用できました。スゲー。
(結局は色々な問題点があってWebアプリとしてサーバー上にリソースを置くことになったんですけどね…)

PhoneGap使えばGPS拾ったりコンタクトリストからデータを引っ張ったり、カメラを起動したりと結構色々な事が出来るので、UIが少し緩かっても大丈夫とか高機能性を求めないのであればオススメですよー(って何記事?)

05月27日 

趣味

走ります。


家から一歩も外に出ないことがある仕事柄もあって、恰幅の良さは止まるところを知らない今日この頃。
一念発起して近所のトレーニングジムに行ったものの、GWが間に入ったお陰でリズムが崩れてしまい(言い訳)少し足が遠のいてしまっています(1ヶ月更新でちょうど更新日が来てるのもあるけど)。

そんな折り、iPhoneのGPSを活用して走った距離や時間を記録してくれて、無料で使えるインターネットのサービスに蓄積してくれる「RunKeeper」という物を知る。iPhoneアプリも無料で提供されている物で必要十分だし、最近一般の層にも認知され始めたTwitterに投稿する機能もあったり。

こういう切っ掛けがあれば始めやすいのかも。

ということでランニング用にnew balanceのスニーカーを購入(ここ数年NB以外の靴を買った記憶がないw)、ユニクロでシャツとパンツを購入。これで準備は万全。まずは形が大事w

色々考慮して、走るのは早朝にしてみます。目が覚めて仕事も捗るだろう、という算段です(疲れて寝るんちゃう?というツッコミは無しの方向でw)。
無理がなく、続けられるような構成で進めていきたいと思います。

あ、間違ってもマラソン大会に出場する、とかは考えてませんw

05月26日 

スイーツ

3RING SWEETS


今日、”よーいどん”の「本日のイチオシ」のコーナーでタージンが紹介してた新感覚のモチドーナツを買いに行ってきました(関西ローカル過ぎるネタですいません)。

いや、わざわざ買いに行ったわけではなくて、ちょうど三宮に事務所があるFaith Createsさんに借りたい物があって&営業しに行ってきたわけで、そのお土産に(+家で食べるようにw)ちょうどいいや、ということで。

はい。行列出来てました。
多くは語りませんが、オペレーションで改善できるレベルかと。

30分程並んで購入。

品切れ多数。

帰って食べてみました。

食感のアンバランスさが売りなのだろうな、と感じつつ、過ぎたるはなお及ばざるがごとし。。。

ドーナツ、と思って食べるとアレなので、形を真似た新しいスイーツ、という認識で食べるとハッピーだと思います。
会社に営業などに行く際に、話のネタとしてお土産に持って行くには最適かもしれません。デコレーションや色が可愛いと感じる女子は多いと思われ→モテモテ。
4個がセットになった物もありましたよ。

自宅用に買って帰ることはもう…ゲフンゲフン。

あ、なんか高槻 西武にも出店するらしいです。

兵庫県神戸市中央区三宮町

05月24日 

家のこと

暖炉が欲しい


ごちゃ混ぜ→技術系→マイホーム日記。

と言う流れになって来つつある今日この頃。

あれ、このフレーズどっかで見たな、という人。
たまに記事が連動してることがあるので、両方見ておくと面白いですよw

で、正確には暖炉ではなく「薪ストーブ」なんですが。揺らめく火を眺めてるだけでも落ち着くんですよね~
家を建てるときに囲炉裏を置きたい→排煙や換気の問題で難しい。転倒事故も怖い→やはりここは薪ストーブか。というのも、嫁の上司宅にあるんですわ、薪ストーブ。遊びに行くたびに「いいな~」と。やっぱりアナログが必要なんです。

上司宅にあるような外国製の鋳物は30~70万くらいと高価。ただ室内で火を扱う物だけに下手な物を買うと一酸化炭素中毒の危険もあるので注意が必要です。欧米などでは一般的(?)なので種類も多いですが高い。国産の物だと10万円台で購入出来る物も(→ホンマ製作所

と、夢と希望(©ホワイト赤マン)は膨らむばかりですが、導入に当たっては最大にして最強の敵「嫁」を説得しないことには始まりません。
ということで自身の整理を含めてメリットとデメリットを…

メリット

  • 暖かい(火加減の調整にもよるけど窓を開けられるくらい)
  • 空気が汚れない(ストーブの周りの空気が暖められ、排煙は煙突へ行くため)
  • 暖かさが持続(種火が残るから。朝まで持ったりするらしい)
  • 料理併用(商品によってはオーブン機能もある)
  • 精神的効用(笑)

デメリット

  • 掃除が必要(灰が溜まったら捨てたり)
  • 事故(周りが熱いので触ると火傷する。囲ってしまえばいいかな?と)
  • 薪(購入や保管場所が必要)
  • ランニングコスト(薪代や年1回の煙突掃除など)
  • 場所を取る(年中置きっぱなしなので)

こんな感じでしょうか?あとは実際に使用されている方にお話を聞いたり、嫁の説得に協力をお願いしないといけないですねwww

かくいう本体の家の方ですが、問題になっていた貯水池については営業マンも過去の住宅地図を見て気付いたらしく、土地の履歴や杭打ちの状況を調べておいてくれて、キチンと支持地盤まで届いている杭打ちが為されていることなどを確認してくれていました。適切な杭打ちは下手な更地よりしっかりする、とはツレ建築士の弁。

さらにその宅地には変に余ってしまう土地があって元の地主が所有を続けていくらしいのですが、この区画の居住者が菜園やガーデニングをするのに自由に使っていい、という何とも素敵な条件が!家庭菜園用に畑を借りようかと思ってた自分にしてみれば願ったり叶ったりで。
さらに希望する区画については建築条件も無いので、かなり自由に設計が出来るかも、ということで。

もう気持ちが先行しすぎてて止まりませんw

現在は、建物の施工業者の素性調査(笑)を営業マンが進めてくれてます。「1つ1つ問題をクリアにして全て不安材料が無いように、自分自身が本当にお薦めできる物件を仲介したい」と。ホント、この営業マンの信頼度は会う度に上がっていきます。1週間でかなりの資料を集めてくれて、すでに手元に地積測量図と間取りプランの設計図が。

間取りが微妙なので、勝手に間取りを考えてたりw
最終的にはツレの建築士に茶々入れてもらって、理想の家に近づけて行きたいと夢に描いております。

05月22日 

家のこと

餅は餅屋


おうち探しなう、である。
子供の環境第一に、自然豊かな環境の中で伸び伸びと育って欲しい。そんな動機です。

  • 予算:ナイショ
  • 間取り:4LDK以上
  • 土地:広め(30坪以上)
  • 駐車場:2台
  • 駅徒歩:1時間以内
  • 場所:自然豊か、駅までなんとか出られる、嫁が職場に通いやすい

その他諸々要望はありますが、とりあえず最低限譲れない条件はこんな感じ。あとは仕事場として3畳でいいから書斎が欲しいですw

ちなみに最初にバラしておくと、不動産は物件がネットワークで管理されてるので、どこの不動産屋に行っても見る・買うことができる物件は同一です。まだ登録されていない物件を持ってるかどうか、だけどその差も1・2週間とのこと。複数の不動産屋を回るってのは、要は営業マン探しですな。

まーそんなことも知らず、何社か回ってみました。
一番良くないのは嘘をつくことですよね。

  • 土地だけ買って別で家を建てる場合、ローン契約を2つしないといけない。土地と建物は別。
  • 「山を削って宅地にしたのか?」→「削った所もあるが盛ってる所もある。杭を打ってるから問題無い」

1については、土地と建物はセットにしてローンを組むことが出来る。ま予算の関係上、建て売りしか買えないので別にいいのだけど。
2。これが酷い。厳密に言えば嘘を言ってるわけでは無いのだけど。というのも偶然にGoogleMapの航空写真で眺めていたとき、その区画一帯が貯水池だったことが判明。「この場所は山を削った所なのか?盛り土をしたところなのか?」という質問だったので、そりゃ貯水池になる前は山だったから、そこを削って→(貯水池にして)→宅地にした。直前の履歴を尋ねられてないから、となればこちらも反論の余地は無いですケドネ。

杭を打つにしても、基礎地盤にまで届いてないと意味ないし、安く売り出してる宅地に相当費用が掛かる杭をそんなに打ってるかどうかは疑問(建築士の友人談)

実は候補にしているそこから少し離れた宅地も同様に貯水池であったことが判明したので、探りを入れるべく担当の営業マンに確認してみました。

  • 確かに前は貯水池だった
  • ただし人工的にコンクリートで作られた物
  • 地盤改良に関してはしっかり対策
  • 調査の内容や施工の書類はキチンと揃える
  • あなたの不安に思っている点は全て解消した上で話を進める

こちらが貯水池についての質問をしたから上記の答えだったんですが、「ジャブ打ってみて、微妙な返し方をしてくるようだったら、この場所も考え直そう」と決めてました。が、全然そんな風も無く。
ようやく良い営業マンに恵まれました。

建築士の友人と話をしていても思うのですが、家一つ立てることに対して必要な知識は膨大で、素人の付け焼き刃では太刀打ちできるものでは無いと実感。嘘をつかれていても、それを見破るのは困難。

ホームページ制作に関しても同様。
先ほど打診頂いた電話で、現在展開しているホームページとブログを一緒にしたい、と。とある業者に見積もったら○○○万円。内訳見てないので何とも言えないですが、お客さんの要求レベルと併せて考えるとボッタクリ臭がプンプンします。もし内訳があってもこの業界も専門用語バリバリなので、一般の方からしてみれば…

他にも、「サーバーを管理している会社の担当」と名乗る人に、「MySQLでDBをUTF-8で1つと、アクセス用のIDとパスワード、操作用にphpMyAdminを用意して下さい」と伝えても、見事に1つたりとも理解できないご様子。結局やってる業務は誰でも借りられるレンタルサーバーを契約して、それを再販してるだけ。一体幾ら貰ってるのやら。

「餅は餅屋」とは言うけれど、100円で売ることの出来る餅を適切な原価で作って、「あの餅美味しかったよ」と行って貰えるような餅を売らねばと思う訳です。

05月20日 

仕事

車関係

人の縁とは


ずいぶんご無沙汰の更新となります。
ちょっと方向性などで逡巡してたこともあり、なかなか手が着きませんでした。またのんびりとお付き合い頂ければ。

地元の大学院に通っていた頃、通学に車が必要な距離に済んでいたので一目惚れしたダイハツのYRVという車に乗っていました。当時はオーナーズクラブを作って独自にホームページを設置し、ネットでの交流やオフ会を企画するのが流行って(?)いて、YRVについても全国的にそういった雰囲気でした。
当時、中国地方を管轄するクラブが無かったので、時間だけはある学生の自分が立候補し取り纏め役など務めさせてもらってました。

当然、隣の地域である関西地区の集まりにも積極的に参加し、関西のノリで仲良くなり現在でもお付き合いさせて貰っている面々も。
上の写真は蒜山に泊まりがけで行ったオフ会の集合写真です。中国地方と関西地方が半々くらいw

現在は車も変わり(自分のYRVはオーストラリアで走ってます)、それぞれが結婚や環境の変化に伴って集まる機会もなかなか無くなってしまいました。

かくいう自分も生活環境はかなり変わり、現在はWebに関わる仕事に携わっているわけですが、同業者との交流やモチベーション、技術の向上のために勉強会などに参加しており、多くの方と仲良くさせて頂いています。

つい先日ですが、同業の方からお仕事の打診を頂き、仕事の内容も自分が得意とする分野だったので引き受けさせて頂くことに。
話を聞くと姫路のデザイン事務所さん経由のお仕事らしい。

そういえばYRVで仲良くしてた人が姫路でデザインの仕事してるって言ってたなぁ。久しぶりに連絡でも取ってみるかぁ。

はい。どんぴしゃ。

メールを送ったら、すぐに電話が掛かってきて「そこ、うちやでw」とw

人の縁って凄いですね。
全く絡んでないと思ってた、いや想像すらしてなかった線と線が実はどっかで接触してて。もしかしたらそういう運命だったのか星の下に生まれたのかwww

一期一会ではないけれど、これからも一つ一つの出会いを大切にしていかねば、と引き締まる思いです。

今回の再会(まだ会ってないけどw)を引き合わせてくれた全ての人・切っ掛けに感謝感謝です。