MrMeeb/simple-login
1
0
Fork 0
Code Pull Requests Actions Packages Releases 96 Activity

4.21.3

Browse Source
This commit is contained in:
MrMeeb
2022-12-30 16:23:27 +00:00
parent 02776e8478
commit 20da343c54
1304 changed files with 870224 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
app/templates/phone/index.html Normal file
View File

@ -0,0 +1,78 @@
{% extends "default.html" %}
{% set active_page = "phone" %}
{% block title %}Phone numbers{% endblock %}
{% block default_content %}
{% if reservations|length > 0 %}
<div class="card">
<div class="card-body">
<h3>Your current numbers</h3>
{% for reservation in reservations %}
<div>
<a href="{{ url_for('phone.reservation_route', reservation_id=reservation.id ) }}">
{{ reservation.number.number }} ➡
</a>
</div>
{% endfor %}
</div>
</div>
{% endif %}
<div class="card">
<div class="card-body">
<h3>Phone Reservation</h3>
<div class="alert alert-info">
Currently your phone quota is <b>{{ current_user.phone_quota }}</b> minutes.
</div>
<form method="post">
<div class="form-group">
<label for="input-minute">How many minutes do you need this number for?</label>
<input required
name="minute"
type="number"
class="form-control"
id="input-minute"
aria-describedby="emailHelp"
placeholder="5, 10, 60, etc.">
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div class="form-group">
<label>Countries</label>
<br />
{% for country in countries %}
<div class="form-check form-check-inline">
<input class="form-check-input"
type="radio"
name="country"
id="country-{{ country.id }}"
value="{{ country.id }}">
<label class="form-check-label" for="country-{{ country.id }}">{{ country.name }}</label>
</div>
{% endfor %}
</div>
<button type="submit" class="btn btn-primary">Get my number</button>
</form>
</div>
</div>
{% if past_reservations|length > 0 %}
<div class="card">
<div class="card-body">
<h3>Past Reservations</h3>
{% for reservation in past_reservations %}
<div>
<a href="{{ url_for('phone.reservation_route', reservation_id=reservation.id ) }}"
class="mr-3">
{{ reservation.number.number }} ➡
</a>
ended {{ reservation.end.humanize() }}
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endblock %}

105
app/templates/phone/phone_reservation.html Normal file
View File

@ -0,0 +1,105 @@
{% extends "default.html" %}
{% set active_page = "phone" %}
{% block title %}Phone reservation {{ phone_number.number }}{% endblock %}
{% block default_content %}
<div class="card">
<div class="card-body">
Your number is
<div class="d-flex mt-3">
<h2>{{ phone_number.number }}</h2>
<div class="ml-3">
<button data-clipboard-text="{{ phone_number.number }}"
class="clipboard btn btn-outline-primary btn-sm"
type="button">
<i class="fe fe-clipboard"></i>
</button>
</div>
</div>
{% if now > reservation.end %}
was ended {{ reservation.end.humanize() }}
{% else %}
will be released {{ reservation.end.humanize() }}
{% endif %}
</div>
</div>
<div class="card">
<div class="card-body" id="message-app">
<h2 class="mb-2">Received Messages</h2>
<div v-if="loading">Loading ...</div>
<div v-else>
<table class="table">
<thead>
<tr>
<th scope="col">From</th>
<th scope="col">Time</th>
<th scope="col">Message</th>
</tr>
</thead>
<tbody>
<tr v-for="message in messages">
<td>[[ message.from_number ]]</td>
<td>[[ message.created_at ]]</td>
<td>[[ message.body ]]</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
{% if now < reservation.end %}
<div class="card">
<div class="card-body">
When the number is released, you can't reclaim it.
<form method="post" class="mt-3">
<input type="hidden" name="form-name" value="release">
<button class="btn btn-outline-danger">Release the number</button>
</form>
</div>
</div>
{% endif %}
{% endblock %}
{% block script %}
<script>
var app = new Vue({
el: '#message-app',
delimiters: ["[[", "]]"], // necessary to avoid conflict with jinja
data: {
messages: [],
loading: true,
},
async mounted() {
await this.loadMessage();
// refresh every 5 seconds
this.intervalId = window.setInterval(this.loadMessage, 5000)
},
methods: {
loadMessage: async function () {
let that = this;
console.log("load messages");
let res = await fetch(`/api/phone/reservations/{{reservation.id}}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
}
});
if (res.ok) {
let json = await res.json();
that.messages = json.messages;
that.loading = false;
if (res.ended) {
console.log("clear interval")
window.clearInterval(that.intervalId);
}
}
}
}
})
</script>
{% endblock %}