commons-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From jbe...@apache.org
Subject svn commit: r984031 - in /commons/sandbox/gsoc/2010/scxml-js/trunk: demo/drawing-tool/behaviour/canvas.xml demo/drawing-tool/drawing-tool.html src/xslt/ir-compiler/computeLCA.xsl
Date Tue, 10 Aug 2010 14:19:28 GMT
Author: jbeard
Date: Tue Aug 10 14:19:27 2010
New Revision: 984031

URL: http://svn.apache.org/viewvc?rev=984031&view=rev
Log:
Updated canvas behaviour and drawing tool.

Modified:
    commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/behaviour/canvas.xml
    commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/drawing-tool.html
    commons/sandbox/gsoc/2010/scxml-js/trunk/src/xslt/ir-compiler/computeLCA.xsl

Modified: commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/behaviour/canvas.xml
URL: http://svn.apache.org/viewvc/commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/behaviour/canvas.xml?rev=984031&r1=984030&r2=984031&view=diff
==============================================================================
--- commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/behaviour/canvas.xml (original)
+++ commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/behaviour/canvas.xml Tue Aug
10 14:19:27 2010
@@ -180,74 +180,28 @@ In both:
 			return angle;
 		}
 
-		function applyTransformToBBox(bbox,matrix){
-			//takes a bbox and a matrix and returns the bbox with the matrix applied to all points
-			var nwX = bbox.x;
-			var nwY = bbox.y;
-			var neX = nwX + bbox.width;
-			var neY = nwY;
-			var swX = nwX;
-			var swY = nwX + bbox.height;
-			var seX = neX;
-			var seY = swY;
-
-			var nw = canvas.createSVGPoint();
-			nw.x = nwX;
-			nw.y + nwY;
-
-			var ne = canvas.createSVGPoint();
-			ne.x = neX;
-			ne.y = neY;
-
-			var sw = canvas.createSVGPoint();
-			sw.x = swX;
-			sw.y = swY;
-
-			var se = canvas.createSVGPoint();
-			se.x = seX;
-			se.y = seY;
-
-			nw = nw.matrixTransform(matrix);
-			ne = ne.matrixTransform(matrix);
-			sw = sw.matrixTransform(matrix);
-			se = se.matrixTransform(matrix);
-
-			var newWidth = Math.abs(ne.x - nw.x);
-			var newHeight = Math.abs(se.y - ne.y);
-
-			return {x:nw.x,y:nw.y,width:newWidth,height:newHeight}
-		}
-
-		function applyLeftTransform(canvas,transformMatrix){
-			var t = canvas.transform.baseVal.getItem(0);
-			var m = t.matrix;
-			var newM = transformMatrix.multiply(m); //note the left transform, pre-muliplication here
-			t.setMatrix(newM);
-			return t;
-		}
-
-		function applyLeftTransformFromNodeToOtherNode(fromNode,toNode){
-			var t = fromNode.transform.baseVal.getItem(0);
-			var m = t.matrix;
-			return applyLeftTransform(toNode,m);
-		}
-
 	]]></script>
 
 
 	<datamodel>
 		<!-- these get passed in on initiation -->
 		<data id="svg"/>
-		<data id="toolbarStatechart"/>
-		<data id="scaleButtonHandle"/>
-		<data id="rotationButtonHandle"/>
-		<data id="canvas"/>
 		<data id="transformModule"/>
 		<data id="scaleHandle"/>
 		<data id="rotationHandle"/>
 
+		<!-- toolbar stuff -->
+		<data id="ellipseButton"/>
+		<data id="ellipseIcon"/>
+		<data id="rectButton"/>
+		<data id="rectIcon"/>
+		<data id="transformButton"/>
+		<data id="transformIcon"/>
+
+		<!-- constant expression -->
 		<data id="svgNs" expr="'http://www.w3.org/2000/svg'"/>
 
+		<!-- dynamically changing data -->
 		<data id="selectedNodes" expr="[]"/>
 		<data id="nodesOnCanvas" expr="[]"/>
 
@@ -256,9 +210,16 @@ In both:
 	<state id="initial_default">
 		<transition event="init" target="main">
 			<assign location="svg" expr="_event.data.svg"/>
