From f3dc624fa464a79fd8e8cec1ddd16ed2109bda23 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Fri, 10 Feb 2012 16:05:27 -0800 Subject: Revert "Merge from /joseeight/ninja-internal/tree/FileIO" This reverts commit c48eeb01bd726895dc577d8b843b2a75883eee07. Signed-off-by: Ananya Sen --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 1027 ++++---------------- 1 file changed, 215 insertions(+), 812 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 44129743..9bf51e60 100755 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -1,892 +1,295 @@ +/* +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; var Component = require("montage/ui/component").Component; -var Layer = require("js/panels/Timeline/Layer.reel").Layer; -var TimelineTrack = require("js/panels/Timeline/TimelineTrack.reel").TimelineTrack; -var nj = require("js/lib/NJUtils").NJUtils; -var ElementMediator = require("js/mediators/element-mediator").ElementMediator; +var TimelineController = require("js/panels/Timeline/TimelineController").TimelineController; var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { - hasTemplate:{ - value:true - }, - - /* === BEGIN: Models === */ - _arrLayers:{ - value:[] - }, - - arrLayers:{ - get:function () { - return this._arrLayers; - }, - set:function (newVal) { - this._arrLayers = newVal; - } - }, - - _layerRepetition:{ - value:null - }, + tmpImg: { value: null}, - layerRepetition:{ - get:function () { - return this._layerRepetition; - }, - set:function (newVal) { - this._layerRepetition = newVal; + templateDidLoad: { + value: function() { + /* + this.tmpImg = document.createElement("img"); + this.tmpImg.width = 1879; + this.tmpImg.height = 440; + this.tmpImg.src = "images/timeline/timeline.png"; + */ } }, - _currentLayerNumber:{ - value:0 - }, - - currentLayerNumber:{ - get:function () { - return this._currentLayerNumber; - }, - set:function (newVal) { - if (newVal !== this._currentLayerNumber) { - this._currentLayerNumber = newVal; - } + prepareForDraw: { + value: function() { + this.element.style.background = "url('images/timeline/timeline.png')"; + this.element.style.width = "100%"; + this.element.style.height = "400px"; + this.element.style.backgroundPosition = "-5px -40px"; } }, - currentLayerSelected:{ - value: null - }, - - currentTrackSelected:{ - value: null - }, - - millisecondsOffset:{ - value:1000 - }, - - _arrTracks:{ - serializable:true, - value:[] - }, + init : { + value : function() + { + this.buildTimelineView(); - arrTracks:{ - serializable:true, - get:function () { - return this._arrTracks; - }, - set:function (newVal) { - this._arrTracks = newVal; } }, - _trackRepetition:{ - serializable:true, - value:null + breadCrumbContainer:{ + value:null, + writable:true, + enumerable:true }, - trackRepetition:{ - serializable:true, - get:function () { - return this._trackRepetition; - }, - set:function (newVal) { - this._trackRepetition = newVal; - } + controlsContainer:{ + value:null, + writable:true, + enumerable:true }, - _selectedKeyframes:{ - value:[] + timelineGutter:{ + value:null, + writable:true, + enumerable:true }, - selectedKeyframes:{ - serializable:true, - get:function () { - return this._selectedKeyframes; - }, - set:function (newVal) { - this._selectedKeyframes = newVal; - } + userLayerContainer:{ + value:null, + writable:true, + enumerable:true }, - _isLayer:{ - value:false - }, - - _firstTimeLoaded:{ - value:true, - writable:true + currentLayerNumber:{ + value:1, + writable:true, + enumerable:true }, - _arrLayersNonEmpty:{ - value:true, - writable:true + newLayerButton:{ + value:null, + writable:true, + enumerable:true }, - _captureSelection:{ - value:false, - writable:true - }, - /* === END: Models === */ - - /* === BEGIN: Draw cycle === */ - prepareForDraw:{ - value:function () { - - this.eventManager.addEventListener("deleteLayerClick", this, false); - this.eventManager.addEventListener("newLayer", this, false); - this.eventManager.addEventListener("deleteLayer", this, false); - this.eventManager.addEventListener("layerBinding", this, false); - this.eventManager.addEventListener("elementAdded", this, false); - this.eventManager.addEventListener("elementDeleted", this, false); - this.eventManager.addEventListener("deleteSelection", this, false); - this.eventManager.addEventListener("selectionChange", this, true); - this.hashInstance = this.createLayerHashTable(); - this.hashTrackInstance = this.createTrackHashTable(); - this.hashLayerNumber = this.createLayerNumberHash(); - this.hashElementMapToLayer = this.createElementMapToLayer(); - this.initTimelineView(); - } + deleteLayerButton:{ + value:null, + writable:true, + enumerable:true }, - willDraw:{ - value:function () { - if (this._isLayer) { - this.insertLayer(); - this._isLayer = false; - } - } - }, - /* === END: Draw cycle === */ - - /* === BEGIN: Controllers === */ - initTimelineView:{ - value:function () { - this.layout_tracks = this.element.querySelector(".layout-tracks"); - this.layout_markers = this.element.querySelector(".layout_markers"); - - this.newlayer_button.identifier = "addLayer"; - this.newlayer_button.addEventListener("click", this, false); - this.deletelayer_button.identifier = "deleteLayer"; - this.deletelayer_button.addEventListener("click", this, false); - this.timeline_leftpane.addEventListener("click", this.timelineLeftPaneClick.bind(this), false); - this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); - this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); - - this.drawTimeMarkers(); - - this._hashKey = "123"; - _firstLayerDraw = false; - NJevent('newLayer', this._hashKey); - _firstLayerDraw = true; - this.selectLayer(0); - } + newFolderButton:{ + value:null, + writable:true, + enumerable:true }, - updateLayerScroll:{ - value:function () { - this.user_layers.scrollTop = this.layout_tracks.scrollTop; - this.layout_markers.scrollLeft = this.layout_tracks.scrollLeft; + buildTimelineView : { + value:function(){ + var timeline = document.getElementById("timelinePanel"); + + var mainTimelineContainer = document.createElement("div"); + mainTimelineContainer.style.backgroundColor = "#000000"; + mainTimelineContainer.style.width = "100%"; + mainTimelineContainer.style.height = "100%"; + mainTimelineContainer.style.overflow = "visible"; + + timeline.appendChild(mainTimelineContainer); + + this.breadCrumbContainer = document.createElement("div"); + this.breadCrumbContainer.style.width = "100%"; + this.breadCrumbContainer.style.height = "20px"; + this.breadCrumbContainer.style.backgroundColor = "#111111"; + + var timeControllerContainer = document.createElement("div"); + timeControllerContainer.style.width = "auto"; + timeControllerContainer.style.height = "20px"; + timeControllerContainer.style.backgroundColor = "#000000"; + + this.controlsContainer = document.createElement("div"); + this.controlsContainer.style.width = "200px"; + this.controlsContainer.style.height = "20px"; + this.controlsContainer.style.backgroundColor = "#440000"; + this.controlsContainer.style.float = "left"; + this.controlsContainer.innerText = "Timeline Controller"; + + var timeContainer = document.createElement("div"); + timeContainer.style.width = "inherit"; + timeContainer.style.height = "20px"; + timeContainer.style.backgroundColor = "#880000"; + timeContainer.style.float = "left"; + timeContainer.innerText = "Time markers"; + + timeControllerContainer.appendChild(this.controlsContainer); + timeControllerContainer.appendChild(timeContainer); + + var masterLayerContainer = document.createElement("div"); + masterLayerContainer.style.width = "100%"; + masterLayerContainer.style.height = "20px"; + masterLayerContainer.style.backgroundColor = "#111111"; + masterLayerContainer.style.border = "solid"; + masterLayerContainer.style.borderWidth = "thin"; + masterLayerContainer.style.borderColor = "#333333"; + masterLayerContainer.innerText = "MASTER Layer"; + + this.userLayerContainer = document.createElement("div"); + this.userLayerContainer.style.width = "100%"; + this.userLayerContainer.style.height = "33px"; + this.userLayerContainer.style.backgroundColor = "#111111"; + + this.timelineGutter = document.createElement("div"); + this.timelineGutter.style.position = "fixed"; + //this.timelineGutter.style.width = "inherit"; + this.timelineGutter.style.height = "20px"; + //this.timelineGutter.style.bottom = 0; + this.timelineGutter.style.backgroundColor = "#000000"; + this.timelineGutter.style.zIndex = "100"; + + var newLayerButton = document.createElement("button"); + newLayerButton.style.backgroundImage = "url(../MainApp/images/timeline/plus.png)"; + newLayerButton.style.backgroundRepeat = "no-repeat"; + newLayerButton.style.height = "18px"; + newLayerButton.style.width = "18px"; + //newLayerButton.textContent = "New Layer"; + newLayerButton.addEventListener("click", this.newLayerClickHandler.bind(this), false); + + //var newFolderButton = document.createElement("button"); + //newFolderButton.textContent = "New Folder"; + + var newTrashButton = document.createElement("button"); + newTrashButton.style.backgroundImage = "url(../MainApp/images/timeline/trash.png)"; + newTrashButton.style.backgroundRepeat = "no-repeat"; + newTrashButton.style.height = "18px"; + newTrashButton.style.width = "18px"; + newTrashButton.addEventListener("click", this.deleteLayerClickHandler.bind(this), false); + + this.timelineGutter.appendChild(newLayerButton); + //this.timelineGutter.appendChild(newFolderButton); + this.timelineGutter.appendChild(newTrashButton); + + mainTimelineContainer.appendChild(this.breadCrumbContainer); + mainTimelineContainer.appendChild(timeControllerContainer); + mainTimelineContainer.appendChild(masterLayerContainer); + mainTimelineContainer.appendChild(this.userLayerContainer); + mainTimelineContainer.appendChild(this.timelineGutter); + + this.initBreadCrumb(); + + this.layerArray = new Array(); + } + }, + + newLayerClickHandler:{ + value:function(){ + this.newLayer(); } }, - captureSelectionChange:{ + deleteLayerClickHandler:{ value:function(){ - var key , switchSelectedLayer,layerIndex; - if(this.application.ninja.selectedElements[0]){ - key = this.application.ninja.selectedElements[0].uuid; - switchSelectedLayer = this.hashElementMapToLayer.getItem(key); - if(switchSelectedLayer!==undefined){ - layerIndex = this.getLayerIndexByID(switchSelectedLayer.layerID) - this._captureSelection=false; - this.selectLayer(layerIndex); - this._captureSelection=true; - - } - } + this.deleteLayer(); } }, - updateTimeText:{ - value:function (millisec) { - var timeText; - var sec = (Math.floor((millisec / 1000))) % 60; - var min = (Math.floor((millisec / 1000) / 60)) % 60; - var milliSec = String(Math.round(millisec / 10)); - var returnMillisec = milliSec.slice(milliSec.length - 2, milliSec.length); - var returnSec; - var returnMin; - if (sec < 10) { - returnSec = "0" + sec; - } else { - returnSec = sec; - } - if (min < 10) { - returnMin = "0" + min; - } else { - returnMin = min; - } - if (millisec == 0) { - returnMillisec = "00"; - } - timeText = returnMin + ":" + returnSec + ":" + returnMillisec; - this.timetext.innerHTML = timeText; - } + layerArray:{ + value:null, + writable:true, + enumerable:true }, - deselectKeyframes:{ - value:function () { - for (var i = 0; i < this.selectedKeyframes.length; i++) { - this.selectedKeyframes[i].deselect(); - } - this.selectedKeyframes = null; - this.selectedKeyframes = new Array(); - } + selectedLayer:{ + value:null, + writable:true, + enumerable:true }, - handleAddLayerClick:{ - value:function (event) { - this._isLayer = true; - this.needsDraw = true; - } - }, + newLayer:{ + value:function(){ + var newLayerDiv = document.createElement("div"); + newLayerDiv.style.width = "inherit"; + newLayerDiv.style.height = "20px"; + newLayerDiv.style.backgroundColor = "#222222"; + newLayerDiv.style.border = "solid"; + newLayerDiv.style.borderWidth = "thin"; + newLayerDiv.style.borderColor = "#444444"; - handleDeleteLayerClick:{ - value:function (event) { - this._deleteKeyDown = false; - if (this.application.ninja.currentSelectedContainer.id === "UserContent") { - this._hashKey = "123"; - } - this.removeLayer(); - } - }, + newLayerDiv.innerText = "Layer " + this.currentLayerNumber; + this.currentLayerNumber++; - handleLayerBinding:{ - value:function (event) { - var i = 0; - this.currentParentNode = this.application.ninja.currentSelectedContainer.parentNode; + newLayerDiv.addEventListener("click", this.selectLayer.bind(this), false); - if (this._firstTimeLoaded) { - this._firstTimeLoaded = false; - } else { - while (this.arrLayers.pop()) { - } - while (this.arrTracks.pop()) { - } - if (event.detail.element.id === "UserContent") { - this._hashKey = "123"; - } else { - this._hashKey = event.detail.element.uuid; - } - if (this.returnedObject = this.hashInstance.getItem(this._hashKey)) { - this.returnedTrack = this.hashTrackInstance.getItem(this._hashKey); - this._hashFind = true; - } - this.currentLayerNumber = 0; - NJevent('newLayer', event.detail); - this.selectLayer(0); - } - } - }, + this.userLayerContainer.appendChild(newLayerDiv); - timelineLeftPaneClick:{ - value:function (event) { - var ptrParent = nj.queryParentSelector(event.target, ".container-layer"); - if (ptrParent !== false) { - var myIndex = this.getActiveLayerIndex(); - this.selectLayer(myIndex); - } + this.layerArray.push(newLayerDiv); + console.log(this.layerArray); } }, - handleNewLayer:{ - value:function (event) { - var hashIndex = 0 , hashVariable = 0, layerResult, trackResult, layerObject, trackObject, dLayer, parentNode; - - this._arrLayersNonEmpty = true; - if (this._hashFind) { - while (layerResult = this.returnedObject[hashIndex]) { - trackResult = this.returnedTrack[hashIndex]; - if (layerResult.deleted !== true) { - this.arrLayers.push(layerResult); - this.arrTracks.push(trackResult); - } - hashIndex++; - } - this._hashFind = false; - return; - } - if (event.detail._undoStatus) { - if (this.application.ninja.currentSelectedContainer.id === "UserContent" && event.detail._el.parentElementUUID === 123) { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - dLayer[hashVariable].deleted = false; - this.arrLayers.splice(event.detail._layerPosition, 1, event.detail._el); - this.arrTracks.splice(event.detail._layerPosition, 1, event.detail._track); - break; - - } - hashVariable++; - } - - } - - else if (event.detail._el.parentElementUUID !== this.application.ninja.currentSelectedContainer.uuid) { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - dLayer[hashVariable].deleted = false; - parentNode = dLayer[hashVariable].parentElement; - break; - } - hashVariable++; - } - this._setBreadCrumb = true; - NJevent('breadCrumbTrail', {"element":parentNode, "setFlag":this._setBreadCrumb}); - } else { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - dLayer[hashVariable].deleted = false; - this.arrLayers.splice(event.detail._layerPosition, 1, event.detail._el); - this.arrTracks.splice(event.detail._layerPosition, 1, event.detail._track); - break; - - } - hashVariable++; - } - } - } - - - else { - var newLayerName = "", - thingToPush = {}, - newTrack = {}, - myIndex = 0; - - this.currentLayerNumber = this.hashLayerNumber.getItem(this._hashKey); - if (this.currentLayerNumber === undefined) { - this.currentLayerNumber = 0; - } - this.currentLayerNumber = this.currentLayerNumber + 1; - newLayerName = "Layer " + this.currentLayerNumber; - thingToPush.layerName = newLayerName; - thingToPush.layerID = this.currentLayerNumber; - thingToPush.isMainCollapsed = true; - thingToPush.isPositionCollapsed = true; - thingToPush.isTransformCollapsed = true; - thingToPush.isStyleCollapsed = true; - thingToPush.arrLayerStyles = []; - thingToPush.element = []; - thingToPush.deleted = false; - thingToPush.isSelected = false; - if (_firstLayerDraw) { - thingToPush.parentElementUUID = this.application.ninja.currentSelectedContainer.uuid; - thingToPush.parentElement = this.application.ninja.currentSelectedContainer; - } - - - newTrack.trackID = this.currentLayerNumber; - newTrack.isMainCollapsed = true; - newTrack.isPositionCollapsed = true; - newTrack.isTransformCollapsed = true; - newTrack.isStyleCollapsed = false; - newTrack.tweens = []; - - if (_firstLayerDraw) { - if (this.application.ninja.currentSelectedContainer.id === "UserContent") { - this._hashKey = "123"; - thingToPush.parentElementUUID = 123; - } - } - - if (!!this.layerRepetition.selectedIndexes) { - myIndex = this.layerRepetition.selectedIndexes[0]; - thingToPush.layerPosition = myIndex; - thingToPush.isSelected = true; - newTrack.trackPosition = myIndex; - this.arrLayers.splice(myIndex, 0, thingToPush); - this.arrTracks.splice(myIndex, 0, newTrack); - this._LayerUndoPosition = myIndex; - this.selectLayer(myIndex); - this.hashLayerNumber.setItem(this._hashKey, thingToPush); - this.hashInstance.setItem(this._hashKey, thingToPush, myIndex); - this.hashTrackInstance.setItem(this._hashKey, newTrack, myIndex); - } else { - this.arrLayers.splice(0, 0, thingToPush); - this.arrTracks.splice(0, 0, newTrack); - thingToPush.layerPosition = this.arrLayers.length - 1; - newTrack.trackPosition = this.arrTracks.length - 1; - this._LayerUndoPosition = this.arrLayers.length - 1; - this.hashLayerNumber.setItem(this._hashKey, thingToPush); - this.hashInstance.setItem(this._hashKey, thingToPush, thingToPush.layerPosition); - this.hashTrackInstance.setItem(this._hashKey, newTrack, newTrack.trackPosition); - - } - this._LayerUndoObject = thingToPush; - this._LayerUndoIndex = thingToPush.layerID; - this._LayerUndoStatus = true; - this._TrackUndoObject = newTrack; - if(_firstLayerDraw){ - this.application.ninja.selectionController.executeSelectElement(); - } - + selectLayer:{ + value:function(ev){ + for(var i in this.layerArray){ + this.layerArray[i].style.backgroundColor = "#222222"; } + ev.target.style.backgroundColor = "#444444"; + this.selectedLayer = ev.target; } }, - handleDeleteLayer:{ - value:function (event) { - var dLayer, dTrack, parentNode, hashVariable = 0, k = 0, index = 0, j = 0; - - if (this.arrLayers.length > 0) { - if (this.arrLayers.length === 1) { - this._arrLayersNonEmpty = false; - alert("cannot delete further"); - return; - } - if (event.detail._undoStatus) { - if (this.application.ninja.currentSelectedContainer.id === "UserContent" && event.detail._el.parentElementUUID === 123) { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable].deleted === true) { - - } else if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - while (this.arrLayers.length) { - if (dLayer[hashVariable]._layerID === this.arrLayers[k]._layerID) { - dLayer[hashVariable].deleted = true; - ElementMediator.deleteElements(dLayer[myIndex].element); - this.arrLayers.splice(k, 1); - this.arrTracks.splice(k, 1); - break; - } - k++; - } - } - hashVariable++; - } - - } else if (event.detail._el.parentElementUUID !== this.application.ninja.currentSelectedContainer.uuid) { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - dLayer[hashVariable].deleted = true; - ElementMediator.deleteElements(dLayer[myIndex].element); - parentNode = dLayer[hashVariable].parentElement; - break; - } - hashVariable++; - } - this._setBreadCrumb = true; - NJevent('breadCrumbTrail', {"element":parentNode, "setFlag":this._setBreadCrumb}); - } - else { - dLayer = this.hashInstance.getItem(event.detail._el.parentElementUUID); - while (dLayer[hashVariable]) { - if (dLayer[hashVariable].deleted === true) { - - } else if (dLayer[hashVariable]._layerID === event.detail._el._layerID) { - while (this.arrLayers.length) { - if (dLayer[hashVariable]._layerID === this.arrLayers[k]._layerID) { - dLayer[hashVariable].deleted = true; - ElementMediator.deleteElements(dLayer[myIndex].element); - this.arrLayers.splice(k, 1); - this.arrTracks.splice(k, 1); - break; - } - k++; - } - } - hashVariable++; - } - } - } - else { - if (!!this.layerRepetition.selectedIndexes) { - var myIndex = this.layerRepetition.selectedIndexes[0]; - this._LayerUndoObject = this.arrLayers[myIndex]; - this._TrackUndoObject = this.arrTracks[myIndex]; - - dLayer = this.hashInstance.getItem(this._hashKey); - dTrack = this.hashTrackInstance.getItem(this._hashKey); - dLayer[myIndex].deleted = true; - ElementMediator.deleteElements(dLayer[myIndex].element); - - this.arrLayers.splice(myIndex, 1); - this.arrTracks.splice(myIndex, 1); - this._LayerUndoIndex = this._LayerUndoObject.layerID; - this._LayerUndoPosition = myIndex; - } else { - dLayer = this.hashInstance.getItem(this._hashKey); - dTrack = this.hashTrackInstance.getItem(this._hashKey); - dLayer[this.arrLayers.length - 1].deleted = true; - ElementMediator.deleteElements(dLayer[this.arrLayers.length - 1].element); - this._LayerUndoPosition = this.arrLayers.length - 1; - this._LayerUndoObject = this.arrLayers.pop(); - this._LayerUndoIndex = this._LayerUndoObject.layerID; - this._TrackUndoObject = this.arrTracks.pop(); - } - } + deleteLayer:{ + value:function(){ + if(this.selectedLayer){ + this.userLayerContainer.removeChild(this.selectedLayer); } - } - }, - - handleElementAdded:{ - value:function (event) { - - this.hashElementMapToLayer.setItem(event.detail.uuid , event.detail,this.currentLayerSelected) - this.currentLayerSelected.element.push(event.detail); - - } - }, - - handleElementDeleted:{ - value:function (event) { - var length; - this.deleteElement = event.detail; - length = this.currentLayerSelected.element.length - 1; - while (length >= 0) { - if (this.currentLayerSelected.element[length] === this.deleteElement) { - this.currentLayerSelected.element.splice(length, 1); - break; + for(var i in this.layerArray){ + if(this.layerArray[i] == this.selectedLayer){ + this.layerArray.splice(i,1); } - length--; } } }, - drawTimeMarkers:{ - value:function () { - var i; - var totalMarkers = Math.floor(this.time_markers.offsetWidth / 80); - for (i = 0; i < totalMarkers; i++) { - var timeMark = document.createElement("div"); - var markValue = this.calculateTimeMarkerValue(i); - timeMark.className = "timemark"; - timeMark.innerHTML = markValue; - this.time_markers.appendChild(timeMark); - } - } - }, + newFolder:{ - calculateTimeMarkerValue:{ - value:function (currentMarker) { - var timeToReturn; - var currentMilliseconds = currentMarker * this.millisecondsOffset; - var sec = (Math.floor((currentMilliseconds / 1000))) % 60; - var min = (Math.floor((currentMilliseconds / 1000) / 60)) % 60; - var milliSec = String(Math.round(currentMilliseconds / 10)); - var returnMillisec = milliSec.slice(milliSec.length - 2, milliSec.length); - var returnSec; - var returnMin; - if (sec < 10) { - returnSec = "0" + sec; - } else { - returnSec = sec; - } - if (min < 10) { - returnMin = "0" + min; - } else { - returnMin = min; - } - if (currentMarker == 0) { - returnMillisec = "00"; - } - timeToReturn = returnMin + ":" + returnSec + ":" + returnMillisec; - return timeToReturn; - } }, - createLayerHashTable:{ - value:function (key, value) { - var hashLayerObject; - - hashLayerObject = Object.create(Object.prototype, { - counter:{ - value:0, - writable:true - }, - - setItem:{ - value:function (key, value, index) { - if (hashLayerObject[key] === undefined) { - hashLayerObject[key] = {}; - } - if (hashLayerObject[key][index] !== undefined) { - - this.counter = index; - while (hashLayerObject[key][this.counter]) { - this.counter++; - } - - while (this.counter !== index) { - hashLayerObject[key][this.counter] = hashLayerObject[key][this.counter - 1]; - this.counter = this.counter - 1; - } - } - hashLayerObject[key][index] = value; - this.counter = 0; - } - }, - - getItem:{ - value:function (key) { - return hashLayerObject[key]; - } - } - }); - return hashLayerObject; - } - }, + deleteFolder:{ - createTrackHashTable:{ - value:function (key, value) { - var hashTrackObject; - hashTrackObject = Object.create(Object.prototype, { - counter:{ - value:0, - writable:true - }, - - setItem:{ - value:function (key, value, index) { - if (hashTrackObject[key] === undefined) { - hashTrackObject[key] = {}; - - } - if (hashTrackObject[key][index] !== undefined) { - this.counter = index; - while (hashTrackObject[key][this.counter]) { - this.counter++; - } - while (this.counter !== index) { - hashTrackObject[key][this.counter] = hashTrackObject[key][this.counter - 1]; - this.counter = this.counter - 1; - } - } - hashTrackObject[key][index] = value; - this.counter = 0; - } - }, - - getItem:{ - value:function (key) { - return hashTrackObject[key]; - } - } - }); - return hashTrackObject; - } }, - createLayerNumberHash:{ - value:function (key, value) { - var hashLayerNumberObject; - hashLayerNumberObject = Object.create(Object.prototype, { - setItem:{ - value:function (key, value) { - if (value !== undefined) { - hashLayerNumberObject[key] = value.layerID; - } - } - }, - - getItem:{ - value:function (key) { - if (hashLayerNumberObject[key] === undefined) { - return; - } - return hashLayerNumberObject[key]; - } - } - }); - return hashLayerNumberObject; - } - }, - - createElementMapToLayer:{ + initBreadCrumb : { value:function(){ - var hashMappingObject - hashMappingObject = Object.create(Object.prototype, { - mappingArray:{ - value:{}, - writable:true - }, - setItem: { - value: function(key,value,layer) { - if(this.mappingArray[key]===undefined){ - this.mappingArray[key]={}; - } - this.mappingArray[key]["element"] = value; - this.mappingArray[key].layerID = layer.layerID; - - } - }, - - getItem: { - value: function(key) { - return this.mappingArray[key]; - } - } - }); - return hashMappingObject; + var mainBodyButton = document.createElement("button"); + mainBodyButton.textContent = "Body"; + this.breadCrumbContainer.appendChild(mainBodyButton); } }, - - selectLayer:{ - value:function (layerIndex) { - var i = 0, - arrLayersLength = this.arrLayers.length; - - for (i = 0; i < arrLayersLength; i++) { - if (i === layerIndex) { - this.arrLayers[i].isSelected = true; - } else { - this.arrLayers[i].isSelected = false; - } - } - - if (layerIndex !== false) { - this.layerRepetition.selectedIndexes = [layerIndex]; - this.trackRepetition.selectedIndexes = [layerIndex]; - this.currentLayerSelected = this.arrLayers[layerIndex]; - this.currentTrackSelected = this.arrTracks[layerIndex]; - if(this._captureSelection){ - this.application.ninja.selectionController.selectElements(this.currentLayerSelected.element) - } - this._captureSelection = true; - } else { - this.layerRepetition.selectedIndexes = null; - this.trackRepetition.selectedIndexes = null; - this.currentLayerSelected = null; - this.currentTrackSelected = null; - } - } - }, - - getLayerIndexByID:{ - value:function (layerID) { - var i = 0, - returnVal = false, - arrLayersLength = this.arrLayers.length; - - for (i = 0; i < arrLayersLength; i++) { - if (this.arrLayers[i].layerID === layerID) { - returnVal = i; - } - } - return returnVal; - } - }, - - getLayerIndexByName:{ - value:function (layerName) { - var i = 0, - returnVal = false, - arrLayersLength = this.arrLayers.length; - - for (i = 0; i < arrLayersLength; i++) { - if (this.arrLayers[i].layerName === layerName) { - returnVal = i; - } - } - return returnVal; - } - }, - getActiveLayerIndex:{ - value:function () { - var i = 0, - returnVal = false, - arrLayersLength = this.arrLayers.length; - - for (i = 0; i < arrLayersLength; i++) { - if (this.arrLayers[i].isActive === true) { - returnVal = i; - this.arrLayers[i].isActive = false; - } - } - return returnVal; + initControlsContainer:{ + value:function(){ + // create timeline control buttons for play,stop,etc } }, - - insertLayer:{ - value:function () { - var cmd = this.addLayerCommand(); - cmd.execute(); - cmd._el = this._LayerUndoObject; - cmd._layerID = this._LayerUndoIndex; - cmd._layerPosition = this._LayerUndoPosition; - cmd._undoStatus = this._LayerUndoStatus; - cmd._track = this._TrackUndoObject; - NJevent("sendToUndo", cmd); + drawTimeMarkers:{ + value:function(){ + } }, - - removeLayer:{ - value:function () { - var cmd = this.deleteLayerCommand(); - cmd.execute(); - cmd._el = this._LayerUndoObject; - cmd._layerID = this._LayerUndoIndex; - cmd._layerPosition = this._LayerUndoPosition; - cmd._undoStatus = this._LayerUndoStatus; - cmd._track = this._TrackUndoObject; - if (this._arrLayersNonEmpty) { - NJevent("sendToUndo", cmd); - } + calculateTimeMarkerSpacing:{ + value:function(){ + } }, + initMasterLayer:{ + value:function(){ - addLayerCommand:{ - value:function () { - var command; - command = Object.create(Object.prototype, { - _el:{value:null, writable:true}, - _layerID:{value:null, writable:true}, - _layerPosition:{value:null, writable:true}, - _undoStatus:{value:false, writable:true}, - _track:{value:null, writable:true}, - description:{ value:"Add Layer"}, - receiver:{value:TimelinePanel}, - execute:{ - value:function () { - - NJevent('newLayer', this) - - } - }, - unexecute:{ - value:function () { - NJevent('deleteLayer', this) - - } - } - }); - return command; } }, - - deleteLayerCommand:{ - value:function () { - var command; - command = Object.create(Object.prototype, { - description:{ value:"Delete Layer"}, - receiver:{value:TimelinePanel}, - execute:{ - value:function () { - NJevent('deleteLayer', this) - } - }, - unexecute:{ - value:function () { - NJevent('newLayer', this) - } - } - }); - return command; + initUserLayers:{ + value:function(){ + } } - /* === END: Controllers === */ -}); +}); \ No newline at end of file -- cgit v1.2.3