/* eslint-disable */
import React from 'react';
import connect from '@vkontakte/vk-connect';
import { View, platform, ModalRoot, ModalPage, Div, Button, ScreenSpinner,  HeaderButton, TabbarItem, Epic, Tabbar, FormLayoutGroup, ModalPageHeader, Input, FormLayout, Alert} from '@vkontakte/vkui';
import '@vkontakte/vkui/dist/vkui.css';
import './panels/assets/css/background.css';
import Icon24Dismiss from '@vkontakte/icons/dist/24/dismiss';
import Icon24Home from '@vkontakte/icons/dist/24/home';
import Icon24Bug from '@vkontakte/icons/dist/24/bug';

import Home from './panels/Home';
import Persik from './panels/Persik';
import House from './panels/House';
import Pet from './panels/Pet';
import MyPet from './panels/MyPet';
import MyHouse from './panels/MyHouse';
import Dop from './panels/Dop';
import Top from './panels/Top';
import Reit from './panels/Reit';
import Sett from './panels/Sett';
import ChangeNickname from './panels/ChangeNickname';
import Transfer from './panels/Transfer';
import Katalog from './panels/Katalog';
import Imus from './panels/Imus';

const MODAL_PAGE_FILTERS = 'filters';

import Upgrade from './panels/Upgrade';

function openTab(url) {

// Create link in memory

let a = window.document.createElement("a");

a.target = '_blank';

a.href = url;

// Dispatch fake click

let e = window.document.createEvent("MouseEvents");

e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

a.dispatchEvent(e);

};



class App extends React.Component {
	constructor(props) {
		super(props);

		this.state = {
			activePanel: 'home',
            fetchedUser: null,
            userAcc: null,
			activeTab6: 'all',
            clicks: 0,
            reputation: 0,
            speed: 0,
            activeModal: null,
            aspeed: 0,
            priv: null,
            name: false,
            popout: null,
            calcRep: 0,
            nick: null,
            toid: 0,
            history: 0,
            history1: null,
            history2: null,
            history3: null,
            history4: null,
            history5: null,
            history6: null,
            history7: null,
            history8: null,
            history9: null,
            activeStory: 'home',
            history10: null,
            h_id1: 0,
            h_id2: 0,
            h_id3: 0,
            h_id4: 0,
            h_id5: 0,
            h_id6: 0,
            h_id7: 0,
            h_id8: 0,
            h_id9: 0,
            h_id10: 0,
            h_s1: 0,
            h_s2: 0,
            h_s3: 0,
            h_s4: 0,
            h_s5: 0,
            h_s6: 0,
            h_s7: 0,
            h_s8: 0,
            h_s9: 0,
            h_s10: 0,
            viv: 0,
            v1: null,
            v2: null,
            v3: null,
            v4: null,
            v5: null,
            v6: null,
            v7: null,
            v8: null,
            v9: null,
            v10: null,
            v_id1: 0,
            v_id2: 0,
            v_id3: 0,
            v_id4: 0,
            v_id5: 0,
            v_id6: 0,
            v_id7: 0,
            v_id8: 0,
            v_id9: 0,
            v_id10: 0,
            v_s1: 0,
            v_s2: 0,
            v_s3: 0,
            v_s4: 0,
            modalHistory: [],
            v_s5: 0,
            v_s6: 0,
            v_s7: 0,
            v_s8: 0,
            v_s9: 0,
            v_s10: 0,
            transferCoins: 0,
            usersTop: null,
            groupsTop: null,
            activeTabUpgrades: 'click',
            activeTabTop: 'users',
            upgradesOne: null,
            upgradesTwo: null,
            sp: 0
		};
        this.openDefault = this.openDefault.bind(this);
        this.closePopout = this.closePopout.bind(this);
        this.handleReputationChange = this.handleReputationChange.bind(this);
        this.handleReputationSubmit = this.handleReputationSubmit.bind(this);
        this.handleNickChange = this.handleNickChange.bind(this);
        this.handleNickSubmit = this.handleNickSubmit.bind(this);
        this.handleTransferChange = this.handleTransferChange.bind(this);
        this.handleTransferSubmit = this.handleTransferSubmit.bind(this);
        this.buyPet = this.buyPet.bind(this);
        this.sellPet = this.sellPet.bind(this);
        this.pohodPet = this.pohodPet.bind(this);
        this.buyHouse = this.buyHouse.bind(this);
        this.onStoryChange = this.onStoryChange.bind(this);
        this.sellHouse = this.sellHouse.bind(this);
        this.pohodHouse = this.pohodHouse.bind(this);
        this.setActiveTabUpgrades = this.setActiveTabUpgrades.bind(this);
        this.setActiveTabTop = this.setActiveTabTop.bind(this);
        this.buyUpgrade = this.buyUpgrade.bind(this);
        this.getUpgradesOne = this.getUpgradesOne.bind(this);
        this.getUpgradesTwo = this.getUpgradesTwo.bind(this);
        this.autoMine = this.autoMine.bind(this);
        this.modalBack = () => {
        this.setActiveModal(this.state.modalHistory[this.state.modalHistory.length - 2]);
  }
    }

