flashlizi · mylyed · Sep 4, 2019 · Sep 7, 2019
diff --git a/casual.bat b/casual.bat
@@ -1 +1,2 @@
-java -jar e:/dev/js/compiler.jar --js_output_file js/casual-0.1.3.min.js --js src/core/base.js --js src/geom/Matrix.js  --js src/geom/Rectangle.js --js src/utils/NameUtil.js --js src/event/EventBase.js --js src/event/StageEvent.js --js src/event/EventManager.js --js src/event/EventDispatcher.js --js src/display/DisplayObject.js --js src/display/DisplayObjectContainer.js --js src/display/Stage.js --js src/display/Bitmap.js --js src/display/Sprite.js --js src/display/Frame.js --js src/display/MovieClip.js --js src/display/Graphics.js --js src/display/Shape.js --js src/display/Text.js --js src/display/Button.js --js src/casual.js
+java -jar ./compiler.jar --js_output_file js/casual-0.1.3.min.js --js src/core/base.js --js src/geom/Matrix.js  --js src/geom/Rectangle.js --js src/utils/NameUtil.js --js src/event/EventBase.js --js src/event/StageEvent.js --js src/event/EventManager.js --js src/event/EventDispatcher.js --js src/display/DisplayObject.js --js src/display/DisplayObjectContainer.js --js src/display/Stage.js --js src/display/Bitmap.js --js src/display/Sprite.js --js src/display/Frame.js --js src/display/MovieClip.js --js src/display/Graphics.js --js src/display/Shape.js --js src/display/Text.js --js src/display/Button.js --js src/casual.js
+exit
diff --git a/compiler.jar b/compiler.jar
diff --git a/examples/Text.html b/examples/Text.html
@@ -0,0 +1,83 @@
+<html>
+
+<head>
+    <meta name="Author" content="flashlizi - www.riaidea.com">
+    <meta name="Keywords" content="HTML5,canvas,casual framework">
+    <meta name="Description" content="HTML5 canvas experiment">
+    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
+    <title>MovieClip Demo - CasualJS Framework</title>
+    <link type="text/css" href="css/style.css" media="screen" rel="stylesheet"/>
+    <script type="text/javascript" src="../js/casual-0.1.3.min.js"></script>
+
+    <script type="text/javascript">
+        var canvas, context, stage;
+
+        function init() {
+            //init canvas
+            canvas = document.getElementById("canvas");
+            context = canvas.getContext("2d");
+            start();
+        }
+
+        function start() {
+            //create stage
+            stage = new Stage(context);
+
+            var text = new Text("中国", "#ff1635", "50px Arial");
+            stage.addChild(text);
+
+
+            var text2 = new Text("USA", "#ff1635");
+            text2.outline = true;
+            text2.font = "50px Arial";
+            text2.x = 0;
+            text2.y = 50;
+            stage.addChild(text2);
+
+            var gradient = context.createLinearGradient(0, 0, 200, 0);
+            gradient.addColorStop("0", "#0000FF");
+            gradient.addColorStop("0.5", "#00FF00");
+            gradient.addColorStop("1.0", "#FF0000");
+            var text3 = new Text("爱与和平", gradient);
+            text3.font = "50px Arial";
+            text3.x = 0;
+            text3.y = 100;
+            stage.addChild(text3);
+
+        }
+
+    </script>
+
+</head>
+
+<body onLoad="init();">
+<div class="main">
+    <div class="canvasContainer">
+        <canvas id="canvas" width="700" height="500">Sorry, your browser doesn't support Canvas.</canvas>
+    </div>
+    <div class="intro">
+
+
+        <h2>Causal Text</h2>
+        </span><br>
+        Constructor:<br>
+        <span class="code">
+function(text, color, font)
+</span><br><br>
+
+        For example:<br>
+        <span class="code">
+ 			var text = new Text("中国", "#ff1635","50px Arial");<br>
+            stage.addChild(text);<br>
+		</span>
+    </div>
+</div>
+
+<div id="footer">
+    <div id="footer-content">
+        <span>© Copyright 2011 HTML5idea.com, RIAidea.com · All Rights Reserved · Powered by Flashlizi</span>
+    </div>
+</div>
+
+</body>
+</html>
diff --git a/js/casual-0.1.3.min.js b/js/casual-0.1.3.min.js
diff --git a/src/display/Stage.js b/src/display/Stage.js
@@ -85,6 +85,7 @@ var Stage = function(context)
 		this.canvas.addEventListener("mousedown", casual.delegate(this.__mouseHandler, this), false);
 		this.canvas.addEventListener("mousemove", casual.delegate(this.__mouseHandler, this), false);
 		this.canvas.addEventListener("mouseup", casual.delegate(this.__mouseHandler, this), false);
+		this.canvas.addEventListener("click", casual.delegate(this.__mouseHandler, this), false);
 	}
 }
 casual.inherit(Stage, casual.DisplayObjectContainer);

