import { Injectable, TemplateRef, EventEmitter } from '@angular/core';
import { Observable, of } from 'rxjs';

@Injectable()
export class ModalOptions {
    /**
     *  Includes a modal-backdrop element. Alternatively,
     *  specify static for a backdrop which doesn't close the modal on click.
     */
    backdrop?: boolean | 'static';
    /**
     * Closes the modal when escape key is pressed.
     */
    keyboard?: boolean;

    focus?: boolean;
    /**
     * Shows the modal when initialized.
     */
    show?: boolean;
    /**
     * Ignore the backdrop click
     */
    ignoreBackdropClick?: boolean;
    /**
     * Css class for opened modal
     */
    class?: string;
    /**
     * Toggle animation
     */
    animated?: boolean;
    /**
     * Modal data
     */
    initialState?: object;
    /**
     * 窗口标题
     */
    title: string;
    /** 标题前图标 */
    iconCls?: string;

    /** 显示头部 */
    showHeader?: boolean;
    /**
     * 显示关闭按钮
     */
    showCloseButton?: boolean;
    /**
     * 显示最大化按钮
     */
    showMaxButton?: boolean;
    /**
     * 显示最小化按钮
     */
    showMinButton?: boolean;

    /**
     * 窗口宽度
     */
    width?: number;
    /**
     * 窗口高度
     */
    height?: number;

    minWidth?: number;
    minHeight?: number;
    maxWidth?: number;
    maxHeight?: number;
    /** 窗口标题栏高度 */
    dialogHeaderHeight?: number;
    /** 窗口按钮区高度 */
    dialogFooterHeight?: number;

    dialogFooterStyles?: any;

    /**
     * 显示按钮区
     */
    showButtons?: boolean;
    /** 按钮对齐方式 */
    buttonAlign?: string;

    /** 按钮列表模板 */
    buttons?: TemplateRef<any> | DialogButton[];

    /** 启用拖拽功能 */
    draggable?: boolean;

    /** 启用调整尺寸大小 */
    resizable?: boolean;

    /** 是否启用滚动条 */
    enableScroll?: boolean;

    beforeOpen?: () => Observable<boolean>;
    beforeClose?: (modalRef: any, args?: any) => Observable<boolean>;
    opened?: ( p?: {[key: string]: any }) => void;
    closed?: (isCloseButtonClick: boolean | any, args?: any) => void;
    okText?: string;
    cancelText?: string;
    /** 弹窗类型：default，弹出组件、模板等；iframe,弹出iframe; ngFactory, 弹出ngFactory; */
    dialogType?: string;
    // 窗口适应内容自动
    fitContent?: boolean;
    // 窗口内容区域是否自动响应式
    areaResponse?: boolean;
    // 异常提示
    exception?: {
        date: string,
        message: string
    };
}

export interface DialogButton {
    text: string;
    cls?: string;
    iconCls?: string;
    disable?: boolean;
    defaultFocus?: boolean;
    handle?: (e) => any;
}

export const modalConfigDefaults: ModalOptions = {
    backdrop: 'static',
    keyboard: true,
    focus: true,
    show: false,
    ignoreBackdropClick: true,
    class: '',
    animated: true,
    initialState: {},
    width: 400,
    height: 350,
    minHeight: null,
    minWidth: null,
    maxHeight: null,
    maxWidth: null,
    title: 'Title is here.',
    showCloseButton: true,
    showMaxButton: true,
    showButtons: true,
    buttonAlign: 'center',
    draggable: true,
    resizable: true,
    enableScroll: true,
    beforeOpen: () => of(true),
    beforeClose: () => of(true),
    okText: '确定',
    cancelText: '取消',
    dialogHeaderHeight: 38,
    dialogFooterHeight: 50,
    dialogType: 'default',
    showHeader: true,
    fitContent: false,
    areaResponse: false
};

export const CLASS_NAME: any = {
    SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
    BACKDROP: 'modal-backdrop',
    OPEN: 'modal-open',
    FADE: 'fade',
    IN: 'in', // bs3
    SHOW: 'show' // bs4
};

export const SELECTOR: any = {
    DIALOG: '.modal-dialog',
    DATA_TOGGLE: '[data-toggle="modal"]',
    DATA_DISMISS: '[data-dismiss="modal"]',
    FIXED_CONTENT: '.navbar-fixed-top, .navbar-fixed-bottom, .is-fixed'
};

export const TRANSITION_DURATIONS: any = {
    MODAL: 300,
    BACKDROP: 150
};

export const DISMISS_REASONS = {
    BACKRDOP: 'backdrop-click',
    ESC: 'esc'
};