Skip to main content

Sandbox

Sandbox - functions.js

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

Section Sandbox
Updated 07.12.2024

Описание

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

Функции

JSON2html#

JSON2html(json, iteration=0, text="") Описание: Преобразует JSON-объект в строку HTML с определенной структурой.

  • Параметры:
 * json: Объект или массив для преобразования.  
 * iteration: Уровень вложенности (используется для отступов).  
 * text: Входной текст, который будет добавлен в начало вывода.  
  • Возвращаемое значение: Строка HTML с цветным представлением ключей и значений JSON-объекта.

get_date_str#

get_date_str(d, vid, msec_needed) Описание: Преобразует объект Date в строку даты и времени.

  • Параметры:
 * d: Объект Date.  
 * vid: Формат даты (1 для день.месяц.год, другой формат для год-месяц-день).  
 * msec_needed: Если установлено в 1, добавляет миллисекунды к строке времени.  
  • Возвращаемое значение: Форматированная строка даты и времени.

timestampToDate#

timestampToDate(ts) Описание: Преобразует временную метку (в миллисекундах с 1 января 1970 года) в объект Date.

  • Параметры:
 * ts: Временная метка.  
  • Возвращаемое значение: Объект Date.

O, S, C#

  • O(i) { return typeof i == 'object' ? i : document.getElementById(i) }
  • S(i) { return O(i).style }
  • C(i) { return document.getElementsByClassName(i) }

Описание: Упрощенные функции для доступа к элементам DOM.

  • O: Возвращает объект, если передан объект, или элемент по его ID.
  • S: Возвращает стиль элемента.
  • C: Возвращает коллекцию элементов по имени класса.

line_ep#

line_ep(context, x1, y1, x2, y2, color) Описание: Рисует линию на холсте.

  • Параметры:
 * context: Контекст рисования (например, из canvas.getContext('2d')).  
 * x1, y1: Координаты начала линии.  
 * x2, y2: Координаты конца линии.  
 * color: Цвет линии.

fillRect_ep#

fillRect_ep(context, x1, y1, w, h, color) Описание: Заполняет прямоугольник на холсте определенным цветом.

  • Параметры:
 * context: Контекст рисования.  
 * x1, y1: Координаты верхнего левого угла прямоугольника.  
 * w: Ширина прямоугольника.  
 * h: Высота прямоугольника.  
 * color: Цвет заливки.

addHandler#

addHandler(object, event, handler) Описание: Добавляет обработчик события к объекту.

  • Параметры:
 * object: Объект, к которому добавляется обработчик.  
 * event: Название события (например, 'click').  
 * handler: Функция-обработчик события.

number_format#

number_format(number, decimals, dec_point, thousands_sep) Описание: Форматирует число с указанным количеством знаков после запятой и разделителями.

  • Параметры:
 * number: Число для форматирования.  
 * decimals: Количество знаков после точки.  
 * dec_point: Символ десятичного разделителя (по умолчанию '.').  
 * thousands_sep: Символ разделителя тысячных (по умолчанию ',').  
  • Возвращаемое значение: Отформатированное число в виде строки.

Данные

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

Пользовательские возможности

  • Отображение JSON: Функция JSON2html позволяет преобразовать сложные структуры данных в понятный формат HTML, что может быть полезно для отладки и представления информации пользователю.
  • Форматирование даты и времени: Функции get_date_str и timestampToDate позволяют легко преобразовать время из различных форматов во временные строки с удобочитаемым видом.
  • Рисование на холсте: Функции line_ep и fillRect_ep предоставляют простые инструменты для рисования графики на элементе <canvas>.
  • Обработка событий: Функция addHandler упрощает добавление обработчиков событий к DOM-элементам, обеспечивая совместимость с различными браузерами.
  • Форматирование чисел: Функция number_format позволяет форматировать числа в различных региональных стилях, что может быть полезно при работе с валютой и другими числами.

Continue Reading

Related Articles