console.log('Hi_people!');
Приветствую, это моё первое сообщение здесь.
Представлюсь: я web-программист - любитель. Начинал я более 15 лет назад. Так как это моё хобби, то каких-то высоких целей в продвижении себе не ставил.
Второе хобби, но скорее всего основное, это что-то паять на свободную тему, можно назвать паятель-любитель. Можно ознакомиться здесь.
Эта платформа не способствует расписыванию кода web-программирования, но я попробую. Возможно даже что-то кому-то пригодится.. Ну или хотя бы просто для ознакомления.
Сегодня напишу пример двоичного счета в виде HTML страницы, естественно на JS, хотя можно и на PHP сварганить. Если заявки будут.
Итак, есть такая микруха CD4520, и ее аналоги типа HEF4520 и 176ИЕ10/561ИЕ10. Это двойной двоичный четырёхбитный счетчик. Код будет написан только для одного счетчика, для простоты понимания, битность вообще можно прописать любую, в рамках разумного конечно.
Для начала накинем на вентилятор шаблон HTML страницы:
Далее накинем-добавим стили:
Здесь(с 5 строки) прописан стиль фона страницы - черный, и то какой формы и цвета будет каждый элемент. У вас стили могут быть какими вашей душе угодно.
В div-ах id прописывать не нужно, они у меня остались(на картинке) после множественных экспериментов. В коде они не используются.
Ну и теперь собственно сам скрипт(пояснения ниже):
Итак, выше в коде у нас есть 4 элемента, фоновый цвет которых мы(я) собираемся менять. В 28 строке собираем их все в горсть охапку массив для упрощенного обращения к каждому в дальнейшем. Далее объявляем переменную-счетчик inter с присвоением значения ноль и соответствующего типа(integer) автоматически. Потому что если просто объявить let inter; то в дальнейшем коде скрипт не поймет какого типа эта переменная.
К примеру если объявить let inter; а далее в коде сделать inter++; то значение её будет Nan
Далее запускаем функцию. Функция нужна чтобы к ней можно было обращаться многократно, а точнее периодически с заданным интервалом. Внутри функции пробегаем по всем элементам и в зависимости от условий меняет или не меняет фоновый цвет элемента leds[i]. Далее нужно определить четность и кратность счетчика(индекса счетчика). В 36-й строке определяем четность для первого элемента. А также проверяем текущее состояние(статус) текущего цвета и меняем на противоположный. Аналогично(в 35 - 41 стр.) в следующих проверках кратности и статуса меняем ненужное на нужное состояние.
В 72 строке обнуляем последний\крайний элемент, а в 75 строке обнуляем счетчик.
В 79 строке как упоминалось выше, данная функция запускается в бесконечном режиме с заданным интервалом. Если интервал задать допустим в 50 мс., то пересчет будет в 10 раз быстрее.
Данный код в действии посмотреть и скопировать исходник можно здесь.