SwfPlayer(嘘)

謎のパラパラ漫画ライブラリ。無駄にES3仕様。

謎のパラパラ漫画ライブラリ。無駄にES3仕様。

  • タグ:
  • タグはありません
var SwfPlayer=function(){
	"use strict";
	var pvt=0;
	var _player="#"+(++pvt);
	var _frames="#"+(++pvt);
	var _jumpURL="#"+(++pvt);
	var _i="#"+(++pvt);
	var _isAuto="#"+(++pvt);
	var _isEnded="#"+(++pvt);
	var _makeImgs="#"+(++pvt);
	var _setFrame="#"+(++pvt);
	var _auto="#"+(++pvt);
	var _ready="#"+(++pvt);
	var _end="#"+(++pvt);
	var _playing="#"+(++pvt);
	var _next="#"+(++pvt);

	function SwfPlayer(id,startFrame,endFrame,frames,jumpURL){
		this[_player]=document.getElementById(id);
		this[_frames]=frames.slice();
		if(startFrame!==null) this[_frames].unshift([startFrame,0]);
		if(endFrame!==null) this[_frames].push([endFrame,0]);
		this[_makeImgs]();
		this[_jumpURL]=jumpURL||null;
		this[_ready]();
	};

	var $=SwfPlayer.prototype;

	$[_makeImgs]=function(){
		var div=this[_player];
		div.style.display="inline-block";
		div.style.position="relative";
		var addImg=function(path,isFirst){
			if(document.getElementById(path)!=null) return;
			div.insertAdjacentHTML("beforeEnd",
				'<img id="'+path+'" src="'+path+'" style="'
					+(isFirst? "": "position:absolute;")
					+"visibility:hidden;"
					+"left:0px;top:0px;"
				+'">');
		};
		for(var i=0;i<this[_frames].length;i++){
			addImg(this[_frames][i][0],i==0);
		}
	}

	$[_setFrame]=function(frame){
		document.getElementById(frame).style.visibility="visible";
		var imgs=this[_player].childNodes;
		setTimeout(function(){
			for(var i=0;i<imgs.length;i++){
				if(imgs[i].id==frame) continue;
				imgs[i].style.visibility="hidden";
			}
		},1);
	}

	$[_auto]=function(isAuto){
		this[_isAuto]=isAuto;
		this[_player].style.cursor=isAuto? "": "pointer";
	};

	$[_ready]=function(){
		this[_i]=0;
		this[_isEnded]=false;
		this[_next]();
	};

	$[_end]=function(){
		this[_isEnded]=true;
		this[_next]();
	};

	$[_playing]=function(me){
		var img=0;
		var ms=1;

		if(me[_frames].length<=me[_i]) return me[_end]();

		var frame=me[_frames][me[_i]];
		this[_setFrame](frame[img]);
		me[_auto](0<frame[ms]);
		me[_i]++;

		if(me[_isAuto]){
			setTimeout(function(){
				me[_playing](me);
			},
			frame[ms]);
		}
	};

	$[_next]=function(){
		if(this[_isEnded]){
			if(this[_jumpURL]===null) return this[_ready]();
			return window.open(this[_jumpURL],"_self");
		}
		this[_playing](this);
	};

	$.next=function(){
		if(this[_isAuto]) return;
		this[_next]();
	};

	return SwfPlayer;
}();

/*
こんな感じで使うよ!
<html>
<body>

<div id="swf" onclick="swf.next()"></div>
<!--[SwfPlayerオブジェクト].next()で発火-->
<script src="SwfPlayer.js"></script>
<!--SwfPlayerライブラリ(事前に読込む必要あり)-->
<script>
var f=80;//1フレーム当たりの時間[ms]
var swf=new SwfPlayer(
	"swf",              //対象となるimg要素のid名
	"flashstart.PNG",   //スタート画面となる画像。nullの時自動で再生開始される。
	"flashend.PNG",     //エンド画面となる画像。nullの時自動でスタート画面に戻る。
	//以下再生されるイメージの配列
	//1画像の情報は[画像パス,画像当たりの再生時間]
	//(画像当たりの再生時間=0 の時、クリックで移動になる)
	[
		["000.png",f*10],
		["001.png",f*30],
		["002.png",f*30],
		["003.png",f*40],
		["004.png",f*25],
		["005.png",f*20]
	],
	"http://yosgspec.web.fc2.com/" //終了時にリプレイしないでジャンプする場合URLを入力。
);
</script>

</body>
</html>
*/