From b83dede220df00e7776336e8ec8761d205d1ff98 Mon Sep 17 00:00:00 2001 From: courtneycb Date: Wed, 22 Apr 2020 13:09:46 +1200 Subject: [PATCH 1/3] Remove use of jquery to load image. --- .../pixel-viewer/js/pixel-viewer.js | 23 ++++++++++++------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js index 1a6f7b0a73..fc4aa62891 100644 --- a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js +++ b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js @@ -60,7 +60,8 @@ $( document ).ready(function() { var image_filename = 'coloured-roof-small.png'; } var image_filepath = image_base_path + image_filename; - $('#pixel-viewer-interactive-original-image').attr('src', image_filepath); + // $('#pixel-viewer-interactive-original-image').attr('src', image_filepath); + document.getElementById('pixel-viewer-interactive-original-image').setAttribute('src', image_filepath); load_resize_image(image_filepath, false); if (getUrlParameter('mode') == 'threshold') { @@ -827,13 +828,19 @@ function createPicturePicker(){ main_div.append($("

").text(gettext("Or choose from the following supplied images:"))); for (var i = 0; i < images.length; i++){ var img_url = image_base_path + images[i] - main_div.append( - $("") - .attr('crossorigin', 'anonymous') - .attr('src', img_url) - .attr('class', 'img-pick') - .click(function(){load_resize_image(this.src, false);}) - ); + img = document.createElement("IMG"); + img.setAttribute('crossorigin', 'anonymous') + img.setAttribute('src', img_url) + img.setAttribute('class', 'img-pick') + img.onclick = function(){load_resize_image(this.src, false);} + main_div.append(img); + // main_div.append( + // $("") + // .attr('crossorigin', 'anonymous') + // .attr('src', img_url) + // .attr('class', 'img-pick') + // .click(function(){load_resize_image(this.src, false);}) + // ); } } From bf4a5026de80c96468edacc6a65c401f55103973 Mon Sep 17 00:00:00 2001 From: courtneycb Date: Wed, 22 Apr 2020 14:14:19 +1200 Subject: [PATCH 2/3] Remove old code. --- .../static/interactives/pixel-viewer/js/pixel-viewer.js | 8 -------- 1 file changed, 8 deletions(-) diff --git a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js index fc4aa62891..e87262488f 100644 --- a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js +++ b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js @@ -60,7 +60,6 @@ $( document ).ready(function() { var image_filename = 'coloured-roof-small.png'; } var image_filepath = image_base_path + image_filename; - // $('#pixel-viewer-interactive-original-image').attr('src', image_filepath); document.getElementById('pixel-viewer-interactive-original-image').setAttribute('src', image_filepath); load_resize_image(image_filepath, false); @@ -834,13 +833,6 @@ function createPicturePicker(){ img.setAttribute('class', 'img-pick') img.onclick = function(){load_resize_image(this.src, false);} main_div.append(img); - // main_div.append( - // $("") - // .attr('crossorigin', 'anonymous') - // .attr('src', img_url) - // .attr('class', 'img-pick') - // .click(function(){load_resize_image(this.src, false);}) - // ); } } From 1a2fb81ec0a9eb4f98c9e4d0c35056a2cfd3838d Mon Sep 17 00:00:00 2001 From: courtneycb Date: Wed, 22 Apr 2020 15:46:32 +1200 Subject: [PATCH 3/3] Set crossorigin on default image. --- .../interactives/pixel-viewer/js/pixel-viewer.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js index e87262488f..90ce6b65d2 100644 --- a/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js +++ b/csfieldguide/static/interactives/pixel-viewer/js/pixel-viewer.js @@ -60,7 +60,7 @@ $( document ).ready(function() { var image_filename = 'coloured-roof-small.png'; } var image_filepath = image_base_path + image_filename; - document.getElementById('pixel-viewer-interactive-original-image').setAttribute('src', image_filepath); + $('#pixel-viewer-interactive-original-image').attr('crossorigin', 'anonymous').attr('src', image_filepath); load_resize_image(image_filepath, false); if (getUrlParameter('mode') == 'threshold') { @@ -827,12 +827,13 @@ function createPicturePicker(){ main_div.append($("

").text(gettext("Or choose from the following supplied images:"))); for (var i = 0; i < images.length; i++){ var img_url = image_base_path + images[i] - img = document.createElement("IMG"); - img.setAttribute('crossorigin', 'anonymous') - img.setAttribute('src', img_url) - img.setAttribute('class', 'img-pick') - img.onclick = function(){load_resize_image(this.src, false);} - main_div.append(img); + main_div.append( + $("") + .attr('crossorigin', 'anonymous') + .attr('src', img_url) + .attr('class', 'img-pick') + .click(function(){load_resize_image(this.src, false);}) + ); } }