Merge pull request #118 from mencio/pi-fixes

Fixed issues with Properties panel, focus and grid redraw

9 files changed, 126 insertions, 115 deletions

diff --git a/js/components/focus-manager.reel/focus-manager.js b/js/components/focus-manager.reel/focus-manager.js
new file mode 100644
index 00000000..65a84bc1
--- /dev/null
+++ b/js/components/focus-manager.reel/focus-manager.js
@@ -0,0 +1,49 @@
+/* <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.FocusManager = Montage.create(Component, {
+
+    hasTemplate: {
+        value: false
+    },
+
+    element: {
+        serializable: true,
+        enumerable: true,
+        get: function() {
+            return this._element;
+        },
+        set: function(value) {
+            // call super set
+            Object.getPropertyDescriptor(Component, "element").set.call(this, value);
+        }
+    },
+
+    hiddenInput: {
+        value: null
+    },
+
+    prepareForDraw: {
+        value: function() {
+            this.hiddenInput = document.createElement("input");
+            this.hiddenInput.type = "text";
+
+            this.element.appendChild(this.hiddenInput);
+
+        }
+    },
+
+    setFocus: {
+        value: function() {
+            this.hiddenInput.focus();
+        }
+    }
+
+});
+
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 9f00604f..70aba54e 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -51,23 +51,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
 
     setAttribute: {
         value: function(el, att, value) {
-            if(att === "id") {
-                if(value === "") {
-                    el.setAttribute(att, value);
-                    return;
-                }
-
-                // Then check if this is a valid id by the following spec: http://www.w3.org/TR/REC-html40/types.html#h-6.2
-                var regexID = /^([a-zA-Z])+([a-zA-Z0-9_\.\:\-])+/;
-                if(!regexID.test(value)) {
-                    alert("Invalid ID");
-                    return;
-                } else if (this.application.ninja.currentDocument._document.getElementById(value) !== null) {
-                    alert("The following ID: " + value + " is already in Use");
-                }
-
-            }
-
             el.setAttribute(att, value);
         }
     },
diff --git a/js/ninja.reel/ninja.css b/js/ninja.reel/ninja.css
index 83c0e569..61251eff 100755
--- a/js/ninja.reel/ninja.css
+++ b/js/ninja.reel/ninja.css
@@ -7,3 +7,7 @@
 .main {
     padding: 100px;
 }
+
+.hidden {
+    display: none;
+}
diff --git a/js/ninja.reel/ninja.html b/js/ninja.reel/ninja.html
index 3dc45498..f9e1efdd 100755
--- a/js/ninja.reel/ninja.html
+++ b/js/ninja.reel/ninja.html
@@ -287,6 +287,13 @@
                 "name": "MainMenuController"
             },
 
+            "focusManager": {
+                "object": "js/components/focus-manager.reel",
+                "properties": {
+                    "element": {"#": "focus-container" }
+                }
+            },
+
             "owner": {
                 "module": "js/ninja.reel",
                 "name": "Ninja",
@@ -396,7 +403,9 @@
 
             <section data-montage-id="bottomSplitter" class="bottomSplitter splitter"></section>
         </section>
-        
+
+        <div data-montage-id="focus-container" class="hidden"></div>
+
         <section id="popupWindows"></section>
 
     </div>
diff --git a/js/panels/Splitter.js b/js/panels/Splitter.js
index a396ea28..e92cb2dd 100755
--- a/js/panels/Splitter.js
+++ b/js/panels/Splitter.js
@@ -91,12 +91,6 @@ exports.Splitter = Montage.create(Component, {
         }
     },
 
-    didDraw: {
-        value: function() {
-            this.application.ninja.stage.resizeCanvases = true;
-        }
-    },
-
     handleClick : {
         value: function() {
             if (!this.disabled) {
diff --git a/js/panels/properties.reel/properties.html b/js/panels/properties.reel/properties.html
index 72a6def6..d212ae80 100755
--- a/js/panels/properties.reel/properties.html
+++ b/js/panels/properties.reel/properties.html
@@ -10,35 +10,19 @@
         <link rel="stylesheet" href="properties.css" type="text/css">
         <script type="text/montage-serialization">
         {
-            "elementNameInput1": {
-                "module": "montage/ui/textfield.reel",
-                "name": "Textfield",
+            "elementName": {
+                "prototype": "montage/ui/textfield.reel",
                 "properties": {
                     "element": {"#": "elementName"},
                     "readOnly": true
-                },
-                "bindings": {
-                    "value": {
-                        "boundObject": {"@": "owner"},
-                        "boundObjectPropertyPath": "elementName",
-                        "oneway": true
-                    }
                 }
             },
 
-            "elementID": {
-                "module": "montage/ui/textfield.reel",
-                "name": "Textfield",
+            "elementId": {
+                "prototype": "montage/ui/textfield.reel",
                 "properties": {
-                    "element": {"#": "elementID"},
+                    "element": {"#": "elementId"},
                     "readOnly": false
-                },
-                "bindings": {
-                    "value": {
-                        "boundObject": {"@": "owner"},
-                        "boundObjectPropertyPath": "elementID",
-                        "oneway": true
-                    }
                 }
             },
 
@@ -46,35 +30,11 @@
                 "module": "montage/ui/textfield.reel",
                 "name": "Textfield",
                 "properties": {
-                    "element": {"#": "elementClassName"},
+                    "element": {"#": "elementClass"},
                     "readOnly": false
-                },
-                "bindings": {
-                    "value": {
-                        "boundObject": {"@": "owner"},
-                        "boundObjectPropertyPath": "elementClassName",
-                        "oneway": true
-                    }
-                }
-            },
-
-            "elementNameAttribute": {
-                "module": "montage/ui/textfield.reel",
-                "name": "Textfield",
-                "properties": {
-                    "element": {"#": "elementNameAttribute"},
-                    "readOnly": false
-                },
-                "bindings": {
-                    "value": {
-                        "boundObject": {"@": "owner"},
-                        "boundObjectPropertyPath": "nameAttribute",
-                        "oneway": false