Add setAjaxHeaders method to Viewer and TiledImage

- First draft, not tested at all
- See openseadragon/openseadragon#1748

src/tiledimage.js

@@ -147,6 +147,9 @@ $.TiledImage = function( options ) {
     var degrees = options.degrees || 0;
     delete options.degrees;
 
+    var ajaxHeaders = options.ajaxHeaders;
+    delete options.ajaxHeaders;
+
     $.extend( true, this, {
 
         //internal state properties
@@ -238,6 +241,9 @@ $.TiledImage = function( options ) {
             tiledImage: _this
         }, args));
     };
+
+    this._ownAjaxHeaders = {};
+    this.setAjaxHeaders(ajaxHeaders, false);
 };
 
 $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.TiledImage.prototype */{
@@ -1003,6 +1009,57 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
         });
     },
 
+    /**
+     * TODO
+     */
+    setAjaxHeaders: function(ajaxHeaders, propagate){
+
+        // use same headers if provided 'ajaxHeaders' is invalid (useful for propagation)
+        if ($.isPlainObject(ajaxHeaders)) {
+            this._ownAjaxHeaders = ajaxHeaders;
+        } else {
+            ajaxHeaders = this._ownAjaxHeaders;
+        }
+
+        // merge with viewer's headers
+        if ($.isPlainObject(this.viewer.ajaxHeaders)) {
+            this.ajaxHeaders = $.extend({}, this.viewer.ajaxHeaders, ajaxHeaders);
+        } else {
+            this.ajaxHeaders = ajaxHeaders;
+        }
+
+        // propagate header updates to all tiles and queued imageloader jobs
+        if (propagate) {
+
+            for (const [level, levelTiles] of Object.entries(this.tilesMatrix)) {
+                const numTiles = this.source.getNumTiles(level);
+
+                for (const [x, rowTiles] of Object.entries(levelTiles)) {
+                    const xMod = ( numTiles.x + ( x % numTiles.x ) ) % numTiles.x;
+
+                    for (const [y, tile] of Object.entries(rowTiles)) {
+                        const yMod = ( numTiles.y + ( y % numTiles.y ) ) % numTiles.y;
+
+                        tile.loadWithAjax = this.loadTilesWithAjax;
+                        if (tile.loadWithAjax) {
+                            const tileAjaxHeaders = this.source.getTileAjaxHeaders( level, xMod, yMod );
+                            tile.ajaxHeaders = $.extend({}, this.ajaxHeaders, tileAjaxHeaders);
+                        } else {
+                            tile.ajaxHeaders = null;
+                        }
+                    }
+                }
+            }
+
+            // TODO: good enough? running jobs are not stored anywhere
+            //       maybe look through this._imageLoader.failedTiles and restart jobs? but which ones?
+            for (const job of this._imageLoader.jobQueue) {
+                job.loadWithAjax = job.tile.loadWithAjax;
+                job.ajaxHeaders = job.tile.loadWithAjax ? job.tile.ajaxHeaders : null;
+            }
+        }
+    },
+
     // private
     _setScale: function(scale, immediately) {
         var sameTarget = (this._scaleSpring.target.value === scale);

src/viewer.js

@@ -978,6 +978,21 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
         this.forceRedraw();
     },
 
+    /**
+     * TODO
+     */
+    setAjaxHeaders: function(ajaxHeaders, propagate){
+        if ($.isPlainObject(ajaxHeaders)) {
+            this.ajaxHeaders = ajaxHeaders;
+        }
+
+        if (propagate) {
+            for (var i = 0; i < this.world.getItemCount(); i++) {
+                this.world.getItemAt(i).setAjaxHeaders(null, propagate);
+            }
+        }
+    },
+
     /**
      * Adds the given button to this viewer.
      *
@@ -1401,7 +1416,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
      * @param {Object} [options.ajaxHeaders]
      *      A set of headers to include when making tile AJAX requests.
      *      Note that these headers will be merged over any headers specified in {@link OpenSeadragon.Options}.
-     *      Specifying a falsy value for a header will clear its existing value set at the Viewer level (if any).
+     *      Is this outdated? -> Specifying a falsy value for a header will clear its existing value set at the Viewer level (if any).
      * requests.
      * @param {Function} [options.success] A function that gets called when the image is
      * successfully added. It's passed the event object which contains a single property:
@@ -1450,10 +1465,8 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
         if (options.loadTilesWithAjax === undefined) {
             options.loadTilesWithAjax = this.loadTilesWithAjax;
         }
-        if (options.ajaxHeaders === undefined || options.ajaxHeaders === null) {
-            options.ajaxHeaders = this.ajaxHeaders;
-        } else if ($.isPlainObject(options.ajaxHeaders) && $.isPlainObject(this.ajaxHeaders)) {
-            options.ajaxHeaders = $.extend({}, this.ajaxHeaders, options.ajaxHeaders);
+        if (!$.isPlainObject(options.ajaxHeaders)) {
+            options.ajaxHeaders = {};
         }
 
         var myQueueItem = {