Предварительная загрузка изображений в пользовательский интерфейс тонкого загрузчика

В последнее время я тратил время на то, чтобы заставить отличного загрузчика работать над развивающимся проектом. У меня он работает с некоторым настраиваемым порядком перетаскивания и другими параметрами (такими как удаление), интегрированными в параметр fileTemplate в тонком загрузчике.

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

Однако я не могу найти никакой документации или помощи по этому вопросу. Моя первоначальная концепция заключалась в том, чтобы выводить дубликат кода fileTemplate в

<div id="fine-uploader"></div>

разд. Однако при инициализации тонкой загрузки он удаляет код. Мне не нужно, чтобы предварительно загруженный код был инициализирован прекрасным загрузчиком. Пока я могу заставить заказ работать.

Конечно, это должен быть способ сделать это? Кто-нибудь знает? Единственный способ, который я могу придумать, - это использовать напуганный JS после того, как штраф загружен как инициализированный. Но я не уверен на 100%, что это будет гладкий процесс.


person Shane    schedule 22.08.2013    source источник
comment
Я не уверен, что понимаю, что вы пытаетесь сделать. Можете ли вы попытаться объяснить по-другому или предоставить несколько скриншотов?   -  person Ray Nicholus    schedule 23.08.2013
comment
Кроме того, название этого вопроса немного вводит в заблуждение. Сначала я подумал, что вы ищете способ генерировать миниатюры изображений с помощью Fine Uploader, но, честно говоря, я не очень понимаю, что вы пытаетесь сделать.   -  person Ray Nicholus    schedule 23.08.2013
comment
Я пытаюсь загрузить изображения, которые уже загружены на сервер, в пользовательский интерфейс Fine uploader. IE, если изображения прикреплены к листингу и кто-то хочет отредактировать листинг. Затем отображается Fine Uploaded со всеми изображениями, уже загруженными в Fine Uploader. Так что их потом можно удалить или еще что.   -  person Shane    schedule 23.08.2013
comment
почему ты хочешь сделать это? Fine Uploader — это инструмент загрузки, а не готовое веб-приложение.   -  person Ray Nicholus    schedule 23.08.2013
comment
Без написания сочинения. Это то, что должно произойти. Страница загружается со всеми сохраненными данными. Идея состоит в том, чтобы снова включить изображения.   -  person Shane    schedule 23.08.2013
comment
Я немного смущен вашим использованием слова изображения. Fine Uploader не делает ничего особенного с изображениями (пока). Вы хотите, чтобы файлы отображались в пользовательском интерфейсе Fine Uploader после того, как все элементы были загружены на вашу конечную точку?   -  person Ray Nicholus    schedule 23.08.2013
comment
Да. Это правильно.   -  person Shane    schedule 23.08.2013
comment
Это функция, запланированная для текущего цикла выпуска. См. github.com/Widen/fine-uploader/issues/784 для подробнее.   -  person Ray Nicholus    schedule 18.12.2013


Ответы (3)


Желаемый результат был достигнут простой вставкой HTML в элемент списка Fine Uploader ul. Просто базовым jquery. IE

$('ul', $('#fine-uploader')).html(preload);

Этот HTML-код является клоном HTML-кода успешного пользовательского интерфейса пользователя uplaoder. Мне пришлось переписать дополнительный скрипт для обработки некоторых дополнительных функций, которые я добавил, но в итоге это оказалось минимальным. Все операции удаления, перетаскивания и переупорядочения работают нормально. Тестировал в разных браузерах, проблем пока не обнаружил. Не самый элегантный способ кодирования, который я предпочитаю, но пока работает достаточно хорошо.

person Shane    schedule 26.08.2013
comment
Если кому-то интересно, это встроено в FineUploader в настоящее время (или, возможно, было даже в 2013 году - я не знаю). Соответствующую документацию можно найти здесь docs.fineuploader.com/features/session.html. , но в основном все, что вам нужно сделать, это установить session: {endpoint: "/my-endpoint"} и убедиться, что конечная точка возвращает массив уже загруженных изображений в соответствии со спецификацией. - person powerbuoy; 15.11.2015

Ваш вопрос, похоже, выходит за рамки того, что делает и предлагает Fine Uploader. Fine Uploader — это просто инструмент, помогающий разработчикам эффективно загружать файлы на своем веб-сайте. В этом смысле Fine Uploader действует по принципу KISS. Как только файлы загружены, Fine Uploader на самом деле совершенно не заботится о том, что вы с ними делаете, и, по сути, имеет очень мало власти над вашими файлами.

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

Я ничего не знаю о стеке, который вы используете для своего веб-приложения, или о требованиях к тому, что вы хотите, поэтому это может быть немного расплывчато, но вам нужно будет выяснить, как сохранить «состояние» вашего веб приложение. Есть много способов сделать это. Возможно, при каждой успешной загрузке вы сохраняете URL-адрес файла в локальном хранилище, в файле cookie или в удаленной базе данных. Вам нужно будет реализовать некоторый код для извлечения этих записей, а затем ПОЛУЧИТЬ их с сервера, на котором они хранятся, а затем отобразить их на странице.

Каким бы способом вы его ни нарезали, это небольшая работа. Мой ответ, вероятно, можно было бы разделить как минимум на 3 отдельных вопроса (в зависимости от вашего понимания веб-технологий). Опять же, не зная, какие технологии вы используете, трудно поставить диагноз и предложить подробное решение.

