mirror of
https://gitlab.com/allianceauth/allianceauth.git
synced 2025-07-10 13:00:16 +02:00
Update optimer and fleetup javascript (#695)
* Split out moment duration formatter * Replace fleetup timer js * Replace optimer js * Remove obsolete countdown.js library * Remove unused dateformat.js references * Remove obsolete dateformat library
This commit is contained in:
parent
1a749bf712
commit
ff1c2030ca
@ -56,8 +56,4 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -61,8 +61,4 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -35,8 +35,4 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -41,8 +41,4 @@
|
|||||||
</table>
|
</table>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -99,8 +99,4 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
|
||||||
|
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
File diff suppressed because it is too large
Load Diff
@ -1,86 +0,0 @@
|
|||||||
(function() {
|
|
||||||
|
|
||||||
Date.shortMonths = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
|
|
||||||
Date.longMonths = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
|
|
||||||
Date.shortDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
|
|
||||||
Date.longDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
|
|
||||||
|
|
||||||
// defining patterns
|
|
||||||
var replaceChars = {
|
|
||||||
// Day
|
|
||||||
d: function() { return (this.getDate() < 10 ? '0' : '') + this.getDate(); },
|
|
||||||
D: function() { return Date.shortDays[this.getDay()]; },
|
|
||||||
j: function() { return this.getDate(); },
|
|
||||||
l: function() { return Date.longDays[this.getDay()]; },
|
|
||||||
N: function() { return (this.getDay() == 0 ? 7 : this.getDay()); },
|
|
||||||
S: function() { return (this.getDate() % 10 == 1 && this.getDate() != 11 ? 'st' : (this.getDate() % 10 == 2 && this.getDate() != 12 ? 'nd' : (this.getDate() % 10 == 3 && this.getDate() != 13 ? 'rd' : 'th'))); },
|
|
||||||
w: function() { return this.getDay(); },
|
|
||||||
z: function() { var d = new Date(this.getFullYear(),0,1); return Math.ceil((this - d) / 86400000); }, // Fixed now
|
|
||||||
// Week
|
|
||||||
W: function() {
|
|
||||||
var target = new Date(this.valueOf());
|
|
||||||
var dayNr = (this.getDay() + 6) % 7;
|
|
||||||
target.setDate(target.getDate() - dayNr + 3);
|
|
||||||
var firstThursday = target.valueOf();
|
|
||||||
target.setMonth(0, 1);
|
|
||||||
if (target.getDay() !== 4) {
|
|
||||||
target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7);
|
|
||||||
}
|
|
||||||
return 1 + Math.ceil((firstThursday - target) / 604800000);
|
|
||||||
},
|
|
||||||
// Month
|
|
||||||
F: function() { return Date.longMonths[this.getMonth()]; },
|
|
||||||
m: function() { return (this.getMonth() < 9 ? '0' : '') + (this.getMonth() + 1); },
|
|
||||||
M: function() { return Date.shortMonths[this.getMonth()]; },
|
|
||||||
n: function() { return this.getMonth() + 1; },
|
|
||||||
t: function() { var d = new Date(); return new Date(d.getFullYear(), d.getMonth(), 0).getDate() }, // Fixed now, gets #days of date
|
|
||||||
// Year
|
|
||||||
L: function() { var year = this.getFullYear(); return (year % 400 == 0 || (year % 100 != 0 && year % 4 == 0)); }, // Fixed now
|
|
||||||
o: function() { var d = new Date(this.valueOf()); d.setDate(d.getDate() - ((this.getDay() + 6) % 7) + 3); return d.getFullYear();}, //Fixed now
|
|
||||||
Y: function() { return this.getFullYear(); },
|
|
||||||
y: function() { return ('' + this.getFullYear()).substr(2); },
|
|
||||||
// Time
|
|
||||||
a: function() { return this.getHours() < 12 ? 'am' : 'pm'; },
|
|
||||||
A: function() { return this.getHours() < 12 ? 'AM' : 'PM'; },
|
|
||||||
B: function() { return Math.floor((((this.getUTCHours() + 1) % 24) + this.getUTCMinutes() / 60 + this.getUTCSeconds() / 3600) * 1000 / 24); }, // Fixed now
|
|
||||||
g: function() { return this.getHours() % 12 || 12; },
|
|
||||||
G: function() { return this.getHours(); },
|
|
||||||
h: function() { return ((this.getHours() % 12 || 12) < 10 ? '0' : '') + (this.getHours() % 12 || 12); },
|
|
||||||
H: function() { return (this.getHours() < 10 ? '0' : '') + this.getHours(); },
|
|
||||||
i: function() { return (this.getMinutes() < 10 ? '0' : '') + this.getMinutes(); },
|
|
||||||
s: function() { return (this.getSeconds() < 10 ? '0' : '') + this.getSeconds(); },
|
|
||||||
u: function() { var m = this.getMilliseconds(); return (m < 10 ? '00' : (m < 100 ?
|
|
||||||
'0' : '')) + m; },
|
|
||||||
// Timezone
|
|
||||||
e: function() { return "Not Yet Supported"; },
|
|
||||||
I: function() {
|
|
||||||
var DST = null;
|
|
||||||
for (var i = 0; i < 12; ++i) {
|
|
||||||
var d = new Date(this.getFullYear(), i, 1);
|
|
||||||
var offset = d.getTimezoneOffset();
|
|
||||||
|
|
||||||
if (DST === null) DST = offset;
|
|
||||||
else if (offset < DST) { DST = offset; break; } else if (offset > DST) break;
|
|
||||||
}
|
|
||||||
return (this.getTimezoneOffset() == DST) | 0;
|
|
||||||
},
|
|
||||||
O: function() { return (-this.getTimezoneOffset() < 0 ? '-' : '+') + (Math.abs(this.getTimezoneOffset() / 60) < 10 ? '0' : '') + (Math.abs(this.getTimezoneOffset() / 60)) + '00'; },
|
|
||||||
P: function() { return (-this.getTimezoneOffset() < 0 ? '-' : '+') + (Math.abs(this.getTimezoneOffset() / 60) < 10 ? '0' : '') + (Math.abs(this.getTimezoneOffset() / 60)) + ':00'; }, // Fixed now
|
|
||||||
T: function() { return this.toTimeString().replace(/^.+ \(?([^\)]+)\)?$/, '$1'); },
|
|
||||||
Z: function() { return -this.getTimezoneOffset() * 60; },
|
|
||||||
// Full Date/Time
|
|
||||||
c: function() { return this.format("Y-m-d\\TH:i:sP"); }, // Fixed now
|
|
||||||
r: function() { return this.toString(); },
|
|
||||||
U: function() { return this.getTime() / 1000; }
|
|
||||||
};
|
|
||||||
|
|
||||||
// Simulates PHP's date function
|
|
||||||
Date.prototype.format = function(format) {
|
|
||||||
var date = this;
|
|
||||||
return format.replace(/(\\?)(.)/g, function(_, esc, chr) {
|
|
||||||
return (esc === '' && replaceChars[chr]) ? replaceChars[chr].call(date) : chr;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
}).call(this);
|
|
||||||
|
|
15
stock/static/js/timers.js
Normal file
15
stock/static/js/timers.js
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
/**
|
||||||
|
* Get a duration string like countdown.js
|
||||||
|
* e.g. "1y 2d 3h 4m 5s"
|
||||||
|
* @param duration moment.duration
|
||||||
|
*/
|
||||||
|
function getDurationString(duration) {
|
||||||
|
var out = "";
|
||||||
|
if (duration.years()) {
|
||||||
|
out += duration.years() + 'y ';
|
||||||
|
}
|
||||||
|
if (duration.days()) {
|
||||||
|
out += duration.days() + 'd ';
|
||||||
|
}
|
||||||
|
return out + duration.hours() + "h " + duration.minutes() + "m " + duration.seconds() + "s";
|
||||||
|
}
|
@ -59,7 +59,10 @@
|
|||||||
<td class="col-md-6">{{ start.end|date:"l d M H:i" }} <span class="label label-success">{% trans "Eve Time" %}</span></td>
|
<td class="col-md-6">{{ start.end|date:"l d M H:i" }} <span class="label label-success">{% trans "Eve Time" %}</span></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="col-md-6"><div id="countdown{{ start.operation_id }}"></div></td>
|
<td class="col-md-6">
|
||||||
|
<span id="localtime{{ start.operation_id }}"></span> <span class='label label-success'>Local time</span><br>
|
||||||
|
<div id="countdown{{ start.operation_id }}"></div>
|
||||||
|
</td>
|
||||||
|
|
||||||
<td class="col-md-6"></td>
|
<td class="col-md-6"></td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -197,22 +200,81 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script src="/static/js/dateformat.js"></script>
|
{% include 'bundles/moment-js.html' with locale=True %}
|
||||||
<script src="/static/js/countdown.js"></script>
|
<script src="{% static 'js/timers.js' %}"></script>
|
||||||
<script>
|
<script type="text/javascript">
|
||||||
var clockClosest = document.getElementById("countdownclosest"), targetDate = new Date(Date.UTC({{ closest_timer.eve_time | date:"Y, m-1, d, H, i" }}));{% for subject, start in operations_list %}
|
// Data
|
||||||
var clock{{ start.operation_id }} = document.getElementById("countdown{{ start.operation_id }}"), targetDate{{ start.operation_id }} = new Date(Date.UTC({{ start.start | date:"Y, m-1, d, H, i" }}));{% endfor %}
|
var timers = [
|
||||||
|
{% for start, op in operations_list %}
|
||||||
|
{
|
||||||
|
'id': {{ op.operation_id }},
|
||||||
|
'start': moment("{{ op.start | date:"c" }}"),
|
||||||
|
'end': moment("{{ op.end | date:"c" }}"),
|
||||||
|
'expired': false
|
||||||
|
},
|
||||||
|
{% endfor %}
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
setInterval(function(){clockClosest.innerHTML = targetDate.format('D @ h:ia'); if (targetDate > Date.now()){ clockClosest.innerHTML = clockClosest.innerHTML + "<BR>" + countdown(targetDate).toString();}}, 1000);
|
timedUpdate();
|
||||||
{% for subject, start in operations_list %}setInterval(function(){clock{{ start.operation_id }}.innerHTML = targetDate{{ start.operation_id }}.format('l d M H:i'); if (targetDate{{ start.operation_id }} > Date.now()){ clock{{ start.operation_id }}.innerHTML = clock{{ start.operation_id }}.innerHTML + " <span class='label label-success'>Local time</span></br><h2>" + countdown(targetDate{{ start.operation_id }}).toString() + "</h2>";}}, 1000);{% endfor %}
|
setAllLocalTimes();
|
||||||
{% for timer in corp_timers %}setInterval(function(){clock{{ timer.id }}.innerHTML = targetDate{{ timer.id }}.format('D @ h:ia'); if (targetDate{{ timer.id }} > Date.now()){ clock{{ timer.id }}.innerHTML = clock{{ timer.id }}.innerHTML + "<BR>" + countdown(targetDate{{ timer.id }}).toString();}}, 1000);{% endfor %}
|
|
||||||
|
|
||||||
setInterval(function(){updateClock()}, 1000);
|
// Start timed updates
|
||||||
|
setInterval(timedUpdate, 1000);
|
||||||
|
|
||||||
function updateClock() {
|
function timedUpdate() {
|
||||||
var clock = new Date();
|
updateClock();
|
||||||
document.getElementById("current-time").innerHTML = "<b>" + clock.toUTCString() + "</b>";
|
updateAllTimers();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function updateAllTimers () {
|
||||||
|
var l = timers.length;
|
||||||
|
for (var i=0; i < l; ++i) {
|
||||||
|
if (timers[i].expired) continue;
|
||||||
|
updateTimer(timers[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update a timer
|
||||||
|
* @param timer Timer information
|
||||||
|
* @param timer.start Date of the timer
|
||||||
|
* @param timer.id Id number of the timer
|
||||||
|
* @param timer.expired
|
||||||
|
*/
|
||||||
|
function updateTimer(timer) {
|
||||||
|
if (timer.start.isAfter(Date.now())) {
|
||||||
|
var duration = moment.duration(timer.start - moment(), 'milliseconds');
|
||||||
|
document.getElementById("countdown" + timer.id).innerHTML = getDurationString(duration);
|
||||||
|
} else {
|
||||||
|
timer.expired = true;
|
||||||
|
document.getElementById("countdown" + timer.id).innerHTML = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set all local time fields
|
||||||
|
*/
|
||||||
|
function setAllLocalTimes() {
|
||||||
|
var l = timers.length;
|
||||||
|
for (var i=0; i < l; ++i) {
|
||||||
|
setLocalTime(timers[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set the local time info for the timer
|
||||||
|
* @param timer Timer information
|
||||||
|
* @param timer.start Date of the timer
|
||||||
|
* @param timer.id Id number of the timer
|
||||||
|
*/
|
||||||
|
function setLocalTime(timer) {
|
||||||
|
document.getElementById("localtime" + timer.id).innerHTML = timer.start.format("ddd @ LT");
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateClock() {
|
||||||
|
document.getElementById("current-time").innerHTML = "<b>" + moment.utc().format('ddd, ll HH:mm:ss z') + "</b>";
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -51,7 +51,7 @@
|
|||||||
</td>
|
</td>
|
||||||
<td style="width:150px" class="text-center">{{ ops.location }}</td>
|
<td style="width:150px" class="text-center">{{ ops.location }}</td>
|
||||||
<td style="width:150px" class="text-center" nowrap>{{ ops.start | date:"Y-m-d H:i" }}</td>
|
<td style="width:150px" class="text-center" nowrap>{{ ops.start | date:"Y-m-d H:i" }}</td>
|
||||||
<td class="text-center" nowrap><div id="countdown{{ ops.id }}"></div></td>
|
<td class="text-center" nowrap><div id="localtime{{ ops.id }}"></div><div id="countdown{{ ops.id }}"></div></td>
|
||||||
<td style="width:150px" class="text-center">{{ ops.duration }}</td>
|
<td style="width:150px" class="text-center">{{ ops.duration }}</td>
|
||||||
<td style="width:150px" class="text-center">{{ ops.fc }}</td>
|
<td style="width:150px" class="text-center">{{ ops.fc }}</td>
|
||||||
<td style="width:150px" class="text-center">{{ ops.details }}</td>
|
<td style="width:150px" class="text-center">{{ ops.details }}</td>
|
||||||
@ -76,26 +76,80 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="/static/js/dateformat.js"></script>
|
{% include 'bundles/moment-js.html' with locale=True %}
|
||||||
<script src="/static/js/countdown.js"></script>
|
<script src="{% static 'js/timers.js' %}"></script>
|
||||||
<script>
|
<script type="text/javascript">
|
||||||
var locale = "{{ LANGUAGE_CODE }}";
|
// Data
|
||||||
{% for ops in optimer %}var clock{{ ops.id }} = document.getElementById("countdown{{ ops.id }}"), targetDate{{ ops.id }} = new Date(Date.UTC({{ ops.start | date:"Y, m-1, d, H, i" }}));{% endfor %}
|
var timers = [
|
||||||
{% for ops in optimer %}setInterval(function(){
|
{% for op in optimer %}
|
||||||
var options = { weekday: 'short' };
|
{
|
||||||
var options2 = { hour: 'numeric', minute: 'numeric' };
|
'id': {{ op.id }},
|
||||||
var time = ((targetDate{{ ops.id }}.toLocaleString(locale, options)) + " @ " + (targetDate{{ ops.id }}.toLocaleString(locale, options2)));
|
'start': moment("{{ op.start | date:"c" }}"),
|
||||||
clock{{ ops.id }}.innerHTML = time;
|
'expired': false
|
||||||
if (targetDate{{ ops.id }} > Date.now())
|
},
|
||||||
{ clock{{ ops.id }}.innerHTML = clock{{ ops.id }}.innerHTML + "<BR>" + countdown(targetDate{{ ops.id }}).toString();}}, 1000);{% endfor %}
|
{% endfor %}
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
setInterval(function(){updateClock()}, 1000);
|
timedUpdate();
|
||||||
|
setAllLocalTimes();
|
||||||
|
|
||||||
function updateClock() {
|
// Start timed updates
|
||||||
var options = { timeZone: 'UTC', weekday: 'short', day: 'numeric', month: 'short', year: 'numeric', hour: "numeric", minute: "numeric", second: "numeric" };
|
setInterval(timedUpdate, 1000);
|
||||||
var clock = new Date()
|
|
||||||
document.getElementById("current-time").innerHTML = "<b>" + clock.toLocaleString(locale, options) + "</b>";
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
function timedUpdate() {
|
||||||
|
updateClock();
|
||||||
|
updateAllTimers();
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateAllTimers () {
|
||||||
|
var l = timers.length;
|
||||||
|
for (var i=0; i < l; ++i) {
|
||||||
|
if (timers[i].expired) continue;
|
||||||
|
updateTimer(timers[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update a timer
|
||||||
|
* @param timer Timer information
|
||||||
|
* @param timer.start Date of the timer
|
||||||
|
* @param timer.id Id number of the timer
|
||||||
|
* @param timer.expired
|
||||||
|
*/
|
||||||
|
function updateTimer(timer) {
|
||||||
|
if (timer.start.isAfter(Date.now())) {
|
||||||
|
var duration = moment.duration(timer.start - moment(), 'milliseconds');
|
||||||
|
document.getElementById("countdown" + timer.id).innerHTML = getDurationString(duration);
|
||||||
|
} else {
|
||||||
|
timer.expired = true;
|
||||||
|
document.getElementById("countdown" + timer.id).innerHTML = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set all local time fields
|
||||||
|
*/
|
||||||
|
function setAllLocalTimes() {
|
||||||
|
var l = timers.length;
|
||||||
|
for (var i=0; i < l; ++i) {
|
||||||
|
setLocalTime(timers[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set the local time info for the timer
|
||||||
|
* @param timer Timer information
|
||||||
|
* @param timer.start Date of the timer
|
||||||
|
* @param timer.id Id number of the timer
|
||||||
|
*/
|
||||||
|
function setLocalTime(timer) {
|
||||||
|
document.getElementById("localtime" + timer.id).innerHTML = timer.start.format("ddd @ LT");
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateClock() {
|
||||||
|
document.getElementById("current-time").innerHTML = "<b>" + moment.utc().format('LLLL') + "</b>";
|
||||||
|
}
|
||||||
|
</script>
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -431,6 +431,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% include 'bundles/moment-js.html' with locale=True %}
|
{% include 'bundles/moment-js.html' with locale=True %}
|
||||||
|
<script src="{% static 'js/timers.js' %}"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var locale = "{{ LANGUAGE_CODE }}";
|
var locale = "{{ LANGUAGE_CODE }}";
|
||||||
|
|
||||||
@ -490,22 +491,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Get a duration string like countdown.js
|
|
||||||
* e.g. "1y 2d 3h 4m 5s"
|
|
||||||
* @param duration moment.duration
|
|
||||||
*/
|
|
||||||
function getDurationString(duration) {
|
|
||||||
var out = "";
|
|
||||||
if (duration.years()) {
|
|
||||||
out += duration.years() + 'y ';
|
|
||||||
}
|
|
||||||
if (duration.days()) {
|
|
||||||
out += duration.days() + 'd ';
|
|
||||||
}
|
|
||||||
return out + duration.hours() + "h " + duration.minutes() + "m " + duration.seconds() + "s";
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Set all local time fields
|
* Set all local time fields
|
||||||
*/
|
*/
|
||||||
|
Loading…
x
Reference in New Issue
Block a user