From f10bec0c594c6404eec51dc1a005f7f17570ba52 Mon Sep 17 00:00:00 2001
From: Jose Antonio Marquez
Date: Fri, 11 May 2012 10:13:27 -0700
Subject: Cleaning up template
---
js/document/templates/montage-web/index.html | 16 +++++++---------
1 file changed, 7 insertions(+), 9 deletions(-)
(limited to 'js/document')
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
index e02d8d8e..a1b8b242 100755
--- a/js/document/templates/montage-web/index.html
+++ b/js/document/templates/montage-web/index.html
@@ -15,8 +15,6 @@
-
- Ninja Prototype
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/js/document/templates/banner/main.js b/js/document/templates/banner/main.js
new file mode 100644
index 00000000..d5ac88d5
--- /dev/null
+++ b/js/document/templates/banner/main.js
@@ -0,0 +1,49 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.Main = Montage.create(Component, {
+
+ hasTemplate: {
+ value: false
+ },
+
+ /**
+ * Adding window hooks to callback into this object from Ninja.
+ */
+ templateDidLoad: {
+ value: function(){
+ var self = this;
+ window.addComponent = function(element, data, callback) {
+ var component;
+
+ component = require.async(data.path)
+ .then(function(component) {
+ var componentRequire = component[data.name];
+ var componentInstance = componentRequire.create();
+
+ componentInstance.element = element;
+
+ componentInstance.needsDraw = true;
+ componentInstance.ownerComponent = self;
+
+ callback(componentInstance, element);
+ })
+ .end();
+
+ };
+
+ // Dispatch event when this template has loaded.
+ /*
+ var newEvent = document.createEvent( "CustomEvent" );
+ newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
+ document.body.dispatchEvent( newEvent );
+ */
+
+ }
+ }
+});
\ No newline at end of file
diff --git a/js/document/templates/banner/package.json b/js/document/templates/banner/package.json
new file mode 100755
index 00000000..c8bc02fb
--- /dev/null
+++ b/js/document/templates/banner/package.json
@@ -0,0 +1,8 @@
+{
+ "directories": {
+ "lib": ""
+ },
+ "mappings": {
+ "montage": "../../../../node_modules/montage/"
+ }
+}
\ No newline at end of file
diff --git a/js/document/templates/html/index.html b/js/document/templates/html/index.html
new file mode 100755
index 00000000..a1b8b242
--- /dev/null
+++ b/js/document/templates/html/index.html
@@ -0,0 +1,78 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/js/document/templates/html/main.js b/js/document/templates/html/main.js
new file mode 100644
index 00000000..d5ac88d5
--- /dev/null
+++ b/js/document/templates/html/main.js
@@ -0,0 +1,49 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.Main = Montage.create(Component, {
+
+ hasTemplate: {
+ value: false
+ },
+
+ /**
+ * Adding window hooks to callback into this object from Ninja.
+ */
+ templateDidLoad: {
+ value: function(){
+ var self = this;
+ window.addComponent = function(element, data, callback) {
+ var component;
+
+ component = require.async(data.path)
+ .then(function(component) {
+ var componentRequire = component[data.name];
+ var componentInstance = componentRequire.create();
+
+ componentInstance.element = element;
+
+ componentInstance.needsDraw = true;
+ componentInstance.ownerComponent = self;
+
+ callback(componentInstance, element);
+ })
+ .end();
+
+ };
+
+ // Dispatch event when this template has loaded.
+ /*
+ var newEvent = document.createEvent( "CustomEvent" );
+ newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
+ document.body.dispatchEvent( newEvent );
+ */
+
+ }
+ }
+});
\ No newline at end of file
diff --git a/js/document/templates/html/package.json b/js/document/templates/html/package.json
new file mode 100755
index 00000000..c8bc02fb
--- /dev/null
+++ b/js/document/templates/html/package.json
@@ -0,0 +1,8 @@
+{
+ "directories": {
+ "lib": ""
+ },
+ "mappings": {
+ "montage": "../../../../node_modules/montage/"
+ }
+}
\ No newline at end of file
diff --git a/js/document/templates/montage-html/default_html.css b/js/document/templates/montage-html/default_html.css
deleted file mode 100755
index 04b21c6f..00000000
--- a/js/document/templates/montage-html/default_html.css
+++ /dev/null
@@ -1,74 +0,0 @@
-/*
-This file contains proprietary software owned by Motorola Mobility, Inc.
-No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
-(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
- */
-
-* {
- -webkit-transition-duration: 0s !important;
- -webkit-animation-duration: 0s !important;
- -webkit-animation-name: none !important;
-}
-
-html{
- overflow:hidden;
-}
-
-body
-{
- background: #808080;
-}
-
-#Viewport
-{
- margin: 0px;
- padding: 0px;
- top: 200px;
- left: 700px;
- /*position: absolute;*/
- /*height: 600px;*/
- /*width: 800px;*/
- opacity: 0.99;
- z-index:2;
-}
-
-#stageBG
-{
- background: #ffffff;
- top: 200px;
- left: 700px;
- z-index:1;
-}
-
-.stageDimension
-{
- position: absolute;
- height: 600px;
- width: 800px;
-}
-
-.stageView
-{
- border: 1px solid black;
- -webkit-transform-style: preserve-3d;
- -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-}
-
-.stageContentShadow {
- -webkit-box-shadow: 3px 5px 4px rgba(0,0,0,.5);
- -moz-box-shadow: 3px 5px 4px rgba(0,0,0,.5);
- box-shadow: 3px 5px 4px rgba(0,0,0,.5);
-}
-
-#userHead
-{
- display: none;
-}
-
-.active-element-outline {
- outline: #adff2f solid 2px;
-}
-
-.nj-preset-transition {
- -webkit-transition: all 450ms linear !important;
-}
\ No newline at end of file
diff --git a/js/document/templates/montage-html/index.html b/js/document/templates/montage-html/index.html
deleted file mode 100755
index 79c6cd51..00000000
--- a/js/document/templates/montage-html/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
-
-
-
-
-
-
-
- Ninja Prototype
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/js/document/templates/montage-html/main.reel/main.js b/js/document/templates/montage-html/main.reel/main.js
deleted file mode 100644
index 019c675e..00000000
--- a/js/document/templates/montage-html/main.reel/main.js
+++ /dev/null
@@ -1,48 +0,0 @@
-/*
- This file contains proprietary software owned by Motorola Mobility, Inc.
- No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
- (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
- */
-var Montage = require("montage/core/core").Montage,
- Component = require("montage/ui/component").Component;
-
-exports.Main = Montage.create(Component, {
-
- hasTemplate: {
- value: false
- },
-
- /**
- * Adding window hooks to callback into this object from Ninja.
- */
- templateDidLoad: {
- value: function(){
- var self = this;
- window.addComponent = function(element, data, callback) {
- var component;
-
- component = require.async(data.path)
- .then(function(component) {
- var componentRequire = component[data.name];
- var componentInstance = componentRequire.create();
-
- componentInstance.element = element;
-
- componentInstance.needsDraw = true;
- componentInstance.ownerComponent = self;
-
- callback(componentInstance, element);
- })
- .end();
-
- };
-
- // Dispatch event when this template has loaded.
- var newEvent = document.createEvent( "CustomEvent" );
- newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
-
- document.body.dispatchEvent( newEvent );
-
- }
- }
-});
\ No newline at end of file
diff --git a/js/document/templates/montage-html/package.json b/js/document/templates/montage-html/package.json
deleted file mode 100755
index c8bc02fb..00000000
--- a/js/document/templates/montage-html/package.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
- "directories": {
- "lib": ""
- },
- "mappings": {
- "montage": "../../../../node_modules/montage/"
- }
-}
\ No newline at end of file
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
deleted file mode 100755
index a1b8b242..00000000
--- a/js/document/templates/montage-web/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/js/document/templates/montage-web/main.js b/js/document/templates/montage-web/main.js
deleted file mode 100644
index d5ac88d5..00000000
--- a/js/document/templates/montage-web/main.js
+++ /dev/null
@@ -1,49 +0,0 @@
-/*
- This file contains proprietary software owned by Motorola Mobility, Inc.
- No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
- (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
- */
-var Montage = require("montage/core/core").Montage,
- Component = require("montage/ui/component").Component;
-
-exports.Main = Montage.create(Component, {
-
- hasTemplate: {
- value: false
- },
-
- /**
- * Adding window hooks to callback into this object from Ninja.
- */
- templateDidLoad: {
- value: function(){
- var self = this;
- window.addComponent = function(element, data, callback) {
- var component;
-
- component = require.async(data.path)
- .then(function(component) {
- var componentRequire = component[data.name];
- var componentInstance = componentRequire.create();
-
- componentInstance.element = element;
-
- componentInstance.needsDraw = true;
- componentInstance.ownerComponent = self;
-
- callback(componentInstance, element);
- })
- .end();
-
- };
-
- // Dispatch event when this template has loaded.
- /*
- var newEvent = document.createEvent( "CustomEvent" );
- newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
- document.body.dispatchEvent( newEvent );
- */
-
- }
- }
-});
\ No newline at end of file
diff --git a/js/document/templates/montage-web/package.json b/js/document/templates/montage-web/package.json
deleted file mode 100755
index c8bc02fb..00000000
--- a/js/document/templates/montage-web/package.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
- "directories": {
- "lib": ""
- },
- "mappings": {
- "montage": "../../../../node_modules/montage/"
- }
-}
\ No newline at end of file
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 321f93e8..e838dd49 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -21,11 +21,21 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
_callback: {
value: null
},
+ ////////////////////////////////////////////////////////////////////
+ //
+ _template: {
+ value: null
+ },
////////////////////////////////////////////////////////////////////
//
_document: {
value: null
},
+ ////////////////////////////////////////////////////////////////////
+ //
+ _bodyFragment: {
+ value: null
+ },
////////////////////////////////////////////////////////////////////
//
_headFragment: {
@@ -70,14 +80,20 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
////////////////////////////////////////////////////////////////////
//
render: {
- value: function (callback, template) {//TODO: Add support for templates
+ value: function (callback, template) {
+ //TODO: Remove, this is a temp patch for webRequest API gate
this.application.ninja.documentController._hackRootFlag = false;
//Storing callback for dispatch ready
this._callback = callback;
+ this._template = template;
//Adding listener to know when template is loaded to then load user content
this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false);
//TODO: Add source parameter and root (optional)
- this.iframe.src = "js/document/templates/montage-web/index.html";
+ if (template && template.type === 'banner' && template.size) {
+ this.iframe.src = "js/document/templates/banner/index.html";
+ } else {
+ this.iframe.src = "js/document/templates/html/index.html";
+ }
}
},
////////////////////////////////////////////////////////////////////
@@ -104,27 +120,63 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
this.model.baseHref = basetag[basetag.length-1].getAttribute('href');
}
}
- //Creating temp code fragement to load head
- this._headFragment = this.document.createElement('head');
- //Adding event listener to know when head is ready, event only dispatched once when using innerHTML
- this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this));
- this._observer.head.observe(this._headFragment, {childList: true});
- //Inserting HTML and parsing URLs via mediator method
- this._headFragment.innerHTML = (this.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
- //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events)
- this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this));
- this._observer.body.observe(this.document.body, {childList: true});
- //Inserting HTML and parsing URLs via mediator method
- this.document.body.innerHTML += ''+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
- //Copying attributes to maintain same properties as the
- for (var n in this.content.document.body.attributes) {
- if (this.content.document.body.attributes[n].value) {
- this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value);
+ //Checking to content to be template
+ if (this._template) {
+ if (this._template.type === 'banner') {
+ //Loading contents into a fragment
+ this._bodyFragment = this.document.createElement('body');
+ //Listening for content to be ready
+ this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this));
+ this._observer.body.observe(this._bodyFragment, {childList: true});
+ //Inserting HTML and parsing URLs via mediator method
+ this._bodyFragment.innerHTML = ''+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
+ }
+ } else {
+ //Creating temp code fragement to load head
+ this._headFragment = this.document.createElement('head');
+ //Adding event listener to know when head is ready, event only dispatched once when using innerHTML
+ this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this));
+ this._observer.head.observe(this._headFragment, {childList: true});
+ //Inserting HTML and parsing URLs via mediator method
+ this._headFragment.innerHTML = (this.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
+ //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events)
+ this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this));
+ this._observer.body.observe(this.document.body, {childList: true});
+ //Inserting HTML and parsing URLs via mediator method
+ this.document.body.innerHTML += ''+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
+ //Copying attributes to maintain same properties as the
+ for (var n in this.content.document.body.attributes) {
+ if (this.content.document.body.attributes[n].value) {
+ this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value);
+ }
}
+ //TODO: Add attribute copying for and
}
- //TODO: Add attribute copying for and
}
},
+ ////////////////////////////////////////////////////////////////////
+ //
+ insertBannerContent: {
+ value: function (e) {
+ //Getting first element in DOM (assumes it's root)
+ var banner = this._bodyFragment.getElementsByTagName('*')[1],
+ ninjaBanner = this.document.body.getElementsByTagName('ninja-banner')[0];
+ //Copying attributes to maintain same properties as the banner root
+ for (var n in banner.attributes) {
+ if (banner.attributes[n].value) {
+ ninjaBanner.setAttribute(banner.attributes[n].name, banner.attributes[n].value);
+ }
+ }
+ //Adjusting margin per size of document
+ this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-banner {margin-top: -'+Math.floor(this._template.size.height/2)+'px; margin-left: -'+Math.floor(this._template.size.width/2)+'px}';
+ //Setting content in template
+ ninjaBanner.innerHTML = banner.innerHTML;
+ //Garbage collection
+ this._bodyFragment = null;
+ //Calling standard method to finish opening document
+ this.bodyContentLoaded(null);
+ }
+ },
////////////////////////////////////////////////////////////////////
//
insertHeadContent: {
--
cgit v1.2.3