/*globals define*/
/*jslint nomen:true*/

/**
 * @class jQuery.ui.presentationUiTray
 * @author Copyright 2006-2013, epages GmbH, All Rights Reserved
 *
 * The ui tray widget creates a button next to the used input.
 * By clicking the button a dialog opens which offers the possibility to select elements from a table.
 *
 * ### Example
 * HTML:
 *
 *     <button class="ep-tray">My button label</button>
 *
 * JavaScript:
 *
 *     $('.ep-tray').uiTray({
 *         node: $('button.ep-tray'),
 *         smartSearch: {
 *             source: 'JSONSmartSearchProductAlias',
 *             placeholder: 'Produkt Number',
 *             name: 'NewProduct',
 *         dialogTitle: 'My assignment dialog',
 *         pageId: #ID,
 *         changeAction: 'JSONInsertProducts',
 *         tabs: {
 *             products: {
 *                 id: #Shop.ProductFolder.ID
 *                 action: 'JSONSearchProductsToInsert',
 *                 additionslContent: '<a href="#">Additional content</a>'
 *             }
 *         },
 *     });
 *
 *  Use setup.js to set up a new tray instance!
 *
 * @uses jQuery.ui.widget
 * @uses de_epages
 * @uses de_epages/presentation/tray
 * @uses ep.ui.input
 * @uses ep.ui.smartsearch
 *
 * @chainable
 * @return {Object} de_epages
 */

define('de_epages/presentation/ui/tray', [
    'jquery/ui/widget',
    'de_epages',
    '../tray',
    '$dict!../dictionary',

    'ep/ui/input',
    'ep/ui/smartsearch'
], function ($, de_epages, Tray, dict) {
    'use strict';

    $.widget('ui.presentationUiTray', {
    //  collection will be set in de_epages.presentation.tray to get access to the backbone collection from outside the widget
    //  collection,

        /**
         * Options to be passed to the widgt on initialzation
         *
         * @cfg {Object}   options
         * @cfg {String}   [options.label='{Add Elements} ...'] Label for opening button
         * @cfg {Object}   [options.smartSearch=undefined] A DOM (input) node where the smart search is added
         * @cfg {Function} [options.afterRender=undefined] A method called at the end of the render method of the trays main view
         * @cfg {callback} [options.callback=$.noop] Callback that is fired on apply
         * @cfg {Object}   [options.dialog] Options for creating the tray's dialog
         */
        options: {
            label: dict.translate('AddFromTray') + '...',
            smartSearch: undefined,
            afterRender: undefined,
            callback: $.noop,
            tabs: undefined,
            dialog: {}
        },

        /**
         * Creates the object finder dialog by clicking on the widget element
         *
         * @since 6.17.0
         */
        _create: function () {
            var self = this,
                o = self.options;

            self.element.on('click.uiPresentationUiTray', function (e) {
                o.searchString = o.smartSearch ? o.smartSearch.val() : '';

                if (!self.tray) {
                    self.tray = new Tray(o);
                }

                self.tray.open(o.searchString, self);
            });
        },

        /**
         * Removes the added event listeners and DOM elements
         *
         * @since 6.17.0
         */
        destroy: function () {
            if (this.tray) {
                this.tray.destroy();
            }

            this.element.off('click.uiPresentationUiTray');

            this._superApply(arguments);
        }
    });

    return de_epages;
});