<!--
                                         /sdmmhs+.                                                   
                                     `.hmmmmmmmmmd/.                                                
                                   odmmmmmmmmmmmmmmmy`                                              
                                 +dmmmmmmmmmmmmdmmmmmo                                              
                                 /mmmmmmmmmmmss+smmmmd                                              
                            `.   -ohmddssmmy/+oo/ommmh`                                             
                          `::o: -//:++/+//+//+s//osmm/                                              
                        `:/hdhsoho+so//o////////ssyo.                                               
                       `/ydmmmmhoso/oy/oo///++s/. ossoo/-                                           
                     `odmmmmmmmmdsh+/+y/+so/sy`  `soo++oss                                          
               -ssydddmmmmmdddmmmmd+//y/ossmmm+    +o+ss+-                                          
                ymmmmmmmmy+///+sdmmh//os++mmmmmo  -o/s.                                             
              --+ymmmmmmys+/////smmmyso+symmds++o.o/o-                                              
                -oodmmmo////////+mmmdshhydmm+///yo/+/                                               
               +o/ymmms//oo//////ymmmmmmmmmm++sosooy`                                               
              :o/+dmmmo/oy//////+mmmmmmmmmmyso/+osoo/                                               
            `+hssdmmmmo+y///////+mmmmmmmmmyy////+++y-                                               
          -hdmmmmmmmmm+y+/s//+sosdmmmmmmdho/////+oos                                                
         .+yddhmmmmmmdoo//soo+yoysdyho+///////+ssooy:                                               
         .``.y/+mmmmmhso/+ho/+yooyyy///////oshoo+/+++y       .o+                                    
            o+++mmmmmyy++h+/os/yoys+/////osos+/oso++oy:      :mh.`                                  
           :o+++yyso+y+/ss/+s/+y+yy///oydo/y//os//////++/:://omd+o-                                 
           s+/-:+/syhdy+so/so/+hssosoysymmhhooho+///////o//+sohso+/                                 
         .o++hmdmdmmmmmmdd+++os/+oyoosodmmmmmmmmmmyosooooo++/:sooos                                 
        `y++yoydmmmmmmmmmmmdhddyymmmddmmmmmmmmmmmh+yyyyyo.   `dy+/-----::-                          
        /os/s/+odmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmd/syyyyyyh-  -mh::-.:+:..:y.                        
        soo+s//soymmmmmmmmmmmmmmmmmmmmmmmmmmmmmmy+hyyyyyyh/:o/hh+/+s+-....so::::::                  
       .soo+s///osoydmmmmmmmmmmmmmhyssyydmmmmddhohyyyhhs/-:/s//-/sooo/..:yyoooooydo:--------::.     
       ++oo/s+////ooooydmmmmmmdyo+//++ooosyys+sysssssy:/oo+s/+s+/:--.-+yhyyyyyyhmmyooooooooooos:    
       s/o+/+s//////++//+ossososysyyhyyyyyyyyhhoooooy-....++/:...-/oyhysssssssshmmyoooooooooooos:   
   `/++h+os//oo+/////oo+/oossosyyyyyyyyyyyyyyyyhhoooso-.../-:/+shhyssssssssssssymyooooooooooossos:  
  -dysosyyyyso+oooo+ssso+/++yhyyyyyyyyyyyyyyyyyyydoooosysyyyysooyyyyyyyyyyyyyyyysooooooooooooosssh: 
 /hssssssssssssssssyoooossyyyyhhyyyyyyyyyyyyyyyyyhysssssssssssssssssssssssssssssssssssssyyyyyydhhyh 
 hyhhhshshhydhhhhhhhyhhyhhhyhhyhdhhhhhyyyyyyyyyyyydhhhhyhhhyhhhyhhyhhyhhyyyhyyhsyyyhhshshhhhyhhhyyh`
 hyhhhshshhshhhyyyyhyyhshhhshyyhhhshhshyyhyyyyyyyyydhhhyhhhyhhhyhhyhhyhhhhhhhhhyhhhhhydyhdddhddy/:. 
 ooydhhhdddhddssssssoooooooooo+o+ydddhhhhdyyyyyyyyyyd+:::::::::--------..........````.dhyyhysoos    
   sooyhhsyhdo                   hhddddhhhhyyyyyyyyyyh.                               ohhysdysos:   
  .yoosdyshhd`                 .shyyhhyhd--hyyyyyyyyyyh.                              .dhhsyysooy`  
  oooshhsyhdo                 /hyyyyyyyyyy+odhyyyyyyyyyh:                              syyysdysoo+  
 `yosydyyyyd`                 -syhyyyhhyyyyyyhhhhyyyyyyyh+````                         -hshyhhoooy. 
 oooshssyss:                          `:/+/:-::-.:+yyyyyyyhdddy.    .-::-.`             .:-` +oooos 
`yoooh                                              -syhyyyyhhhhssyhhyyyyh/                  `yooos/
+osoy-                                                ohyyyhhdhdyyyyyyyhy-                    /sosoy
ysyss
#`            
#      PROGRAMADOR
#      DIOGENES OLIVEIRA DOS SANTOS JUNIOR
#      WWW.DIOGENESJUNIOR.COM.BR
#      CONTATO@DIOGENESJUNIOR.COM.BR
#      
#      AGOSTO 2019 / FEVEREIRO 2020
#
#     “ESTAR OCUPADO NEM SEMPRE SIGNIFICA TRABALHO DE VERDADE. O OBJETIVO DE TODO TRABALHO É A PRODUÇÃO OU A REALIZAÇÃO E, PARA QUALQUER UM DESSES FINS, DEVE HAVER PREVISÃO, SISTEMA,  
#      PLANEJAMENTO, INTELIGÊNCIA E PROPÓSITO HONESTO, ALÉM DE TRANSPIRAÇÃO. PARECER FAZER NÃO É FAZER.
#
#
-->
<!DOCTYPE html>
<html lang="pt-br"><head>
<title>Beauty Connect</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui, viewport-fit=cover">
<meta name="theme-color" content="#D40F7D">

