summaryrefslogtreecommitdiff
path: root/views
diff options
context:
space:
mode:
Diffstat (limited to 'views')
-rw-r--r--views/error.ejs2
-rw-r--r--views/index.ejs188
-rw-r--r--views/login.ejs2
-rw-r--r--views/profile.ejs17
-rw-r--r--views/signup.ejs23
5 files changed, 163 insertions, 69 deletions
diff --git a/views/error.ejs b/views/error.ejs
index b38f681..05344c0 100644
--- a/views/error.ejs
+++ b/views/error.ejs
@@ -110,7 +110,7 @@
</div>
</div>
- <footer>
+ <footer class="hideme">
<link rel="stylesheet" type="text/css"
href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
Made with <i class="icon ion-heart"></i> by <a href="https://kyzer.co/">Sin</a> (in only 10 hours).
diff --git a/views/index.ejs b/views/index.ejs
index 04d1cce..48144ba 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -95,12 +95,14 @@
</div>
</nav>
- <div class="container my-5 hideme">
- <form action="/submitEntry" method="POST" class="my-4 form-inline">
+ <div class="container my-5">
+ <form action="/submitEntry" method="POST" class="my-4 form-inline hideme">
<div class="row">
<div class="col-sm">
<label for="transactionType" class="sr-only">Type of transaction</label>
- <select name="transactionType" id="transactionType" class="form-control mr-2" <% if (name === null) { %> disabled <% } %>>
+ <select name="transactionType" id="transactionType" class="form-control mr-2"
+ <% if (name === null) { %> disabled data-toggle="tooltip" data-placement="top"
+ title="Login to submit" <% } %>>
<option value="purchase">Purchase</option>
<option value="sale">Sale</option>
<option value="trade">Trade</option>
@@ -108,16 +110,21 @@
<label for="carsType" class="sr-only">Cars</label>
<input type="text" name="carsType" id="carsType" class="form-control mr-2"
- placeholder="Car(s)" min="2" max="16" required <% if (name === null) { %> disabled <% } %>>
+ placeholder="Car(s)" min="2" max="16" required <% if (name === null) { %> disabled
+ data-toggle="tooltip" data-placement="top"
+ title="Login to submit" <% } %>>
<label for="sellerType" class="sr-only">Seller, Buyer or Trader's Name</label>
<input type="text" name="sellerType" id="sellerType" class="form-control mr-2"
placeholder="Seller/ Buyer/ Trader's Name" min="1" max="50" required
- <% if (name === null) { %> disabled <% } %>>
+ <% if (name === null) { %> disabled data-toggle="tooltip" data-placement="top"
+ title="Login to submit" <% } %>>
<label for="priceType" class="sr-only">Price or Received Cars</label>
<input type="text" name="priceType" id="priceType" class="form-control mr-2"
placeholder="Price/ Received Car(s)" min="1" required <% if (name === null) { %> disabled
+ data-toggle="tooltip" data-placement="top"
+ title="Login to submit"
<% } %>>
<% if (name === null) { %>
@@ -131,116 +138,175 @@
</div>
</form>
- <div class="row">
+ <div class="row">
<div class="col-sm">
- <h3 id="white-txt">Purchases</h3>
+ <h3 id="white-txt" class="hideme">Purchases</h3>
<table class="table table-striped">
- <thead>
+ <thead class="hideme">
<tr>
- <th id="white-txt">Car(s)</th>
- <th id="white-txt">Seller</th>
- <th id="white-txt">Price</th>
- <th id="white-txt">TOS</th>
+ <th id="white-txt" class="hideme">Car(s)</th>
+ <th id="white-txt" class="hideme">Seller</th>
+ <th id="white-txt" class="hideme">Price</th>
+ <th id="white-txt" class="hideme" data-toggle="tooltip" data-placement="top"
+ title="Time of Sale">TOS</th>
</tr>
</thead>
- <tbody>
+ <tbody class="hideme">
<% if (name === null) { %>
<tr>
- <td id="white-txt" class="highlightable">RX7</td>
- <td id="white-txt" class="highlightable">Sin</td>
- <td id="white-txt" class="highlightable">150000</td>
- <td id="white-txt" class="highlightable">2020-05-06T08:08:34.827Z</td>
+ <td id="white-txt" class="highlightable hideme">RX7</td>
+ <td id="white-txt" class="highlightable hideme">Sin</td>
+ <td id="white-txt" class="highlightable hideme">150000</td>
+ <td id="white-txt" class="highlightable hideme">2020-05-06T08:08:34.827Z</td>
</tr>
<% } else { %>
- <% loop.forEach(lp => { %>
+ <% if (loopCount < 1) { %>
<tr>
- <td id="white-txt" class="highlightable"><%= lp.cars %></td>
- <td id="white-txt" class="highlightable"><%= lp.seller %></td>
- <td id="white-txt" class="highlightable"><%= lp.price %></td>
- <td id="white-txt" class="highlightable"><%= lp.date %></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
</tr>
- <% }) %>
+ <% } else { %>
+ <% loop.forEach(lp => { %>
+ <tr>
+ <td id="white-txt" class="highlightable hideme"><%= lp.cars %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.seller %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.price %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.date %></td>
+ </tr>
+ <% }) %>
+ <% } %>
<% } %>
</tbody>
</table>
</div>
<div class="col-sm">
- <h3 id="white-txt">Sales</h3>
+ <h3 id="white-txt" class="hideme">Sales</h3>
<table class="table table-striped">
- <thead>
+ <thead class="hideme">
<tr>
- <th id="white-txt">Car(s)</th>
- <th id="white-txt">Buyer</th>
- <th id="white-txt">Price</th>
- <th id="white-txt">TOS</th>
+ <th id="white-txt" class="hideme">Car(s)</th>
+ <th id="white-txt" class="hideme">Buyer</th>
+ <th id="white-txt" class="hideme">Price</th>
+ <th id="white-txt" class="hideme" data-toggle="tooltip" data-placement="top"
+ title="Time of Sale">TOS</th>
</tr>
</thead>
- <tbody>
+ <tbody class="hideme">
<% if (name === null) { %>
<tr>
- <td id="white-txt" class="highlightable">R34</td>
- <td id="white-txt" class="highlightable">Sin</td>
- <td id="white-txt" class="highlightable">180000</td>
- <td id="white-txt" class="highlightable">2020-05-04T02:02:56.8F9J</td>
+ <td id="white-txt" class="highlightable hideme">R34</td>
+ <td id="white-txt" class="highlightable hideme">Sin</td>
+ <td id="white-txt" class="highlightable hideme">180000</td>
+ <td id="white-txt" class="highlightable hideme">2020-05-04T02:02:56.8F9J</td>
</tr>
<% } else { %>
- <% loop2.forEach(lp => { %>
+ <% if (loop2Count < 1) { %>
<tr>
- <td id="white-txt" class="highlightable"><%= lp.cars %></td>
- <td id="white-txt" class="highlightable"><%= lp.seller %></td>
- <td id="white-txt" class="highlightable"><%= lp.price %></td>
- <td id="white-txt" class="highlightable"><%= lp.date %></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
+ <td id="white-txt" class="highlightable hideme"></td>
</tr>
- <% }) %>
+ <% } else { %>
+ <% loop2.forEach(lp => { %>
+ <tr>
+ <td id="white-txt" class="highlightable hideme"><%= lp.cars %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.seller %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.price %></td>
+ <td id="white-txt" class="highlightable hideme"><%= lp.date %></td>
+ </tr>
+ <% }) %>
+ <% } %>
<% } %>
</tbody>
</table>
</div>
<div class="col-sm">
- <h3 id="white-txt">Trades</h3>
+ <h3 id="white-txt" class="hideme">Trades</h3>
<table class="table table-striped">
- <thead>
+ <thead class="hideme">
<tr>
<th id="white-txt">Received Car(s)</th>
<th id="white-txt">Trader</th>
<th id="white-txt">Traded Car(s)</th>
- <th id="white-txt">TOS</th>
+ <th id="white-txt" data-toggle="tooltip" data-placement="top" title="Time of Sale">TOS</th>
</tr>
</thead>
- <tbody>
+ <tbody class="hideme">
<% if (name === null) { %>
<td id="white-txt" class="highlightable">R32</td>
<td id="white-txt" class="highlightable">Sin</td>
<td id="white-txt" class="highlightable">R34</td>
<td id="white-txt" class="highlightable">2020-05-02T06:21:23.2J7F</td>
<% } else { %>
- <% loop3.forEach(lp => { %>
+ <% if (loop3Count < 1) { %>
<tr>
- <td id="white-txt" class="highlightable"><%= lp.cars %></td>
- <td id="white-txt" class="highlightable"><%= lp.seller %></td>
- <td id="white-txt" class="highlightable"><%= lp.price %></td>
- <td id="white-txt" class="highlightable"><%= lp.date %></td>
+ <td id="white-txt" class="highlightable"></td>
+ <td id="white-txt" class="highlightable"></td>
+ <td id="white-txt" class="highlightable"></td>
+ <td id="white-txt" class="highlightable"></td>
</tr>
- <% }) %>
+ <% } else { %>
+ <% loop3.forEach(lp => { %>
+ <tr>
+ <td id="white-txt" class="highlightable"><%= lp.cars %></td>
+ <td id="white-txt" class="highlightable"><%= lp.seller %></td>
+ <td id="white-txt" class="highlightable"><%= lp.price %></td>
+ <td id="white-txt" class="highlightable"><%= lp.date %></td>
+ </tr>
+ <% }) %>
+ <% } %>
<% } %>
</tbody>
</table>
</div>
</div>
- <div class="newest hideme" style="position: absolute; top: 5%; left: 5%;">
- <h1 id="white-txt">TODO:</h1>
- <ul style="position: relative; left: -25%;">
- <li id="white-txt">Add more API features</li>
- <li id="white-txt">Add delete and change features (lol)</li>
- <li id="white-txt">Add marketplace</li>
- <li id="white-txt">Add automated password, email and<br /> username change requests</li>
- <li id="white-txt">Add feature which imports old Sin's <br /> SS Logger desktop app data into web app.</li>
- </ul>
- </div>
+ <% if (name === 'sin') { %>
+ <div class="newest hideme" style="position: fixed; top: 5%; left: 5%;">
+ <table class="table table-striped">
+ <thead>
+ <tr>
+ <th id="white-txt">Users</th>
+ <th id="white-txt">Entries</th>
+ <th id="white-txt">Uptime</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td id="white-txt" class="highlightable"><%= UserCount %></td>
+ <td id="white-txt" class="highlightable"><%= EntryCount %></td>
+ <td id="white-txt" class="highlightable"><%= process.uptime() %></td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <% } %>
+
+ <% if (req.session.exampleVideo) { %>
+ <div class="example-video__container hideme" style="position: absolute; bottom: 15px; left: 15px;">
+ <form action="/closeExampleVideo" method="post">
+ <button type="submit" class="btn btn-danger" style="float: right; font-size: 10px !important;"
+ data-toggle="tooltip" data-placement="top" title="Close the demo">Close Demo</button>
+ </form>
+ <br />
+
+ <iframe src="https://streamable.com/e/669gny?autoplay=1" width="578" height="325" frameborder="0"
+ allowfullscreen id="example-video"></iframe>
+ </div>
+ <% } else { %>
+ <div class="example-video__container hideme" style="position: fixed; bottom: 15px; left: 15px;">
+ <form action="/openExampleVideo" method="post">
+ <button type="submit" class="btn btn-info"
+ style="float: right; font-size: 10px !important;" data-toggle="tooltip" data-placement="top" title="Re-watch the demo">Re-watch Demo</button>
+ </form>
+ </div>
+ <% } %>
</div>
- <footer>
+ <footer class="hideme">
<link rel="stylesheet" type="text/css"
href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
Made with <i class="icon ion-heart"></i> by <a href="https://kyzer.co/">Sin</a> (in only 10 hours).
diff --git a/views/login.ejs b/views/login.ejs
index f7f0b6f..c282b7f 100644
--- a/views/login.ejs
+++ b/views/login.ejs
@@ -122,7 +122,7 @@
</div>
</div>
- <footer>
+ <footer class="hideme">
<link rel="stylesheet" type="text/css"
href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
Made with <i class="icon ion-heart"></i> by <a href="https://kyzer.co/">Sin</a> (in only 10 hours).
diff --git a/views/profile.ejs b/views/profile.ejs
index b949794..ff15c3b 100644
--- a/views/profile.ejs
+++ b/views/profile.ejs
@@ -106,9 +106,20 @@
<div class="col-sm"></div>
<div class="col-sm">
<h4 class="pt-4" id="white-txt">
- <a href="https://www.youtube.com/watch?v=ZClu_I6U6aM" id="deez-nuts">
- <%= name %>
+ <a href="https://www.youtube.com/watch?v=ZClu_I6U6aM" id="deez-nuts" data-toggle="tooltip"
+ data-placement="top" title="Oh no, you found me...">
+ <%= name %>
</a>
+ <br />
+
+ <img src="https://i.imgur.com/qrrXOst.jpg"
+ alt="Profile Picture Default" width="120px" class="pt-4">
+ <small class="form-text text-muted" style="font-size: 15px;">Custom PFPs coming soon!</small>
+
+ <!-- <form action="/submitPFP" method="post">
+ <input type="file" id="pfp-img" name="pfp-img" accept="image/*" required style="font-size: 16px;">
+ <input type="submit" style="font-size: 16px;">
+ </form> -->
</h4>
<form action="/logout" method="POST" class="my-4">
<div class="form-group">
@@ -123,7 +134,7 @@
</div>
</div>
- <footer>
+ <footer class="hideme">
<link rel="stylesheet" type="text/css"
href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
Made with <i class="icon ion-heart"></i> by <a href="https://kyzer.co/">Sin</a> (in only 10 hours).
diff --git a/views/signup.ejs b/views/signup.ejs
index b6b0eae..3d1356b 100644
--- a/views/signup.ejs
+++ b/views/signup.ejs
@@ -100,7 +100,7 @@
<div class="form-group">
<label for="emailSignup" class="sr-only">Email</label>
<input type="email" name="emailSignup" id="emailSignup" class="form-control mr-2"
- placeholder="Email" pattern=".{6,}" required>
+ placeholder="Email" pattern=".{6,}">
<small id="loginUserhelp" class="form-text text-muted">Don't worry, we never share your email with anyone. Fake users will be pruned and deleted.</small>
</div>
<div class="form-group">
@@ -111,8 +111,25 @@
</div>
<div class="form-group">
<label for="passSignup" class="sr-only">Password</label>
- <input type="password" name="passSignup" id="passSignup" class="form-control mr-2"
+ <input type="password" name="passSignup" id="passSignup" class="form-control mr-2 mb-2"
placeholder="Password" pattern=".{3,}" required>
+ <input type="password" name="passSignupCheck" id="passSignupCheck" class="form-control mr-2"
+ placeholder="Confirm Password" pattern=".{3,}" required>
+ <script>
+ var password = document.getElementById("passSignup"),
+ confirm_password = document.getElementById("passSignupCheck");
+
+ function validatePassword() {
+ if (password.value != confirm_password.value) {
+ confirm_password.setCustomValidity("Passwords do not match!");
+ } else {
+ confirm_password.setCustomValidity('');
+ }
+ }
+
+ password.onchange = validatePassword;
+ confirm_password.onkeyup = validatePassword;
+ </script>
<small id="loginUserhelp" class="form-text text-muted">Pick something secure and easy to remember! Must be atleast 3 characters.</small>
<div>
<input type="checkbox" class="form-check-input" id="terms-check" required style="margin-left: 0 !important; margin-top: .45rem;">
@@ -132,7 +149,7 @@
</div>
</div>
- <footer>
+ <footer class="hideme">
<link rel="stylesheet" type="text/css"
href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
Made with <i class="icon ion-heart"></i> by <a href="https://kyzer.co/">Sin</a> (in only 10 hours).