-			<assign location="toolbarStatechart" expr="_event.data.toolbarStatechart"/>
-			<assign location="scaleButtonHandle" expr="_event.data.scaleButtonHandle"/>
-			<assign location="rotationButtonHandle" expr="_event.data.rotationButtonHandle"/>
+			<assign location="transformModule" expr="_event.data.transformModule"/>
+			<assign location="scaleHandle" expr="_event.data.scaleHandle"/>
+			<assign location="rotationHandle" expr="_event.data.rotationHandle"/>
+
+			<assign location="ellipseButton" expr="_event.data.ellipseButton"/>
+			<assign location="ellipseIcon" expr="_event.data.ellipseIcon"/>
+			<assign location="rectButton" expr="_event.data.rectButton"/>
+			<assign location="rectIcon" expr="_event.data.rectIcon"/>
+			<assign location="transformButton" expr="_event.data.transformButton"/>
+			<assign location="transformIcon" expr="_event.data.transformIcon"/>
 		</transition>
 	</state>
 
@@ -268,6 +229,17 @@ In both:
 		<state id="presentation_state">
 
 			<state id="transform_tool_selected">
+				<onentry>
+					<script>
+						$(transformButton).addClass("selected");
+					</script>
+				</onentry>
+				<onexit>
+					<script>
+						$(transformButton).removeClass("selected");
+					</script>
+				</onexit>
+
 
 				<initial id="transform_tool_selected_initial">
 					<transition target="no_nodes_selected" cond="selectedNodes.length === 0"/> 
@@ -317,17 +289,39 @@ In both:
 
 				</state>
 		
-				<transition target="circle_tool_selected" event="mousedown" cond="_event.data.target
=== rotationButtonHandle"/>
+				<transition target="ellipse_tool_selected" event="mousedown" cond="_event.data.target
=== rotationButtonHandle"/>
 				<transition target="rect_tool_selected" event="mousedown" cond="_event.data.target
=== scaleButtonHandle"/>
 			</state>
 
 			<state id="drawing_tool_selected">
-				<state id="circle_tool_selected">
+				<state id="ellipse_tool_selected">
+					<onentry>
+						<script>
+							$(ellipseButton).addClass("selected");
+						</script>
+					</onentry>
+					<onexit>
+						<script>
+							$(ellipseButton).removeClass("selected");
+						</script>
+					</onexit>
+
 					<transition target="rect_tool_selected" event="mousedown" cond="_event.data.target
=== scaleButtonHandle"/>
 				</state>
 
 				<state id="rect_tool_selected">
-					<transition target="circle_tool_selected" event="mousedown" cond="_event.data.target
=== rotationButtonHandle"/>
+					<onentry>
+						<script>
+							$(rectButton).addClass("selected");
+						</script>
+					</onentry>
+					<onexit>
+						<script>
+							$(rectButton).removeClass("selected");
+						</script>
+					</onexit>
+
+					<transition target="ellipse_tool_selected" event="mousedown" cond="_event.data.target
=== rotationButtonHandle"/>
 				</state>
 
 				<!-- TODO: add reference to transform button handle -->
@@ -372,7 +366,7 @@ In both:
 					cond="allNodes.indexOf(_event.data.target) !== -1 
 						&amp;&amp; _event.data.shiftKey"/>
 
-				<transition target="after_mousedown_on_canvas" event="mousedown" cond="_event.data.target
=== canvas"/>
+				<transition target="after_mousedown_on_canvas" event="mousedown" cond="_event.data.target
=== svg.root()"/>
 
 				<transition target="rotating" event="mousedown" 
 					cond="_event.data.target === rotationHandle 
@@ -475,14 +469,13 @@ In both:
 					<assign location="tDelta" expr="computeTDelta(eventStamp,_event.data)"/>
 					<assign location="nodeBeingDrawn" expr="svg.rect(_event.data.clientX,_event.data.clientY,1,1,{'fill':'red','stroke':'black'})"/>
 				</transition>
-				<transition target="drawing_circle" event="mousemove" cond="In(circle_tool_selected)">
+				<transition target="drawing_ellipse" event="mousemove" cond="In(ellipse_tool_selected)">
 					<assign location="tDelta" expr="computeTDelta(eventStamp,_event.data)"/>
 					<assign location="nodeBeingDrawn" expr="svg.ellipse(_event.data.clientX,_event.data.clientY,1,1,{'fill':'blue','stroke':'black'})"/>
 				</transition>
 
 			</state>
 
