'use strict';

function socketConnect(project, name = "noone"){
    let urlQueries = '?game=' + project.name + '&name=' + name;
	let url = 'https://' + location.hostname + urlQueries;
	socket = io.connect(url, {
		path: "/global-draw/"
	});
	socket.on('connect', () => {
		console.log('Connected to ', url);

		socket.emit('join-lobby', 'global-draw-room');

		socket.on('add-line', (lobby, line) => drawer.addLine(line));
		socket.on('fill-pixel', (lobby, pixel) => drawer.fillPixel(pixel));
		socket.on('add-all', (lines) => drawer.onLinesLoaded(lines));
		socket.on('fill-all', (pixels) => drawer.onPixelsLoaded(pixels));
		socket.on('member-joined', (lobby, clientId) => {
			if (clientId !== socket.id)
				return;
			if (drawer)
				if (drawer.lines.length !== 0)
					return;

			socket.emit('request-all-lines');
			socket.emit('request-all-pixels');
			$("#action").html("Downloading...");
		});

		socket.on('all-saved', (_lobby) => drawer.answerServerSave());

		updateDrawType($("input[type=radio][name=type]:checked").val());
	});
}

function sendFeedback(){
    $.post('/php/post_feedback.php', {content: $('#user_feedback > textarea').val(), projectName: localSettings.project.name});
}

function createLobby(dom){
    if (inputIsValid('create')){
        onlineRequestFrontend(dom);
        //TODO
    }
}

function joinLobby(dom){
    if (inputIsValid('join')){
        onlineRequestFrontend(dom);
        //TODO
    }
}

function onlineRequestFrontend(dom){
    $(dom).blur();
    $(dom).attr('disabled', 'disabled');
    if (loader) loader.destroy();
    loader = new Loader($('#loader').get(0));
}

function inputIsValid(type){
    let valid = true;
    $('.error-label').html('');
    if (type === 'create'){
        if ($('#player-name > input').val() === ''){
            valid = false;
            $('#player-name > .error-label').html('Please enter a name!');
        }
    }
    if (type === 'join'){
        if ($('#player-name > input').val() === ''){
            valid = false;
            $('#player-name > .error-label').html('Please enter a name!');
        }
        if ($('#lobby-code > input').val() === ''){
            valid = false;
            $('#lobby-code > .error-label').html('Please enter your code!');
        }
    }
    return valid;
}