jQuery(document).ready(function() {
    $('a#quick-search-btn').qtip({
        content: {
            title: {
                text: '<img src="/Templates/Public/Styles/images/precio-logo.jpg" alt="Precio Logga" />',
                button: '<img src="/Templates/Public/Styles/images/close.png" alt="Stäng" title="Stäng" />'
            },
            text: '<div><input type="text" id="quick-search-text" /><a href="#" class="grey-btn" id="quick-search-submit">Sök</a></div>'
        },

        position: {
            target: $(document.body), // Position it via the document body...
            corner: 'topCenter', // ...at the top center of the viewport
            adjust: { y: 100 } // adjust 100px down
        },

        show: {
            when: 'click',
            ready: false,
            solo: true // And hide all other tooltips
        },

        hide: {
            when: {
                event: 'unfocus'
            }
        },
        style: {
            width: 350,
            height: 40,
            padding: '14px',
            border: {
                width: 9,
                radius: 5,
                color: '#eee'
            },

            title: {
                'background-color': '#fff'
            },

            classes: {
                content: 'quick-search-modal'
            }
        },
        api: {
            beforeShow: function() {
                // Fade in the modal "blanket" using the defined show speed
                $('#qtip-blanket').fadeIn(this.options.show.effect.length);

                $('#quick-search-text').val('Skriv in sökord...');
                

                $('#quick-search-text').click(function(e) {
                    if ($('#quick-search-text').val() == 'Skriv in sökord...') {
                        $('#quick-search-text').val('');
                    }
                });

                $('#quick-search-text').keydown(function(e) {
                    if (e.keyCode == 13) {
                        window.location = '/sok/?q=' + $('#quick-search-text').val();
                    }
                });

                $('#quick-search-submit').click(function(e) {
                    window.location = '/sok/?q=' + $('#quick-search-text').val();
                });
            },
            
            onShow: function() {
                $('#quick-search-text').select().focus();
            },
            
            beforeHide: function() {
                // Fade out the modal "blanket" using the defined hide speed
                $('#qtip-blanket').fadeOut(this.options.hide.effect.length);
            },

            onRender: function() {
                var self = this;

                //Activate a key listener
                $(document).keydown(function(e) {
                    //Hide the modal dialog if the escape key is pressed
                    if (e.keyCode == 27) {
                        self.hide();
                    }
                });
            }
        }
    }).removeAttr('href'); //Remove default href functionality
});