var ITEM  = "<div>"
 + "\n    <label for=\"title-{%id}\" class=\"fixed\">Название:<\/label>"
 + "\n    <input id=\"title-{%id}\" name=\"data[order][{%id}][title]\" \/>"
 + "\n    <button type=\"button\" onclick=\"Store.add(this)\">Добавить<\/button>"
 + "\n    <button type=\"button\" onclick=\"Store.del(this)\">Удалить<\/button>"
 + "\n<\/div>"
 + "\n<div>"
 + "\n    <label for=\"year-{%id}\" class=\"fixed\">Год:<\/label>"
 + "\n    <input id=\"year-{%id}\" name=\"data[order][{%id}][year]\" class=\"year\" value=\"2007\" \/>"
 + "\n    <label for=\"quantity-{%id}\">Количество:<\/label>"
 + "\n    <input id=\"quantity{%id}\" name=\"data[order][{%id}][quantity]\" class=\"quantity\" value=\"1\" \/>"
 + "\n<\/div>";
var DONE  = "<h3>Спасибо, {%order.name}, вот ваш заказ:<\/h3>"
 + "\n<ul>"
 + "\n<form method=\"POST\" action=\"http:\/\/www.plrc.ru\/cgi-bin\/bookstore.cgi\" name=\"order\">"
 + "\n<input type=\"hidden\" name=\"fio\" value=\"{%order.name}\">"
 + "\n<input type=\"hidden\" name=\"email\" value=\"{%order.email}\">"
 + "\n<input type=\"hidden\" name=\"order\" value=\"{%order.order}\">"
 + "\n<input type=\"hidden\" name=\"tel\" value=\"{%order.tel}\">"
 + "\n<input type=\"hidden\" name=\"fax\" value=\"{%order.fax}\">"
 + "\n<input type=\"hidden\" name=\"address\" value=\"{%order.address}\">"

 + "\n<br>"
 + "\n    {%order.order}"
 + "\n<\/ul>"
 + "\n<p>"
 + "\n    Имя: <b>{%order.name}<\/b><br \/>"
 + "\n    Эл. почта: <b>{%order.email}<\/b><br \/>"
 + "\n    Tel: <b>{%order.tel}<\/b><br \/>"
 + "\n    Факс: <b>{%order.fax}<\/b><br \/>"
 + "\n    Адрес: <b>{%order.address}<\/b>"
 + "\n<\/p>"
 + "\n<input type=\"submit\" value=\"Отправить подтверждённый заказ оператору\">"
 + "\n<\/form>"
 + "\n<p> Если вы не уверены - заполните форму заказа ещё раз:<\/p>"
 + "\n<a href=\"click-to:form\" onclick=\"Store.form(); return false;\">Разместить заказ ещё раз или новый заказ<\/a>";
var ORDER = "{%item.title} ({%item.year}) &mdash; &mdash; {%item.quantity}"
 + "\n";
