简单了新建了一个jsloader，用于检测script文件加载

ProcessQ.js

@@ -1,5 +1,3 @@
-
-
 ;(function(scope,undefined){
 
 	var ProcessQ=scope.ProcessQ=function(cfg){
@@ -12,6 +10,7 @@
 		};
 		this.timer={};
 	};
+
 	ProcessQ.types={};
 
 	ProcessQ.prototype={
@@ -200,14 +199,15 @@
 			this[key]=cfg[key]
 		}	
 	}
+
 	ProcessQ.types["img"]=ImageLoader;
 
 	ImageLoader.prototype={
 		async : false ,
 		constructor : ImageLoader,
 		id : null ,
 		start : function(queue){
-			var img=this.img=new Image();
+			var img= this.img =new Image();
 			this.finished=this.async;
 			var Me=this;
 			function onload(event) {
@@ -309,8 +309,63 @@
 
 	};
 
+  /* add javascript source loader */
 
-}(this));
+	var JsLoader =function(cfg){
+		for (var key in cfg){
+			this[key]=cfg[key]
+		}
+	};
+
+	ProcessQ.types["script"]=JsLoader;
+
+  JsLoader.prototype = {
+		constructor : JsLoader,
+		id : null ,
+		async : false ,
+		start : function(queue){
+      var script = this.script = new Image();
+			this.finished=this.async;
+			var Me=this;
+
+      //throw SyntaxError();
+
+			function onload(event) {
+				Me.finished=true;
+				this.removeEventListener("load", onload);
+			}
+			function onerror(event) {
+				Me.finished=false;
+				Me.errorEvent=event;
+				this.removeEventListener("error", onerror);
+			}
 
+			script.addEventListener("load", onload);
+			script.addEventListener("error", onerror);
+			script.setAttribute('src', this.src );
 
+      setTimeout( function (){
+        var oHead = document.getElementsByTagName('HEAD').item(0);
+        var oScript= document.createElement("script");
+        oScript.type = "text/javascript";
+        oScript.src = script.src ;
+        oHead.appendChild( oScript);
+      }, 10 );
+
+		},
+
+		getResult : function(){
+			return this.script;
+		},
 
+		isFinished : function(queue){
+			return this.finished;
+		},
+
+		isError : function(queue){
+			return this.errorEvent;
+		}
+  }
+
+
+}(this));

README.md

@@ -1,35 +1,48 @@
 ProcessQ
 =========
 
-A (pre)process-queue ( e.g resource-loader ) implementation  for Web App. 
+###简单介绍
+
+  A (pre)process-queue ( e.g resource-loader ) implementation  for Web App. 
+
+  ProcessQ 是一个用于WebApp (如HTML5 game)的"预处理动作队列".
+
+###更新日志
+
+  2013/03/19 添加min版本的ProcessQ；修复重复请求的bug
+
+  2013/03/18 添加js loader 加载脚本资源
+
+  2013/03/18 准备添加英语文档
 
-ProcessQ 是一个用于WebApp (如HTML5 game)的"预处理动作队列".
 
 ###何为"预处理动作队列"?
-在WebApp启动前,通常我们会有一些预处理工作要执行. 下面拿游戏举例说明:
 
-为了保证游戏后续运行和显示可以正常且流程的进行, 在游戏启动前, 我们会预先加载游戏中的图片,音乐等资源.
-为了处理这类资源加载工作, 通常我们会写一个Loader工具类(或函数) 来帮忙简化这些操作. 同时加入 onLoading onLoaded一类的hook方法来实现对加载过程的监听.
+  在WebApp启动前,通常我们会有一些预处理工作要执行. 下面拿游戏举例说明:
 
-对于大多数开发人员来说,这没什么难度,使用new Image() new Audio(),再配合onload一类的dom事件便可以轻松的实现.
-
+  为了保证游戏后续运行和显示可以正常且流程的进行, 在游戏启动前, 我们会预先加载游戏中的图片,音乐等资源.
+  为了处理这类资源加载工作, 通常我们会写一个Loader工具类(或函数) 来帮忙简化这些操作. 同时加入 onLoading onLoaded一类的hook方法来实现对加载过程的监听.
 
-然后, 在实际应用中, 除了加载资源文件之外,我们可能还会有一些更复杂的预处理工作要进行,如: 提前算游戏中需要的一些数据(避免运行时计算带来的性能损耗), 从本地或远程加载游戏的配置信息, 检测用户运行环境等等.
+  对于大多数开发人员来说,这没什么难度,使用new Image() new Audio(),再配合onload一类的dom事件便可以轻松的实现.
 
