Added additional init stuff, fixed event listener refs

main.js

@@ -139,10 +139,26 @@ for (var x = 0; x < 16; x++) {
 	thisPec.id = name;
 	clearPec(x);
 	app.gui.view.appendChild(thisPec);
-	thisPec.addEventListener("click", (p,x)=>{
-		app.currentPec = p;
-		app.currentPecIndex = x;
-		app.gui.library.root.classList.add("focused");
-	}, thisPec, x);
 }
+// Create our initial board
+app.boards = [];
+app.boards.push(new pecBoard());
+app.currentBoard = app.boards[0];
+repopGrid(app.currentBoard);
 
+// Populate Library
+app.library = [];
+app.library.push(new pec("No",""));
+app.library.push(new pec("Up",""));
+app.library.push(new pec("More",""));
+app.library.push(new pec("Drink",""));
+app.library.push(new pec("Food",""));
+// add more here
+app.library.forEach((p,i)=>{
+	var newPec = document.createElement("span");
+	newPec.classList.add("pecSlot");
+	newPec.innerText = p.word;
+	newPec.id = "lPec"+i;
+	newPec.addEventListener("click", useThisPec);
+	app.gui.library.body.appendChild(newPec);
+});

pecslib.js

@@ -7,15 +7,21 @@ class pec {
 		this.image = image; // Add image processing here
 		this.utterance = new SpeechSynthesisUtterance(this.word);
 		var root = document.createElement("div");
+		root.draggable = true;
 		root.classList.add("pec");
 		var img = document.createElement("img");
 		img.src = me.image;
 		img.classList.add("pecImage");
 		root.appendChild(img);
 		var name = document.createElement("span");
+		name.innerText = word;
 		name.classList.add("pecNane");
 		root.appendChild(name);
-		root.addEventListener("click",()=>{ window.speechSynthisis.speak(me.utterance); });		
+		root.mom = this;
+		root.addEventListener("click",(e)=>{
+			var targ = e.currentTarget.mom;
+			window.speechSynthesis.speak(targ.utterance);
+		});
 		this.DOM = root;
 	}
 }