Skip to content

Instantly share code, notes, and snippets.

View b-aleksei's full-sized avatar

Алексей b-aleksei

View GitHub Profile
@b-aleksei
b-aleksei / timer.js
Created May 14, 2021 08:31
timer
// const targetDate = new Date(Date.parse('2021-05-17T00:00:00')); // установить дату обратного отсчета
const targetDate = new Date(2021, 4, 16); // установить дату обратного отсчета
let days; let hours; let minutes; let seconds; // переменные для единиц времени
let interval = null;
const countdown = document.querySelector('.stock-timer-js'); // получить элемент тега
const addZero = (n) => {
return (n < 10 ? '0' : '') + n;
};
@b-aleksei
b-aleksei / custom-select.njk
Last active April 1, 2021 07:53
custom-select
<div class="custom-select active">
<div class="custom-select__title">Санкт-Петербург</div>
<div class="custom-select__content">
<input id="singleSelect0" type="radio" name="city" value="spb" checked />
<label for="singleSelect0" class="custom-select__label">Санкт-Петербург</label>
<input id="singleSelect1" type="radio" name="city" value="moscow" />
<label for="singleSelect1" class="custom-select__label">Москва</label>
<input id="singleSelect2" type="radio" name="city" value="vasuki" />
<label for="singleSelect2" class="custom-select__label">Новые Васюки</label>
<input id="singleSelect3" type="radio" name="city" value="samara" />
@b-aleksei
b-aleksei / ValidForm.js
Last active August 22, 2021 09:19
ValidForm
import {onFocusPhoneInput} from './onFocusPhoneInput';
const validationData = {};
const urlData = 'data/sendForm.json';
fetch(urlData).then((res) => res.json()).then((res) => {
Object.assign(validationData, res);
}).catch(() => {});
/*const getDataFromJson = function(url) {
const xhr = new XMLHttpRequest();
@b-aleksei
b-aleksei / rating.html
Last active February 18, 2021 18:27
star-rating
<fieldset class="rating">
<legend class="visually-hidden">Звездный рейтинг</legend>
<input id="film-1" type="radio" name="film" value="1">
<input id="film-2" type="radio" name="film" value="2">
<input id="film-3" type="radio" name="film" value="3">
<input id="film-4" type="radio" name="film" value="4" checked>
<input id="film-5" type="radio" name="film" value="5">
<label for="film-5" aria-label="5 звезд">
<svg width="44" height="43">
@b-aleksei
b-aleksei / input-password.js
Created February 18, 2021 08:40
input-password
export const showPassword = (btn) => {
const input = btn.parentElement.querySelector('input');
if (btn.classList.contains('show')) {
btn.classList.remove('show');
input.type = 'password';
} else {
btn.classList.add('show');
input.type = 'text';
@b-aleksei
b-aleksei / slider-range_index.html
Last active January 10, 2021 18:30
wc-slider
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Slider Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<wc-slider min="50" max="200" step="0" value="100"></wc-slider>
@b-aleksei
b-aleksei / double-range_dbrange.js
Last active January 10, 2021 18:30
WC-double-range
import Template from './template.js';
export default class Dbrange extends HTMLElement {
constructor() {
super();
this.root = this.attachShadow({mode: 'open'});
this.root.innerHTML = Template.render();
this.dom = Template.mapDOM(this.root);
this.eventNames = {
pointerdown: 'pointerdown',
@b-aleksei
b-aleksei / asideNav.js
Created November 22, 2020 12:20
asideNav
const emptyEl = document.createElement('div');
let isObserverSupport = false;
const easingOutQuint = (x, t, b, c, d) => c * ((t = t / d - 1) * t * t * t * t + 1) + b;
const smoothScrollFallback = (node, key, target) => {
const offset = node[key];
const gap = target - offset;
const duration = 1000;
let startTime = null;
const step = (t) => {
@b-aleksei
b-aleksei / smoothScroll.js
Last active September 16, 2021 15:24
smoothScroll
const easingOutQuint = (x, t, b, c, d) => c * ((t = t / d - 1) * t * t * t * t + 1) + b;
const makeScroll = (node, value, key = 'scrollTop') => {
let startTime = null;
const offset = node[key];
const gap = value - offset;
const duration = 1000;
const step = (t) => {
if (!startTime) {
@b-aleksei
b-aleksei / DateInputMask.js
Last active March 1, 2021 11:17
DateInputMask
input.addEventListener('keypress', function(e) {
if(/\D/.test(e.key)) {
e.preventDefault();
}
const len = input.value.length;
if(len === 1 || len === 4) {
setTimeout(() => {
input.value += '/';
})