4 files changed, 142 insertions, 14 deletions

diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index b9c033aa..640119c4 100644
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -346,19 +346,24 @@ exports.ShapesController = Montage.create(CanvasController, {
             {
                 world = new GLWorld(el, true);
                 el.elementModel.shapeModel.GLWorld = world;
-                el.elementModel.shapeModel.GLGeomObj.setWorld(world);
                 el.elementModel.shapeModel.useWebGl = true;
+                world.import(worldData);
+                el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot();
+
                 sm = Object.create(MaterialsLibrary.getMaterial("FlatMaterial"));
-                fm = Object.create(MaterialsLibrary.getMaterial("FlatMaterial"));
-                if(sm && fm)
+                if(sm)
                 {
                     el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(sm);
-                    el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm);
                     el.elementModel.shapeModel.strokeMaterial = sm;
+                }
+                fm = Object.create(MaterialsLibrary.getMaterial("FlatMaterial"));
+                // TODO - Use consts after GL code is converted to object literal notation
+//                if( fm && (el.elementModel.shapeModel.GLGeomObj.geomType() !== GLGeomObj.GEOM_TYPE_LINE) )
+                if( fm && (el.elementModel.shapeModel.GLGeomObj.geomType() !== 3) )
+                {
+                    el.elementModel.shapeModel.GLGeomObj.setFillMaterial(fm);
                     el.elementModel.shapeModel.fillMaterial = fm;
-                    el.elementModel.shapeModel.GLGeomObj.buildBuffers();
                 }
-                world.import(worldData);
             }
 
         }
@@ -378,13 +383,17 @@ exports.ShapesController = Montage.create(CanvasController, {
                 world = new GLWorld(el, false);
                 el.elementModel.shapeModel.GLWorld = world;
                 el.elementModel.shapeModel.useWebGl = false;
+                world.import(worldData);
+                el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot();
                 el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(null);
-                el.elementModel.shapeModel.GLGeomObj.setFillMaterial(null);
                 el.elementModel.shapeModel.strokeMaterial = null;
-                el.elementModel.shapeModel.fillMaterial = null;
-                world.import(worldData);
+                // TODO - Use consts after GL code is converted to object literal notation
+                if(el.elementModel.shapeModel.GLGeomObj.geomType() !== 3)
+                {
+                    el.elementModel.shapeModel.GLGeomObj.setFillMaterial(null);
+                    el.elementModel.shapeModel.fillMaterial = null;
+                }
             }
-
         }
     }
 
diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js
index b8170826..af7c4858 100644
--- a/js/controllers/elements/stage-controller.js
+++ b/js/controllers/elements/stage-controller.js
@@ -75,6 +75,8 @@ exports.StageController = Montage.create(ElementController, {
     getProperty: {
         value: function(el, p) {
             switch(p) {
+                case "background" :
+                    return el.elementModel.stageBackground.style.getProperty(p);
                 case "border":
                     return el.elementModel.stageView.style.getProperty(p);
                 case "height":
@@ -92,7 +94,7 @@ exports.StageController = Montage.create(ElementController, {
         value: function(el, p, value) {
             switch(p) {
                 case "background":
-                    el.elementModel.body.style.setProperty(p, value);
+                    el.elementModel.stageBackground.style.setProperty(p, value);
                     break;
                 case "overflow":
                     el.elementModel.viewPort.style.setProperty(p, value);
diff --git a/js/controllers/main-menu-controller.js b/js/controllers/main-menu-controller.js
new file mode 100644
index 00000000..5e126617
--- /dev/null
+++ b/js/controllers/main-menu-controller.js
@@ -0,0 +1,43 @@
+/* <copyright>
+This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+(c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+</copyright> */
+
+
+var Montage = require("montage/core/core").Montage,
+    Component = require("montage/ui/component").Component;
+
+exports.MainMenuController = Montage.create(Component, {
+    deserializedFromTemplate:{
+        value:function () {
+            this.eventManager.addEventListener("executeHelpFAQ", this, false);
+            this.eventManager.addEventListener("executeHelpForums", this, false);
+            this.eventManager.addEventListener("executeHelpTopics", this, false);
+            this.eventManager.addEventListener("executeHelpAbout", this, false);
+        }
+    },
+
+    // Basic help menu handling methods
+    handleExecuteHelpFAQ:{
+        value:function () {
+            window.open('http://www.tetsubo.org/go/ninjafaq');
+        }
+    },
+    handleExecuteHelpForums:{
+        value:function () {
+            window.open('http://www.tetsubo.org/go/ninjaforums');
+        }
+    },
+    handleExecuteHelpTopics:{
+        value:function () {
+            window.open('http://www.tetsubo.org/go/ninjadocs');
+        }
+    },
+    handleExecuteHelpAbout:{
+        value:function () {
+            // TODO
+            console.log("Pull up the about popup");
+        }
+    }
+});
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js
index 011caec5..44ca50e1 100644
--- a/js/controllers/styles-controller.js
+++ b/js/controllers/styles-controller.js
@@ -128,7 +128,7 @@ var stylesController = exports.StylesController = Montage.create(Component, {
                 } else {
                     this._defaultStylesheet = sheets[lastIndex];
                 }
-                
+
             }
         }
     },
@@ -179,10 +179,14 @@ var stylesController = exports.StylesController = Montage.create(Component, {
             this.styleSheetModified(stylesheet);
             
             rule = stylesheet.rules[index];
-            
+
             ///// attach specificity to rule object
+            ///// if rule is css keyframes, return rule and don't attach specificity
+            if (rule instanceof WebKitCSSKeyframesRule) {
+                return rule;
+            }
             rule[this.CONST.SPECIFICITY_KEY] = this.getSpecificity(rule.selectorText);
-            
+
             ///// return the rule we just inserted
             return rule;
         }
@@ -840,6 +844,61 @@ var stylesController = exports.StylesController = Montage.create(Component, {
         }
     },
 
+    ///// Get Animation Rule With Name
+    ///// Returns the CSSKeyframesRule with given name
+
+    getAnimationRuleWithName : {
+        value: function(name, document) {
+            var doc = document || this._activeDocument._document,
+                animRules = this.getDocumentAnimationRules(doc),
+                rule, i;
+
+            for(i = 0; i < animRules.length; i++) {
+                rule = animRules[i];
+                if(rule.name === name) {
+                    return rule;
+                }
+            }
+
+            return;
+        }
+    },
+
+    ///// Get Document Animation Rules
+    ///// Returns all CSSKeyframesRules in active document, or in
+    ///// optionally passed-in document
+    ///// If none are found, returns an empty array
+
+    getDocumentAnimationRules : {
+        value: function(document) {
+            var sheets = (document) ? document.styleSheets : this._activeDocument._document.styleSheets,
+                rules = [];
+
+            nj.toArray(sheets).forEach(function(sheet) {
+                rules = rules.concat(this.getStyleSheetAnimationRules(sheet));
+            }, this);
+
+            return rules;
+        }
+    },
+
+    ///// Get Style Sheet Animation Rules
+    ///// Returns all CSSKeyframesRules from the given stylesheet
+    ///// If none are found, returns an empty array
+
+    getStyleSheetAnimationRules : {
+        value: function(sheet) {
+            var rules = [];
+
+            if(sheet.rules) {