refirio.org

主にfreoのメディア管理機能強化のために色々と調べていたけど、どれも自分の技術で実現可能っぽい。

具体的には、ブラウザ上で画像をトリミングしたり、縮小・反転・回転したり、画像に直接何か書いたり、サイズが違ってもレイアウトが崩れないようにグリッドで並べたり。

ブラウザ上で画像をトリミング

よくあるペイントツールみたいに、範囲を指定して切り抜き。以前に作ったもの。

画像を反転

ImageMagickなら命令一発で反転できる。GDには反転命令が無いみたいなので、ピクセル操作で反転。

画像を回転

ImageMagick・GDともに命令一発でできた。あと、画像の縦横比率を保持して縮小…は、普段から使っているので何も難しいことは無い。

画像をグレースケールに変換

ImageMagick・GDともに命令一発でできた。

ブラウザ上で直接描画

以前に作ったもの。画像に手書き文字を書き加えて上書き保存…を作るのも（手間はかかるかもだけど）多分難しくは無い。画像と手書き文字をJavaScriptで一枚の画像に合成するのは難しいかもだけど、サーバーサイドで合成すればいいし。

縦横比の異なる画像をグリッドで表示

もっと手こずるかと思ったけど、文字の水平位置を揃えないのなら特に難しいことは無かった。画像一覧は、基本的にこんな表示が良さそう。

縦横比の異なる画像をトリミングして表示

サイズの比率が違う画像とか大きい画像とか極端に小さい画像とかを、CSSでトリミング＆サイズ調整して一覧表示。こんな表示もアリかも。

iPhone用ページを作れるように、マークアップを勉強中。今のところこんな感じ。

• トップページ
• 文章のマークアップ
• フォームのマークアップ

これからまだまだ調整していく可能性あり。CSS3の事を勉強すれば、動きのあるページも簡単に作れそう。

現在、携帯用ページの入力フォームには、

数値入力欄

istyle="4" mode="numeric"

英数字入力欄

istyle="3" mode="alphabet"

の属性をそれぞれ設定しています。（かなり悩んだ末に。）
これで入力時に自動で数値入力モードや英字入力モードに切り替わるのですが、XHTMLページだとdocomoでは切り替わりません。代わりに style属性を設定する必要があるのですが、今度はsoftbankで正しく入力できなくなる可能性があります…。

詳細は以下のページが詳しいです。

携帯XHTMLでの入力モードのまとめと、ちょっとしたハマりどころについて

上のページにもありますが、

DoCoMo

styleのみ設定

au/SoftBank

istyle、format、modeをすべて設定

というように指定方法を変えるしかないかなぁ…。テンプレート側で「docomoからのアクセスかどうか？」を判別できるようにすれば可能だけど、テンプレートが少しゴチャゴチャしそうな…。

多分上の方法にしますが、もうちょっと調べてみます。