Change xhrHeaders to xhr and include method and withCredentials

This introduces a small breaking change, but I think it is worth it to bundle all XHR-related properties under a single property.

Author: goldfire

README.md

@@ -213,14 +213,24 @@ The rate of playback. 0.5 to 4.0, with 1.0 being normal speed.
 The size of the inactive sounds pool. Once sounds are stopped or finish playing, they are marked as ended and ready for cleanup. We keep a pool of these to recycle for improved performance. Generally this doesn't need to be changed. It is important to keep in mind that when a sound is paused, it won't be removed from the pool and will still be considered active so that it can be resumed later.
 #### format `Array` `[]`
 howler.js automatically detects your file format from the extension, but you may also specify a format in situations where extraction won't work (such as with a SoundCloud stream).
-#### xhrWithCredentials `Boolean` `false`
-Whether or not to enable the `withCredentials` flag on XHR requests used to fetch audio files when using Web Audio API ([see reference](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials)).
-#### xhrHeaders `Object` `null`
-When using Web Audio, howler.js uses an XHR request to load the audio files. If you need to send custom headers with this request, include them with this parameter. For example:
+#### xhr `Object` `null`
+When using Web Audio, howler.js uses an XHR request to load the audio files. If you need to send custom headers, set the HTTP method or enable `withCredentials` ([see reference](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials)), include them with this parameter. Each is optional (method defaults to `GET`, headers default to `null` and withCredentials defaults to `false`). For example:
 ```javascript
+// Using each of the properties.
 new Howl({
-  xhrHeaders: {
-    Authorization: 'Bearer:' + token,
+  xhr: {
+    method: 'POST',
+    headers: {
+      Authorization: 'Bearer:' + token,
+    },
+    withCredentials: true,
+  }
+});
+
+// Only changing the method.
+new Howl({
+  xhr: {
+    method: 'POST',
   }
 });
 ```

src/howler.core.js

@@ -483,6 +483,7 @@
         self._suspendTimer = null;
         self.state = 'suspending';
 
+        // Handle updating the state of the audio context after suspending.
         var handleSuspension = function() {
           self.state = 'suspended';
 
@@ -492,8 +493,8 @@
           }
         };
 
-        // Either suspension is resolved or rejected (i.e. in case of interrupted state of audio context)
-        // the Howler's 'suspending' state needs to be updated.
+        // Either the state gets suspended or it is interrupted.
+        // Either way, we need to update the state to suspended.
         self.ctx.suspend().then(handleSuspension, handleSuspension);
       }, 30000);
 
@@ -583,8 +584,11 @@
       self._sprite = o.sprite || {};
       self._src = (typeof o.src !== 'string') ? o.src : [o.src];
       self._volume = o.volume !== undefined ? o.volume : 1;
-      self._xhrWithCredentials = o.xhrWithCredentials || false;
-      self._xhrHeaders = o.xhrHeaders || null;
+      self._xhr = {
+        method: o.xhr && o.xhr.method ? o.xhr.method : 'GET',
+        headers: o.xhr && o.xhr.headers ? o.xhr.headers : null,
+        withCredentials: o.xhr && o.xhr.withCredentials ? o.xhr.withCredentials : false,
+      };
 
       // Setup all other default properties.
       self._duration = 0;
@@ -2349,14 +2353,14 @@
     } else {
       // Load the buffer from the URL.
       var xhr = new XMLHttpRequest();
-      xhr.open('GET', url, true);
-      xhr.withCredentials = self._xhrWithCredentials;
+      xhr.open(self._xhr.method, url, true);
+      xhr.withCredentials = self._xhr.withCredentials;
       xhr.responseType = 'arraybuffer';
 
       // Apply any custom headers to the request.
-      if (self._xhrHeaders) {
-        Object.keys(self._xhrHeaders).forEach(function(key) {
-          xhr.setRequestHeader(key, self._xhrHeaders[key]);
+      if (self._xhr.headers) {
+        Object.keys(self._xhr.headers).forEach(function(key) {
+          xhr.setRequestHeader(key, self._xhr.headers[key]);
         });
       }