diff --git a/app/apps/core/static/js/edit/components/base_panel.js b/app/apps/core/static/js/edit/components/base_panel.js index 8f2c881ae29f14b5d405eb4545b4135b250023e3..5aca4f5b68469f3a9dfbf532822b0e8b271281c4 100644 --- a/app/apps/core/static/js/edit/components/base_panel.js +++ b/app/apps/core/static/js/edit/components/base_panel.js @@ -5,8 +5,10 @@ const BasePanel = Vue.extend({ ratio: 1 }; }, - updated() { - if (this.part.loaded) this.refresh(); + watch: { + 'ratio': function(n, o) { + if (this.part.loaded) this.refresh(); + } }, methods: { setRatio() { diff --git a/app/apps/core/static/js/edit/components/seg_panel.js b/app/apps/core/static/js/edit/components/seg_panel.js index ffda97941e616f00c8f424fe0d4814cef18b194d..a24f05c3aa4169633952e3165b76ceefc77dd005 100644 --- a/app/apps/core/static/js/edit/components/seg_panel.js +++ b/app/apps/core/static/js/edit/components/seg_panel.js @@ -116,6 +116,7 @@ const SegPanel = BasePanel.extend({ }, imageSrc() { // empty the src to make sure the complete event gets fired + // this.$img.src = ''; if (!this.part.loaded) return ''; // overrides imageSrc to deal with color modes // Note: vue.js doesn't have super call wtf we need to copy the code :( @@ -144,6 +145,12 @@ const SegPanel = BasePanel.extend({ this.refreshHistoryBtns(); } }, + 'colorMode': function(n, o) { + this.$parent.prefetchImage(this.imageSrc, function(src) { + this.$img.src = src; + this.refreshSegmenter(); + }.bind(this)); + }, 'fullsizeimage': function(n, o) { // it was prefetched if (n && n != o) { @@ -194,7 +201,6 @@ const SegPanel = BasePanel.extend({ updateView() { this.segmenter.refresh(); }, - // undo manager helpers bulkCreate(data, createInEditor=false) { if (data.regions && data.regions.length) { diff --git a/app/apps/core/static/js/edit/components/visu_panel.js b/app/apps/core/static/js/edit/components/visu_panel.js index e15d2f98c4d55569ce62eb3f782b2a13f7d0580f..01871e6719239515791d61e1cceceb544bfaecc5 100644 --- a/app/apps/core/static/js/edit/components/visu_panel.js +++ b/app/apps/core/static/js/edit/components/visu_panel.js @@ -14,6 +14,7 @@ const VisuPanel = BasePanel.extend({ Vue.nextTick(function() { this.$parent.zoom.register(this.$el.querySelector('#visu-zoom-container'), {map: true}); + this.refresh(); }.bind(this)); }, methods: { diff --git a/app/apps/core/static/js/edit/main.js b/app/apps/core/static/js/edit/main.js index a622f284c2bc0add445c6e4a987822dddecec6ff..c416f6f3fec925f8c935894d25f598792e98efdc 100644 --- a/app/apps/core/static/js/edit/main.js +++ b/app/apps/core/static/js/edit/main.js @@ -190,6 +190,7 @@ var partVM = new Vue({ let img = new Image(); img.addEventListener('load', function() { if (callback) callback(src); + img.remove(); }.bind(this)); img.src = src; }, diff --git a/app/escriptorium/templates/core/document_part_edit.html b/app/escriptorium/templates/core/document_part_edit.html index 7ec68a169b76ca2eba990f81d0a4f62c76f945f9..f4aa6b5e57030fe228d5a46702b2a6f6b1ea42f8 100644 --- a/app/escriptorium/templates/core/document_part_edit.html +++ b/app/escriptorium/templates/core/document_part_edit.html @@ -316,7 +316,7 @@ v-bind:key="'sL' + line.pk"/> </div> - <img class="panel-img" v-bind:src="imageSrc"/> + <img class="panel-img"/> {# TODO: make line overlay component #} <div id="segmentation-overlay" class="overlay panel-overlay"> <svg width="100%" height="100%"> diff --git a/app/requirements.txt b/app/requirements.txt index 5cd44be78bec167e6f8dc3210847b6cd63ce7ddc..e9465ea01b6ef9c009bf939f79f0b7d31b8ed8a7 100644 --- a/app/requirements.txt +++ b/app/requirements.txt @@ -12,7 +12,7 @@ django-redis==4.10.0 psycopg2-binary==2.7.6 django-ordered-model==3.1.1 easy-thumbnails==2.5 -git+https://github.com/mittagessen/kraken.git@3.0b14#egg=kraken +git+https://github.com/mittagessen/kraken.git@3.0b15#egg=kraken django-cleanup==3.0.1 djangorestframework==3.9.2 drf-nested-routers==0.91