Доработка приложения "Хаб"
В процессе работы с приложением обнаружились проблемы, которые не позволяют эффективно работать в нем.
- Отредактировать сообщение в Хабе можно с использованием редактора и кода. Но ответы на обращение уже нельзя. Редактировать в админке не получается, изменить запись можно только во fronted. Вставить фото в уже созданный комментарий почему-то нельзя.
- При использовании скриншотов они по-умолчанию сжимаются до не читаемого размера. Проблему решили с помощью библиотеки fancybox - https://support.webasyst.ru/27352/masshtabirovanie... Но обнаружилась другая сложность - в комментарии с ответом нельзя отредактировать код, есть только редактор во fronted. Чтобы добавить класс к фото, нужно сделать это непосредственно в базе данных. Других способов я не нашел. Хотя такая функция должны быть в базе.
- Можно также добавить возможность указания класса в меню редактирования атрибутов картинки
2 комментария
этот редактор поддерживает плагины - можете написать все что угодно.
поле класс добавить не сложно, объяснить сложно =\ т.к. стандартный код (wa-content/js/redactor2/redactor.min.js) сжат и пришлось деобфусикацию делать.
} else t(".redactor-image-position-option").hide(); t("#redactor-image-preview").html(t('<img src="' + e.attr("src") + '" style="max-width: 100%;">')), t("#redactor-image-title").val(e.attr("alt")), // загружаеим значение поля форми из изображения t("#redactor-image-class").val(e.attr("class")), ... update: function () { var e = this.observe.image, i = e.closest("a", this.core.editor()[0]), o = t("#redactor-image-title").val().replace(/(<([^>]+)>)/gi, ""); e.attr("alt", o).attr("title", o); // задаем изображению класс e.attr("class", t("#redactor-image-class").val().replace(/(<([^>]+)>)/gi, "")), ... modal: function () { return { callbacks: {}, templates: function () { this.opts.modal = { // поле шаблона '<section><label>Class</label><input type="text" id="redactor-image-class" /></section>' "image-edit": String() + '<div class="redactor-modal-tab redactor-group" data-title="' + this.lang.get("general") + '"><div id="redactor-image-preview" class="redactor-modal-tab-side"></div><div class="redactor-modal-tab-area"><section><label>Class</label><input type="text" id="redactor-image-class" /></section><section><label>' + this.lang.get("title") + '</label><input type="text" id="redactor-image-title" /></section><section><label>' + this.lang.get("caption")