Using project files

app/app.js

@@ -0,0 +1,12 @@
+function startGame() {
+    // starting new game 
+    var messagesElement = document.getElementById('messages');
+    // reference to the messages div inside the index.html file // 
+    messagesElement.innerText = 'Welcome to MultiMat! Starting a new game... ';
+    // Assigns a string to it's innerText property so that it will appear on the screen // 
+}
+document.getElementById('startGame').addEventListener('click', startGame);
+// calls start game function when the start game button is clikced in the app // 
+
+
+// BEFORE WE CAN USE THIS NEW JS FILE IN THE APP WE NEED TO ADD A REFERENCE TO IT IN THE INDEX.HTML FILE // 

app/app.ts

@@ -0,0 +1,10 @@
+function startGame() {
+  // starting new game 
+  var messagesElement = document.getElementById('messages');
+// reference to the messages div inside the index.html file // 
+  messagesElement.innerText = 'Welcome to MultiMat! Starting a new game... ';
+// Assigns a string to it's innerText property so that it will appear on the screen // 
+  }     
+
+  document.getElementById('startGame').addEventListener('click', startGame);
+  // calls start game function when the start game button is clikced in the app // 

index.html

@@ -55,7 +55,7 @@ <h4>No scores yet</h4>
     <div class="col-sm-offset-2 col-sm-10" id="messages"></div>
 
     <!-- add script tags here -->
-
+    <script src="/app/app.js"></script>
 
 </body>
 </html>

notes.md

@@ -0,0 +1,6 @@
+// TYPESCRIPT PROJECT FILES //
+
+- Simple Json text file names tsconfig.json
+- Stores compiler options used with the project
+- specifies the files thats should be included or excluded in compilation 
+- Support configuration inheriteance - In a large project you can create a project file at the root of ur project that includes all of the default options you want to apply to the project. You can then create additional project files in difference folders inside the project that can selectively override or add to the option specified in the root projectf file