histomicsui 1.7.3.dev16__tar.gz → 1.7.3.dev38__tar.gz

{histomicsui-1.7.3.dev16/histomicsui.egg-info → histomicsui-1.7.3.dev38}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: histomicsui
-Version: 1.7.3.dev16
+Version: 1.7.3.dev38
 Summary: Organize, visualize, and analyze histology images.
 Home-page: https://github.com/DigitalSlideArchive/histomicsui
 Author: Kitware, Inc.

{histomicsui-1.7.3.dev16 → histomicsui-1.7.3.dev38}/histomicsui/web_client/dialogs/saveAnnotation.js

@@ -8,6 +8,8 @@ import AccessWidget from '@girder/core/views/widgets/AccessWidget';
 // import MetadataWidget from '@girder/core/views/widgets/MetadataWidget';
 import View from '@girder/core/views/View';
 
+import AnnotationHistoryBrowserContainer from '../vue/components/AnnotationHistoryBrowserContainer.vue';
+
 import MetadataWidget from '../panels/MetadataWidget';
 import '../stylesheets/dialogs/saveAnnotation.styl';
 import saveAnnotation from '../templates/dialogs/saveAnnotation.pug';
@@ -332,6 +334,23 @@ var SaveAnnotation = View.extend({
 
         this.$el.find('.modal-dialog').addClass('hui-save-annotation-dialog');
         this._updateFuncValues();
+
+        // Mount Vue component for annotation history if editing an existing annotation
+        const historyBrowserElement = this.$('.vue-component-annotation-history').get(0);
+        if (historyBrowserElement) {
+            const historyBrowser = new AnnotationHistoryBrowserContainer({
+                historyBrowserElement,
+                propsData: {
+                    annotationId: this.annotation.id,
+                    parentView: this,
+                    defaultGroup: this.options.defaultGroup || 'default'
+                }
+            });
+            historyBrowser.$mount();
+            historyBrowserElement.appendChild(historyBrowser.$el);
+            this.historyBrowser = historyBrowser;
+        }
+
         return this;
     },
 
@@ -425,6 +444,15 @@ var SaveAnnotation = View.extend({
         return setValue;
     },
 
+    onRevert() {
+        if (this.annotation) {
+            delete this.annotation._meta;
+            delete this.annotation._styleFuncs;
+        }
+        this.annotation.trigger('h:revert:annotation', this.annotation, {});
+        this.$el.modal('hide');
+    },
+
     /**
      * Respond to form submission.  Triggers a `g:save` event on the
      * AnnotationModel.

{histomicsui-1.7.3.dev16 → histomicsui-1.7.3.dev38}/histomicsui/web_client/panels/AnnotationSelector.js

@@ -57,6 +57,7 @@ var AnnotationSelector = Panel.extend({
         this.listenTo(eventStream, 'g:eventStream.start', this._refreshAnnotations);
         this.listenTo(eventStream, 'g:event.large_image_annotation.create', this._refreshAnnotations);
         this.listenTo(eventStream, 'g:event.large_image_annotation.remove', this._refreshAnnotations);
+        this.listenTo(this.collection, 'h:revert:annotation', this._refreshAnnotations);
         this.listenTo(this.collection, 'change:annotation change:groups', this._saveAnnotation);
         this.listenTo(girderEvents, 'g:login', () => {
             this.collection.reset();
@@ -238,8 +239,9 @@ var AnnotationSelector = Panel.extend({
     editAnnotationMetadata(evt) {
         const id = $(evt.currentTarget).parents('.h-annotation').data('id');
         const model = this.collection.get(id);
+        const defaultGroup = this.parentView._defaultGroup;
         this.listenToOnce(
-            showSaveAnnotationDialog(model, {title: 'Edit annotation', viewer: this.viewer}),
+            showSaveAnnotationDialog(model, {title: 'Edit annotation', viewer: this.viewer, defaultGroup}),
             'g:submit',
             () => {
                 if (model.get('displayed')) {

{histomicsui-1.7.3.dev16 → histomicsui-1.7.3.dev38}/histomicsui/web_client/templates/dialogs/saveAnnotation.pug

@@ -91,6 +91,7 @@ mixin functional(name, key, title, color)
               = ' '
               i.icon-angle-circled-down
               | Global Version: #{model.get('_version')}
+          .vue-component-annotation-history
           .hui-annotation-metadata.hui-annotation-metadata-dialog
         if showStyleEditor
           hr

histomicsui-1.7.3.dev38/histomicsui/web_client/vue/components/AnnotationHistoryBrowser.vue

@@ -0,0 +1,104 @@
+<script>
+import AnnotationHistoryGroup from './AnnotationHistoryGroup.vue';
+export default {
+    components: {
+        AnnotationHistoryGroup
+    },
+    props: ['annotationHistory', 'loading', 'userMap', 'defaultGroup'],
+    emits: ['revert'],
+    data() {
+        return {
+            collapsed: true
+        };
+    },
+    computed: {
+        annotationGroups() {
+            if (!this.annotationHistory.length) {
+                return [];
+            }
+            const annotationGroups = [];
+            let currentGroup = [this.annotationHistory[0]];
+            let lastTime = new Date(this.annotationHistory[0].updated);
+            this.annotationHistory.slice(1).forEach((annotation) => {
+                const updatedTime = new Date(annotation.updated);
+                const timeDiff = Math.abs(updatedTime - lastTime);
+                if (timeDiff >= 60 * 60 * 1000) {
+                    // Start a new group
+                    annotationGroups.push(currentGroup);
+                    currentGroup = [annotation];
+                } else {
+                    currentGroup.push(annotation);
+                }
+                lastTime = updatedTime;
+            });
+            annotationGroups.push(currentGroup);
+            return annotationGroups;
+        },
+        annotationHistoryEnabled() {
+            if (!this.annotationHistory || this.annotationHistory.length === 0) {
+                return undefined;
+            }
+            if (this.annotationHistory.length > 1) {
+                return true;
+            }
+            const firstVersion = this.annotationHistory[0];
+            return firstVersion.created === firstVersion.updated;
+        }
+    },
+    methods: {
+        handleRevert(version) {
+            this.$emit('revert', version);
+        }
+    }
+};
+</script>
+
+<template>
+  <div>
+    <div class="history-header">
+      <span
+        class="history-container-toggle"
+        @click="collapsed = !collapsed"
+      >
+        <i :class="collapsed ? 'icon-right-open' : 'icon-down-open'" />
+        Annotation Edit History
+      </span>
+    </div>
+    <div v-if="!collapsed">
+      <div v-if="!annotationHistoryEnabled">
+        <span>Ensure annotation history is turned on to track previous versions.</span>
+      </div>
+      <div v-else>
+        <div
+          class="history-body"
+        >
+          <div v-if="!annotationHistory || loading">
+            <i class="icon-spin4 animate-spin" />
+            Loading...
+          </div>
+          <div v-else>
+            <annotation-history-group
+              v-for="(group, index) in annotationGroups"
+              :key="index"
+              :history-group="group"
+              :user-id-map="userMap"
+              :allow-revert-initial="index !== 0"
+              :default-group="defaultGroup"
+              @revertToAnnotation="handleRevert"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.history-container-toggle:hover {
+  cursor: pointer;
+}
+
+.history-body {
+  margin-left: 20px;
+}
+</style>

histomicsui-1.7.3.dev38/histomicsui/web_client/vue/components/AnnotationHistoryBrowserContainer.vue

@@ -0,0 +1,162 @@
+<script>
+import _ from 'underscore';
+import Vue from 'vue';
+
+import UserModel from '@girder/core/models/UserModel';
+import {getCurrentUser} from '@girder/core/auth';
+import {restRequest} from '@girder/core/rest';
+
+import AnnotationHistoryBrowser from './AnnotationHistoryBrowser.vue';
+
+const Promise = require('bluebird');
+
+export default Vue.extend({
+    components: {
+        AnnotationHistoryBrowser
+    },
+    props: ['annotationId', 'parentView', 'defaultGroup'],
+    data() {
+        return {
+            annotationCopy: _.clone(this.annotation || {}),
+            history: null,
+            loading: false,
+            userIdToLogin: null,
+            waitingForRevert: false
+        };
+    },
+    mounted() {
+        this.positionShield();
+        this.updateAnnotationHistory();
+    },
+    methods: {
+        makeUserMap(shouldRefresh) {
+            this.loading = true;
+            const userMap = {};
+            // First, see if we can use the logged in user
+            const currentUser = getCurrentUser();
+            userMap[currentUser.id] = currentUser.get('login');
+            // Then, get all annotation editor IDs that aren't the logged in user
+            const userRequestPromises = [];
+            const uniqueUserIds = new Set([currentUser.id]);
+            this.history.forEach((annotation) => {
+                if (!uniqueUserIds.has(annotation.updatedId)) {
+                    uniqueUserIds.add(annotation.updatedId);
+                    const user = new UserModel();
+                    user.id = annotation.updatedId;
+                    userRequestPromises.push(user.fetch());
+                }
+            });
+            Promise.all(userRequestPromises).then((users) => {
+                users.forEach((user) => {
+                    userMap[user._id] = user.login;
+                });
+                this.userIdToLogin = userMap;
+                this.loading = false;
+                this.waitingForRevert = false;
+                if (shouldRefresh) {
+                    this.parentView.onRevert();
+                }
+                return true;
+            });
+        },
+        updateAnnotationHistory(shouldRefresh) {
+            if (!this.annotationId) {
+                return;
+            }
+            this.loading = true;
+            restRequest({
+                url: `annotation/${this.annotationId}/history`,
+                method: 'GET',
+                error: null
+            }).done((annotationHistory) => {
+                this.history = annotationHistory;
+                this.makeUserMap(shouldRefresh);
+            });
+        },
+        positionShield() {
+            const shield = this.$refs.shield;
+            if (shield && shield.parentNode !== document.body) {
+                document.body.appendChild(shield);
+            }
+        },
+        onRevert(version) {
+            this.loading = true;
+            // If an annotation takes > 1 second to be reverted, throw up a loading screen
+            setTimeout(() => {
+                if (this.loading) {
+                    this.waitingForRevert = true;
+                    this.$nextTick(() => {
+                        this.positionShield();
+                    });
+                }
+            }, 1000);
+            restRequest({
+                url: `annotation/${this.annotationId}/history/revert`,
+                method: 'PUT',
+                data: {version},
+                error: null
+            }).done(() => {
+                this.updateAnnotationHistory(true);
+            });
+        }
+    }
+});
+</script>
+
+<template>
+  <div>
+    <div
+      v-if="waitingForRevert"
+      ref="shield"
+      class="loading-shield"
+    >
+      <div class="shield-content">
+        <i class="icon-spin3 animate-spin" />
+        Reverting to previous version. This may some time...
+      </div>
+    </div>
+    <annotation-history-browser
+      :annotation-history="history"
+      :loading="loading"
+      :user-map="userIdToLogin"
+      :default-group="defaultGroup"
+      @revert="onRevert"
+    />
+  </div>
+</template>
+
+<style scoped>
+.loading-shield {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, 0.4);
+  z-index: 9999;
+  pointer-events: all;
+  cursor: wait;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  animation: fadeIn 0.3s ease-out;
+}
+.shield-content {
+  padding: 24px;
+  background-color: white;
+}
+.loading-shield > i, span {
+  font-size: 24px;
+  z-index: 9999;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+</style>

histomicsui-1.7.3.dev38/histomicsui/web_client/vue/components/AnnotationHistoryGroup.vue

@@ -0,0 +1,128 @@
+<script>
+import {formatDate, DATE_SECOND} from '@girder/core/misc';
+export default {
+    props: ['historyGroup', 'userIdMap', 'allowRevertInitial', 'defaultGroup'],
+    emits: ['revertToAnnotation'],
+    data() {
+        return {
+            collapsed: this.allowRevertInitial
+        };
+    },
+    computed: {
+        startingAnnotation() {
+            return this.historyGroup[0];
+        },
+        hiddenAnnotations() {
+            return this.historyGroup.slice(1);
+        },
+        iconClass() {
+            const classes = ['hidden-version-toggle'];
+            if (this.collapsed) {
+                classes.push('icon-right-open');
+            } else {
+                classes.push('icon-down-open');
+            }
+            if (!this.hiddenAnnotations.length) {
+                classes.push('display-none');
+            }
+            return classes;
+        }
+    },
+    methods: {
+        displayDate(dateString) {
+            return formatDate(dateString, DATE_SECOND);
+        },
+        displayGroups(annotationVersion) {
+            return annotationVersion.groups.map((group) => (
+                group === null ? this.defaultGroup : group
+            )).join(', ');
+        },
+        getUser(userId) {
+            return (this.userIdMap && this.userIdMap[userId]) ? this.userIdMap[userId] : userId;
+        }
+    }
+};
+</script>
+
+<template>
+  <div>
+    <span class="history-group-header attribute-block">
+      <i
+        v-if="hiddenAnnotations.length"
+        :class="iconClass"
+        @click="collapsed = !collapsed"
+      />
+      <span
+        v-else
+        class="hidden-version-toggle"
+      />
+      <span class="attribute-display">Edited: {{ displayDate(startingAnnotation.updated) }}</span>
+      <span class="attribute-display">Author: {{ getUser(startingAnnotation.updatedId) }}</span>
+      <span class="attribute-display">Version: {{ startingAnnotation._version }}</span>
+      <span
+        class="attribute-display"
+        :title="displayGroups(startingAnnotation)"
+      >
+        Groups: {{ displayGroups(startingAnnotation) }}
+      </span>
+      <i
+        v-if="allowRevertInitial"
+        class="revert-button icon-ccw"
+        @click="$emit('revertToAnnotation', startingAnnotation._version)"
+      />
+    </span>
+    <div
+      v-if="!collapsed && hiddenAnnotations.length"
+      class="hidden-version-container"
+    >
+      <div
+        v-for="entry in hiddenAnnotations"
+        :key="entry._version"
+        class="hidden-version-entry attribute-block"
+      >
+        <span class="hidden-version-toggle" />
+        <span class="attribute-display">Edited: {{ displayDate(entry.updated) }}</span>
+        <span class="attribute-display">Author: {{ getUser(entry.updatedId) }}</span>
+        <span class="attribute-display">Version: {{ entry._version }}</span>
+        <span
+          class="attribute-display"
+          :title="displayGroups(startingAnnotation)"
+        >
+          Groups: {{ displayGroups(entry) }}
+        </span>
+        <i
+          class="revert-button icon-ccw"
+          @click="$emit('revertToAnnotation', entry._version)"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.hidden-version-toggle {
+  display: inline-block;
+  min-width: 20px;
+}
+.hidden-version-toggle:hover {
+  cursor: pointer;
+}
+.revert-button:hover {
+  cursor:pointer;
+}
+.attribute-block > span, i {
+  max-width: 250px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipses;
+}
+.attribute-block {
+  display: flex;
+}
+.attribute-block > span {
+  padding-right: 8px;
+}
+.display-none {
+  display: none;
+}
+</style>

{histomicsui-1.7.3.dev16 → histomicsui-1.7.3.dev38/histomicsui.egg-info}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: histomicsui
-Version: 1.7.3.dev16
+Version: 1.7.3.dev38
 Summary: Organize, visualize, and analyze histology images.
 Home-page: https://github.com/DigitalSlideArchive/histomicsui
 Author: Kitware, Inc.

{histomicsui-1.7.3.dev16 → histomicsui-1.7.3.dev38}/histomicsui.egg-info/SOURCES.txt

@@ -151,6 +151,9 @@ histomicsui/web_client/views/popover/AnnotationContextMenu.js
 histomicsui/web_client/views/popover/AnnotationPopover.js
 histomicsui/web_client/views/popover/PixelmapContextMenu.js
 histomicsui/web_client/views/popover/index.js
+histomicsui/web_client/vue/components/AnnotationHistoryBrowser.vue
+histomicsui/web_client/vue/components/AnnotationHistoryBrowserContainer.vue
+histomicsui/web_client/vue/components/AnnotationHistoryGroup.vue
 histomicsui/web_client/vue/components/ColorPickerInput.vue
 histomicsui/web_client/vue/components/EditHeatmapOrGridData.vue
 histomicsui/web_client/vue/components/EditHeatmapOrGridDataContainer.vue