Login with Discord
https://memorydreams.github.io/sketchbook/
Это начиналось как задание на TheOdinProject, но я решил его немного усложнить. Точнее, я бегло прочитал задание, глянул работы других участников и подумал, что рисовать в этом невозможно. Глянул на их фичи и понял, что они какие-то дурацкие и совсем ненужные в реальном рисовании. И решил сделать лучше. В итоге я получил полноценную рисовалку с возможностью вывода картинки в PNG. При желании можно допилить возможность скейлить размер экспорта, и сделать это довольно просто, но мне лень этим заниматься. Пока что меня всё устраивает.
В особенности я горжусь тем, что мне удалось сделать безотрывное рисование. В проектах других участников, если быстро двигать мышкой, получится не линия, а пунктир. Я подозреваю, что это из-за того, что в промежуточных местах браузер просто не успевает зарегистрировать курсор в пикселе. Я решил эту проблему алгоритмом прямой линии. При рисовании между любыми двумя координатами будет проводиться прямая линия, кроме тех случаев, когда координаты на расстоянии одного пикселя друг от друга. Брагодаря этому, пробелы пунктира заполняются линиями и выглядит это огранично. Проблема возникает, только если быстро рисовать на большом полотне - мой браузер начинает подтормаживать.
В другие проектах многие делали фичу, которую они называли радужной кистью. На деле же это был простой рандомайзел цвета на каждом новом пикселе. Выглядело это ужасно и в реальном рисовании никто и никогда бы не стал пользоваться такой фичей. Я посмотрел на это и решил сделать нормальную радужную кисть, с массивом цветов, которые чередуются в строгом порядке. Сделал семицветный массив. Получилось явно лучше, чем у других участников, но цвета очень резко переходили друг в друга, из-за чего я решил сделать более плавные переходы. Нагуглил цвета плавной радуги и поставил их себе. Получилось шикарно. С этой кистью получаются приятные пастельные линии. Но это скорее игрушка, чем реально полезный инструмант. Мне просто хотелось сделать что-то лучше, чем у других.
Ещё, мне нравится функция заливки. Для неё я применил простой алгоритм заливки, завязанный на рекурсии. Это решение не идеально, так как иногда оно может выдавать ошибку, к тому же, применение рекурсивной заливки на достаточно больших отрезках может съесть всю память компьютера, но благо у меня эти отрезки достаточно маленькие.
Но что мне нравится больше всего, это результат смешания алгоритма заливки и радужной кисти. Отрезок покрывается приятным глазу радужным узором. Результат мне настолько нравится, что я каждое утро начинаю с того, что рисую черную окружность и заливаю её радугой. Этот ритуал наполняет меня энергией на весь день.
Когда я закончил и показал свою работу в дискорд канале TheOdinProject, я обнаружил, что задание, оказывается, требовало всего лишь заполнение пикселей цветом, когда мышка пролетает над ними. То есть, даже рисование по нажатию не потребовало. А радужный карандаш и другие дурацкие фичи были в секции "дополнительных баллов". Тогда мне стало понятно, почему работы других участников так сильно сосали, дело в спецификации.
Я понимаю, что если бы я делал всё по плану, я бы потратил на эту работу в десятки раз меньше времени (суммарно я пилил его четыре дня, с утра до вечера), но я всё равно не жалею об этом, так как, на мой взгляд, я получил бесценный опыт благодаря этому. Я столкнулся со значительно более сложными проблемами, чем предлогал курс, и, что самое главное, я их решил. Кроме того, теперь у меня есть законченный проект, которым я горжусь, и который всегда будет напоминать мне, что я что-то могу.
Осталось только придумать, как заменить нынешнее рисование на Ониксе на мой вариант... Потому что рисовать по пикселю, это не дело.
