Permalink
Browse files

Updated package.json

Updated .gitignore
Updated Makefile
Added stitch build script.
Updated demos to work with commonjs stitch modules.
Added wrapper to underscore to use global underscore when available. This is better for use on the web, as underscore can be loaded separately and cached.
Added new parsePage script.
Moved out test-server.
  • Loading branch information...
1 parent 562660c commit 7978331923da6ebfa4a0c2faf1fe5f898a88cfaf @jbeard4 committed Apr 1, 2012
View
@@ -6,3 +6,6 @@ node_modules
build
src/demo/node-repl/build/
src/demo/nodejs/build/
+scion.js
+scion-min.js
+TODO
View
@@ -0,0 +1,25 @@
+js = lib/scion.js lib/util/browser \
+ lib/util/browser/parsePage.js \
+ lib/util/browser/parseOnLoad.js \
+ lib/util/annotate-scxml-json.js \
+ lib/util/underscore-wrapper.js \
+ lib/scxml/SCXML.js \
+ lib/scxml/default-transition-selector.js \
+ lib/scxml/state-kinds-enum.js \
+ lib/scxml/setup-default-opts.js \
+ lib/scxml/model.js \
+ lib/scxml/scxml-dynamic-name-match-transition-selector.js \
+ lib/scxml/json2model.js \
+ lib/scxml/set/ArraySet.js
+
+scion.js : $(js)
+ mkdir -p build/
+ node build-lib/stitch.js
+
+scion-min.js : scion.js
+ uglifyjs scion.js > scion-min.js
+
+clean :
+ rm scion.js scion-min.js
+
+.PHONY : clean
View
@@ -0,0 +1,13 @@
+var stitch = require('stitch');
+var fs = require('fs');
+
+var package = stitch.createPackage({
+ paths: [__dirname + '/../lib']
+});
+
+package.compile(function (err, source){
+ fs.writeFile('scion.js', source, function (err) {
+ if (err) throw err;
+ console.log('Compiled package.js');
+ })
+})
@@ -37,12 +37,13 @@ using SCXML:
padding: 0;
}
</style>
- <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/require.js/1.0.1/require.min.js"></script>
- <script type="text/javascript" src="http://jbeard4.github.com/SCION/builds/scion-browser-0.1.js"></script>
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
+ <script src="https://raw.github.com/mckamey/jsonml/master/jsonml-dom.js"></script>
+ <script type="text/javascript" src="/scion.js"></script>
<script type="text/javascript">
- require(['util/browser/parseOnLoad'],function(parseOnLoad){
- parseOnLoad()
- });
+ var parsepage = require('util/browser/parsePage');
+ $(document).ready(parsepage);
</script>
</head>
@@ -55,7 +56,6 @@ using SCXML:
xmlns="http://www.w3.org/2005/07/scxml"
version="1.0"
profile="ecmascript"
- id="scxmlRoot"
initial="idle"
scion:domEventsToConnect="mousedown,mouseup,mousemove">
@@ -33,102 +33,100 @@ own state.
}
</style>
<!-- we use jquery for jQuery.get and jQuery.globalEval (globalEval can optionally be used by the statechart) -->
- <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
- <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/require.js/1.0.1/require.min.js"></script>
- <script type="text/javascript" src="http://jbeard4.github.com/SCION/builds/scion-browser-0.1.js"></script>
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
+ <script src="https://raw.github.com/mckamey/jsonml/master/jsonml-dom.js"></script>
+ <script type="text/javascript" src="/scion.js"></script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="99%" id="canvas"/>
<button id="elementButton" style="position:absolute;bottom:0px;left:0px;">Make draggable SVG Element</button>
<script><![CDATA[
+
+ var scion = require('scion');
+
var svgCanvas = document.getElementById("canvas"),
elementButton = document.getElementById("elementButton"),
SVG_NS = "http://www.w3.org/2000/svg";
//hook up minimal console api
if(typeof console == "undefined"){
console = {};
- ["log","info","error","dirxml"].forEach(function(m){console[m] = console[m] || function(){} });
+ ["log","info","error"].forEach(function(m){console[m] = console[m] || function(){} });
}
- //the steps 1-7 referenced here are described in full detail in src/main/coffeescript/util/browser/parseOnLoad.coffee
- require(["scxml/SCXML","util/annotate-scxml-json","scxml/json2model","scxml/event","lib/JsonML_DOM"],function(scxml,jsonAnnotator,json2model,Event,JsonML){
- var BrowserInterpreter = scxml.BrowserInterpreter;
-
- //step 1 - get the scxml document
- jQuery.get("drag-and-drop2.xml" , function(scxmlToTransform, textStatus, jqXHR){
-
- console.log("scxmlToTransform",scxmlToTransform);
+ //step 1 - get the scxml document
+ jQuery.get("drag-and-drop2.xml" , function(scxmlToTransform, textStatus, jqXHR){
- //step 2 - transform scxmlToTransform to JSON
- var arr = JsonML.parseDOM(scxmlToTransform);
- var scxmlJson = arr[1];
- console.log("scxmlJson",scxmlJson);
+ console.log("scxmlToTransform",scxmlToTransform);
- //step 3 - transform the parsed JSON model so it is friendlier to interpretation
- var annotatedScxmlJson = jsonAnnotator(scxmlJson);
- console.log("annotatedScxmlJson",annotatedScxmlJson);
+ //step 2 - transform scxmlToTransform to JSON
+ var arr = JsonML.parseDOM(scxmlToTransform);
+ var scxmlJson = arr[1];
+ console.log("scxmlJson",scxmlJson);
- //step 4 - initialize sc object model
- var model = json2model(annotatedScxmlJson);
- console.log("model",model);
+ //step 3 - transform the parsed JSON model so it is friendlier to interpretation
+ var annotatedScxmlJson = scion.annotator.transform(scxmlJson,true,true,true,true);
+ console.log("annotatedScxmlJson",annotatedScxmlJson);
+ //step 4 - initialize sc object model
+ var model = scion.json2model(annotatedScxmlJson);
+ console.log("model",model);
- //just for fun, random color generator, courtesy of http://stackoverflow.com/questions/1484506/random-color-generator-in-javascript
- function get_random_color() {
- var letters = '0123456789ABCDEF'.split('');
- var color = '#';
- for (var i = 0; i < 6; i++ ) {
- color += letters[Math.round(Math.random() * 15)];
- }
- return color;
+ //just for fun, random color generator, courtesy of http://stackoverflow.com/questions/1484506/random-color-generator-in-javascript
+ function get_random_color() {
+ var letters = '0123456789ABCDEF'.split('');
+ var color = '#';
+ for (var i = 0; i < 6; i++ ) {
+ color += letters[Math.round(Math.random() * 15)];
}
-
- //hook up button UI control
- elementButton.addEventListener("click",function(e){
-
- //do DOM stuff- create new blue circle
- var newGNode = document.createElementNS(SVG_NS,"g");
- var newTextNode = document.createElementNS(SVG_NS,"text");
- var newNode = document.createElementNS(SVG_NS,"circle");
- newNode.setAttributeNS(null,"cx",50);
- newNode.setAttributeNS(null,"cy",50);
- newNode.setAttributeNS(null,"r",50);
- newNode.setAttributeNS(null,"fill",get_random_color());
- newNode.setAttributeNS(null,"stroke","black");
-
- newGNode.appendChild(newNode);
- newGNode.appendChild(newTextNode);
-
- //step 5 - instantiate statechart
- var interpreter = new BrowserInterpreter(model,
- {
- //globalEval is used to execute any top-level script children of the scxml element
- //use of jQuery's global-eval is optional
- //TODO: cite that blog post about global-eval
- globalEval : jQuery.globalEval
- });
- console.log("interpreter",interpreter);
-
- //step 6 - connect all relevant event listeners
- ["mousedown","mouseup","mousemove"].forEach(function(eventName){
- newGNode.addEventListener( eventName, function(e){
- e.preventDefault();
- interpreter.gen(new Event(eventName,e))
- },false)
+ return color;
+ }
+
+ //hook up button UI control
+ elementButton.addEventListener("click",function(e){
+
+ //do DOM stuff- create new blue circle
+ var newGNode = document.createElementNS(SVG_NS,"g");
+ var newTextNode = document.createElementNS(SVG_NS,"text");
+ var newNode = document.createElementNS(SVG_NS,"circle");
+ newNode.setAttributeNS(null,"cx",50);
+ newNode.setAttributeNS(null,"cy",50);
+ newNode.setAttributeNS(null,"r",50);
+ newNode.setAttributeNS(null,"fill",get_random_color());
+ newNode.setAttributeNS(null,"stroke","black");
+
+ newGNode.appendChild(newNode);
+ newGNode.appendChild(newTextNode);
+
+ //step 5 - instantiate statechart
+ var interpreter = new scion.scxml.BrowserInterpreter(model,
+ {
+ //globalEval is used to execute any top-level script children of the scxml element
+ //use of jQuery's global-eval is optional
+ //TODO: cite that blog post about global-eval
+ globalEval : jQuery.globalEval
});
-
- //step 7 - start statechart
- interpreter.start()
-
- //step 8 - initialize his variables by sending an "init" event and passing the nodes in as data
- interpreter.gen(new Event("init",{rawNode:newGNode,textNode:newTextNode}));
-
- svgCanvas.appendChild(newGNode);
- },false);
-
- },"xml");
- });
+ console.log("interpreter",interpreter);
+
+ //step 6 - connect all relevant event listeners
+ ["mousedown","mouseup","mousemove"].forEach(function(eventName){
+ newGNode.addEventListener( eventName, function(e){
+ e.preventDefault();
+ interpreter.gen({name : eventName,data: e});
+ },false)
+ });
+
+ //step 7 - start statechart
+ interpreter.start()
+
+ //step 8 - initialize his variables by sending an "init" event and passing the nodes in as data
+ interpreter.gen({name : "init", data : {rawNode:newGNode,textNode:newTextNode}});
+
+ svgCanvas.appendChild(newGNode);
+ },false);
+
+ },"xml");
]]></script>
</body>
</html>
@@ -50,9 +50,10 @@
</style>
- <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
- <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/require.js/1.0.1/require.min.js"></script>
- <script type="text/javascript" src="http://jbeard4.github.com/SCION/builds/scion-browser-0.1.js"></script>
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
+ <script src="https://raw.github.com/mckamey/jsonml/master/jsonml-dom.js"></script>
+ <script type="text/javascript" src="/scion.js"></script>
<script src="lib/jquery.svg.js" type="text/javascript"></script>
<script src="lib/jquery.svgdom.js" type="text/javascript"></script>
@@ -151,72 +152,69 @@
})
+ var scion = require('scion');
//the steps 1-7 referenced here are described in full detail in src/main/coffeescript/util/browser/parseOnLoad.coffee
- require(["scxml/SCXML","util/annotate-scxml-json","scxml/json2model","scxml/event","lib/JsonML_DOM"],function(scxml,jsonAnnotator,json2model,SCEvent,JsonML){
- var BrowserInterpreter = scxml.BrowserInterpreter;
-
- function hookUpDOMEvents(node,interpreter){
- //hook up DOM events
- ["mousedown","mouseup","mousemove"].forEach(function(eventName){
- node.addEventListener(eventName,function(e){
- e.preventDefault();
- interpreter.gen(new SCEvent(eventName,e));
- },false);
- });
- }
-
-
- //step 1 - get the scxml document
- jQuery.get("behaviour/canvas.xml" , function(scxmlToTransform, textStatus, jqXHR){
-
- console.log("scxmlToTransform",scxmlToTransform);
-
- //step 2 - transform scxmlToTransform to JSON
- var arr = JsonML.parseDOM(scxmlToTransform);
- var scxmlJson = arr[1];
- console.log("scxmlJson",scxmlJson);
-
- //step 3 - transform the parsed JSON model so it is friendlier to interpretation
- var annotatedScxmlJson = jsonAnnotator(scxmlJson);
- console.log("annotatedScxmlJson",annotatedScxmlJson);
-
- //step 4 - initialize sc object model
- var model = json2model(annotatedScxmlJson);
- console.log("model",model);
-
- //step 5 - instantiate statechart
- var interpreter = new BrowserInterpreter(model,
- {
- //globalEval is used to execute any top-level script children of the scxml element
- //use of jQuery's global-eval is optional
- //TODO: cite that blog post about global-eval
- globalEval : jQuery.globalEval
- });
- console.log("interpreter",interpreter);
-
-
- svg.statechart = interpreter; //hook up dom node reference
-
- //step 7 - start statechart
- interpreter.start()
-
- hookUpDOMEvents(svg.root(),interpreter);
- hookUpDOMEvents(toolbar.root(),interpreter);
-
- //pass in reference to rect
- interpreter.gen(new SCEvent("init",{
- svg:svg,
- transformModule:svgLib,
- scaleHandle:scaleHandle,
- rotationHandle:rotationHandle,
- ellipseButton:ellipseButton,
- rectButton:rectButton,
- transformButton:transformButton,
- ellipseIcon:ellipseButtonIcon,
- rectIcon:rectButtonIcon,
- transformIcon:transformButtonIcon
- }));
+ function hookUpDOMEvents(node,interpreter){
+ //hook up DOM events
+ ["mousedown","mouseup","mousemove"].forEach(function(eventName){
+ node.addEventListener(eventName,function(e){
+ e.preventDefault();
+ interpreter.gen({name : eventName,data : e});
+ },false);
});
+ }
+
+
+ //step 1 - get the scxml document
+ jQuery.get("behaviour/canvas.xml" , function(scxmlToTransform, textStatus, jqXHR){
+
+ console.log("scxmlToTransform",scxmlToTransform);
+
+ //step 2 - transform scxmlToTransform to JSON
+ var arr = JsonML.parseDOM(scxmlToTransform);
+ var scxmlJson = arr[1];
+ console.log("scxmlJson",scxmlJson);
+
+ //step 3 - transform the parsed JSON model so it is friendlier to interpretation
+ var annotatedScxmlJson = scion.annotator.transform(scxmlJson,true,true,true,true);
+ console.log("annotatedScxmlJson",annotatedScxmlJson);
+
+ //step 4 - initialize sc object model
+ var model = scion.json2model(annotatedScxmlJson);
+ console.log("model",model);
+
+ //step 5 - instantiate statechart
+ var interpreter = new scion.scxml.BrowserInterpreter(model,
+ {
+ //globalEval is used to execute any top-level script children of the scxml element
+ //use of jQuery's global-eval is optional
+ //TODO: cite that blog post about global-eval
+ globalEval : jQuery.globalEval
+ });
+ console.log("interpreter",interpreter);
+
+
+ svg.statechart = interpreter; //hook up dom node reference
+
+ //step 7 - start statechart
+ interpreter.start()
+
+ hookUpDOMEvents(svg.root(),interpreter);
+ hookUpDOMEvents(toolbar.root(),interpreter);
+
+ //pass in reference to rect
+ interpreter.gen({name : "init", data : {
+ svg:svg,
+ transformModule:svgLib,
+ scaleHandle:scaleHandle,
+ rotationHandle:rotationHandle,
+ ellipseButton:ellipseButton,
+ rectButton:rectButton,
+ transformButton:transformButton,
+ ellipseIcon:ellipseButtonIcon,
+ rectIcon:rectButtonIcon,
+ transformIcon:transformButtonIcon
+ }});
});
}
File renamed without changes.
Oops, something went wrong.

0 comments on commit 7978331

Please sign in to comment.