var createReactClass = window.p5VendorJs.createReactClass;
var h = window.p5VendorJs.React.createElement;
var ReactDOM = window.p5VendorJs.ReactDOM;
var AsyncTypeahead = window.p5VendorJs.AsyncTypeahead;
var swal = window.swal;
var DBG = DBG || false;


function convertXlinkToObjects(items) {
  var _childCache = {}; // fieldName => { pk => child }
  items.forEach(function (item) {
    var refFields = Object.keys(item).filter(function (fieldName) {
      return (-1 !== fieldName.indexOf(':') && item[fieldName]);
    });
    refFields.forEach(function (fieldName) {
      item[fieldName].forEach(function (child) {
        if (1 === Object.keys(child).length && 'xlink' in child) {
          // xlink
        } else if (Object.keys(child).length > 1) {
          if ('@primaryKey' in child) {
            if (!(fieldName in _childCache)) _childCache[fieldName] = {};
            _childCache[fieldName][ child['@primaryKey'] ] = child;
          }
        }
      })
    })
    return item;
  });
  DBG && console.log('DBG convertXlinkToObjects', { _childCache, items });

  return items.map(function (item) {
    var refFields = Object.keys(item).filter(function (fieldName) {
      return (-1 !== fieldName.indexOf(':') && item[fieldName]);
    });
    refFields.forEach(function (fieldName) {
      item[fieldName] = item[fieldName].map(function (child) {
        if (1 === Object.keys(child).length && 'xlink' in child) {
          var pk = child['xlink'].split('.').pop();
          return _childCache[fieldName][pk];
        }
        return child;
      })
    })
    return item;
  })
}

var P5UI_AddItemToReport_SelectKrsPerson = createReactClass({
  // h(SelectKrsPerson, { krs: this.state.selected })
  // this.props.krs: {
  //   "@primaryKey": "161323",
  //   "A_kod": "80-299",
  //   "A_kraj": "POLSKA",
  //   "A_miejscowosc": "GDAŃSK",
  //   "A_nrDomu": "54C",
  //   "A_nrLokalu": null,
  //   "A_poczta": "GDAŃSK",
  //   "A_ulica": "BARNIEWICKA",
  //   "ID": "161323",
  //   "S_kraj": "POLSKA",
  //   "S_miejscowosc": "GDAŃSK",
  //   "S_wojewodztwo": "POMORSKIE",
  //   "krs": "0000223476",
  //   "nazwa": "BIALL Sp. z o.o.",
  //   "nip": "6040018535",
  //   "regon": "193106935",
  //   "default_db__x3A__BI_audit_KRS_person:BI_audit_KRS_person": [
  //     {
  //       "@primaryKey": "747004",
  //       "ID": "747004",
  //       "imiona": "ADRIAN RYSZARD",
  //       "nazwisko": "WIECZORKOWSKI",
  //       "pesel": "75040301615"
  //     },
  //     {
  //       "@primaryKey": "747003",
  //       "ID": "747003",
  //       "imiona": "EWA",
  //       "nazwisko": "WIECZORKOWSKA",
  //       "pesel": "75090401549"
  //     },
  render: function () {
    var krsPresons = (this.props.krs && this.props.krs['default_db__x3A__BI_audit_KRS_person:BI_audit_KRS_person'])
    ? this.props.krs['default_db__x3A__BI_audit_KRS_person:BI_audit_KRS_person']
    : [];
    var _selectPerson = this.props.selectPerson.bind(this)

    return (krsPresons.length > 0)
    ? h('ol', { style: { margin: '22px', textAlign: 'left' } }, krsPresons.map(function (person) {
      return h('li', {}, [
        (person.imiona || '') + ' ' + (person.nazwisko || '') + ', ' + (person.pesel || ''),
        h('button', {
          className: "btn btn-primary",
          style: { marginLeft: "8px", padding: "4px 8px", fontSize: "small" },
          onClick: function () { _selectPerson(person) }
        }, "Dodaj osobę")
      ]);
    }))
    : null;
  }
});

var P5UI_AddItemToReport_BazaMenuItem = createReactClass({
    // this.props: { key: option.ID, baza: selectedBaza, data: option }
    render: function () {
        return h('div', {}, this.props.data.label);
    }
});

