From d85e0b96dca88a770e5e0082249cdcd2a2b7828a Mon Sep 17 00:00:00 2001
From: Jonathan Rehm <jonathan@rehm.me>
Date: Sat, 22 Jul 2017 11:11:14 -0700
Subject: [PATCH] Prevent jQuery from cache busting static assets
If the HTML that's returned from the `$.get` request contains a `<script src="..."/>` tag it loads the JavaScript file via ajax, and by default it attaches a timestamp to it to bust cache. That means the file loads every time the modal is opened, and the browser treats it as a new file each time. The result is that code fires multiple times and events listeners are added multiple times.
---
cps/static/js/main.js | 30 ++++++++++++++++++++++--------
1 file changed, 22 insertions(+), 8 deletions(-)
diff --git a/cps/static/js/main.js b/cps/static/js/main.js
index 04b00712..d2cd99da 100644
--- a/cps/static/js/main.js
+++ b/cps/static/js/main.js
@@ -4,6 +4,11 @@ var updateText;
$(function() {
+ // Allow ajax prefilters to be added/removed dynamically
+ // eslint-disable-next-line new-cap
+ const preFilters = $.Callbacks();
+ $.ajaxPrefilter(preFilters.fire);
+
function restartTimer() {
$("#spinner").addClass("hidden");
$("#RestartDialog").modal("hide");
@@ -122,15 +127,24 @@ $(function() {
});
$("#bookDetailsModal")
- .on("show.bs.modal", function(e) {
- var $modalBody = $(this).find(".modal-body");
- $.get(e.relatedTarget.href).done(function(content) {
- $modalBody.html(content);
+ .on("show.bs.modal", function(e) {
+ const $modalBody = $(this).find(".modal-body");
+
+ // Prevent static assets from loading multiple times
+ const useCache = (options) => {
+ options.async = true;
+ options.cache = true;
+ };
+ preFilters.add(useCache);
+
+ $.get(e.relatedTarget.href).done(function(content) {
+ $modalBody.html(content);
+ preFilters.remove(useCache);
+ });
+ })
+ .on("hidden.bs.modal", function() {
+ $(this).find(".modal-body").html("...");
});
- })
- .on("hidden.bs.modal", function() {
- $(this).find(".modal-body").html("...");
- });
$(window).resize(function(event) {
$(".discover .row").isotope("reLayout");