mirror of
https://github.com/hiloteam/Hilo.git
synced 2025-12-08 20:35:59 +00:00
93 lines
3.3 KiB
HTML
93 lines
3.3 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="user-scalable=no, width=device-width, minimum-scale=1, maximum-scale=1" />
|
|
<title>LoadQueue - Hilo Example</title>
|
|
<link rel="stylesheet" type="text/css" href="css/style.css">
|
|
<script type="text/javascript" src="../build/standalone/hilo-standalone.min.js"></script>
|
|
<script type="text/javascript" src="../build/flash/hilo-flash.min.js" data-auto="true"></script>
|
|
<script type="text/javascript" src="../src/util/debug.js" data-auto="true"></script>
|
|
<style type="text/css">
|
|
.hilo-log{
|
|
max-height: 200px !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body onload="init();">
|
|
<div id="header">
|
|
<h1>LoadQueue</h1>
|
|
<p>LoadQueue是一个资源的队列下载和管理工具。</p>
|
|
</div>
|
|
<div id="game-container"></div>
|
|
<script type="text/javascript" src="js/demo.js"></script>
|
|
<script type="text/javascript">
|
|
function init(){
|
|
//init stage
|
|
var stage = new Hilo.Stage({
|
|
renderType:renderType,
|
|
container: gameContainer,
|
|
width: stageWidth,
|
|
height: stageHeight
|
|
});
|
|
|
|
//start stage ticker
|
|
var ticker = new Hilo.Ticker(20);
|
|
ticker.addTick(stage);
|
|
ticker.start();
|
|
|
|
//create a load queue
|
|
var queue = new Hilo.LoadQueue();
|
|
|
|
//set max connections of the load queue, the default is 2.
|
|
queue.maxConnections = 1;
|
|
|
|
//add sources
|
|
queue.add([
|
|
{id:'fish', noCache:true, src:'images/fish.png'},
|
|
{id:'data', type:'jsonp', callback:'weekJSONP', src:'http://img1.tbcdn.cn/L1/584/1/20.js'}
|
|
]);
|
|
|
|
//custom css loader
|
|
queue.add({id:'taobao_css', type:'css', src:'http://g.tbcdn.cn/tbc/tmsg/3.0.2/index-min.css', loader:{
|
|
load: function(data){
|
|
var link = document.createElement('link');
|
|
link.type = 'text/css';
|
|
link.rel = 'stylesheet';
|
|
if(data.id) link.id = data.id;
|
|
link.addEventListener('load', this.onLoad.bind(this), false);
|
|
link.addEventListener('error', this.onError.bind(this), false);
|
|
link.href = data.src;
|
|
document.getElementsByTagName('head')[0].appendChild(link);
|
|
},
|
|
onLoad: function(e){
|
|
return e.target;
|
|
},
|
|
onError: function(e){
|
|
return e;
|
|
}
|
|
}});
|
|
|
|
//load event handlers
|
|
queue.on('load', function(e){
|
|
console.log('load:', e.detail.src, queue.getLoaded(), queue.getTotal());
|
|
}).on('complete', function(e){
|
|
console.log('complete');
|
|
|
|
//create a bitmap if the image loaded
|
|
var bmp = new Hilo.Bitmap({
|
|
image: queue.getContent('fish'),
|
|
rect: [0, 0, 174, 126],
|
|
x: 75,
|
|
y: 50
|
|
}).addTo(stage);
|
|
}).on('error', function(e){
|
|
console.log('error:', e.detail.src);
|
|
});
|
|
|
|
//start load queue
|
|
queue.start();
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |