2010年5月25日火曜日

Google Font API が出たみたい

どうやら、フリーのフォントをブラウザ上で自由に使用できるようになる、
「Google Font API」が発足したみたいです。

現在は日本語フォントが無いようだけど、出てきたら楽しくなりそうだなぁ。

あと、「Google Font API」で使用できるフォント一覧、さらに実装するソースは、
「Google Font Directory」で参照できます。

2010年2月9日火曜日

SleipnirからChromeへ乗り換えるための必須機能まとめ

前からというかずっとなのですが、
やはりSleipnirはブラウザとしては「重い」ものに分類されるのだと思います。

IE基盤のタブブラウザとしては多機能で使いやすいものの、
IE基盤だからこそのロードの重さや、Flashが多用されているページへの切り替えの重さが目立ちます。

その中、ようやく拡張機能「Chrome Extensions」が正式に対応したChrome4が来たわけですね。
公開された当時から軽い動作だったので、サブブラウザとして使用していました。

というわけで、先週頃から「SleipnirからChromeへ乗り換えるための機能」を考えていたわけです。
今Sleipnirで使用している機能がChromeで充分に満たせるものであるなら、
いっそのこと乗り換えてしまえば良いんじゃないか、ということです。

これからChromeに乗り換える上で重要となる機能は、以下のようなものです。
  • マウスジェスチャ([右クリック+ホイール]でタブ切り替えも含む)
  • ブログ用ブックマークレット代替(簡易リンクタグ生成など)
  • RSS Reader(記事タイトルから本ページに飛べればOK)
  • グループ機能(お気に入りを一度にまとめて表示)
  • ページキャプチャ(ページ内をD&Dでキャプチャ出来ればなお良し)
  • IEのページを表示(Chromeとの動作の差をみるため)
あくまでも個人的なものですが。 素直に、Sleipnirでの動きをそのままChromeに持ってこられたらよりGoodです。 調べて探して学校で動作してみた結果、設定具合でそのまま持ってこられるもののほかにも、 「Sleipnirでやるよりも便利じゃん!」っていうのもあります。 また、想像していたものが見付からなかったりするので、 そういうものは自分で作ったりも出来たらなぁとか思ってます。

2009年11月21日土曜日

GoogleのテレビCMなんてあったんですね

今日初めて観ました。
テレビでいきなり検索フォームが表示されたので、びっくりしました。

YouTube - Google 検索ストーリー:おとなになったら


インターネットを利用する人はすでに知られているはずだし、
利用しない人には何のことか分からないだろうし、誰をターゲットにしてるんでしょう?

2009年11月16日月曜日

Analytics Data Export API を使用してデータ表示

Googleの認証サーバが返答しないようですでも書いていたので、
事後報告のようなカタチになりましたが、
ひとまず最低限したいことが出来たのでまとめます。

「Analytics Data Export API」とは、Google Code Labsの一つで、
Google AnalyticsというWeb解析サービスから、
自分のサイトの解析情報を引っ張ってくることが出来ます。

「Analytics Data Export API」を利用して、
実際に作成したページはこちら。
Analytics Data Export API でデータ表示
そもそも、Analyticsを利用していない人には関係のないページです。


ページを開くとこんな感じ。
まずは、Googleのアカウントへログインし、
「このページにGoogleアカウントの情報を渡しても良い」というような、
「認証」が必要になります。
そのまま「Google Analyticsへ認証する」を選択。


ログインが済んでいない場合は、ログイン画面が表示されます。
その後に、先ほどの「認証」が表示され、「アクセスを許可」します。


「認証」が終わると、元のページへ戻ります。
Analyticsから情報を取得するには、そのサイトの「テーブルID」が必要です。
色々と表示されますが、「アカウントデータ取得」をクリックし、
Analyticsに登録しているサイトの一覧を表示します。
ここでエラーが発生する場合は、Analyticsからサイト一覧が取得出来ない、
すなわちAnalyticsを利用していないアカウントです。

サイト一覧を取得出来た場合は、テーブルIDをクリックすることで、
上の欄にテーブルIDがコピーされます。


あとは、それぞれの「レポートデータ取得」をクリックすることで、
説明にあるデータを一覧で表示します。


