PageRenderTime 44ms CodeModel.GetById 13ms app.highlight 24ms RepoModel.GetById 2ms app.codeStats 0ms

/lib/views/preset_store_view.js

https://github.com/ajanthanm/cssfilterlab
JavaScript | 139 lines | 100 code | 23 blank | 16 comment | 6 complexity | 5f325bb5fe558c257edb9102075233ff MD5 | raw file
  1/*
  2 * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
  3 * 
  4 * Licensed under the Apache License, Version 2.0 (the "License");
  5 * you may not use this file except in compliance with the License.
  6 * You may obtain a copy of the License at
  7 * 
  8 *     http://www.apache.org/licenses/LICENSE-2.0
  9 * 
 10 * Unless required by applicable law or agreed to in writing, software
 11 * distributed under the License is distributed on an "AS IS" BASIS,
 12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 13 * See the License for the specific language governing permissions and
 14 * limitations under the License.
 15 */
 16
 17(function() {
 18    
 19    function PresetStoreView(presetStore) {
 20        this.presetStore = presetStore;
 21        this.dockPanel = new Global.DockPanel("Presets");
 22        
 23        this.activeAnimationEl = $("#active-animation");
 24        this.animationsEl = $("#animations");
 25        this.saveAsEl = $("#save-animation");
 26
 27        this.animationsContainerEl = $("#animations-container").appendTo(this.dockPanel.el);
 28        
 29        this.presetsByName = {};
 30        
 31        this.outsideLayerEl = $("<div />").addClass("clicks-catcher");
 32
 33        // move the animations el to the upper most layer
 34        this.animationsEl.appendTo(document.body);
 35
 36        this.init();
 37    }
 38
 39    PresetStoreView.prototype = {
 40        init: function() {
 41            this.saveAsEl.click(this.onSaveAsClicked.bind(this));
 42            this.presetStore.on("presetsLoaded", this.onPresetsLoaded.bind(this));
 43            this.presetStore.on("presetAdded", this.onPresetAdded.bind(this));
 44            this.presetStore.on("presetRemoved", this.onPresetRemoved.bind(this));
 45            this.presetStore.on("activePresetChanged", this.onActivePresetChanged.bind(this));
 46
 47            this.animationsEl.hide();
 48            this.outsideLayerEl.click(this.hidePresets.bind(this));
 49            this.activeAnimationEl.click(this.showPresets.bind(this));
 50        },
 51
 52        showPresets: function() {
 53            var topOffset = this.activeAnimationEl.offset(),
 54                height = this.activeAnimationEl.outerHeight(),
 55                width = this.activeAnimationEl.outerWidth();
 56            this.animationsEl.css("top", topOffset.top + height);
 57            this.animationsEl.css("left", topOffset.left);
 58            this.animationsEl.css("width", width);
 59            this.animationsEl.show();
 60            this.animationsEl.before(this.outsideLayerEl);
 61        },
 62
 63        hidePresets: function() {
 64            this.animationsEl.hide();
 65            this.outsideLayerEl.detach();
 66        },
 67        
 68        enableSaveAs: function(){
 69            this.saveAsEl.removeClass('disabled');
 70        },
 71
 72        onSaveAsClicked: function() {
 73            if (this.presetStore.savePresetAs())
 74                this.saveAsEl.addClass('disabled');
 75            return false;
 76        },
 77
 78        onDeleteClicked: function(preset) {
 79            this.presetStore.deletePreset(preset);
 80            this.hidePresets();
 81        },
 82
 83        onPresetsLoaded: function() {
 84            this.animationsContainerEl.show();
 85        },
 86
 87        onPresetAdded: function(preset) {
 88            var key = "_" + preset;
 89            if (this.presetsByName.hasOwnProperty(key))
 90                return;
 91            var el = $("<li />")
 92                .append($('<a href="#">')
 93                    .text(preset)
 94                    .append($('<span>')
 95                        .addClass('icon icon-remove')
 96                        .click(function(){                                                                 
 97                            var message = "Are you sure you want to delete the '"+ preset +"' preset?";
 98                            if(window.confirm(message))
 99                                this.onDeleteClicked(preset)
100                         }.bind(this))
101                     )
102                )
103                .click(this.onPresetNameClicked.bind(this, preset))
104                .appendTo(this.animationsEl);
105            this.presetsByName[key] = el;
106            return el;
107        },
108
109        onPresetNameClicked: function(preset) {
110            this.hidePresets();
111            this.presetStore.loadPreset(preset);
112            return false;
113        },
114
115        onPresetRemoved: function(preset) {
116            var key = "_" + preset,
117                removedEl = this.presetsByName[key];
118            if (!removedEl)
119                return;
120            delete this.presetsByName[key];
121            removedEl.remove();
122        },
123
124        onActivePresetChanged: function(newPreset, oldPreset) {
125            var oldEl = this.presetsByName["_" + oldPreset],
126                newEl = this.presetsByName["_" + newPreset];
127            if (oldEl) 
128                oldEl.removeClass("current");
129            if (!newEl)
130                newEl = this.onPresetAdded(newPreset);
131            newEl.addClass("current");
132            this.activeAnimationEl.text(newPreset);
133        }
134
135    };
136
137    Global.PresetStoreView = PresetStoreView;
138
139})();