From a7952c5a16e2cae3fd1a459b03b9f16bba1004da Mon Sep 17 00:00:00 2001
From: Jose Antonio Marquez
Date: Tue, 14 Feb 2012 13:23:20 -0800
Subject: Cleaning up
Setting up a 'document' folder to handle all document related classes that in relation to IO
---
js/document/models/html-document.js | 492 ++++++++++++++++++++++++++++++++++++
1 file changed, 492 insertions(+)
create mode 100755 js/document/models/html-document.js
(limited to 'js/document/models/html-document.js')
diff --git a/js/document/models/html-document.js b/js/document/models/html-document.js
new file mode 100755
index 00000000..cb399f04
--- /dev/null
+++ b/js/document/models/html-document.js
@@ -0,0 +1,492 @@
+/*
+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,
+ BaseDocument = require("js/document/models/base-document").BaseDocument,
+ NJUtils = require("js/lib/NJUtils").NJUtils;
+////////////////////////////////////////////////////////////////////////
+//
+exports.HTMLDocument = Montage.create(BaseDocument, {
+ // PRIVATE MEMBERS
+ _selectionExclude: { value: null, enumerable: false },
+ _htmlTemplateUrl: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false},
+ _iframe: { value: null, enumerable: false },
+ _server: { value: null, enumerable: false },
+ _templateDocument: { value: null, enumerable: false },
+ _selectionModel: { value: [], enumerable: false },
+ _undoModel: { value: { "queue" : [], "position" : 0 }, enumerable: false},
+
+ _document: { value: null, enumerable: false },
+ _documentRoot: { value: null, enumerable: false },
+ _stageBG: { value: null, enumerable: false },
+ _window: { value: null, enumerable: false },
+ _styles: { value: null, enumerable: false },
+ _stylesheets: { value: null, enumerable: false },
+ _stageStyleSheetId : { value: 'nj-stage-stylesheet', enumerable: false },
+ _userDocument: { value: null, enumerable: false },
+ _htmlSource: {value: "", enumerable: false},
+ _glData: {value: null, enumerable: false },
+
+ _elementCounter: { value: 1, enumerable: false },
+ _snapping : { value: true, enumerable: false },
+ _layoutMode: { value: "all", enumerable: false },
+ _draw3DGrid: { value: false, writable: true },
+ _swfObject: { value: false, enumerable: false },
+
+ _zoomFactor: { value: 100, enumerable: false },
+
+ // PUBLIC MEMBERS
+ cssLoadInterval: { value: null, enumerable: false },
+
+ _savedLeftScroll: {value:null},
+ _savedTopScroll: {value:null},
+
+ _codeViewDocument:{
+ writable: true,
+ enumerable: true,
+ value:null
+ },
+
+ /*
+ * PUBLIC API
+ */
+
+ // GETTERS / SETTERS
+
+ codeViewDocument:{
+ get: function() { return this._codeViewDocument; },
+ set: function(value) { this._codeViewDocument = value}
+ },
+
+ savedLeftScroll:{
+ get: function() { return this._savedLeftScroll; },
+ set: function(value) { this._savedLeftScroll = value}
+ },
+
+ savedTopScroll:{
+ get: function() { return this._savedTopScroll; },
+ set: function(value) { this._savedTopScroll = value}
+ },
+
+ selectionExclude: {
+ get: function() { return this._selectionExclude; },
+ set: function(value) { this._selectionExclude = value; }
+ },
+
+ iframe: {
+ get: function() { return this._iframe; },
+ set: function(value) { this._iframe = value; }
+ },
+
+ server: {
+ get: function() { return this._server; },
+ set: function(value) { this._server = value; }
+ },
+
+ selectionModel: {
+ get: function() { return this._selectionModel; },
+ set: function(value) { this._selectionModel = value; }
+ },
+
+ undoModel: {
+ get: function() { return this._undoModel; },
+ set: function(value) { this._undoModel.queue = value.queue; this._undoModel.position = value.position; }
+ },
+
+ documentRoot: {
+ get: function() { return this._documentRoot; },
+ set: function(value) { this._documentRoot = value; }
+ },
+
+ stageBG: {
+ get: function() { return this._stageBG; },
+ set: function(value) { this._stageBG = value; }
+ },
+
+ elementCounter: {
+ set: function(value) { this._elementCounter = value; },
+ get: function() { return this._elementCounter; }
+ },
+
+ snapping: {
+ get: function() { return this._snapping; },
+ set: function(value) {
+ if(this._snapping !== value) {
+ this._snapping = value;
+ }
+ }
+ },
+
+ // TODO SEND THE EVENT --> Redraw the desired layout
+ layoutMode: {
+ get: function() { return this._layoutMode; },
+ set: function(mode) { this._layoutMode = mode; }
+ },
+
+ draw3DGrid: {
+ get: function() { return this._draw3DGrid; },
+ set: function(value) {
+ if(this._draw3DGrid !== value) {
+ this._draw3DGrid = value;
+ }
+ }
+ },
+
+ _userComponentSet: {
+ value: {},
+ writable: true,
+ enumerable:true
+ },
+
+// userComponentSet:{
+// enumerable: true,
+// get: function() {
+// return this._userComponentSet;
+// },
+// set: function(value) {
+// this._userComponentSet = value;
+// this._drawUserComponentsOnOpen();
+// }
+// },
+//
+// _drawUserComponentsOnOpen:{
+// value:function(){
+// for(var i in this._userComponentSet){
+// console.log(this._userComponentSet[i].control)
+// this._userComponentSet[i].control.needsDraw = true;
+// }
+// }
+// },
+
+ glData: {
+ get: function()
+ {
+ var elt = this.iframe;
+ var elt = this.iframe.contentWindow.document.getElementById("UserContent");
+ this._glData = null;
+ if (elt)
+ {
+ this._glData = new Array();
+ this.collectGLData( elt, this._glData );
+ }
+
+ return this._glData
+ },
+
+ set: function(value)
+ {
+ var nWorlds = value.length;
+ for (var i=0; i= 0)
+ {
+ var endIndex = importStr.indexOf( "\n", startIndex );
+ if (endIndex > 0)
+ {
+ var id = importStr.substring( startIndex+4, endIndex );
+ var canvas = this.iframe.contentWindow.document.getElementById( id );
+ if (canvas)
+ {
+ if (!canvas.elementModel)
+ {
+ NJUtils.makeElementModel(canvas, "Canvas", "shape", true);
+ }
+
+ if (canvas.elementModel)
+ {
+ if (canvas.elementModel.shapeModel.GLWorld)
+ canvas.elementModel.shapeModel.GLWorld.clearTree();
+
+ var world = new GLWorld( canvas );
+ canvas.elementModel.shapeModel.GLWorld = world;
+ world.import( importStr );
+ }
+ }
+ }
+ }
+ }
+ }
+ },
+
+ zoomFactor: {
+ get: function() { return this._zoomFactor; },
+ set: function(value) { this._zoomFactor = value; }
+ },
+
+ //****************************************//
+ // PUBLIC METHODS
+
+
+ ////////////////////////////////////////////////////////////////////
+ //
+ initialize: {
+ value: function(file, uuid, iframe, callback) {
+ //
+ this._userDocument = file;
+ //
+ this.init(file.name, file.uri, file.extension, iframe, uuid, callback);
+ //
+ this.iframe = iframe;
+ this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"];
+ this.currentView = "design";
+ //
+ this.iframe.src = this._htmlTemplateUrl;
+ this.iframe.addEventListener("load", this, true);
+ }
+ },
+ ////////////////////////////////////////////////////////////////////
+
+
+ collectGLData: {
+ value: function( elt, dataArray )
+ {
+ if (elt.elementModel && elt.elementModel.shapeModel && elt.elementModel.shapeModel.GLWorld)
+ {
+ var data = elt.elementModel.shapeModel.GLWorld.export();
+ dataArray.push( data );
+ }
+
+ if (elt.children)
+ {
+ var nKids = elt.children.length;
+ for (var i=0; i 1) {
+ clearInterval(this.cssLoadInterval);
+ this._styles = this._document.styleSheets[this._document.styleSheets.length - 1];
+ this._stylesheets = this._document.styleSheets; // Entire stlyesheets array
+
+ this.callback(this);
+ }
+ }.bind(this), 50);
+
+ // TODO - Not sure where this goes
+ this._userComponentSet = {};
+
+
+ this._styles = this._document.styleSheets[this._document.styleSheets.length - 1];
+ this._stylesheets = this._document.styleSheets; // Entire stlyesheets array
+
+ /* TODO Finish this implementation once we start caching Core Elements */
+ // Assign a model to the UserContent and add the ViewPort reference to it.
+ NJUtils.makeElementModel(this.documentRoot, "Stage", "stage");
+ //this.documentRoot.elementModel.viewPort = this.iframe.contentWindow.document.getElementById("Viewport");
+ NJUtils.makeElementModel(this.stageBG, "Stage", "stage");
+ NJUtils.makeElementModel(this.iframe.contentWindow.document.getElementById("Viewport"), "Stage", "stage");
+
+ for(i = 0; i < this._stylesheets.length; i++) {
+ if(this._stylesheets[i].ownerNode.id === this._stageStyleSheetId) {
+ this.documentRoot.elementModel.defaultRule = this._stylesheets[i];
+ break;
+ }
+ }
+
+ // Temporary create properties for each rule we need to save the index of the rule.
+ var len = this.documentRoot.elementModel.defaultRule.cssRules.length;
+ for(var j = 0; j < len; j++) {
+// console.log(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText);
+ if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "*") {
+
+ this.documentRoot.elementModel.transitionStopRule = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+ } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "body") {
+
+ this.documentRoot.elementModel.body = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+ } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "#Viewport") {
+
+ this.documentRoot.elementModel.viewPort = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+ } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === ".stageDimension") {
+
+ this.documentRoot.elementModel.stageDimension = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+ } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === ".stageView") {
+
+ this.documentRoot.elementModel.stageView = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+ } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "#stageBG") {
+
+ this.documentRoot.elementModel.stageBackground = this.documentRoot.elementModel.defaultRule.cssRules[j];
+ }
+ }
+
+ this.callback(this);
+
+ }
+ },
+
+ _setSWFObjectScript: {
+ value: function() {
+ if(!this._swfObject) {
+ /*
+ var swfObj = document.createElement("script");
+ swfObj.type = "text/javascript";
+ swfObj.src = "../../user-document-templates/external-libs/swf-object/swfobject.js";
+ swfObj.id = "swfObject";
+ var head= this._document.getElementsByTagName('head')[0];
+ head.appendChild(swfObj);
+ this._swfObject = true;
+ */
+ }
+ }
+ },
+
+ /**
+ * public method
+ *
+ */
+ ////////////////////////////////////////////////////////////////////
+ //
+ save: {
+ enumerable: false,
+ value: function () {
+ //TODO: Add code view logic and also styles for HTML
+ if (this.currentView === 'design') {
+ return {mode: 'html', document: this._userDocument, style: this._styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
+ } else if (this.currentView === "code"){
+ //TODO: Would this get call when we are in code of HTML?
+ } else {
+ //Error
+ }
+ }
+ }
+ ////////////////////////////////////////////////////////////////////
+ ////////////////////////////////////////////////////////////////////
+});
\ No newline at end of file
--
cgit v1.2.3