本当は、
「Visualization API」のTableも組み合わせて表示しようと思ったのですが、
Firefoxで表示出来て、それ以外のブラウザではエラーが発生するという、
不思議な現象に陥ったので、一度ロールバックしました。
また、「Visualization API」の色々なチャートを利用すれば、
見やすく表示出来そうなので、触ってみたいですね。

ちなみに、
Data Feed Query Explorer - Google Analytics
というモノが存在します。
認証した後、表示したい対象とテーブルIDを入れると、
同じようにデータを表示することが出来ます。
それじゃ、作る意味なくなっちゃうなぁ。

2009年11月12日木曜日

Googleの認証サーバが返答しないようです

※追記:2009/11/13の朝10時の時点で復活していました。
昨日から「Google Analytics Data Export API」を利用して、
サイトの解析情報を取得しようとしています。
Analytics Data Export API でデータ表示

今日の昼頃も認証を済ませてデータ表示出来ていたのですが、
ついさっき実行してみると、正常に動きませんでした。

ひとまずよく分からないので、Firefoxの「Firebug」を利用して、
接続情報を覗いて見ると、以下のようなエラーが発生していました。
「Could not sign in, invalid response from server.
  Please try again.」
エラー元はこの行。
「Ye[t].Ps=function(a,d,e)
  {if(!e||!e[Za]||...][Ja](d,""),h=a[Ja](d,"");return e==h};\n」

エラーを読む分には、どうやらサーバからの返答が無いみたいです。
さっきまでは動いていたのですから、本当にサーバ側の問題だと思いたいですね。

2009年11月10日火曜日

Google Code Labsは発展途上だったんですね

今日初めて知りました。
Googleってどこまで成長したら尽きるんだろうと思います。

Google Code Labs - Google Code
というか、使用していたBloggerAPIはLabsの一員なので、
まだまだ成長する可能性を残しているってことなのかー。

って、クーポンフィードってなんなの?

デベロッパー ガイド - Google AJAX API - Google Code
「Google.load()」時のオプションが書かれていますね。
なるほど、まとめてロードも出来るみたい。

サイト ディレクトリ - Google Code
ここでも一覧で見ることが出来ます。

2009年10月21日水曜日

Googleの「Table」を使ったブログ投稿一覧

※補足:文章にまとめる能力が枯渇しているため、非常に読みづらいです。Google Visualization API」がすごいと聞いたので、
せっかくだからと投稿一覧を表示してみることにしました。
実際に使用したのは、「Google Visualization API」のTableです。
以下を参考にしました。


まずは、できあがったものですね。
ほるメモいんぶろ - 投稿一覧
ブラウザ内に文字が大量に表示されるので、
文字羅列アレルギーの方は注意して下さい。

内容としては、先日iPhone用の一覧を作成した時にまとめた、
【まずはBloggerAPIで投稿一覧表示】
【iPhone Blogger投稿一覧に更新日表示】
を、バージョンアップしたような感じになります。


忘れそうになるので、「Blogger API」から取得出来るデータをまとめます。
基本的には、Google GData APIの「google.gdata.blogger」にあるものは、
全て取得出来るはずです。
ただ、試してみた時に取得出来ないもの(カテゴリなど)もありました。
それに関しては、ただ単に僕が把握しきれていない上、
記述ミスの可能性もあるので、一概にそうとは言い切れません。
今回取得出来たデータは以下の様なものです。
  • getUpdated().getValue().getDate(); :更新日時
  • getTitle().getText(); :投稿タイトル
  • getHtmlLink().getHref(); :投稿アドレス
  • getContent().getText(); :投稿内容
