AOLVS Ajax APIの埋め込みタグを使って検索結果を簡単に表示する

「AOLVS Ajax APIを使ってビデオの主要なデータを表示してみる」までに作ったAjaxアプリは、AOLVS.getVideosメソッドの検索結果の項目からHTMLを組み立てて表示しています。その検索結果には、ビデオのURLやタイトル、概要文といった様々な項目が含まれていました。ただ実際のところ、様々な項目があったとしても、検索結果として表示するスタイルや項目は限られるのでは?という気もします。

AOLVS.getVideosメソッドには、あらかじめ決まったスタイルと項目で検索結果をビジュアルに表示する機能も備わっています。3通りの方法がありますので、今話題の「PS3」をキーワードにそれぞれ試してみました。

AOLVS.VideoSet.embedTag

検索結果の「AOLVS.VideoSet.embedTag」を使うと、その検索結果をFlash Playerを使ってバー表示できます。↓こんな感じです。

View example

「AOLVS.VideoSet.embedTag」はFlash Playerを埋め込むHTMLタグを表します。Flash Playerの中からビデオを検索して表示していると思われます。残念ながら日本語のクエリは機能しませんでした。AOLVS Ajax API自体は日本語のクエリを扱えるので、Flashアプリケーションに原因があるのかもしれません。

function update() {
  document.getElementById('results').innerHTML = 
    AOLVS.VideoSet.embedTag;
}

AOLVS.VideoSet.Video[n].videoResultembedTag

検索結果の「AOLVS.VideoSet.Video[n].videoResultembedTag」を使うと、それぞれの検索結果をFlash Playerを使って表示できます。↓こんな感じです。

 
View example

「AOLVS.VideoSet.Video[n].videoResultembedTag」はFlash Playerを埋め込むHTMLタグを表します。Flash Playerの中からビデオの主要データを取得して表示していると思われます。

function update() {
  var html = '<ol>';
  for (var i=0; i<AOLVS.VideoSet.totalResultsReturned; i++) {
    var video = AOLVS.VideoSet.Video[i];
    html += '<li>';
    html += video.videoResultembedTag;
    html += '</li>';
  }
  html += '</ol>';
  document.getElementById('results').innerHTML = html;
}

AOLVS.VideoSet.Video[n].videoPlayerembedTag

検索結果の「AOLVS.VideoSet.Video[n].videoPlayerembedTag」を使うと、それぞれの検索結果のビデオをFlash Playerを使ってその場で再生できます。↓こんな感じです。

View example

「AOLVS.VideoSet.Video[n].videoPlayertembedTag」はFlash Playerを埋め込むHTMLタグを表します。ただ、ビデオ(ビデオの配信元?)によってはHTMLタグがなくundefinedとなるケースがありました。

function update() {
  var html = '<ol>';
  for (var i=0; i<AOLVS.VideoSet.totalResultsReturned; i++) {
    var video = AOLVS.VideoSet.Video[i];
    html += '<li>';
    html += video.videoPlayerembedTag;
    html += '</li>';
  }
  html += '</ol>';
  document.getElementById('results').innerHTML = html;
}

しかし、この3通りの方法はどう使えばいいのだろう。。。