aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/document-controller.js16
-rwxr-xr-xjs/document/document-html.js7
-rwxr-xr-xjs/document/templates/banner/index.html46
-rwxr-xr-xjs/document/views/design.js8
-rwxr-xr-xjs/helper-classes/3D/view-utils.js6
-rwxr-xr-xjs/io/templates/files/banner.txt15
-rw-r--r--js/mediators/io-mediator.js3
-rwxr-xr-xjs/stage/stage-deps.js4
8 files changed, 67 insertions, 38 deletions
diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index 0a91ae29..48ceb21b 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -95,11 +95,14 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
95 value: function (request) { 95 value: function (request) {
96 //TODO: Check if frameId is proper 96 //TODO: Check if frameId is proper
97 if (this._hackRootFlag && request.parentFrameId !== -1) { 97 if (this._hackRootFlag && request.parentFrameId !== -1) {
98 //TODO: Optimize creating string 98 //Checking for proper URL redirect (from different directories)
99 //console.log(request); 99 if (request.url.indexOf('js/document/templates/banner') !== -1) {
100 //console.log(this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1], request.url); 100 return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/banner/'))[1]};
101 //return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split('/')[request.url.split('/').length-1]}; 101 } else if (request.url.indexOf('js/document/templates/html') !== -1) {
102 return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/'))[1]}; 102 return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/html/'))[1]};
103 } else {
104 //Error, not a valid folder
105 }
103 } 106 }
104 } 107 }
105 }, 108 },
@@ -683,8 +686,9 @@ if(this.activeDocument && this.application.ninja.coreIoApi.cloudAvailable()){
683 } 686 }
684 687
685 if(needsRule) { 688 if(needsRule) {
686 rule = sc.addRule('body{}'); 689 rule = sc.addRule('.ninja-body{}');
687 sc.setStyles(rule, styles); 690 sc.setStyles(rule, styles);
691 sc.addClass(docRoot, "ninja-body");
688 } 692 }
689 } 693 }
690 } 694 }
diff --git a/js/document/document-html.js b/js/document/document-html.js
index 7e1f1806..9bbea4c9 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -100,15 +100,14 @@ exports.HtmlDocument = Montage.create(Component, {
100 this._document = this.model.views.design.document; 100 this._document = this.model.views.design.document;
101 //TODO: Remove usage, seems as not needed 101 //TODO: Remove usage, seems as not needed
102 if (template && template.type === 'banner') { 102 if (template && template.type === 'banner') {
103 //this.documentRoot = this.model.views.design.document.body; 103 this.documentRoot = this.model.views.design.document.body.getElementsByTagName('ninja-content')[0];
104 this.documentRoot = this.model.views.design.document.body.getElementsByTagName('ninja-banner')[0];
105 } else { 104 } else {
106 this.documentRoot = this.model.views.design.document.body; 105 this.documentRoot = this.model.views.design.document.body;
107 } 106 }
108 //TODO: Why is this needed? 107 //TODO: Why is this needed?
109 this._liveNodeList = this.model.views.design.document.body.getElementsByTagName('*'); 108 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
110 //Initiliazing document model 109 //Initiliazing document model
111 document.application.njUtils.makeElementModel(this.model.views.design.document.body, "Body", "body"); 110 document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body");
112 //Adding observer to know when template is ready 111 //Adding observer to know when template is ready
113 this._observer = new WebKitMutationObserver(this.handleTemplateReady.bind(this)); 112 this._observer = new WebKitMutationObserver(this.handleTemplateReady.bind(this));
114 this._observer.observe(this.model.views.design.document.head, {childList: true}); 113 this._observer.observe(this.model.views.design.document.head, {childList: true});
diff --git a/js/document/templates/banner/index.html b/js/document/templates/banner/index.html
index 2cd82f51..91ef06de 100755
--- a/js/document/templates/banner/index.html
+++ b/js/document/templates/banner/index.html
@@ -27,8 +27,6 @@
27 margin: 0; 27 margin: 0;
28 padding: 0; 28 padding: 0;
29 position: absolute; 29 position: absolute;
30 -webkit-transform-style: preserve-3d;
31 -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
32 } 30 }
33 31
34 html { 32 html {
@@ -40,10 +38,6 @@
40 height: 100%; 38 height: 100%;
41 background: #666; 39 background: #666;
42 } 40 }
43
44 ninjaloadinghack {
45 display: none;
46 }
47 41
48 .active-element-outline { 42 .active-element-outline {
49 outline: #adff2f solid 2px; 43 outline: #adff2f solid 2px;
@@ -53,16 +47,29 @@
53 -webkit-transition: all 450ms linear !important; 47 -webkit-transition: all 450ms linear !important;
54 } 48 }
55 49
56 ninja-banner { 50 ninjaloadinghack {
51 display: none;
52 }
53
54 ninja-viewport, ninja-content {
57 display: block; 55 display: block;
58 margin: 0; 56 margin: 0;
59 padding: 0; 57 padding: 0;
60 border: 0; 58 border: 0;
61 position: absolute; 59 position: absolute;
62 overflow: visible; 60 overflow: visible;
63 top: 50%; 61 top: 0;
64 left: 50%; 62 left: 0;
65 background: #FFF; 63 background: transparent;
64 }
65
66 ninja-viewport {
67 background: #FFF;
68 }
69
70 ninja-content {
71 -webkit-transform-style: preserve-3d;
72 -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
66 } 73 }
67 </style> 74 </style>
68 75
@@ -87,8 +94,15 @@
87 </head> 94 </head>
88 95
89 <body> 96 <body>
97
90 <ninjaloadinghack></ninjaloadinghack> 98 <ninjaloadinghack></ninjaloadinghack>
91 <ninja-banner></ninja-banner> 99
100 <ninja-viewport>
101
102 <ninja-content></ninja-content>
103
104 </ninja-viewport>
105
92 </body> 106 </body>
93 107
94</html> \ No newline at end of file 108</html> \ No newline at end of file
diff --git a/js/document/views/design.js b/js/document/views/design.js
index e838dd49..4c91ff39 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -159,8 +159,9 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
159 insertBannerContent: { 159 insertBannerContent: {
160 value: function (e) { 160 value: function (e) {
161 //Getting first element in DOM (assumes it's root) 161 //Getting first element in DOM (assumes it's root)
162 var banner = this._bodyFragment.getElementsByTagName('*')[1], 162 //TODO: Ensure wrapper logic is proper
163 ninjaBanner = this.document.body.getElementsByTagName('ninja-banner')[0]; 163 var banner = this._bodyFragment.getElementsByTagName('*')[2],
164 ninjaBanner = this.document.body.getElementsByTagName('ninja-content')[0];
164 //Copying attributes to maintain same properties as the banner root 165 //Copying attributes to maintain same properties as the banner root
165 for (var n in banner.attributes) { 166 for (var n in banner.attributes) {
166 if (banner.attributes[n].value) { 167 if (banner.attributes[n].value) {
@@ -168,7 +169,8 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
168 } 169 }
169 } 170 }
170 //Adjusting margin per size of document 171 //Adjusting margin per size of document
171 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}'; 172 //this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-banner {overflow: visible !important; margin-top: -'+Math.floor(this._template.size.height/2)+'px; margin-left: -'+Math.floor(this._template.size.width/2)+'px}';
173 this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-content {overflow: visible !important;} ninja-content, ninja-viewport {width: ' + this._template.size.width + 'px; height: ' + this._template.size.height + 'px;}';
172 //Setting content in template 174 //Setting content in template
173 ninjaBanner.innerHTML = banner.innerHTML; 175 ninjaBanner.innerHTML = banner.innerHTML;
174 //Garbage collection 176 //Garbage collection
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js
index 22446403..8c338f84 100755
--- a/js/helper-classes/3D/view-utils.js
+++ b/js/helper-classes/3D/view-utils.js
@@ -358,9 +358,13 @@ exports.ViewUtils = Montage.create(Component, {
358 { 358 {
359 pt = this.childToParent( pt, child ); 359 pt = this.childToParent( pt, child );
360 360
361 if (child === this._stageElement) break; 361// if (child === this._stageElement) break;
362// child = child.offsetParent;
362 363
364 if (child === this._stageElement) break;
365 if (child === this._rootElement) break;
363 child = child.offsetParent; 366 child = child.offsetParent;
367 if (child === this._rootElement) break;
364 } 368 }
365 369
366 ///////////////////////////////////////////////////////// 370 /////////////////////////////////////////////////////////
diff --git a/js/io/templates/files/banner.txt b/js/io/templates/files/banner.txt
index fdafe4f6..33b45e53 100755
--- a/js/io/templates/files/banner.txt
+++ b/js/io/templates/files/banner.txt
@@ -1,13 +1,18 @@
1<!DOCTYPE html> 1<!DOCTYPE html>
2 2
3<div class="ninja-banner"> 3<div class="ninja-content-wrapper">
4 4