<%-- работа с картинками --%>
            var fb = {};
            fb.max = 0;
            Object.defineProperty(fb, "max", {
                enumerable: false
            });
            <%-- загрузка через кнопку --%>
            document.getElementById('file').addEventListener('change', function (evt) {
                load_files(evt.target.files);
            }, false);
            <%-- загрузка перетаскиванием --%>
            var target = document.getElementById("files");
            target.addEventListener("dragover", function (event) {
                event.preventDefault(); // отменяем действие по умолчанию
                $(target).css('pointer-events', 'avto');
            }, false);
            target.addEventListener("drop", function (event) {
                // отменяем действие по умолчанию
                event.preventDefault();
                load_files(event.dataTransfer.files);
            }, true);
            function load_files(files) {
                document.getElementById('close').setAttribute('disabled', '');
                document.styleSheets['style1'].cssRules[0].style.visibility = 'visible';
                var n = files.length;
                var a = 0;
                var urlFactory = window.URL || window.webkitURL;
                var listFiles = document.getElementById('list_files');
                for (var i = 0; i < n; i++) {
                    var sp = document.createElement('span');
                    sp.innerHTML = '█';
                    sp.dataset.num = 'pic' + (fb.max + i);
                    listFiles.appendChild(sp);
                }
                read_file(files[a]);
                function read_file(file) {
                    var reader = new FileReader();
                    reader.onloadend = function () {
                        console.log(fb.max, '       ', files[a].name);
                        fb['pic' + fb.max] = new Blob([reader.result], {type: "image/jpeg"});
                        $('#pic_div').append('<div class="pic_num" data-pic="' + fb.max + '">\n\
                    <div class="pic_title new_pic">\n\
                    <button class="bt_del"><img class="pic_del" src="pic/del_.png" alt="" /></button><span></span>\n\
                    </div>\n\
                    <img src="' + urlFactory.createObjectURL(fb['pic' + fb.max]) + '" alt=""/>\n\
                    </div>');
                        listFiles.querySelectorAll('span[data-num="pic' + fb.max + '"]')[0].style.color = 'red';
                        fb.max++;
                        if ((a++) < (n - 1)) {
                            read_file(files[a]);
                        } else {
                            var k = 1;
                            var x = document.getElementById('pic_div').querySelectorAll('div.pic_num:not(.delPic) span');
                            [].forEach.call(x, function (el) {
                                el.innerHTML = k++;
                            });
//                            saveOnOff(true);
                            document.getElementById('save').removeAttribute('disabled');
                        }
                    };
                    reader.readAsArrayBuffer(file);
                }
            }

                    function read_file(file) {

                        var reader = new FileReader();
                        reader.onloadend = function () {
console.timeEnd('чтение');
console.time('преобразование');
                            fb['pic' + fb.max] = new Blob([reader.result], {type: "image/jpeg"});
console.timeEnd('преобразование');
console.time('преобразование1');
                            $('#pic_div').append('<div class="pic_num" data-pic="' + fb.max + '">\n\
                    <div class="pic_title new_pic">\n\
                    <button class="bt_del"><img class="pic_del" src="pic/del_.png" alt="" /></button><span></span>\n\
                    </div>\n\
                    <img src="' + urlFactory.createObjectURL(fb['pic' + fb.max]) + '" alt=""/>\n\
                    </div>');
console.timeEnd('преобразование1');
                            listFiles.querySelectorAll('span[data-num="pic' + fb.max + '"]')[0].style.color = 'red';
                            fb.max++;
                            if ((a++) < (n - 1))
                            {
                                read_file(files[a]);
                            }
                            else
                            {
                                var k = 1;
                                var x = document.getElementById('pic_div').querySelectorAll('div.pic_num:not(.delPic) span');
                                [].forEach.call(x, function (el) {
                                    el.innerHTML = k++;
                                });
//                            saveOnOff(true);
                                document.getElementById('save').removeAttribute('disabled');
                            }
                        };
console.log('%s      %s ', fb.max, files[a].name);
console.time('чтение');
                        reader.readAsArrayBuffer(file);
                    }