/** * @private */Ext.define('Ext.ux.colorpick.ButtonController', { extend: 'Ext.app.ViewController', alias: 'controller.colorpick-buttoncontroller', requires: [ 'Ext.Dialog', 'Ext.ux.colorpick.Selector', 'Ext.ux.colorpick.ColorUtils' ], afterRender: function(view) { view.updateColor(view.getColor()); }, destroy: function() { var view = this.getView(), colorPickerWindow = view.colorPickerWindow; if (colorPickerWindow) { colorPickerWindow.destroy(); view.colorPickerWindow = view.colorPicker = null; } this.callParent(); }, getPopup: function() { var view = this.getView(), popup = view.colorPickerWindow, selector; if (!popup) { popup = Ext.create(view.getPopup()); view.colorPickerWindow = popup; popup.colorPicker = view.colorPicker = selector = popup.lookupReference('selector'); selector.setFormat(view.getFormat()); selector.on({ ok: 'onColorPickerOK', cancel: 'onColorPickerCancel', scope: this }); popup.on({ close: 'onColorPickerCancel', scope: this }); } return popup; }, // When button is clicked show the color picker window onClick: function() { var me = this, view = me.getView(), color = view.getColor(), popup = me.getPopup(), colorPicker = popup.colorPicker; colorPicker.setColor(color); colorPicker.setPreviousColor(color); popup.show(); }, onColorPickerOK: function(picker) { var view = this.getView(), color = picker.getColor(), cpWin = view.colorPickerWindow; cpWin.hide(); view.setColor(color); }, onColorPickerCancel: function() { var view = this.getView(), cpWin = view.colorPickerWindow; cpWin.hide(); }, syncColor: function(color) { var view = this.getView(); Ext.ux.colorpick.ColorUtils.setBackground(view.filterEl, color); }});