aboutsummaryrefslogtreecommitdiff
path: root/js/document/templates
diff options
context:
space:
mode:
Diffstat (limited to 'js/document/templates')
-rw-r--r--js/document/templates/app/main.js51
-rwxr-xr-xjs/document/templates/banner/index.html47
-rwxr-xr-xjs/document/templates/html/index.html50
3 files changed, 133 insertions, 15 deletions
diff --git a/js/document/templates/app/main.js b/js/document/templates/app/main.js
index e2bdc1a0..bb4cd829 100644
--- a/js/document/templates/app/main.js
+++ b/js/document/templates/app/main.js
@@ -8,12 +8,38 @@ var Montage = require("montage/core/core").Montage,
8 Template = require("montage/ui/template").Template, 8 Template = require("montage/ui/template").Template,
9 TemplateCreator = require("tools/template/template-creator").TemplateCreator; 9 TemplateCreator = require("tools/template/template-creator").TemplateCreator;
10 10
11
12//var njmodelGet = function njmodelGet() {
13// return (this.hasOwnProperty("_model") ? this._model: document.modelGenerator.call(this));
14//};
15//
16//Object.defineProperty(Object.prototype, "_model", {
17// enumerable: false,
18// value: null,
19// writable: true
20//});
21//
22//Object.defineProperty(Object.prototype, "elementModel", {
23// configurable: true,
24// get: njmodelGet,
25// set: function() {
26// }
27//});
28
11exports.Main = Montage.create(Component, { 29exports.Main = Montage.create(Component, {
12 30
13 hasTemplate: { 31 hasTemplate: {
14 value: false 32 value: false
15 }, 33 },
16 34
35 componentToInsert: {
36 value: null
37 },
38
39 firstDrawCallback: {
40 value: null
41 },
42
17 /** 43 /**
18 * Adding window hooks to callback into this object from Ninja. 44 * Adding window hooks to callback into this object from Ninja.
19 */ 45 */
@@ -24,6 +50,12 @@ exports.Main = Montage.create(Component, {
24 window.addComponent = function(element, data, callback) { 50 window.addComponent = function(element, data, callback) {
25 var component; 51 var component;
26 52
53 if(!self.firstDrawCallback) {
54 self.firstDrawCallback = {};
55 self.firstDrawCallback.callback = data.firstDraw.cb;
56 self.firstDrawCallback.context = data.firstDraw.ctx;
57 }
58
27 component = require.async(data.path) 59 component = require.async(data.path)
28 .then(function(component) { 60 .then(function(component) {
29 var componentRequire = component[data.name]; 61 var componentRequire = component[data.name];
@@ -35,6 +67,9 @@ exports.Main = Montage.create(Component, {
35 componentInstance.needsDraw = true; 67 componentInstance.needsDraw = true;
36 componentInstance.ownerComponent = self; 68 componentInstance.ownerComponent = self;
37 69
70 self.componentToInsert = componentInstance;
71 componentInstance.addEventListener("firstDraw", self, false);
72
38 callback(componentInstance, element); 73 callback(componentInstance, element);
39 }) 74 })
40 .end(); 75 .end();
@@ -48,15 +83,15 @@ exports.Main = Montage.create(Component, {
48 var templateEvent = document.createEvent("CustomEvent"); 83 var templateEvent = document.createEvent("CustomEvent");
49 templateEvent.initCustomEvent("mjsTemplateReady", false, true); 84 templateEvent.initCustomEvent("mjsTemplateReady", false, true);
50 document.body.dispatchEvent(templateEvent); 85 document.body.dispatchEvent(templateEvent);
51 86 }
52 87 },
53 // Dispatch event when this template has loaded. 88
54 /* 89 handleFirstDraw: {
55 var newEvent = document.createEvent( "CustomEvent" ); 90 value: function() {
56 newEvent.initCustomEvent( "userTemplateDidLoad", false, true ); 91 this.firstDrawCallback.callback.call(this.firstDrawCallback.context, this.componentToInsert);
57 document.body.dispatchEvent( newEvent );
58 */
59 92
93 this.componentToInsert.removeEventListener("firstDraw", this, false);
94 this.componentToInsert = null;
60 } 95 }
61 } 96 }
62}); \ No newline at end of file 97}); \ No newline at end of file
diff --git a/js/document/templates/banner/index.html b/js/document/templates/banner/index.html
index f1ee3d98..626dc0bc 100755
--- a/js/document/templates/banner/index.html
+++ b/js/document/templates/banner/index.html
@@ -71,12 +71,53 @@
71 -webkit-transform-style: preserve-3d; 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); 72 -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
73 } 73 }
74
75 ::-webkit-scrollbar { width: 11px; height: 11px; }
76 ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment { display: none; }
77 ::-webkit-scrollbar-button:vertical:start:increment, body::-webkit-scrollbar-button:vertical:end:decrement { display: none; }
78 ::-webkit-scrollbar-button:horizontal:start:increment, body::-webkit-scrollbar-button:horizontal:end:decrement { display: none; }
79 ::-webkit-scrollbar-track:vertical { background-color: black; }
80 ::-webkit-scrollbar-track:horizontal { background-color: black; }
81 ::-webkit-scrollbar-track-piece:vertical:start { background-color: transparent; }
82 ::-webkit-scrollbar-track-piece:horizontal:start { background-color: transparent; }
83 ::-webkit-scrollbar-track-piece:vertical:end { background-color: transparent; }
84 ::-webkit-scrollbar-track-piece:horizontal:end { background-color: transparent; }
85 ::-webkit-scrollbar-thumb:vertical { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, right top, color-stop(0.16, #8c8c8c), color-stop(0.49, #adadad), color-stop(0.82, #8c8c8c)); }
86 ::-webkit-scrollbar-thumb:vertical:hover { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, right top, color-stop(0.1, #bebebe), color-stop(0.5, white), color-stop(0.9, #bebebe)); }
87 ::-webkit-scrollbar-thumb:horizontal { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #8c8c8c), color-stop(0.5, #adadad), color-stop(0.9, #8c8c8c)); }
88 ::-webkit-scrollbar-thumb:horizontal:hover { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.16, #bebebe), color-stop(0.49, white), color-stop(0.82, #bebebe)); }
89 ::-webkit-scrollbar-corner { background-color: black; }
90 ::-webkit-scrollbar-corner:window-inactive { background-color: black; }
91 ::-webkit-scrollbar-track:vertical:disabled { display: block; }
92 ::-webkit-scrollbar-track:horizontal:disabled { display: block; }
93 ::-webkit-scrollbar-track-piece:disabled { display: block; }
94 ::-webkit-scrollbar-corner:disabled { display: block; }
95 ::-webkit-resizer:disabled { display: block; }
96
74 </style> 97 </style>
75 98
76 <script type="text/javascript" data-ninja-template="true"> 99 <script type="text/javascript" data-ninja-template="true">
77 function getElement(x,y) { 100
78 return document.elementFromPoint(x,y); 101 function getElement(x,y) {
79 } 102 return document.elementFromPoint(x,y);
103 }
104
105 var njmodelGet = function njmodelGet() {
106 return (this.hasOwnProperty("_model") ? this._model: document.modelGenerator.call(this));
107 };
108
109 Object.defineProperty(Object.prototype, "_model", {
110 enumerable: false,
111 value: null,
112 writable: true
113 });
114
115 Object.defineProperty(Object.prototype, "elementModel", {
116 configurable: true,
117 get: njmodelGet,
118 set: function() {
119 }
120 });
80 </script> 121 </script>
81 122
82 <!-- TODO: Determine if loading Montage is always needed or if it could be done author-time or on file open --> 123 <!-- TODO: Determine if loading Montage is always needed or if it could be done author-time or on file open -->
diff --git a/js/document/templates/html/index.html b/js/document/templates/html/index.html
index 69ac895e..bee2e557 100755
--- a/js/document/templates/html/index.html
+++ b/js/document/templates/html/index.html
@@ -57,13 +57,55 @@
57 57
58 .nj-element-highlight { 58 .nj-element-highlight {
59 outline: 4px solid #ff0000; 59 outline: 4px solid #ff0000;
60 } 60 }
61
62 ::-webkit-scrollbar { width: 11px; height: 11px; }
63 ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment { display: none; }
64 ::-webkit-scrollbar-button:vertical:start:increment, body::-webkit-scrollbar-button:vertical:end:decrement { display: none; }
65 ::-webkit-scrollbar-button:horizontal:start:increment, body::-webkit-scrollbar-button:horizontal:end:decrement { display: none; }
66 ::-webkit-scrollbar-track:vertical { background-color: black; }
67 ::-webkit-scrollbar-track:horizontal { background-color: black; }
68 ::-webkit-scrollbar-track-piece:vertical:start { background-color: transparent; }
69 ::-webkit-scrollbar-track-piece:horizontal:start { background-color: transparent; }
70 ::-webkit-scrollbar-track-piece:vertical:end { background-color: transparent; }
71 ::-webkit-scrollbar-track-piece:horizontal:end { background-color: transparent; }
72 ::-webkit-scrollbar-thumb:vertical { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, right top, color-stop(0.16, #8c8c8c), color-stop(0.49, #adadad), color-stop(0.82, #8c8c8c)); }
73 ::-webkit-scrollbar-thumb:vertical:hover { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, right top, color-stop(0.1, #bebebe), color-stop(0.5, white), color-stop(0.9, #bebebe)); }
74 ::-webkit-scrollbar-thumb:horizontal { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #8c8c8c), color-stop(0.5, #adadad), color-stop(0.9, #8c8c8c)); }
75 ::-webkit-scrollbar-thumb:horizontal:hover { border-color: black; border-style: solid; border-width: 2px; -webkit-border-radius: 6px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.16, #bebebe), color-stop(0.49, white), color-stop(0.82, #bebebe)); }
76 ::-webkit-scrollbar-corner { background-color: black; }
77 ::-webkit-scrollbar-corner:window-inactive { background-color: black; }
78 ::-webkit-scrollbar-track:vertical:disabled { display: block; }
79 ::-webkit-scrollbar-track:horizontal:disabled { display: block; }
80 ::-webkit-scrollbar-track-piece:disabled { display: block; }
81 ::-webkit-scrollbar-corner:disabled { display: block; }
82 ::-webkit-resizer:disabled { display: block; }
83
61 </style> 84 </style>
62 85
63 <script type="text/javascript" data-ninja-template="true"> 86 <script type="text/javascript" data-ninja-template="true">
64 function getElement(x,y) { 87
65 return document.elementFromPoint(x,y); 88 function getElement(x,y) {
66 } 89 return document.elementFromPoint(x,y);
90 }
91
92 var njmodelGet = function njmodelGet() {
93 return (this.hasOwnProperty("_model") ? this._model: document.modelGenerator.call(this));
94 };
95
96 Object.defineProperty(Object.prototype, "_model", {
97 enumerable: false,
98 value: null,
99 writable: true
100 });
101
102 Object.defineProperty(Object.prototype, "elementModel", {
103 configurable: true,