title: Download multiple images into 1 zip file
body: <p>I have a function that currently downloads multiple images and saves them to a users "download" folder (Only works in Chrome)</p>
  
  <p>I want to take this function to the next step and put these images in a single zip file.</p>
  
  <p>Below is an example of my current code. I want to merge my code with the JSZip API I found online <a href="http://viralpatel.net/blogs/create-zip-file-javascript/" rel="noreferrer">here</a>.</p>
  
  <p>I have done the bower install for this JSZip API already and included the script in my html.</p>
  
  <p>Here is my code that works perfectly downloading multiple SINGLE images at once:</p>
  
  <pre><code>$scope.downloadPhotos = function() {
      var photoUrls = [];
      for (var x = 0; x &lt; $scope.$parent.photos.length; x++) {
  
          var p = $scope.$parent.photos[x];
          if (p.isChecked) {
              photoUrls.push($scope.bucketUrl() + p.photoUrl);
  
          }
      }
  
      saveImage(photoUrls);
  };
  
  
  
  /*----this function  saveImage works great (only Chrome)-----*/
      function saveImage(urls) {
          var link = document.createElement('a');
  
          link.setAttribute('download', null);
          link.style.display = 'none';
  
  
          document.body.appendChild(link);
  
          for (var i = 0; i &lt; urls.length; i++) {
              link.setAttribute('href', urls[i]);
              link.click();
          }
  
          document.body.removeChild(link);
      }
  </code></pre>
  
  <p>And here is the JSZip API code example to create a zip file with content in it:</p>
  
  <pre><code>function create_zip() {
      var zip = new JSZip();
      zip.add("hello1.txt", "Hello First World\n");
      zip.add("hello2.txt", "Hello Second World\n");
      content = zip.generate();
      location.href = "data:application/zip;base64," + content;
  }
  </code></pre>
  
  <p>Now I'm just wondering how to combine the two to put my images into a zipfile.
  Thanks for your help!</p>