var FORM  = "<fieldset>"
 + "\n    <legend>Ваш заказ<\/legend>"
 + "\n    <ol id=\"order\" class=\"fields\">"
 + "\n        <li>"
 + "\n            <div>"
 + "\n                <label for=\"title\" class=\"fixed\">Название:<\/label>"
 + "\n                <input id=\"title\" name=\"data[order][1][title]\" size=\"40\" \/>"
 + "\n                <button type=\"button\" onclick=\"Store.add(this)\">Добавить<\/button>"
 + "\n            <\/div>"
 + "\n            <div>"
 + "\n                <label for=\"year\" class=\"fixed\">Год:<\/label>"
 + "\n                <input id=\"year\" name=\"data[order][1][year]\" class=\"year\" value=\"2007\" \/>"
 + "\n                <label for=\"quantity\">Количество:<\/label>"
 + "\n                <input id=\"quantity\" name=\"data[order][1][quantity]\" class=\"quantity\" value=\"1\" \/>"
 + "\n            <\/div>"
 + "\n        <\/li>"
 + "\n    <\/ol>"
 + "\n<\/fieldset>"
 + "\n<fieldset>"
 + "\n    <legend>Ваша контактная информация<\/legend>"
 + "\n    <ul class=\"fields\">"
 + "\n        <li>"
 + "\n            <label for=\"order-name\">Имя:<\/label>"
 + "\n            <input name=\"data[name]\" id=\"order-name\" \/>"
 + "\n        <\/li>"
 + "\n        <li>"
 + "\n            <label for=\"order-email\">Эл. почта:<\/label>"
 + "\n            <input name=\"data[email]\" id=\"order-email\" \/>"
 + "\n        <\/li>"
 + "\n        <li>"
 + "\n            <label for=\"order-tel\">Телефон:<\/label>"
 + "\n            <input name=\"data[tel]\" id=\"order-tel\" \/>"
 + "\n        <\/li>"
 + "\n        <li>"
 + "\n            <label for=\"order-fax\">Факс:<\/label>"
 + "\n            <input name=\"data[fax]\" id=\"order-fax\" \/>"
 + "\n        <\/li>"
 + "\n        <li>"
 + "\n            <label for=\"order-address\">Адрес:<\/label>"
 + "\n            <textarea name=\"data[address]\" id=\"order-address\"><\/textarea>"
 + "\n        <\/li>"
 + "\n        <li class=\"button\">"
 + "\n            <button type=\"submit\">Заказать<\/button>"
 + "\n        <\/li>"
 + "\n    <\/ul>"
 + "\n<\/fieldset>";

var id = 1;

var Store = function (){
    var self = this;

    self.Interface = new BaseInterface(URL['home'] + 'api/book-store/');

    self.Interface.Client.receive_add = function (Request, handler) {
        // parse response
        var response = {};
        if (Request.xml_response) {
            response = self.Interface.Client.parse_xml_response(Request.xml_response);
            var root = XMLProcessor.get_root_element(Request.xml_response);
            var items = root.getElementsByTagName('item');
            if (items[0]) {
                response.item = XMLProcessor.get_node_data(items[0]);
            }

            var order = root.getElementsByTagName('order');
            response.item.order = [];
            for (var i = 0; i < order.length; i ++) {
                response.item.order.push({
                    title: order[i].getAttribute('title'),
                    year: order[i].getAttribute('year'),
                    quantity: order[i].getAttribute('quantity')
                });
            }

        } else {
            var response = {};
        }

        // call handler
        handler(response);
    }

    self.order = function (form) {
        self.Interface.add(FormHelper(form).get_data(), self.handle);
    }

    self.handle = function (response) {
        if (response && response.status == 'ok') {
            var message = document.createElement('DIV');
            message.id = 'message';

            var order = '';
            for (var i = 0; i < response.item.order.length; i ++) {
                Template.assign('item', response.item.order[i]);
                order += Template.transform(ORDER);
            }

            response.item.order = order;
//            response.item.address = response.item.address.replace(new RegExp('\n', 'g'), '<br />');

            Template.assign('order', response.item);
            message.innerHTML = Template.transform(DONE);
            Nodes(ID('order-form')).replace(message);
        } else {
            alert('error');
        }
    }

    self.add = function (button) {
        var item = document.createElement('LI');
        item.className = 'div';
        Template.assign('id', ++ id);
        item.innerHTML = Template.transform(ITEM);
        Nodes(button).ancestor_tag('OL').insertBefore(item, Nodes(button).ancestor_tag('LI').nextSibling);
    }

    self.del = function (button) {
        remove(Nodes(button).ancestor_tag('LI'));
    }

    self.form = function () {
        var form = document.createElement('FORM');
        form.method = 'post';
        form.id = 'order-form';
        form.onsubmit = function () {
            self.order(form);
            return false;
        }
        form.innerHTML = FORM;
        Nodes(ID('message')).replace(form);
    }

    return self;
};

window.onload = function () {
    Store = new Store;
}