S03E05
Импорт форматирования с Google Docs (нужны тесты!), предпросмотр и другие новые плюшки stories.andreymal.org

Были вот такие жалобы:

«А можно чуть конкретнее? — Основная проблема в отсутствии совместимости с документами ворд\гуглдок. Не понимает программа разметку, и это очень напрягает при выкладывании больших фанфиков. Нет той же самой функции превью, чтобы было видно, как текст будет выглядеть вживую. Я понимаю, что портал возведен и поддерживается энтузиастами своего дела, за что им глубокий поклон, но увы, пока редактор сторисов откровенно слаб и неудобен.» — Gedzerath

«Как на табун перенести текст с сохранением пробелов и курсива?»

«На доках текст разделен, стоит копирнуть на сториз/табун - все в одну кучу.»

На этих выходных у меня дошли руки поработать над этим.

Теперь при копировании текста из Google Docs (или других приложений, умеющих пихать HTML-код в буфер обмена) и его вставке в поле ввода главы будет вставляться готовый HTML-код для сайта с сохранением форматирования.

Стоит иметь в виду, что из-за того, что всякие гуглдоки выпендриваются и не используют семантическую разметку, местами форматирование всё-таки слетит (например, очень проблематично различать заголовки и просто увеличенный текст), но всё же переносить текст с гуглдоков теперь должно быть сильно легче. Принимаются документы, в которых форматирование вставляется криво, может, даже сделаю фиксы для них.

Если понадобится вставить без HTML-кода, можно сперва вставить в Блокнот, а из него уже скопировать в поле ввода.

Оно может не работать в старых браузерах, а Edge не умеет в юникод: я поддерживаю эту фичу только в последних версиях Chrome, Firefox и Safari.

Вообще я начал подумывать над впиливанием какого-нибудь WYSIWYG-редактора вместо нынешнего markItUp, но все просмотренные мной оказались на первый взгляд говном (в том числе популярные TinyMCE и CKEditor), а писать свой долго. Расскажите, что вы об этом думаете и нужно ли оно?

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

Заголовки глав теперь необязательны. Это позволит избавить рассказы, имеющие одну главу, от петросянства вида «Глава первая и единственная». Если заголовок не указан, то он не отображается при чтении рассказа. В местах, где заголовок всё-таки требуется (RSS, уведомления и т.п.), подставляется название рассказа или заглушка «Глава N».

По сайту раскидано больше ссылок на редактирование главы. Для удобства. А из формы редактирования главы можно перейти к чтению главы через ссылку в заголовке предпросмотра.

Сортировка результатов поиска по дате теперь сортирует таки по дате. Раньше сортировала по id рассказов. (Сортировка по рейтингу по-прежнему не работает, потому что голосов слишком мало).

Исходники:

https://github.com/andreymal/mini_fiction

https://github.com/andreymal/stories.andreymal.org

Этот пост на Табуне

Комментарии (92)

0

Славно.

0

Обнаружена проблема: при копировании текста из Ворда движок зачем-то ставит между абзацами лишнюю пустую строку, которая при этом не отображается, но есть. Исправь этот глюк вставки, а заодно можешь сделать для удобства чтения и поиска нужного абзаца, чтобы, во-первых, скрипт отображения текста при открытии главы фанфика расставлял в начале каждого абзаца красную строку, а ещё чтобы после каждого абзаца (не строки, а именно абзаца) было небольшое пространство до следующего абзаца, то есть как в Ворде есть в форматировании абзаца пункт "Интервал после абзаца", так вот то же самое сделать при отображении на сайте текста фанфиков. Уверяю тебя, так читать и искать нужный момент намного удобнее, чем когда текст стоит сплошной стеной, не выделенной ни красными строками, ни интервалом после каждого абзаца.

GORynytch #2 Ответить
0

Отступы между абзацами и так есть, просто не забывай разделять абзацы пустой строкой (хоть одной, хоть двумя :)

andreymal #4 Ответить
0

И да, у меня при вставке из Word 2013 в Edge в Windows 10 есть по одной пустой строке — разделители абзацев, и после абзаца таки есть интервал — всё работает ровно так, как и задумывалось.

https://i.imgur.com/SSP3xeb.png
https://i.imgur.com/TsndflE.png

andreymal #5 Ответить
0

Тогда хотя бы автоматически расставляемую красную строку в начале каждого абзаца сделай.
И я был бы очень благодарен, если бы было реализовано форматирование текста "по ширине" с автоматическим переносом по слогам. Примерно так, как на Фикбуке. Можешь даже попробовать расковырять ихний основной js и выдернуть оттуда фрагмент, который и отвечает за форматирование текста у клиента "по ширине" и его перенос.

GORynytch #7 Ответить
0

А вот в красивости красной строки я немного сомневаюсь

andreymal #8 Ответить
0

Должен отметить, что фикбуковый джаваскрипт добавляет невидимые символы переноса (здесь должна была быть ссылка на unicode-table.com, но он почему-то не работает) в текст, которые столь же невидимо копипастятся при копипасте текста, вдруг это кому-то проблем создаст

