v0.0.1

Разработка:
- БД скрипт с начальными данными
- вывод списка номеров телефонов по группам

js/message.js

@@ -0,0 +1,100 @@
+class Message {
+    timer;
+
+    constructor() {
+        this.div = $('<div id="div-message"></div>');
+        this.div.css({
+            "position": "absolute",
+            "top": "10px",
+            "right": "20px",
+            "z-index": "1000"
+        });
+
+        $('body').append(this.div);
+    }
+
+    success(message, delay = 6000) {
+        this.print(message, delay, '#52b818', '#bffdc0');
+    }
+
+    warning(message, delay = 6000) {
+        this.print(message, delay, '#b8ae18', '#f8fdbf');
+    }
+
+    error(message, delay = 6000) {
+        this.print(message, delay, '#b96161', '#fddede');
+    }
+
+    print = function(message, delay, border, background) {
+        if (delay < 6000) delay = 6000;
+        let Timer = function(callback, delay) {
+            let timerId, start, remaining = delay;
+        
+            this.pause = function() {
+                clearTimeout(timerId);
+                remaining -= new Date() - start;
+            };
+        
+            this.resume = function() {
+                start = new Date();
+                clearTimeout(timerId);
+                timerId = setTimeout(callback, remaining);
+            };
+        
+            this.dead = function() {
+                clearTimeout(timerId);
+            };
+        
+            this.resume();
+        }
+
+        let newMessage = $(`<div class="message">${message}</div>`);
+
+        newMessage.css({
+            "border": `1px solid ${border}`,
+            "background-color": `${background}`,
+            "color": "#333",
+            "padding": "10px 30px",
+            "text-align": "center",
+            "display": "none",
+            "margin": "10px 0 0 0",
+            "width": "350px",
+            "opacity": "1",
+            "cursor": "pointer"
+        });
+
+        newMessage.hover(function(){
+            $(this).css({
+                "opacity": "1"
+            });
+        }, function(){
+            $(this).css({
+                "opacity": "0.3"
+            });
+        });
+
+        this.div.append(newMessage);
+
+        let opacityTimeout = setTimeout(function() {
+            newMessage.fadeTo(1000, 0.3);
+        }, 2500);
+
+        newMessage.fadeIn(500).mouseenter(() => {
+            clearTimeout(opacityTimeout);
+            this.timer.pause();
+        }).mouseleave(() => {
+            this.timer.resume();
+        }).click(() => {
+            this.timer.dead();
+            newMessage.fadeOut(0, function(){
+                this.remove();
+            });
+        });
+
+        this.timer = new Timer(() => {
+            newMessage.fadeOut(500, function(){
+                this.remove();
+            });
+        }, delay);
+    }
+}