上の項目で取得出来る更新日時について。 iPhone用一覧を作成した時に、更新日時を日本風に書き換えましたが、 IEではうまく処理されずに、 「23:52:20/09/30(水) UTC+0900」のような不思議なカタチになります。 それは、ブラウザごとの更新日時の取得内容が異なるためです。 iPhone,Safali,Firefoxなどの、 「Tridentエンジン」を使用していないブラウザの場合は、 「Sat Oct 17 2009 22:34:27 GMT+0900」と取得し、 IEでは「Sat Oct 17 22:34:27 UTC+0900 2009」というように、 項目を取得する順番が入れ替わってしまいます。 対処は・・・どうしようかなぁ。 するなら、ブラウザ判別して処理を分けるぐらいしか思いつかないです。 取得した投稿内容について。 iPhoneのあれの時には使用していませんでしたが、 実はリファレンスをちゃんと読めば載っていたんですね。 ひとまず引っ張ってくることには成功しましたが、問題点が。 HTMLで戻ってくるのは嬉しいのですが、 <pre></pre>で囲って投稿を書いているおかげで、 各行に改行が挿入されないのです。 その結果、改行要素が含まれるタグ以外では改行されずに、 横に長々と文章が表示されるようになります。 ページ内で表示する際には、途中で折り返す処理が必須になります。 「Table」の初期ソートについて。 参考元サンプルをそのまま使うだけでは、 初期表示の際にどの列もソートされていない状態です。 初期表示の際にソートする場合には、 テーブル領域にデータを反映する際にパラメータを渡すことで行えます。
visualization.draw(data,
       {showRowNumber: true
        , sortColumn:0
        , sortAscending:false
        , cssClassNames: {
          tableCell: 'myVtd',
          headerCell: 'myVhtd'
        }
      });
これに関しては、以下のドキュメントに詳しく書かれています(英語)。 Visualization: Table - Google Visualization API - Google Code

2009年10月17日土曜日

「Google Chrome Frame」って何なのよ

GoogleのAPIを試せる「AJAX APIs Playground」へ久々に行ってみたものの、
下のような警告をされました。

つまりは、「そろそろIEに対応できないので、プラグインを入れろ」と。

じゃあ「Google Chrome Frame」は何者なの?と。

さっぱり書くなら、指定されたmetaタグが埋め込まれているページを、
Chromeと同じように動作表示する、ということでいいのかな?
直接的に、GoogleのAPIやHTML5の技術に触れられるという感じ?

それなら入れておいて損はしないんだろうなぁ、と思うけれど、
否定的な意見もあるみたいで。

プラグイン作動によるセキュリティの問題や、
ブラウザ自体を否定する様な扱いだ、というような感じ。

結局、IEを使い続けるかどうかはユーザ次第で、
ユーザがストレス無く新技術に触れられるのなら良いのかなぁとは思います。
ひとまず入れておくことにします。

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月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の解像度や特有の設定などがあるようなので、それを調べないといけないのですが。

BloggerAPIメモ

参考にするべきであろうリンク等々まとめますね。
Developer's Guide: JavaScript - Blogger APIs - Google Code
リファレンス google.gdata.blogger

GoogleAPI試用ページ AJAX APIs Playground

前の記事の後に少し検索してみると、こんな記事を発見。
ASCII.jp:Google APIがブラウザーで試し放題!

なんとも、Google自身がAPIを試用するためのページを作っているというのです。
AJAX APIs Playground

少しだけ試してみました。

ページを開いて左上「Pick Sample」の中の「Blogger API」を選択。
さらにその内部「Blogs / List Blogs」で、Bloggerの記事一覧サンプルを開きます。
ページ下「Output」、右上「Edit Code」の内容が切り替わるので、実際に書き換えてみます。

「Edit Code」内17行目に、Bloggerのフィードのアドレスの変数が定義されているようなので、このブログのフィードである「http://holmes21.blogspot.com/feeds/posts/default」と入れ替えて「Output」右の「RunCode」で実行します。

すると、「Output」でこのブログの記事一覧が表示されます。

これを活用すれば何とはなしに出来る気がしてきました。
流石Google、いい仕事してますね。

Blogger用APIがあるらしい

iPhoneにBlogPressというBlogger用アプリがあることから、薄々は感づいてはいたのですが、本当にあったんですね。
Blogger Data API - Google Code
GoogleCodeの一環にあるものですが、日本語でのサンプルやリファレンスが作られていないので、使うには至難の業かも。

そもそも探してみた理由は、iPhone用のこのブログのページを作りたいため。
iPhoneで表示すると、記事一覧が表示され閲覧できる、そんなページが作りたいのです。
iPhoneから覗く時に、JS処理が多い記事(SyntaxHighlighter表示)や画像が大量にある記事などは、CPU処理が追いつかず、仕舞いにはSafariがダウンするのです。

どうせiPhoneを使っているのだから、iPhone使用者に還元されることをしてみたいものです。