[Formatting] Tabs instead of spaces

11 files changed, 1312 insertions, 1309 deletions

diff --git a/scripts/cards/card.js b/scripts/cards/card.js
index 884e0d9..43dc965 100644
--- a/scripts/cards/card.js
+++ b/scripts/cards/card.js
@@ -7,114 +7,114 @@ const CardPos = ["top", "topl", "topr", "mid", "midt", "midb", "bot", "botl", "b
 // Every card should have a deck.
 // Use deck.appendCard or deck.prependCard to make a card visible
 class Card {
-    constructor (id, data)
-    {
-        this.e = document.createElement("card");
-        this.generateElements(data);
-        this.e.style.left = "0px";
-        this.e.style.top = "0px";
-
-        this.getID = function() {
-            return id;
-        }
-    }
-
-    // Generate a card with basic text only
-    static generateBasicCard (data, el)
-    {
-        let t = document.createElement("carea");
-        t.className = "mid";
-        t.innerText = data;
-        el.appendChild(t);
-    }
-
-    // Generate a card with a simple error message.
-    static generateErrorCard (el)
-    {
-        Card.generateBasicCard("Card Error: data", el);
-    }
-
-    // Generate an area of a card
-    static generateCArea (data, carea, assetURL)
-    {
-        // Create and set area
-        let area = document.createElement("carea");
-        area.className = carea;
-
-        // Create inner area text and images
-        for (let i in data)
-        {
-            if (i == "style")
-            {
-                for (j in data.style) 
-                    area.style[j] = data.style[j];
-            }
-            
-            if (data[i].type == "text")
-            {
-                let e = document.createElement("ctext");
-
-                e.innerText = data[i].text;
-
-                for (let j in data[i].style)
-                    e.style[j] = data[i].style[j];
-
-                area.appendChild(e);
-
-            }
-            else if (data[i].type == "image")
-            {
-                let e = document.createElement("cimage");
-
-                e.style.backgroundImage = "url(\"" + assetURL + data[i].image + "\")";
-                
-                for (let j in data[i].style)
-                    e.style[j] = data[i].style[j];
-
-                area.appendChild(e);
-            }
-        }
-
-        return area;
-    }
-
-    // Generate a card with rich visuals
-    static generateObjectCard (data, el)
-    {
-        // Generate card areas.
-        for (let i in CardPos)
-        {
-            if (typeof data[CardPos[i]] == "object")
-                el.appendChild(this.generateCArea(data[CardPos[i]], CardPos[i], data.assetURL));
-        }
-    }
-
-    generateElements (data)
-    {
-        while(this.e.firstElementChild != null)
-            this.e.firstElementChild.remove();
-
-        switch (typeof data)
-        {
-            case "object":
-                Card.generateObjectCard(data, this.e);
-                break;
-            case "string":
-                Card.generateBasicCard(data, this.e);
-                break;
-            default:
-                Card.generateErrorCard(this.e);
-        }
-    }
-
-    setPos (p)
-    {
-        this.e.style.setProperty("--cpos", p);
-    }
-
-    resetPos()
-    {
-        this.e.style.left = "0px";
-        this.e.style.top = "0px";
-    }
+	constructor (id, data)
+	{
+		this.e = document.createElement("card");
+		this.generateElements(data);
+		this.e.style.left = "0px";
+		this.e.style.top = "0px";
+
+		this.getID = function() {
+			return id;
+		}
+	}
+
+	// Generate a card with basic text only
+	static generateBasicCard (data, el)
+	{
+		let t = document.createElement("carea");
+		t.className = "mid";
+		t.innerText = data;
+		el.appendChild(t);
+	}
+
+	// Generate a card with a simple error message.
+	static generateErrorCard (el)
+	{
+		Card.generateBasicCard("Card Error: data", el);
+	}
+
+	// Generate an area of a card
+	static generateCArea (data, carea, assetURL)
+	{
+		// Create and set area
+		let area = document.createElement("carea");
+		area.className = carea;
+
+		// Create inner area text and images
+		for (let i in data)
+		{
+			if (i == "style")
+			{
+				for (j in data.style) 
+					area.style[j] = data.style[j];
+			}
+			
+			if (data[i].type == "text")
+			{
+				let e = document.createElement("ctext");
+
+				e.innerText = data[i].text;
+
+				for (let j in data[i].style)
+					e.style[j] = data[i].style[j];
+
+				area.appendChild(e);
+
+			}
+			else if (data[i].type == "image")
+			{
+				let e = document.createElement("cimage");
+
+				e.style.backgroundImage = "url(\"" + assetURL + data[i].image + "\")";
+				
+				for (let j in data[i].style)
+					e.style[j] = data[i].style[j];
+
+				area.appendChild(e);
+			}
+		}
+
+		return area;
+	}
+
+	// Generate a card with rich visuals
+	static generateObjectCard (data, el)
+	{
+		// Generate card areas.
+		for (let i in CardPos)
+		{
+			if (typeof data[CardPos[i]] == "object")
+				el.appendChild(this.generateCArea(data[CardPos[i]], CardPos[i], data.assetURL));
+		}
+	}
+
+	generateElements (data)
+	{
+		while(this.e.firstElementChild != null)
+			this.e.firstElementChild.remove();
+
+		switch (typeof data)
+		{
+			case "object":
+				Card.generateObjectCard(data, this.e);
+				break;
+			case "string":
+				Card.generateBasicCard(data, this.e);
+				break;
+			default:
+				Card.generateErrorCard(this.e);
+		}
+	}
+
+	setPos (p)
+	{
+		this.e.style.setProperty("--cpos", p);
+	}
+
+	resetPos()
+	{
+		this.e.style.left = "0px";
+		this.e.style.top = "0px";
+	}
 }
diff --git a/scripts/cards/deck.js b/scripts/cards/deck.js
index 4800e54..caa62bc 100644
--- a/scripts/cards/deck.js
+++ b/scripts/cards/deck.js
@@ -4,175 +4,175 @@
 // Can be arranged in multiple ways.
 // Decks work as FIFO
 class Deck {
-    
-    cards = [];
-    inf = false;
-    smode = "";
-    sct = 0;
-    x = 0;
-    y = 0;
-    e = null;
-
-    constructor(id, options = {mode: "stack", smode: "one", sct: 0, pos: [0, 0]})
-    {
-        // View mode
-        //  infdraw - infinite draw. always appears as if there are multiple cards
-        //  stack - stack mode
-        //  strip
-        //      horizontal
-        //          left (strip-hl)
-        //          right (strip-hr)
-        //      vertical
-        //          up (strip-vu)
-        //          down (strip-vd)
-        this.inf = options.mode == "infdraw";
-
-        // Select mode - controls what other cards are selected when one card is selected
-        //  above - selectes cards above the selected one
-        //  below - selects cards below the selected one
-        //  around - selects cards above and below
-        //  one - selects only card chosen
-        //  all - selects all cards when card selected
-        this.smode = options.smode;
-        
-        // Select count (negative defaults to 0)
-        //  above - controls number of cards above clicked are selected
-        //  below - controls number of cards below clicked are selected
-        //  around
-        //      number - number above and below selected
-        //      array - [first number: number above selected] [second number: number below selected]
-        //  one - no effect
-        //  all - no effect
-        this.sct = options.sct > 0 ? options.sct : 0;
-        
-        this.e = document.createElement("deck");
-
-        // x and y values are on a scale from 0 to 1, 0 being top left, 1 being bottom right.
-        this.e.style.setProperty("--x", options.pos[0]);
-        this.e.style.setProperty("--y", options.pos[1]);
-        
-        this.e.setAttribute("mode", options.mode);
-
-        this.getID = function() {
-            return id;
-        }
-    }
-
-    updatePos()
-    {
-        let len = this.cards.length - 1;
-        for(let i in this.cards)
-            this.cards[i].setPos(len-i);
-        this.updateCount();
-    }
-
-    appendCard(card)
-    {
-        this.cards.push(card);
-        this.e.appendChild(card.e);
-        this.updatePos();
-    }
-
-    prependCard(card)
-    {
-        this.cards.unshift(card);
-        this.e.prepend(card.e);
-        card.setPos(this.cards.length - 1);
-        this.updateCount();
-    }
-
-    addCardAt(card, index)
-    {
-        if(index < 0 || index > this.cards.length)
-            return
-        
-        if(index == 0) {
-            this.prependCard(card);
-        } else if (index == this.cards.length) {
-            this.appendCard(card);
-        } else {
-            let temp = this.cards.slice(0, index);
-            temp[temp.length - 1].e.after(card.e);
-            temp.push(card);
-            this.cards.unshift(...temp);
-            this.updatePos();
-        }
-    }
-
-    swapCards(index1, index2)
-    {
-        if(index1 < 0 || index1 >= this.cards.length || index2 < 0 || index2 >= this.cards.length)
-            return
-        
-        var temp = this.cards[index1]
-        this.cards[index1] = this.cards[index2];
-        this.cards[index2] = temp;
-
-        this.cards[index1 - 1].e.after(this.cards[index1]);
-        this.cards[index2 - 1].e.after(this.cards[index2]);
-    }
-
-    removeCard(index)
-    {
-        if(index < 0 || index >= this.cards.length)
-            return
-
-        this.e.removeChild(this.cards[index].e);
-        let c = this.cards.splice(index, 1)[0];
-
-        this.updatePos();
-        return c;
-    }
-
-    removeCardByID(id)
-    {
-        for(let i in this.cards)
-        {
-            if(this.cards[i].getID() == id)
-                return this.removeCard(i);
-        }
-
-        return null;
-    }
-
-    removeFront()
-    {
-        return this.removeCard(this.cards.length - 1);
-    }
-
-    removeBack()
-    {
-        return this.removeCard(0);
-    }
-
-    updateCount ()
-    {
-        this.e.style.setProperty("--ccount", this.cards.length - 1);
-    }
-
-    isInside(x, y)
-    {
-        var rect = this.e.getBoundingClientRect();
-        return (x > rect.left && x < rect.right && y > rect.top && y < rect.bottom)
-    }
-
-    checkCard (el)
-    {
-        for(let c of this.cards)
-        {
-            if(c.e === el)
-                return c;
-        }
-        return null;
-    }
-
-    hasCard(id)
-    {
-        for(let c of this.cards)
-        {
-            if(c.getID() === id)
-                return c;
-        }
-        return null;
-    }
+
+	cards = [];
+	inf = false;
+	smode = "";
+	sct = 0;
+	x = 0;
+	y = 0;
+	e = null;
+
+	constructor(id, options = {mode: "stack", smode: "one", sct: 0, pos: [0, 0]})
+	{
+		// View mode
+		//  infdraw - infinite draw. always appears as if there are multiple cards
+		//  stack - stack mode
+		//  strip
+		//      horizontal
+		//          left (strip-hl)
+		//          right (strip-hr)
+		//      vertical
+		//          up (strip-vu)
+		//          down (strip-vd)
+		this.inf = options.mode == "infdraw";
+
+		// Select mode - controls what other cards are selected when one card is selected
+		//  above - selectes cards above the selected one
+		//  below - selects cards below the selected one
+		//  around - selects cards above and below
+		//  one - selects only card chosen
+		//  all - selects all cards when card selected
+		this.smode = options.smode;
+		
+		// Select count (negative defaults to 0)
+		//  above - controls number of cards above clicked are selected
+		//  below - controls number of cards below clicked are selected
+		//  around
+		//      number - number above and below selected
+		//      array - [first number: number above selected] [second number: number below selected]
+		//  one - no effect
+		//  all - no effect
+		this.sct = options.sct > 0 ? options.sct : 0;
+		
+		this.e = document.createElement("deck");
+
+		// x and y values are on a scale from 0 to 1, 0 being top left, 1 being bottom right.
+		this.e.style.setProperty("--x", options.pos[0]);
+		this.e.style.setProperty("--y", options.pos[1]);
+		
+		this.e.setAttribute("mode", options.mode);
+
+		this.getID = function() {
+			return id;
+		}
+	}
+
+	updatePos()
+	{
+		let len = this.cards.length - 1;
+		for(let i in this.cards)
+			this.cards[i].setPos(len-i);
+		this.updateCount();
+	}
+
+	appendCard(card)
+	{
+		this.cards.push(card);
+		this.e.appendChild(card.e);
+		this.updatePos();
+	}
+
+	prependCard(card)
+	{
+		this.cards.unshift(card);
+		this.e.prepend(card.e);
+		card.setPos(this.cards.length - 1);
+		this.updateCount();
+	}
+
+	addCardAt(card, index)
+	{
+		if(index < 0 || index > this.cards.length)
+			return
+		
+		if(index == 0) {
+			this.prependCard(card);
+		} else if (index == this.cards.length) {
+			this.appendCard(card);
+		} else {
+			let temp = this.cards.slice(0, index);
+			temp[temp.length - 1].e.after(card.e);
+			temp.push(card);
+			this.cards.unshift(...temp);
+			this.updatePos();
+		}
+	}
+
+	swapCards(index1, index2)
+	{
+		if(index1 < 0 || index1 >= this.cards.length || index2 < 0 || index2 >= this.cards.length)
+			return
+		
+		var temp = this.cards[index1]
+		this.cards[index1] = this.cards[index2];
+		this.cards[index2] = temp;
+
+		this.cards[index1 - 1].e.after(this.cards[index1]);
+		this.cards[index2 - 1].e.after(this.cards[index2]);
+	}
+
+	removeCard(index)
+	{
+		if(index < 0 || index >= this.cards.length)
+			return
+
+		this.e.removeChild(this.cards[index].e);
+		let c = this.cards.splice(index, 1)[0];
+
+		this.updatePos();
+		return c;
+	}
+
+	removeCardByID(id)
+	{
+		for(let i in this.cards)
+		{
+			if(this.cards[i].getID() == id)
+				return this.removeCard(i);
+		}
+
+		return null;
+	}
+
+	removeFront()
+	{
+		return this.removeCard(this.cards.length - 1);
+	}
+
+	removeBack()
+	{
+		return this.removeCard(0);
+	}
+
+	updateCount ()
+	{
+		this.e.style.setProperty("--ccount", this.cards.length - 1);
+	}
+
+	isInside(x, y)
+	{
+		var rect = this.e.getBoundingClientRect();
+		return (x > rect.left && x < rect.right && y > rect.top && y < rect.bottom)
+	}
+
+	checkCard (el)
+	{
+		for(let c of this.cards)
+		{
+			if(c.e === el)
+				return c;
+		}
+		return null;
+	}
+
+	hasCard(id)
+	{
+		for(let c of this.cards)
+		{
+			if(c.getID() === id)
+				return c;
+		}
+		return null;
+	}
 }
diff --git a/scripts/cards/drag.js b/scripts/cards/drag.js
index 807e0c5..1014656 100644
--- a/scripts/cards/drag.js
+++ b/scripts/cards/drag.js
@@ -1,152 +1,152 @@
 'use strict';
 
 class MultiDrag extends EventTarget {
-    del = false;
-    drag = [];
-    mouse = [null, null];
-
-    constructor(ret = false) {
-        super();
-
-        window.addEventListener("mousemove", this.update.bind(this));
-        window.addEventListener("mouseup", this.stopDraggingAll.bind(this));
-        document.body.addEventListener("mouseleave", this.stopDraggingAll.bind(this));
-
-        this.ret = ret;
-    }
-
-    addDragEl(el, ox, oy, px, py, pt) {
-        if(this.del)
-            return;
-    
-        el.style.transitionDuration = "0s";
-        
-        let push = {
-            e: el,
-            osx: ox,
-            osy: oy,
-            ptd: pt
-        };
-
-        if(this.ret) {
-            push.prx = px;
-            push.pry = py;
-        }
-
-        this.drag.push(push);
-    
-        return push;
-    }
-
-    dragging(e) {
-        for(let i in this.drag) {
-            if(this.drag[i].e == e)
-                return true;
-        }
-        return false;
-    }
-
-    startDragging(e) {
-        if(this.del)
-            return;
-    
-        console.log(e);
-    
-        if(e.button != 0)
-            return;
-
-        var cap = new Event("dragstart");
-        
-        cap.drag = this.addDragEl(
-            e.target,
-            e.pageX - parseInt(e.target.style.left),
-            e.pageY - parseInt(e.target.style.top),
-            e.target.style.left,
-            e.target.style.top,
-            e.target.style.transitionDuration
-        );
-
-        this.dispatchEvent(cap);
-    }
-    
-    stopDragging(i) {
-        if(this.del)
-            return;
-        
-        this.del = true;
-    
-        if (i < 0 || i >= this.drag.length)
-            return;
-        
-        var cap = new Event("dragstop");
-        cap.x = this.mouse[0];
-        cap.y = this.mouse[1];
-        
-        this.drag[i].e.style.transitionDuration = this.drag[i].ptd;
-
-        if(this.ret) {
-            this.drag[i].e.style.left = this.drag[i].prx;
-            this.drag[i].e.style.top = this.drag[i].pry;
-        }
-
-        cap.drag = this.drag.splice(i, 1);
-    
-        this.del = false;
-
-        this.dispatchEvent(cap);
-    }
-
-    stopDraggingEl(el) {
-        for(let d of this.drag) {
-            if(d.e === el)
-                this.stopDragging(this.drag.indexOf(d));
-        }
-    }
-
-    stopDraggingAll() {
-        if(this.del)
-            return;
-        
-        this.del = true;
-        
-        var cap = new Event("dragstop");
-
-        cap.x = this.mouse[0];
-        cap.y = this.mouse[1];
-
-        cap.drag = [];
-        
-        while (this.drag.length > 0) {
-            this.drag[0].e.style.transitionDuration = this.drag[0].ptd;
-
-            if(this.ret) {
-                this.drag[0].e.style.left = this.drag[0].prx;
-                this.drag[0].e.style.top = this.drag[0].pry;
-            }
-    
-            cap.drag.push(this.drag.shift());
-        }
-    
-        this.del = false;
-
-        this.dispatchEvent(cap);
-    }
-
-    update(e) {
-        this.mouse[0] = e.pageX;
-        this.mouse[1] = e.pageY;
-
-        for (let i = 0; i < this.drag.length && !this.del; i++) {
-            this.drag[i].e.style.left = e.pageX - this.drag[i].osx + "px";
-            this.drag[i].e.style.top = e.pageY - this.drag[i].osy + "px";
-        }
-    }
-
-    addTarget(e) {
-        e.addEventListener("mousedown", this.startDragging.bind(this));
-    }
-
-    removeTarget (e) {
-        e.removeEventListener("mousedown", this.startDragging.bind(this));
-    }
+	del = false;
+	drag = [];
+	mouse = [null, null];
+
+	constructor(ret = false) {
+		super();
+
+		window.addEventListener("mousemove", this.update.bind(this));
+		window.addEventListener("mouseup", this.stopDraggingAll.bind(this));
+		document.body.addEventListener("mouseleave", this.stopDraggingAll.bind(this));
+
+		this.ret = ret;
+	}
+
+	addDragEl(el, ox, oy, px, py, pt) {
+		if(this.del)
+			return;
+
+		el.style.transitionDuration = "0s";
+		
+		let push = {
+			e: el,
+			osx: ox,
+			osy: oy,
+			ptd: pt
+		};
+
+		if(this.ret) {
+			push.prx = px;
+			push.pry = py;
+		}
+
+		this.drag.push(push);
+
+		return push;
+	}
+
+	dragging(e) {
+		for(let i in this.drag) {
+			if(this.drag[i].e == e)
+				return true;
+		}
+		return false;
+	}
+
+	startDragging(e) {
+		if(this.del)
+			return;
+
+		console.log(e);
+
+		if(e.button != 0)
+			return;
+
+		var cap = new Event("dragstart");
+		
+		cap.drag = this.addDragEl(
+			e.target,
+			e.pageX - parseInt(e.target.style.left),
+			e.pageY - parseInt(e.target.style.top),
+			e.target.style.left,
+			e.target.style.top,
+			e.target.style.transitionDuration
+		);
+
+		this.dispatchEvent(cap);
+	}
+
+	stopDragging(i) {
+		if(this.del)
+			return;
+		
+		this.del = true;
+
+		if (i < 0 || i >= this.drag.length)
+			return;
+		
+		var cap = new Event("dragstop");
+		cap.x = this.mouse[0];
+		cap.y = this.mouse[1];
+		
+		this.drag[i].e.style.transitionDuration = this.drag[i].ptd;
+
+		if(this.ret) {
+			this.drag[i].e.style.left = this.drag[i].prx;
+			this.drag[i].e.style.top = this.drag[i].pry;
+		}
+
+		cap.drag = this.drag.splice(i, 1);
+
+		this.del = false;
+
+		this.dispatchEvent(cap);
+	}
+
+	stopDraggingEl(el) {
+		for(let d of this.drag) {
+			if(d.e === el)
+				this.stopDragging(this.drag.indexOf(d));
+		}
+	}
+
+	stopDraggingAll() {
+		if(this.del)
+			return;
+		
+		this.del = true;
+		
+		var cap = new Event("dragstop");
+
+		cap.x = this.mouse[0];
+		cap.y = this.mouse[1];
+
+		cap.drag = [];
+		
+		while (this.drag.length > 0) {
+			this.drag[0].e.style.transitionDuration = this.drag[0].ptd;
+
+			if(this.ret) {
+				this.drag[0].e.style.left = this.drag[0].prx;
+				this.drag[0].e.style.top = this.drag[0].pry;
+			}
+
+			cap.drag.push(this.drag.shift());
+		}
+
+		this.del = false;
+
+		this.dispatchEvent(cap);
+	}
+
+	update(e) {
+		this.mouse[0] = e.pageX;
+		this.mouse[1] = e.pageY;
+
+		for (let i = 0; i < this.drag.length && !this.del; i++) {
+			this.drag[i].e.style.left = e.pageX - this.drag[i].osx + "px";
+			this.drag[i].e.style.top = e.pageY - this.drag[i].osy + "px";
+		}
+	}
+
+	addTarget(e) {
+		e.addEventListener("mousedown", this.startDragging.bind(this));
+	}
+
+	removeTarget (e) {
+		e.removeEventListener("mousedown", this.startDragging.bind(this));
+	}
 }
\ No newline at end of file
diff --git a/scripts/client.js b/scripts/client.js
index 07e2fce..c612175 100644
--- a/scripts/client.js
+++ b/scripts/client.js
@@ -2,44 +2,39 @@
 const VERSION = "1.0.0";
 
 const DefaultUserOps = {
-    a: {
-        type: "color",
-        title: "Player Color",
-        args: ["#ff0000"]
-    },
-    b: {
-        type: "text",
-        title: "Player Name",
-        args: ["User " + Math.floor(Math.random() * 10000), ""]
-    },
-    d: {
-        type: "checkbox",
-        title: "Order Check (D)",
-        args: []
-    },
-    c: {
-        type: "checkbox",
-        title: "Order Check (C)",
-        args: []
-    }
+	color: {
+		type: "color",
+		title: "Player Color",
+		args: ["#ff0000"]
+	},
+	name: {
+		type: "text",
+		title: "Player Name",
+		args: ["User " + Math.floor(Math.random() * 10000), ""]
+	}
 }
 
 const DefaultGameOps = {
-    a: {
-        type: "checkbox",
-        title: "Unlisted",
-        args: []
-    },
-    b: {
-        type: "checkbox",
-        title: "Use Password",
-        args: []
-    },
-    c: {
-        type: "text",
-        title: "Set Password",
-        args: [Math.floor(Math.random() * 10000), ""]
-    }
+	name: {
+		type:"text",
+		title: "Room Name",
+		args: ["", ""]
+	},
+	hidden: {
+		type: "checkbox",
+		title: "Unlisted",
+		args: []
+	},
+	usePass: {
+		type: "checkbox",
+		title: "Use Password",
+		args: []
+	},
+	pass: {
+		type: "text",
+		title: "Set Password",
+		args: [Math.floor(Math.random() * 10000), ""]
+	}
 }
 
 // Client acts as the message hub for the whole game.
@@ -47,162 +42,170 @@ const DefaultGameOps = {
 // Client also performs the handshake for first starting the connection and messages everyone if the connection errors or closes.
 class Client{
 
-    constructor (serveraddr, game)
-    {
-        this.socket = new SockWorker(serveraddr, VERSION);
-        this.socket.addEventListener("error", this.socketError.bind(this));
-        this.socket.addEventListener("closed", this.socketClose.bind(this));
-        this.socket.addEventListener("handshake", this.handshake.bind(this));
-        this.socket.addEventListener("menu", this.menu.bind(this));
-        this.socket.addEventListener("game", this.game.bind(this));
+	constructor (serveraddr, game)
+	{
+		this.socket = new SockWorker(serveraddr, VERSION);
+		this.socket.addEventListener("error", this.socketError.bind(this));
+		this.socket.addEventListener("closed", this.socketClose.bind(this));
+		this.socket.addEventListener("handshake", this.handshake.bind(this));
+		this.socket.addEventListener("menu", this.menu.bind(this));
+		this.socket.addEventListener("game", this.game.bind(this));
 		this.socket.addEventListener("chat", this.chat.bind(this));
 
-        this.lobby = new Lobby(document.getElementsByClassName("lobby")[0], this.socket);
-
-        this.drag = new MultiDrag();
-        
-        this.table = new Table(document.getElementsByClassName("table")[0], this.drag, this.socket);
-
-        this.chat = new Chat(document.getElementsByClassName("chat")[0], this.socket);
-        this.chat.addChannel("Global");
-        this.chat.switchChannel("Global");
-
-        this.settings = new Settings(DefaultUserOps);
-        this.settings.putSettings(this.lobby.e.settings);
-
-        this.gameOptions = new Settings(DefaultGameOps);
-        this.gameOptions.putSettings(this.lobby.top.newGame);
-
-        this.game = game;
-    }
-
-    // Initialize the connection
-    init ()
-    {
-        this.socket.init();
-    }
-
-    // Callbacks for if the socket fails or closes
-
-    socketError() {
-        this.lobby.setState("Error", "closed", this.socket.server);
-        this.table.handleClose();
-    }
-
-    socketClose() {
-        this.lobby.setState("Closed", "closed", this.socket.server);
-        this.table.handleClose();
-    }
-
-    // Callback when negotiating with the server for the first time and we are determining versions
-    handshake (m)
-    {
-        switch (m.type) {
-            case "verr":
-                this.socket.close();
-                
-                alert(`Error connecting to server: version of client (${this.version}) not accepted.`);
-                
-                console.error(`Error connecting to server: version of client (${this.version}) not accepted.`);
-                
-                console.error(m.data);
-                
-                return;
-
-            case "ready":
-                this.settings.cleanup();
-                this.gameOptions.cleanup();
-                
-                this.settings = new Settings(m.data.user);
-                this.gameOptions = new Settings(m.data.game);
-
-                this.gameOptions.putSettings(this.lobby.top.newGame);
-                
-                if(this.lobby.top.mobileSettingsOpen())
-                    this.settings.putSettings(this.lobby.top.mobileSettings);
-                else
-                    this.settings.putSettings(this.lobby.e.settings);
-                
-                this.socket.send("ready", "");
-                
-                return;
-        }
-    }
-
-    // Menu switch, called when in the lobby and a message arrives from the server
-    menu (m)
-    {
-        switch (m.type) {
-            case "plist":
-                this.lobby.packList(m.data);
-                break;
-            case "glist":
-                this.lobby.gameList(m.data, this.game);
-                this.game = null;
-                break;
-            case "players":
-                this.lobby.players(m.data);
-                break;
-            case "gdel":
-                this.lobby.removeGame(m.data);
-                break;
-            case "gadd":
-                this.lobby.addGame(m.data);
-                break;
-            case "pdel":
-                this.lobby.removePlayer(m.data);
-                break;
-            case "padd":
-                this.lobby.addPlayer(m.data);
-                break;
-            case "pmove":
-                this.lobby.movePlayer(m.data);
-                break;
-        }
-    }
-
-    // Game switch, called when in game and a message arrives from the server
-    game (m)
-    {
-        switch (m.type) {
-            case "move":
-                this.table.moveByID(m.data.card, m.data.deck, m.data.pos);
-                break;
-        }
-    }
-
-    // Callback when a chat event is recieved from the server
-    chat (m)
-    {
-        switch (m.type) {
-            case "delchan":
-                this.chat.deleteChannel(m.data);
-                break;
-            case "newchan":
-                this.chat.addChannel(m.data);
-                break;
-            
-            case "message":
-                this.chat.recieveMessage(m.data.type, m.data.data);
-        }
-    }
-
-    // Reset the lobby and table, then attempt to reopen the connection to the server.
-    reset ()
-    {
-        this.lobby.reset();
-        this.table.reset();
-
-        this.socket.init();
-    }
-
-    joinGame(id)
-    {
-        this.table.openTable();
-    }
-
-    leaveGame()
-    {
-        
-    }
+		this.lobby = new Lobby(document.getElementsByClassName("lobby")[0], this.socket);
+
+		this.drag = new MultiDrag();
+		
+		this.table = new Table(document.getElementsByClassName("table")[0], this.drag, this.socket);
+
+		this.chat = new Chat(document.getElementsByClassName("chat")[0], this.socket);
+		this.chat.addChannel("Global");
+		this.chat.switchChannel("Global");
+
+		this.settings = new Settings(DefaultUserOps);
+		this.settings.putSettings(this.lobby.e.settings);
+
+		this.gameOptions = new Settings(DefaultGameOps);
+		this.gameOptions.putSettings(this.lobby.top.newGame);
+
+		this.game = game;
+	}
+
+	// Initialize the connection
+	init ()
+	{
+		this.socket.init();
+	}
+
+	// Callbacks for if the socket fails or closes
+
+	socketError() {
+		alert("Connection error");
+		this.lobby.setState("Error", "closed", this.socket.server);
+		this.table.handleClose();
+	}
+
+	socketClose() {
+		alert("Connection closed by server");
+		this.lobby.setState("Closed", "closed", this.socket.server);
+		this.table.handleClose();
+	}
+
+	// Callback when negotiating with the server for the first time and we are determining versions
+	handshake (e)
+	{
+		let m = e.detail;
+		switch (m.type) {
+			case "verr":
+				this.socket.close();
+				
+				alert(`Error connecting to server: version of client (${this.version}) not accepted.`);
+				
+				console.error(`Error connecting to server: version of client (${this.version}) not accepted.`);
+				
+				console.error(m.data);
+				
+				return;
+
+			case "ready":
+				console.log(`Handshake with server OK.  Running client version ${this.version}`);
+
+				this.settings.cleanup();
+				this.gameOptions.cleanup();
+				
+				this.settings = new Settings(m.data.user);
+				this.gameOptions = new Settings(m.data.game);
+
+				this.gameOptions.putSettings(this.lobby.top.newGame);
+				
+				if(this.lobby.top.mobileSettingsOpen())
+					this.settings.putSettings(this.lobby.top.mobileSettings);
+				else
+					this.settings.putSettings(this.lobby.e.settings);
+				
+				this.socket.send("ready", "");
+				
+				return;
+		}
+	}
+
+	// Menu switch, called when in the lobby and a message arrives from the server
+	menu (e)
+	{
+		let m = e.detail;
+		switch (m.type) {
+			case "plist":
+				this.lobby.packList(m.data);
+				break;
+			case "glist":
+				this.lobby.gameList(m.data, this.game);
+				this.game = null;
+				break;
+			case "players":
+				this.lobby.players(m.data);
+				break;
+			case "gdel":
+				this.lobby.removeGame(m.data);
+				break;
+			case "gadd":
+				this.lobby.addGame(m.data);
+				break;
+			case "pdel":
+				this.lobby.removePlayer(m.data);
+				break;
+			case "padd":
+				this.lobby.addPlayer(m.data);
+				break;
+			case "pmove":
+				this.lobby.movePlayer(m.data);
+				break;
+		}
+	}
+
+	// Game switch, called when in game and a message arrives from the server
+	game (e)
+	{
+		let m = e.detail;
+		switch (m.type) {
+			case "move":
+				this.table.moveByID(m.data.card, m.data.deck, m.data.pos);
+				break;
+		}
+	}
+
+	// Callback when a chat event is recieved from the server
+	chat (e)
+	{
+		let m = e.detail;
+		switch (m.type) {
+			case "delchan":
+				this.chat.deleteChannel(m.data);
+				break;
+			case "newchan":
+				this.chat.addChannel(m.data);
+				break;
+			
+			case "message":
+				this.chat.recieveMessage(m.data.type, m.data.data);
+		}
+	}
+
+	// Reset the lobby and table, then attempt to reopen the connection to the server.
+	reset ()
+	{
+		this.lobby.reset();
+		this.table.reset();
+
+		this.socket.init();
+	}
+
+	joinGame(id)
+	{
+		this.table.openTable();
+	}
+
+	leaveGame()
+	{
+		
+	}
 }
diff --git a/scripts/cookie.js b/scripts/cookie.js
index 44a0be9..9c88963 100644
--- a/scripts/cookie.js
+++ b/scripts/cookie.js
@@ -1,36 +1,36 @@
 'use strict';
 
 class Cookies {
-    static getCookie(name){
-        let cookies = document.cookie.split(";");
-        for(let i in cookies) {
-            let cname = cookies[i].trim().split("=")[0];
-            if(cname == name){
-                return cookies[i].trim().slice(name.length + 1);
-            }
-        }
-        return "";
-    }
+	static getCookie(name){
+		let cookies = document.cookie.split(";");
+		for(let i in cookies) {
+			let cname = cookies[i].trim().split("=")[0];
+			if(cname == name){
+				return cookies[i].trim().slice(name.length + 1);
+			}
+		}
+		return "";
+	}
 
-    static setCookie(name, value, data = {SameSite: "Strict"}) {
-        let extra = "";
+	static setCookie(name, value, data = {SameSite: "Strict"}) {
+		let extra = "";
 
-        for(let key in data)
-        {
-            extra += "; " + key + "=" + data[key];
-        }
+		for(let key in data)
+		{
+			extra += "; " + key + "=" + data[key];
+		}
 
-        document.cookie = name + "=" + value + extra;
-    }
+		document.cookie = name + "=" + value + extra;
+	}
 
-    static setYearCookie(name, value) {
-        var date = new Date(Date.now());
-        date.setFullYear(date.getFullYear() + 1);
-        Cookies.setCookie(name, value, {SameSite: "Strict", expires: date.toUTCString()});
-    }
+	static setYearCookie(name, value) {
+		var date = new Date(Date.now());
+		date.setFullYear(date.getFullYear() + 1);
+		Cookies.setCookie(name, value, {SameSite: "Strict", expires: date.toUTCString()});
+	}
 
-    static removeCookie(name) {
-        var date = new Date(0);
-        Cookies.setCookie(name, "", {SameSite: "Strict", expires: date.toUTCString()});
-    }
+	static removeCookie(name) {
+		var date = new Date(0);
+		Cookies.setCookie(name, "", {SameSite: "Strict", expires: date.toUTCString()});
+	}
 }
diff --git a/scripts/gui/chat.js b/scripts/gui/chat.js
index dda541e..f3b0975 100644
--- a/scripts/gui/chat.js
+++ b/scripts/gui/chat.js
@@ -1,102 +1,102 @@
 'use strict';
 
 class Chat {
-    constructor(e, soc)
-    {
-        this.chats = [];
-        this.root = e;
+	constructor(e, soc)
+	{
+		this.chats = [];
+		this.root = e;
 		this.socket = soc;
-        e.getElementsByClassName("toggle-chat")[0].onclick = this.toggle.bind(this);
+		e.getElementsByClassName("toggle-chat")[0].onclick = this.toggle.bind(this);
 		let cin = e.getElementsByClassName("chat-input")[0];
 		this.chatInput = cin.children[0];
 
 		cin.children[0].addEventListener("keydown", this.checkEnter.bind(this));
 		cin.children[1].addEventListener("click", this.sendMessage.bind(this));
-    }
-
-    getChannel (name)
-    {
-        for(let i in this.chats)
-        {
-            if (this.chats[i].name == name)
-            {
-                return this.chats[i];
-            }
-        }
-
-        return null;
-    }
-
-    isActive (name)
-    {
-        for(let i in this.chats)
-        {
-            if (this.chats[i].name == name)
-            {
-                if(this.chats[i].btn.getAttribute("active") == "true")
-                    return true;
-                return false;
-            }
-        }
-
-        return false;
-    }
-
-    addChannel (name, follow = true)
-    {
-        if(this.getChannel(name) != null)
-            return;
-
-        let d = document.createElement("div");
-        let b = document.createElement("button");
-
-        this.root.getElementsByClassName("chat-select")[0].appendChild(b);
-
-        b.setAttribute("active", false);
-
-        b.onclick = this.switchChannel.bind(this, name);
-
-        b.innerText = name;
-
-        d.className = "chat-text";
-
-        this.chats.push({name: name, e: d, btn: b});
-
-        if(follow)
-            this.switchChannel(name)
-    }
-
-    getActiveChannel ()
-    {
-        for(let i in this.chats)
-        {
-            if (this.chats[i].btn.getAttribute("active") == "true")
-            {
-                return this.chats[i];
-            }
-        }
-
-        return null;
-    }
-
-    switchChannel (name)
-    {
-        let c = this.getChannel(name);
-        
-        if(c == null)
-            return;
-
-        if(this.getActiveChannel() != null)
-            this.getActiveChannel().btn.setAttribute("active", false);
-
-        c.btn.setAttribute("active", true);
-        var ct = this.root.getElementsByClassName("chat-text")[0];
-        ct.replaceWith(c.e);
-
-        c.e.scroll({
-            top: c.e.scrollTopMax
-        });
-    }
+	}
+
+	getChannel (name)
+	{
+		for(let i in this.chats)
+		{
+			if (this.chats[i].name == name)
+			{
+				return this.chats[i];
+			}
+		}
+
+		return null;
+	}
+
+	isActive (name)
+	{
+		for(let i in this.chats)
+		{
+			if (this.chats[i].name == name)
+			{
+				if(this.chats[i].btn.getAttribute("active") == "true")
+					return true;
+				return false;
+			}
+		}
+
+		return false;
+	}
+
+	addChannel (name, follow = true)
+	{
+		if(this.getChannel(name) != null)
+			return;
+
+		let d = document.createElement("div");
+		let b = document.createElement("button");
+
+		this.root.getElementsByClassName("chat-select")[0].appendChild(b);
+
+		b.setAttribute("active", false);
+
+		b.onclick = this.switchChannel.bind(this, name);
+
+		b.innerText = name;
+
+		d.className = "chat-text";
+
+		this.chats.push({name: name, e: d, btn: b});
+
+		if(follow)
+			this.switchChannel(name)
+	}
+
+	getActiveChannel ()
+	{
+		for(let i in this.chats)
+		{
+			if (this.chats[i].btn.getAttribute("active") == "true")
+			{
+				return this.chats[i];
+			}
+		}
+
+		return null;
+	}
+
+	switchChannel (name)
+	{
+		let c = this.getChannel(name);
+		
+		if(c == null)
+			return;
+
+		if(this.getActiveChannel() != null)
+			this.getActiveChannel().btn.setAttribute("active", false);
+
+		c.btn.setAttribute("active", true);
+		var ct = this.root.getElementsByClassName("chat-text")[0];
+		ct.replaceWith(c.e);
+
+		c.e.scroll({
+			top: c.e.scrollTopMax
+		});
+	}
 
 	checkEnter(e)
 	{
@@ -113,67 +113,67 @@ class Chat {
 
 	}
 
-    recieveMessage (channel, msg)
-    {
-        let c = this.getChannel(channel);
-        
-        if(c == null)
-            return;
-        
-        let autoscroll = c.e.scrollTop == c.e.scrollTopMax;
-
-        let csp = document.createElement("span")
-        let tsp = document.createElement("span");
-
-        if(msg.server === true){
-            csp.style.color = "white";
-            csp.style.backgroundColor = "black";
-            csp.innerText = "[SERVER]";
-            tsp.innerText = " " + msg.text;
-        } else {
-            csp.style.color = msg.color;
-            csp.innerText = msg.user + ": ";
-            tsp.innerText = msg.text;
-        }
-        
-        let d = document.createElement("div");
-        d.appendChild(csp);
-        d.appendChild(tsp);
-
-        c.e.appendChild(d);
-
-        if(autoscroll)
-            c.e.scroll({top: c.e.scrollTopMax});
-    }
-
-    clearChannel (name)
-    {
-        let c = this.getChannel(name);
-        if(c == null)
-            return;
-        
-        while(c.e.firstElementChild != null)
-            c.e.firstElementChild.remove();
-    }
-
-    deleteChannel (name)
-    {
-        let c = this.getChannel(name);
-        if(c == null)
-            return;
-        
-        while(c.e.firstElementChild != null)
-            c.e.firstElementChild.remove();
-        
-        c.btn.remove();
-
-        this.chats.splice(this.chats.indexOf(c), 1);
-    }
-
-    toggle () {
-        if(this.root.getAttribute("show") != "true")
-            this.root.setAttribute("show", "true");
-        else
-            this.root.setAttribute("show", "false");
-    }
+	recieveMessage (channel, msg)
+	{
+		let c = this.getChannel(channel);
+		
+		if(c == null)
+			return;
+		
+		let autoscroll = c.e.scrollTop == c.e.scrollTopMax;
+
+		let csp = document.createElement("span")
+		let tsp = document.createElement("span");
+
+		if(msg.server === true){
+			csp.style.color = "white";
+			csp.style.backgroundColor = "black";
+			csp.innerText = "[SERVER]";
+			tsp.innerText = " " + msg.text;
+		} else {
+			csp.style.color = msg.color;
+			csp.innerText = msg.user + ": ";
+			tsp.innerText = msg.text;
+		}
+		
+		let d = document.createElement("div");
+		d.appendChild(csp);
+		d.appendChild(tsp);
+
+		c.e.appendChild(d);
+
+		if(autoscroll)
+			c.e.scroll({top: c.e.scrollTopMax});
+	}
+
+	clearChannel (name)
+	{
+		let c = this.getChannel(name);
+		if(c == null)
+			return;
+		
+		while(c.e.firstElementChild != null)
+			c.e.firstElementChild.remove();
+	}
+
+	deleteChannel (name)
+	{
+		let c = this.getChannel(name);
+		if(c == null)
+			return;
+		
+		while(c.e.firstElementChild != null)
+			c.e.firstElementChild.remove();
+		
+		c.btn.remove();
+
+		this.chats.splice(this.chats.indexOf(c), 1);
+	}
+
+	toggle () {
+		if(this.root.getAttribute("show") != "true")
+			this.root.setAttribute("show", "true");
+		else
+			this.root.setAttribute("show", "false");
+	}
 }
diff --git a/scripts/gui/input.js b/scripts/gui/input.js
index a44784b..ddaa4a3 100644
--- a/scripts/gui/input.js
+++ b/scripts/gui/input.js
@@ -2,239 +2,239 @@
 
 //Mostly fixed now
 class MakeInput {
-    static createInput(type = "text", wrap = false, getset = true)
-    {
-        var el = document.createElement("input");
-        el.setAttribute("type", type);
-
-        if(wrap)
-        {
-            return this.wrapInputs(type, el);
-        }
-
-        if(getset) {
-            el.getValue = function () {
-                return this.value;
-            }
-
-            el.setValue = function(value) {
-                this.value = value
-            }
-        }
-
-        return el;
-    }
-
-    // Function deprecated, finding another way to do this
-    static inputLabel(text, id)
-    {
-        var el = document.createElement("label");
-        el.innerText = text;
-        if(typeof id == "string")
-            el.setAttribute("for", id);
-        return el;
-    }
-
-    static colorInput (value) {
-        var el = MakeInput.createInput("color", true);
-        el.setValue(value);
-        return el;
-    }
-
-    static textInput (value, placeholder)
-    {
-        var el = MakeInput.createInput("text");
-        el.setAttribute("placeholder", placeholder);
-        el.value = value;
-        return el;
-    }
-
-    static numberInput (value)
-    {
-        var el = MakeInput.createInput("number");
-        el.value = value;
-        return el;
-    }
-
-    static fileInput (accepts = "", multiple = false) {
-        var el = MakeInput.createInput("file", true, false);
-        
-        let e = el.getElement();
-        e.setAttribute("accepts", accepts);
-        e.multiple = multiple;
-        el.getValue = function() {
-            return e.files;
-        }
-        
-        el.setAttribute("data-files", "Choose a file");
-
-        el.firstElementChild.onchange = function () {
-            let text = "";
-            switch (this.files.length) {
-                case 0:
-                    text = "Choose a file";
-                    break;
-                case 1:
-                    text = "File: " + this.files[0].name;
-                    break;
-                default:
-                    text = "Files: " + this.files[0].name + "...";
-                    break;
-            }
-            el.setAttribute("data-files", text);
-        }
-
-        return el;
-    }
-
-    static checkboxInput (value = false) {
-        var el = MakeInput.createInput("checkbox", false, false);
-
-        el.getValue = function() {
-            return el.checked;
-        }
-
-        el.setValue = function(check) {
-            el.checked = check;
-        }
-
-        el.setValue(value);
-        
-        return el;
-    }
-
-    static radio (value, group, checked = false) {
-        var el = MakeInput.createInput("radio", false, false);
-        el.setAttribute("name", group);
-        el.setAttribute("value", value);
-        if(checked)
-            el.checked = true;
-        return el;
-    }
-
-    static radioInput (values, names, group, prompt = "Select One", select = 0) {
-
-        let toWrap = [];
-
-        for(let i = 0; i < values.length; i++) {
-            toWrap.push(MakeInput.inputLabel(names[i]));
-            if(i == select)
-                toWrap.push(MakeInput.radio(values[i], group, true));
-            else
-                toWrap.push(MakeInput.radio(values[i], group, false));
-            toWrap.push(document.createElement("br"));
-        }
-
-        var wrapper = MakeInput.wrapInputs("radio", ...toWrap);
-
-        wrapper.setAttribute("data-prompt", prompt);
-
-        wrapper.getValue = function() {
-            for(let i = 0; i < this.children.length; i++){
-                if(this.children[i].checked)
-                    return this.children[i].value;
-            }
-        };
-
-        wrapper.setValue = function(value) {
-            for(let i = 0; i < this.children.length; i++){
-                if(this.children[i].value == value){
-                    this.children[i].checked = true;
-                    return;
-                }
-            }
-        };
-
-        return wrapper;
-    }
-
-    static wrapInputs (type, ...el) {
-
-        var wrapper = document.createElement("div");
-        wrapper.className = "input-container";
-        wrapper.setAttribute("type", type);
-
-        for(let i = 0; i < el.length; i++)
-        {
-            wrapper.appendChild(el[i]);
-        }
-
-        if(el.length == 1)
-        {
-            wrapper.getValue = function () {return el[0].value;}
-    
-            wrapper.setValue = function(value) {el[0].value = value;}
-
-            wrapper.onclick = el[0].click.bind(el[0]);
-
-            wrapper.getElement = function(){return el[0];}
-        }
-
-        return wrapper;
-    }
-
-    static selectOption (value, text, index, selected) {
-        var so = document.createElement("div");
-        so.innerText = text;
-        so.selectValue = value;
-        so.selectIndex = index;
-        so.addEventListener("mousedown", MakeInput.selOption.bind(null, so));
-
-        if(selected === true)
-            so.setAttribute("selected", true);
-
-        return so
-    }
-
-    static selectInput (values, names, select = 0) {
-        var se = document.createElement("div");
-        se.className = "input-select";
-        se.setAttribute("tabindex", 0);
-        se.setAttribute("selected", select);
-
-        for(let i in names)
-        {
-            se.appendChild(MakeInput.selectOption(values[i], names[i], i, i == select));
-        }
-        
-        var wrapper = MakeInput.wrapInputs("select", se);
-        wrapper.getValue = MakeInput.selValue.bind(null, se);
+	static createInput(type = "text", wrap = false, getset = true)
+	{
+		var el = document.createElement("input");
+		el.setAttribute("type", type);
+
+		if(wrap)
+		{
+			return this.wrapInputs(type, el);
+		}
+
+		if(getset) {
+			el.getValue = function () {
+				return this.value;
+			}
+
+			el.setValue = function(value) {
+				this.value = value
+			}
+		}
+
+		return el;
+	}
+
+	// Function deprecated, finding another way to do this
+	static inputLabel(text, id)
+	{
+		var el = document.createElement("label");
+		el.innerText = text;
+		if(typeof id == "string")
+			el.setAttribute("for", id);
+		return el;
+	}
+
+	static colorInput (value) {
+		var el = MakeInput.createInput("color", true);
+		el.setValue(value);
+		return el;
+	}
+
+	static textInput (value, placeholder)
+	{
+		var el = MakeInput.createInput("text");
+		el.setAttribute("placeholder", placeholder);
+		el.value = value;
+		return el;
+	}
+
+	static numberInput (value)
+	{
+		var el = MakeInput.createInput("number");
+		el.value = value;
+		return el;
+	}
+
+	static fileInput (accepts = "", multiple = false) {
+		var el = MakeInput.createInput("file", true, false);
+		
+		let e = el.getElement();
+		e.setAttribute("accepts", accepts);
+		e.multiple = multiple;
+		el.getValue = function() {
+			return e.files;
+		}
+		
+		el.setAttribute("data-files", "Choose a file");
+
+		el.firstElementChild.onchange = function () {
+			let text = "";
+			switch (this.files.length) {
+				case 0:
+					text = "Choose a file";
+					break;
+				case 1:
+					text = "File: " + this.files[0].name;
+					break;
+				default:
+					text = "Files: " + this.files[0].name + "...";
+					break;
+			}
+			el.setAttribute("data-files", text);
+		}
+
+		return el;
+	}
+
+	static checkboxInput (value = false) {
+		var el = MakeInput.createInput("checkbox", false, false);
+
+		el.getValue = function() {
+			return el.checked;
+		}
+
+		el.setValue = function(check) {
+			el.checked = check;
+		}
+
+		el.setValue(value);
+		
+		return el;
+	}
+
+	static radio (value, group, checked = false) {
+		var el = MakeInput.createInput("radio", false, false);
+		el.setAttribute("name", group);
+		el.setAttribute("value", value);
+		if(checked)
+			el.checked = true;
+		return el;
+	}
+
+	static radioInput (values, names, group, prompt = "Select One", select = 0) {
+
+		let toWrap = [];
+
+		for(let i = 0; i < values.length; i++) {
+			toWrap.push(MakeInput.inputLabel(names[i]));
+			if(i == select)
+				toWrap.push(MakeInput.radio(values[i], group, true));
+			else
+				toWrap.push(MakeInput.radio(values[i], group, false));
+			toWrap.push(document.createElement("br"));
+		}
+
+		var wrapper = MakeInput.wrapInputs("radio", ...toWrap);
+
+		wrapper.setAttribute("data-prompt", prompt);
+
+		wrapper.getValue = function() {
+			for(let i = 0; i < this.children.length; i++){
+				if(this.children[i].checked)
+					return this.children[i].value;
+			}
+		};
+
+		wrapper.setValue = function(value) {
+			for(let i = 0; i < this.children.length; i++){
+				if(this.children[i].value == value){
+					this.children[i].checked = true;
+					return;
+				}
+			}
+		};
+
+		return wrapper;
+	}
+
+	static wrapInputs (type, ...el) {
+
+		var wrapper = document.createElement("div");
+		wrapper.className = "input-container";
+		wrapper.setAttribute("type", type);
+
+		for(let i = 0; i < el.length; i++)
+		{
+			wrapper.appendChild(el[i]);
+		}
+
+		if(el.length == 1)
+		{
+			wrapper.getValue = function () {return el[0].value;}
+
+			wrapper.setValue = function(value) {el[0].value = value;}
+
+			wrapper.onclick = el[0].click.bind(el[0]);
+
+			wrapper.getElement = function(){return el[0];}
+		}
+
+		return wrapper;
+	}
+
+	static selectOption (value, text, index, selected) {
+		var so = document.createElement("div");
+		so.innerText = text;
+		so.selectValue = value;
+		so.selectIndex = index;
+		so.addEventListener("mousedown", MakeInput.selOption.bind(null, so));
+
+		if(selected === true)
+			so.setAttribute("selected", true);
+
+		return so
+	}
+
+	static selectInput (values, names, select = 0) {
+		var se = document.createElement("div");
+		se.className = "input-select";
+		se.setAttribute("tabindex", 0);
+		se.setAttribute("selected", select);
+
+		for(let i in names)
+		{
+			se.appendChild(MakeInput.selectOption(values[i], names[i], i, i == select));
+		}
+		
+		var wrapper = MakeInput.wrapInputs("select", se);
+		wrapper.getValue = MakeInput.selValue.bind(null, se);
 		wrapper.getIndex = MakeInput.selIndex.bind(null, se);
 		wrapper.addOption = MakeInput.selAdd.bind(se);
 		wrapper.removeOption = MakeInput.selRem.bind(se);
 		wrapper.setIndex = MakeInput.selSet.bind(se);
-        wrapper.setAttribute("tabindex", 0);
+		wrapper.setAttribute("tabindex", 0);
+
+		return wrapper;
+	}
 
-        return wrapper;
-    }
+	static selValue (el) {
+		let sel = parseInt(el.getAttribute("selected"));
+			
+		if(typeof sel != "undefined") {
+			return el.children[sel].selectValue;
+		}
 
-    static selValue (el) {
-        let sel = parseInt(el.getAttribute("selected"));
-            
-        if(typeof sel != "undefined") {
-            return el.children[sel].selectValue;
-        }
-    
-        return "";
-    }
+		return "";
+	}
 
 	static selIndex (el) {
 		return parseInt(el.getAttribute("selected"));
 	}
-    
-    static selOption (el, dispatch = true) {
-        let sn = el.selectIndex;
-        let psn = parseInt(el.parentElement.getAttribute("selected"));
-    
-        if(Number.isInteger(psn) && psn < el.parentElement.childElementCount)
-            el.parentElement.children[psn].setAttribute("selected", false);
-    
-        el.parentElement.setAttribute("selected", sn);
-        el.setAttribute("selected", true);
+
+	static selOption (el, dispatch = true) {
+		let sn = el.selectIndex;
+		let psn = parseInt(el.parentElement.getAttribute("selected"));
+
+		if(Number.isInteger(psn) && psn < el.parentElement.childElementCount)
+			el.parentElement.children[psn].setAttribute("selected", false);
+
+		el.parentElement.setAttribute("selected", sn);
+		el.setAttribute("selected", true);
 
 		if(dispatch)
 			el.parentElement.parentElement.dispatchEvent(new InputEvent("change"));
-    }
+	}
 
 	static selSet (index) {
 		MakeInput.selOption(this.children[index], false);
@@ -258,71 +258,71 @@ class MakeInput {
 		return true;
 	}
 
-    static titleWrap(el, title) {
-        var wrapper = document.createElement("div");
-        wrapper.className = "input-title-wrapper";
-        wrapper.setAttribute("type", el.getAttribute("type"));
-        wrapper.setAttribute("data-title", title);
-        
-        wrapper.appendChild(el);
-
-        if(el.getAttribute("type") == "checkbox")
-        {
-            wrapper.onclick = el.click.bind(el);
-        }
-
-        return wrapper;
-    }
+	static titleWrap(el, title) {
+		var wrapper = document.createElement("div");
+		wrapper.className = "input-title-wrapper";
+		wrapper.setAttribute("type", el.getAttribute("type"));
+		wrapper.setAttribute("data-title", title);
+		
+		wrapper.appendChild(el);
+
+		if(el.getAttribute("type") == "checkbox")
+		{
+			wrapper.onclick = el.click.bind(el);
+		}
+
+		return wrapper;
+	}
 }
 
 // Mostly fixed now
 class Settings {
-    constructor (template = {})
-    {
-        this.settings = Settings.genSettings(template);
-
-        this.wrappers = {};
-    }
-
-    static genSettings (template)
-    {
-        var out = {};
-
-        for(let key in template)
-        {
-            if(typeof MakeInput[template[key].type+"Input"] != null)
-                out[key] = {el: MakeInput[template[key].type+"Input"](...template[key].args), title: template[key].title};
-        }
-        
-        return out;
-    }
-
-    getSettings ()
-    {
-        var out = {};
-
-        for(let key in this.settings)
-            out[key] = this.settings[key].el.getValue();
-        
-        return out;
-    }
-
-    putSettings (el)
-    {
-        this.cleanup();
-
-        this.wrappers = {};
-
-        for(let key in this.settings) {
-            this.wrappers[key] = MakeInput.titleWrap(this.settings[key].el, this.settings[key].title)
-            el.appendChild(this.wrappers[key]);
-        }
-            
-    }
-
-    cleanup ()
-    {
-        for(let key in this.wrappers)
-            this.wrappers[key].remove();
-    }
+	constructor (template = {})
+	{
+		this.settings = Settings.genSettings(template);
+
+		this.wrappers = {};
+	}
+
+	static genSettings (template)
+	{
+		var out = {};
+
+		for(let key in template)
+		{
+			if(typeof MakeInput[template[key].type+"Input"] != null)
+				out[key] = {el: MakeInput[template[key].type+"Input"](...template[key].args), title: template[key].title};
+		}
+		
+		return out;
+	}
+
+	getSettings ()
+	{
+		var out = {};
+
+		for(let key in this.settings)
+			out[key] = this.settings[key].el.getValue();
+		
+		return out;
+	}
+
+	putSettings (el)
+	{
+		this.cleanup();
+
+		this.wrappers = {};
+
+		for(let key in this.settings) {
+			this.wrappers[key] = MakeInput.titleWrap(this.settings[key].el, this.settings[key].title)
+			el.appendChild(this.wrappers[key]);
+		}
+			
+	}
+
+	cleanup ()
+	{
+		for(let key in this.wrappers)
+			this.wrappers[key].remove();
+	}
 }
diff --git a/scripts/gui/table.js b/scripts/gui/table.js
index 9aac2ae..e242ac6 100644
--- a/scripts/gui/table.js
+++ b/scripts/gui/table.js
@@ -1,143 +1,143 @@
 'use strict';
 // Table represents and manages the actual game.  It accepts inputs from the server and tries to query the server when the player makes a move.
 class Table{
-    constructor(e, drag, socket) {
-        this.root = e;
-        this.drag = drag;
-
-        drag.addEventListener("dragstart", (e) => {console.log(e)});
-        drag.addEventListener("dragstop", this.dragMsg.bind(this));
-
-        this.socket = socket;
-
-        this.decks = [];
-    }
-
-    openTable ()
-    {
-        let state = this.root.getAttribute("state")
-        if((state == "close" || state == "closed") && state != "") {
-            this.root.setAttribute("state", "closed");
-            setTimeout(this.root.setAttribute.bind(this.root), 50, "state", "open");
-        }
-    }
-
-    closeTable ()
-    {
-        let state = this.root.getAttribute("state")
-        if(state != "close" && state != "closed") {
-            this.root.setAttribute("state", "");
-            setTimeout(this.root.setAttribute.bind(this.root), 50, "state", "close");
-        }
-    }
-
-    handleClose ()
-    {
-        this.reset();
-    }
-
-    reset ()
-    {
-        while(this.root.firstElementChild != null)
-            this.root.firstElementChild.remove();
-        
-        this.decks = [];
-
-        this.closeTable();
-        this.drag.stopDraggingAll();
-    }
-
-    /*   Deck and card functions   */
-    newDeck(id, options)
-    {
-        var d = new Deck(id, options);
-        this.decks.push(d);
-        this.root.appendChild(d.e);
-    }
-
-    newCard(id, data, deck = 0)
-    {
-        var c = new Card(id, data);
-        this.decks[deck].appendCard(c);
-        this.drag.addTarget(c.e);
-    }
-
-    checkDeck(x, y)
-    {
-        for(let d of this.decks)
-        {
-            if(d.isInside(x, y))
-                return d;
-        }
-        return null;
-    }
-
-    checkCard (el)
-    {
-        for(let d of this.decks)
-        {
-            let c = d.checkCard(el);
-            if(c !== null)
-                return c;
-        }
-        return null;
-    }
-
-    moveCard(card, newDeck, index = -1)
-    {
-        for(let d of this.decks)
-        {
-            if (d.removeCardByID(card.getID()) !== null)
-                break;
-        }
-        card.resetPos();
-
-        if(index < 0)
-            newDeck.appendCard(card);
-        else
-            newDeck.addCardAt(card, index);
-    }
-
-    moveByID(cardID, deckID, index = -1)
-    {
-        let card, deck;
-        for(let d of this.decks)
-        {
-            let c = d.hasCard(cardID)
-            if(c !== null)
-                card = c;
-            
-            if(d.getID() == deckID)
-                deck = d;
-        }
-
-        this.moveCard(card, deck, index);
-    }
-
-    checkMove(cardID, deckID, index = -1)
-    {
-        this.socket.send("game", {type: "move", card: cardID, deck: deckID, pos: index});
-    }
-
-    dragCheck(cap)
-    {
-        console.log(cap);
-    }
-
-    dragMsg (event)
-    {
-        if(event.drag.length < 1)
-            return;
-
-        var c = this.checkCard(event.drag[0].e);
-        var d = this.checkDeck(event.x, event.y);
-
-        if(c !== null)
-        {
-            if(d !== null)
-                this.checkMove(c.getID(), d.getID());
-            else
-                c.resetPos();
-        }
-    }
+	constructor(e, drag, socket) {
+		this.root = e;
+		this.drag = drag;
+
+		drag.addEventListener("dragstart", (e) => {console.log(e)});
+		drag.addEventListener("dragstop", this.dragMsg.bind(this));
+
+		this.socket = socket;
+
+		this.decks = [];
+	}
+
+	openTable ()
+	{
+		let state = this.root.getAttribute("state")
+		if((state == "close" || state == "closed") && state != "") {
+			this.root.setAttribute("state", "closed");
+			setTimeout(this.root.setAttribute.bind(this.root), 50, "state", "open");
+		}
+	}
+
+	closeTable ()
+	{
+		let state = this.root.getAttribute("state")
+		if(state != "close" && state != "closed") {
+			this.root.setAttribute("state", "");
+			setTimeout(this.root.setAttribute.bind(this.root), 50, "state", "close");
+		}
+	}
+
+	handleClose ()
+	{
+		this.reset();
+	}
+
+	reset ()
+	{
+		while(this.root.firstElementChild != null)
+			this.root.firstElementChild.remove();
+		
+		this.decks = [];
+
+		this.closeTable();
+		this.drag.stopDraggingAll();
+	}
+
+	/*   Deck and card functions   */
+	newDeck(id, options)
+	{
+		var d = new Deck(id, options);
+		this.decks.push(d);
+		this.root.appendChild(d.e);
+	}
+
+	newCard(id, data, deck = 0)
+	{
+		var c = new Card(id, data);
+		this.decks[deck].appendCard(c);
+		this.drag.addTarget(c.e);
+	}
+
+	checkDeck(x, y)
+	{
+		for(let d of this.decks)
+		{
+			if(d.isInside(x, y))
+				return d;
+		}
+		return null;
+	}
+
+	checkCard (el)
+	{
+		for(let d of this.decks)
+		{
+			let c = d.checkCard(el);
+			if(c !== null)
+				return c;
+		}
+		return null;
+	}
+
+	moveCard(card, newDeck, index = -1)
+	{
+		for(let d of this.decks)
+		{
+			if (d.removeCardByID(card.getID()) !== null)
+				break;
+		}
+		card.resetPos();
+
+		if(index < 0)
+			newDeck.appendCard(card);
+		else
+			newDeck.addCardAt(card, index);
+	}
+
+	moveByID(cardID, deckID, index = -1)
+	{
+		let card, deck;
+		for(let d of this.decks)
+		{
+			let c = d.hasCard(cardID)
+			if(c !== null)
+				card = c;
+			
+			if(d.getID() == deckID)
+				deck = d;
+		}
+
+		this.moveCard(card, deck, index);
+	}
+
+	checkMove(cardID, deckID, index = -1)
+	{
+		this.socket.send("game", {type: "move", card: cardID, deck: deckID, pos: index});
+	}
+
+	dragCheck(cap)
+	{
+		console.log(cap);
+	}
+
+	dragMsg (event)
+	{
+		if(event.drag.length < 1)
+			return;
+
+		var c = this.checkCard(event.drag[0].e);
+		var d = this.checkDeck(event.x, event.y);
+
+		if(c !== null)
+		{
+			if(d !== null)
+				this.checkMove(c.getID(), d.getID());
+			else
+				c.resetPos();
+		}
+	}
 }
diff --git a/scripts/socket/message.js b/scripts/socket/message.js
index 044027d..0288cbc 100644
--- a/scripts/socket/message.js
+++ b/scripts/socket/message.js
@@ -1,18 +1,18 @@
 'use strict';
 
 class Message{
-    constructor (type, data)
-    {
-        this.t = type;
-        this.d = data;
-    }
+	constructor (type, data)
+	{
+		this.t = type;
+		this.d = data;
+	}
 
-    stringify ()
-    {
-        var dat = this.d
-        if(typeof dat !== "string"){
-            dat = JSON.stringify(dat);
-        }
-        return JSON.stringify({type: this.t, data: dat});
-    }
+	stringify ()
+	{
+		var dat = this.d
+		if(typeof dat !== "string"){
+			dat = JSON.stringify(dat);
+		}
+		return JSON.stringify({type: this.t, data: dat});
+	}
 }
diff --git a/scripts/socket/sock.js b/scripts/socket/sock.js
index 36e28bc..0a04b63 100644
--- a/scripts/socket/sock.js
+++ b/scripts/socket/sock.js
@@ -1,71 +1,71 @@
 'use strict';
 // A wrapper around the wrapper 
 class SockWorker extends EventTarget{
-    constructor (serveraddr, version)
-    {
-        super();
+	constructor (serveraddr, version)
+	{
+		super();
 
-        this.server = serveraddr;
-        this.version = version;
-    }
+		this.server = serveraddr;
+		this.version = version;
+	}
 
-    // Initialize the connection.
-    init () {
-        if(this.server == "" || this.server == null) {
-            return;
-        }
-        try {
-            this.socket = new WebSocket(this.server);
+	// Initialize the connection.
+	init () {
+		if(this.server == "" || this.server == null) {
+			return;
+		}
+		try {
+			this.socket = new WebSocket(this.server);
 
-            this.socket.addEventListener("open", this.o.bind(this));
-            this.socket.addEventListener("message", this.msg.bind(this));
+			this.socket.addEventListener("open", this.o.bind(this));
+			this.socket.addEventListener("message", this.msg.bind(this));
 
-            this.socket.addEventListener("closed", this.c.bind(this));
-            this.socket.addEventListener("error", this.err.bind(this));
-        } catch (e) {
-            this.err();
-        }
-    }
+			this.socket.addEventListener("closed", this.c.bind(this));
+			this.socket.addEventListener("error", this.err.bind(this));
+		} catch (e) {
+			this.err();
+		}
+	}
 
-    // Called when the connection connects to the server
-    o () {
-        this.send("version", this.version);
-    }
+	// Called when the connection connects to the server
+	o () {
+		this.send("version", this.version);
+	}
 
-    // Called when the connection gets a message from the server
-    // Attempts to turn the message into a usable object and pass it to the callback
-    msg (e) {
-        if(typeof e.data == "string") {
-            var dat = JSON.parse(e.data)
-            this.dispatchEvent(new Event(dat.type, dat.data));
-        }
-    }
+	// Called when the connection gets a message from the server
+	// Attempts to turn the message into a usable object and pass it to the callback
+	msg (e) {
+		if(typeof e.data == "string") {
+			var dat = JSON.parse(e.data);
+			this.dispatchEvent(new CustomEvent(dat.type, {detail: dat.data}));
+		}
+	}
 
-    // Called when the connection closes.
-    // Passes a close object to the callback.
-    c () {
-        this.dispatchEvent(new Event("closed"));
-    }
+	// Called when the connection closes.
+	// Passes a close object to the callback.
+	c () {
+		this.dispatchEvent(new Event("closed"));
+	}
 
-    // Called when the connection encounters an error.
-    // Passes an error to the callback
-    err () {
-        this.dispatchEvent(new Event("error"));
-    }
-    
-    // Call to close the connection to the server
-    close () {
-        this.socket.close();
-    }
+	// Called when the connection encounters an error.
+	// Passes an error to the callback
+	err () {
+		this.dispatchEvent(new Event("error"));
+	}
 
-    // Send a message to the server
-    send (type, data) {
-        var m = new Message(type, data);
-        this.socket.send(m.stringify())
-    }
+	// Call to close the connection to the server
+	close () {
+		this.socket.close();
+	}
 
-    // Raw message the server
-    sendRaw (s) {
-        this.socket.send(s)
-    }
+	// Send a message to the server
+	send (type, data) {
+		var m = new Message(type, data);
+		this.socket.send(m.stringify())
+	}
+
+	// Raw message the server
+	sendRaw (s) {
+		this.socket.send(s)
+	}
 }
diff --git a/scripts/theme.js b/scripts/theme.js
index b9dcb37..886a3a1 100644
--- a/scripts/theme.js
+++ b/scripts/theme.js
@@ -10,11 +10,11 @@ const BASE_THEMES = [[
 ]];
 
 class Theme{
-    static theme = document.getElementById("theme");
+	static theme = document.getElementById("theme");
 	static UserThemes = [[],[]];
 
-    static init()
-    {
+	static init()
+	{
 		let uth = Cookies.getCookie("userThemes").split(',');
 
 		for (let i = 1; i < uth.length; i += 2)
@@ -23,22 +23,22 @@ class Theme{
 			this.UserThemes[1].push(uth[i]);
 		}
 
-        if(Cookies.getCookie("theme") == ""){
-            Cookies.setYearCookie("theme", "styles/themes/colors-base.css");
-        }
-    }
+		if(Cookies.getCookie("theme") == ""){
+			Cookies.setYearCookie("theme", "styles/themes/colors-base.css");
+		}
+	}
 
-    static restore()
-    {
-        Theme.init();
-        Theme.theme.setAttribute("href", Cookies.getCookie("theme") + "?v=" + Date.now());
-    }
+	static restore()
+	{
+		Theme.init();
+		Theme.theme.setAttribute("href", Cookies.getCookie("theme") + "?v=" + Date.now());
+	}
 
-    static set(sheet)
-    {
-        Cookies.setYearCookie("theme", sheet);
-        Theme.theme.setAttribute("href", sheet + "?v=" + Date.now());
-    }
+	static set(sheet)
+	{
+		Cookies.setYearCookie("theme", sheet);
+		Theme.theme.setAttribute("href", sheet + "?v=" + Date.now());
+	}
 
 	static setUserThemes() {
 		let out = "";