index.html 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <meta name="theme-color" content="#F46036">
  7. <title>Workout Tracker</title>
  8. <link rel="stylesheet" href="/index.css">
  9. <link rel="icon" href="/logo.svg" type="image/svg+xml">
  10. <link rel="manifest" href="/manifest.json">
  11. </head>
  12. <body>
  13. <svg class="logo" width="90" height="60" viewBox="10 20 80 50" xmlns="http://www.w3.org/2000/svg">
  14. <defs>
  15. <linearGradient id="logoGradient" x1="0%" y1="0%" x2="100%" y2="0%">
  16. <stop offset="0%" stop-color="#e57600" />
  17. <stop offset="10%" stop-color="#f46036" />
  18. <stop offset="100%" stop-color="#d7263d" />
  19. </linearGradient>
  20. </defs>
  21. <path d="M10,40 Q25,20 50,30 Q75,40 90,30 Q75,50 50,60 Q25,70 10,60 Q25,50 10,40" fill="url(#logoGradient)" />
  22. </svg>
  23. <p id="notifier" style="display:none"></p>
  24. <div id="registerPage" class="page" style="display:none">
  25. <form id="registerForm" class="standardForm">
  26. <h1>Create Account</h1>
  27. <label>Name
  28. <input
  29. id="registerName"
  30. type="text"
  31. placeholder="Name"
  32. required
  33. >
  34. </label>
  35. <label>Email
  36. <input
  37. id="registerEmail"
  38. type="email"
  39. placeholder="Email"
  40. required
  41. >
  42. </label>
  43. <label>Password
  44. <input
  45. id="registerPass"
  46. type="password"
  47. placeholder="Password"
  48. required
  49. >
  50. </label>
  51. <label>Confirm Password
  52. <input
  53. id="registerConfirmPass"
  54. type="password"
  55. placeholder="Confirm Password"
  56. required
  57. >
  58. </label>
  59. <button>Create</button>
  60. </form>
  61. <button id="registerToLogin" class="link">Log In</button>
  62. </div>
  63. <div id="loginPage" class="page" style="display:none">
  64. <form id="loginForm" class="standardForm">
  65. <h1>Log In</h1>
  66. <label>Email
  67. <input
  68. id="loginEmail"
  69. type="email"
  70. placeholder="Email"
  71. required
  72. >
  73. </label>
  74. <label>Password
  75. <input
  76. id="loginPass"
  77. type="password"
  78. placeholder="Password"
  79. required
  80. />
  81. </label>
  82. <button>Log In</button>
  83. </form>
  84. <button id="loginToRegister" class="link">Register</button>
  85. </div>
  86. <div id="homePage" class="page" style="display:none">
  87. <button id="homeNewWorkout" class="button">+ Workout</button>
  88. <button id="installPwa" class="button">Install App</button>
  89. <h1>My Workouts</h1>
  90. <div id="workoutList"></div>
  91. <button id="homeLogout" class="link">Log Out</button>
  92. </div>
  93. <div id="newWorkoutPage" class="page" style="display:none">
  94. <button id="newWorkoutBack" class="button">Cancel</button>
  95. <div id="newWorkoutInputs">
  96. <label>Name of Workout:
  97. <input
  98. id="newWorkoutName"
  99. type="text"
  100. placeholder="Name"
  101. >
  102. </label>
  103. </div>
  104. <button id="newWorkoutFinish" class="button">Create Workout</button>
  105. </div>
  106. <div id="workoutMenuPage", class="page" style="display:none">
  107. <h1 id="workoutMenuTitle"></h1>
  108. <div id="workoutMenuButtons"></div>
  109. <div id="resumeWorkoutContainer" style="display:none">
  110. <h2>You have a previously unfinished session for this workout. What would you like to to?</h2>
  111. <button id="resumeWorkoutCancel" class="button">Cancel</button>
  112. </div>
  113. </div>
  114. <div id="sessionPage" class="page" style="display:none">
  115. <h1 id="sessionExerciseName"></h1>
  116. <p id="previousSession"></p>
  117. <div id="sessionButtonBox">
  118. <button id="sessionNotesBtn" class="button">Notes</button>
  119. <button id="sessionAddSet" class="button">Add Set</button>
  120. </div>
  121. <button id="sessionExercisesBtn" class="button">Exercises</button>
  122. <div id="sessionExercisesList" style="display:none">
  123. <button id="closeExerciseList">X</button>
  124. </div>
  125. <div id="sessionNotesText" style="display:none">
  126. <textarea id="sessionTextArea"></textarea>
  127. <button id="sessionNotesDone" class="button">Done</button>
  128. </div>
  129. <div id="sessionSets"></div>
  130. <button id="nextSessionBtn" class="button">Next Exercise</button>
  131. <button id="finishSessionBtn" class="button">Finish Workout</button>
  132. <template id="weightSet">
  133. <div class="weightSet">
  134. <button class="weightSetDelete">X</button>
  135. <h3></h3>
  136. <label>Weight
  137. <input class="weightSetWeight" type="number" step="1">
  138. </label>
  139. <label>Reps
  140. <input class="weightSetReps" type="number" step="1">
  141. </label>
  142. </div>
  143. </template>
  144. </div>
  145. <div id="editWorkoutPage" class="page" style="display:none">
  146. <h1></h1>
  147. <div id="editWorkoutExercises"></div>
  148. <button id="editWorkoutBack" class="button">Cancel</button>
  149. <template id="editWorkoutExercise">
  150. <div class="editWorkoutExercise">
  151. <p></p>
  152. </div>
  153. </template>
  154. </div>
  155. <script src="/index.js"></script>
  156. </body>
  157. </html>