re-usable component for viewer dropdown

jdaviz/app.py

@@ -77,6 +77,10 @@
                                     os.path.join(os.path.dirname(__file__),
                                                  'components/plugin_subset_select.vue'))
 
+ipyvue.register_component_from_file(None, 'plugin-viewer-select',
+                                    os.path.join(os.path.dirname(__file__),
+                                                 'components/plugin_viewer_select.vue'))
+
 # Register pure vue component. This allows us to do recursive component instantiation only in the
 # vue component file
 ipyvue.register_component_from_file('g-viewer-tab', "container.vue", __file__)

jdaviz/components/plugin_viewer_select.vue

@@ -0,0 +1,46 @@
+<template>
+  <div>
+  <v-row v-if="items.length > 1">
+    <v-select
+      :items="items"
+      v-model="selected"
+      @change="$emit('update:selected', $event)"
+      :label="label ? label : 'Viewer'"
+      :hint="hint ? hint : 'Select viewer.'"
+      :rules="rules ? rules : []"
+      item-text="ref_or_id"
+      item-value="ref_or_id"
+      persistent-hint
+    >
+    <template slot="selection" slot-scope="data">
+      <div class="single-line">
+        <span>
+          {{ data.item.ref_or_id }}
+        </span>
+      </div>
+    </template>
+    <template slot="item" slot-scope="data">
+      <div class="single-line">
+        <span>
+          {{ data.item.ref_or_id }}
+        </span>
+      </div>
+    </template>
+    </v-select>
+  </v-row>
+  </div>
+</template>
+
+<script>
+module.exports = {
+  props: ['items', 'selected', 'label', 'hint', 'rules']
+};
+</script>
+
+<style>
+  .single-line {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+  }
+</style>

jdaviz/configs/default/plugins/export_plot/export_plot.py

@@ -1,41 +1,22 @@
-from traitlets import List, Unicode
-
-from jdaviz.core.events import (ViewerAddedMessage, ViewerRemovedMessage)
 from jdaviz.core.registries import tray_registry
-from jdaviz.core.template_mixin import TemplateMixin
+from jdaviz.core.template_mixin import TemplateMixin, ViewerSelectMixin
 
 __all__ = ['ExportViewer']
 
 
 @tray_registry('g-export-plot', label="Export Plot")
-class ExportViewer(TemplateMixin):
+class ExportViewer(TemplateMixin, ViewerSelectMixin):
     template_file = __file__, "export_plot.vue"
-    viewer_items = List([]).tag(sync=True)
-    selected_viewer = Unicode("").tag(sync=True)
 
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
 
-        self.hub.subscribe(self, ViewerAddedMessage,
-                           handler=lambda _: self._on_viewers_changed())
-        self.hub.subscribe(self, ViewerRemovedMessage,
-                           handler=lambda _: self._on_viewers_changed())
-
-        # initialize viewer_items from original viewers
-        self._on_viewers_changed()
-
-    def _on_viewers_changed(self):
-        self.viewer_items = self.app.get_viewer_ids()
-        if self.selected_viewer not in self.viewer_items:
-            # default to first entry, will trigger _on_viewer_select to set layer defaults
-            self.selected_viewer = self.viewer_items[0] if len(self.viewer_items) else ""
-
     def vue_save_figure(self, filetype):
         """
         Callback for save figure events in the front end viewer toolbars. Uses
         the bqplot.Figure save methods.
         """
-        viewer = self.app.get_viewer_by_id(self.selected_viewer)
+        viewer = self.viewer.selected_obj
         if filetype == "png":
             viewer.figure.save_png()
         elif filetype == "svg":

jdaviz/configs/default/plugins/export_plot/export_plot.vue

@@ -4,17 +4,14 @@
       <j-docs-link :link="'https://jdaviz.readthedocs.io/en/'+vdocs+'/'+config+'/plugins.html#export-plot'">Export viewer plot as an image.</j-docs-link>
     </v-row>
 
-    <v-row v-if="viewer_items.length > 1">
-      <v-select
-        :items="viewer_items"
-        v-model="selected_viewer"
-        label="Viewer"
-        hint="Select the viewer to export."
-        persistent-hint
-      ></v-select>
-    </v-row>
+    <plugin-viewer-select
+      :items="viewer_items"
+      :selected.sync="viewer_selected"
+      label="Viewer"
+      hint="Select the viewer to export."
+    />
 
