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

define('de_epages/shop/linkpicker/linktextview', [
    'jquery',
    'backbone',
    'ep',
    '$tmpl!de_epages/shop/linkpicker/linktextview',
    '$dict!../dictionary',
    'ep/ui/input'
    /**
     * External url view
     * @param  {Function}       $           jQuery
     * @param  {Function}       Backbone    Backbone
     * @param  {Function}       ep          Used for accessing ep.config.storeFrontUrl
     * @param  {Function}       template    Template for rendering the link text view
     * @param  {Function}       dict        Dictionary
     * @return {Backbone View}              Link text view
     */
], function ($, Backbone, ep, template, dict) {
    'use strict';

    return Backbone.View.extend({

        /**
         * Tag used for $el
         * @type {String}
         */
        tagName: 'div',

        /**
         * Rendered template with translations
         * @type {String}
         */
        template: template({}).dictParse(dict, true),

        /**
         * Events the view listens to
         * @type {Object}
         */
        events: {
            'change input#ep-linkpicker-linkText': '_publishLinkText',
            'change input#ep-linkpicker-linkTargetBlank': '_publishTargetOption',
            'click .ep-linkpicker-linkPreview': '_openPreview'
        },

        /**
         * Append the template and process inputs
         * @return {Backbone view}
         */
        render: function () {
            var template = this.template;

            template
                .find('span, a')
                .dictParseAttr(dict, 'title')
                .end()
                .find(':input')
                .uiInput();

            $.extend(this, template.tmplItem('elements'));

            this.$el.append(template);

            return this;
        },

        /**
         * Gets the link text from the input field
         * @return {String} link text
         */
        getLinkText: function () {

            return this.linkText.val();
        },

        /**
         * Sets the link text of the input field
         * @param {String} _text [link text]
         */
        setLinkText: function (_text) {

            this.linkText.val(_text);
        },

        /**
         * Sets the link url which is the title of all preview links
         * (little globe and the 'Preview' itself) since this is used by '_openPreview' to determine the location
         * @param {String} _url [Url to be set]
         */
        setLinkUrl: function (_url) {

            // set
            this.linkPreview.each(function () {
                $(this).attr('title', _url);
            });
        },

        /**
         * Sets the link target
         * @param {Boolean} _is_linkTargetBlank [true if link should be opened in a new window, false otherwise]
         */
        setLinkTarget: function (_is_linkTargetBlank) {

            this.linkTargetBlank.prop('checked', _is_linkTargetBlank);
        },

        /**
         * Open link in preview window, check if url exists and add protocol / server address or storefront url if necessary
         * @param   {Event} _event [Event that was fired]
         * @private
         */
        _openPreview: function (_event) {

            _event.preventDefault();
            _event.stopPropagation();

            var url = $(_event.target).attr('title');

            if (url !== '' && url !== 'http://') {

                if (url.indexOf("?") !== 0) { // no relative url?
                    if (url.indexOf("/") !== 0) { // no file?

                        // What Benni was thinking:
                        // if the url contains no '//' (protocol), url.split returns the original string (length ===1)
                        // so we need to add a protocol in front of the url (hilarious check, isn't it)
                        if (url.split('//').length === 1) {
                            url = "http://" + url;
                        }
                    } else { //file
                        url = ep.config.protocolAndServer + url;
                    }
                } else {
                    url = ep.config.storeFrontUrl + url;
                }

                window.open(url, 'LinkpickerPreview');
                this.trigger('previewopened', url);
            }
        },

        /**
         * Trigger the 'linktextchanged' event and publish linktext
         * @param   {Event} _event [Event that was fired]
         * @private
         */
        _publishLinkText: function (_event) {
            this.trigger('linktextchanged', $(_event.target).val());
        },

        /**
         * Trigger the 'targetoptionchanged' event and publish if link should be opened in new window
         * @param   {Event} _event [Event that was fired]
         * @private
         */
        _publishTargetOption: function (_event) {
            this.trigger('targetoptionchanged', $(_event.target).is(':checked'));
        }
    });
});