Лента тем форума «Программирование» и его подфорумов за год

 

Balancer

администратор
★★★★★

Очередной пост в рамках «возвращения на форум», чтобы не растекаться по другим ресурсам. Может, кому-то пригодится по-мелочи.

Жена на сайте делает ссылки на разделы в виде картинок. И накладывает на них надписи вручную в графическом редакторе:

Сейчас ей, похоже, надоело и она спросила, нельзя ли это как-то автоматизировать :)

Пишет страницы она в Grav'е в разметке Markdown. Понятно, что при этом можно делать вставки на чистом HTML и написать что угодно, но это не спортивно! Мне давно интересно реализовывать что-то расширенное в рамках синтаксиса и идеологии Markdown. Кстати, этот пост эксперимента ради как раз на Markdown пишется. Форум его уже неплохо поддерживает, кроме ряда привычных многим фишек, типа сниппетов ссылок и кеширования внешних картинок.

Картинки в Markdown вставляются с таким синтаксисом:

![](http://ссылка) 

Или, в неурезанном варианте:

![Alt-текст](http://ссылка) 

Ага! Первое же, что приходит в голову, использовать Alt-текст для визуального вывода поверх картинки. Ну и сама картинка может быть произвольного формата, а выводить нужно в фиксированном размере, в нашем случае 250x200px. Укажем всю эту обработку, задав CSS-класс картинки:

![Лабораторные животные](lab-mouse.jpg){.cover} 

Транслируется оно в HTML вида:

<img src="lab-mouse.jpg" alt="Лабораторные животные" title="" class="cover"> 

Оформление

Сперва опишем лимит размера картинки. Делаем её без полей, вписывая и обрезая лишнее в 250x500. Это сегодня совсем просто:

img.cover { width: 250px; height: 200px; object-fit: cover; } 

А вот дальше — сложнее. Вытащить поле alt из img средствами CSS невозможно. Нужно переходить к JavaScript. На том же jQuery поле alt достаётся в одно действие. И, раз мы уже это делаем, то оформим картинку с подписью в рамках современных стандартов. Сегодня это рекомендуется делать примерно так:

<figure> <img src="image.jpg" alt="Картинка"> <figcaption>Заголовок картинки</figcaption> </figure> 

Поехали:

$('img.cover').each(function() { var img=$(this); var alt = img.attr('alt'); img.wrap("<figure class=\"cover\"></figure>"); img.after("<figcaption>"+alt+"</figcaption>"); }); 

Готово. Теперь после загрузки страницы текст из поля alt рисуется под картинкой в виде:

<figure class="cover"> <img src="lab-mouse.jpg" alt="Лабораторные животные" title="" class="cover"> <figcaption>Лабораторные животные</figcaption> </figure> 

Осталось только раскрасить надпись и наложить её поверх картинки:

figure.cover { position: relative; width: fit-content; display: inline-block; } figure.cover figcaption { position: absolute; bottom: 0; color: white; font-size: 24px; padding: 0 4px 4px 4px; display: block; width: 100%; text-align: center; text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.9), 0 0 2em rgba(0, 0, 0, 0.7); line-height: 1.0; } 

Результат:

 

FantomAK

опытный

Прошу помощи - озадачили тестовыми заданиями, спиной чую, что-то простейшее, но куда именно копать ума не приложу :eek:
"Сами мы не местные! Помогите чем можите!?"©
Вот текст:
1) Организовать взаимодействие из двух Excel файлов.
Приложенный файл «Журнал клиентских заявок» является источником данных. К нему подключаемся через ODBC или на прямую вторым файлом и строит отчёты:
a. Вывести в отдельной таблице кол-во заявок с детализацией по статусу для каждого исполнителя подразделения «Отдела эксплуатации ПО».
b. Посчитать среднее время выполнения заявок по всем подразделениям с датой исполнения – ноябрь. В расчет брать заявки со статусом «Отработан».
c. Вывести ответственных по заявкам, перечисленным на листе2.
2) Написать на Delphi или Lazarus Homepage программу импортирующую данные из «Журнал клиентских заявок» в базу данных PostgreSQL https://www.postgresql.org.
3) Написать T-SQL запрос при выполнении которого (в данных задания 2) выберутся заявки со статусом «Выполненные» отдела эксплуатации ПО.
 

Balancer

администратор
★★★★★
Часто стало требоваться управлять встроенными железками по последовательному каналу, из сети или как-то ещё. Конечно, первое, что тут приходит в голову — это Forth. Но нормальных готовых решений нет, всерьёз браться за свою реализацию некогда, так что на коленке обычно велосипедится всякое управление из потока по JSON и т.п.
Но такая возня утомила, так что решил попробовать потратить время и сделать под это дело Forth-библиотеку.
Готового ничего не нашёл, это именно либо полноценные Forth-прошивки, либо что-то совсем не-Фортовое…
Думаю о самом простом решении на прямом шитом коде с классической организацией словаря, с сохранением компилированного Форт-кода в RAM и/или EEPROM. Объёмы там смешные, даже по сравнению с Flash, но и задачи не грандиозные. Впрочем, надо подумать, может, R/O-часть и во Flash можно засунуть, не весь же словарь на низком уровне делать?
Реализовываться всё будет в виде Arduino-библиотеки, чтобы подключать её к стандартным программам. Скорее всего в виде нескольких независимых частей, самый минимальный базис для парсинга + опциональные типовые разделы по стандарту (CORE/TOOLS/разные EXT и т.п.) по мере надобности (если возникнет).
 

в начало страницы | новое
 
Поиск
Настройки
Твиттер сайта
Статистика
Рейтинг@Mail.ru