公式:
http://code.google.com/p/gwt-youtube-api/ GWT Youtube APIを使うと、GWTアプリにYoutubeプレイヤーや、Youtubeの検索結果を埋め込むことができます。 また、Youtubeプレイヤーを、再生・停止・移動したりできます。 GWT Youtube APIを導入私が試した段階では、1.0.2が最新版でした。ソースコード的にはもう少し進んでいるようです このページを参考に リストされているjarをすべてインストールします。 あとは、gwt.xmlに以下を追加すれば使えます。 <inherits name="com.google.gdata.YouTubeAPI"/>気がついたことプレイヤー触るなら以下必須 youTubeEmbeddedPlayer.setEnableJSAPI(true); シークできる時間がとても曖昧です。1秒単位でシーク(再生位置を移動)は不可能 せいぜい、最短で3秒ぐらいじゃないですかね。 Youtube 動画を開く場合のURLは、http://www.youtube.com/v/"+videoId getPlayer().loadMedia(url); http://www.youtube.com/watch?のURLを使う場合は、以下コードでやってるよう変換処理が必要、将来のバージョンで改善されるみたいですが プレイヤーのaddStateChangedHandlerの動かし方がよくわからなかった。 ユーザー少なそう。他の閉鎖されたプロジェクト見る限り、そのうちAPI、クローズされても不思議じゃない気がした。 使用例Chrome Web AppのループVideoプレイヤーですと以下のようになります。 YoutubeTest.java/* * Copyright (C) 2011 aki@akjava.com * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package com.akjava.gwt.youtube.client; import com.akjava.gwt.html5.client.HTML5InputRange; import com.akjava.gwt.html5.client.HTML5InputRange.HTML5InputRangeListener; import com.akjava.gwt.html5.client.extra.HTML5Builder; import com.akjava.gwt.lib.client.LogUtils; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.core.client.GWT; import com.google.gwt.event.dom.client.ClickEvent; import com.google.gwt.event.dom.client.ClickHandler; import com.google.gwt.user.client.Timer; import com.google.gwt.user.client.Window; import com.google.gwt.user.client.ui.Button; import com.google.gwt.user.client.ui.HorizontalPanel; import com.google.gwt.user.client.ui.Label; import com.google.gwt.user.client.ui.RootPanel; import com.google.gwt.user.client.ui.TextBox; import com.google.gwt.user.client.ui.VerticalPanel; import com.google.youtube.client.YouTubeEmbeddedPlayer; import com.google.youtube.client.event.YouTubeStateChangedEvent; import com.google.youtube.client.event.handler.YouTubeStateChangedHandler; /** * Entry point classes define <code>onModuleLoad()</code>. */ public class YoutubeTest implements EntryPoint { private int loopDuration=5; private int playIndex; private boolean paused=true; private YouTubeEmbeddedPlayer youTubeEmbeddedPlayer; private Label loopLabel; private Timer loopTimer; //int time; @Override public void onModuleLoad() { VerticalPanel panel=new VerticalPanel(); RootPanel.get("main").add(panel); HorizontalPanel loader=new HorizontalPanel(); panel.add(loader); final TextBox url=new TextBox(); url.setWidth("400px"); loader.add(url); Button loadBt=new Button("Load"); loader.add(loadBt); loadBt.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { doLoad(url.getText()); } }); url.setText("http://www.youtube.com/watch?v=pLFkxTI9fVs"); youTubeEmbeddedPlayer = new YouTubeEmbeddedPlayer("pLFkxTI9fVs"); youTubeEmbeddedPlayer.setWidth("640px"); youTubeEmbeddedPlayer.setHeight("384px"); youTubeEmbeddedPlayer.setLoop(true);//avoid stop youTubeEmbeddedPlayer.setEnableJSAPI(true); youTubeEmbeddedPlayer.setPlayerAPIId("myplayer"); panel.add(youTubeEmbeddedPlayer); HorizontalPanel hpanel=new HorizontalPanel(); hpanel.setVerticalAlignment(HorizontalPanel.ALIGN_MIDDLE); panel.add(hpanel); /* * cant back */ Button prev=new Button("Prev"); hpanel.add(prev); prev.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { playIndex--; if(playIndex<0){ playIndex=0; } int time=playIndex*loopDuration; int d=youTubeEmbeddedPlayer.getPlayer().getMediaDuration(); LogUtils.log("time:"+time); LogUtils.log("duration:"+d); if(time>d){//too over int mv=d/loopDuration; playIndex=mv-1; time=playIndex*loopDuration; } youTubeEmbeddedPlayer.getPlayer().setPlayPosition(playIndex*loopDuration); youTubeEmbeddedPlayer.getPlayer().pauseMedia(); updateLoopLabel(); } }); Button next=new Button("Next"); hpanel.add(next); next.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { playIndex++; int time=playIndex*loopDuration; int d=youTubeEmbeddedPlayer.getPlayer().getMediaDuration(); if(time>d){ playIndex--; time=playIndex*loopDuration; if(time>d){//too over int mv=d/loopDuration; playIndex=mv-1; time=playIndex*loopDuration; } } youTubeEmbeddedPlayer.getPlayer().setPlayPosition(time); youTubeEmbeddedPlayer.getPlayer().pauseMedia(); updateLoopLabel(); } }); Button playButton=new Button("Loop Play"); hpanel.add(playButton); playButton.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { startLoop(); } }); Button pauseButton=new Button("Pause"); hpanel.add(pauseButton); pauseButton.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { pauseLoop(); } }); Timer timer=new Timer(){ public void run(){//catching time is fine int position=youTubeEmbeddedPlayer.getPlayer().getPlayPosition(); LogUtils.log("current:"+position); } }; loopLabel = new Label("00:00-"+secToTime(loopDuration)); loopLabel.setWidth("100px"); hpanel.add(loopLabel); HTML5InputRange range=new HTML5InputRange(1,120,5); hpanel.add(HTML5Builder.createRangeLabel("Loop:", range)); hpanel.add(range); range.addListener(new HTML5InputRangeListener() { @Override public void changed(int newValue) { loopDuration=newValue; updateLoopLabel(); } }); } protected void doLoad(String text) { if(text.isEmpty()){ return; } String url=null; if(text.startsWith("http://www.youtube.com/v/")){ url=text;//dont check parameter }else if(text.startsWith("http://www.youtube.com/watch?")){ String videoId=null; String p=text.substring("http://www.youtube.com/watch?".length()); String[] params=p.split("&"); for(int i=0;i<params.length;i++){ String key_value[]=params[i].split("="); if(key_value.length==2){ if(key_value[0].equals("v")){ videoId=key_value[1]; break; } } } if(videoId!=null){ url="http://www.youtube.com/v/"+videoId; } } if(url!=null){ youTubeEmbeddedPlayer.getPlayer().loadMedia(url); }else{ Window.alert("URL must be start with http://www.youtube.com/watch?v="); } } private void updateLoopLabel(){ loopLabel.setText(secToTime(playIndex*loopDuration)+"-"+secToTime((playIndex+1)*loopDuration)); } private String secToTime(int second){ int m=second/60; int s=second%60; String mv=""+m; if(mv.length()<2){ mv="0"+mv; } String sv=""+s; if(sv.length()<2){ sv="0"+sv; } return mv+":"+sv; } public void pauseLoop(){ paused=true; if(loopTimer!=null){ loopTimer.cancel(); } final int time=playIndex*loopDuration; youTubeEmbeddedPlayer.getPlayer().setPlayPosition(time); youTubeEmbeddedPlayer.getPlayer().pauseMedia(); } public void startLoop(){ paused=false; final int time=playIndex*loopDuration; LogUtils.log("start:"+time); youTubeEmbeddedPlayer.getPlayer().setPlayPosition(time); youTubeEmbeddedPlayer.getPlayer().playMedia(); if(loopTimer!=null){ loopTimer.cancel(); } loopTimer = new Timer(){ public void run(){ if(!paused){ youTubeEmbeddedPlayer.getPlayer().setPlayPosition(time); youTubeEmbeddedPlayer.getPlayer().playMedia(); startLoop(); } } }; loopTimer.schedule(loopDuration*1000); } } |
GWT >
GWT Youtube API
公式:
http://code.google.com/p/gwt-youtube-api/ GWT Youtube APIを使うと、GWTアプリにYoutubeプレイヤーや、Youtubeの検索結果を埋め込むことができます。 また、Youtubeプレイヤーを、再生・停止・移動したりできます。 GWT Youtube APIを導入私が試した段階では、1.0.2が最新版でした。ソースコード的にはもう少し進んでいるようです このページを参考に リストされているjarをすべてインストールします。 あとは、gwt.xmlに以下を追加すれば使えます。 <inherits name="com.google.gdata.YouTubeAPI"/>気がついたことプレイヤー触るなら以下必須 youTubeEmbeddedPlayer.setEnableJSAPI(true); シークできる時間がとても曖昧です。1秒単位でシーク(再生位置を移動)は不可能 せいぜい、最短で3秒ぐらいじゃないですかね。 Youtube 動画を開く場合のURLは、http://www.youtube.com/v/"+videoId getPlayer().loadMedia(url); http://www.youtube.com/watch?のURLを使う場合は、以下コードでやってるよう変換処理が必要、将来のバージョンで改善されるみたいですが プレイヤーのaddStateChangedHandlerの動かし方がよくわからなかった。 ユーザー少なそう。他の閉鎖されたプロジェクト見る限り、そのうちAPI、クローズされても不思議じゃない気がした。 使用例Chrome Web AppのループVideoプレイヤーですと以下のようになります。 |