つい最近、iPhoneのAppStoreに、「Opera Mini」が登場しました。 開こうとするサイトを、一旦Operaのサーバを経由し、圧縮したデータを取得することで、 Safariよりも高速なブラウジングが出来るようです。 そもそも「Opera Mini」というのは、携帯端末でのOperaを指すようで、 今回リリースされたのは、そのiPhone版ということのようですね。 ただ、Safariではブラウザ判別の基準として、 ユーザエージェント内の「iPhone」という文字列をチェックしていましたが、 「Opera Mini」のそれには「iPhone」が含まれず、PC表示となるサイトがあるようです。 うちのほるめすメモ帳 - 暫定も例外でなく、 Safariと同様に見せるためには、「Opera Mini」の判別をする必要があります。「Opera Mini」のユーザエージェントの内容。 その通り「Opera Mini」という文字列が含まれるので、それを利用します。
<script type="text/javascript"> //モバイル端末の判定 var agent = navigator.userAgent; document.write( "ユーザエージェント：" + agent + "<br>" ); if( agent.search(/Opera Mini/) != -1 ){ // iPhone }else{ // PC } </script>この判定では、結局他の「Opera Mini」もiPhone側に属してしまうので、生ぬるい感じです。 僕は別に他のそれらがiPhoneとしてヒットしようが良いのですが、 もしそこまでこだわって制御するのであれば、結局IPチェックするしか無いのかなと思います。 うーん、まだSafariからOperaに乗り換える理由が生まれないかなぁ。 軽くなっている気はするけれど、ブックマーク移行できないし、 デフォルトでiPhone仕様のサイトをそのまま表示出来たら嬉しいね。
2010年4月15日木曜日
JavaScript 「Opera Mini」を判別してCSS切り替え
2010年3月9日火曜日
VBScript 簡素にファイルチェック
最近はめっきりVBScriptも触っていませんが、 ソフトウェア管理支援システム開発日記も使用しなくなったので、 置いておいたら便利な分だけ引っ越してきておきます。 サンプルとしては、ファイル(フォルダ)の存在チェック、新規作成/削除や拡張子取得などですね。 進級制作で作っていたときに必要だった情報です。Option Explicit ' フォルダ名指定 Dim fdName, flName, cMsg fdName = "iroha" flName = fdName & "\test.txt" ' FileSystemObject呼び出し Dim Fso Set Fso = CreateObject( "Scripting.FileSystemObject" ) ' ◆フォルダ存在チェック If Not Fso.FolderExists( "iroha" ) Then ' 無ければ作成 Fso.CreateFolder( "iroha" ) End If ' ◆ファイル存在チェック If Not Fso.FileExists( flName ) Then ' 無ければ作成 Fso.CreateTextFile( flName ) End If ' ◆ファイルの拡張子のみを表示 Msgbox( "拡張子：" & Fso.GetExtensionName( flName ) ) ' ◆フォルダ内ファイル数カウント Msgbox( "ファイル数：" & Fso.GetFolder( fdName ).Files.Count ) ' Msgboxの戻り値をcMsgに格納 cMsg = Msgbox( "「" & fdName & "」を削除しますか？", vbYesNo, "確認" ) ' 「はい」の場合 If cMsg = vbYes Then ' ◆フォルダ丸ごと削除 Fso.DeleteFolder( fdName ) End If
2009年11月29日日曜日
iPhone ページ内検索ブックマークレット
思いついて調べるとiPhoneでもブックマークレットっていけるんですね。 よく考えてみれば、JavaScriptを実行するだけだからいけるのか。 ということで、 iPhoneのSafariで表示しているページ内を検索するブックマークレットを作成しました。 iPhoneのSafariには検索がないので、調べ物する時には困るんですよね。 現物は以下から。 iPhone用ブックマークレット ほるめすメモ帳 ソースよりも、利用方法から。上のページにアクセスし、「ページ内検索ブックマークレット」下のソースをコピーします。
コピーしただけではブックマークに追加されないので、 適当にページをブックマークに追加したのち、コピーしたソースに書き換えます。
ページ内検索したいページに移動し、さっき作ったブックマークを選択すると、 入力ダイアログが表示されるので、検索したい文字列を入力してOK。
検索し存在すると、その文字列が黄色で強調され、件数とともに終了します。 見やすいソースはこちら。
javascript: var t=window.prompt('検索する文字列を入力して下さい。',''); if(t!=null&&t!=''){ var re=new RegExp(t,'ig'); var b=document.body.innerHTML; b=b.replace(re,'<span id=\'sebml\' name=\'sebml\' style=\'color:#000;background-color:#FF0;\'>'+t+'</span>'); document.body.innerHTML=b; var sebml=document.getElementsByName('sebml'); if(sebml.length==0){ alert('一致する文字列はありません。'); } else{ alert(sebml.length+'件検索しました。'); } } void(0);あ、ちなみにiPhone以外でも使用出来ます。 ブラウザに標準であるので使わないと思いますが。
2009年11月18日水曜日
iTunesをVBScriptから触るためのメモ
iPhoneが愛用機になってから、音楽を聴くのはiTunesになりました。 その影響で再生する時にはいつもByursideというガジェットで操作しています。 iTunesの様に大きくなく、ガジェットバーに配置することでいつでも触れる上、 再生だけでなくループ設定やジャケット表示も出来るので、 全く不満は無いです、凄い便利。 で。 ふと考えてみると、ガジェットは基本XML+HTML+JSのはずなので、 結果iTunesはJSで触れるはずですよね。 ということで調べてみると、やはりJSで触れることが分かりました。 情報は少ないものの、十二分にデータ取得や再生処理が行えるようです。 以下が参考になりそうなサイト様です(Java含む)。JSで触れると書きましたが、「Wscript」オブジェクトからなので、 実質VBScriptで使用することが出来ます。 ただ単に再生/一時停止するだけなら、以下のソースの様になります。Dim iTunes Set iTunes = WScript.CreateObject("iTunes.Application") iTunes.PlayPause()こんなに簡単に出来るんですね。
2009年11月7日土曜日
VB.NET 入力値数値チェック+0詰め
これもまた、学校の課題の中で使用するソースですが、
本来とはまた違う数値チェックになります。
そもそも「IsNumeric」や「TryParse」という存在を、
昨日に初めて知ったので、当然使用していませんでした。
個人としては、ずっとこのチェックを使ってきたので、
まぁいいかなぁという感じです。
' *******************************
' TextBox1 の中身の数値チェック
' + 4桁まで頭に0を付ける
' *******************************
Try
' TextBox1の中身
Dim sData As String = Me.TextBox1.Text
' Integerへ変換
Dim iData As Integer = Integer.Parse(sData)
Dim iLength As Integer = iData.ToString.Length
' 4桁制限
If iLength > 4 Then
MsgBox("4文字以内で入力して下さい")
Me.TextBox1.Text = ""
Me.TextBox1.Focus()
Exit Sub
End If
' 不足分"0"作成
sData = ""
For i As Integer = iLength To 3
sData += "0"
Next
' TextBox1へ戻す
Me.TextBox1.Text = sData & iData.ToString
' 数値以外
Catch ex As Exception
MsgBox("数値以外です")
Me.TextBox1.Text = ""
Me.TextBox1.Focus()
End Try
Try内で「Integer.Parse」を行い、
「変換できれば」0詰め処理を行います。
この場合「0002」など、すでに頭に0が付加されているものも数値をして認識し、
全角数字やローマ数字はエラーとなります(Integerへ変換できないため)。
頭に0詰めする理由としては、
データベースを用いてマスタメンテを作成する上で、
0を入力する手間を省くためです。
また、この処理では、
「1,525」などの区切りが行われている場合は、
当然文字として認識するので、使用出来なくなります。
その場合は、カンマの存在をチェックし、あるなら省く必要がありますね。
2009年11月4日水曜日
Javascript ページ内<input>のName一覧表示ブックマークレット
今日、お友達のJavascript弄りに参加している時に、
偶然の産物的に出来たのでメモ。
いやまぁ、基本的なところは友達が作りました。感謝です。
Javascriptからオブジェクトを弄る際に、
その時に必要となるID or Nameが一目でどこにいるか分かれば便利なので、
ブックマークレットとして登録しておきます。
右クリックから「お気に入りに追加」してください。
◆ページ内<input>Name一覧表示
javascript:
// ページ内<input>情報取得
var ele = document.body.getElementsByTagName('input');
var res = '',
// <input>の個数からナンバリング桁数取得
len = ele.length.toString().length;
for (var i = 0; i < ele.length; i++) {
var pz = '',
// 現在の連番桁数
ilen = i.toString().length;
if (len > ilen) {
// 不足分0詰め処理
for (var j = ilen; j < len; j++) {
pz = pz + '0';
}
}
// まとめて格納
res = res + pz + i + ':' + ele[i].name + '\n';
}
alert(res);
void(0);
2009年10月31日土曜日
Sleipnir APIを利用したアクティブページ別ブラウザ表示
Sleipnirを利用している人には分かることなのですが、 標準でいくつかのスクリプトが用意されています。 その中には、内部でSleipnirAPIを使用しているモノもあります。 SleipnirAPIに関してはこちら。 タブブラウザ Sleipnir オンラインデータベース(Sleipnir.API リファレンス) で。 SleipnirAPIを利用して、アクティブページのURLを取得し、 別のブラウザで表示するスクリプトを作成したので、以下にまとめます。 まずはソースを。 そんなに難しい内容ではないです。' ****************************************************** ' FirefoxでSleipnirアクティブページを表示 ' ****************************************************** Option Explicit Dim Pnir, WshShell, Url ' SleipnirAPI呼び出し Set Pnir = CreateObject("Sleipnir.API") ' 現在開いているページのURL取得 Url = "firefox " Url = Url & Pnir.URL ' 非同期で呼び出し Set WshShell = WScript.CreateObject("WScript.Shell") Call WshShell.Run( Url )ソースはFirefoxで開いていますが、Chromeでも確認済です。 「名前を指定して実行」出来るブラウザに対してはいけるはずです。 ブラウザを変える場合には、12行目のブラウザ名を変更してください。 以下が使用準備・方法となります。Sleipnirのメニューバー「スクリプト」内のスクリプトが実行出来ない場合は、 「ツール」→「Sleipnirオプション内」から、 スクリプト実行を許可する必要があります。
スクリプトが利用できるようになると、 「スクリプト」内の「スクリプトの整理」を選択できるようになるので選択。
Sleipnirのスクリプトディレクトリが表示されるので、 「Firefoxで開く.vbs」を作成し、上のソースをそのまま貼り付けて保存。
Sleipnirに戻り、先ほど作成したスクリプトファイルを表示するために、 「スクリプト」内の「スクリプトの再読み込み」を行います。
「Firefoxで開く.vbs」が表示されるので選択。 Sleipnirで開いているページが、Firefoxで表示されれば完了です。 なお、当然ながらFirefoxで開くので、 インストールされていない場合にはエラーが発生します。 何しろエラーチェックしていないもので・・・。
2009年10月29日木曜日
VB.NET Enter時フォーカス遷移
昨日の続きで、試験で使用するソースについてメモ。 基本的にフォーカスを遷移する際にはTABを使うので、 遷移順位を付ける「タブオーダー」で並べ替えておきます。 ですが、一つの画面で複数の項目を素早く入力する場合には、 入力後の「Enter」で次のテキストボックスやボタンに遷移しておくべきです。 というわけで、その為のソースです。 2通りの方法がありますが、好きな方を選ぶと良いと思います。 1つ目：「KeyDown」での取得・遷移。' ****************************************************** ' Enter時フォーカス遷移 / KeyDown ' ****************************************************** Private Sub TextBox1_KeyDown(ByVal sender As System.Object, _ ByVal e As System.Windows.Forms.KeyEventArgs) _ Handles TextBox1.KeyDown ' Enterの場合 If e.KeyCode = Keys.Enter Then ' ビープ音を鳴らさないようにする e.SuppressKeyPress = True ' 次のTextBoxへフォーカスを当てる Me.TextBox2.Focus() End If End Sub「KeyDown」時に「どのキーが押されたか」をチェックします。 「Keys.Enter」で無くとも、Enterのキーコードである「13」でも可能です。 2つ目：「KeyPress」での取得・遷移。' ****************************************************** ' Enter時フォーカス遷移 / KeyPress ' ****************************************************** Private Sub TextBox2_KeyPress(ByVal sender As System.Object, _ ByVal e As System.Windows.Forms.KeyPressEventArgs) _ Handles TextBox2.KeyPress ' Enterの場合 If e.KeyChar = Chr(Keys.Enter) Then ' ビープ音を鳴らさないようにする e.Handled = True ' 次のTextBoxへフォーカスを当てる Me.TextBox1.Focus() End If End Sub「KeyPress」時に「押されたキーはどれか」をチェックします。 「Chr(Keys.Enter)」は、 Chr関数によって「Keys.Enter」をそのまま「Enter」として返しています。
2009年10月28日水曜日
VB.NET テキストボックスでの入力制限
去年の春から授業でVB.NETを学び始め、それが今年も続いています。
当然年度ごとに大きな課題があり、
頭を悩ましながらかつ、みんなと協力しながら作り上げていきます。
そんな年度末の課題で使用した、テキストボックスの入力制限を、
今年の課題でも使う時が来たので、見て思い出せるようにメモ。
VB.NETとタイトルでは一言で書いてありますが、
生憎授業及び自宅での開発環境はVS2005ですので、
もしかしたらそれ以前、以降の環境ではダメかも知れないので注意。
' ******************************************************
' キー入力制限 / 数字+BackSpaceのみ
' ******************************************************
Private Sub TextBox1_KeyPress(ByVal sender As Object, _
ByVal e As System.Windows.Forms.KeyPressEventArgs) _
Handles TextBox1_KeyPress
If (e.KeyChar < "0"c Or e.KeyChar > "9"c) _
And e.KeyChar <> vbBack Then
e.Handled = True
End If
End Sub
入力制限は、TextBox1のKeyPressイベント発生時に行います。
このサンプルはコメントにも書いてある通り、「数字+BackSpace」のみです。
判断文字をしている際の「"0"c」などは、Char型へキャストしています。
この事に関しては、Microsoftのリファレンスに書かれていますね。
文字型 (Char)
もし数字以外を入れたり(日付のための「/」など)する場合には、
判断にその文字を入れる必要があります。
2009年10月17日土曜日
VBScript fakepath回避選択ファイルパス取得サンプル
IEditorを作成した時に、 程よく使いやすいサンプルが出来たのでメモ。 ソースが長いので、見づらい場合には閉じて下さい。 ▼ソースを開く/たたむ以下参考メモ。 ソースの大本は、以下を参考にしました。 ファイル選択ダイアログを開く：SQLの窓 IEオブジェクトを作成した際にエラーチェックしていませんが、 「IEの入っていないWindows環境」を見たことがないのに加え、 Vista+IE8でも問題無く通過しているので、様子見の状態です。 このサンプルでは、 ファイルを選択した際に拡張子を判別しています。 別に無くても良いのですが、IEオブジェクトを使用するという仕様上、 ファイル選択ダイアログ時に拡張子を限定することが出来ないため、 仕方無くファイルを選択した後の判断となります。 IE8の場合、<INPUT>に格納されるファイルパスを取得した際に、 セキュリティの問題上「C:\fakepath\」となります。 その回避として、 何度も紹介させて頂いている以下のサイトを参考にしました。 IE8で、input type=fileの.valueがc:\fakepath\filenameを返す。(その２): Windows Script Programming' ********************************************************** ' ファイル選択ダイアログを表示し、ファイルパスを取得する ' ********************************************************** Function GetFilePath() ' 変数宣言 FilePath = "" ' ファイルパス ExtName = "exe" ' 拡張子判断用 ' 初期メッセージ Msgbox("パスを取得するファイル(." & ExtName & ")を選択して下さい。") ' IEオブジェクトを用意 Set Ie = CreateObject("InternetExplorer.Application") Ie.Navigate( "about:blank" ) Ie.document.getElementsByTagName("BODY")(0).innerHTML = _ "<INPUT id=FilePath type=file><TEXTAREA id=Text></TEXTAREA>" Ie.document.getElementById("FilePath").click ' 選択ファイルパス格納 FilePath = Ie.document.getElementById("FilePath").value ' 選択ファイルパスチェック If FilePath = "" then ' ファイルが選択されなかったので終了 Msgbox("ファイルが選択されなかったので終了します。") Wscript.Quit end If Set Fso = CreateObject( "Scripting.FileSystemObject" ) If Fso.GetExtensionName( FilePath ) <> ExtName then ' 実行ファイル(.exe)が選択されなかったので終了 Msgbox("選択されたファイルが実行ファイル(." & ExtName & ")で無いので、終了します。") Wscript.Quit End If ' IE8の場合はセキュリティの関係上、 ' 「C:\fakepath」となるので、別処理取得 If InStr( FilePath, ":\fakepath\" ) = 2 Then ' コピー&ペースト用定数用意 Const OLECMDID_COPY = 12 Const OLECMDID_PASTE = 13 Const OLECMDID_SELECTALL = 17 '(&H11) Const OLECMDEXECOPT_DODEFAULT = 0 ' FilePathの内容をコピーし、Textへペースト Ie.Document.all.FilePath.focus Ie.ExecWB OLECMDID_SELECTALL,OLECMDEXECOPT_DODEFAULT Ie.ExecWB OLECMDID_COPY,OLECMDEXECOPT_DODEFAULT Ie.Document.all.Text.focus Ie.ExecWB OLECMDID_PASTE,OLECMDEXECOPT_DODEFAULT FilePath = Ie.Document.all.Text.value End If ' Ie破棄 Ie.Quit Set Ie = Nothing ' 最終的にファイルパス取得 GetFilePath = FilePath End Function
2009年10月14日水曜日
【自作】IEソースエディタ登録ツール 「IEditor」
※追記：最新版は「Ver1.12」ですので、以下からダウンロードして下さい。 【更新】「IEditor Ver1.12」 InternetExplorerの標準ソースエディタはメモ帳ですが、 そもそもメモ帳は使いにくい上に、 Shift-JIS以外の文字コードだと化けて使い物になりません。 OSを新しく入れた際などに、IEのソースエディタを変更することが、 もうすでに自分の中でのデフォルト作業と化しています。 ということで、その手間を省くために、 IEのソースエディタに別のエディタを登録するためのツールを作成しました。 その名も「IEditor」。以下からダウンロード出来ます。 また、本体は.vbsなので、直接「開く」ことで実行することも出来ます。 直接の場合は以下から。zipファイルに含まれている「Readme.txt」に細かい事が書かれているので、 以下には軽く説明を。 すでに書いた通り、このツールはIEのソースエディタを「登録」するものです。 現時点(Ver1.00)では、決めうちでTerapadを対象として登録します。 さらに、Terapadでもインストーラによってインストールされたものに限ります。 IE8ではソースエディタの設定が変更になったので、IE6,7が対象となります。 すでにソースエディタが登録されている場合には、処理が終了します(何も無し)。 VBScriptでのレジストリ操作の勉強がてらに作ったので、 所々にコメントをちりばめてあります。 中身を編集して使用する場合には参考にどうぞ。 以下が「IEditor.vbs」のソースです。' ********************************************************** ' 【IEditor / IEソースエディタ登録ツール】 ' ' 詳しくはReadme.txtを参照。 ' エディタパスは、11行目を変更して下さい。 ' ********************************************************** ' WshShellオブジェクト用意 Set WshShell = WScript.CreateObject("WScript.Shell") ' エディタパス用意 EditorPath = "C:\Program Files\TeraPad\TeraPad.exe" ' レジストリパス/データ型用意 RegCheckPath = "HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\View Source Editor\Editor Name\" RegType = "REG_SZ" ' 対象レジストリ存在チェック On Error Resume Next WshShell.regread( RegCheckPath ) If Err.Number = 0 Then ' 存在するので終了 Msgbox("すでに登録済なので、終了します。") Wscript.Quit Else ' ソースエディタ登録確認 cMsg = MsgBox( _ "パス【" & EditorPath & "】として、" & VbCrLf & "IEのソースエディタを登録しますか？" _ , vbYesNo _ , "IEditor - IEソースエディタ設定" _ ) If vbNo = cMsg then ' 登録しないので終了 Wscript.Quit Else ' 対象レジストリ書き込み WshShell.RegWrite RegCheckPath, EditorPath, RegType Msgbox("ソースエディタを登録しました。") End If End If
2009年10月13日火曜日
Accsess/MDB 日付リテラルまとめ
今日、授業内で使用することがあったのでメモ。 授業で使用しているDBにはAccess/MDB以外に、 Oracle、MySQLがあります。 Javaで作成したプログラム内でOracle用に作成したSQL文を、 MDBに転用しようとするとエラー発生。 ちなみに、その時のSQL文は以下のもの。select * from 社員マスタ where 氏名 like '%浦%' and 性別 = 0 and 作成日 between '2005/01/01' and '2007/12/31'最初は、列名に「[]」が無いせいなのかと思いましたが、反応無し。 仕方がないので調べてみると、MDB特有の日付リテラルに行き着きました。 MDBでのBETWEENについて ※リンク先を間違えていたので修正。 つまりは、MDBでは「'2005/01/01'」という書式が、 日付型でなく文字列型で扱われるということですね。 なので、「between a and b」など日付を扱う場合には、 「#2005/01/01#」とし、型変換する必要があります。 以下が処理成功時のSQL文です。select * from 社員マスタ where 氏名 like '%浦%' and 性別 = 0 and 作成日 between #2005/01/01# and #2007/12/31#正直分かりづらいなぁ、と。
2009年9月17日木曜日
Java ==とequals()による初歩的問題について
今日のJavaの授業の終わりかけに、ちょっと困ったことが発生しました。 それは「Ifによる判断が、合っているはずなのに合わない」こと。 確かに、文字列一致の判断を行うために「==」で処理してるのになぁと、 しばらくソースを見直して、首をかしげてまた見直して・・・の繰り返し。 その時に、先生の一言でパッとみんな解けたわけですね。 「文字列一致の判断は、==ではなくてequals()。」 あぁなるほどな、と。ということで、下にまとめます。 今回はこちらのサイトを参考にさせていただきました。 Javaにおける文字／文字列の扱い方 - ITアーキテクト [IT Architect] 上リンクにあることをさっぱり書くと、 「==」は「同オブジェクト参照チェック」で、 「equals()」は「同格納値チェック」です。 「==」は、他言語と動作(というか判断基準)が違うので、注意が必要です。// それぞれに同じ"初期値"を与えた場合 String a1 = new String("abc"); String b1 = new String("abc"); System.out.println("それぞれに同じ\"初期値\"を与えた場合"); // == の場合 if ( a1 == b1 ) { System.out.println("◆==：True"); } else { System.out.println("◆==：False"); } // equals() の場合 if ( a1.equals( b1 ) ) { System.out.println("◆equals()：True"); } else { System.out.println("◆equals()：True"); } // ********************** // * 実行結果 // // それぞれに同じ"初期値"を与えた場合 // ◆==：False // ◆equals()：True // **********************この場合は、a1,b1共に「同じ値」が代入されているにもかかわらず、 Javaの判断としては、「違うオブジェクトを参照」している、と取られます。 その結果、「同じオブジェクトを参照しているか」チェックする「==」はFalse、 「同じ値かどうか」チェックする「equals()」はTrueとなります。// それぞれに同じ"オブジェクト"を与えた場合 String xy = new String("xyz"); String x1 = xy; String y1 = xy; System.out.println("それぞれに同じ\"オブジェクト\"を与えた場合"); // == の場合 if ( x1 == y1 ) { System.out.println("◆==：True"); } else { System.out.println("◆==：False"); } // equals() の場合 if ( x1.equals( y1 ) ) { System.out.println("◆equals()：True"); } else { System.out.println("◆equals()：True"); } // ********************** // * 実行結果 // // それぞれに同じ"オブジェクト"を与えた場合 // ◆==：True // ◆equals()：True // **********************このソースの場合、x1,y1は同じxyを参照しています。 よって、「==」でも「equals()」でもTrueが返されます。 今後かなり多用すると思うので、憶えておかないとですね。
2009年9月7日月曜日
iPhone Blogger投稿一覧に更新日表示
以前この投稿で作成した、 Blogger投稿表示一覧に更新日を付加して更新しました。 以下がそのページです。 ほるめすメモ帳inBlogger - 投稿一覧 iPhone、PCSafari、Firefoxでどうぞ。(IE6,7不可、IE8はリスト表示のみ)
更新日も記事の情報として、APIで取得できます。 var blogUpdated = post.getUpdated().getValue().getDate(); 実際には、以下のように出力されるので、少しいじる必要があります。 Sat Sep 05 2009 20:39:09 GMT+0900 上の「blogUpdated」はDate型なので、「toString()」で型変換し、 それを更に「.split(' ');」によって分割しています。 更に更に、曜日と月が英語のままではわかりづらいので、 Switch文でこつこつと日本語に入れ替えてあげ、 それを欲しい順番に連結して完成です。 <li class="group"></li> これで出来た日付を、 上のタグに入れそのまま使うと、全投稿に表示されるので、 「ループ初回or前投稿と日付が違う」場合に表示するようにしました。なお、あくまでも更新日なので、 下の記事が上の記事よりも新しい日付が出ますが、 そもそもFeedに作成日時が無いようなので、対応のしようがありません。 少し気持ち悪いですが、仕方ないです。 投稿にも、投稿された順番があるので、並べ替えずにこのままで良いです。 以下が今回のソースです。 <body>以下のソースが前回の投稿にあるので、それと照らし合わせて使用します。 ▼続きを読む/たたむ
2009年8月28日金曜日
iPhone BloggerAPI+iUIでBlogger投稿一覧表示
ひとまず表示は出来たのでメモ。 ほるめすメモ帳inBlogger - 投稿一覧 今回はiPhone、PCSafari、Firefoxで表示しました。 IE等はただリストで表示されるだけです。iPhoneで表示した場合です。 上バータイトルがすり切れているのは、ただ単に長すぎるからです。 実際の処理としては、BloggerAPIとiUIを混ぜ合わせただけなのですが、 色々と困ったことがあったのでまとめます。
document.createElementから、 必要なタグを生成して差し込もうとしましたが、 <ul>を差し込む場合、selected="true"が追加されませんでした。 objul:ulタグとすると、objul.selected="true";では処理がされなかったワケです。 原因はおそらく、ulタグにselectedが標準でない(iUI用に勝手に作成した)ためです。 仕方がないので<ul selected="true"></ul>とだけ元から作成しておき、 document.getElementsByTagName("ul").item(0)で呼び出しました。これはPCSafariで表示した図。 なぜか上バータイトルが表示されません。
これはFirefox。 下の方に表示されているのは「Firebug」と言われるデバッグツールですね。 今回JSで処理したので、実際に処理が通っているのか、 表示がきちんとされているのかをチェックするために使用しました。 投稿の一覧表示自体は出来ましたが、これを今度各投稿を表示しないといけないですね。 以前に試してみましたが、途中でエラーが発生してそのまま停止してました。 諸々起こりそうな問題としては、かなりロードに時間がかかるかもしれないこと。 当然今回と同じようにJSで投稿を「同htm内」にロードしないといけないので、 今回表示する際(iPhoneでは10秒ほど)以上に時間がかかります。 さらに僕はiPhone3Gなので、メモリを大量消費した際の他の動作も気になります。 と言うような感じで、実は思ったよりiPhoneへの負担の大きいページが完成しそうです。 以下が今回の<body>以下のソースです。 ▼続きを読む/たたむ
2009年8月27日木曜日
ある程度iUIを把握しました
まずは現物。 iUIテストページ iPhoneからで無くとも、SafariやFirefoxからもそれっぽいイメージを感じる事が出来ます。トップページはこんな感じ。 この画面に表示されているものが、ソースとして一括りで書かれている感じです。 上バー「iUIテストページ」は、以下のソースを入れておくと自動で生成されます。
<div class="toolbar"> <h1 id="pageTitle"></h1> <a id="backButton" class="button" href="#"></a> </div>上バー以下のソースはこちら。<ul id="home" title="iUIテストページ" selected="true"> <li class="group">テスト中ページ</li> <li><a href="#pages">ページテストまとめ</a></li> <li class="group">その他リンク等々</li> <li><a href="http://holmes21.blogspot.com/" target="_self">ほるめすメモ帳inBlogger </a></li> <li><a href="index.htm" target="_self">ほるメモいんぶろ - 投稿一覧</a></li> <li><a href="http://google.co.jp/" target="_self">Google</a></li> </ul>根本はリスト表示で、CSSでの整形のおかげでiPhoneらしいUIが表示されているのです。 <ul>にselected="true"を宣言しているものが、トップページ表示となります。 <li class="group"></li>が区切り(仕切り？セパレータ？)となり、 文章を含むことが出来ます。 リンクは2種類、ページ内部とそれ以外があります。 <li><a href="#pages"></a></li> →これが同htm内の他のグループへ遷移するための表示方法。 <li><a href="index.htm" target="_self"></a></li> →これがそれ以外、別htmや外部サイトへ遷移するための表示方法。 target="_selfが重要で、無いと何も起こりません。 中に<a>を含まないことで、普通の表示も出来ます。ここで説明を終えたので、以下はせっかく撮ったスクリーンショットを。
このパネル表示は上と違い、<div>で書かれます。
<div id="ppanel" class="panel" title="パネル表示"> <h2><div>を使用する。<br> class="panel"とする。<br> titleはページ名になる。</h2> </div>同じようにidにはグループ名を用意し、 classには"panel"とすることでパネル表示になります。 画面では背景が途中で切れていますが、iPhone側では全体に表示されます。 あと、ここでは使用していませんが、テキストボックスやON/OFFスイッチも配置できます。 iPhoneやSafari上では遷移されて表示されるものは、 全て1ファイルにまとめて書かないといけないことから、 普通に作成するサイト構成とはだいぶ変わっています。 同iUI内で表示したいモノはページ1つに全て収めないといけないので、 ブログページを作るのであれば初めから全てロードしておく必要があるわけですね。 なるほどなるほど。
2009年8月24日月曜日
iPhoneにスケールを合わせる1行
ひとまず、昨日使用出来るようになったusamimi.infoにindexページを作成。 本当にリンクのみですが、ひとまずはこのままで。 さてそのindexページですが、問題が一つ。 iPhoneで覗いて見ると、このように表示されます。ページの余白まで見てしまい、文字が小さく表示されます。 この小ささでは、ピンチイン(2本指で広げる動作)をしてズームしないと、見るのが難しいです。 そこでこの1行。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0 " />こちらのサイトを参考にしました。 meta の viewport - ZeBeVogue別館 <meta>タグでname「viewport」を宣言すると、iPhone専用になります。 widthで宣言している「device-width」は、携帯端末用に用意された値らしく、iPhoneでは320pxになります。 300など、普通の数値を割り当てても良いですが、ここでは手っ取り早くしています。 「initial-scale」は初期拡大率で、これもそれ以外でもOKです。 「maximum-scale」は最大拡大率、その反対の「minimum-scale」もありますが、 拡大を許可する「user-scalable」が0なので、拡大縮小が出来ません。 この1行を<head>内に書くだけで、見やすさがグンと上がります。もうこれだけで、リンク集とかに使えるさっぱりしたページになりますね。
2009年8月16日日曜日
iPhone用にOS判別
iUIを使用してページを構成すると、iPhoneからの見栄えが良くても、その他PCからの見栄えは悪くなります。 と言うより、iPhone用のページなのですからそれはそうなのですが。 ですので、iPhoneとそうでないものの判別をします。 以下を参考にしました。 Android携帯でブラウザから緯度経度情報を取得 - PHP,MySQL,Flexな日々＋イラストとか そして実際のページ。 ほるメモいんぶろ - OS判別 なるほど、ブラウザの情報からOSの情報を引き出すんですね。PCなどのiPhone以外からアクセスされると、「iPhoneではありません。」と表示され、
iPhoneの場合は、「iPhoneです。」と表示されます。 実際のコードは以下の通り。
<script type="text/javascript"> //モバイル端末の判定 var agent = navigator.userAgent; document.write( "ユーザエージェント：" + agent + "<br>" ); if( agent.search(/iPhone/) != -1 ){ document.write( "<span style='color:#0000ff;'>iPhoneです。</span>" ); }else{ document.write( "<span style='color:#ff0000;'>iPhoneではありません。</span>" ); } </script>
2009年8月15日土曜日
まずはBloggerAPIで投稿一覧表示
とりあえずは、元々のソースをほぼ全部コピーで、記事一覧を表示してみました。 ほるめすメモ帳inBlogger - 投稿一覧 レンタルサーバで大々的に広告が表示されていますが、ある程度カタチが出来たらサーバでも借りようかと思っています。 今は練習段階です。 BloggerAPIの使い方は、前のメモにあるリンクに書いてある通りです。<head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>ほるめすメモ帳inBlogger - 投稿一覧</title> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("gdata", "1.s"); </script> </head> <body> <div id="content"></div>4行目でGoogleがホスティングしているファイルを参照し、5～7行目で実際に呼び出しています。 11行目に、JavaScriptで生成したタグを入れるための領域「content」を用意しています。<script type="text/javascript"> var content = document.getElementById('content'); var bloggerService = new google.gdata.blogger.BloggerService('GoogleInc-jsguide-1.0'); var feedUri = 'http://holmes21.blogspot.com/feeds/posts/default'; var handleBlogPostFeed = function(postsFeedRoot) { var posts = postsFeedRoot.feed.getEntries(); var html = ''; html += '<dl>' + '<dt><strong>Blog:</strong> ' + '<a href="' + postsFeedRoot.feed.getLink('alternate').getHref() + '">' + postsFeedRoot.feed.getTitle().getText() + '</a></dt>'; html += '<dd><ul>'; for (var i = 0, post; post = posts[i]; i++) { var postTitle = post.getTitle().getText(); var postURL = post.getHtmlLink().getHref(); html += '<li><a href="' + postURL + '" target="_blank">' + postTitle + '</a></li>'; } html += '</ul></dd>'; content.innerHTML = html; }; var handleError = function(error) { content.innerHTML = '<pre>' + error + '</pre>'; }; bloggerService.getBlogPostFeed(feedUri, handleBlogPostFeed, handleError); </script>ここもほぼ元ソースそのまま。 一覧取得用のサービスを用意して、読みに行っています。 ここで一段落。 ちなみに、iPhoneっぽいページ表示をするためには、「iUI」というのが便利そうです。 iui - Project Hosting on Google Code iPhone 3G用のWebページを作る3 - ［JavaScript］All About それ以前に、iPhoneの解像度や特有の設定などがあるようなので、それを調べないといけないのですが。
2009年5月29日金曜日
PHP ページ内画像一括zip圧縮DL
お友達の胡瓜メモ帳: phpでURLから画像を一括ダウンロード・改とほぼ同じですが、こちらも授業で作成したのでメモ。 これだけの作業がグッとされると気分が良いですし、まるごとダウンロードって言うのがなかなかおいしい気がします。 まぁ、取るつもりの無かったものまで付加されますが。 作成するにあたっての参考ページは以下です。 PHP で zip 圧縮 ここにあるように、「phpMyAdmin」内のzip圧縮用ライブラリとダウンロードライブラリを使用しています。 こちらが現物です。 IEの場合は自動でテキストボックスまで移動されますが、他のブラウザでは広告が表示されると思います。 そのままどうぞスクロールしてみてください。 画像を一括ダウンロードしたいサイトのアドレスをそのままテキストボックスへ入れて「送信」すると、少しレスポンスは悪いですが「img[年月日_時分秒].zip」がダウンロードできます。 解凍するとサイトにある画像が全部入っているはずです。 以下はソースになりますので、見たい人だけどうぞ。 ▼続きを読む/たたむ
投稿
