Raw Source Toggle Dropdown

• Minified Source

Bootta11 / Aliexpress_popup_images

// ==UserScript==
// @name         Aliexpress_popup_images
// @namespace    http://tampermonkey.net/
// @version      0.4
// @description  Popup images show
// @author       Bootta
// @license MIT
// @match        https://*.aliexpress.com/*
// @require https://code.jquery.com/jquery-3.3.1.min.js
// @require https://unpkg.com/popper.js@1/dist/umd/popper.min.js
// @require https://unpkg.com/tippy.js@4
// @updateURL https://openuserjs.org/meta/Bootta11/Aliexpress_popup_images.meta.js
// ==/UserScript==

(function () {
  'use strict';

  let popup_images_per_row = 3;
  let clr_div = $('<div></div>').css('height', '1px').css('clear', 'both').css('width', '100%');

  let item_links = $('.item a');
  item_links[0];
  item_links.each(function (index) {
    let link_a = this;
    tippy(this, {
      content: 'Loading...',
      animateFill: false,
      animation: 'fade',
      flipOnUpdate: true,
      interactive: true,
      onShow(instance) {
        $.get($(link_a).attr('href'), response => {
          //console.log('resposne: ', response);

          let popup_content = $('<table></table>').css('width', '700px');

          let images_count = 0;
          let tr = $('<tr></tr>');
          $(response).find('img').each(function (index) {

            console.log('img src: ', $(this).attr('src'));
            let img_src = $(this).attr('src');
            let img = $('<img></img>').attr('src', img_src).css('width', '200px').css('height', '200px');
            img.css('float', 'left');
            let td = $('<td></td>');
            td.append(img);
            tr.append(td);
            images_count++;
            if (images_count % popup_images_per_row == 0) {
              console.log('clear', images_count, popup_images_per_row);
              popup_content.append(tr);
              tr = $('<tr></tr>');
            }
          });
          let table_body = $('<tbody></tbody>');
          table_body.append(popup_content);
          instance.setContent(table_body.html());
        });

      },
    });

    console.log('el index ', index, $(this).attr('href'));
  });
})();