 setActiveModal(activeModal) {
    activeModal = activeModal || null;
    let modalHistory = this.state.modalHistory ? [...this.state.modalHistory] : [];

    if (activeModal === null) {
      modalHistory = [];
    } else if (modalHistory.indexOf(activeModal) !== -1) {
      modalHistory = modalHistory.splice(0, modalHistory.indexOf(activeModal) + 1);
    } else {
      modalHistory.push(activeModal);
    }

    this.setState({
      activeModal,
      modalHistory
    });
  };


    openDefault(title, msg, actions) {
        this.setState({
            popout:
                <Alert
                    actions={[actions]}
                    onClose={this.closePopout}
                >
                    <h2>{title}</h2>
                    <p>{msg}</p>
                </Alert>
        });
    }

    closePopout() {
        this.setState({ popout: null });
    }

	componentDidMount() {
		connect.subscribe((e) => {
			switch (e.detail.type) {
				case 'VKWebAppGetUserInfoResult':
                    this.setState({ fetchedUser: e.detail.data });
                    console.log(e.detail.data)
                    this.createUser(e.detail.data);
                    this.setState({ popout: <ScreenSpinner /> });
setTimeout(() => { this.setState({ popout: null }) }, 2000);
                    this.getUsersTop();
                    this.getGroupsTop();
                    this.getUpgradesOne()
                    this.getUpgradesTwo()
					break;
					case 'VKWebAppShowWallPostBoxResult':

  					break;
				default:
					console.log(e.detail.type);
			}
		});
		connect.send('VKWebAppGetUserInfo', {});
        console.log(window.location)
         setInterval(() => {
         this.autoMine();
         this.getUsersTop();
this.getGroupsTop();
         console.log(1);
         }, 1000)
	}

	go = (e) => {
        this.setState({ popout: <ScreenSpinner /> });
setTimeout(() => { this.setState({ popout: null }) }, 1500);
		this.setState({ activePanel: e.currentTarget.dataset.to })
        if(e.currentTarget.dataset.to === "top") {
            this.getUsersTop();
            this.getGroupsTop();
        }
	}

