Commit 1401e4c3 authored by Jerome Chauveau's avatar Jerome Chauveau
Browse files

gestion from scratch du fullscreen osd

parent 7bc1dd29

src/components/JamaCollectionSeadragon.vue

+26 −11
Original line number Diff line number Diff line
@@ -2,10 +2,16 @@ 
  <v-container class="mr-0 pr-0 ml-0 pl-0 jama-collection-seadragon-wrap flex-grow-1 d-flex">

    <div class="osd-toolbar d-flex justify-space-between" id="osd-toolbar">

      <div class="d-flex">

        <v-btn small text :elevation="0" id="osd-previous" class="rounded-0"><v-icon>mdi-menu-left</v-icon></v-btn>

        <v-btn small text :elevation="0" id="osd-next" class="rounded-0" ><v-icon>mdi-menu-right</v-icon></v-btn>

        <v-btn small text :elevation="0" id="osd-previous" class="rounded-0" @click="previousResource()">

          <v-icon>mdi-menu-left</v-icon>

        </v-btn>

        <v-btn small text :elevation="0" id="osd-next" class="rounded-0" @click="nextResource()">

          <v-icon>mdi-menu-right</v-icon>

        </v-btn>

      </div>

      <v-btn small text :elevation="0" id="osd-full-page"  class="rounded-0"><v-icon>mdi-fullscreen</v-icon></v-btn>

      <v-btn small text :elevation="0" id="osd-full-page"  class="rounded-0" @click="toggleFullscreen()">

        <v-icon>mdi-fullscreen</v-icon>

      </v-btn>

    </div>

    <div class="ma-0 pa-0 collection-seadragon flex-grow-1" @keyup.right="nextResource()"

                 @keyup.left="previousResource()"
@@ -43,6 +49,7 @@ export default { 
  data(){

    return {

      viewer : null,

      fullscreen: false,

    }

  },
@@ -54,12 +61,14 @@ export default { 
    let tiledSources = this.resources.map(r => r.urls.iiif);

    this.viewer = OpenSeadragon({

      id: "collection-seadragon-" + this.collection.id,

      toolbar:        "osd-toolbar",

      // toolbar:        "osd-toolbar",

      showZoomControl: false,

      showHomeControl: false,

      fullPageButton: "osd-full-page",

      nextButton:     "osd-next",

      previousButton: "osd-previous",

      showNavigationControl: false,

      showSequenceControl: false,

      // fullPageButton: "osd-full-page",

      // nextButton:     "osd-next",

      // previousButton: "osd-previous",

      tileSources: tiledSources,

      preserveViewport: true,

      // controlsFadeDelay : 1,
@@ -68,9 +77,9 @@ export default { 
      maxZoomLevel : 12,

      showReferenceStrip : true,

      referenceStripScroll: 'vertical',

      navigationControlAnchor: OpenSeadragon.ControlAnchor.TOP_RIGHT,

      //navigationControlAnchor: OpenSeadragon.ControlAnchor.TOP_RIGHT,

    });



    //this.viewer.setControlsEnabled(false);

    this.viewer.goToPage(this.defaultResourceIndex);



    this.viewer.addHandler('page', (evt) => {
@@ -99,7 +108,13 @@ export default { 
  },



  methods : {



    toggleFullscreen(){

      this.fullscreen = !this.fullscreen;

      if(this.fullscreen)

        document.querySelector(".jama-collection-seadragon-wrap").requestFullscreen();

      else

        document.exitFullscreen()

    },

    updateViewerImages(){

      let tiledSources = this.resources.map(r => r.urls.iiif);

      this.viewer.open(tiledSources);