4 files changed, 55 insertions, 7 deletions
diff --git a/js/document/document-html.js b/js/document/document-html.js
index aded9241..b9c8e797 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -36,7 +36,7 @@ exports.HtmlDocument = Montage.create(Component, {
        ////////////////////////////////////////////////////////////////////
        //
    exclusionList: {
-        value: ["HTML", "BODY", "NINJA-CONTENT"]
+        value: ["HTML", "BODY", "NINJA-CONTENT", "NINJA-VIEWPORT"]
    },
    ////////////////////////////////////////////////////////////////////
        //
diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js
index 50fad1c3..c5b46c3a 100755
--- a/js/document/mediators/template.js
+++ b/js/document/mediators/template.js
@@ -145,6 +145,29 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
                                        template.file.content.document.body.setAttribute(template.body.attributes[n].name, template.body.attributes[n].value);
                                }                               
                        }
+                        //
+            if(template.template) {
+                //
+                // TODO - Need to handle banner and animation templates.
+                //Copying attributes to maintain same properties as <ninja-content>
+                var ninjaContentTagMem = template.document.getElementsByTagName('ninja-content')[0], ninjaContentTagDoc = template.file.content.document.getElementsByTagName('ninja-content')[0];
+                if (ninjaContentTagMem && ninjaContentTagMem.getAttribute('data-ninja-style') !== null) {
+                    ninjaContentTagDoc.setAttribute('style', ninjaContentTagMem.getAttribute('data-ninja-style'));
+                    ninjaContentTagDoc.removeAttribute('data-ninja-style');
+                } else if (ninjaContentTagMem && ninjaContentTagMem.getAttribute('data-ninja-style') === null) {
+                    ninjaContentTagDoc.removeAttribute('style');
+                    ninjaContentTagDoc.removeAttribute('data-ninja-style');
+                }
+            } else {
+                if (template.body && template.body.getAttribute('data-ninja-style') !== null) {
+                    template.file.content.document.body.setAttribute('style', template.body.getAttribute('data-ninja-style'));
+                    template.file.content.document.body.removeAttribute('data-ninja-style');
+                } else if (template.body && template.body.getAttribute('data-ninja-style') === null) {
+                    template.file.content.document.body.removeAttribute('style');
+                    template.file.content.document.body.removeAttribute('data-ninja-style');
+                }
+            }
                        wipeAttributes(template.file.content.document.head);
            //Copying attributes to maintain same properties as the <head>
                        for (var m in template.document.head.attributes) {
@@ -155,6 +178,7 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
            //Copying attributes to maintain same properties as the <html>
                        var htmlTagMem = template.document.getElementsByTagName('html')[0], htmlTagDoc = template.file.content.document.getElementsByTagName('html')[0];
                        wipeAttributes(htmlTagDoc);
+                        //
                        for (var m in htmlTagMem.attributes) {
                                if (htmlTagMem.attributes[m].value) {
                                        if (htmlTagMem.attributes[m].value.replace(/montage-app-bootstrapping/gi, '').length>0) {
@@ -162,10 +186,19 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
                                        }
                                }
                        }
+                        //
+                        if (htmlTagMem && htmlTagMem.getAttribute('data-ninja-style') !== null) {
+                        htmlTagDoc.setAttribute('style', htmlTagMem.getAttribute('data-ninja-style'));
+                                htmlTagDoc.removeAttribute('data-ninja-style');
+                        } else if (htmlTagMem && htmlTagMem.getAttribute('data-ninja-style') === null) {
+                                htmlTagDoc.removeAttribute('style');
+                                htmlTagDoc.removeAttribute('data-ninja-style');
+                        }
            //Getting list of current nodes (Ninja DOM)
            presentNodes = template.file.content.document.getElementsByTagName('*');
            //Looping through nodes to determine origin and removing if not inserted by Ninja
            for (var n in presentNodes) {
+                        //
                        if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') === null) {
                                toremovetags.push(presentNodes[n]);     
                        } else if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') !== null) {
diff --git a/js/document/templates/app/main.js b/js/document/templates/app/main.js
index 0cdf718c..8dc05ba5 100644
--- a/js/document/templates/app/main.js
+++ b/js/document/templates/app/main.js
@@ -61,13 +61,15 @@ exports.Main = Montage.create(Component, {
                        var componentRequire = component[data.name];
                        var componentInstance = componentRequire.create();
-                        componentInstance.element = element;
+                        componentInstance.addEventListener("firstDraw", self, false);
+                        componentInstance.element = element;
                        componentInstance.needsDraw = true;
                        componentInstance.ownerComponent = self;
                        self.componentToInsert = componentInstance;
-                        componentInstance.addEventListener("firstDraw", self, false);
                        callback(componentInstance, element);
                    })
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 1a5b071e..44c61617 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -280,7 +280,9 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
                //Removing loading container (should be removed)
                this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]);
                        //Getting style and link tags in document
