﻿$(document).ready(function() {   
    contentToggle();
    jewellerLookup.init();
});

function contentToggle(selector, onstateClass) {
    selector = selector || 'a.js-toggle';
    onstateClass = onstateClass || 'expanded';
    $(selector).click(function(e) {
        var el = $(this);
        var target = $(el.parents('div').get(0)).find('.' + el.attr('href').substring(1));

        e.preventDefault();
        this.blur();
        target.removeClass('js-hide');

        if (el.hasClass(onstateClass)) {
            target.hide();
            el.removeClass(onstateClass);
        }
        else {
            target.show();
            el.addClass(onstateClass);
        }
    });
};

var jewellerLookup = {
    parent: [],
    scrollPane: null,
    finalSelectListName: '',
    service: '',
    isAutoRedirect: null,
    redirectUniqueId: null,
    redirectMethod: function() {
        var obj = this;
        setTimeout(
			function() {
			    obj.name = jewellerLookup.redirectUniqueId;
			    __doPostBack(jewellerLookup.redirectUniqueId, obj.value);
			}, 1);
    },
    init: function() {
        var that = this;
        that.finalSelectListName = 'DdlJeweller';
        that.scrollPane = $('#forevermark-main div.col-2 div.col-scroll')[0] || null;

        that.parent = $('#jeweller-lookup');
        if ($('#change_jeweller').length === 0) {
            that.service = 'locator';
        }
        else {
            that.service = 'register';
            // Validate the other input field
            validateInputField('other-field');
        }
        that.parent.removeClass('js-hide');
        var selectName = that.parent.find('select').attr('name');
        if (selectName && (!new RegExp(that.finalSelectListName + '$').test(selectName))) {
            that.parent.find('select').change(this.onChange);
        }
    },
    onChange: function(e) {
        var that = jewellerLookup;
        var elem = $(this);
        var value = elem.val();
        if (value == false) {
            elem.nextAll('select').remove(); // dont lookup for first option
        }
        else {
            that.loadData($(this));
        }

        if (elem.hasClass('jeweller-select') && value === '-1') {
            $("#change_jeweller").removeClass('js-hide').addClass('active').find('span').hide();
        }
        else {
            $("#change_jeweller").
            	addClass('js-hide').removeClass('active').
				find('input.other-field').val('');
        }
    },
    loadData: function(elem, value) {
        if (elem.jquery) {
            elem.get(0).blur();
            value = elem.val();
            elem = elem.attr('name');
        }

        var that = this;
        var jsonDataUrl = '/Encordia/Handlers/EncordiaDealerLocatorHandler.ashx';
        var request = { 'service': that.service };
        request[elem] = value;
        if (elem != that.parent.find('select').attr('name')) {
            request[that.parent.find('select').attr('name')] = that.parent.find('select').val();
        }
        // for local testing...
        //jsonDataUrl = '/json/json_test_'+ elem +'.js';

        var test = $.getJSON(jsonDataUrl, request, function(result, textStatus) {
            if (textStatus != 'success' || !result || !result.name || !result.values || result.values === []) {
                log('Unable to retrieve results, status is: ' + textStatus); // handle error
            }
            else {
                that.makeSelectHtml(result.name, result.cssclass, result.values);
            }
        });
        return true;
    },
    makeSelectHtml: function(name, cssclass, data) {
        var that = this;
        //var cssclassValue = cssclass ? 'size selectFix ' + cssclass : 'size selectFix';
        var cssclassValue = 'size selectFix select-size';
        var id = name.replace(/\$/gi, '_'); // clean .net generated element id
        var selectHtml = '<select id="' + id + '" name="' + name + '" class="' + cssclassValue + '"></select>';
        var select = $('#' + id);

        if (select.length === 0) {
            this.parent.append(selectHtml);
        }
        else {
            select.replaceWith(selectHtml);
        }

        select = this.parent.find('#' + id);
        if (that.scrollPane) {
            that.scrollPane.scrollTop += select.height() + 5;
        }

        // remove dependent fields
        select.nextAll('select').remove();

        if (!id.endsWith(that.finalSelectListName)) {
            select.change(that.onChange);
        }
        else if (this.isAutoRedirect) {
            select[0].onchange = that.redirectMethod;
        }

        var item, dataLen, i, optionHtml;

        for (i = 0, dataLen = data.length; i < dataLen; i++) {
            item = data[i];
            optionHtml = '<option';
            if (item && item.length === 2) {
                optionHtml += ' value="' + item.shift() + '"';
            }
            optionHtml += '>' + item.shift() + '</option>';
            select.append(optionHtml);
        }
    }
};
