import { Component, OnInit } from '@angular/core';
import { Code } from './../../code/growl';
import {SelectItem} from "../../component/ing/common/selectitem";
import {Message} from "../../component/ing/common/message";
import {MessageService} from "../../component/ing/common/messageservice";

@Component({
  templateUrl: './growl.component.html',
  providers: [MessageService]
})
export class GrowlComponent implements OnInit {
	
	msgs: Message[] = [];
  	code = Code;
	headers: any[];
	parameters: any[];
	eventHeader: any[];
	eventValue: any[];
  	styleHeader: any[];
	styleValue: any[];
    constructor(private messageService: MessageService) {
        
    }

    ngOnInit() {
    	this.headers = [
	        {name : "名字"},
	        {name : "类型"},
	        {name : "默认"},
	        {name : "描述"}
	    ];
	    this.parameters = [
	        {name: "value",type: "array",default: "null",des: "要显示的消息数组。"},
	        {name: "sticky",type: "boolean",default: "false	",des: "定义时，咆哮消息不会在生命选项定义的时段之后自动删除。"},
	        {name: "life",type: "number",default: "3000",des: "在删除消息之前以毫秒显示消息的时间。"},
	        {name: "style",type: "string",default: "null",des: "组件内联样式。"},
	        {name: "styleClass",type: "string",default: "null",des: "组件的行内样式。"},
	        {name: "immutable",type: "boolean",default: "true ",des: "定义消息数据应该如何操作。"},
	        {name: "baseZIndex",type: "number",default: "0",des: "zindex的值用于分层。"},
	        {name: "autoZIndex",type: "boolean",default: "true",des: "是否自动管理分层。"},
	        {name: "key",type: "string",default: "null",des: "ID以匹配消息的键以启用基于服务的消息传递中的作用域。"}
	    ];

	    this.eventHeader = [
	    	{name:"名字"},
	    	{name:"参数"},
	    	{name:"描述"}
	    ]

	    this.eventValue = [
	    	{name: "onClose",param: "消息：删除消息",event: "消息关闭时调用的回调。"},
	    	{name: "onClick",param: "消息：点击消息",event: "单击消息时调用的回调。"},
	    	{name: "onHover",param: "消息：悬浮消息",event: "当鼠标进入消息时调用回调。"}
	    ]

	    this.styleHeader = [
	    	{name : "名字"},
	        {name : "元素"}
	    ];

	    this.styleValue = [
	    	{name : "ui-growl",el :"主容器元件。" },
	    	{name : "ui-growl-container",el :"集装箱的信息项目。" },
	    	{name : "ui-growl-item",el :"消息元素。" },
	    	{name : "ui-growl-icon-close",el :"消息中关闭图标" },
	    	{name : "ui-growl-image",el :"严重性图标。" },
	    	{name : "ui-growl-message",el :"集装箱的消息文本。" },
	    	{name : "ui-growl-title",el :"消息摘要。" }
	    ];

    }

    showSuccess() {
        this.msgs = [];
        this.msgs.push({severity:'success', summary:'Success Message', detail:'Order submitted'});
    }

    showInfo() {
        this.msgs = [];
        this.msgs.push({severity:'info', summary:'Info Message', detail:'PrimeNG rocks'});
    }

    showWarn() {
        this.msgs = [];
        this.msgs.push({severity:'warn', summary:'Warn Message', detail:'There are unsaved changes'});
    }

    showError() {
        this.msgs = [];
        this.msgs.push({severity:'error', summary:'Error Message', detail:'Validation failed'});
    }

    showMultiple() {
        this.msgs = [];
        this.msgs.push({severity:'info', summary:'Message 1', detail:'PrimeNG rocks'});
        this.msgs.push({severity:'info', summary:'Message 2', detail:'PrimeUI rocks'});
        this.msgs.push({severity:'info', summary:'Message 3', detail:'PrimeFaces rocks'});
    }
    
    showViaService() {
        this.messageService.add({severity:'success', summary:'Service Message', detail:'Via MessageService'});
    }
    
    clearViaService() {
        this.messageService.clear();
    }

    clear() {
        this.msgs = [];
    }

}