import * as i0 from '@angular/core';
import { Pipe, EventEmitter, Component, Input, Output, HostListener, Directive, NgModule } from '@angular/core';
import { Color } from '@mintplayer/ng-bootstrap';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i2 from '@mintplayer/ng-bootstrap/for';
import { BsForModule } from '@mintplayer/ng-bootstrap/for';
import * as i3 from '@mintplayer/ng-bootstrap/progress-bar';
import { BsProgressBarModule } from '@mintplayer/ng-bootstrap/progress-bar';
import * as i4 from '@mintplayer/ng-bootstrap/list-group';
import { BsListGroupModule } from '@mintplayer/ng-bootstrap/list-group';
import { BsButtonTypeModule } from '@mintplayer/ng-bootstrap/button-type';

class BsFormatBytesPipe {
    transform(value, decimals = 2) {
        if (value === 0) {
            return "0 Bytes";
        }
        const k = 1024;
        const dm = decimals <= 0 ? 0 : decimals;
        const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
        const i = Math.floor(Math.log(value) / Math.log(k));
        return parseFloat((value / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
    }
}
BsFormatBytesPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFormatBytesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
BsFormatBytesPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: BsFormatBytesPipe, name: "bsFormatBytes" });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFormatBytesPipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'bsFormatBytes'
                }]
        }] });

class BsFileUploadComponent {
    constructor() {
        this.dropFilesCaption = 'Drop your files here';
        this.browseFilesCaption = 'Browse for files';
        this.placeholder = 'Drop files to upload';
        this.colors = Color;
        this.isDraggingFile = false;
        this.files = [];
        this.filesDropped = new EventEmitter();
    }
    onChange(event) {
        if (!event.target)
            return;
        if (!('files' in event.target))
            return;
        if (!event.target['files'])
            return;
        const files = event.target.files;
        if (!files)
            return;
        this.processDroppedFiles(files);
    }
    onDragOver(event) {
        event.preventDefault();
        event.stopPropagation();
        if (event.dataTransfer) {
            this.isDraggingFile = true;
            event.dataTransfer.effectAllowed = "copy";
        }
    }
    onDragLeave(event) {
        event.preventDefault();
        event.stopPropagation();
        this.isDraggingFile = false;
    }
    onDrop(event) {
        event.preventDefault();
        event.stopPropagation();
        this.isDraggingFile = false;
        if (event.dataTransfer && event.dataTransfer.files) {
            this.processDroppedFiles(event.dataTransfer.files);
        }
    }
    processDroppedFiles(fileList) {
        const newFiles = [...Array(fileList.length).keys()]
            .map(i => fileList.item(i))
            .filter(f => !!f)
            .map(f => ({ file: f, progress: 0 }));
        this.files.push(...newFiles);
        this.filesDropped.emit(newFiles);
    }
}
BsFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
BsFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BsFileUploadComponent, selector: "bs-file-upload", inputs: { dropFilesCaption: "dropFilesCaption", browseFilesCaption: "browseFilesCaption", placeholder: "placeholder", files: "files" }, outputs: { filesDropped: "filesDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, ngImport: i0, template: "<div class=\"dropzone border position-relative p-5\" [class.dragging]=\"isDraggingFile\">\n    <input type=\"file\" multiple #fileUpload (change)=\"onChange($event)\" [title]=\"placeholder\" [placeholder]=\"placeholder\" class=\"position-absolute w-100 h-100\">\n    <!-- <img src=\"/assets/ic-file-upload.svg\" [alt]=\"placeholder\"> -->\n    <span class=\"h3 d-block\">{{ dropFilesCaption }}</span>\n    <label class=\"btn btn-primary position-relative\" [bsFor]=\"fileUpload\">{{ browseFilesCaption }}</label>\n</div>\n<bs-list-group class=\"files-list\">\n    <bs-list-group-item *ngFor=\"let upload of files\">\n        <ng-container *ngTemplateOutlet=\"fileTemplate ?? defaultFileTemplate; context: { $implicit: upload }\"></ng-container>\n    </bs-list-group-item>\n</bs-list-group>\n\n<ng-template #defaultFileTemplate let-upload>\n    <div class=\"d-flex flex-row mx-auto\">\n        <div class=\"file-img\"></div>\n        <div class=\"flex-grow-1 text-start px-2\">\n            <span class=\"d-block text-truncate text-secondary\">{{ upload.file.name }}</span>\n            <span class=\"d-block text-grey mb-0\">{{ upload.file.size | bsFormatBytes }}</span>\n            <bs-progress [height]=\"4\">\n                <bs-progress-bar [minimum]=\"0\" [maximum]=\"upload.file.size\" [value]=\"upload.progress\"></bs-progress-bar>\n            </bs-progress>\n        </div>\n    </div>\n</ng-template>", styles: [".dropzone{z-index:1}.dropzone.dragging{border:4px solid #CB1535!important;background:#DC88A8;margin:-3px -3px -4px}.dropzone input{opacity:0;z-index:2;top:0;left:0}.dropzone .btn{z-index:5}.files-list{margin-top:-1px}.files-list .d-flex{max-width:400px}.text-grey{color:#999}.list-group span{margin:-5px auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BsForDirective, selector: "[bsFor]", inputs: ["bsFor"] }, { kind: "component", type: i3.BsProgressBarComponent, selector: "bs-progress-bar", inputs: ["minimum", "maximum", "value", "color", "striped", "animated"] }, { kind: "component", type: i3.BsProgressComponent, selector: "bs-progress", inputs: ["height", "isIndeterminate"] }, { kind: "component", type: i4.BsListGroupComponent, selector: "bs-list-group" }, { kind: "component", type: i4.BsListGroupItemComponent, selector: "bs-list-group-item" }, { kind: "pipe", type: BsFormatBytesPipe, name: "bsFormatBytes" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadComponent, decorators: [{
            type: Component,
            args: [{ selector: 'bs-file-upload', template: "<div class=\"dropzone border position-relative p-5\" [class.dragging]=\"isDraggingFile\">\n    <input type=\"file\" multiple #fileUpload (change)=\"onChange($event)\" [title]=\"placeholder\" [placeholder]=\"placeholder\" class=\"position-absolute w-100 h-100\">\n    <!-- <img src=\"/assets/ic-file-upload.svg\" [alt]=\"placeholder\"> -->\n    <span class=\"h3 d-block\">{{ dropFilesCaption }}</span>\n    <label class=\"btn btn-primary position-relative\" [bsFor]=\"fileUpload\">{{ browseFilesCaption }}</label>\n</div>\n<bs-list-group class=\"files-list\">\n    <bs-list-group-item *ngFor=\"let upload of files\">\n        <ng-container *ngTemplateOutlet=\"fileTemplate ?? defaultFileTemplate; context: { $implicit: upload }\"></ng-container>\n    </bs-list-group-item>\n</bs-list-group>\n\n<ng-template #defaultFileTemplate let-upload>\n    <div class=\"d-flex flex-row mx-auto\">\n        <div class=\"file-img\"></div>\n        <div class=\"flex-grow-1 text-start px-2\">\n            <span class=\"d-block text-truncate text-secondary\">{{ upload.file.name }}</span>\n            <span class=\"d-block text-grey mb-0\">{{ upload.file.size | bsFormatBytes }}</span>\n            <bs-progress [height]=\"4\">\n                <bs-progress-bar [minimum]=\"0\" [maximum]=\"upload.file.size\" [value]=\"upload.progress\"></bs-progress-bar>\n            </bs-progress>\n        </div>\n    </div>\n</ng-template>", styles: [".dropzone{z-index:1}.dropzone.dragging{border:4px solid #CB1535!important;background:#DC88A8;margin:-3px -3px -4px}.dropzone input{opacity:0;z-index:2;top:0;left:0}.dropzone .btn{z-index:5}.files-list{margin-top:-1px}.files-list .d-flex{max-width:400px}.text-grey{color:#999}.list-group span{margin:-5px auto}\n"] }]
        }], propDecorators: { dropFilesCaption: [{
                type: Input
            }], browseFilesCaption: [{
                type: Input
            }], placeholder: [{
                type: Input
            }], files: [{
                type: Input
            }], filesDropped: [{
                type: Output
            }], onDragOver: [{
                type: HostListener,
                args: ['dragover', ['$event']]
            }], onDragLeave: [{
                type: HostListener,
                args: ['dragleave', ['$event']]
            }], onDrop: [{
                type: HostListener,
                args: ['drop', ['$event']]
            }] } });