-这些工作本质上不属于 Loader的范畴, 但是如果对 资源加载和其他预处理工作进行一个抽象, 我们不难发现, 他们的本质其实都是一样的: 在应用正式开始前,做一些事情. 这些事情包括: 加载图片, 加载声音,执行一些其他的函数等等, 即,资源加载只是诸多预处理中的一种.
+  然后, 在实际应用中, 除了加载资源文件之外,我们可能还会有一些更复杂的预处理工作要进行,如: 提前算游戏中需要的一些数据(避免运行时计算带来的性能损耗), 从本地或远程加载游戏的配置信息, 检测用户运行环境等等.
 
-所以,从这个角度出发, 我封装了这样一个实现, 它不在乎具体的预处理操作是什么,只要每一个操作提供了必须的方法(start, isFinished), 那么就可以很好的这些操作管理起来.
+  这些工作本质上不属于 Loader的范畴, 但是如果对 资源加载和其他预处理工作进行一个抽象, 我们不难发现, 他们的本质其实都是一样的: 在应用正式开始前,做一些事情. 这些事情包括: 加载图片, 加载声音,执行一些其他的函数等等, 即,资源加载只是诸多预处理中的一种.
+
+  所以,从这个角度出发, 我封装了这样一个实现, 它不在乎具体的预处理操作是什么,只要每一个操作提供了必须的方法(start, isFinished), 那么就可以很好的这些操作管理起来.
 
 ### 和 PreLoadJS 有何不同?
-PreloadJS (https://github.com/CreateJS/PreloadJS/ ) 是非常优秀和知名的加载工具类库.
-从功能上来说 ProcessQ和PreloadJS完全等同, 即,PreloadJS能做的事情, ProcessQ也都能做(但可能需要做一些扩展),反之亦然. 其实这是废话啊, 因为两者都可以随意扩充, 外加动态脚本语言,不可能存在A能实现,B实现不了的...囧...
+
+  PreloadJS (https://github.com/CreateJS/PreloadJS/ ) 是非常优秀和知名的加载工具类库.
+
+  从功能上来说 ProcessQ和PreloadJS完全等同, 即,PreloadJS能做的事情, ProcessQ也都能做(但可能需要做一些扩展),反之亦然. 其实这是废话啊, 因为两者都可以随意扩充, 外加动态脚本语言,不可能存在A能实现,B实现不了的...囧...
 
 
-PreloadJS 默认情况下 功能比 ProcessQ 更丰富 , 但是很多功能其实并不常用. 而且我个人并不是很喜欢PreLoadJS的抽象方式, 它更倾向于"加载资源"这个概念.
+  PreloadJS 默认情况下 功能比 ProcessQ 更丰富 , 但是很多功能其实并不常用. 而且我个人并不是很喜欢PreLoadJS的抽象方式, 它更倾向于"加载资源"这个概念.
 
-而 ProcessQ 虽然比PreLoadJS功能简单, 但是已经可以胜任绝大多数场景,而且代码和结构更简洁,使用更简单, 扩充也很方便(内部使用duck-type, 只要开发者根据自己的需求实现start和isFinish方法就ok).
+  而 ProcessQ 虽然比PreLoadJS功能简单, 但是已经可以胜任绝大多数场景,而且代码和结构更简洁,使用更简单, 扩充也很方便(内部使用duck-type, 只要开发者根据自己的需求实现start和isFinish方法就ok).
 
-当然, 无论是 PreloadJS 还是 ProcessQ , 想真实的得到在时间上 "当前完成工作占用总工作量的百分比"几乎是不可能的, 所以不应该强求"进度条"和真实时间的匹配度.
+  当然, 无论是 PreloadJS 还是 ProcessQ , 想真实的得到在时间上 "当前完成工作占用总工作量的百分比"几乎是不可能的, 所以不应该强求"进度条"和真实时间的匹配度.
 
 ### example 
 
@@ -40,32 +53,28 @@ PreloadJS 默认情况下 功能比 ProcessQ 更丰富 , 但是很多功能其
 			{ type : "img" , id : "ha-1", src:"./res/ha-1.png"},
 			{ type : "audio" , id : "bgm-1", src:"./res/bgm-1"},
 		],
+
 		onProgressing : function(deltaTime,queue){
 			console.log( "progressing" , queue.finishedWeight," of ",queue.totalWeight);
 		},
+
 		onFinish : function(queue){
 			console.log("finished : " , queue.finishedCount );
 		}
+
 	});