<!-- FAVICON -->
<link rel="shortcut icon" href="images/favicon.png">

<!-- VIEWS -->
<link type="text/css" rel="stylesheet" href="css/jsview.css"/>

<link rel="stylesheet" type="text/css" href="css/bootstrap.css" media="all" />

<link rel="stylesheet" type="text/css" href="css/style.css?v=3" />
<link rel="stylesheet" type="text/css" href="css/sweetalert2.min.css">
<!-- ICONES -->
<link rel="stylesheet" href="css/font-awesome.min.css">

<!-- OWL CAROUSEL -->
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">

<!-- GOOGLE FONTS -->
<link href="https://fonts.googleapis.com/css?family=Muli:300,400,600,700,900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700&display=swap" rel="stylesheet">

<link rel="stylesheet" type="text/css" href="css/amsify.suggestags.css">

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/loadingio/loading.css@v2.0.0/dist/loading.css">

<style type="text/css">

  .corpo-conteudo{
    position: relative;
    display: block;
    width: 100% !important;
    max-width: 100%;
    height: 100% !important;
    overflow-x: hidden !important; /* FUNDAMENTAL */
    overflow-y: hidden !important; /* FUNDAMENTAL */
  }

</style>



</head>
<body>

<!-- TODO CONTEÚDO DAS VIEWS SERÁ EXIBIDO AQUI -->
<div class="corpo-conteudo"></div>
<!-- TODO CONTEÚDO DAS VIEW SERÁ EXIBIDO AQUI -->


<!-- INPUT FLUTUANTE -->
<div class="input-flutuante-acessibilidade">
  <form id="form-input-flutuante" onsubmit="validarFormularioFlutuante(event)">
      <div class="form-group">
          <label>Nome do campo</label>
          <input type="text" name="fieldInputFlutuante" id="fieldInputFlutuante" class="form-control" placeholder="Digite nesse campo" required />
          <button class="btn btn-default" type="submit">ok</button>
      </div>
  </form>
