(onload=function(){ var x22=String.fromCharCode(0x22); var x26=String.fromCharCode(0x26); var x3c=String.fromCharCode(0x3c); var x3e=String.fromCharCode(0x3e); var s=''; s += x3c+'textarea id='+x22+'ta'+x22+' onClick='+x22+'this.focus();this.select();'+x22+' '+x3e; s += 'ここにYoutubeの埋め込みコードをペーストし、必要に応じて各パラメータを変更し、ここをコピーしてアメブロで利用します。'; s += x3c+'/textarea'+x3e; s += x3c+'input id='+x22+'v'+x22+x3e; s += ' width='+x3c+'input id='+x22+'w'+x22+x3e; s += ' height='+x3c+'input id='+x22+'h'+x22+x3e; s += ' aspect='+x3c+'select id='+x22+'a'+x22+x3e; s += x3c+'option'+x3e+'16:9'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'4:3'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'custom'+x3c+'/option'+x3e; s += x3c+'/select'+x3e; s += x3c+'div class='+x22+'parameter'+x22+x3e; s += 'rel='+x3c+'select id='+x22+'p0'+x22+' name='+x22+'rel'+x22+x3e; s += x3c+'option'+x3e+'0 : 関連動画非表示'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'1 : 関連動画表示(default)'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'modestbranding='+x3c+'select id='+x22+'p1'+x22+' name='+x22+'modestbranding'+x22+x3e; s += x3c+'option'+x3e+'0 : YouTubeロゴ表示(default)'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'1 : YouTubeロゴ非表示'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'autoplay='+x3c+'select id='+x22+'p2'+x22+' name='+x22+'autoplay'+x22+x3e; s += x3c+'option'+x3e+'0 : 自動再生しない(default)'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'1 : 自動再生する'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'loop='+x3c+'select id='+x22+'p3'+x22+' name='+x22+'loop'+x22+x3e; s += x3c+'option'+x3e+'0 : 繰り返し再生しない(default)'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'1 : 繰り返し再生する'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'controls='+x3c+'select id='+x22+'p4'+x22+' name='+x22+'controls'+x22+x3e; s += x3c+'option'+x3e+'0 : コントロールバー非表示'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'1 : コントロールバー表示(default)'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'2 : コントロールバー表示'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'autohide='+x3c+'select id='+x22+'p5'+x22+' name='+x22+'autohide'+x22+x3e; s += x3c+'option'+x3e+'0 : オートハイドしない'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'1 : コントロールバーとシークバーをオートハイドする'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'2 : コントロールバーをオートハイドする(default)'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'fs='+x3c+'select id='+x22+'p6'+x22+' name='+x22+'fs'+x22+x3e; s += x3c+'option'+x3e+'0 : 全画面表示ボタン非表示'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'1 : 全画面表示ボタン表示(default)'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'showinfo='+x3c+'select id='+x22+'p7'+x22+' name='+x22+'showinfo'+x22+x3e; s += x3c+'option'+x3e+'0 : タイトルバー非表示'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'1 : タイトルバー表示(default)'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'vq='+x3c+'select id='+x22+'p8'+x22+' name='+x22+'vq'+x22+x3e; s += x3c+'option'+x3e+'highres : この動画の最高画質'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'hd1080 : 画質1080p HD'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'hd720 : 画質720p HD'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'large : 画質480p'+x3c+'/option'+x3e; s += x3c+'option selected'+x3e+'medium : 画質360p(default)'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'small : 画質240p'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'cc_load_policy='+x3c+'select id='+x22+'p9'+x22+' name='+x22+'cc_load_policy'+x22+x3e; s += x3c+'option'+x3e+'0 : 字幕OFF'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'1 : 字幕ON'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += 'iv_load_policy='+x3c+'select id='+x22+'p10'+x22+' name='+x22+'iv_load_policy'+x22+x3e; s += x3c+'option'+x3e+'1 : アノテーションOFF'+x3c+'/option'+x3e; s += x3c+'option'+x3e+'3 : アノテーションON'+x3c+'/option'+x3e; s += x3c+'/select'+x3e+x3c+'br /'+x3e; s += x3c+'/div'+x3e; document.getElementById('tool').innerHTML = s; document.getElementById('ta').onchange=function(){getdata();}; document.getElementById('w').onchange=function(){width();}; document.getElementById('h').onchange=function(){height();}; for (var i=0; i!=9; i++) document.getElementById('p'+i).onchange=function(){setparameter();}; function setparameter() { var p='', q, r, v; for (var i=0; i!=11; i++) { q = document.getElementById('p'+i); r = q.selectedIndex; if ( q.options[r].value.indexOf('(default)')==-1) { p += q.name+'='+q.options[r].value.split(' ')[0]+x26; } } v = ' src='+x22+'//www.youtube.com/embed/'+document.getElementById('v').value+p; q = x3c+'ifr'+'ame'; q += ' width='+x22+document.getElementById('w').value+x22; q += ' height='+x22+document.getElementById('h').value+x22; q += v.substr(0,v.length-1)+x22; q += ' frameborder='+x22+'0'+x22+' allowfullscreen'+x3e+x3c+'/ifr'+'ame'+x3e; q += x3c+'br'+x3e; q += 'この動画は'+x3c+'a target='+x22+'_blank'+x22+' href='+x22+'http://ameblo.jp/knife1968/entry-11745311098.html'+x22+x3e+'こちら'+x3c+'/a'+x3e+'でパラメータ設定しています。'; q += x3c+'br'+x3e; document.getElementById('ta').value = q; document.getElementById('view').innerHTML = q; } function getdata() { var w=0, h=0, v='', l=''; var t=document.getElementById('ta').value.split(' '); for (var i=0; i!=t.length; i++) { if (t[i].indexOf('width=')==0) w=t[i].match(/[0-9]+/); if (t[i].indexOf('height=')==0) h=t[i].match(/[0-9]+/); if (t[i].indexOf('src=')==0) { v=t[i].substr(t[i].lastIndexOf('/')+1,t[i].length-t[i].lastIndexOf('/')-2); if (t[i].indexOf('list=')!=-1) v += '?'+t[i].substr(t[i].indexOf('list='),t[i].length-t[i].indexOf('list=')-1)+x26; else v += '?'; } } document.getElementById('v').value=v; document.getElementById('w').value=w; document.getElementById('h').value=h; if (Math.round(w*9/16)==h) document.getElementById('a').selectedIndex=0; else if (Math.round(w*3/4)==h) document.getElementById('a').selectedIndex=1; else document.getElementById('a').selectedIndex=2; setparameter(); } function width() { var w=document.getElementById('w').value; switch ( document.getElementById('a').selectedIndex ) { case 0: document.getElementById('h').value=Math.round(w*9/16); break; case 1: document.getElementById('h').value=Math.round(w*3/4); break; } setparameter(); } function height() { var h=document.getElementById('h').value; switch ( document.getElementById('a').selectedIndex ) { case 0: document.getElementById('w').value=Math.round(h*16/9); break; case 1: document.getElementById('w').value=Math.round(h*4/3); break; } setparameter(); }})();
ここが変化しない環境は非対応です。
ここにYoutubeが表示されます。
Youtubeの埋め込みコードをコピーし、このページのテキストエリアにペーストする。
すると、video_id、width、heightがテキストエリアの情報から読み取られます。
その際、widthとheightからaspectを求めています。
aspectには、16:9、4:3、customを用意しました。
16:9や4:3を選んだ状態で、widthやheightのどちらかの値を変更すると、もう一方の値をそのアスペクト比で求めます。
customを選べば、他の値を変更しません。
因みにアメブロの記事の横幅一杯にしたい場合は、2カラムモードでは605px、3カラムモードでは405pxにwidthを設定すると良いと思われます。
他の、プルダウンメニューについては、変更して確認してみてください。
プレイリストも対応しました。
何か要望、質問、バグ等がございましたら、コメントでお願いします。