TAKASHI LOG

タイトルのようなことをご所望なお客様がいらっしゃいまして・・

備忘録として。

こんなかんじで設定できる。

http://maps.google.com/maps?saddr=[出発地の地名とか座標]&daddr=[目的地の地名とか座標]&dirflg=r

http://maps.google.com/maps?saddr=現在地&daddr=[出発地の地名とか座標]&dirflg=r

車：dirflg=d
電車：dirflg=t(デフォルト)
徒歩:dirflg=w

車：dirflgなし,(デフォルト)
電車：dirflg=r
徒歩:dirflg=w

現在iphone用のサイト作ってる中ででてきたつまったとこをまとめてみます。

viewportの設定
以下のようにdevice-widthと設定して、縦でも横でもいっぱいに表示できるように設定。

meta name="viewport" content="width=device-width" 

.toolbar h1 {
	margin: 0 auto;
	background: url(img/rogo_3.png) no-repeat;
	width:151px;
	height:39px;
	text-indent:-9999px;
}

@media only screen and  
    (-webkit-min-device-pixel-ratio: 2) { 
	.toolbar h1 {
    background: url(img/rogo_4.png) no-repeat;
	-webkit-background-size: 151px 39px;
	}
} 

-webkit-tap-highlight-color:rgba(45,99,190,0.5);

background-image: url(img/chevron.png), url(img/back_hokkaido_3.png);
background-repeat: no-repeat, no-repeat;
background-position: right center, center center;