</div>
<!-- INPUT FLUTUANTE -->


    <!-- BARRA DE NAVEGAÇÃO INFERIOR -->
    <div class="barra-navegacao">

      <div class="container">
        <div class="row">

          <div class="coluna-menu" style="text-align: center;" onclick="verFeed(); procMenu(2);">
             <div class="navegacao-principal menu-2" data-acao="feed">
                 <a href="javascript:void(0)">
                  &nbsp;
                 </a> Feed
             </div>
          </div>

          <div class="coluna-menu" style="text-align: center;" onclick="$JSView.goToView('viewPrincipal'); carregarEventos(); procMenu(1); ">
             <div class="navegacao-principal menu-1" data-acao="eventos">
               <a href="javascript:void(0)" >
                 &nbsp;
               </a> Eventos
             </div>
          </div>

          <div class="coluna-menu" style="text-align: center;" onclick="criarConteudo(); procMenu(3);">
             <div class="navegacao-principal menu-3" data-acao="criar-conteudo">
                 <a href="javascript:void(0)" >
                  &nbsp;
                 </a> Postar
            </div>
          </div>

          <div class="coluna-menu" style="text-align: center;" onclick="verificarSessao('perfil'); procMenu(4); //verPerfil();">
             <div class="navegacao-principal menu-4" data-acao="perfil">
                 <a href="javascript:void(0)"  >
                  &nbsp;
                 </a> Perfil
             </div>
          </div>

          <div class="coluna-menu" style="text-align: center;" onclick="emBreve(); procMenu(5); verLoja();">
             <div class="navegacao-principal menu-5" data-acao="loja">
                 <a href="javascript:void(0)"  >
                  &nbsp;
                 </a> Loja
             </div>
          </div>

        </div>
      </div>

    </div>
    <!-- BARRA DE NAVEGAÇÃO INFERIOR -->

    <!-- AVISOS -->
    <div class="modal-avisos" id="swipeme">
      <div class="aviso">
        <h3><img src="images/aviso.png" alt="Aqui o título do aviso"> <span></span></h3>
        <p>Carregando...</p>
      </div>
    </div>
    <!-- AVISOS -->



    <!-- COMPARTILHAMENTO -->
    <div class="modal-share" id="swipemeShare">
      <div class="aviso">
        <h3>Compartilhar<span></span></h3>
        <div class="row text-center">
           <!--<div class="col">
              <a href="javascript:void(0)" onclick="" title="Compartilhar no meu perfil">
                Compartilhar no meu perfil
              </a>
           </div>-->
           <div class="col">
             <a href="" target="_system" id="btnShareFacebook">
               <i class="fa fa-facebook"></i>
             </a>
           </div>
           <div class="col">
            <a href="" target="_system" id="btnShareTwitter">
               <i class="fa fa-twitter"></i>
            </a>
             
           </div>
           <div class="col">
            <a href="" target="_system" id="btnShareLinkedin">
               <i class="fa fa-linkedin"></i>
            </a>             
           </div>
           <div class="col">
            <a href="" target="_system" id="btnShareWhatsapp">
               <i class="fa fa-whatsapp"></i>
            </a>             
           </div>
        </div>
        <div class="text-center">
          <p>&nbsp;</p>
          <a href="javascript:void(0)" title="Cancelar" onclick="fecharShare();" style="text-decoration: underline;color: #747474;font-size: 13px;">
             Fechar
          </a>
        </div>
      </div>
    </div>
    <!-- COMPARTILHAMENTO -->


    <!-- AÇÕES DE POSTAGEM -->
    <div class="modal-acao-postagem" id="swipemeAcaoPostagem">
      <div class="aviso">
        <nav>

          <ul>

            <li>
              <a href="javascript:void(0)" title="Compartilhar via">
                <img src="images/share-post.svg" alt="Compartilhar via"> Compartilhar via
              </a>
            </li>

            <li>
              <a href="javascript:void(0)" title="Ir para a postagem" onclick="permalinkSinglePostagem()">
                Ir para a postagem
              </a>
            </li>
            
            <li class="notOwnerPost">
              <h4>
                <img src="images/denunciar.svg" alt="Denunciar está publicação"> Denunciar esta publicação
              </h4>
              <p>
                <a href="javascript:void(0)" title="Denunciar essa postagem" onclick="denunciarPostagem();">
                  Esse texto aqui explica sobre o que vai acontecer, se eu denunciar essa postagem.
                </a>
              </p>
            </li>
            
            <li class="yesOwnerPost">
              <a href="javascript:void(0)" title="Editar publicação" onclick="editarPostagemViaFeed();">
                 Editar postagem
              </a>
            </li>
            
            <li class="yesOwnerPost">
              <a href="javascript:void(0)" title="Remover publicação" onclick="removerPostagemViaFeed();">
                 Remover postagem
              </a>
            </li>
            
            <li>
              <p style="padding-top:12px;padding-left:0px;"><button type="button" onclick="fecharAcaoPostagem();" class="btn btn-primary">Cancelar</button></p>
            </li>
          
          </ul>

        </nav>
      </div>
    </div>
    <!-- AÇÕES DE POSTAGEM -->



  <div class="criar-conteudo">
    <div class="container">
       <div class="col-121">

         <div class="header-criar-conteudo">
           <div class="row">
             <div class="col-6">
                <a href="javascript:void(0)" title="Cancelar" onclick="fecharCriarConteudo();">
                  <img src="images/fechar-criar-conteudo.svg" alt="Fechar criar conteúdo">
                </a>
             </div>
             <div class="col-6 text-right">
               <button type="button" onclick="publicarConteudo();" id="btnPublicarConteudo" class="btn btn-primary" style="height: 43px;">PÚBLICAR</button>
             </div>
           </div>
         </div>
         
         <div class="imagem-perfil-usuario" style="background: url('images/perfil.png') #f2f2f2 no-repeat;background-size: cover;background-position: center center;">
           &nbsp;
         </div>
         
         <!--
         <div class="form-group">
           <select class="form-control" id="ondevamosCompartilhar" onchange="dentroDeUmGrupo(this.value)">
              <option value="">Publicar em toda a plataforma</option>
              <option value="grupo">Publicar dentro de um grupo</option>
           </select>
         </div>
       -->

         <div id="compartilharNoGrupo" class="form-group" style="display: none;">
           <input type="text" class="form-control" id="listaGruposCompartilhar" placeholder="Em qual grupo(s) quer compartilhar?">
         </div>

         <div class="form-group">
           <!--<textarea name="" class="form-control" rows="4" id="publicacaoContent" placeholder="O que você quer compartilhar?"></textarea>-->
           <style type="text/css">
              [contenteditable] {
                  -webkit-user-select: text !important;
                  user-select: text !important;
              }
           </style>
           <div class="context" id="publicacaoContent" contenteditable="true">
           </div>


         </div>
         
         <!-- CONTEÚDO TIPO VÍDEO -->
         <div class="area-video">
            <div class="from-group">
              <textarea class="form-control" rows="2" id="iframeVideoContent" placeholder="Copie e cole o link do YouTube ou Vimeo"></textarea>
            </div>  
            <div id="retornoIframeContent"></div>
            <div class="form-group text-center" style="padding-top: 13px;">
               <a href="javascript:void(0)" title="Verificar vídeo" onclick="verificarVideo();" style="color:#747474;font-size: 13px;">
                 Verificar vídeo
               </a>
            </div>
         </div>
         <!-- CONTEÚDO TIPO VÍDEO -->

         <!-- CONTEÚDO TIPO IMAGEM OU IMAGENS -->
         <div class="area-imagem-imagens">
           <form id="form_image" method="post" enctype="multipart/form-data" action="https://beautyconnect.com.br/api/v1-imagens-pub.php">
                             
               <div class="form-group">
                      <label for="imagem">Selecionar imagens</label>
                      <input type="file" id="imagem" name="imagem[]" accept="image/x-png,image/gif,image/jpeg" multiple>
               </div>

               <input type="hidden" name="id_usuario" id="areaImgensIdUsuario"  /> 
               <input type="hidden" id="qtd" name="qtd">              

            </form> 

            <div class="carregando">
                <p style="text-align: center;padding-top: 13px;">
                      <img src="images/icone.png" class="ld ld-bounce" alt="BeautyConnect" style="width: 40px;height: auto;margin-bottom: 20px;">
                      <br clear="both">
                </p>
                <p>Carregando</p>
                <p>&nbsp;</p>
                
            </div>


            <div id="visualizar">
            </div>
            <p id="cancelarApenasImagens" class="text-center">
               <a href="javascript:void(0)" onclick="miniCancelImages()" title="Cancelar apenas imagens">
                 Cancelar
               </a>
            </p>
         </div>
         <!-- CONTEÚDO TIPO IMAGEM OU IMAGENS -->
         
         <div class="form-group">
           <div class="label-tipo-midia"><a href="javascript:void(0)" onclick="myContentIsAImage();" title="Adicionar uma imagem"><i class="fa fa-picture-o" aria-hidden="true"></i> carregar imagem</a></div>

           <div class="label-tipo-midia"><a href="javascript:void(0)" onclick="myContentIsAVideo();" title="Adicionar um vídeo do YouTube"><i class="fa fa-youtube-play" aria-hidden="true"></i> link de vídeo</a></div>
         </div>
         
         <div class="feedback"></div>

         
       </div>
    </div>
  </div>




    <!-- CONFIRMAÇÕES DO USUÁRIO -->
    <div class="modal-confirmacao" id="swipemeConfirmacao">
      <div class="confirmacao">
        <h3><img src="images/aviso.png" alt="Aqui o título do aviso"> <span></span></h3>
        <p id="confirmacaoInstrucao">Carregando...</p>
        <div class="row2">
          
          <div class="col">
            <button type="button" class="btn btn-primary" id="acaoConfirmacao">Confirmar</button>
          </div>
          <div class="col">
             <button type="button" onclick="fecharConfirmacao();" class="btn btn-default">Cancelar</button>
          </div>
          
        </div>
      </div>
    </div>
    <!-- CONFIRMAÇÕES DO USUÁRIO -->





    
    <!-- MENU ADICIONAL LOJA -->
    <div class="menu-adicional-loja">
      
          <!-- FECHAR MENU LOJA -->
          <div class="fechar-menu-loja">
            <a href="javascript:void(0)" title="Fechar menu loja" onclick="abrirFecharMenuLoja();">
               <img src="images/fechar-menu-loja.svg" alt="Fechar menu loja">
            </a>
          </div>
          <!-- FECHAR MENU LOJA -->
          
          <!-- NAVEGAÇÃO PRINCIPAL -->
          <nav> 
            <ul>
              
              <li><a href="javascript:void(0)" onclick="abrirFecharMenuLoja(); aviso('Em breve','Estamos preparando novidades incríveis para você');" title="Meus pedidos"><img src="images/meus-pedidos-menu-loja.svg" alt="Meus Pedidos"> Meus pedidos</a></li>
              
              <li><a href="javascript:void(0)" onclick="abrirFecharMenuLoja(); aviso('Em breve','Estamos preparando novidades incríveis para você');" title="Favoritos"><img src="images/favoritos-menu-loja.svg" alt="Favoritos"> Favoritos</a></li>
              
              <li><a href="javascript:void(0)" onclick="abrirFecharMenuLoja(); aviso('Em breve','Estamos preparando novidades incríveis para você');" title="Dúvidas"><img src="images/duvidas-menu-loja.svg" alt="Dúvidas"> Dúvidas</a></li>
            </ul>
          </nav>
          <!-- NAVEGAÇÃO PRINCIPAL -->

    </div>
    <!-- MENU ADICIONAL LOJA -->


     <!-- MENU ADICIONAL MINHA CONTA -->
    <div class="menu-adicional-minha-conta">
      
          <!-- FECHAR MENU MINHA CONTA -->
          <div class="fechar-menu-minha-conta">
            <a href="javascript:void(0)" title="Fechar menu minha conta" onclick="abrirFecharMenuMinhaCampanha();">
               <img src="images/fechar-menu-loja.svg" alt="Fechar menu minha conta">
            </a>
          </div>
          <!-- FECHAR MENU MINHA CONTA -->
          
          <!-- NAVEGAÇÃO PRINCIPAL -->
          <nav>
            <ul>
              <li><a href="javascript:void(0)" onclick="meuPlano();" title="Meu plano"><img src="images/minha-conta-meu-plano.svg" alt="Minha assinatura"> Minha assinatura</a></li>
              <li><a href="javascript:void(0)" onclick="historicoPagamentos();" title="Histórico de pagamento"><img src="images/minha-conta-historico.svg" alt="Histórico de pagamentos"> Histórico de pagamentos</a></li>
              <li><a href="javascript:void(0)" onclick="duvidas();" title="Dúvidas"><img src="images/duvidas-menu-loja.svg" alt="Relatar um problema"> Relatar um problema</a></li>
            </ul>
          </nav>
          <!-- NAVEGAÇÃO PRINCIPAL -->

    </div>
    <!-- MENU ADICIONAL MINHA CONTA -->


    <!-- LOAD DE CARREGAMENTO -->
    <div class="load-de-carregamento">
        <div class="row">
          <div class="col-12">
             <img src="images/favicon.png" alt="BeautyConnect" class="ld ld-bounce">
             <p>carregando</p>
             <p style="padding-top: 15px;">
                  <a href="javascript:void(0)" style="text-decoration: none;font-size:12px;color: #212529" onclick="location.reload()">
                    Demorando muito? Cancelar
                  </a>
                </p>
          </div>
        </div>
    </div>
    <!-- LOAD DE CARREGAMENTO -->

    <!-- ALBUM DE FOTOS -->
    <div class="album-de-fotos">
       <div class="container">  

           <div class="header-album-de-fotos">
             <div class="row">
               <div class="col-3">
                  <a href="javascript:void(0)" title="Cancelar" onclick="fecharAlbum();">
                    <img src="images/fechar-criar-conteudo.svg" alt="Fechar album">
                  </a>
               </div>
               <div class="col-9 text-right">
                 <h3 id="nomeCampanhaAlbumFoto">Carregando...</h3>
               </div>
             </div>
             
           </div>

           <div id="conteudoAlbumFoto"></div>


       </div>
    </div>
    <!-- ALBUM DE FOTOS -->

    <!-- COMENTÁRIO -->
    <div class="container-comentario">
       <div class="container">  

           <div class="header-comentario">
             <div class="row">
               <div class="col-3" style="padding-left: 0px;">
                  <a href="javascript:void(0)" title="Cancelar" onclick="fecharAbaComentario();">
                    <img src="images/fechar-criar-conteudo.svg" alt="Cancelar comentário">
                  </a>
               </div>
               <div class="col-9 text-right">
                 <h3 id="nomeCampanhaAlbumFoto">COMENTÁRIOS</h3>
               </div>
             </div>
             
           </div>

           <div class="container-comentario-inner">
              
              <!-- OS COMENTÁRIOS SERÃO CARREGADOS AQUI --> 
              <div id="conteudoComentario">
              </div>
              <!-- FINAL OS COMENTÁRIOS SERÃO CARREGADOS AQUI -->

              <div class="input-comentario-flutuante">
                <div class="form-group has-feedback">
                   <textarea id="comentAreaUser" rows="3" class="form-control" placeholder="Escreva seu comentário aqui"></textarea>
                   <i class="fa fa-paper-plane" onclick="enviarComentario();"></i>
                </div>
              </div>

           </div>


       </div>
    </div>
    <!-- COMENTÁRIO -->


    <!-- AÇÕES SOBRE O COMENTÁRIO -->
    <div class="modal-acao-comentario" id="swipemeAcaoComentario">
      <div class="aviso">
        <nav>

          <ul>

            <li class="notOwnerPost">
              <h4>
                <img src="images/denunciar.svg" alt="Denunciar este comentário"> Denunciar este comentário
              </h4>
              <p>
                <a href="javascript:void(0)" title="Denunciar essa postagem" onclick="denunciarComentario();">
                  Esse texto aqui explica sobre o que vai acontecer, se eu denunciar esse comentário.
                </a>
              </p>
            </li>
            
            <li class="yesOwnerPost">
              <a href="javascript:void(0)" title="Remover comentário" onclick="removerComentario();">
                 Remover comentário
              </a>
            </li>
            
            <li>
              <p style="padding-top:12px;padding-left:0px;"><button type="button" onclick="fecharAcaoComentario();" class="btn btn-primary">Cancelar</button></p>
            </li>
          
          </ul>

        </nav>
      </div>
    </div>
    <!-- AÇÕES SOBRE O COMENTÁRIO -->


    <div class="actions-camera">
                  
                     <a href="javascript:void(0)" title="Capturar imagem" onclick="appCamera.takePicture();">
                          <img src="images/camera.png" alt="Capturar imagem" style="margin-top: -27px;margin-bottom: 5px;width: 46px;" />
                     </a>
                     <p>Clique no ícone acima para capturar a <br>fotografia e testar a calibragem</p>

                     <p>
                       <a href="javascript:void(0)" title="Cancelar o uso da camera" onclick="appCamera.stopCamera();">
                          Cancelar
                       </a>
                     </p>

                  </div>


    <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>

    <script type="text/javascript" src="https://cdn.rawgit.com/julmot/mark.js/6.1.0/dist/jquery.mark.min.js"></script>

    <script type="text/javascript" src="js/tether.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>


    <script src="js/dist/jquery.inputmask.bundle.js"></script>
    <script src="js/dist/inputmask/phone-codes/phone.js"></script>

    <script type="text/javascript" src="js/jquery.qrcode.min.js"></script>
    <script type="text/javascript" src="js/jquery.amsify.suggestags.js"></script>

    <script src="tinymce/tinymce.min.js"></script>
    <script src="idiomas/pt_BR.js"></script>
    
    <script type="text/javascript">
      
      /**
      *  ------------------------------------------------------------------------------------------------
      *
      *
      *   MODULO DA CAMERA (TIRAR FOTO)
      *
      *
      *  ------------------------------------------------------------------------------------------------
      */
      var totFotosAppend = 0;
      var saidaFotos = "";
      var appCamera = {

        
        startCameraAbove: function(){
          viewCamera();
          CameraPreview.startCamera({x: 0, y: 0, width: window.screen.width, height: window.screen.height, toBack: false, previewDrag: true, tapPhoto: true});
        },
        
        // CAMERA POR TRÁS DO HTML
        startCameraBelow: function(){
          viewCamera();
          CameraPreview.startCamera({x: 0, y: 0, width: window.screen.width, height:window.screen.height, camera: "back", tapPhoto: true, previewDrag: false, toBack: true});
        },

        startCameraBelowCalibragem:function(){
          viewCamera();
          CameraPreview.startCamera({x: 0, y: 0, width: window.screen.width, height:window.screen.height, camera: "back", tapPhoto: true, previewDrag: false, toBack: true});
        },

        stopCamera: function(){
          CameraPreview.stopCamera();
          leadsApp();
          ativarBackground();
          $(".actions-camera").fadeOut(500);
          $(".barra-navegacao").show(0);

          // FORÇAR O FECHAMENTO DA CAMERA (QUANDO NÃO UTLIZADA MAIS)
          QRScanner.destroy(function(status){
            console.log(status);
          });


        },

        stopCamera0: function(){
          CameraPreview.stopCamera();
          ativarBackground();
          $(".actions-camera").fadeOut(500);
          $(".barra-navegacao").show(0);
        },

        stopCamera2: function(){
          CameraPreview.stopCamera();
          voltarAoInicio();
          ativarBackground();
          $(".actions-camera").fadeOut(500);
          $(".barra-navegacao").show(0);
        },

        takePicture: function(){
          CameraPreview.takePicture({width:640, height:640, quality: 50},function(imgData){

            //document.getElementById('originalPicture').src = 'data:image/jpeg;base64,' + imgData;

            saidaFotos = localStorage.getItem("appendPictures");

            if(saidaFotos===null){ saidaFotos = ""; }
            
            var foto = 'data:image/jpeg;base64,'+imgData;

            saidaFotos = saidaFotos + `
                 
                      <!-- APPEND -->
                      <img src="${foto}" style="width:100%;height:auto" />
                      <!-- APPEND -->

            `;

            localStorage.setItem("appendPictures",saidaFotos);
            localStorage.setItem("cameraCalibrada",saidaFotos);

            ativarBackground();
            $(".barra-navegacao").show(0);

            $(".actions-camera").fadeOut(500);

            aviso("Deu certo!","A camêra do seu dispositivo foi calibrada com sucesso!");

            localStorage.setItem("cameraCalibrada","sim");

            leadsApp();

          
          });
        },

        switchCamera: function(){
          CameraPreview.switchCamera();
        },

        show: function(){
          
          CameraPreview.show();
        },

        hide: function(){
          
          CameraPreview.hide();
        },

        changeColorEffect: function(){
          var effect = document.getElementById('selectColorEffect').value;
          CameraPreview.setColorEffect(effect);
        },

        changeFlashMode: function(){
          var mode = document.getElementById('selectFlashMode').value;
          CameraPreview.setFlashMode(mode);
        },

        changeZoom: function(){
          var zoom = document.getElementById('zoomSlider').value;
          document.getElementById('zoomValue').innerHTML = zoom;
          CameraPreview.setZoom(zoom);
        },

        changePreviewSize: function(){
          window.smallPreview = !window.smallPreview;
          if(window.smallPreview){
            CameraPreview.setPreviewSize({width: 100, height: 100});
          }else{
            CameraPreview.setPreviewSize({width: window.screen.width, height: window.screen.height});
          }
        },

        showSupportedPictureSizes: function(){
          CameraPreview.getSupportedPictureSizes(function(dimensions){
            dimensions.forEach(function(dimension) {
              console.log(dimension.width + 'x' + dimension.height);
            });
          });
        },

        init: function(){
          document.getElementById('startCameraAboveButton').addEventListener('click', this.startCameraAbove, false);
          document.getElementById('startCameraBelowButton').addEventListener('click', this.startCameraBelow, false);

          document.getElementById('stopCameraButton').addEventListener('click', this.stopCamera, false);
          document.getElementById('switchCameraButton').addEventListener('click', this.switchCamera, false);
          document.getElementById('showButton').addEventListener('click', this.show, false);
          document.getElementById('hideButton').addEventListener('click', this.hide, false);
          document.getElementById('takePictureButton').addEventListener('click', this.takePicture, false);
          document.getElementById('selectColorEffect').addEventListener('change', this.changeColorEffect, false);
          document.getElementById('selectFlashMode').addEventListener('change', this.changeFlashMode, false);

          if(navigator.userAgent.match(/Android/i)  == "Android"){
            document.getElementById('zoomSlider').addEventListener('change', this.changeZoom, false);
          }else{
            document.getElementById('androidOnly').style.display = 'none';
          }

          window.smallPreview = false;
          document.getElementById('changePreviewSize').addEventListener('click', this.changePreviewSize, false);

          document.getElementById('showSupportedPictureSizes').addEventListener('click', this.showSupportedPictureSizes, false);

          // legacy - not sure if this was supposed to fix anything
          //window.addEventListener('orientationchange', this.onStopCamera, false);
        }
      };

      document.addEventListener('deviceready', function(){  
        
        appCamera.init();
        console.log("APP CAMERA INIT COM SUCESSO");
        
      }, false);



    </script>

    
    <script type="text/javascript" src="js/scripts.js?v=1.33G"></script>
    <script type="text/javascript" src="js/sweetalert2.min.js"></script>

     <!-- VIEWS -->
    <script type="text/javascript">
      // PAGINA PRINCIPAL DAS VIEWS
      var paginaSessao = "index.html";
    </script>


    <!-- ############## UPLOAD DE IMAGENS ############## -->
    <script type="text/javascript" src="js/jquery.form.js"></script>
    <script type="text/javascript">
     
     // INIT IN JQUERY
     jQuery(document).ready(function ($) {
       $('#imagem').on('change',function(){
         var files = $(this)[0].files;
         $("#qtd").val(files.length);
         console.log("QTD IMAGENS SELECIONADAS: "+files.length);
         //$('#visualizar').html('Enviando... pode levar alguns minutos');
         $(".criar-conteudo .carregando").fadeIn("500");
         //$("#form_image").fadeOut("100");
         $("#cancelarApenasImagens").fadeIn("500");
         /* Efetua o Upload */
         $('#form_image').ajaxForm({
          //target:'#visualizar' // o callback será no elemento com o id #visualizar
          dataType:  'json',
          success:   processJson 
         }).submit();
       });

       function processJson(dados) { 
            // 'data' is the json object returned from the server 
            console.log("%c RETORNO SOBRE O ENVIO DAS IMAGENS (UPLOAD):","background:#ff0000;color:#fff;");
            console.log(dados); 
            
            // ESCONDER O CARREGANDO
            $(".criar-conteudo .carregando").fadeOut("0");
            
            // SALVAR NA SESSÃO OS DADOS QUE O USUÁRIO CRIOU
            localStorage.setItem("conteudoImagensUpload",JSON.stringify(dados));

            if(dados.erros===null){
            
                // ALIMENTAR O HTML
                if(dados.dados.length==1){
                   $("#visualizar").html('<img src="'+dados.dados[0].imagem+'" style="width:100%;height:auto;" />');
                }else{
                  for(var i = 0;i<dados.dados.length;i++){
                    $("#visualizar").append('<div class="mini-preview" style="background:url(\''+dados.dados[i].imagem+'\') #f2f2f2 no-repeat;background-size:cover;background-position:center center;">&nbsp;</div>');
                  }
                }

            }else{
              
              $("visualizar").html('<div class="alert alert-danger">'+dados.erros+'</div>');              

            }

            $('#imagem').resetForm();

        }

      });
      // FINALLY THE JQUERY


    </script>
    <!-- ############## UPLOAD DE IMAGENS ############## -->
    



    <!-- ##### BETTER SEARCH ##### -->
    <div class="better-search" id="betterSearch">
       
       <div class="header-better-search">
         <a href="javascript:void(0)" title="voltar" onclick="fecharBetterSearch()">
            <img src="images/voltar-rocho.svg" alt="Voltar"> <span>Pesquisar</span>
         </a>
       </div>

       <div class="form-group has-feedback">
          <input type="text" class="form-control" onkeyup="filtroBetterSearch();" id="betterSearchField" placeholder="Digite o que procura nesse campo">
          <i class="fa fa-search"></i>
       </div>

       <nav>
         <ul id="dadosResultadosGerais">
                           <div class="load-wrapp">
                              <div class="load-10">
                                <p>Carregando resultados</p>
                                <div class="bar"></div>
                              </div>
                            </div>
         </ul>
         <ul id="dadosResultadosEventos">
         </ul>
         <ul id="dadosResultadosFeed">
         </ul>
         <ul id="dadosResultadosGrupos">           
         </ul>
         <ul id="dadosResultadosConversas">           
         </ul>
       </nav>

    </div>
    <!-- ##### BETTER SEARCH ##### -->


    <script type="text/javascript" src="js/jsview.js?v=1.22B"></script>
    <script type="text/javascript" src="js/controllers.js?v=1.22"></script>
    <script type="text/javascript" src="js/app-views.js?v=1.22"></script>

    <script src="js/owl.carousel.js"></script>

    <script type="text/javascript" src="js/jquery.touchSwipe.min.js"></script>
    <script type="text/javascript">

          // SE O USUÁRIO FIZER UM GESTURE PARA A PARTE INFERIOR DA PÁGINA
          // VAMOS FECHAR A LAYER DO CARRO, CASO ELA ESTEJA ABERTA

          $("#swipeme").swipe({
            swipe:function(event, direction, distance, duration, fingerCount) {

              if(direction=="down"){

                $(".modal-avisos .aviso").css("bottom","-30%");
                $(".modal-avisos").fadeOut(500);

              }

            }
          });



        $("#swipemeShare").swipe({
            swipe:function(event, direction, distance, duration, fingerCount) {

              if(direction=="down"){

                $(".modal-share .aviso").css("bottom","-30%");
                $(".modal-share").fadeOut(500);

              }

            }
          });


          $("#swipemeAcaoPostagem").swipe({
            swipe:function(event, direction, distance, duration, fingerCount) {

              if(direction=="down"){

                $(".modal-acao-postagem .aviso").css("bottom","-30%");
                $(".modal-acao-postagem").fadeOut(500);

              }

            }
          });

          $("#swipemeAcaoComentario").swipe({
            swipe:function(event, direction, distance, duration, fingerCount) {

              if(direction=="down"){

                $(".modal-acao-comentario .aviso").css("bottom","-30%");
                $(".modal-acao-comentario").fadeOut(500);

              }

            }
          });
          

          $("#swipemeConfirmacao").swipe({
            swipe:function(event, direction, distance, duration, fingerCount) {

              if(direction=="down"){

                $(".modal-confirmacao .confirmacao").css("bottom","-30%");
                $(".modal-confirmacao").fadeOut(500);

              }

            }
          });

          // TESTAR DISPONIBILIDADE API
          testeApi();

          // CARREGAR OS EVENTOS
          setTimeout("verFeed()", 2000);

    </script>
    

    <!--<script data-consolejs-channel="4eb78d5b-5387-1231-567c-f8be08248918" src="https://remotejs.com/agent/agent.js"></script>-->
    <!--
    <script type="text/javascript" src="CameraPreview.js"></script>
    <script type="text/javascript" src="cordova.js"></script>
    -->

</body>
</html>