andreymal #10 Ответить
0

Чувак, огромное спасибо. Честно скажу, лично мне читать стало сразу намного привычнее и удобнее. Просто я с детства много читал и попросту привык, чтобы литературный текст всегда был оформлен по определённым нормам.
Единственный недочёт, который обнаружил раньше, но забывал о нём сказать. Лично у меня привычка — я при чтении не колёсиком мыши кручу страницу с текстом, а жму PgDown. Всё бы ничего, но после того как ты сверху страницы прикрутил панель, которая там постоянно приклеена, пока читаешь, при нажатии на PgDown страница прокручивается так, что следующая строка страницы оказывается под этой панелькой, поэтому постоянно дополнительно приходится жать "вверх", чтобы прочитать скрывшуюся строчку. Можешь это исправить так, чтобы при прокручивании страницы с помощью PgDown и PgUp две нижние строчки экрана оказывались вверху ниже панели в первом случае или же две верхние ниже панели — внизу во втором случае?

GORynytch #17 Ответить
0

Вообще на stories.everypony.ru панелька прозрачна и появляется только при наведении мышки, есть вариант здесь тоже её просто скрыть

andreymal #18 Ответить
0

Делать выдвигвающуюся панельку немножко геморройно, так что пока просто прозрачность прописал. Ну а PgDown/PgUp пропатчить вообще нельзя :(

andreymal #25 Ответить
Комментарий был отправлен на Луну
0

А, можешь тогда пофиксить глюк, что если в начале или конце строки стоят теги типа "em /em", "strong /strong", "s /s", "u /u" (знаки "больше-меньше" убрал, т.к. иначе теги не отображаются в комментарии) и, возможно, какие-то другие, то тогда при просмотре строка слипается с предыдущей (если тег стоит в начале строки) или со следующей (если в конце строки), хотя в редакторе остаётся так, как и было, из-за чего приходится принудительно ставить тег "br".
И ещё, что это за новые ;nbsp или как-то так отображающиеся хрени при вставке из Ворда текста?

GORynytch #6 Ответить
0

  появляется скореее всего в тех местах, где больше одного пробела подряд, а так как в HTML несколько пробелов подряд схлопываются в один, ворд (да и гуглдоки тоже) пытается сохранить их заменой на несхлопывающийся  , если так, то это норма

andreymal #9 Ответить
0

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

GORynytch #29 Ответить
0

Не должна, <br/> по определению разделяет строки внутри абзаца, а не сами абзацы (то же самое делает вроде как Shift+Enter во всяких вордах)

andreymal #30 Ответить
0

А-а-а, вот оно в чём дело. Тогда понятно. А есть ли тег, который именно будет добавлять новый пустой абзац, а не разделять абзац на две строки? Потому что кое-где нужно, чтобы даже при переключении режима на красную строку всё равно стояла одна (или несколько) пустая строка, а без того же br дополнительные пустые строки всё равно съедаются движком.

GORynytch #31 Ответить
0

То есть именно принудительная вставка нового абзаца.

GORynytch #32 Ответить
0

Извращения какие-то, где это надо? Но вообще два br подряд с пустой строкой после них вроде бы дают нужный эффект, если я правильно понял

andreymal #33 Ответить
0

Сейчас перепроверил — да работает как надо. Извиняюсь, что побеспокоил.

GORynytch #34 Ответить
0

Жутко не хватает тега "Повседневность". Не всегда же кровь, приключения и шары для боулинга, которые глупые кобылы засовывают в крупы, бывают и прекрасные рассказы о мирных буднях или весёлых бытовых ситуациях. Нельзя ли ввести?

Хеллфайр Файр #35 Ответить
0

Ну вроде жанр такой уже есть. Вообще я пока избегаю изменения жанров, персонажей и событий, не хочу терять совместимость со stories.everypony.ru

andreymal #36 Ответить
0

М! Кстати, неплохо бы при выдаче html принудительно втыкать nbsp после тире, союзов и частиц.

arsenicum #41 Ответить
0

И сноски. Есть вариант, который синтаксически не сложнее спойлера:

body { counter-reset: refcount; }
.refsub { display: inline; counter-increment: refcount; }
.refsub:after { content: counter(refcount); vertical-align: super; font-size: smaller; }
.refdef:before { content: counter(refcount)" "; vertical-align: super; font-size: smaller; }
.refdef { display: inline-block; width: 100%; float: left; color: #666; border-top: 1px solid; margin: 0px !important;}


(пустой span с классом refsub втыкается в месте сноски, сразу за ним следует span с классом refdef, в котором записан текст сноски. Второй можно вложить в первый, тогда прописав первому display:none можно скрыть все сноски.)

arsenicum #48 Ответить
0

Импорт не видит разницы между i/em, b/strong
Не сказать, что это критично, но унификации препятствует.

arsenicum #59 Ответить
0

Добавил отображение комментов к новостям в ленте на главной. Буду тут о мелких багфиксах писать, на которые жалко тратить целый пост

andreymal #60 Ответить
0

Переделал вставлялку HTML-кода с гуглодоков. Проверьте, должны были исправиться некоторые косяки. Те, у кого всё работало, тоже проверьте, а то могли появиться новые косяки :)

andreymal #61 Ответить
0

Так, обнаружен критический баг. Текст из Ворда НЕ КОПИРУЕТСЯ, если в Ворде он был курсивом или полужирным курсивом. Т.е. всё остальное копируется нормально, а вместо курсивного текста — пусто.

GORynytch #62 Ответить
0

fxd

andreymal #63 Ответить
0

Ага, заметил. И вот, что мне выдал редактор при вставке текста (это два скриншота, из которых я вырезал нужное и соединил в один, красная линия разделяет две части из начала и конца главы):
Тебе надо бы, чтобы при вставке скрипт автоматически проверял на наличие рядом двух открывающих и/или закрывающих тегов, а также наличие подряд одинаковых открывающего и закрывающего или закрывающего и открывающего тега, между которыми нет ни единого символа, и всё это лишнее удалял.

GORynytch #64 Ответить
0

Возни много, эх. Попозже сделаю

andreymal #65 Ответить
0

Вроде сделал, проверь (и желательно проверить что ничего лишнего не удаляется :D )

andreymal #69 Ответить
+1

Немного порефакторил комменты, теперь можно изменить число комментов на одной странице (без учёта веток) в настройках. Если установить 1000 (разрешённый максимум) и выставить максимальную глубину веток 0 (это отключает их сворачивание), то будет почти как на Табуне

andreymal #70 Ответить
Комментарий был отправлен на Луну
0

Вот косяк, что я поймал на смарте:Вот скрин сего безобразия.Иногда может прикрыть целую строчку, если названия нет.

+Почему-то текст на электронной книге очень близко лезет к краю экрана. Не мешает, правда, но иногда раздражает.

МакКлортман #72 Ответить
0

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

andreymal #73 Ответить
0

Добавил капчу от гостей-спамеров. Если у кого-то вдруг сломались комментарии, напишите об этом в комментариях

andreymal #74 Ответить
0

andreymal, маленький вопрос. Возможно ли сделать скачивание fb2 файлов без запаковки в архив?

Дядя Эскобар #75 Ответить
0

Наверно можно, а зачем?

andreymal #76 Ответить
0

Часть ридеров и телефонов крайне плохо дружат с архивами. Мой, к примеру, портит процентов 30 архивов при распаковке :-( Приходиться фики закидывать через компьютер.

Дядя Эскобар #77 Ответить
0

Чёт мда, тогда возможно сделаю

andreymal #78 Ответить
0

Сделано

andreymal #79 Ответить
0

Хех, с каких пор тут капча? Аж спамить захотелось глядя на неё.

Гость #81 Ответить
0

Заметил баг экспорта в FB2. Фрагменты текста, размеченные как цитаты (тег blockquote) в экспорте отсутствуют. Совсем.

dahl #82 Ответить
0

Блин, я в XSLT ничё не понимаю :(

andreymal #83 Ответить
0

Подучил XSLT, вроде починил. Кто-нибудь проверьте, работает ли сейчас FB2 на читалках вообще

andreymal #84 Ответить
0

Две разные читалки на iPad — работает правильно, blockquote отображается.

dahl #85 Ответить
0

Вот ещё один жук, держи:Похоже, из-за этой панельки весь этот сыр-бор. Помнишь?

Вот косяк, что я поймал на смарте: скрин сего безобразия. Иногда может прикрыть целую строчку, если названия нет.

МакКлортман #86 Ответить
0

То, что на этом скрине, починил

andreymal #87 Ответить
0

Ещё немного мелких улучшений:

— Добавлена кнопка отправки жалобы на комментарий для привлечения моего внимания

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

— Подсчёт слов стал более умным: тире в диалогах больше не считаются словами, разлеплены некоторые слипшиеся слова, слеплены некоторые разлипшиеся и т. п. В предпросмотр главы добавлен вывод количества слов в предпросматриваемой главе, чтобы можно было поиграться и разобраться, как сайт считает слова

Есть что сверхсрочного, что нужно побыстрее пофиксить? А то я хочу всё-таки к капитальному рефакторингу приступить, и будет немного не до фиксов

andreymal #88 Ответить
0

У меня пока ничего. Поздравляю с Новым Годом, Andreymal! Всего вам хорошего в следующем году. В особенности при работе с кодом. :)

МакКлортман #89 Ответить
0

Че, пацаны, Новый Год?))

Lohamigos #90 Ответить
0

Можете добавить возможность удаления своих комментариев (с теми же условиями, что и для их редактирования) или защиту от повторного отправления комментария, как на табуне?

Legat_89 #91 Ответить
0

Защиту от повторного можно, а удаление нихачу

andreymal #92 Ответить
Добавить новый комментарий
Докажите, что вы не робот:
Loading ReCaptcha...
...