aboutsummaryrefslogtreecommitdiff
path: root/js/components/layout/document-bar.reel/document-bar.js
blob: 66a027252e927a08e3ac3a49295a8ea54bc60d8e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
/* <copyright>
This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
(c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
</copyright> */

var Montage = require("montage/core/core").Montage;
var Component = require("montage/ui/component").Component;

exports.DocumentBar = Montage.create(Component, {

    designView: { value: null, enumerable: false},
    codeView: { value: null, enumerable: false},
    zoomControl: { value: null, enumerable: false },
    _type: { enumerable: false, value: null },
    disabled: { value: true },



    type: {
        enumerable: false,
        get: function() { return this._type; },
        set: function(value) {
            if (this._type === value) {
                return;
            }

            this._type = value;
            this.needsDraw = true;

        }
    },

    _currentView: { value: null, enumerable: false },

    currentView: {
        get: function() { return this._currentView},
        set: function(value) {
            if (this._currentView === value) {
                return;
            }

            this._currentView = value;
            this.needsDraw = true;
        }
    },

    _zoomFactor: { value: 100, enumerable: false },

	zoomFactor: {
		get: function()	{ return this._zoomFactor; },

		set: function(value)
		{
			if(value !== this._zoomFactor)
			{
				this._zoomFactor = value;
				if (!this._firstDraw)
				{
					this.application.ninja.stage.setZoom(value);
				}
			}
		}
	},

    draw: {
        value: function() {
            if(this.type === "htm" || this.type === "html") {
                this.designView.classList.add("active");
                this.codeView.classList.add("active");

                if(this.currentView === "design") {
                    this.designView.classList.add("selected");
                    if(this.codeView.classList.contains("selected")) this.codeView.classList.toggle("selected");
                } else {
                    this.codeView.classList.add("selected");
                    if(this.designView.classList.contains("selected")) this.designView.classList.toggle("selected");
                }
                
            } else if(this.type) {
                this.designView.classList.remove("active");
            }

        }
    },

    prepareForDraw: {
        value: function() {
            this.eventManager.addEventListener( "openDocument", this, false);
            this.eventManager.addEventListener( "closeDocument", this, false);
            this.designView.addEventListener("click", this, false);
            this.codeView.addEventListener("click", this, false);

        }
    },

    handleClick: {
        value: function(event) {
            if(event._event.target.id === this.currentView) return;

            this.currentView = event._event.target.id;
            this.application.ninja.documentController.stage.stageView.switchViews(event._event.target.id);//switch between design view
        }
    },

    handleOpenDocument: {
        value: function() {
            this.disabled = false;
        }
    },

    handleCloseDocument: {
        value: function() {
            if(!this.application.ninja.documentController.activeDocument) {
                this.disabled = true;
            }
        }
    },

    handleOnDocumentChanged:{
        value:function(event){

        }
    }
});