var P5UI_AddItemToReport = createReactClass({
    getInitialState: function () {
        return {
            baza: null,
            newItemBaza: null,
            isSearching: false,
            selected: null,
        };
    },
    _handleSelectBaza: function (baza) {
        this.setState({ baza: baza, newItemBaza: null });
    },
    _handleSelectNewItem: function (baza) {
        this.setState({ baza: null, newItemBaza: baza });
    },
    _handleSelected: function (selected) {
        this.setState({ selected: (selected.length > 0) ? selected[0] : null });
    },
    _handleSearch: function (query) {
        this.setState({ isSearching: true });
        var _setState = this.setState.bind(this);
        var baza = this.state.baza;
        var options= [];
        window.fetch(URL_FETCH_FROM_BAZA, {
					method: 'POST',
					header: {
						'contentType': 'applications/json'
					},
					credentials: 'same-origin',
					body: JSON.stringify({
						baza: baza,
            query: query,
					})
				})
        .then(function(response) {
          return response.text();
        })
        .then(function(responseText) {
					try {
						return JSON.parse(responseText);
					} catch (e) {
						throw responseText;
					}
				})
				.then(function(result) {
					if (result.type == 'success') {
						// p5UI__notifyAjaxCallback(result);
            if (result.body && result.body.items && result.body.items.length > 0) {
              return result.body.items;
            } else {
              p5UI__notifyAjaxCallback({ type: 'warning', msg: "Brak danych pasujących do kryteriów wyszukiwania" });
            }
					}
				})
        .then(function(items) {
          DBG && console.log('items fetched:', items);
          _setState({ isSearching: false, options: convertXlinkToObjects(items) });
        })
        .catch(function(error) {
          DBG && console.log('request failed', error);
        })
    },
    componentWillUnmount: function () {
        DBG && console.log("DBG: conponentDidUnmount...");
    },
    render: function () {
        var bazaBtns = [];
        bazaBtns.push({ baza: "default_db/BI_audit_KRS/BI_audit_KRS", title: "KRS - Firmy", label: "KRS" });
        bazaBtns.push({ baza: "default_db/BI_audit_KRS_person/BI_audit_KRS_person", title: "KRS - Osoby", label: "KRS/p" });
        bazaBtns.push({ baza: "default_db/BI_audit_MSIG/BI_audit_MSIG", title: "MSIG - Firmy", label: "MSIG" });
        bazaBtns.push({ baza: "default_db/BI_audit_MSIG_person/BI_audit_MSIG_person", title: "KRS - Osoby", label: "MSIG/p" });
        bazaBtns.push({ baza: "default_db/BI_audit_taxpayer/BI_audit_taxpayer", title: "VAT - Aktywni płatnicy", label: "VATp" });
        bazaBtns.push({ baza: "default_db/BI_audit_CEIDG/BI_audit_CEIDG", title: "CEIDG", label: "CEIDG" });

        var newItemBtns = [];
        newItemBtns.push({ baza: "default_db/BI_audit_ENERGA_PRACOWNICY/BI_audit_ENERGA_PRACOWNICY", title: "Nowa osoba", label: "Nowa osoba" });
        newItemBtns.push({ baza: "default_db/BI_audit_ENERGA_RUM_KONTRAHENCI/BI_audit_ENERGA_RUM_KONTRAHENCI", title: "Nowy podmiot", label: "Nowy podmiot" });

        function generateBazaBtn(btn, opts) {
            return h('button', {
                title: btn.title,
                className: "btn btn-success" + (opts.selected ? " active" : ""),
                style: { margin: "3px" },
                onClick: function () {
                    opts.onClick(btn.baza)
                },
            }, btn.label)
        }

        function generateNewItemBtn(btn, opts) {
            return h('button', {
                title: btn.title,
                className: "btn btn-success" + (opts.selected ? " active" : ""),
                style: { margin: "3px" },
                onClick: function () {
                    opts.onClick(btn.baza)
                },
            }, btn.label)
        }

        var handleSelectBaza = this._handleSelectBaza.bind(this);
        var handleSelectNewItem = this._handleSelectNewItem.bind(this);
        var selectedBaza = this.state.baza;
        var selectedNewItem = this.state.newItemBaza;
        var selectedItem = this.state.selected;
        var selectedLabel = '';
        if (selectedBaza) {
            var selBazaBtn = bazaBtns.filter(function (btn) { return btn.baza === selectedBaza; })
            if (selBazaBtn) {
                selBazaBtn[0].title
            }
        }
        var handleSearch = this._handleSearch.bind(this);
        var handleSelected = this._handleSelected.bind(this);
        var _onSelect = this.props.onSelect;
        DBG && console.log('DBG: render this.state.options', this.state.options);
        return h('div', {}, [
            h('p', { style: { textAlign: "center" } }, "Wybierz bazę"),
            h('div', { style: { marginBottom: '22px' } },
                bazaBtns.map(function (btn) {
                    return generateBazaBtn(btn, {
                        onClick: handleSelectBaza,
                        selected: (selectedBaza === btn.baza),
                    });
                }).concat(
                    newItemBtns.map(function (btn) {
                        return generateNewItemBtn(btn, {
                            onClick: handleSelectNewItem,
                            selected: (selectedNewItem === btn.baza),
                        });
                    })
                )
            ),
            selectedBaza && h(AsyncTypeahead, {
                isLoading: this.state.isSearching,
                allowNew: false,
                multiple: false,
                options: this.state.options,
                labelKey: "label",
                // labelKey: function (option) {
                //   return [
                //     option.nazwa.replace('"', ''),
                //     option.nip,
                //     option.krs,
                //     option.regon,
                //     option.S_miejscowosc,
                //   ].join(' ')
                // },
                minLength: 3,
                onSearch: handleSearch,
                placeholder: "Wyszukaj...",
                onChange: handleSelected,
                autoFocus: true,
                // filterBy: function (option, text) {
                //   console.log('TODO: filterBy...', {option, text});
                //   return true;
                // },
                renderMenuItemChildren: function (option, props) {
                    return h(P5UI_AddItemToReport_BazaMenuItem, { key: option.ID, baza: selectedBaza, data: option });
                }
            }),
            (selectedNewItem==="default_db/BI_audit_ENERGA_PRACOWNICY/BI_audit_ENERGA_PRACOWNICY") && h('div', { className: 'form-group' }, [
              h('input',{
                className:'form-control required',
                id:'personName',
                placeholder:'Imię'
              }),
              h('input',{
                className:'form-control required',
                id:'personSurname',
                placeholder:'Nazwisko'
              }),
              h('input',{
                className:'form-control required',
                id:'personPesel',
                placeholder:'Pesel'
              }),
              h('input',{
                className:'form-control required',
                id:'personNip',
                placeholder:'NIP'
              })
            ]),
            (selectedNewItem==="default_db/BI_audit_ENERGA_RUM_KONTRAHENCI/BI_audit_ENERGA_RUM_KONTRAHENCI") && h('div', { className: 'form-group' }, [
              h('input',{
                className:'form-control required',
                id:'companyName',
                placeholder:'Nazwa'
              }),
              h('input',{
                className:'form-control required',
                id:'comapanyRegon',
                placeholder:'REGON'
              }),
              h('input',{
                className:'form-control required',
                id:'companyNip',
                placeholder:'NIP'
              })
            ]),
            (selectedBaza && selectedItem) && h('div', { style: { margin: '22px' } }, [
                h('button', {
                    className: "btn btn-primary",
                    onClick: function () {
                        _onSelect(selectedBaza, selectedItem);
                        // ReactDOM.unmountComponentAtNode(document.getElementById('createPracownikAjax__searchBaza'));
                        // swal.close()
                    }
                }, "Dodaj firmę") // TODO:  |> KRS -> firmę, |> KRS Person -> osobę, ....
            ]),
            ('default_db/BI_audit_KRS/BI_audit_KRS' === selectedBaza && selectedItem) && h(P5UI_AddItemToReport_SelectKrsPerson, {
              krs: selectedItem,
              selectPerson: function (person) {
                _onSelect("default_db/BI_audit_KRS_person/BI_audit_KRS_person", person);
                // ReactDOM.unmountComponentAtNode(document.getElementById('createPracownikAjax__searchBaza'));
                // swal.close()
              }
            }),
            (DBG && selectedItem) && h('pre', { style: { textAlign: 'left' } }, JSON.stringify(selectedItem, null, 2)),
        ])
    }
});

