Browse Source

Optimize <select name="tz"> initialization

pull/680/head
Pēteris Caune 2 years ago
parent
commit
25b22dba72
No known key found for this signature in database GPG Key ID: E28D7679E9A9EDE2
  1. 9
      static/js/add-check-modal.js
  2. 8
      static/js/initialize-timezone-selects.js
  3. 2
      static/js/update-timeout-modal.js
  4. 6
      templates/front/add_check_modal.html
  5. 2
      templates/front/details.html
  6. 2
      templates/front/my_checks.html
  7. 10
      templates/front/update_timeout_modal.html

9
static/js/add-check-modal.js

@ -1,7 +1,6 @@
$(function () {
var base = document.getElementById("base-url").getAttribute("href").slice(0, -1);
var modal = $("#add-check-modal");
var timezones = document.getElementById("all-timezones").textContent;
var period = document.getElementById("add-check-period");
var periodUnit = document.getElementById("add-check-period-unit");
var scheduleField = document.getElementById("add-check-schedule");
@ -24,13 +23,6 @@ $(function () {
options: $("#my-checks-tags div").map(divToOption).get()
});
$("#add-check-tz").selectize({
labelField: "value",
searchField: ["value"],
options: timezones.split(",").map(tz => {return {value: tz}})
});
function updateScheduleExtras() {
var kind = $('#add-check-modal input[name=kind]:checked').val();
modal.removeClass("cron").removeClass("simple").addClass(kind);
@ -46,6 +38,7 @@ $(function () {
modal.on("shown.bs.modal", function() {
updateScheduleExtras();
validateSchedule();
$("#add-check-tz")[0].selectize.setValue("UTC", true);
$("#add-check-name").focus();
});

8
static/js/initialize-timezone-selects.js

@ -0,0 +1,8 @@
$(function() {
var timezones = document.getElementById("all-timezones").textContent;
$("select[name=tz]").selectize({
labelField: "value",
searchField: ["value"],
options: timezones.split(",").map(tz => ({value: tz}))
});
});

2
static/js/update-timeout-modal.js

@ -34,7 +34,7 @@ $(function () {
currentPreviewHash = "";
$("#cron-preview").html("<p>Updating...</p>");
$("#schedule").val(this.dataset.schedule);
$("#tz").selectpicker("val", this.dataset.tz);
$("#tz")[0].selectize.setValue(this.dataset.tz, true);
var minutes = parseInt(this.dataset.grace / 60);
$("#update-timeout-grace-cron").val(minutes);
updateCronPreview();

6
templates/front/add_check_modal.html

@ -108,9 +108,7 @@
Time Zone
</label>
<div class="col-sm-9">
<select id="add-check-tz" name="tz" class="form-control">
<option>UTC</option>
</select>
<select id="add-check-tz" name="tz" class="form-control"></select>
</div>
</div>
@ -145,5 +143,3 @@
</form>
</div>
</div>
<script id="all-timezones" type="data">{{ timezones|join:"," }}</script>

2
templates/front/details.html

@ -350,6 +350,7 @@
{% endblock %}
{% block scripts %}
<script id="all-timezones" type="data">UTC,{{ timezones|join:"," }}</script>
{% compress js %}
<script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
@ -365,5 +366,6 @@
<script src="{% static 'js/adaptive-setinterval.js' %}"></script>
<script src="{% static 'js/ping_details.js' %}"></script>
<script src="{% static 'js/details.js' %}"></script>
<script src="{% static 'js/initialize-timezone-selects.js' %}"></script>
{% endcompress %}
{% endblock %}

2
templates/front/my_checks.html

@ -91,6 +91,7 @@
{% endblock %}
{% block scripts %}
<script id="all-timezones" type="data">UTC,{{ timezones|join:"," }}</script>
{% compress js %}
<script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
@ -104,5 +105,6 @@
<script src="{% static 'js/ping_details.js' %}"></script>
<script src="{% static 'js/checks.js' %}"></script>
<script src="{% static 'js/add-check-modal.js' %}"></script>
<script src="{% static 'js/initialize-timezone-selects.js' %}"></script>
{% endcompress %}
{% endblock %}

10
templates/front/update_timeout_modal.html

@ -86,15 +86,7 @@
<div class="form-group">
<label for="tz">Server's Time Zone</label>
<br />
<select
id="tz"
name="tz"
class="selectpicker form-control"
data-live-search="true">
<option>UTC</option>
{% for tz in timezones %}
<option>{{ tz }}</option>{% endfor %}
</select>
<select id="tz" name="tz" class="form-control"></select>
</div>
</div>
<div class="col-md-4">

Loading…
Cancel
Save