person Mark Feltner    schedule 23.08.2013
comment
Я занимаюсь разработкой уже 15 лет и очень хорошо разбираюсь в работе с изображениями. Это делает его более грязным, чем должно быть. Следовательно, создание 2 пользовательских интерфейсов для обработки изображений. Один для загрузки, другой для удаления. Особенно, когда в пользовательском интерфейсе Fine Uploader уже есть кнопка удаления. Я не понимаю, почему невозможно запустить процесс тонкой загрузки, который запускается после завершения загрузки изображения. IE предоставляет URL-адрес изображения и обходит функцию загрузки. - person Shane; 24.08.2013
comment
Затем это отобразит интерфейс, изображение и обновит пользовательский интерфейс. Затем при необходимости можно загрузить больше изображений. На самом деле есть вероятность, что где-то в Fine Uploader есть вызов функции, которая делает именно это. - person Shane; 24.08.2013

Ответ Марка очень хорошо описывает это, но я немного расширю то, что он здесь сказал.

Шейн, Fine Uploader — это инструмент, обеспечивающий поддержку кросс-браузерной загрузки файлов в существующее веб-приложение. Это не готовое веб-приложение в коробке. И не должно быть. Проблема кроссбраузерной загрузки файлов со всеми сопутствующими функциями достаточно сложна. Ваше требование не имеет ничего общего с загрузкой файлов. Это выходит за рамки любого кросс-браузерного инструмента загрузки файлов. Это заявления, которые я делаю, основываясь на своем понимании ваших требований, которым очень трудно следовать, поскольку вы не предоставили подробностей.

После загрузки файлов и закрытия страницы/компонента работа Fine Uploader завершена. Если вы хотите предоставить своим пользователям возможность редактировать существующие файлы, вы, безусловно, должны это сделать, но не следует ожидать, что библиотека загрузки поможет в этом. Fine Uploader — это не инструмент пользовательского интерфейса общего назначения и не что иное, как библиотека, позволяющая загружать файлы между браузерами вместе со всеми тесно связанными функциями. Ни одна другая библиотека загрузки не будет вести себя как инструмент пользовательского интерфейса общего назначения. Если дизайн вашего приложения зависит от инструмента загрузки, который отвечает за создание случайных частей вашего пользовательского интерфейса и поддержку функций, не связанных с загрузкой, то я настоятельно рекомендую вам пересмотреть дизайн вашего веб-приложения.

Пользовательский интерфейс Fine Uploader по умолчанию очень прост и действительно предназначен только для задачи распространения состояния загрузки файла для пользователя и обработки тесно связанных задач. Думайте об этой (или любой другой) библиотеке загрузки как о молотке. Отлично забивает ногти. Кажется, вы хотите и забивать гвозди, и пилить дерево одним и тем же инструментом. Я полагаю, что мы могли бы взять молоток и добавить к нему зазубренную полоску сбоку, но это сделало бы его менее эффективным и неудобным в использовании инструментом как для забивания гвоздей, так и для распиливания дерева. Используйте молоток для забивания гвоздей и пилу для резки дерева.

Наконец, я немного обеспокоен или сбит с толку тем, что вы, по-видимому, изменили параметр fileTemplate, чтобы добавить в библиотеку «другие параметры (например, удаление)». Я не уверен, знаете ли вы, что удаление файла уже встроено в библиотеку. Я не уверен, используете ли вы старую версию библиотеки, просто пропустили это в документации или я вас неправильно понимаю.

person Ray Nicholus    schedule 25.08.2013
comment
Это действительно просто. Я хочу, чтобы пользовательский интерфейс загружался так же, как он выглядит после того, как пользователь загрузил файлы. Целая неделя или около того была потрачена на добавление функциональности к предоставленному параметру filetemplate. Например, установить основное изображение, удалить и упорядочить все с помощью ajax. Все работает нормально. Где-то в тонком загрузчике будет успешный возврат, когда изображение завершит процесс загрузки. Это должно инициировать вывод пользовательского интерфейса успешной загрузки, который отображает изображение и имя изображения. Мне просто нужно запустить это для каждого изображения, указав URL-адрес загруженного изображения. Я думаю, мне нужно искать источник. - person Shane; 26.08.2013
comment
@ray-nicholus Я думаю, что вопрос @shane очень актуален, и у меня сейчас такая же проблема. Я создал мастер, на одной странице я загружаю файлы, которые хорошо отображаются. Я нажимаю «Далее», но затем решаю вернуться. Я не сбрасываю со счетов объем хороших усилий, которые уже были вложены в инструмент, но я ожидаю, что метод доведения пользовательского интерфейса до его состояния непосредственно перед тем, как я нажму «Далее». Я искал в js-файле Fine Uploader такие параметры, как preload, items или uploads, чтобы добавить массив существующих загрузок items: ['Example1.jpg', 'readme.txt'], но безрезультатно. Есть ли у вас какие-либо дальнейшие мысли? - person Stokedout; 01.09.2013
comment
Что-то вроде этого было бы хорошим дополнением к API: $('#fineUploader').fineUploader({ existingUploads: ['Example1.jpg', 'readme.txt']}); - person Stokedout; 02.09.2013
comment
@Stokedout Не могли бы вы открыть запрос функции в системе отслеживания проблем репозитория Github, чтобы мы могли обсудить немного больше. Трекер ошибок можно найти по адресу github.com/Widen/fine-uploader/issues. . - person Ray Nicholus; 02.09.2013
comment
Привет @RayNicholus Я, конечно, могу, я добавлю это в какой-то момент на этой неделе. Спасибо - person Stokedout; 02.09.2013