function getWindowWidth() {
    var w = window, d = document,
        e = d.documentElement,
        g = d.getElementsByTagName('body')[0];
    return w.innerWidth || e.clientWidth || g.clientWidth;
}

function createPracownikAjax(event) {
    // default_db/BI_audit_KRS/BI_audit_KRS
    // default_db/BI_audit_KRS_person/BI_audit_KRS_person
    // default_db/BI_audit_MSIG/BI_audit_MSIG
    // default_db/BI_audit_MSIG_person/BI_audit_MSIG_person
    // default_db/BI_audit_taxpayer/BI_audit_taxpayer
    // default_db/BI_audit_CEIDG/BI_audit_CEIDG
    // default_db/BI_audit_ENERGA_RUM_UMOWY/BI_audit_ENERGA_RUM_UMOWY
    // default_db/BI_audit_ENERGA_RUM_KONTRAHENCI/BI_audit_ENERGA_RUM_KONTRAHENCI
    // default_db/BI_audit_ENERGA_FAKTURY/BI_audit_ENERGA_FAKTURY

    swal({
        title: "Dodaj osobę lub podmiot",
        width: (getWindowWidth() * 0.8),
        html: '<div id="createPracownikAjax__searchBaza" style="padding:0 24px 24px 24px; min-height:400px"></div>',
        animation: false,
        showConfirmButton: false,
        showCancelButton: false,
        showCloseButton: true,
        onOpen: function () {
            ReactDOM.render(
                h(P5UI_AddItemToReport, {
                    onSelect: function (baza, selected) {
                        //insert do tabeli BI_audit_ENERGA_PRACOWNICY
                        console.log('TODO: selected ', { baza, selected });
                    }
                }),
                document.getElementById('createPracownikAjax__searchBaza')
            )
        }
    }).catch(function (err) {
        DBG && console.log('err', err)
    })
}

global.createPracownikAjax = createPracownikAjax;
// module.exports = {
//     P5UI_AddItemToReport_BazaMenuItem,
//     P5UI_AddItemToReport,
//     createPracownikAjax
// }