Aviary Editor Загружает пустое изображение до изменения размера экрана

Question

На моем сайте есть экземпляр редактора aviary, который извлекает изображения из средства выбора файлов, а затем повторно отправляет их. Проблема, с которой я сталкиваюсь, заключается в том, что когда я загружаю изображение, у него изначально появляется загруженный эскиз, затем экран гаснет... до тех пор, пока я не изменю размер экрана и изображение не будет отображаться нормально.

Вот как это выглядит, обратите внимание на размеры изображения внизу. Они переходят от уже загруженного эскиза к пустому изображению с отображением правильных размеров, пока я немного не изменю размер окон.

Во время загрузки размеры миниатюры внизуПосле того, как он загружен, исправьте размеры в основанииПосле небольшого изменения размеров окна появляется изображение

Вот мой код инициализации:

function initEditor( apiKey ){
var tools = ['enhance', 'orientation', 'focus', 'resize', 'crop', 'effects'];
var featherEditor = new Aviary.Feather({
    apiKey: apiKey,
    apiVersion: 3,
    displayImageSize: true,
    tools: tools,
    maxSize: 800,
    theme: 'minimum',
    onSave: function(image, newUrl){
        //onSave function, sends to external filePicker source 
    },
    onError: function(errorObj){
        console.log(errorObj);
    },
    onLoad: function(){
        //load only if there is an img
        if (typeof img !== 'undefined'){
            openEditor(img, src, featherEditor);
        }
    }
});
return featherEditor;
}

Код открытия:

image = "img-id_image_relations-0-image"

src = "https://www.filepicker.io/api/file/mX42P6fLRS6YDP58moIH"

function openEditor(image, src, editor){
editor.launch({
    image: image,
    url: src
});
//return false;
}

Вещи, которые я пробовал:

• Загрузка изображения в div перед открытием,

• Упрощение инициализации пера до минимума,

• Тест на внешнем сервере и локальном хосте,

Что воняет, когда я тестирую его на jsFiddle, он работает отлично. http://jsfiddle.net/TD4Ud/

Answer 1

Это очень грязно, но я нашел временное решение запуска события изменения размера окна при загрузке изображения. Я бы хотел, чтобы был лучший ответ, но пока он будет работать.

Добавьте это как событие onReady в инициализации:

onReady: function(){
        //this is an abomination but it works
        window.dispatchEvent(new Event('resize'));
    }