const PlaceID = window.location.pathname.split('/')[3];
const Form = document.querySelector('form[action="/create/place/update"]');

var Settings;
var PlaceData = null;

!(async () => {
	ActivityToggle();
	//RequestGameProfile()
	CopyOwnedPlace();
})();

async function ActivityToggle() {
	if (PlaceData === null) {
		PlaceData = await fetch('https://api.polytoria.com/v1/places/' + PlaceID);
		PlaceData = await PlaceData.json();
	}
	let Status = PlaceData.isActive;

	const DIV = document.createElement('div');
	DIV.classList = 'form-group mt-4';
	DIV.innerHTML = `
    <label class="mb-2">
      <h5 class="mb-0">Toggle Activity</h5>
      <small class="text-muted">Make your place active or inactive (currently ${Status === true ? 'active' : 'inactive'}).</small>
    </label>
    <br>
    `;

	Form.insertBefore(DIV, Form.children[Form.children.length - 1]);

	const ActivityBtn = document.createElement('button');
	ActivityBtn.type = 'button';
	ActivityBtn.classList = 'btn ' + (Status === true ? 'btn-danger' : 'btn-success');
	ActivityBtn.innerText = Status === true ? 'Deactivate' : 'Activate';
	DIV.appendChild(ActivityBtn);

	ActivityBtn.addEventListener('click', function () {
		fetch(`https://polytoria.com/api/places/${PlaceID}/toggle-active`, {
			method: 'POST',
			headers: {
				'Content-Type': 'application/json',
				'X-CSRF-Token': document.querySelector('input[name="_csrf"]').value
			}
		})
			.then((response) => {
				if (!response.ok) {
					throw new Error('Network not ok ' + response.status);
				}
				return response.json();
			})
			.then((data) => {
				Status = data.isActive;
				ActivityBtn.innerText = Status === true ? 'Deactivate' : 'Activate';
				ActivityBtn.classList = 'btn ' + (Status === true ? 'btn-danger' : 'btn-success');
			})
			.catch((error) => {
				console.log(error);
			});
	});
}

function RequestGameProfile() {
	const Div = document.createElement('div');
	Div.classList = 'card mt-4';
	Div.innerHTML = `
    <div class="card-body">
        <input type="text" class="form-control bg-dark mb-2" placeholder="Game Title..">
        <input type="color" class="form-control bg-dark mb-2" placeholder="Background Color..">
        <input type="color" class="form-control bg-dark mb-2" placeholder="Accent Color..">
        <input type="color" class="form-control bg-dark mb-2" placeholder="Secondary Color..">
        <input type="color" class="form-control bg-dark mb-2" placeholder="Card Background Color..">
        <input type="color" class="form-control bg-dark mb-2" placeholder="Text Color..">
        <button type="button" class="btn btn-primary">Submit Request</button>
    </div>
    `;
	Form.insertBefore(Div, Form.children[Form.children.length - 1]);

	const SubmitBtn = Div.getElementsByTagName('button')[0];

	SubmitBtn.addEventListener('click', function () {
		const CardBody = Div.children[0];
		const Result = {
			gameTitle: CardBody.children[0].value,
			bg: CardBody.children[1].value,
			accent: CardBody.children[2].value,
			secondary: CardBody.children[3].value,
			cardBg: CardBody.children[4].value,
			text: CardBody.children[5].value
		};
		window.location.href = 'https://polyplus.vercel.app/app/game-profile.html?gameId=' + PlaceID + '&profile=' + encodeURIComponent(btoa(JSON.stringify(Result)));
	});
}

async function CopyOwnedPlace() {
	console.log('ran function');
	if (PlaceData === null) {
		PlaceData = await fetch('https://api.polytoria.com/v1/places/' + 2640);
		PlaceData = await PlaceData.json();
	}

	if (PlaceData.creator.id !== parseInt(JSON.parse(window.localStorage.getItem('p+account_info')).ID)) {
		console.log('returned');
		//return
	}

	const DIV = document.createElement('div');
	DIV.classList = 'form-group mt-4';
	DIV.innerHTML = `
    <label class="mb-2">
      <h5 class="mb-0">Download <code style="color: orange;">.poly</code> File</h5>
      <small class="text-muted">Quickly download your place from the site!</small>
    </label>
    <br>
    <button type="button" class="btn btn-primary">Download</button>
    `;

	Form.insertBefore(DIV, Form.children[Form.children.length - 1]);

	const DownloadButton = DIV.getElementsByTagName('button')[0];
	DownloadButton.addEventListener('click', async function () {
		console.log('clicked download epic');

		let CreatorToken = await fetch('https://polytoria.com/api/places/edit', {
			method: 'POST',
			headers: {
				'X-CSRF-Token': document.querySelector('input[name="_csrf"]').value
			},
			body: JSON.stringify({placeID: PlaceID})
		});
		CreatorToken = await CreatorToken.json();
		CreatorToken = CreatorToken.token;

		fetch(`https://api.polytoria.com/v1/places/get-place?id=${PlaceID}&tokenType=creator`, {
			headers: {
				Authorization: CreatorToken
			}
		})
			.then((response) => {
				if (!response.ok) {
					throw new Error('Network not ok');
				}
				return response.blob();
			})
			.then((data) => {
				//const JSONBlob = new Blob([data], {type: "application/xml"})
				const DownloadURL = URL.createObjectURL(data);

				const Link = document.createElement('a');
				Link.href = DownloadURL;
				Link.download = PlaceData.name + '.poly';
				document.body.appendChild(Link);
				Link.click();
				Link.remove();
			})
			.catch((error) => {
				console.log(error);
			});
	});
}