background: -webkit-gradient(linear, left top, left bottom, from(#2d63be), to(#71a9fa));

-webkit-border-image: url(img/back_button.png) 0 8 0 14;

$('document').ready(function() {
	if(navigator.userAgent.indexOf('iPhone') != -1) {
		$(".switch a").attr("href", location.href.replace("/iphone/","/"));
		} 
});

Smartphone Site

$('document').ready(function() {
	if(navigator.userAgent.indexOf('iPhone') != -1) {	
		$(".switch a").attr("href", location.href.replace("ドメイン","ドメイン/iphone"));
		} else {
		$(".switch").css("display","none");
	}
});

Smartphone Site

@media all and (orientation:landscape){
.banner_wrap{
横の場合の設定
}
}

@media all and (orientation:portrait){
.banner_wrap{
縦の場合の設定
}
}

鼻毛のお手入れをしたら、白髪がたくさんありました。あぁ。
こんなところも老いていくのかと思うとせつなくなりますね。
日々は鬼のように早く過ぎ去っていくし。
もうすぐ40の大台がせまってくる。たぶんなんの感慨も無く突入するのでしょう。
せめて徹夜作業ではないことを祈るのみです。
あっ次の勉強会のアジェンダどうしようかな・・

思わずMIXIの日記やTWITTERのつぶやきのようなけだるい文章を書いてしまいましたが、私はいたって元気です。
その証拠にブログを書いているのだから。これは元気な証拠です。

一般的に、秋は人恋しい季節といいますが、私は年がら年中人恋しい中２病です。
よかったらお友達になってね！
というわけで、mixiのアカウントをはろうとしたら、mixi落ちてやんの。なんなの？このタイミングで？ネタなの？
しょうがないからtwitterだけでもさらしましょう。
http://twitter.com/dongame

で本題、ちょっと頼まれて作ったので、せっかくなのでまとめてみました。

■jquery使ってgetパラメータを取得してフォームの値に反映

詳細ページがあったとして、該当ページからお問い合わせフォームにきた際には、確定している項目を既に入力した状態にしたいとかありますよね。
ってか絶対ある、はず。

作業はふたつにわかれると思います。
1.url上に存在するgetパラメーターを取得
2.取得したものをフォームに挿入

全部まとめたソース

var SAMPLE = vars.place;

$("#form1 input[name=HOGE]").val(SAMPLE);

項目1


ほげ
ほげ

項目2


ほげ
ほげ

いつもは、youtubeやustreamいって埋め込みコードひろってくるだけの安易な運用をしてるんですが、（変に手間かけてもしょうがないし）、ちょっと複雑な与件がでてきたのでYouTube JavaScript Player API リファレンスと格闘しながらなんとか埋め込んでみました。
ustreamの場合も含めてまとめてみます。


■やりたいこと
・表示サイズが小さいので、youtubeのコントロールバーを非表示にしたい
・ページのアクセントとしての使用なのでミュートした状態にしたい
・上記同様の理由で自動で再生させたい


さっそくやっていきます。

いろいろすったもんだのあげく、今回の与件は埋め込みプレイヤーのパラメータ設定では
できそうにないので、jsのAPIとswfobjectで実装します。

まずお約束ですが、swfobjectをダウンロードしてきます。
サンプルをみるとバージョン2.1を使ってるみたいなんだけど、
お客さんのサーバにすでにあったバージョン2.0でも動きました。たぶん最新の2.2でも問題なく動くと思います。

ヘッドタグの中身はこんなかんじです。

JavaScript API を有効にするには、制御するプレーヤーの URL で、URL パラメータ enablejsapi=1 を渡す必要があります。たとえば、SWF を埋め込むには、次のように URL を記述します。
また、playerapiid パラメータを渡すこともできます。このパラメータは、onYouTubePlayerReady コールバックを呼び出すときにプレーヤーを指定します。playerapiid として渡された値は、最初の引数として onYouTubePlayerReady に渡されます。
version=3 パラメータを追加すると、AS3 クロムレス プレーヤーをリクエストできます。

クロムレスプレーヤーってなに？なんですが、”JavaScript を使用してカスタムのコントロールを作成する場合は、クロムレス プレーヤーをページに読み込むこともできます”ということなんで
カスタムプレイヤーということなんでしょう（よくわからん）
結果的にこの設定をしたらコントロールバーが表示されなくなったので与件完了。基本動けばよい。

であとは、埋め込むビデオをvideo_idパラメータにセットしてます。
自動再生させる必要があったので、autoplay=1を追加しました。

続いてヘッドタグ、
リファレンスにあるように、コールバック関数　onYouTubePlayerReadyを設定して、 playerapiidを引数として渡します。
同じくリファレンスにこうあるので

プレーヤー API メソッドを呼び出すには、まず制御するプレーヤー オブジェクトへの参照を取得する必要があります。この参照は、object タグ、または SWFObject を使用してプレーヤー SWF を埋め込んでいる場合はプレーヤー SWF を組み込んでいる embed タグで getElementById() を呼び出すと取得できます。

swfobjectであらかじめ渡しておいたidに対して設定をしていきます。

といっても今回はミュートさせるだけなので setVolume(0);を設定しただけです。

ustでも、コントロールバーを表示とかしたかったしミュートもさせたかったんですが、どうやらできそうにないので（できるのだろうか？）
flashvarsにちょっと設定を加えて自動再生しない形にしました。

こんなかんじ

CSS Nite の申し込みにクレジットカード決済を導入したかったのですが、カード会社への申請やら毎月の最低使用料金やら、コストも手間も非常にかかるのであきらめかけたのですが、paypalだと月額使用料金もかからず申し込みごとのトランザクション費用しかかからないということで、さっそく導入してみました。

あんまり参考になる記事がなかったので、まとめとして残してみます。

手数料

決済サービスに入る

詳細を設定する

オープンソースカンファレンスで熱があがってるうちにやってみよう！
ということでWORDPRESSをインストールしてみました。
といってもこのブログもWORDPRESSなわけで、1インストールで複数ドメインのブログが作れるWORDPRESS MUをです。

結論からいいますとできました。
適切な設定ができているのか微妙に疑問ですが、まー動いてるからよいのでしょう・・
ブログ1　http://digital-assist.net/wordpress-mu284/
ブログ2　http://testblog.digital-assist.net/
ブログ3　http://testblog2.digital-assist.net/

でもすごくはまりました・・・

やりたいこと

WORDPRESS MUをインストール

WORDPRESS MUを日本語化

DNS設定

ブログを新規作成

wp-config.phpを編集

こんな自分がいって講釈たれていいものかと思いつつ、新幹線の始発にのっていってきました。
参加したお題はこれ↓
地域系勉強会パネルディスカッション【2コマ連続】


どんな形で勉強会やってるの？っていうプレゼンが第一部。
質疑応答が第二部です。

プレゼンは持ち時間5分と言われているにもかかわらず、かたっくるしくて、しゃべりすぎなプレゼンをしてしまいました。
途中で腕時計みたらもう7分経過してた・・ありえない。

ちょうどタイムリーにこんなエントリがありました。
もっとはやくこういうの読んでいればよかったなぁぁ
WISH2009のプレゼンをどう作ったか？

第二部はなんとか緊張もとれて、日本一ゆるい勉強会というコンセプトを伝えられたのではないかと思います。

同じような志をもった方々に触れて、月並みですがなんていうかこう、意欲がわいたっての？
元気でました。感謝。

やっぱぎこちないか・・

あまりの制限の多さと自分の無知に、もう２度とやらないぞ（このへんは潔い）と誓った携帯サイト用のflashコンテンツについてつまったところをまとめておきます。
まだローンチしてないけどね・・
ナレッジにもならないような基本的なことばかりですが、覚え書き。
flashコンテンツつくる仕事をしてて、なんとなく携帯flashつくる仕事をうけて、なんとなくな自分が心底嫌いになったという人が少しでも減りますように・・

だもんで基礎の基礎です、そんなことも知らなかったのか！！とか言わないように。
だってほんとに知らなかったんだもの。

外部データを取得するにはクリックが必要

再生モードによる違いを最低限しっときましょう