Desenvolvimento

Teste 3 - Executando Novamente uma Função

Make it stop! Make it stop! (Click to make it stop!!)

Esta página executa uma mesma função ciclicamente, num tempo pré-determinado. Ela faz uso do método JavaScript setTimeout(), que possui como argumentos a função a ser executada e o tempo de intervalo.

Partes cruciais do código desta página:

<head>
   <style type="text/css">
      #texter {position: relative; visibility: visible}
   </style>
   <script type="text/javascript" src="../js/findDOM.js"></script>
   <script>
      time_delay = 500
      var domStyle = null
      var state = null
      var cdm_repeat = 0

      function setUpAnnoyUser(objectID,onOffon) {
         if (onOffon == 1) {
            cmd_repeat = 1
            domStyle = findDOM(objectID,1)
            domStyle.visibility = 'visible'
            state = 'visible'
            annoyUser()
         }
         else
            cmd_repeat = 0
      }

      function annoyUser() {
         if (cmd_repeat == 1) {
            if (state == 'hidden' || state == 'hide')
               domStyle.visibility = 'visible'
            else {
               if (state == 'visible' || state == 'show')
                  domStyle.visibility = 'hidden'
               else
                  domStyle.visibility = 'visible'
               }
            state = domStyle.visibility
            setTimeout('annoyUser()',time_delay)
            }
         else {
            domStyle.visibility = 'visible'
            return
         }
      }
   </script>
</head>

<body onLoad="setUpAnnoyUser('texter',1)">
   <p style="font-size: 15px; font-weight: bold">
      Make it stop! Make it stop! (Click to make it stop!!)
   </p>
   <div id="texter" align="center">
      <img src="../../images/photos/pht_Revisor.jpg" onClick="setUpAnnoyUser('texter',0)" />
   </div>
   <button onclick="window.location.reload()">Recarregar a Página</button>
</body>

A função setUpAnnoyUser() prepara os valores iniciais de algumas das variáveis que, em seguida, são executadas na função annoyUser(). As variáveis usadas nas funções são:

time_delay - representa uma constante de tempo em milissegundos (1.000ms = 1s).
domStyle - variável que virá a absorver os estilos do argumento objectID por meio da função findDom(), mostrada na página de teste anterior.
state - variável que indica o estado de visibilidade do objeto manipulado (id = "texter").
cmd_repeat - variável booleana para acionamento ou não da rotina de repetição na função annoyUser().

Quando a página é inicialmente carregada, o argumento onOffon da função setUpAnnoyUser() é 1, o que aciona a repetição (cmd_repeat = 1), atribui os estilos do objeto objectID ("texter") à variável domStyle, define o estado do objeto como visible e chama a rotina annoyUser().

Uma vez que a variável cmd_repeat é 1, a função annoyUser() checa qual é o estado (state) do objeto e o alterna (visible -> hidden; hidden -> visible), a seguir atribuindo o valor do estilo visibility à variável state. Além disso, ela estabelece o tempo de auto-acionamento pelo método setTimeout(). Isso é feito porque chamar a função dentro dela mesma causa bugs no Netscape!!!!.

Quando a imagem recebe um clique, a função setUpAnnoyUser() é novamente chamada. Só que, desta vez, o argumento onOffon é 0, e isso faz como que o comando de repetição cmd_repeat seja desabilitado. Na próxima vez em que a rotina annoyUser() é executada, a visibilidade do objeto é fixada em visible e a função é encerrada. A figura assombrosa do Revisor de texto permanece agora sempre visível.

Logo, a função setUpAnnoyUser() é usada para ligar e desligar o "efeito irritante" do pisca-pisca. Basta, nos eventos desejados, referir o objeto que deve piscar e ativar ou desativar a função (segundo argumento em 0 ou 1).

Nota: É verificado não apenas se o estado de visibilidade está definido como hidden ou visible, mas também hide ou show. Embora o Netscape 4 aceite o padrão hidden ou visible como entradas, ele na verdade registra esses valores como hide e show, sendo essas as saídas.