    createUser = (data) => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.create`
        })
            .then((response) => response.json())
            .then((response) => {
                this.setState({ history: response.history })
                this.setState({ history1: response.history1 })
                this.setState({ history2: response.history2 })
                this.setState({ history3: response.history3 })
                this.setState({ history4: response.history4 })
                this.setState({ history5: response.history5 })
                this.setState({ history6: response.history6 })
                this.setState({ history7: response.history7 })
                this.setState({ history8: response.history8 })
                this.setState({ history9: response.history9 })
                this.setState({ history10: response.history10 })
                this.setState({ h_id1: response.h_id1 })
                this.setState({ h_id2: response.h_id2 })
                this.setState({ h_id3: response.h_id3 })
                this.setState({ h_id4: response.h_id4 })
                this.setState({ h_id5: response.h_id5 })
                this.setState({ h_id7: response.h_id7 })
                this.setState({ h_id8: response.h_id8 })
                this.setState({ h_id9: response.h_id9 })
                this.setState({ h_id10: response.h_id10 })
                this.setState({ h_id6: response.h_id6 })
                this.setState({ h_s1: response.h_s1 })
                this.setState({ h_s2: response.h_s2 })
                this.setState({ h_s3: response.h_s3 })
                this.setState({ h_s4: response.h_s4 })
                this.setState({ h_s5: response.h_s5 })
                this.setState({ h_s6: response.h_s6 })
                this.setState({ h_s7: response.h_s7 })
                this.setState({ h_s8: response.h_s8 })
                this.setState({ h_s9: response.h_s9 })
                this.setState({ h_s10: response.h_s10 })
                this.setState({ viv: response.viv })
                this.setState({ v1: response.v1 })
                this.setState({ v2: response.v2 })
                this.setState({ v3: response.v3 })
                this.setState({ v4: response.v4 })
                this.setState({ v5: response.v5 })
                this.setState({ v6: response.v6 })
                this.setState({ v7: response.v7 })
                this.setState({ v8: response.v8 })
                this.setState({ v9: response.v9 })
                this.setState({ v10: response.v10 })
                this.setState({ v_id1: response.v_id1 })
                this.setState({ v_id2: response.v_id2 })
                this.setState({ v_id3: response.v_id3 })
                this.setState({ v_id4: response.v_id4 })
                this.setState({ v_id5: response.v_id5 })
                this.setState({ v_id7: response.v_id7 })
                this.setState({ v_id8: response.v_id8 })
                this.setState({ v_id9: response.v_id9 })
                this.setState({ v_id10: response.v_id10 })
                this.setState({ v_id6: response.v_id6 })
                this.setState({ v_s1: response.v_s1 })
                this.setState({ v_s2: response.v_s2 })
                this.setState({ v_s3: response.v_s3 })
                this.setState({ v_s4: response.v_s4 })
                this.setState({ v_s5: response.v_s5 })
                this.setState({ v_s6: response.v_s6 })
                this.setState({ v_s7: response.v_s7 })
                this.setState({ v_s8: response.v_s8 })
                this.setState({ v_s9: response.v_s9 })
                this.setState({ v_s10: response.v_s10 })
               // console.log(response)
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                //console.log(this.state.userAcc)
            })
            .catch((error) => {
                console.log(error)
            })
    }

    updateUserClicks = async (id) => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.update.click&user_vk=${id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log('user', response)
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.setState({ history: response.history })
                this.setState({ history1: response.history1 })
                this.setState({ history2: response.history2 })
                this.setState({ history3: response.history3 })
                this.setState({ history4: response.history4 })
                this.setState({ history5: response.history5 })
                this.setState({ history6: response.history6 })
                this.setState({ history7: response.history7 })
                this.setState({ history8: response.history8 })
                this.setState({ history9: response.history9 })
                this.setState({ history10: response.history10 })
                this.setState({ h_id1: response.h_id1 })
                this.setState({ h_id2: response.h_id2 })
                this.setState({ h_id3: response.h_id3 })
                this.setState({ h_id4: response.h_id4 })
                this.setState({ h_id5: response.h_id5 })
                this.setState({ h_id7: response.h_id7 })
                this.setState({ h_id8: response.h_id8 })
                this.setState({ h_id9: response.h_id9 })
                this.setState({ h_id10: response.h_id10 })
                this.setState({ h_id6: response.h_id6 })
                this.setState({ h_s1: response.h_s1 })
                this.setState({ h_s2: response.h_s2 })
                this.setState({ h_s3: response.h_s3 })
                this.setState({ h_s4: response.h_s4 })
                this.setState({ h_s5: response.h_s5 })
                this.setState({ h_s6: response.h_s6 })
                this.setState({ h_s7: response.h_s7 })
                this.setState({ h_s8: response.h_s8 })
                this.setState({ h_s9: response.h_s9 })
                this.setState({ h_s10: response.h_s10 })
                this.setState({ viv: response.viv })
                this.setState({ v1: response.v1 })
                this.setState({ v2: response.v2 })
                this.setState({ v3: response.v3 })
                this.setState({ v4: response.v4 })
                this.setState({ v5: response.v5 })
                this.setState({ v6: response.v6 })
                this.setState({ v7: response.v7 })
                this.setState({ v8: response.v8 })
                this.setState({ v9: response.v9 })
                this.setState({ v10: response.v10 })
                this.setState({ v_id1: response.v_id1 })
                this.setState({ v_id2: response.v_id2 })
                this.setState({ v_id3: response.v_id3 })
                this.setState({ v_id4: response.v_id4 })
                this.setState({ v_id5: response.v_id5 })
                this.setState({ v_id7: response.v_id7 })
                this.setState({ v_id8: response.v_id8 })
                this.setState({ v_id9: response.v_id9 })
                this.setState({ v_id10: response.v_id10 })
                this.setState({ v_id6: response.v_id6 })
                this.setState({ v_s1: response.v_s1 })
                this.setState({ v_s2: response.v_s2 })
                this.setState({ v_s3: response.v_s3 })
                this.setState({ v_s4: response.v_s4 })
                this.setState({ v_s5: response.v_s5 })
                this.setState({ v_s6: response.v_s6 })
                this.setState({ v_s7: response.v_s7 })
                this.setState({ v_s8: response.v_s8 })
                this.setState({ v_s9: response.v_s9 })
                this.setState({ v_s10: response.v_s10 })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    updateUserReputation = (id, reputation) => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.update.reputation&user_vk=${id}&reputation_new=${reputation}`
        })
            .then((response) => response.json())
            .then((response) => {
               //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.setState({ history: response.history })
                this.setState({ history1: response.history1 })
                this.setState({ history2: response.history2 })
                this.setState({ history3: response.history3 })
                this.setState({ history4: response.history4 })
                this.setState({ history5: response.history5 })
                this.setState({ history6: response.history6 })
                this.setState({ history7: response.history7 })
                this.setState({ history8: response.history8 })
                this.setState({ history9: response.history9 })
                this.setState({ history10: response.history10 })
                this.setState({ h_id1: response.h_id1 })
                this.setState({ h_id2: response.h_id2 })
                this.setState({ h_id3: response.h_id3 })
                this.setState({ h_id4: response.h_id4 })
                this.setState({ h_id5: response.h_id5 })
                this.setState({ h_id7: response.h_id7 })
                this.setState({ h_id8: response.h_id8 })
                this.setState({ h_id9: response.h_id9 })
                this.setState({ h_id10: response.h_id10 })
                this.setState({ h_id6: response.h_id6 })
                this.setState({ h_s1: response.h_s1 })
                this.setState({ h_s2: response.h_s2 })
                this.setState({ h_s3: response.h_s3 })
                this.setState({ h_s4: response.h_s4 })
                this.setState({ h_s5: response.h_s5 })
                this.setState({ h_s6: response.h_s6 })
                this.setState({ h_s7: response.h_s7 })
                this.setState({ h_s8: response.h_s8 })
                this.setState({ h_s9: response.h_s9 })
                this.setState({ h_s10: response.h_s10 })
                this.setState({ viv: response.viv })
                this.setState({ v1: response.v1 })
                this.setState({ v2: response.v2 })
                this.setState({ v3: response.v3 })
                this.setState({ v4: response.v4 })
                this.setState({ v5: response.v5 })
                this.setState({ v6: response.v6 })
                this.setState({ v7: response.v7 })
                this.setState({ v8: response.v8 })
                this.setState({ v9: response.v9 })
                this.setState({ v10: response.v10 })
                this.setState({ v_id1: response.v_id1 })
                this.setState({ v_id2: response.v_id2 })
                this.setState({ v_id3: response.v_id3 })
                this.setState({ v_id4: response.v_id4 })
                this.setState({ v_id5: response.v_id5 })
                this.setState({ v_id7: response.v_id7 })
                this.setState({ v_id8: response.v_id8 })
                this.setState({ v_id9: response.v_id9 })
                this.setState({ v_id10: response.v_id10 })
                this.setState({ v_id6: response.v_id6 })
                this.setState({ v_s1: response.v_s1 })
                this.setState({ v_s2: response.v_s2 })
                this.setState({ v_s3: response.v_s3 })
                this.setState({ v_s4: response.v_s4 })
                this.setState({ v_s5: response.v_s5 })
                this.setState({ v_s6: response.v_s6 })
                this.setState({ v_s7: response.v_s7 })
                this.setState({ v_s8: response.v_s8 })
                this.setState({ v_s9: response.v_s9 })
                this.setState({ v_s10: response.v_s10 })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    updateUserNickname = (id, nickname) => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.update.nickname&user_vk=${id}&nickname=${nickname}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }

  addv = () => {
	  connect.send("VKWebAppAddToCommunity", {});
	}

    sendTransfer = async (id, toid, count) => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.send.transfer&user_vk=${id}&toid=${toid}&count=${count}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.setState({ history: response.history })
                this.setState({ history1: response.history1 })
                this.setState({ history2: response.history2 })
                this.setState({ history3: response.history3 })
                this.setState({ history4: response.history4 })
                this.setState({ history5: response.history5 })
                this.setState({ history6: response.history6 })
                this.setState({ history7: response.history7 })
                this.setState({ history8: response.history8 })
                this.setState({ history9: response.history9 })
                this.setState({ history10: response.history10 })
                this.setState({ h_id1: response.h_id1 })
                this.setState({ h_id2: response.h_id2 })
                this.setState({ h_id3: response.h_id3 })
                this.setState({ h_id4: response.h_id4 })
                this.setState({ h_id5: response.h_id5 })
                this.setState({ h_id7: response.h_id7 })
                this.setState({ h_id8: response.h_id8 })
                this.setState({ h_id9: response.h_id9 })
                this.setState({ h_id10: response.h_id10 })
                this.setState({ h_id6: response.h_id6 })
                this.setState({ h_s1: response.h_s1 })
                this.setState({ h_s2: response.h_s2 })
                this.setState({ h_s3: response.h_s3 })
                this.setState({ h_s4: response.h_s4 })
                this.setState({ h_s5: response.h_s5 })
                this.setState({ h_s6: response.h_s6 })
                this.setState({ h_s7: response.h_s7 })
                this.setState({ h_s8: response.h_s8 })
                this.setState({ h_s9: response.h_s9 })
                this.setState({ h_s10: response.h_s10 })
                this.setState({ viv: response.viv })
                this.setState({ v1: response.v1 })
                this.setState({ v2: response.v2 })
                this.setState({ v3: response.v3 })
                this.setState({ v4: response.v4 })
                this.setState({ v5: response.v5 })
                this.setState({ v6: response.v6 })
                this.setState({ v7: response.v7 })
                this.setState({ v8: response.v8 })
                this.setState({ v9: response.v9 })
                this.setState({ v10: response.v10 })
                this.setState({ v_id1: response.v_id1 })
                this.setState({ v_id2: response.v_id2 })
                this.setState({ v_id3: response.v_id3 })
                this.setState({ v_id4: response.v_id4 })
                this.setState({ v_id5: response.v_id5 })
                this.setState({ v_id7: response.v_id7 })
                this.setState({ v_id8: response.v_id8 })
                this.setState({ v_id9: response.v_id9 })
                this.setState({ v_id10: response.v_id10 })
                this.setState({ v_id6: response.v_id6 })
                this.setState({ v_s1: response.v_s1 })
                this.setState({ v_s2: response.v_s2 })
                this.setState({ v_s3: response.v_s3 })
                this.setState({ v_s4: response.v_s4 })
                this.setState({ v_s5: response.v_s5 })
                this.setState({ v_s6: response.v_s6 })
                this.setState({ v_s7: response.v_s7 })
                this.setState({ v_s8: response.v_s8 })
                this.setState({ v_s9: response.v_s9 })
                this.setState({ v_s10: response.v_s10 })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    getUsersTop = async () => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=get.users.top`
        })
            .then((response) => response.json())
            .then((response) => {
                this.setState({ usersTop: response })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    getGroupsTop = () => {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=get.groups.top`
        })
            .then((response) => response.json())
            .then((response) => {
                this.setState({ groupsTop: response });
            })
            .catch((error) => {
                console.error(error)
            })
    }

    handleReputationChange(event) {
        const price = event.target.value;
        this.setState({ calcRep: price * 50000 });
        this.setState({ sp: price });
    }

    handleReputationSubmit(event) {
        if (this.state.clicks < 50000) {
            this.openDefault("Ошибка!!", "Недостаточно денег для покупки рейтинга. Курс: 1 rate = 50000 coins", {
                title: 'ОК',
                autoclose: true,
                style: "destructive"
            })
        }
        else {
            this.updateUserReputation(this.state.fetchedUser.id, this.state.sp)
        }
        event.preventDefault();
    }

    handleNickChange(event) {
        //console.log(event.target)
        this.setState({ nick: event.target.value})
    }

    handleNickSubmit(event) {
        if (this.state.nick === null || this.state.nick === "") {
            return this.openDefault("Ошибка", "Введите ник", {
                title: 'ОК',
                autoclose: true,
                style: "destructive"
            })
        }
        else this.updateUserNickname(this.state.fetchedUser.id, this.state.nick)
        event.preventDefault();
    }

    handleTransferChange(event) {
        //console.log(event.target)
        const target = event.target;
        const name = target.name;
        const value = target.value;
        this.setState({ [name]: value })
    }

    handleTransferSubmit(event) {
        if (this.state.toid === 0 && this.state.transferCoins === 0) return false
        else this.sendTransfer(this.state.fetchedUser.id, this.state.toId, this.state.transferCoins)
        event.preventDefault();
    }

    buyPet(pet_id) {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.buy.pet&user_vk=${this.state.fetchedUser.id}&pet_id=${pet_id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch(response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    sellPet(pet_id) {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.sell.pet&user_vk=${this.state.fetchedUser.id}&pet_id=${pet_id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.setState({ activePanel: "home" })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    pohodPet() {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.pohod.pet&user_vk=${this.state.fetchedUser.id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }


    buyHouse(house_id) {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.buy.house&user_vk=${this.state.fetchedUser.id}&house_id=${house_id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch(response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    sellHouse(house_id) {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.sell.house&user_vk=${this.state.fetchedUser.id}&house_id=${house_id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.setState({ activePanel: "home" })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    pohodHouse() {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.pohod.house&user_vk=${this.state.fetchedUser.id}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch (response.status) {
                    case 'success':
                        this.openDefault("Успех", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                        })
                        break;
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                    default: break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }

    buyUpgrade(type, name) {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.buy.upgrade&user_vk=${this.state.fetchedUser.id}&type=${type}&up_name=${name}`
        })
            .then((response) => response.json())
            .then((response) => {
                //console.log(response)
                switch(response.status) {
                    case 'error':
                        this.openDefault("Ошибка", response.msg, {
                            title: 'ОК',
                            autoclose: true,
                            style: "destructive"
                        })
                        break;
                }
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
                this.getUpgradesOne()
                this.getUpgradesTwo()
            })
            .catch((error) => {
                console.error(error)
            })
    }


    getUpgradesOne() {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=get.upgrades.one`
        })
            .then((response) => response.json())
            .then((response) => {
                console.log(response)
                this.setState({ upgradesOne: response });
            })
            .catch((error) => {
                console.error(error)
            })
    }


    getUpgradesTwo() {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=get.upgrades.two`
        })
            .then((response) => response.json())
            .then((response) => {
                console.log(response)
                this.setState({ upgradesTwo: response });
            })
            .catch((error) => {
                console.error(error)
            })
    }

   autoMine() {
        fetch("/api.php", {
            method: 'post',
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            body: `method=user.auto.mine&user_vk=${this.state.fetchedUser.id}`
        })
            .then((response) => response.json())
            .then((response) => {
                console.log(response)
                this.setState({ userAcc: response })
                this.setState({ clicks: response.clicks, reputation: response.reputation, speed: response.speed, aspeed: response.aspeed })
            })
            .catch((error) => {
                console.error(error)
            })
    }
    setActiveTabUpgrades = (value) => {
       this.setState({ activeTabUpgrades: `${value}` });
    }

    setActiveTabTop = (value) => {
       this.setState({ activeTabTop: `${value}` });
    }


	add1 = () => {
        this.updateUserClicks(this.state.fetchedUser.id)
	}


    dark = () => {
        document.body.setAttribute( 'scheme','client_dark' );
    }

    light = () => {
        document.body.setAttribute( 'scheme','client_light' );
    }

    onStoryChange (e) {
    this.setState({ activeStory: e.currentTarget.dataset.story })
    this.setState({ popout: <ScreenSpinner /> });
    setTimeout(() => { this.setState({ popout: null }) }, 200);
    }


	render() {
				     const osname = platform();
		     const { go, nickname, fetchedUser, user, onClick, usersTop,  userAcc, name, updateUserNickname, id, email, purpose} = this.props;
		     const modal = (
      <ModalRoot activeModal={this.state.activeModal}>
		   <ModalPage
          id={MODAL_PAGE_FILTERS}
          onClose={this.modalBack}
          header={
            <ModalPageHeader
             right={<HeaderButton onClick={this.modalBack}><Icon24Dismiss className="CellIconCustom" /></HeaderButton>}
            >
              Дополнительно
            </ModalPageHeader>
          }
        >
          <Div>
       <Button size="xl" onClick={this.addv} level="commerce">Добавить в сообщество</Button>
     </Div>
       <Div style={{display: 'flex'}}>
       <Button size="l" onClick={() => openTab("https://vk.com/supp_fastclick")} stretched level="secondary" style={{ marginRight: 8 }}>Поддержка</Button>
       <Button size="l" onClick={() => openTab("https://vk.com/fast__click")} stretched level="secondary">Группа</Button>
     </Div>
        </ModalPage>


      </ModalRoot>
       );
		return (
			<View popout={this.state.popout} activePanel={this.state.activePanel}>
                <Home id="home" modal={modal} this={this} addv={this.addv}  add1={this.add1} userAcc={this.state.userAcc} dark={this.dark} light={this.light} clicks={this.state.clicks} speed={this.state.speed} aspeed={this.state.aspeed} reputation={this.state.reputation} name={this.name} fetchedUser={this.state.fetchedUser} go={this.go} />
                <Persik id="persik" go={this.go} name={this.name} fetchedUser={this.state.fetchedUser} userAcc={this.state.userAcc} />
                <Transfer id="Transfer"  go={this.go} clicks={this.state.clicks} handleTransferChange={this.handleTransferChange} handleTransferSubmit={this.handleTransferSubmit} userAcc={this.state.userAcc} />
                <House id="house" go={this.go} buy={this.buyHouse} />
                <Imus id="imus" go={this.go} />
                <MyHouse id="myHouse" go={this.go} userAcc={this.state.userAcc} sell={this.sellHouse} pohod={this.pohodHouse} />
                <MyPet id="myPet" go={this.go} userAcc={this.state.userAcc} sell={this.sellPet} pohod={this.pohodPet} />
                <Upgrade id="upgrades" userAcc={this.state.userAcc} sell={this.sellHouse} pohod={this.pohodHouse} buy={this.buyHouse}  upgradesOne={this.state.upgradesOne} upgradesTwo={this.state.upgradesTwo} go={this.go} activeTab={this.state.activeTabUpgrades} setTab={this.setActiveTabUpgrades} buyUpgrade={this.buyUpgrade} />
                <Pet id="pet" go={this.go} buy={this.buyPet} />
                <Dop id="dop" go={this.go} />
                <Top id="top" go={this.go} usersTop={this.state.usersTop} groupsTop={this.state.groupsTop} activeTab={this.state.activeTabTop} setTab={this.setActiveTabTop} />
                <Reit id="reit" clicks={this.state.clicks} reputation={this.state.reputation} go={this.go} handleReputationChange={this.handleReputationChange} handleReputationSubmit={this.handleReputationSubmit} calcRep={this.state.calcRep} />
                <Sett id="sett" go={this.go} dark={this.dark} light={this.light} />
                <ChangeNickname id="changeNickname" go={this.go} handleNickChange={this.handleNickChange} handleNickSubmit={this.handleNickSubmit} userAcc={this.state.userAcc} />
                <Katalog id="katalog" go={this.go} />
			</View>
        );
    }
}

export default App;