Tui.image-editor: Filter panel (instance #1) change an image of instance #2

[sergeizhukov]

Hello!
With one editor everything works perfect but with two instances exists some weird behaviour with filter panel.
So I bind editor on random ID #tui-image-editor-container-hashHere

        var imageEditor = initTuiEditor('<?=$widgetId?>', '<?=$fileUrl?>', '<?=$val?>');

        window.onresize = function() {
            imageEditor.ui.resizeEditor();
        };

Configuration

function initTuiEditor(widgetId, filePath, fileName) {

  var blackTheme = {
    'menu.normalIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-d.svg',
    'menu.activeIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-b.svg',
    'menu.disabledIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-a.svg',
    'menu.hoverIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-c.svg',
    'submenu.normalIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-d.svg',
    'submenu.activeIcon.path': '/js/plugins/tui.image-editor/dist/svg/icon-b.svg',
  };

  var tuiEditor = new tui.ImageEditor('#tui-image-editor-container-' + widgetId, {
    includeUI: {
      loadImage: {
        path: filePath,
        name: fileName
      },
      theme: blackTheme, // or whiteTheme
      initMenu: 'filter',
      menuBarPosition: 'bottom'
    },
    cssMaxWidth: 1920-(1920 * 0.3),
    cssMaxHeight: 1080-(1080 * 0.3),
    usageStatistics: false
  });

  tuiEditor.loadImageFromURL = (function() {
    var cached_function = tuiEditor.loadImageFromURL;
    function waitUntilImageEditorIsUnlocked(imageEditor) {
      return new Promise((resolve,reject)=>{
        const interval = setInterval(()=>{
          if (!imageEditor._invoker._isLocked) {
            clearInterval(interval);
            resolve();
          }
        }, 100);
      })
    }
    return function() {
      return waitUntilImageEditorIsUnlocked(tuiEditor).then(()=>cached_function.apply(this, arguments));
    };
  })();

  return tuiEditor;
}

Html:

<div class="tui-image-editor-container" id="tui-image-editor-container-<?=$widgetId?>">
                    </div>

When I open the second editor:

Nothing happen. I thought before! But it change the first editor:

This is bug only with filter panel. Other tool are work.
Any ideas?

[sergeizhukov]

How to get all intances of tui?

[jinwoo-kim-nhn]

This looks like a bug. I'll fix it soon. Thank you.

281

[jinwoo-kim-nhn]

resolved at 3.7.1