-    <div v-if="selected_viewer">
+    <div v-if="viewer_selected">
       <v-list>
        <v-list-item>
         <v-btn

jdaviz/configs/default/plugins/plot_options/plot_options.py

@@ -1,19 +1,16 @@
-from traitlets import Any, List, Unicode, observe, Bool
+from traitlets import Any, observe, Bool
 from ipywidgets.widgets import widget_serialization
 
-from jdaviz.core.events import (ViewerAddedMessage, ViewerRemovedMessage,
-                                AddDataMessage, RemoveDataMessage)
+from jdaviz.core.events import AddDataMessage, RemoveDataMessage
 from jdaviz.core.registries import tray_registry
-from jdaviz.core.template_mixin import TemplateMixin
+from jdaviz.core.template_mixin import TemplateMixin, ViewerSelectMixin
 
 __all__ = ['PlotOptions']
 
 
 @tray_registry('g-plot-options', label="Plot Options")
-class PlotOptions(TemplateMixin):
+class PlotOptions(TemplateMixin, ViewerSelectMixin):
     template_file = __file__, "plot_options.vue"
-    viewer_items = List([]).tag(sync=True)
-    selected_viewer = Unicode("").tag(sync=True)
 
     viewer_widget = Any().tag(sync=True, **widget_serialization)
     layer_widget = Any().tag(sync=True, **widget_serialization)
@@ -23,36 +20,25 @@ class PlotOptions(TemplateMixin):
 
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
+        # populate the initial widgets
+        self._viewer_selected_changed()
 
-        self.hub.subscribe(self, ViewerAddedMessage,
-                           handler=lambda _: self._on_viewers_changed())
-        self.hub.subscribe(self, ViewerRemovedMessage,
-                           handler=lambda _: self._on_viewers_changed())
         self.hub.subscribe(self, AddDataMessage,
                            handler=lambda _: self._on_data_changed())
         self.hub.subscribe(self, RemoveDataMessage,
                            handler=lambda _: self._on_data_changed())
 
-        # initialize viewer_items from original viewers
-        self._on_viewers_changed()
-
-    def _on_viewers_changed(self):
-        self.viewer_items = self.app.get_viewer_ids()
-        if self.selected_viewer not in self.viewer_items:
-            # default to first entry, will trigger _on_viewer_select to set layer defaults
-            self.selected_viewer = self.viewer_items[0] if len(self.viewer_items) else ""
-
-    def _on_select_viewer_message(self, msg):
-        # message from elsewhere requesting to change the selected viewer
-        self.selected_viewer = msg.viewer
-
     def _on_data_changed(self):
         # Make sure new data has it's uncertainty plotted
         self._toggle_uncertainty(None)
 
-    @observe("selected_viewer")
-    def _selected_viewer_changed(self, event={}):
-        viewer = self.app.get_viewer_by_id(event.get('new', self.selected_viewer))
+    @observe("viewer_selected")
+    def _viewer_selected_changed(self, event={}):
+        if not hasattr(self, 'viewer'):
+            # mixin object not yet initialized
+            return
+
+        viewer = self.viewer.selected_obj
         self.viewer_widget = viewer.viewer_options
         self.layer_widget = viewer.layer_options
 

jdaviz/configs/default/plugins/plot_options/plot_options.vue

@@ -4,20 +4,17 @@
       <j-docs-link :link="'https://jdaviz.readthedocs.io/en/'+vdocs+'/'+config+'/plugins.html#plot-options'">Viewer and data/layer options.</j-docs-link>
     </v-row>
 
-    <v-row v-if="viewer_items.length > 1">
-      <v-select
-        :items="viewer_items"
-        v-model="selected_viewer"
-        label="Viewer"
-        hint="Select the viewer to set options."
-        persistent-hint
-      ></v-select>
-    </v-row>
+    <plugin-viewer-select
+      :items="viewer_items"
+      :selected.sync="viewer_selected"
+      label="Viewer"
+      hint="Select the viewer to set options."
+    />
 
-    <div v-if="selected_viewer">
+    <div v-if="viewer_selected">
       <j-plugin-section-header>Viewer Options</j-plugin-section-header>
       <v-row class="row-no-outside-padding">