class BsFileUploadTemplateDirective {
    constructor(fileUploadComponent, templateRef) {
        fileUploadComponent.fileTemplate = templateRef;
    }
}
BsFileUploadTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadTemplateDirective, deps: [{ token: BsFileUploadComponent }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
BsFileUploadTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: BsFileUploadTemplateDirective, selector: "[bsFileUploadTemplate]", ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadTemplateDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[bsFileUploadTemplate]'
                }]
        }], ctorParameters: function () { return [{ type: BsFileUploadComponent }, { type: i0.TemplateRef }]; } });

class BsFileUploadModule {
}
BsFileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
BsFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadModule, declarations: [BsFileUploadComponent,
        BsFileUploadTemplateDirective,
        BsFormatBytesPipe], imports: [CommonModule,
        BsForModule,
        BsProgressBarModule,
        BsListGroupModule,
        BsButtonTypeModule], exports: [BsFileUploadComponent,
        BsFileUploadTemplateDirective,
        BsFormatBytesPipe] });
BsFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadModule, imports: [CommonModule,
        BsForModule,
        BsProgressBarModule,
        BsListGroupModule,
        BsButtonTypeModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BsFileUploadModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [
                        BsFileUploadComponent,
                        BsFileUploadTemplateDirective,
                        BsFormatBytesPipe
                    ],
                    imports: [
                        CommonModule,
                        BsForModule,
                        BsProgressBarModule,
                        BsListGroupModule,
                        BsButtonTypeModule,
                    ],
                    exports: [
                        BsFileUploadComponent,
                        BsFileUploadTemplateDirective,
                        BsFormatBytesPipe
                    ]
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { BsFileUploadComponent, BsFileUploadModule, BsFileUploadTemplateDirective, BsFormatBytesPipe };
//# sourceMappingURL=mintplayer-ng-bootstrap-file-upload.mjs.map