diff --git a/src/display/Text.js b/src/display/Text.js
@@ -1,7 +1,7 @@
 /**
  * CasualJS Framework by Flashlizi, Copyright (c) 2011 RIAidea.com
  * Project Homepage: www.html5idea.com and http://code.google.com/p/casualjs/
- * 
+ *
  * Permission is hereby granted, free of charge, to any person
  * obtaining a copy of this software and associated documentation
  * files (the "Software"), to deal in the Software without
@@ -10,10 +10,10 @@
  * copies of the Software, and to permit persons to whom the
  * Software is furnished to do so, subject to the following
  * conditions:
- * 
+ *
  * The above copyright notice and this permission notice shall be
  * included in all copies or substantial portions of the Software.
- * 
+ *
  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
  * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
@@ -24,59 +24,75 @@
  * OTHER DEALINGS IN THE SOFTWARE.
  */
 
-(function(){
-/**
- * Constructor.
- * @name Text
- * @class The Text class provides basic methods to draw text onto Stage.
- * @augments DisplayObject
- * @property text The text string to be displayed.
- * @property color The color of the text, default is "#000".
- * @property font The font style for text, default is "12px Arial".
- * @property align Indicates the alignment of the text paragraph, default is "start".
- * @property outline A Boolean that indicates whether the text is outline or not, default is false.
- * @property maxWidth Indicates the maximum width of the text paragraph.
- */
-var Text = function(text, color, font)
-{
-	casual.DisplayObject.call(this);
-	this.name = NameUtil.createUniqueName("Text");
-
-	this.text = text;
-	this.color = color || "#000";
-	this.font = font || "12px Arial";
-	this.align = "start";
-	this.baseline = "alphabetic";
-	this.maxWidth = null;
-	this.outline = false;
-
-}
-casual.inherit(Text, casual.DisplayObject);
-casual.Text = Text;
+(function () {
+    /**
+     * Constructor.
+     * @name Text
+     * @class The Text class provides basic methods to draw text onto Stage.
+     * @augments DisplayObject
+     * @property text The text string to be displayed.
+     * @property color The color of the text, default is "#000".
+     * @property font The font style for text, default is "12px Arial".
+     * @property align Indicates the alignment of the text paragraph, default is "start".
+     * @property outline A Boolean that indicates whether the text is outline or not, default is false.
+     * @property maxWidth Indicates the maximum width of the text paragraph.
+     */
+    var Text = function (text, color, font) {
+        casual.DisplayObject.call(this);
+        this.name = NameUtil.createUniqueName("Text");
 
-/**
- * @private Internal render function overriding from DisplayObject.
- */
-Text.prototype.render = function(context)
-{
-	if(!this.text || this.text.length == 0) return;
-
-	if(this.outline) context.strokeStyle = this.color;
-	else context.fillStyle = this.color;
-	context.font = this.font;
-	context.textAlign = this.align;
-	context.textBaseline = this.baseline;
-	if(this.outline) context.strokeText(this.text, 0, 0, this.maxWidth);
-	else context.fillText(this.text, 0, 0, this.maxWidth);
-}
+        this.text = text;
+        this.color = color || "#000";
+        this.font = font || "12px Arial";
+        this.align = "start";
+        this.baseline = "alphabetic";
+        this.maxWidth = undefined;
+        this.outline = false;
+        this.fontHeight = 0;
+    }
+    casual.inherit(Text, casual.DisplayObject);
+    casual.Text = Text;
 
-/**
- * Gets the width of the text.
- */
-Text.prototype.getWidth = function(context)
-{
-	if(!this.text || this.text.length == 0) return 0;
-	return context.measureText(this.text).width;
-}
-
+    /**
+     * @private Internal render function overriding from DisplayObject.
+     */
+    Text.prototype.render = function (context) {
+        if (!this.text || this.text.length === 0) {
+            return;
+        }
+        if (this.outline) {
+            context.strokeStyle = this.color;
+        } else {
+            context.fillStyle = this.color;
+        }
+        context.font = this.font;
+        context.textAlign = this.align;
+        context.textBaseline = this.baseline;
+        if (!this.fontHeight) {
+            this.fontHeight = this.getFontHeight(context);
+        }
+        if (this.outline) {
+            context.strokeText(this.text, 0, this.fontHeight, this.maxWidth);
+        } else {
+            context.fillText(this.text, 0, this.fontHeight, this.maxWidth);
+        }
+
+    };
+
+    /**
+     * Gets the width of the text.
+     */
+    Text.prototype.getWidth = function (context) {
+        if (!this.text || this.text.length == 0) return 0;
+        return context.measureText(this.text).width;
+    };
+
+    /**
+     * Gets the font height of the text.
+     * @param context
+     * @returns {number} font height
+     */
+    Text.prototype.getFontHeight = function (context) {
+        return context.measureText("啊").width;
+    }
 })();
diff --git a/src/event/StageEvent.js b/src/event/StageEvent.js
@@ -56,6 +56,8 @@ StageEvent.MOUSE_MOVE = "mousemove";
 StageEvent.MOUSE_OVER = "mouseover";
 /** Defines the value of the type property of a mouseout event object. */
 StageEvent.MOUSE_OUT = "mouseout";
+/** Defines the value of the type property of a mouseout event object. */
+StageEvent.MOUSE_CLICK = "click";
 
 
 /**