Скачать

progressBar.js (v.0.1)

Если файл по клику просто открывается в Вашем браузере, щёлкните ссылку правой кнопкой мыши и выберите команду "Сохранить объект как...", "Сохранить ссылку как..." и т.п., в зависимости от браузера.

Код для простейшего вызова фреймворка:

    <script src="progressBar.js"></script>
    <p id="bar1">Простой прогресс-бар: 
     <script>
      let bar1 = new progressBar('bar1');
      bar1.setWidth(200);
      bar1.setState(50);
     </script>    
    </p>

Результат работы этого кода:

Простой прогресс-бар:

Здесь предполагается, что файл progressBar.js находится в одной папке с файлом HTML, содержащим разметку.

Зачем нужна эта библиотека?

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

Во вторых, поскольку стандартный элемент progress очень плохо стилизуется, не меняет предустановленного минимального значения "ноль" и выглядит совершенно по-разному в разных браузерах, мы сделаем свой небольшой Javascript-фреймворк для работы с таким функционалом.

Я реализовал свой фреймворк в виде класса. Следует учесть, что в настоящее время в Javascript нет полноценной поддержки разделения свойств и методов класса на приватные и публичные. Возможно, более надёжно делать код "дважды обёрнутым" -

  1. в анонимную самовызывающуюся функцию, куда мы аргументами передаём глобальный контекст, например, объект window, и
  2. во встроенный в функцию объект, внутрь которого уже инкапсулируется код.

Официальный сайт

Это - официальная страница фреймворка progressBar. Подробности смотрите на страницах документации и примеров.

Автору можно написать по адресу E-mail pers@mail.ru

Проект находится в разработке, возможны изменения и исправления.

Браузеры

Работа фреймворка проверена в актуальных версиях браузеров Google Chrome, Mozilla Firefox, Microsoft Edge, Opera. Браузер Internet Explorer в этой сборке не поддерживается (так как в нём не поддерживаются классы Javascript).

© Мой копирайт