-			<!-- TODO: add dragging behaviour with the tdeltas and stuff -->
 			<state id="dragging">
 				<transition target="dragging" event="mousemove">
 					<assign location="tDelta" expr="computeTDelta(eventStamp,_event.data)"/>
@@ -495,7 +488,7 @@ In both:
 						}
 					]]></script>
 				</transition>
-				<transition target="ready" event="ready">
+				<transition target="ready" event="mouseup">
 					<assign location="tDelta" expr="computeTDelta(firstEvent,eventStamp)"/>
 					<assign location="cachedCenterPoint" expr="getCenterPoint(selectedNodes)"/>
 					<assign location="cachedBBox" expr="getAggregateBBox(selectedNodes)"/>
@@ -506,8 +499,6 @@ In both:
 				</transition>
 			</state>
 
-			<!-- TODO: add rotation and scale code -->
-			<!-- TODO: alter various scripts to use all nodes -->
 			<state id="rotating">
 				<transition target="ready" event="mouseup">
 					<assign location="cachedBBox" expr="getAggregateBBox(selectedNodes)"/>
@@ -567,8 +558,8 @@ In both:
 			</state>
 
 			<state id="drawing">
-				<state id="drawing_circle">
-					<transition target="drawing_circle" event="mousemove">
+				<state id="drawing_ellipse">
+					<transition target="drawing_ellipse" event="mousemove">
 						<script>
 							updateCircle(nodeBeingDrawn,eventStamp,_event.data);
 						</script>
@@ -586,6 +577,7 @@ In both:
 				
 				<transition target="ready" event="mouseup">
 					<script>
+						nodesOnCanvas.push(nodeBeingDrawn);
 						selectedNodes.push(nodeBeingDrawn);
 						$(nodeBeingDrawn).addClass("selected");
 					</script>

