MusicSerch

2007年10月 4日 04:24 Mutsuo Gamo | 個別ページ | コメント(0) | トラックバック(0)

Wacca楽曲を検索するウィジット。

キーワードによる楽曲の検索結果をカバーイメージのサムネイルで表示します。

検索結果をクリックすると、プレーヤーが起動し、再生します。

<h3 class="widget-header">MusicSearch</h3>
<div class="widget-content">
  
 <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.2.2/build/container/assets/container.css">   

<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/yahoo-dom-event/yahoo-dom-event.js"></script>

<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/connection/connection-min.js"></script>

<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/animation/animation-min.js"></script>

<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/container/container-min.js"></script>

<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/container/container_core-min.js"></script>
<link type="text/css" rel="stylesheet" href="http://media.g-poket.com/css/AquaSkin.css">

var wpageCount=1;
var off = 10;

function wsearch( key,lim,off ) {

var keyword ='?keyword='+encodeURI(key);
	var limit='&limit='+ lim;
	var offset='&offset='+off;

var url = 'http://www.g-poket.com/php/wacca/wmjsonp.php'+keyword+limit+offset;
	var script  = document.createElement( 'script' );
	script.type = 'text/javascript';
	script.src  = url;
	document.body.appendChild( script );
};

function waccaCallback( data ) {

var res="";
   	var ele = document.getElementById('result_wacca');
 
	if(!data){
		res = '見つかりませんでした。';
	    	ele.innerHTML = res;
		return;
	}

for (i=0;i<data.length;i++) {
		var music = data[i];

var image = music.img_url;
		var simage = music.img_thumb_url;
		var mp3 = music.mp3_url;
		var stitle = music.song_title;
		var sid = music.song_id;

res += '<img id="'+sid+'" src="'+simage+'" border="0" alt="'+stitle+'"';
		res += ' onclick="wpanelinit(this,';
		res += '\''+ mp3 + '\',';
		res += '\''+ stitle +'\')" width="75" height="56"/>';

}

ele.innerHTML = res;

}

function wPrevPage(){

if(wpageCount > off ) {
		wpageCount=wpageCount- off;
	}else wpageCount=1;
	
	wsearch(document.getElementById('key').value,off,wpageCount)

}

function wNextPage(){

wpageCount=wpageCount+off;
	wsearch(document.getElementById('key').value,off,wpageCount)
}

function wpanelinit(obj,mp3) {

YAHOO.util.Event.addListener(obj.id, "click", YAHOO.wacca.container.panel.show, YAHOO.wacca.container.panel, true);
	var mp3set ='http://g-poket.com/js/FMP3.swf?mp3='+mp3+'&action=play&title='+obj.alt+'&color=EDEDED&loop=yes&lma=yes&textcolor=000066';
	var embed='<embed src="'+mp3set+'" type="application/x-shockwave-flash" wmode="transparent" width="300" height="80"></embed>';

YAHOO.wacca.container.panel.setHeader('<div class="tl"></div><span>'+obj.alt+'</span><div class="tr"></div>');

YAHOO.wacca.container.panel.setBody(embed);
	YAHOO.wacca.container.panel.setFooter('<span><a href="http://wacca.tv/help/api" target="_blank">wacca</a></span> <span>developed by <a href="http://blogsquare256.blog85.fc2.com/" target="_blank">遊ぶブログ</a></span> <span><a href="http://media.g-poket.com/" target="_blank">メディアサーチ</a></span>');
	YAHOO.wacca.container.panel.render(document.body);

}
</script>

YAHOO.wacca.container.panel = new YAHOO.widget.Panel("panel", {  fixedcenter:true,width:"310px", visible:false, constraintoviewport:true} );

}
YAHOO.util.Event.addListener(window, "load", init);
</script>

</div>
<div id="result_wacca"><span style="font-size:8px;">developed by <a href="http://blogsquare256.blog85.fc2.com/" target="_blank">遊ぶブログ</a></span></div>
</div>

トラックバック(0)

このブログ記事を参照しているブログ一覧: MusicSerch

このブログ記事に対するトラックバックURL: http://www.g-poket.com/mt4/mt-tb.cgi/548

コメントする

このページは、Mutsuo Gamoが2007年10月 4日 04:24に書いたブログ記事です。

ひとつ前のブログ記事は「レシピBar」です。

次のブログ記事は「Yahoo!動画検索」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

MusicSerch

カテゴリ:

タグ:

トラックバック(0)

コメントする

このブログ記事について

YouTubu SS

ゲームコーナーPlus

iTunes Bar J

レシピBar

今日の献立

Google Video Search

検索

YouTube検索

MusicSearch

YouTubeLite

グルメランキング

12星座ランキング