<%@page import="br.com.centralit.citcorpore.util.CitCorporeConstantes"%>
<%@page import="br.com.centralit.citcorpore.util.WebUtil"%>
<%@page import="br.com.centralit.citcorpore.bean.UsuarioDTO"%>
<%@page import="br.com.citframework.dto.Usuario"%>

<%@ taglib prefix="compress" uri="http://htmlcompressor.googlecode.com/taglib/compressor"%>

<%@include file="/novoLayout/common/include/iframe.jsp" %>

<!DOCTYPE html>
<compress:html
	enabled="true"
	jsCompressor="closure"
	compressCss="true"
	compressJavaScript="true"
	removeComments="true"
	removeMultiSpaces="true">
<html <%=(iframe != null) ? "data-iframe=\"" + iframe + "\"" : "" %>>
<head>
	<%@include file="/novoLayout/common/include/libCabecalho.jsp" %>
	<%@include file="/novoLayout/common/include/titulo.jsp" %>
	<link type="text/css" rel="stylesheet" href="${ctx}/novoLayout/common/include/css/template.css"/>
	<link rel="stylesheet" type="text/css" href="css/mapaDesenhoServico.css">
</head>
<cit:janelaAguarde id="JANELA_AGUARDE_MENU"  title="" style="display:none;top:325px;width:300px;left:500px;height:50px;position:absolute;"></cit:janelaAguarde>
<body>
	<div class="container-fluid fixed">
		<div class="navbar main hidden-print">
			<%@include file="/novoLayout/common/include/cabecalho.jsp" %>
			<%@include file="/novoLayout/common/include/menuPadrao.jsp" %>
		</div>

		<div id="wrapper">
			<!-- Inicio conteudo -->
			<div id="content">
				<div class="separator top"></div>
					<div class="row-fluid">
						<div class="innerLR">
							<div class="widget">
								<div class="widget-head">
									<h4 class="heading"><fmt:message key="mapaDesenhoServico.mapaDesenhoServico" /></h4>
								</div>
								<div class="widget-body collapse in">	
									<div id="tabs" class="tabsbar">
										<ul>
											<li class="active"><a href="#tab1-3" data-toggle="tab"><fmt:message key="mapaDesenhoServico.cadastro"/></a></li>
											<li><a href="#tab2-3" data-toggle="tab"><fmt:message key="mapaDesenhoServico.pesquisar"/></a></li>
										</ul>
									</div>
									<div class="tab-content">
										<div class="tab-pane active" id="tab1-3">
											<form name='form' action='${ctx}/pages/mapaDesenhoServico/mapaDesenhoServico'>
												<input type="hidden" name="idServico"  />
												<input type="hidden" name="idItemConfiguracao" />
												<input type="hidden" name="idImagemItemConfiguracao" />
												<input type="hidden" name="listaItensConfiguracaoSerializada" />
												<input type="hidden" name="idGerenteEvm" />
												<input type="hidden" name="ferramentaConexaoEvm" />
												<input type="hidden" name="idGerenteCorrelacaoEvm" />
												<input type="hidden" name="valorComboCorrelacaoSelecionado" />
												
												<div id="menu-mapa">
													<div class='row-fluid'>
														<div class='span12'>
															<h2 id="nomeServico"></h2>
														</div>
													</div>
												</div>
												<div id="menu-icones">
													<div class='row-fluid'>
														<div class='span12'>
															<div id="itens">
																<label class="tooltip_bottom"" title="<fmt:message key="mapaDesenhoServico.software"/>">
																	<img src="imagens/software.png" id="1" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.servidor"/>">
																	<img src="imagens/servidor.png" id="2" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.desktop"/>">
																	<img src="imagens/desktop.png" id="3" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)"  />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.notebook"/>">
																	<img src="imagens/notebook.png" id="4" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)"  />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.windows"/>">
																	<img src="imagens/windows.png" id="5" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.linux"/>">
																	<img src="imagens/linux.png" id="6" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.monitor"/>">
																	<img src="imagens/monitor.png" id="7" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.impressora"/>">
																	<img src="imagens/impressora.png" id="8" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.scanner"/>">
																	<img src="imagens/scanner.png" id="9" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.telefone"/>">
																	<img src="imagens/telefone.png" id="10" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.projetor"/>">
																	<img src="imagens/projetor.png" id="11" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
																<label class="tooltip_bottom" title="<fmt:message key="mapaDesenhoServico.switch"/>">
																	<img src="imagens/switch.png" id="12" draggable="true" class="itemInMenu icone" ondragstart="dragstart(event)" />
																</label>
															</div>
														</div>
													</div>
												</div>
												
												<canvas id="mapaServicos" class=''></canvas>
												
												<div id="menu-botoes">
													<div class='row-fluid'>
														<div class='span12' id="opcoes">
															<button type='button' name='btnGravar' id='btnGravar' class="lFloat btn btn-icon btn-primary" onclick="mapa.salvarServico();">
																<fmt:message key="citcorpore.comum.gravar"/>
															</button>
															<button type='button' name='btnImprimir' id='btnImprimir' class="lFloat btn btn-icon btn-primary" onclick="mapa.imprimirDesenhoMapaServicos()">
																<fmt:message key="citcorpore.comum.gerarImpressao"/>
															</button>
															<button type='button' name='btnImprimir' id='btnImprimir' class="lFloat btn btn-icon btn-primary" onclick="carregaCorrelacaoServico()">
																<fmt:message key="mapaDesenhoServico.gerenteCorrelacao"/>
															</button>
														</div>
													</div>
												</div>
											</form>
										</div>
										<div class="tab-pane" id="tab2-3">
											<div class="section"><fmt:message key="citcorpore.comum.pesquisa" />
												<form name="formPesquisa">
													<cit:findField formName="formPesquisa" lockupName="LOOKUP_SERVICO_DESENHO" id="LOOKUP_SERVICO_DESENHO" top="0" left="0" len="550" heigth="400" javascriptCode="true" htmlCode="true" />
												</form>
											</div>
										</div>
									</div>
								</div>
								<div id="POPUP_EDITAR_ITEMCONFIGURACAO" style="" title="<fmt:message key='itemConfiguracao.itemConfiguracao'/>" class="dialogEditarIC">
									<form name='formItemConfiguracao' style="width: 100%;">
										<div class="row-fluid">
											<div class="span12">
												<div class="row-fluid">
													<div class="span4">
														<label class=""><fmt:message key='itemConfiguracao.itemConfiguracao'/></label>
														<input class="span12" type="text" id="identificacao" name="identificacao" readonly="readonly" onclick="openDialogFramePesquisaIC('POPUP_PESQUISAR_ITEMCONFIGURACAO')">
													</div>
													<div class="span8">
														<label class=""><fmt:message key='citcorpore.comum.descricao'/></label>
														<textarea class="span12" rows="2" cols="103" id="txtDescricao" name="txtDescricao" maxlength="250"></textarea>
													</div>
												</div>
												
												<div class="row-fluid">
													<div class="span12">
														<button type="button" name="btSalvar" id="btSalvar" class="lFloat btn btn-icon btn-primary"><fmt:message key="citcorpore.comum.gravar" /></button>
														<button type="button" name="btLimpar" id="btnLimpar" class="lFloat btn btn-icon btn-primary" onclick="limpaFormItemConfiguracao();"><fmt:message key="citcorpore.comum.limpar" /></button>
														<button type="button" name="btExcluir" id="btExcluir" class="lFloat btn btn-icon btn-primary"><fmt:message key="citcorpore.comum.excluir" /></button>
														<button type="button" name="btDesvincularGerente" id="btDesvincularGerente" class="lFloat btn btn-icon btn-primary"onclick="excluirGerenteAtual(true);"><fmt:message key="mapaDesenhoServico.desvincularGerente" /></button>
													</div>
												</div>
											</div>
										</div>
									</form>
									<div id="evmGerentes" name="evmGerentes">
										<div id="tabs" class="tabsbar">
											<ul>
												<li id="li_inventory"><a href="#tab_gerente_1-3" data-toggle="tab" onclick="abaGerenteInventory()"><fmt:message key="mapaDesenhoServico.gerenteInventory"/></a></li>
												<li id="li_zabbix"><a href="#tab_gerente_2-3" data-toggle="tab" onclick="abaGerenteZabbix()"><fmt:message key="mapaDesenhoServico.gerenteZabbix"/></a></li>
												<li id="li_nagios"><a href="#tab_gerente_3-3" data-toggle="tab" onclick="abaGerenteNagios()"><fmt:message key="mapaDesenhoServico.gerenteNagios"/></a></li>
											</ul>
										</div>
										<div class="tab-content">
											<div class="tab-pane active" id="tab_gerente_1-3">
												<iframe id="iframeGerenteInventory" name="iframeGerenteInventory"  width="98%" style="position: absolute; height: 65%; border: none"></iframe>
											</div>
											<div class="tab-pane" id="tab_gerente_2-3">
												<iframe id="iframeGerenteZabbix" name="iframeGerenteZabbix"  width="98%" style="position: absolute; height: 65%; border: none"></iframe>
											</div>
											<div class="tab-pane" id="tab_gerente_3-3">
												<iframe id="iframeGerenteNagios" name="iframeGerenteNagios"  width="98%" style="position: absolute; height: 65%; border: none"></iframe>
											</div>
										</div>
									</div>
									
								</div>
									
								<div id="POPUP_PESQUISAR_ITEMCONFIGURACAO" style="" title="<fmt:message key="citcorpore.comum.pesquisa" />" class="dialogPesquisarIC section hide">
									<iframe id="popupitemc" name="popupitemc" width="100%" height="98%"></iframe>
								</div>
								
								<div id="POPUP_GERENTE_CORRELACAO" style="" title="<fmt:message key="mapaDesenhoServico.gerenteCorrelacao" />" class="dialogCorrelacaoEventos section hide">
									<div class="row-fluid">
										<div class="span12">
											<iframe id="iframeGerenteCorrelacao" name="iframeGerenteCorrelacao"  style="position: absolute; width: 98%; height: 96%; border: none"></iframe>
										</div>
									</div>
								</div>
						</div>
					</div>
				</div>
			</div>
			<!--  Fim conteudo-->
			<%@include file="/novoLayout/common/include/rodape.jsp" %>
			
			<script type="text/javascript" src="js/jquery.growl.js"></script>
			<script type="text/javascript" src="js/mapaDesenhoServico.js"></script>
			<script type="text/javascript" src="js/MapaDesenhoServicoCanvas.js"></script>
		</div>
	</div>
</body>
</html>
</compress:html>
