Deprecated old scripting engine and worked on new engine. Supports text glow.

Author: jabbany

experimental/scripting/ccl.htm

@@ -5,14 +5,15 @@
 <meta http-equiv="X-UA-Compatible" value="IE=9">
 <link rel="stylesheet" href="../../demo/default.css" />
 <link rel="stylesheet" href="../../build/base.css" />
+<link rel="stylesheet" href="fontalias.css" />
 <!-- Run 'make' to build the file -->
 <script src="../../build/CommentCoreLibrary.js"></script>
 
 <!-- A few helpers to do some decoding/fetching below-->
 <script src="../../demo/libxml.js"></script>
 
 <!-- Scripting Extensions -->
-<script src="bscript.js"></script>
+<script src="../../src/scripting/Host.js"></script>
 
 <title>Testrun Sandbox For CCL /w Scripting Enabled</title>
 </head>
@@ -62,8 +63,8 @@
 }
 
 var cm = new CommentManager($('commentCanvas'));
-var bscripter = new CCLScripting.BridgedSandbox(cm, $("commentCanvas"));
-cm.scripting = bscripter;
+var bscripter = new CCLScripting("../../src/scripting/Worker.js");
+cm.scripting = bscripter.getSandbox($("commentCanvas"));
 cm.init();
 
 var tmr=0;

experimental/scripting/api.worker.js …ental/scripting/deprecated/api.worker.jsexperimental/scripting/api.worker.js renamed to experimental/scripting/deprecated/api.worker.js experimental/scripting/api.worker.js renamed to experimental/scripting/deprecated/api.worker.js

@@ -0,0 +1,15 @@
+/** Here because some UP-ers use chinese font names, and some of us are on Linux **/
+@font-face{
+	font-family: "\9ED1\4F53";
+	src:local('SimHei');
+}
+
+@font-face{
+	font-family: "\5B8B\4F53";
+	src:local('SimSun');
+}
+
+@font-face{
+	font-family: "\5E7C\5706";
+	src:local('YouYuan');
+}

experimental/scripting/bscript.js …rimental/scripting/deprecated/bscript.jsexperimental/scripting/bscript.js renamed to experimental/scripting/deprecated/bscript.js experimental/scripting/bscript.js renamed to experimental/scripting/deprecated/bscript.js

@@ -7,13 +7,16 @@
 	<style>
 		#codediv{width:48%; float:left;}
 		#playerdiv{width:48%; float:right;}
