Added docs updated and fix some demo-related files

jabbany · Feb 9, 2017 · da225a3 · da225a3
1 parent 0319e51
commit da225a3
Show file tree

Hide file tree

Showing 11 changed files with 284 additions and 195 deletions.
diff --git a/demo/scripting/index.htm b/demo/scripting/index.htm
@@ -4,56 +4,14 @@
 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 	<meta http-equiv="X-UA-Compatible" value="IE=9">
 	<title>CommentCoreLibrary - Bilibili Compatible Scripting Playground</title>
-	<style>
-		.left-area{width:48%; position:absolute; top:70px; left:10px; bottom: 200px;}
-		#playerdiv{width:48%; position:absolute; top:70px; bottom: 200px; right:10px;}
-		#player{
-			border:1px solid #f88;
-			width:100%;
-			top:0; bottom:10px; left: 0px; right:0px;
-			background-color:#100;
-			position:absolute;
-		}
-		#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;
-		}
-		.code-input {
-			position:absolute;
-			width:100%;
-			height:auto;
-			top:40px; bottom:10px; left:0; right:0;
-			display:block; border:1px solid #f88;
-			padding:10px;background:#000;color:#f88;font-size:20px;
-		}
-		.blue .code-input{
-			border:1px solid #88f;color:#88f;background:#113;
-		}
-		.s-button, .button{
-			display:block; border:1px solid #f88; padding:8px 6px 8px 6px; 
-			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;}
-		.blue .s-button, .blue .button{ border:1px solid #88f;color:#88f;}
-		.blue .s-button:hover,.blue .button:hover{background:#88f; color:#000;}
-		.button{font-size:12px;z-index:99;}
-
-		pre{margin:0;}
-		pre.error{color:#f00;}
-		pre.warning{color:#FFC500;}
-	</style>
+	<!-- Stylesheets for the sandbox -->
+	<link rel="stylesheet" href="sandbox-style.css" />
 	<link rel="stylesheet" href="../../dist/css/style.css" />
 	<script src="../../dist/scripting/Host.js" type="text/javascript"></script>
 	<script src="sandbox.js" type="text/javascript" ></script>
 </head>
-<body style="background:#000;">
-	<h2 style="color:#fff">CCL Scripting Demo</h2>
+<body>
+	<h2>CCL Scripting Demo</h2>
 	<div id="codediv" class="left-area">
 		<div style="clear:both;overflow:auto;width:110%;">
 			<button class="s-button" id="evaluate-worker">Execute</button>

diff --git a/demo/scripting/sandbox-style.css b/demo/scripting/sandbox-style.css
@@ -0,0 +1,61 @@
+body {
+  background-color: #000;
+  color: #FFF;
+}
+
+.left-area {
+  width: 48%;
+  position: absolute;
+  top: 70px;
+  left: 10px;
+  bottom: 200px;
+}
+
+#playerdiv {
+  width: 48%;
+  position: absolute;
+  top: 70px;
+  right:10px;
+  bottom: 200px;
+}
+
+#player{
+  border:1px solid #f88;
+  width:100%;
+  top:0; bottom:10px; left: 0px; right:0px;
+  background-color:#100;
+  position:absolute;
+}
+#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;
+}
+.code-input {
+  position:absolute;
+  width:100%;
+  height:auto;
+  top:40px; bottom:10px; left:0; right:0;
+  display:block; border:1px solid #f88;
+  padding:10px;background:#000;color:#f88;font-size:20px;
+}
+.blue .code-input{
+  border:1px solid #88f;color:#88f;background:#113;
+}
+.s-button, .button{
+  display:block; border:1px solid #f88; padding:8px 6px 8px 6px; 
+  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;}
+.blue .s-button, .blue .button{ border:1px solid #88f;color:#88f;}
+.blue .s-button:hover,.blue .button:hover{background:#88f; color:#000;}
+.button{font-size:12px;z-index:99;}
+
+pre{margin:0;}
+pre.error{color:#f00;}
+pre.warning{color:#FFC500;}
diff --git a/demo/scripting/sandbox.js b/demo/scripting/sandbox.js
@@ -1,15 +1,16 @@
 var $ = function(e){return window.document.getElementById(e);}
+var _e = function(text) { return text.replace('&', '&amp;').replace('<', '&lt;');}
 window.addEventListener('load',function(){
 	window.bscripter = new CCLScripting("../../dist/scripting/Worker.js");
 	bscripter.logger = new function(){
 		this.log = function(t){
-			$("output").innerHTML = "<pre>" + t.toString() + "</pre>" + $("output").innerHTML;
+			$("output").innerHTML = "<pre>" + _e(t.toString()) + "</pre>" + $("output").innerHTML;
 		};
 		this.error = function(t){
-			$("output").innerHTML = "<pre class='error'>" + t.toString() + "</pre>" + $("output").innerHTML;
+			$("output").innerHTML = "<pre class='error'>" + _e(t.toString()) + "</pre>" + $("output").innerHTML;
 		};
 		this.warn = function(t){
-			$("output").innerHTML = "<pre class='warning'>" + t.toString() + "</pre>" + $("output").innerHTML;
+			$("output").innerHTML = "<pre class='warning'>" + _e(t.toString()) + "</pre>" + $("output").innerHTML;
 		};
 	};
 	window.sandbox = bscripter.getSandbox($("player"));