-        <jupyter-widget v-if="selected_viewer" :widget="viewer_widget"></jupyter-widget>
+        <jupyter-widget v-if="viewer_selected" :widget="viewer_widget"></jupyter-widget>
       </v-row>
 
       <v-row v-if="['specviz', 'mosviz', 'specviz2d', 'cubeviz'].indexOf(config)!==-1">
@@ -31,7 +28,7 @@
 
       <j-plugin-section-header>Layer Options</j-plugin-section-header>      
       <v-row class="row-no-outside-padding">
-        <jupyter-widget v-if="selected_viewer" :widget="layer_widget"></jupyter-widget>
+        <jupyter-widget v-if="viewer_selected" :widget="layer_widget"></jupyter-widget>
       </v-row>
     </div>
 

jdaviz/configs/imviz/plugins/compass/compass.py

@@ -1,48 +1,38 @@
-from traitlets import Unicode, List, observe
+from traitlets import Unicode, observe
 
-from jdaviz.core.events import (ViewerAddedMessage, ViewerRemovedMessage,
-                                AddDataMessage, RemoveDataMessage)
+from jdaviz.core.events import AddDataMessage, RemoveDataMessage
 from jdaviz.core.registries import tray_registry
-from jdaviz.core.template_mixin import PluginTemplateMixin
+from jdaviz.core.template_mixin import PluginTemplateMixin, ViewerSelectMixin
 
 __all__ = ['Compass']
 
 
 @tray_registry('imviz-compass', label="Imviz Compass")
-class Compass(PluginTemplateMixin):
+class Compass(PluginTemplateMixin, ViewerSelectMixin):
     template_file = __file__, "compass.vue"
-    viewer_items = List([]).tag(sync=True)
-    selected_viewer = Unicode("").tag(sync=True)
     data_label = Unicode("").tag(sync=True)
     img_data = Unicode("").tag(sync=True)
 
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
 
-        self.hub.subscribe(self, ViewerAddedMessage, handler=self._on_viewers_changed)
-        self.hub.subscribe(self, ViewerRemovedMessage, handler=self._on_viewers_changed)
         self.hub.subscribe(self, AddDataMessage, handler=self._on_viewer_data_changed)
         self.hub.subscribe(self, RemoveDataMessage, handler=self._on_viewer_data_changed)
 
-        self._on_viewers_changed()  # Populate it on start-up
-
-    def _on_viewers_changed(self, msg=None):
-        self.viewer_items = self.app.get_viewer_ids()
-
-        # Selected viewer was removed but Imviz always has a default viewer to fall back on.
-        if self.selected_viewer not in self.viewer_items:
-            self.selected_viewer = f'{self.app.config}-0'
-
     def _on_viewer_data_changed(self, msg=None):
-        if self.selected_viewer:
-            viewer = self.app.get_viewer_by_id(self.selected_viewer)
+        if self.viewer_selected:
+            viewer = self.viewer.selected_obj
             viewer.on_limits_change()  # Force redraw
 
-    @observe("selected_viewer", "plugin_opened")
+    @observe("viewer_selected", "plugin_opened")
     def _compass_with_new_viewer(self, *args, **kwargs):
+        if not hasattr(self, 'viewer'):
+            # mixin object not yet initialized
+            return
+
         # There can be only one!
         for vid, viewer in self.app._viewer_store.items():
-            if vid == self.selected_viewer and self.plugin_opened:
+            if vid == self.viewer.selected_id and self.plugin_opened:
                 viewer.compass = self
                 viewer.on_limits_change()  # Force redraw
             else:

jdaviz/configs/imviz/plugins/compass/compass.vue

@@ -6,15 +6,12 @@
       </j-docs-link>
     </v-row>
 
-    <v-row>
-      <v-select
-        :items="viewer_items"
-        v-model="selected_viewer"
-        label="Viewer"
-        hint="Select a viewer to show."
-        persistent-hint
-      ></v-select>
-    </v-row>
+    <plugin-viewer-select
+      :items="viewer_items"
+      :selected.sync="viewer_selected"
+      label="Viewer"
+      hint="Select a viewer to show."
+    />
 
     <v-row v-if="data_label">
       <v-chip