diff options
Diffstat (limited to 'js/document')
-rwxr-xr-x | js/document/document-html.js | 221 | ||||
-rwxr-xr-x | js/document/helpers/url-parser.js | 45 | ||||
-rwxr-xr-x | js/document/models/base.js | 77 | ||||
-rwxr-xr-x | js/document/models/html.js | 1 | ||||
-rwxr-xr-x | js/document/templates/montage-web/index.html | 1 | ||||
-rwxr-xr-x | js/document/views/base.js | 46 | ||||
-rwxr-xr-x | js/document/views/design.js | 103 |
7 files changed, 335 insertions, 159 deletions
diff --git a/js/document/document-html.js b/js/document/document-html.js index 89717dd6..ad82c371 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js | |||
@@ -7,138 +7,117 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
7 | //////////////////////////////////////////////////////////////////////// | 7 | //////////////////////////////////////////////////////////////////////// |
8 | // | 8 | // |
9 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
10 | Component = require("montage/ui/component").Component; | 10 | Component = require("montage/ui/component").Component, |
11 | HtmlDocumentModel = require("js/document/models/html").HtmlDocumentModel; | 11 | HtmlDocumentModel = require("js/document/models/html").HtmlDocumentModel, |
12 | DesignDocumentView = require("js/document/views/design").DesignDocumentView; | ||
12 | //////////////////////////////////////////////////////////////////////// | 13 | //////////////////////////////////////////////////////////////////////// |
13 | // | 14 | // |
14 | exports.HtmlDocument = Montage.create(Component, { | 15 | exports.HtmlDocument = Montage.create(Component, { |
15 | //////////////////////////////////////////////////////////////////// | 16 | //////////////////////////////////////////////////////////////////// |
16 | // | 17 | // |
17 | hasTemplate: { | 18 | hasTemplate: { |
18 | enumerable: false, | ||
19 | value: false | 19 | value: false |
20 | }, | 20 | }, |
21 | 21 | //////////////////////////////////////////////////////////////////// | |
22 | // | ||
22 | model: { | 23 | model: { |
23 | value: null | 24 | value: null |
24 | }, | 25 | }, |
25 | 26 | //////////////////////////////////////////////////////////////////// | |
26 | loadDelegate: { | 27 | // |
27 | value: null | 28 | _document: { |
28 | }, | 29 | value: null //TODO: Figure out if this will be needed, probably not |
29 | |||
30 | delegateContext: { | ||
31 | value: null | ||
32 | }, | 30 | }, |
33 | 31 | //////////////////////////////////////////////////////////////////// | |
32 | // | ||
34 | exclusionList: { | 33 | exclusionList: { |
35 | value: ["HTML", "BODY"] | 34 | value: [] //TODO: Update to correct list |
36 | }, | 35 | }, |
37 | 36 | //////////////////////////////////////////////////////////////////// | |
38 | // Getters for the model. | 37 | // |
39 | // TODO: Change how these properties are accessed through Ninja | ||
40 | name: { | ||
41 | get: function() { | ||
42 | return this.model._name; | ||
43 | }, | ||
44 | set: function(value) { | ||
45 | this.model._name = value; | ||
46 | } | ||
47 | }, | ||
48 | |||
49 | isActive: { | ||
50 | get: function() { | ||
51 | return this.model._isActive; | ||
52 | }, | ||
53 | set: function(value) { | ||
54 | this.model._isActive = value; | ||
55 | } | ||
56 | }, | ||
57 | |||
58 | needsSave: { | ||
59 | get: function() { | ||
60 | return this.model._needsSave; | ||
61 | }, | ||
62 | set: function(value) { | ||
63 | this.model._needsSave = value; | ||
64 | } | ||
65 | }, | ||
66 | |||
67 | // View Properties | ||
68 | // TODO: Move those into a view object - for now dump it here | ||
69 | iframe: { | ||
70 | value: null | ||
71 | }, | ||
72 | |||
73 | uuid: { | 38 | uuid: { |
74 | get: function() { | 39 | get: function() { |
75 | return this._uuid; | 40 | return this._uuid; |
76 | } | 41 | } |
77 | }, | 42 | }, |
78 | 43 | //////////////////////////////////////////////////////////////////// | |
79 | currentView: { | 44 | // |
80 | value: "design" | 45 | inExclusion: { |
46 | value: function(element) { | ||
47 | if(this.exclusionList.indexOf(element.nodeName) === -1) { | ||
48 | return -1; | ||
49 | } | ||
50 | return 1; | ||
51 | } | ||
81 | }, | 52 | }, |
82 | //////////////////////////////////////////////////////////////////// | 53 | //////////////////////////////////////////////////////////////////// |
83 | //////////////////////////////////////////////////////////////////// | 54 | // |
84 | init: { | 55 | init: { |
85 | value:function(file, context, callback) { | 56 | value:function(file, context, callback, view) { |
86 | this.model = Montage.create(HtmlDocumentModel, { | 57 | //Creating instance of HTML Document Model |
87 | file: { | 58 | this.model = Montage.create(HtmlDocumentModel,{ |
88 | value: file | 59 | file: {value: file}, |
89 | } | 60 | views: {value: {'design': DesignDocumentView.create(), 'code': null}} //TODO: Add code view logic |
90 | }); | 61 | }); |
91 | 62 | //Initiliazing views and hiding | |
92 | this.name = file.name; | 63 | if (this.model.views.design.initiliaze(document.getElementById("iframeContainer"))) { |
93 | 64 | //Hiding iFrame, just initiliazing | |
94 | // this.init(file.name, file.uri, file.extension, iframe, uuid, callback); | 65 | this.model.views.design.hide(); |
95 | 66 | } else { | |
96 | 67 | //ERROR: Design View not initilized | |
97 | this.iframe = this.createView(); | 68 | } |
98 | |||
99 | //this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; | ||
100 | //this.currentView = "design"; | ||
101 | // | 69 | // |
102 | 70 | if (view === 'design') { | |
103 | this.delegateContext = context; | 71 | //Showing design iFrame |
104 | this.loadDelegate = callback; | 72 | this.model.views.design.show(); |
105 | } | 73 | this.model.views.design.iframe.style.opacity = 0; |
106 | }, | 74 | this.model.views.design.content = this.model.file.content; |
107 | 75 | // | |
108 | // Create View | 76 | this.model.views.design.render(function () { |
109 | // Move this into a base view object | 77 | //Setting opacity to be viewable after load |
110 | createView: { | 78 | this.model.views.design.iframe.style.opacity = 1; |
111 | value: function() { | 79 | |
112 | var ifr = document.createElement("iframe"); | 80 | |
113 | ifr.id = "document_" + this._uuid; | 81 | |
114 | 82 | ||
115 | 83 | //TODO: Identify and remove usage of '_document' | |
116 | ifr.style.border = "none"; | 84 | this._document = this.model.views.design.document; |
117 | ifr.style.background = "#FFF"; | 85 | //TODO: Check for needed |
118 | ifr.style.height = "100%"; | 86 | this.documentRoot = this.model.views.design.document.body; |
119 | ifr.style.width = "100%"; | 87 | // |
120 | 88 | this._liveNodeList = this.documentRoot.getElementsByTagName('*'); | |
121 | // TODO: Reable opacity to display only when done loading | 89 | // |
122 | // ifr.style.opacity = 0; | 90 | document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body"); |
123 | 91 | ||
124 | ifr.src = "js/document/templates/montage-web/index.html"; | 92 | |
125 | ifr.addEventListener("load", this.handleWebTemplateLoad.bind(this), true); | 93 | |
126 | 94 | ||
127 | return document.getElementById("iframeContainer").appendChild(ifr); | 95 | this.hack = {callback: callback, context: context}; |
96 | |||
97 | setTimeout(function () { | ||
98 | //Making callback after view is loaded | ||
99 | this.hack.callback.call(this.hack.context, this); | ||
100 | }.bind(this), 1000); | ||
101 | |||
102 | |||
103 | |||
104 | |||
105 | |||
106 | |||
107 | |||
108 | }.bind(this)); | ||
109 | } else { | ||
110 | //TODO: Identify default view (probably code) | ||
111 | } | ||
128 | } | 112 | } |
129 | }, | 113 | }, |
130 | 114 | //////////////////////////////////////////////////////////////////// | |
115 | // | ||
131 | handleWebTemplateLoad: { | 116 | handleWebTemplateLoad: { |
132 | value: function(event) { | 117 | value: function(event) { |
133 | //TODO: Remove, also for prototyping | 118 | //TODO: Remove, also for prototyping |
134 | this.application.ninja.documentController._hackRootFlag = true; | 119 | this.application.ninja.documentController._hackRootFlag = true; |
135 | 120 | ||
136 | |||
137 | //TODO: Clean up, using for prototyping save | ||
138 | // this._templateDocument = {}; | ||
139 | // this._templateDocument.html = this.iframe.contentWindow.document; | ||
140 | // this._templateDocument.body = | ||
141 | |||
142 | this._window = this.iframe.contentWindow; | 121 | this._window = this.iframe.contentWindow; |
143 | this._document = this.iframe.contentWindow.document; | 122 | this._document = this.iframe.contentWindow.document; |
144 | this.documentRoot = this.iframe.contentWindow.document.body; | 123 | this.documentRoot = this.iframe.contentWindow.document.body; |
@@ -149,21 +128,9 @@ exports.HtmlDocument = Montage.create(Component, { | |||
149 | } | 128 | } |
150 | } | 129 | } |
151 | 130 | ||
152 | // TODO: We don't need this anymore -> need to setup the main container still | ||
153 | //Adding a handler for the main user document reel to finish loading | ||
154 | // this.documentRoot.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); | ||
155 | |||
156 | // Live node list of the current loaded document | 131 | // Live node list of the current loaded document |