-            var stags = this.document.getElementsByTagName('style'),
+            var htags = this.document.getElementsByTagName('html'),
+                userStyles,
+                stags = this.document.getElementsByTagName('style'),
                ltags = this.document.getElementsByTagName('link'), i, orgNodes,
                scripttags = this.document.getElementsByTagName('script');
                //Temporarily checking for disabled special case (we must enabled for Ninja to access styles)
@@ -319,7 +321,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
                //Else there is not data to parse
                if(this._viewCallback) {
                    this._viewCallback.viewCallback.call(this._viewCallback.context);
-            }
+                }
            }
            //TODO: Verify appropiate location for this operation
                if (this._template && this._template.type === 'banner') {
@@ -335,8 +337,19 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
                for (var n in orgNodes) {
                        if (orgNodes[n].getAttribute) orgNodes[n].setAttribute('data-ninja-node', 'true');
                }
-                
-                //Makign callback if specified
+            // Save initial HTML and Body/ninja-content style attributes so we don't override them on save
+            if(htags.length) {
+                if(userStyles = htags[0].getAttribute('style')) {
+                    htags[0].setAttribute('data-ninja-style', userStyles);
+                }
+            }
+            if(this.documentRoot) {
+                if(userStyles = this.documentRoot.getAttribute('style')) {
+                    this.documentRoot.setAttribute('data-ninja-style', userStyles);
+                }
+            }
+                //Making callback if specified
                if (this._callback) this._callback();
        }
    },

diff --git a/js/document/document-html.js b/js/document/document-html.js index aded9241..b9c8e797 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js
@@ -36,7 +36,7 @@ exports.HtmlDocument = Montage.create(Component, {
36	////////////////////////////////////////////////////////////////////	36	////////////////////////////////////////////////////////////////////
37	//	37	//
38	exclusionList: {	38	exclusionList: {
39	value: ["HTML", "BODY", "NINJA-CONTENT"]	39	value: ["HTML", "BODY", "NINJA-CONTENT", "NINJA-VIEWPORT"]
40	},	40	},
41	////////////////////////////////////////////////////////////////////	41	////////////////////////////////////////////////////////////////////
42	//	42	//


diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js index 50fad1c3..c5b46c3a 100755 --- a/js/document/mediators/template.js +++ b/js/document/mediators/template.js
@@ -145,6 +145,29 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
145	template.file.content.document.body.setAttribute(template.body.attributes[n].name, template.body.attributes[n].value);	145	template.file.content.document.body.setAttribute(template.body.attributes[n].name, template.body.attributes[n].value);
146	}	146	}
147	}	147	}
		148	//
		149	if(template.template) {
		150	//
		151	// TODO - Need to handle banner and animation templates.
		152	//Copying attributes to maintain same properties as <ninja-content>
		153	var ninjaContentTagMem = template.document.getElementsByTagName('ninja-content')[0], ninjaContentTagDoc = template.file.content.document.getElementsByTagName('ninja-content')[0];
		154	if (ninjaContentTagMem && ninjaContentTagMem.getAttribute('data-ninja-style') !== null) {
		155	ninjaContentTagDoc.setAttribute('style', ninjaContentTagMem.getAttribute('data-ninja-style'));
		156	ninjaContentTagDoc.removeAttribute('data-ninja-style');
		157	} else if (ninjaContentTagMem && ninjaContentTagMem.getAttribute('data-ninja-style') === null) {
		158	ninjaContentTagDoc.removeAttribute('style');
		159	ninjaContentTagDoc.removeAttribute('data-ninja-style');
		160	}
		161	} else {
		162	if (template.body && template.body.getAttribute('data-ninja-style') !== null) {
		163	template.file.content.document.body.setAttribute('style', template.body.getAttribute('data-ninja-style'));
		164	template.file.content.document.body.removeAttribute('data-ninja-style');
		165	} else if (template.body && template.body.getAttribute('data-ninja-style') === null) {
		166	template.file.content.document.body.removeAttribute('style');
		167	template.file.content.document.body.removeAttribute('data-ninja-style');
		168	}
		169	}
		170
