気が向いたら何か書くtetのブロマガ

備忘録:HTA(HTMLアプリケーション)で自作PC関係のUstream Playerを作ってみた

2013/03/31 02:14 投稿

  • タグ:
  • HTA
  • Ustream
  • Ust
  • HTML
  • Script
  • Source
  • ソース
■備忘録:HTA(HTMLアプリケーション)で自作PC関係のUstream Playerを作ってみた

1:テキストファイルにコードをコピペして保存。
2:ファイル名の拡張子をhtaに変更(例:自作PC関係のUstreamPlayer.hta)
3:ファイルをダブルクリックで実行


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=Shift-JIS" http-equiv=Content-Type>
<title>Ustream 自作PC Player</title>
<script type="text/javascript">
<!--
var channelURL = 'http://www.ustream.tv/flash/live/'; //UstreamチャンネルURL初期値
var ustreamTag = ''; //Ustream呼び出すタグ初期値
var mainMenuTag = ''; //番組リスト初期値

//設定変更可能箇所
var windowWidth = 512; //ウインドウ横幅初期値
var windowHeight = 200; //ウインドウ縦幅初期値
var frameWidth = 12; //ウィンドウフレーム横幅初期値:デスクトップテーマで異なるかも。
var frameHeight = 26; //ウィンドウフレーム縦幅初期値:デスクトップテーマで異なるかも。
var contentWidth = 320; //コンテンツ横幅初期値320
var contentHeight = 180; //コンテンツ縦幅初期値180
var htmlVer = 4; //HTML5非対応は4以下に設定※HTAが非対応ぽい
//設定変更可能箇所

window.resizeTo(windowWidth + frameWidth ,windowHeight + frameHeight); //起動時に初期サイズに変更

function fitWindow0(UstFrame){//Ustrem読み込み
UstFrame = document.getElementById('UstFrame');
UstFrame.src = channelURL; //Ustreamを呼び出す
if(htmlVer > 4){//HTML5対応※α版:load・playが効かない
UstFrame.load();
UstFrame.play();
}
return;
}

function compatBrowser(htmlVer){//Ustreamを呼び出すタグを設定値から動的に構築
if(htmlVer > 4){//HTML5対応※α版:src変更に必要な要素確認中
ustreamTag = '<video id="UstFrame" width="'
+ contentWidth
+ '" height="'
+ contentHeight
+ '" autobuffer autoplay controls><source src="'
+ channelURL
+ '" /></video>';
}else{//HTML5非対応※現状では呼び出したUstreamページ側でスクリプトエラーとなる(クロスドメイン制限?)
ustreamTag = '<iframe id="UstFrame" src="'
+ channelURL
+ '" scrolling="no" frameborder="0" style="width: '
+ contentWidth
+ 'px; height: '
+ contentHeight
+ 'px; margin: 0px 0px 0px 0px; overflow: visible; border: 0px none transparent;"></iframe>';
}
return;
}

function fitWindow(){//Ustrem読み込み
windowWidth = document.body.clientWidth; //現在の横幅取得
windowHeight = document.body.clientHeight; //現在の縦幅取得
contentWidth = windowWidth - 160;
contentHeight = windowHeight - 10;
compatBrowser(htmlVer);
// alert(contentWidth); //デバッグ用
// ustreamTag = '<textarea>' + ustreamTag + '</textarea>' //デバッグ用
document.getElementById('UstLayer').innerHTML = ustreamTag; //Ustreamを呼び出すタグ書き出し
setInterval('checkWindow()', 100); //ウインドウサイズ変更を監視する間隔(1000=1秒)
}

function selectChannel(channelCode){//番組URLを生成してUstrem読み込み部分を呼び出し
channelURL = 'http://www.ustream.tv/flash/live/'
+ channelCode;
fitWindow0();
}

function mainMenu(channelCode,broadCaster){//番組リスト書き出し
mainMenuTag += '<li><a href="#" onclick="selectChannel(\''
+ channelCode
+ '\');">'
+ broadCaster
+ 'さん</a></li>';
return;
}

function init(){//ニコ生自作生主でUstreamチャンネルを持っている方々
//設定変更可能箇所
mainMenu('6333441','元バイヤー'); //http://com.nicovideo.jp/community/co1100581
mainMenu('7158776','タカシ'); //http://com.nicovideo.jp/community/co1795917
mainMenu('10478415','乙'); //http://com.nicovideo.jp/community/co429466
mainMenu('4257292','黒ハヤテ'); //http://com.nicovideo.jp/community/co32144
mainMenu('9808086','大学生'); //http://com.nicovideo.jp/community/co1072129
//書式※敬称略:mainMenu('UstreamチャンネルURL末尾の番号','放送者名');

// mainMenuTag = '<textarea>' + mainMenuTag + '</textarea>' //デバッグ用
document.getElementById('mainMenuLayer').innerHTML = '<ul>' + mainMenuTag + '</ul>'; //番組リスト書き出し
fitWindow();
}

function checkWindow(){//ウインドウサイズ変更を監視し変更があった場合には再描画(window.onResizeでは環境によって機能しないための対策)
if(windowWidth != document.body.clientWidth){fitWindow();}
}

-->
</script>
<HTA:APPLICATION
applicationName="Ustream Player"
border="yes"
borderStyle="sunken"
caption="yes"
contextMenu="yes"
innerBorder="no"
scroll="no"
singleInstance="no"
selection="yes"
icon="C:\Windows\system32\imageres.dll"
/>
</head>
<body onLoad="init();" style="background-color: 000000; margin: 0px 0px 0px 0px;">
<div id="mainMenuLayer" style="position: absolute; top: 10px; left: -30px; margin: 0px 0px 0px 0px; overflow: visible; background: transparent; background-color: transparent;"></div>
<div id="UstLayer" style="position: absolute; top: 10px; left: 128px; margin: 0px 0px 0px 0px; overflow: visible; background: transparent; background-color: transparent;"></div>
</body>
</html>

コメント

コメントはまだありません
コメントを書き込むにはログインしてください。

いまブロマガで人気の記事