| @@ -0,0 +1,72 @@ | ||
| <!DOCTYPE> | ||
| <html lang="en-us"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <title>A shitty chess game</title> | ||
| <link rel="stylesheet" href="assets/css/chessboard-0.3.0.css"> | ||
| <link rel="stylesheet" href="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.css"/> | ||
| <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.3/css/bulma.css"> | ||
| <link rel="stylesheet" href="assets/css/style.css"> | ||
|
|
||
| </head> | ||
| <body> | ||
|
|
||
| <script src="https://www.gstatic.com/firebasejs/4.1.3/firebase.js"></script> | ||
|
|
||
|
|
||
| <section id="userButtons" class="box columns is-mobile level"> | ||
| <div class="column level-left"> | ||
| <button id="login" class="button is-primary">Login</button> | ||
| </div> | ||
| <div class="columns level-right"> | ||
| <div class="column container"> | ||
| <button id="restartButton" class="button is-success" disabled>Restart</button> | ||
| <button id="createRoom" class="button is-success" disabled>Create a New Room</button> | ||
| <button id="playPC" class="button is-success" disabled>Play a Computer</button> | ||
| </div> | ||
| <div class="field column"> | ||
| <button id="joinRoom" class="button is-success" disabled>Join an Existing Room</button> | ||
| <label class="label">Room ID</label> | ||
| <input type="text" id="room"> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="container"> | ||
| <div id="board"></div> | ||
| </section> | ||
|
|
||
|
|
||
| <section class="box column"> | ||
| <p>Status: <span id="status"></span></p> | ||
| <p>FEN: <span id="fen"></span></p> | ||
| <p>PGN: <span id="pgn"></span></p> | ||
| </section> | ||
|
|
||
|
|
||
| <div id="dialog-message" title="Game Status"> | ||
| <p> | ||
| Game Status: <span id="gameStatus"></span> | ||
| <br> | ||
| Room Key: <span id="roomKey"></span> | ||
| </p> | ||
| </div> | ||
|
|
||
| <div id="firechat-wrapper"></div> | ||
|
|
||
| <script | ||
| src="https://code.jquery.com/jquery-3.2.1.js" | ||
| integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" | ||
| crossorigin="anonymous"></script> | ||
| <script | ||
| src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" | ||
| integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" | ||
| crossorigin="anonymous"></script> | ||
| <script src="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.js"></script> | ||
| <script src="assets/js/chessboard-0.3.0.js" type="text/javascript"></script> | ||
| <script src="assets/js/chess.js" type="text/javascript"></script> | ||
|
|
||
| <script src="assets/js/logic.js"></script> | ||
| </body> | ||
| </html> |
| @@ -0,0 +1,64 @@ | ||
| <!DOCTYPE> | ||
| <html lang="en-us"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <title>Employee Tracker</title> | ||
| <link rel="stylesheet" href="style.css"> | ||
| <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'> | ||
| </head> | ||
| <body> | ||
|
|
||
| <section id="addEmployee" class="form-style-8"> | ||
| <form> | ||
| <div> | ||
| <label for="name">Employee Name:</label> | ||
| <input type="text" id="name" name="employee_name"> | ||
| </div> | ||
| <div> | ||
| <label for="role">Role:</label> | ||
| <input type="text" id="role" name="employee_role"> | ||
| </div> | ||
| <div> | ||
| <label for="startDate">Start Date:</label> | ||
| <input type="date" id="startDate" name="employee_start"> | ||
| </div> | ||
| <div> | ||
| <label for="rate">Monthly Rate:</label> | ||
| <input type="text" id="rate" name="employee_rate"> | ||
| </div> | ||
|
|
||
| <input type="button" value="Submit Data" id="submitButton"> | ||
|
|
||
| </form> | ||
| </section> | ||
|
|
||
| <section id="employeeDisplay"> | ||
| <table class="table-fill" id="employees"> | ||
| <thead> | ||
| <tr> | ||
| <th>Employee Name</th> | ||
| <th>Role</th> | ||
| <th>Start Date</th> | ||
| <th>Months Worked</th> | ||
| <th>Monthly Rate ($)</th> | ||
| <th>Total Billed ($)</th> | ||
| </tr> | ||
| </thead> | ||
| <tbody class="table-hover" id="tableBody"> | ||
|
|
||
| </tbody> | ||
| </table> | ||
| </section> | ||
|
|
||
|
|
||
|
|
||
| </body> | ||
|
|
||
| <script src="https://www.gstatic.com/firebasejs/4.1.3/firebase.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script> | ||
| <script | ||
| src="https://code.jquery.com/jquery-3.2.1.js" | ||
| integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" | ||
| crossorigin="anonymous"></script> | ||
| <script src="logic.js"></script> | ||
| </html> |
| @@ -0,0 +1,54 @@ | ||
| let config = { | ||
| apiKey: "AIzaSyCYqa60B0WHyzdGFexO-kSzWB-s5D1xYq4", | ||
| authDomain: "flaxxproject.firebaseapp.com", | ||
| databaseURL: "https://flaxxproject.firebaseio.com", | ||
| projectId: "flaxxproject", | ||
| storageBucket: "flaxxproject.appspot.com", | ||
| messagingSenderId: "283222690232" | ||
| }; | ||
| firebase.initializeApp(config); | ||
|
|
||
| moment().format(); | ||
| let database = firebase.database(); | ||
|
|
||
| $("#submitButton").click(function () { | ||
| event.preventDefault(); | ||
|
|
||
| let users = database.ref("/employees/"); | ||
| let newEmployee = users.push(); | ||
| newEmployee.set({ | ||
| "name": $("#name").val().trim(), | ||
| "role": $("#role").val().trim(), | ||
| "startDate": $("#startDate").val().trim(), | ||
| "rate": $("#rate").val().trim(), | ||
| "dateAdded": firebase.database.ServerValue.TIMESTAMP | ||
| }) | ||
|
|
||
| }); | ||
|
|
||
| let employeeRef = database.ref("/employees/").orderByChild("dateAdded"); | ||
|
|
||
| employeeRef.on('child_added', function (data) { | ||
| let employeeData = data.val(); | ||
| let date = parseMoment(employeeData.startDate); | ||
| $("#tableBody") | ||
| .prepend($("<tr>") | ||
| .append($("<td>").text(employeeData.name), | ||
| $("<td>").text(employeeData.role), | ||
| $("<td>").text(date.format("MM/DD/YYYY")), | ||
| $("<td>").text(getMonthsWorked(date)), | ||
| $("<td>").text("$" + employeeData.rate), | ||
| $("<td>").text("$" + (employeeData.rate * getMonthsWorked(date)).toLocaleString()) | ||
| ) | ||
| ); | ||
| }); | ||
|
|
||
| function parseMoment(date) { | ||
| return moment(date); | ||
| } | ||
|
|
||
| function getMonthsWorked(date){ | ||
| let currTime = moment(); | ||
| return currTime.diff(date, 'months'); | ||
| } | ||
|
|
| @@ -0,0 +1,219 @@ | ||
| @import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,300,100); | ||
|
|
||
| body { | ||
| background-color: antiquewhite; | ||
| font-family: "Roboto", helvetica, arial, sans-serif; | ||
| font-size: 16px; | ||
| font-weight: 400; | ||
| text-rendering: optimizeLegibility; | ||
| padding: 20px; | ||
| } | ||
|
|
||
| div.table-title { | ||
| display: block; | ||
| margin: auto; | ||
| max-width: 600px; | ||
| padding:5px; | ||
| width: 100%; | ||
| } | ||
|
|
||
| .table-title h3 { | ||
| color: #fafafa; | ||
| font-size: 30px; | ||
| font-weight: 400; | ||
| font-style:normal; | ||
| font-family: "Roboto", helvetica, arial, sans-serif; | ||
| text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1); | ||
| text-transform:uppercase; | ||
| } | ||
|
|
||
|
|
||
| /*** Table Styles **/ | ||
|
|
||
| .table-fill { | ||
| background: white; | ||
| border-radius:3px; | ||
| border-collapse: collapse; | ||
| height: 320px; | ||
| margin: auto; | ||
| max-width: 600px; | ||
| padding:5px; | ||
| width: 100%; | ||
| box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); | ||
| animation: float 5s infinite; | ||
| } | ||
|
|
||
| th { | ||
| color:#D5DDE5;; | ||
| background:#1b1e24; | ||
| border-bottom:4px solid #9ea7af; | ||
| border-right: 1px solid #343a45; | ||
| font-size:23px; | ||
| font-weight: 100; | ||
| padding:24px; | ||
| text-align:left; | ||
| text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); | ||
| vertical-align:middle; | ||
| } | ||
|
|
||
| th:first-child { | ||
| border-top-left-radius:3px; | ||
| } | ||
|
|
||
| th:last-child { | ||
| border-top-right-radius:3px; | ||
| border-right:none; | ||
| } | ||
|
|
||
| tr { | ||
| border-top: 1px solid #C1C3D1; | ||
| border-bottom-: 1px solid #C1C3D1; | ||
| color:#666B85; | ||
| font-size:16px; | ||
| font-weight:normal; | ||
| text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1); | ||
| } | ||
|
|
||
| tr:hover td { | ||
| background:#4E5066; | ||
| color:#FFFFFF; | ||
| border-top: 1px solid #22262e; | ||
| border-bottom: 1px solid #22262e; | ||
| } | ||
|
|
||
| tr:first-child { | ||
| border-top:none; | ||
| } | ||
|
|
||
| tr:last-child { | ||
| border-bottom:none; | ||
| } | ||
|
|
||
| tr:nth-child(odd) td { | ||
| background:#EBEBEB; | ||
| } | ||
|
|
||
| tr:nth-child(odd):hover td { | ||
| background:#4E5066; | ||
| } | ||
|
|
||
| tr:last-child td:first-child { | ||
| border-bottom-left-radius:3px; | ||
| } | ||
|
|
||
| tr:last-child td:last-child { | ||
| border-bottom-right-radius:3px; | ||
| } | ||
|
|
||
| td { | ||
| background:#FFFFFF; | ||
| padding:20px; | ||
| text-align:left; | ||
| vertical-align:middle; | ||
| font-weight:300; | ||
| font-size:18px; | ||
| text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1); | ||
| border-right: 1px solid #C1C3D1; | ||
| } | ||
|
|
||
| td:last-child { | ||
| border-right: 0px; | ||
| } | ||
|
|
||
| th.text-left { | ||
| text-align: left; | ||
| } | ||
|
|
||
| th.text-center { | ||
| text-align: center; | ||
| } | ||
|
|
||
| th.text-right { | ||
| text-align: right; | ||
| } | ||
|
|
||
| td.text-left { | ||
| text-align: left; | ||
| } | ||
|
|
||
| td.text-center { | ||
| text-align: center; | ||
| } | ||
|
|
||
| td.text-right { | ||
| text-align: right; | ||
| } | ||
|
|
||
| .form-style-8{ | ||
| font-family: 'Open Sans Condensed', arial, sans; | ||
| width: 500px; | ||
| padding: 30px; | ||
| background: #FFFFFF; | ||
| margin: 50px auto; | ||
| box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.22); | ||
| -moz-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.22); | ||
| -webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.22); | ||
|
|
||
| } | ||
| .form-style-8 h2{ | ||
| background: #4D4D4D; | ||
| text-transform: uppercase; | ||
| font-family: 'Open Sans Condensed', sans-serif; | ||
| color: #797979; | ||
| font-size: 18px; | ||
| font-weight: 100; | ||
| padding: 20px; | ||
| margin: -30px -30px 30px -30px; | ||
| } | ||
| .form-style-8 input[type="text"], | ||
| .form-style-8 input[type="date"], | ||
| .form-style-8 input[type="datetime"], | ||
| .form-style-8 input[type="email"], | ||
| .form-style-8 input[type="number"], | ||
| .form-style-8 input[type="search"], | ||
| .form-style-8 input[type="time"], | ||
| .form-style-8 input[type="url"], | ||
| .form-style-8 input[type="password"], | ||
| .form-style-8 textarea, | ||
| .form-style-8 select | ||
| { | ||
| box-sizing: border-box; | ||
| -webkit-box-sizing: border-box; | ||
| -moz-box-sizing: border-box; | ||
| outline: none; | ||
| display: block; | ||
| width: 100%; | ||
| padding: 7px; | ||
| border: none; | ||
| border-bottom: 1px solid #ddd; | ||
| background: transparent; | ||
| margin-bottom: 10px; | ||
| font: 16px Arial, Helvetica, sans-serif; | ||
| height: 45px; | ||
| } | ||
| .form-style-8 textarea{ | ||
| resize:none; | ||
| overflow: hidden; | ||
| } | ||
| .form-style-8 input[type="button"], | ||
| .form-style-8 input[type="submit"]{ | ||
| -moz-box-shadow: inset 0px 1px 0px 0px #45D6D6; | ||
| -webkit-box-shadow: inset 0px 1px 0px 0px #45D6D6; | ||
| box-shadow: inset 0px 1px 0px 0px #45D6D6; | ||
| background-color: #2CBBBB; | ||
| border: 1px solid #27A0A0; | ||
| display: inline-block; | ||
| cursor: pointer; | ||
| color: #FFFFFF; | ||
| font-family: 'Open Sans Condensed', sans-serif; | ||
| font-size: 14px; | ||
| padding: 8px 18px; | ||
| text-decoration: none; | ||
| text-transform: uppercase; | ||
| } | ||
| .form-style-8 input[type="button"]:hover, | ||
| .form-style-8 input[type="submit"]:hover { | ||
| background:linear-gradient(to bottom, #34CACA 5%, #30C9C9 100%); | ||
| background-color:#34CACA; | ||
| } | ||
|
|