148	wipeAttributes(template.file.content.document.head);	171	wipeAttributes(template.file.content.document.head);
149	//Copying attributes to maintain same properties as the <head>	172	//Copying attributes to maintain same properties as the <head>
150	for (var m in template.document.head.attributes) {	173	for (var m in template.document.head.attributes) {
@@ -155,6 +178,7 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
155	//Copying attributes to maintain same properties as the <html>	178	//Copying attributes to maintain same properties as the <html>
156	var htmlTagMem = template.document.getElementsByTagName('html')[0], htmlTagDoc = template.file.content.document.getElementsByTagName('html')[0];	179	var htmlTagMem = template.document.getElementsByTagName('html')[0], htmlTagDoc = template.file.content.document.getElementsByTagName('html')[0];
157	wipeAttributes(htmlTagDoc);	180	wipeAttributes(htmlTagDoc);
		181	//
158	for (var m in htmlTagMem.attributes) {	182	for (var m in htmlTagMem.attributes) {
159	if (htmlTagMem.attributes[m].value) {	183	if (htmlTagMem.attributes[m].value) {
160	if (htmlTagMem.attributes[m].value.replace(/montage-app-bootstrapping/gi, '').length>0) {	184	if (htmlTagMem.attributes[m].value.replace(/montage-app-bootstrapping/gi, '').length>0) {
@@ -162,10 +186,19 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
162	}	186	}
163	}	187	}
164	}	188	}
		189	//
		190	if (htmlTagMem && htmlTagMem.getAttribute('data-ninja-style') !== null) {
		191	htmlTagDoc.setAttribute('style', htmlTagMem.getAttribute('data-ninja-style'));
		192	htmlTagDoc.removeAttribute('data-ninja-style');
		193	} else if (htmlTagMem && htmlTagMem.getAttribute('data-ninja-style') === null) {
		194	htmlTagDoc.removeAttribute('style');
		195	htmlTagDoc.removeAttribute('data-ninja-style');
		196	}
165	//Getting list of current nodes (Ninja DOM)	197	//Getting list of current nodes (Ninja DOM)
166	presentNodes = template.file.content.document.getElementsByTagName('*');	198	presentNodes = template.file.content.document.getElementsByTagName('*');
167	//Looping through nodes to determine origin and removing if not inserted by Ninja	199	//Looping through nodes to determine origin and removing if not inserted by Ninja
168	for (var n in presentNodes) {	200	for (var n in presentNodes) {
		201	//
169	if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') === null) {	202	if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') === null) {
170	toremovetags.push(presentNodes[n]);	203	toremovetags.push(presentNodes[n]);
171	} else if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') !== null) {	204	} else if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') !== null) {


diff --git a/js/document/templates/app/main.js b/js/document/templates/app/main.js index 0cdf718c..8dc05ba5 100644 --- a/js/document/templates/app/main.js +++ b/js/document/templates/app/main.js
@@ -61,13 +61,15 @@ exports.Main = Montage.create(Component, {
61	var componentRequire = component[data.name];	61	var componentRequire = component[data.name];
62	var componentInstance = componentRequire.create();	62	var componentInstance = componentRequire.create();
63		63
64	componentInstance.element = element;
65		64
		65	componentInstance.addEventListener("firstDraw", self, false);
		66
		67	componentInstance.element = element;
66	componentInstance.needsDraw = true;	68	componentInstance.needsDraw = true;
67	componentInstance.ownerComponent = self;	69	componentInstance.ownerComponent = self;
68		70
69	self.componentToInsert = componentInstance;	71	self.componentToInsert = componentInstance;
70	componentInstance.addEventListener("firstDraw", self, false);	72
71		73
72	callback(componentInstance, element);	74	callback(componentInstance, element);
73	})	75	})


diff --git a/js/document/views/design.js b/js/document/views/design.js index 1a5b071e..44c61617 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js
@@ -280,7 +280,9 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
280	//Removing loading container (should be removed)	280	//Removing loading container (should be removed)
281	this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]);	281	this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]);
282	//Getting style and link tags in document	282	//Getting style and link tags in document
283	var stags = this.document.getElementsByTagName('style'),	283	var htags = this.document.getElementsByTagName('html'),
		284	userStyles,
		285	stags = this.document.getElementsByTagName('style'),
284	ltags = this.document.getElementsByTagName('link'), i, orgNodes,	286	ltags = this.document.getElementsByTagName('link'), i, orgNodes,
285	scripttags = this.document.getElementsByTagName('script');	287	scripttags = this.document.getElementsByTagName('script');
286	//Temporarily checking for disabled special case (we must enabled for Ninja to access styles)	288	//Temporarily checking for disabled special case (we must enabled for Ninja to access styles)
@@ -319,7 +321,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
319	//Else there is not data to parse	321	//Else there is not data to parse
320	if(this._viewCallback) {	322	if(this._viewCallback) {
321	this._viewCallback.viewCallback.call(this._viewCallback.context);	323	this._viewCallback.viewCallback.call(this._viewCallback.context);
322	}	324	}
323	}	325	}
324	//TODO: Verify appropiate location for this operation	326	//TODO: Verify appropiate location for this operation
325	if (this._template && this._template.type === 'banner') {	327	if (this._template && this._template.type === 'banner') {
@@ -335,8 +337,19 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
335	for (var n in orgNodes) {	337	for (var n in orgNodes) {
336	if (orgNodes[n].getAttribute) orgNodes[n].setAttribute('data-ninja-node', 'true');	338	if (orgNodes[n].getAttribute) orgNodes[n].setAttribute('data-ninja-node', 'true');
337	}	339	}
338		340
339	//Makign callback if specified	341	// Save initial HTML and Body/ninja-content style attributes so we don't override them on save
		342	if(htags.length) {
		343	if(userStyles = htags[0].getAttribute('style')) {
		344	htags[0].setAttribute('data-ninja-style', userStyles);
		345	}
		346	}
		347	if(this.documentRoot) {
		348	if(userStyles = this.documentRoot.getAttribute('style')) {
		349	this.documentRoot.setAttribute('data-ninja-style', userStyles);
		350	}
		351	}
		352	//Making callback if specified
340	if (this._callback) this._callback();	353	if (this._callback) this._callback();
341	}	354	}
342	},	355	},