Modified: commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/drawing-tool.html
URL: http://svn.apache.org/viewvc/commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/drawing-tool.html?rev=984031&r1=984030&r2=984031&view=diff
==============================================================================
--- commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/drawing-tool.html (original)
+++ commons/sandbox/gsoc/2010/scxml-js/trunk/demo/drawing-tool/drawing-tool.html Tue Aug 10
14:19:27 2010
@@ -69,7 +69,7 @@
         $("#toolbarDiv").svg({
           onLoad:function(toolbar){
             $(toolbar.root()).attr({
-              "width":"100px",
+              "width":"150px",
               "height":"50px"
             });
 
@@ -81,12 +81,24 @@
                   "height":"100%"
                 });
 
-                var toolbarOutlineRect = toolbar.rect(0,0,100,50,{
+                var toolbarOutlineRect = toolbar.rect(0,0,150,50,{
                   fill:"white", 
                   stroke:"black"
                 }) ;
+
+                var transformButton = toolbar.group();
+
+                var transformButtonBackground = toolbar.rect(transformButton,0,0,50,50,{
+                  class:"background"
+                });
+
+								//TODO: make proper icon
+                var transformButtonIcon = toolbar.circle(transformButton,25,25,15,{
+                  fill:"green",
+                  stroke:"black"
+                });
                 
-                var rectButton = toolbar.group();
+                var rectButton = toolbar.group({"transform":"translate(50,0)"});
                 var rectButtonBackground = toolbar.rect(rectButton,0,0,50,50,{ 
                   class:"background"
                 });
@@ -95,7 +107,7 @@
                   stroke:"black"
                 });
 
-                var ellipseButton = toolbar.group({"transform":"translate(50,0)"});
+                var ellipseButton = toolbar.group({"transform":"translate(100,0)"});
 
                 var ellipseButtonBackground = toolbar.rect(ellipseButton,0,0,50,50,{
                   class:"background"
@@ -130,11 +142,9 @@
                   },
                   ["src/javascript/scxml/cgf/SCXMLCompiler",
                     "demo/drawing-tool/transform",
-                    "xml!demo/drawing-tool/behaviour/canvas.xml",
-                    "xml!demo/drawing-tool/behaviour/node.xml",
-                    "xml!demo/drawing-tool/behaviour/toolbar.xml" ],
+                    "xml!demo/drawing-tool/behaviour/canvas.xml" ],
 
-                  function(compiler,svgTransformer,canvasBehaviourSCXML,nodeBehaviourSCXML,toolbarBehaviourSCXML){
+                  function(compiler,svgTransformer,canvasBehaviourSCXML){
 
                     require( [window.DOMParser ?
                         "src/javascript/scxml/cgf/util/xsl/browser" :
@@ -145,7 +155,7 @@
                       var d = new Date();
 
                       compiler.compile({
-                        inFiles:[canvasBehaviourSCXML,nodeBehaviourSCXML,toolbarBehaviourSCXML],
+                        inFiles:[canvasBehaviourSCXML],
                         //debug:true,
                         backend:"state",
                         beautify:true,
@@ -161,19 +171,6 @@
                           eval(scArr[i]);
                         }
 
-
-                        //hook up toolbar behaviour
-                        var toolbarSC = new ToolbarStatechartExecutionContext();
-                        toolbarSC.initialize();
-                        toolbarSC.init({
-                          ellipseButton:ellipseButton,
-                          rectButton:rectButton,
-                          ellipseIcon:ellipseButtonIcon,
-                          rectIcon:rectButtonIcon  
-                        });
-                        
-                        hookUpDOMEvents(toolbar.root(),toolbarSC);
-
                         //hook up canvas behaviour
                         var canvasSC = new CanvasStatechartExecutionContext(); 
 
@@ -184,29 +181,18 @@
                         //pass in reference to rect
                         canvasSC.init({  
                           svg:svg,
-                          toolbarStatechart:toolbarSC,
 													scaleHandle:scaleHandle,
 													rotationHandle:rotationHandle,
-                          api:{
-                            addBehaviourToNode:function(node){
-                              //add behaviour
-                              var nodeSc = new NodeStatechartExecutionContext();
-
-															node.statechart = nodeSc;		//hook up dom node reference
-
-                              nodeSc.initialize();
-                              nodeSc.init({
-                                rawNode:node,
-                                transformModule:svgTransformer,
-																scaleHandle:scaleHandle,
-																rotationHandle:rotationHandle
-                              });
-                              hookUpDOMEvents(node,nodeSc);
-                            }
-                          }
+                          ellipseButton:ellipseButton,
+                          rectButton:rectButton,
+                          transformButton:transformButton,
+                          ellipseIcon:ellipseButtonIcon,
+                          rectIcon:rectButtonIcon,
+                          transformIcon:transformIcon
                         });   
 
                         hookUpDOMEvents(svg.root(),canvasSC);
+                        hookUpDOMEvents(toolbar.root(),canvasSC);
 
                       },xslTransformer);
                     })

Modified: commons/sandbox/gsoc/2010/scxml-js/trunk/src/xslt/ir-compiler/computeLCA.xsl
URL: http://svn.apache.org/viewvc/commons/sandbox/gsoc/2010/scxml-js/trunk/src/xslt/ir-compiler/computeLCA.xsl?rev=984031&r1=984030&r2=984031&view=diff
==============================================================================
--- commons/sandbox/gsoc/2010/scxml-js/trunk/src/xslt/ir-compiler/computeLCA.xsl (original)
+++ commons/sandbox/gsoc/2010/scxml-js/trunk/src/xslt/ir-compiler/computeLCA.xsl Tue Aug 10
14:19:27 2010
@@ -124,6 +124,19 @@ to the input document as children in the
 		<xsl:variable name="firstTargetStateId" select="c:targets/c:target/c:targetState/text()[1]"/>
 		<xsl:variable name="firstTargetState" select="//*[(self::s:state or self::s:parallel
or self::s:final or self::s:initial or self::s:scxml or self::s:history) and @id = $firstTargetStateId]"/>
 
+		<xsl:choose>
+			<xsl:when test="not($firstTargetStateId)">
+				<xsl:message terminate="yes">
+					Error compiling statechart: target state does not have id, for source state with id:
<xsl:value-of select="$srcState/@id"/>
+				</xsl:message>
+			</xsl:when>
+			<xsl:when test="not($firstTargetState)">
+				<xsl:message terminate="yes">
+					Error compiling statechart: Could not find targe state with id <xsl:value-of select="$firstTargetStateId"/>
+				</xsl:message>
+			</xsl:when>
+		</xsl:choose>
+
 		<!-- compute the least common ancestor using the Kaysian method for intersection-->
 		<!-- http://stackoverflow.com/questions/538293/find-common-parent-using-xpath -->
 		<xsl:variable name="lca" 



Mime
View raw message