YouTube Player API
class player{
public function player(){
if(array_key_exists('t',$_REQUEST)
and array_key_exists('l',$_REQUEST)
and array_key_exists('url',$_REQUEST)){
$this->urltime = $_GET['t'];
$this->playlist = $_GET['l'];
$this->yturl = $_GET['url'];
$this->yturl_3item = $this->para($_GET['url']);
$temp = array();
foreach ($this->yturl_3item as $val){
$temp[count($temp)] = sprintf("'%s'",$val);
}
$this->list_item = '['.implode(",",$temp ).']';
$this->you_player_api($this->playlist,$this->yturl_3item[0],$this->list_item);
}else{
$this->you_player_api('PLvswSo32Xlu_tBfEDzpuFQ-lUFP1_Aq5I','_sQSXwdtxlY','["GLyYUyVH2PI","RgKAFK5djSk"]');
}
}
public function player_area(){
$div_area = sprintf('<div id = "player_area" >
<div id = "player"></div>
</div>
');
echo $div_area;
}
public function debug_show(){
echo '<pre>';
echo $this->urltime;
echo '<br>';
echo $this->playlist;
echo '<br>';
echo $this->yturl;
echo '<br>';
print_r( $this->yturl_3item);
echo $this->yturl_3item[0];
}
public function para($url){
$temp=array();
$temp2=array();
$temp=explode('=',$url);
$temp2=explode('|',$temp['1']);
return $temp2;
}
public function you_player_api($playlist,$videoid,$array_list){
$player = sprintf("
<script>
var tag = document.createElement('script');
tag.src = 'https://www.youtube.com/iframe_api';
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
var playlist = '%s';
var videoid = '%s';
var array_list = %s;
var h = '240';
var w = '320'
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: h,
width: w,
videoId: 'CNNDRO3imrs',
playerVars:{
'controls':'1',
'disablekb':'0',
'playsinline':'0'
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange,
'onError':onPlayerError
}
});
}
function onPlayerReady(event) {
//event.target.cuePlaylist({list:'PLvswSo32Xlu9BOn94xy-Xd_mTsMIny639'});
var j = event.target.cuePlaylist({list:playlist});
console.log (j.length);
if(j.length == 0){
one_list_play(event.target);
}
}
function onPlayerStateChange(event) {
console.log('onPlayerStateChange');
console.log(player.getAvailableQualityLevels());
console.log(player.getPlaybackQuality());
event.target.setPlaybackQuality('tiny');
if(event.target.getPlayerState() === 5 ){
event.target.setSize(w,h);
var list_items = event.target.getPlaylist();
var list_index = list_items.indexOf(videoid);
if(list_index >-1 ){
//event.target.loadPlaylist({list:playlist,index:list_index,startSeconds:3});
event.target.playVideoAt(list_index);
}
if(list_index == -1 ){
//event.target.loadPlaylist({playlist:array_list});
one_list_play(event.target);
}
}
}
function one_list_play(event){
console.log('000111');
event.loadPlaylist({playlist:array_list});
}
function onPlayerError(event){
event.target.nextVideo();
console.log('onPlayerError');
}
</script>"
,$playlist,$videoid,$array_list);
echo $player;
}
}
2015年10月26日月曜日
2015年10月24日土曜日
indexOf で配列に要素が含まれるか判定
indexOf で配列に要素が含まれるか判定
function onPlayerStateChange(event) {
if(event.target.getPlayerState() === 5 ){
var list_items = event.target.getPlaylist();
var list_index = list_items.indexOf(videoid);
event.target.cuePlaylist({list:playlist,index:list_index});
}
}
要素が含まれない場合 -1
function onPlayerStateChange(event) {
if(event.target.getPlayerState() === 5 ){
var list_items = event.target.getPlaylist();
var list_index = list_items.indexOf(videoid);
event.target.cuePlaylist({list:playlist,index:list_index});
}
}
要素が含まれない場合 -1
ラベル:
Javascript,
YouTube Player API
2015年10月21日水曜日
cuePlaylist loadPlaylist 動画 ID と配列の利用について
cuePlaylist loadPlaylist 動画 ID と配列の利用について
function onPlayerReady(event)
event.target.loadPlaylist({playlist:['0rSPuLyKSGc','hXI8RQYC36Q','xxsDx55Nqfc']});
event.target.loadPlaylist({list:'PL5l9iRZwq9Ul6s-10DMgPoc8sY3ukgbFz'});
}
複数動画のIDでの配列を利用する場合、 パラメータは playlist を利用します。
動画リストのIDを利用する場合、 パラメータは list を利用します。
微妙に違いますが間違えると動画が再生されません。要注意です。
function onPlayerReady(event)
event.target.loadPlaylist({playlist:['0rSPuLyKSGc','hXI8RQYC36Q','xxsDx55Nqfc']});
event.target.loadPlaylist({list:'PL5l9iRZwq9Ul6s-10DMgPoc8sY3ukgbFz'});
}
複数動画のIDでの配列を利用する場合、 パラメータは playlist を利用します。
動画リストのIDを利用する場合、 パラメータは list を利用します。
微妙に違いますが間違えると動画が再生されません。要注意です。
ラベル:
YouTube Player API
2015年10月15日木曜日
YouTube IFrame API リンク
YouTube IFrame API リンク
iframe 組み込みの YouTube Player API リファレンス
https://developers.google.com/youtube/iframe_api_reference
iframe 組み込みの YouTube Player API リファレンス
https://developers.google.com/youtube/iframe_api_reference
ラベル:
YouTube Player API
2015年10月8日木曜日
CSS
CSS
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
font-weight: normal;
font-style: normal;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
font-weight: normal;
font-style: normal;
}
2015年10月7日水曜日
CSSレイアウトを確認するために Javascript
ホームページのスタイルシート、レイアウトを確認するために Javascript です。
Chrome コンソールで利用します。CSS勉強のためです。
function s_new(){
this.div = function(){
eng("div");
}
this.ul = function (){
eng("ul");
}
this.li = function (){
eng("li");
}
this.user = function(e){
eng(e);
}
function eng (e){
var div = document.getElementsByTagName(e);
if (div.length > 0){
for(var a = 0 ; a < div.length; a++){
//div[a].style.borderStyle="solid";
//div[a].style.borderWidth="1px";
div[a].style.boxShadow ="2px 2px 6px";
}
}else{
console.log("none");
}
}
}
var x = new s_new;
Chrome コンソールで利用します。CSS勉強のためです。
function s_new(){
this.div = function(){
eng("div");
}
this.ul = function (){
eng("ul");
}
this.li = function (){
eng("li");
}
this.user = function(e){
eng(e);
}
function eng (e){
var div = document.getElementsByTagName(e);
if (div.length > 0){
for(var a = 0 ; a < div.length; a++){
//div[a].style.borderStyle="solid";
//div[a].style.borderWidth="1px";
div[a].style.boxShadow ="2px 2px 6px";
}
}else{
console.log("none");
}
}
}
var x = new s_new;
例
ElementsByClassName
function eng (e){
var div = document.getElementsByClassName('a');
if (div.length > 0){
for(var a = 0 ; a < div.length; a++){
div[a].style.borderStyle="solid";
div[a].style.borderWidth="1px";
}
}else{
console.log("none");
}
}
eng();
2015年9月26日土曜日
覚えておく
覚えておく
function mobile_menu(){
var get = document.getElementsByClassName("menu_item");
for(var i in get){
if(get[i].childNodes){
console.log(i);
get[i].style.display="none";
}
}
}
この場合、if(get[i].childNodes) は必須な判断になります。そうしないと、
get の length、item、namedItem は除外されません、エラーになります。
function mobile_menu(){
var get = document.getElementsByClassName("menu_item");
for(var i in get){
if(get[i].childNodes){
console.log(i);
get[i].style.display="none";
}
}
}
この場合、if(get[i].childNodes) は必須な判断になります。そうしないと、
get の length、item、namedItem は除外されません、エラーになります。
登録:
投稿 (Atom)