+
 	queue.init();
+
 	queue.start();
 
 
 ### 更多功能和用法详见 example 下的示例 和源码.
 
+  关于 weight , delay 等属性的设置和作用详见示例中的注释 和 源码.
 
-关于 weight , delay 等属性的设置和作用详见示例中的注释 和 源码.
-我英文很搓, 大家领会精神吧. 
-
-
-
-
-
-
-.
-
-
-.
-
+  我英文很搓, 大家领会精神吧. 
 
+###ProcessQ Documents(en) by CashLee
 
+  Introdution

example/0-base.html

@@ -67,5 +67,3 @@
 </body>
 
 </html>
-
-

example/1-function-queue.html

@@ -115,5 +115,3 @@
 </body>
 
 </html>
-
-

example/2-resource-queue.html

@@ -74,5 +74,3 @@
 </body>
 
 </html>
-
-

example/3-webapp-template.html

@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html>
+<head>
+<!-- This is a template for Web App Setup -->
+<!-- Author : @CashLee李秉骏 -->
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<!-- Deal with the proxy cache and some browser cache here is the setting of the meta -->
+<meta http-equiv="cache-control" content="no-cache">
+<!-- This method is for the old browsers -->
+<meta http-equiv="pragma" content="no-cache">
+<meta http-equiv="expires" content="0">
+<!-- Web App icon -->
+<link rel="apple-touch-icon" href="iphon_tetris_icon.png"/>
+<!-- Web App Status Bar Style 状态栏样式 -->
+<meta name="apple-mobile-web-app-status-bar-style" content="black" />
+<!-- Web App Start Up Page For Each Device -->
+<meta name='description' content='' >
+<meta name='author' content='' >
+<title>hello world</title>
+<link rel='stylesheet' type='text/css' href='./css/app.css' />
+<!-- Load ProcessQ Javascript Lib -->
+<script src='../ProcessQ.min.js'></script>
+<script>
+
+var mask = document.createElement('div');
+mask.setAttribute('id','mask');
+
+var queue = new ProcessQ({
+
+	defaultDelay : 20 , // run every process delay "defaultDelay" ms
+	items : [
+		{ type : "img" , id : "ha-1", src:"./res/ha-1.png"},
+		{ type : "img" , id : "ha-2", src:"./res/ha-2.png"},
+		{ type : "img" , id : "hb-1", src:"./res/hb-1.png"},
+		{ type : "img" , id : "hb-2", src:"./res/hb-2.png"},
+		{ type : "audio" , weight : 1 , id : "bgm-1", src:"./res/bgm-1" }, //whitout ext-filename
+		{ type : "script" , weight : 1 , id : "zepto", src:"./js/app.js" }, //whitout ext-filename
+	],
+
+	onProgressing : function( deltaTime , queue ){
+    console.log("时间差:" +  deltaTime );
+    //console.log( queue );
+    document.getElementById('mask').innerHTML = '<a id="mask-text">已经加载：'+ queue.finishedWeight/queue.totalWeight*100+'%</a>';
+		console.log( queue.finishedWeight/queue.totalWeight*100+"%" );
+	},
+
+	onFinish : function(queue){
+    document.getElementById('mask').innerHTML = '<a id="mask-text">已经加载：'+queue.finishedWeight/queue.totalWeight*100+'%</a>';
+		//console.log("finished : " +queue.finishedWeight+","+queue.finishedCount );
+	}
+
+})
+
+var processingBar;
+window.onload=function(){
+  document.getElementById('home').appendChild( mask );
+	queue.init();
+	queue.start();
+}
+
+</script>
+</head>
+<body id='home'>
+</body>
+</html>

example/css/app.css

@@ -0,0 +1,23 @@
+/* Public Style */
+body {
+  margin: 0;
+  padding: 0;
+}
+
+#mask {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  background: rgb( 199, 133 , 80);
+  color: #fafafa;
+  font-size: 2em;
+}
+#mask-text {
+  position: relative;
+  top: 50%;
+  left: 50%;
+  margin-left: -120px;
+  margin-top: -16px;
+}

example/js/app.js

@@ -0,0 +1,3 @@
+var test = function (){
+  console.log('this is a test function');
+}