var Qs_Form_Element_MultiFile = {
    message: new qs.Message({
        'en': {
            'delete': 'delete',
            'confirmDelete': 'Do you really want to delete this {itemName}?'
        },
        'uk': {
            'delete': 'видалити',
            'confirmDelete': 'Ви дійсно хочете видалити цей {itemName}?'
        }
    }),
    options: {},
    elementOptions: {},

    init: function (id, options)
    {
        Qs_Form_Element_MultiFile.setElementOptions(id, options);
        Qs_Form_Element_MultiFile.updateOptions(id);
    },

    getElementOptions: function (id)
    {
        if (typeof Qs_Form_Element_MultiFile.elementOptions[id] == 'undefined') {
            return null;
        }
        return Qs_Form_Element_MultiFile.elementOptions[id];
    },

    getElementOption: function (id, name)
    {
        var options = Qs_Form_Element_MultiFile.getElementOptions(id);
        if (options) {
            if (typeof options[name] != 'undefined') {
                return options[name];
            }
        }
        return null;
    },

    setElementOption: function (id, name, value)
    {
        var options = Qs_Form_Element_MultiFile.getElementOptions(id);
        if (options) {
            options[name] = value;
        } else {
            Qs_Form_Element_MultiFile.elementOptions[id] = {name: value};
        }
    },

    setElementOptions: function (id, options)
    {
        Qs_Form_Element_MultiFile.elementOptions[id] = options;
    },

    _renderInput: function(type, name, attribs, options)
    {
        var value = '';
        var className = '';
        if (attribs) {
            id = attribs.id;
            className = attribs['class'];
        }
        if (!className) {
            className = type;
        }
        html = '<input type = "' + type + '" '
             + 'class="' + className + '"'
             + 'value="' + value + '" '
             + 'name="' + name + '"/>';
        return html;
    },

    add: function (id)
    {
        var itemName = Qs_Form_Element_MultiFile.getElementOption(id, 'itemName');
        var name = Qs_Form_Element_MultiFile.getElementOption(id, 'name');

        var table = document.getElementById(id);
        var row = '<tr>';
        row += '<td class="file">'
             + Qs_Form_Element_MultiFile._renderInput('file', name, {'class': 'file'});
             + '</td>';
        row += '<td class="size"></td>';
        row += '<td class="options">';
        row += '<a class="del" '
             + 'href="#" onclick="return Qs_Form_Element_MultiFile.del(this, \'' + id + '\');">'
             + Qs_Form_Element_MultiFile.message.get('delete') + "</a>";
        row += '</td>';
        $('#' + id + ' tbody').append(row);
        row += '</tr>';
        Qs_Form_Element_MultiFile.updateOptions(id);
        return false;
    },

    del: function (a, id)
    {
        var itemName = Qs_Form_Element_MultiFile.getElementOption(id, 'itemName');
        var msg = _.str.tpl(Qs_Form_Element_MultiFile.message.get('confirmDelete'), {itemName: itemName});
        var row = qs.dom.getParentTag(a, 'TR');
        $(row).addClass('mark_delete');
        if (confirm(msg)) {
            if (row) {
                $(row).remove();
            }
            var rows     = $('#' + id + ' a.del').size();
            Qs_Form_Element_MultiFile.updateOptions(id);
            if (rows == 0) {
                Qs_Form_Element_MultiFile.add(id);
            }
        } else {
            $(row).removeClass('mark_delete');
        }
        return false;
    },

    hideLink: function (link)
    {
        $(link).hide();
        $(link).each(function(i, el){
            if (el.nextSibling && el.nextSibling.tagName == 'SPAN') {
                $(el.nextSibling).hide();
            }
        });
    },

    showLink: function (link)
    {
        $(link).show();
        $(link).each(function(i, el){
            if (el.nextSibling && el.nextSibling.tagName == 'SPAN') {
                $(el.nextSibling).show();
            }
        });
    },

    updateOptions: function (id)
    {
        var selector = '#' + id + ' a';
        var del      = selector + '.del';
        var rows     = $(del).size();
        var required = Qs_Form_Element_MultiFile.getElementOption(id, 'required');
        Qs_Form_Element_MultiFile.showLink(del);
        if (rows == 1 && required) {
            Qs_Form_Element_MultiFile.hideLink(del);
        }
    }
}