Tiny File Manager

Back Back Up Advanced Editor

/* global WP_Smush */
/* global ajaxurl */

/**
 * Bulk restore JavaScript code.
 *
 * @since 3.2.2
 */
(function() {
  "use strict";

/**
   * Bulk restore modal.
   *
   * @since 3.2.2
   */
  WP_Smush.restore = {
    modal: document.getElementById("smush-restore-images-dialog"),
    contentContainer: document.getElementById("smush-bulk-restore-content"),
    settings: {
      slide: "start", // start, progress or finish.
      success: 0,
      errors: []
    },
    items: [], // total items, 1 item = 1 step.
    success: [], // successful items restored.
    errors: [], // failed items.
    currentStep: 0,
    totalSteps: 0,

/**
     * Init module.
     */
    init() {
      if (!this.modal) {
        return;
      }

this.settings = {
        slide: "start",
        success: 0,
        errors: []
      };

this.resetModalWidth();
      this.renderTemplate();

// Show the modal.

window.SUI.openModal(
        "smush-restore-images-dialog",
        "wpbody-content",
        undefined,
        false
      );
    },

/**
     * Update the template, register new listeners.
     */
    renderTemplate() {
      const template = WP_Smush.onboarding.template("smush-bulk-restore");
      const content = template(this.settings);

if (content) {
        this.contentContainer.innerHTML = content;
      }

this.bindSubmit();
    },

/**
     * Reset modal width.
     *
     * @since 3.6.0
     */
    resetModalWidth() {
      this.modal.style.maxWidth = "460px";
      this.modal.querySelector(".sui-box").style.maxWidth = "460px";
    },

/**
     * Catch "Finish setup wizard" button click.
     */
    bindSubmit() {
      const confirmButton = this.modal.querySelector(
        'button[id="smush-bulk-restore-button"]'
      );
      const self = this;

if (confirmButton) {
        confirmButton.addEventListener("click", function(e) {
          e.preventDefault();
          self.resetModalWidth();

self.settings = { slide: "progress" };
          self.errors = [];

self.renderTemplate();
          self.initScan();
        });
      }
    },

/**
     * Cancel the bulk restore.
     */
    cancel() {
      if ("start" === this.settings.slide || "finish" === this.settings.slide) {
        // Hide the modal.
        window.SUI.closeModal();
      } else {
        this.updateProgressBar(true);
        window.location.reload();
      }
    },

/**
     * Update progress bar during directory smush.
     *
     * @param {boolean} cancel  Cancel status.
     */
    updateProgressBar(cancel = false) {
      let progress = 0;
      if (0 < this.currentStep) {
        progress = Math.min(
          Math.round((this.currentStep * 100) / this.totalSteps),
          99
        );
      }

if (progress > 100) {
        progress = 100;
      }

// Update progress bar
      this.modal.querySelector(".sui-progress-text span").innerHTML =
        progress + "%";
      this.modal.querySelector(".sui-progress-bar span").style.width =
        progress + "%";

/**
     * First step in bulk restore - get the bulk attachment count.
     */
    initScan() {
      const self = this;
      const _nonce = document.getElementById("_wpnonce");

/**
     * Execute a scan step recursively
     */
    step() {
      const self = this;
      const _nonce = document.getElementById("_wpnonce");

if (0 < this.items.length) {
        const item = this.items.pop();
        const xhr = new XMLHttpRequest();
        xhr.open("POST", ajaxurl + "?action=restore_step", true);
        xhr.setRequestHeader(
          "Content-type",
          "application/x-www-form-urlencoded"
        );
        xhr.onload = () => {
          this.currentStep++;

if (200 === xhr.status) {
            const res = JSON.parse(xhr.response);
            if ("undefined" !== typeof res.data.success && res.data.success) {
              self.success.push(item);
            } else {
              self.errors.push({
                id: item,
                src: res.data.src,
                thumb: res.data.thumb,
                link: res.data.link
              });
            }
          }

self.updateProgressBar();
          self.step();
        };
        xhr.send("item=" + item + "&_ajax_nonce=" + _nonce.value);
      } else {
        // Finish.
        this.settings = {
          slide: "finish",
          success: this.success.length,
          errors: this.errors,
          total: this.totalSteps
        };

self.renderTemplate();
        if (0 < this.errors.length) {
          this.modal.style.maxWidth = "660px";
          this.modal.querySelector(".sui-box").style.maxWidth = "660px";
        }
      }
    }
  };

/**
   * Template function (underscores based).
   *
   * @type {Function}
   */
  WP_Smush.restore.template = _.memoize(id => {
    let compiled;
    const options = {
      evaluate: /<#([\s\S]+?)#>/g,
      interpolate: /{{{([\s\S]+?)}}}/g,
      escape: /{{([^}]+?)}}(?!})/g,
      variable: "data"
    };

return data => {
      _.templateSettings = options;
      compiled = compiled || _.template(document.getElementById(id).innerHTML);
      return compiled(data);
    };
  });
})();