-		#output{font-family:Consolas, 'Courier New', monospace; font-size:20px;padding:10px; background:#020;
-		position:fixed; bottom:0; left:0; right:0; height:150px; overflow:auto; }
+		#output{font-family:Consolas, 'Courier New', monospace; font-size:12px;padding:10px; background:#000;
+		position:fixed; bottom:0; left:0; right:0; height:150px; overflow:auto; color:#ccc;border-top:1px dotted #fff;}
 		#player{border:1px solid #f88; width:100%;background-color:#100;position:relative;}
 		#code-input{width:100%;height:340px;display:block; border:1px solid #f88; padding:10px;background:#000;color:#f88;font-size:20px;}
 		.s-button, .button{display:block; border:1px solid #f88; padding:10px; background:#000; color:#f88; float:left;-moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; cursor:default;}
 		.s-button:hover,.button:hover{background:#f88; color:#000;}
 		.button{font-size:12px;z-index:99;}
+		pre{margin:0;}
+		pre.error{color:#f00;}
+		pre.warning{color:#FFC500;}
 	</style>
 	<script type="text/javascript">var $ = function(e){return window.document.getElementById(e);}</script>
 	<script src="../../src/scripting/Host.js" type="text/javascript"></script>
@@ -29,9 +32,20 @@ <h2 style="color:#fff">CCL Scripting Demo</h2>
 	<div id="playerdiv">
 		<div id="player" style="height:400px;clear:both;overflow:hidden;"></div>
 	</div>
-	<div id="output" style="color:#fff;">[Msg] 有关具体API信息请阅读 docs/scripting</div>
+	<div id="output">[Msg] 有关具体API信息请阅读 docs/scripting</div>
 	<script type="text/javascript">
 		bscripter = new CCLScripting("../../src/scripting/Worker.js");
+		bscripter.logger = new function(){
+			this.log = function(t){
+				$("output").innerHTML = "<pre>" + t.toString() + "</pre>" + $("output").innerHTML;
+			};
+			this.error = function(t){
+				$("output").innerHTML = "<pre class='error'>" + t.toString() + "</pre>" + $("output").innerHTML;
+			};
+			this.warn = function(t){
+				$("output").innerHTML = "<pre class='warning'>" + t.toString() + "</pre>" + $("output").innerHTML;
+			};
+		};
 		sandbox = bscripter.getSandbox($("player"));
 		$("evaluate").addEventListener("click", function(){
 			try{

…erimental/scripting/libraries/libBase.js …cripting/deprecated/libraries/libBase.jsexperimental/scripting/libraries/libBase.js renamed to experimental/scripting/deprecated/libraries/libBase.js experimental/scripting/libraries/libBase.js renamed to experimental/scripting/deprecated/libraries/libBase.js

@@ -232,6 +232,10 @@ var CCLScripting = function(workerUrl){
 		});
 		this.addListener("Player::action", function(msg){
 			try{
+				if(self.getPlayer() == null){
+					self.getLogger().warn("Player not initialized!");
+					return;
+				};
 				switch(msg.action){
 					default:return;
 					case "play": self.getPlayer().play();break;
@@ -292,37 +296,69 @@ var CCLScripting = function(workerUrl){
 	/** Define some unpackers **/
 	var ScriptingContext = CCLScripting.prototype.ScriptingContext;
 	ScriptingContext.prototype.Unpack.Comment = function(stage, data, ctx){
-		this.DOM = _("div",{});
-		/** Load the text format **/
+		this.DOM = _("div",{
+			"style":{
+				"position":"absolute",
+			},
+			"className":"cmt"
+		});
+		/** Load the text **/
 		this.DOM.appendChild(document.createTextNode(data.text));
-		this.DOM.style.fontFamily = data.textFormat.font;
-		this.DOM.style.fontSize = data.textFormat.size + "px";
-		this.DOM.style.color = "#" + data.textFormat.color.toString(16);
-		if(data.textFormat.bold)
-			this.DOM.style.fontWeight = "bold";
-		if(data.textFormat.underline)
-			this.DOM.style.textDecoration = "underline";
-		if(data.textFormat.italic)
-			this.DOM.style.fontStyle = "italic";
-		this.DOM.style.margin = data.textFormat.margin;
+		var getColor = function(c){
+			var color = c.toString(16);
+			while(color.length < 6){
+				color = "0" + color;
+			}
+			return "#" + color;
+		};
+		this.setTextFormat = function(textFormat){
+			this.DOM.style.fontFamily = textFormat.font;
+			this.DOM.style.fontSize = textFormat.size + "px";
+			this.DOM.style.color = getColor(textFormat.color);
+			if(textFormat.color <= 16){
+				this.DOM.style.textShadow = "0 0 1px #fff";
+			};
+			if(textFormat.bold)
+				this.DOM.style.fontWeight = "bold";
+			if(textFormat.underline)
+				this.DOM.style.textDecoration = "underline";
+			if(textFormat.italic)
+				this.DOM.style.fontStyle = "italic";
+			this.DOM.style.margin = textFormat.margin;
+		};
+		/** Load the text format **/
+		this.setTextFormat(data.textFormat);
+
+		this.setX = function(x){
+			data.x = x;
+			this.DOM.style.left = data.x + "px";
+		};
+		
+		this.setY = function(y){
+			data.y = y;
+			this.DOM.style.top = data.y + "px";
+		};
+		/** Load x,y **/
+		this.setX(data.x);
+		this.setY(data.y);
 
 		this.setFilters = function(params){
 			for(var i = 0; i < params[0].length; i++){
 				var filter = params[0][i];
 				if(filter.type === "blur"){
 					this.DOM.style.color = "transparent";
-					this.DOM.style.textShadow = [-filter.params.blurX + "px",
-						-filter.params.blurY + "px", Math.max(
+					this.DOM.style.textShadow = [0,0, Math.max(
 							filter.params.blurX, filter.params.blurY) + 
 						"px"].join(" "); 
 				}else if(filter.type === "glow"){
-					this.DOM.style.textShadow = [-filter.params.blurX + "px",
-						-filter.params.blurY + "px", Math.max(
+					this.DOM.style.textShadow = [0,0, Math.max(
 							filter.params.blurX, filter.params.blurY) + 
-						"px", "#" + filter.params.color.toString(16)].join(" "); 
+						"px", getColor(filter.params.color)].join(" "); 
 				}
 			};
 		};
+		
+		/** Common **/
 		this.unload = function(){
 			try{
 				stage.removeChild(this.DOM);
@@ -343,8 +379,8 @@ var CCLScripting = function(workerUrl){
 				"width":"100%",
 				"height":"100%"
 		}});
-		this.x = data.x;
-		this.y = data.y;
+		this.x = data.x ? data.x : 0;
+		this.y = data.y ? data.y : 0;
 		this.alpha = data.alpha ? data.alpha : 1;
 		// Helpers
 		var __ = function(e, attr){
@@ -362,12 +398,15 @@ var CCLScripting = function(workerUrl){
 			return elem;
 		};
 		var defaultEffects = __("defs");
-		var defaultGroup = __("g",{"x":this.x, "y":this.y, "opacity":this.alpha});
+		var defaultGroup = __("g",{
+			"transform":"translate(" + this.x + "," + this.y + ")",
+			"opacity":this.alpha,
+		});
 		this.DOM.appendChild(defaultEffects);
 		this.DOM.appendChild(defaultGroup);
 
 		this.line = {
-			width:1,
+			width:0,
 			color:"#ffffff",
 			alpha:1
 		};
@@ -404,10 +443,20 @@ var CCLScripting = function(workerUrl){
 
 		/** Public methods **/
 		this.setX = function(x){
-			__(defaultGroup,{"x":x});
+			if(!x)
+				return;
+			this.x = x;
+			__(defaultGroup,{
+				"transform":"translate(" + this.x + "," + this.y + ")"
+			});
 		};
 		this.setY = function(y){
-			__(defaultGroup,{"y":y});
+			if(!y)
+				return;
+			this.y = y;
+			__(defaultGroup,{
+				"transform":"translate(" + this.x + "," + this.y + ")"
+			});
 		};
 		this.moveTo = function(params){
 			var p = __("path",{
@@ -528,10 +577,10 @@ var CCLScripting = function(workerUrl){
 				var filter = filters[i];
 				var dFilter = __("filter",{
 					"id":"fe" + filter.type + i,
-					"x":"-50%",
-					"y":"-50%",
-					"width":"200%",
-					"height":"200%"
+					"x":"-100%",
+					"y":"-100%",
+					"width":"400%",
+					"height":"400%"
 				});
 				switch(filter.type){
 					default:break;