/**************************************************************************
 *      Codice Javascript per la gestione dei servizi (Luglio 2007)       *
 *     =============================================================      *
 *  Nota per le versioni:                                                 *
 *  Il codice è scritto per il livello DOM-2; quindi funziona con poche   *
 *  modifiche sia su MSIE che su Nescape/Firefox. Le differenze più       *
 *  evidenti riguardano:                                                  *
 *  - LA GESTIONE DEGLI EVENTI:                                           *
 *  (MSIE) : oggetto window."event";                                      *
 *    proprietà: (clientX,clientY) / (offsetX,offsetY) / cancelBubble()   *
 *  (NNE) : oggetto "e" passato come parametro nelle funzioni handler     *
 *    proprietà: (pageX,pageY) / (layerX,layerY) / stopPropagation()      *
 *  - PROPRIETA' CSS per l'opacità:                                       *
 *  (MSIE) : style.filter="Alpha(opacity...)"                             *
 *  (NN) : style.opacity = [valore tra 0 e 1]                             *
 **************************************************************************/

var service = {
    // variabili globali
    isIE: false,                   // flag per browser Internet Explorer
    isNN: false,                   // flag per browser Netscape / Firefox
    oggi: new Date(),             // data odierna
    fadeCounter: 0,                // contatore per fade in/out
    imgObject: null,               // oggetto su cui applicare il fade
    fadeInOut: false,              // direzione del fade: (false=Out, true=In)
    tFade: null,                   // oggetto temporizzatore
    infoPanel: null,               // pannello per informazioni
    
    // ********** Variabili per il movimento del LOGO Dalubar ********************
    imgObjectLogo: null,           // oggetto logo
    offsetX: 0,                    // valore offset X per trascinamento logo
    offsetY: 0,                    // valore offset Y per trascinamento logo
    POS_TOP: 36,                   // posizione top DEFAULT del logo Dalubar
    POS_LEFT: 216,                 // posizione left DEFAULT del logo Dalubar
    targetTop: 0,                  // posizione top di arrivo del logo
    targetLeft: 0,                 // posizione left di arrivo del logo 
    cosTheta: 0,                   // coseno dell'angolo formato dal vettore di trascinamento
    sinTheta: 0,                   // seno dell'angolo formato dal vettore di trascinamento
    module:0,                      // modulo del vettore di trascinamento
    tLogo: null,                   // temporizzatore per il logo
    flagLogo: false,               // flag usato nel trascinamento del logo
    
    // ********** Variabili per la gestione della tastiera codice********************
    keySequence: null,
    
    // Dati costanti 
    dateMonth: ['Gennaio','Febbraio','Marzo','Aprile','Maggio','Giugno','Luglio','Agosto','Settembre','Ottobre','Novembre','Dicembre'],
    dateDay: ['Domenica','Lunedi','Martedi','Mercoledi','Giovedi','Venerdi','Sabato'],
    
    // ************** Lista di Immagini di cui effettuare il Preloading ****************
    srcImgPreload: [
        'images/logox_small.jpg', 'images/sfinfo.jpg', 
        'images/sos.jpg', 'images/dlbtris.jpg', 'images/auditorium.jpg'
    ],
    imgPreload: null,
    
    // ****************************** Rotate BANNER ************************************
    rotBanTitle: ['Sound of Spheres','Tic-Tac-Toe Dalubar','Il progetto AUDITORIUM <br />(Tesi di laurea in informatica by Dalubar)'],
    rotBanImage: ['images/sos.jpg', 'images/tris.jpg', 'images/auditorium.jpg'],
    rotBanLink: ['Varie/index.php?id=1', 'Varie/index.php?id=3', 'Varie/index.php?id=2'],
    rotBanDesc: [
            'Immerge un ipotetico visitatore all\'interno di un ambiente sospeso nello spazio, nel quale potr&agrave; ' +
                'effettuare varie esperienze di ascolto musicale. All\'interno di tale ambiente, infatti, è presente una ' +
                'piattaforma nella quale sono presenti quattro colonne, ognuno raffiguranti un diverso compositore.',
            'Implementazione realizzata interamente in linguaggio Java. Impiega un algoritmo che dimostra come ' + 
                'a questo gioco sia impossibile vincere, a meno di commettere errori.' +
                '<br />Richiede il Run-time Java installato sul computer.',
            'Applicazione, interamente realizzata in Java3D e MySQL; trasporta il visitatore all’interno di un ' + 
                'Auditorium virtuale nel quale è possibile visitare le diverse “aree” di cui è composto. ' + 
                'In ognuna di esse è possibile fare una diversa esperienza d’ascolto.'
    ],
    rotBanCounter: 0,
    
    // avvio dei servizi
    init: function () {
        // controlla requisiti DOM e tipo di browser
        if (!document.getElementById || !document.createTextNode) {return;}
        if (document.all) service.isIE = true;
        else if (document.layers || navigator.userAgent.indexOf("Gecko") != -1) service.isNN = true;        
        // preloading delle immagini del sito
        service.imgPreload = service.preloadImages(service.srcImgPreload);        
        // crea e aggiunge pannello informazioni e logo dalubar
        service.infoPanel = service.addInfoPanel();
        service.imgObjectLogo = service.addLogo();
        // gestisce il trascinamento del logo
        service.handlerLogo();
        // mostra orario
        service.showOra();
        // mostra Rotate Banner iniziando da uno casuale
        service.rotBanCounter = parseInt(Math.random() * service.rotBanTitle.length);
        service.showRotateBanner();
        // gestione dell'immagine che fa spostare il logo (casetta in alto a sx)
        service.handlerCasetta();
        // mostra area sorpresa dopo 2sec
        setTimeout('document.getElementById("frank").style.visibility = "visible";', 2000);
        // anti tasto destro nella pagina
        document.getElementsByTagName('body')[0].onmousedown = function (e) {
            var msg = 'Il tasto destro non è utile nella pagina.';
            if (service.isIE && event.button == 2) {alert(msg); event.cancelBubble = true; event.returnValue = true;}
            else if (service.isNN && e.button == 2) {alert(msg); e.stopPropagation(); e.preventDefault();}
        }
    },
    
    /* Sposta il logo quando si clicca sulla casetta della home page (dblclick fa ritornare)
        la var. globale isAdmin vale 'true' solo se l'admin ha avuto accesso vedi index.php
        in questo caso scostaLogo è kiamato col valore '0' (rientro non temporizzato)
    */
    handlerCasetta: function () {
        var hm = document.getElementById('home');
        hm.onclick = function () {service.scostaLogo(isAdmin ? 0 : 5000);}
        hm.ondblclick = function () {service.homeLogo();}
    },
    
    // crea un pannello x info e lo aggiunge al documento
    addInfoPanel: function () {
        var newPanel = document.createElement('div');
        var div = document.createElement('div');
        div.style.margin = '1px 1px 1px 50px';
        newPanel.style.width = '200px';
        newPanel.style.height = '150px';
        newPanel.style.position = 'absolute';
        newPanel.style.border='1px solid black';
        newPanel.setAttribute('id', 'mvinfo');
        newPanel.style.filter = "Alpha(opacity=0, finishopacity=0, style=0)";
        newPanel.style.opacity = 0;  //versione Mozilla/Firefox
        newPanel.style.backgroundImage = 'url('+service.imgPreload[1].src+')';
        newPanel.appendChild(div);
        document.getElementsByTagName('body')[0].appendChild(newPanel);
        // eventi del mouse
        newPanel.onmouseover = function() { service.startFade(service.infoPanel, true); }
        newPanel.onmouseout = function() { service.startFade(service.infoPanel, false); }
        return newPanel;
    },
    
    // crea e aggiunge <IMG> con il logo Dalubar e lo aggiunge al documento
    addLogo: function () {
        var newLogo = document.createElement('img');
        newLogo.style.width = '188px';
        newLogo.style.height = '151px';
        newLogo.style.position = 'absolute';
        newLogo.style.visibility = 'hidden';
        newLogo.setAttribute('src', service.imgPreload[0].src);
        newLogo.setAttribute('alt', 'Logo Dalubar...semovibile!');
        newLogo.setAttribute('id', 'logo');
        document.getElementsByTagName('body')[0].appendChild(newLogo);
        return newLogo;
    },
    
    
    // mostra il pannello informazioni (htmlContent: contenuto del pannello in formato html)
    showInfoPanel: function (x, y, htmlContent) {
        service.infoPanel.style.posTop = y;
        service.infoPanel.style.posLeft = x;
        // scrive il testo dentro il div contenuto in infoPanel (quello col margine sx)
        service.infoPanel.firstChild.innerHTML = htmlContent;
        service.startFade(service.infoPanel, true);
    },
        
    /*  Routine per l'avvio del FADE.
        avvia un fade IN/OUT sull'oggetto specificato. 
        inout == true -> FADEIN  inout == false -> FADEOUT
    */
    startFade: function (obj, inout) {
        service.imgObject = obj;
        service.fadeCounter = (inout)? 0 : 100;
        if (service.tFade) clearTimeout(service.tFade);
        service.fadeInOut = inout;
        service.fade();
    },

    // ferma un fade
    stopFade: function () {
        service.fadeInOut = false;
        if (service.fadeCounter == 100) service.fade();
    },

    /*   Routine di servizio. Applica dissolvenza in entrata/uscita in base al valore di service.fadeInOut
        NON CHIAMARE DIRETTAMENTE. La routine di ingresso è 'StartFade' !!!  
    */
    fade: function () {
        var velocity;
        // controlla browser
        if (service.isIE) {
            service.imgObject.style.filter="Alpha(opacity="+service.fadeCounter+", finishopacity=0, style=0)";
            velocity = 10;
        }
        else if (service.isNN) {
            service.imgObject.style.opacity = service.fadeCounter/100;
            velocity = 25;
        }
        else return;
        // logica del fade (all browser)
        if (service.fadeInOut == true) {
            if (service.fadeCounter<100) service.tFade = setTimeout('service.fadeCounter+=5; service.fade()', velocity);
        }
        else 
            if (service.fadeCounter>0) service.tFade = setTimeout('service.fadeCounter-=7, service.fade()', velocity);
    },    
    
    /******************************************************************
     ************* GESTIONE TRASCINAMENTO DEL LOGO ********************
     ******************************************************************/
    handlerLogo: function() {
        // posiziona il logo nella posizione di default
        service.moveLogo(service.POS_LEFT, service.POS_TOP);
        service.imgObjectLogo.style.visibility = 'visible';
        // mostra in dissolvenza
        service.startFade(service.imgObjectLogo, true);
        
        // ######################forse si puo levare######################
        if (service.isNN) {
            //document.captureEvents(Event.MOUSEMOVE);
        }
        
        // ***** assegna HANDLER eventi *****
        service.imgObjectLogo.onmousedown = function (e) {
            // memorizza la posizione del cursore relativa all'interno del logo
            service.offsetX = (service.isIE) ? event.offsetX : e.layerX;
            service.offsetY = (service.isIE) ? event.offsetY : e.layerY;
            service.flagLogo = true;
            // azzera timer nel caso fosse già attivato
            clearTimeout(service.tLogo);
            // permette di all'evento di mouseover di verificarsi
            return false;
        }
        
        service.imgObjectLogo.onmousemove = function (e) {
            if (service.isIE) {
                if (event.button == 1) { //tasto sx su IE ha valore "1"
                    // aggiorna posizione logo tenendo conto del punto in cui si è cliccato e dello scrolling della pagina
                    service.imgObjectLogo.style.top = (event.clientY - service.offsetY + document.getElementsByTagName("html")[0].scrollTop) + "px";
                    service.imgObjectLogo.style.left = (event.clientX - service.offsetX + document.getElementsByTagName("html")[0].scrollLeft) + "px";
                }
                // blocca propagazione eventi (versione IE)
                event.returnValue = false;
                event.cancelBubble = true;
            }
            else if (service.isNN) {
                if (e.button == 0 && service.flagLogo) { //tasto sx su NN ha valore "0"
                    // aggiorna posizione logo tenendo conto del punto in cui si è cliccato e dello scrolling della pagina
                    service.imgObjectLogo.style.top = (e.pageY - service.offsetY) + "px";
                    service.imgObjectLogo.style.left = (e.pageX - service.offsetX) + "px";
                }
                // blocca propagazione eventi (versione NN)
                e.stopPropagation();
            }
        }
        
        /* nel caso in cui il logo nn riesca a seguire il movimento del mouse, (movimento veloce del mouse
            in Firefox), allora si fa rientrare il logo nella posizione iniziale.
        */
        service.imgObjectLogo.onmouseout = function (e) {
            if (service.isNN && e.button == 0 && service.flagLogo) { //tasto sx su NN ha valore "0"
                // aggiorna posizione logo tenendo conto del punto in cui si è cliccato e dello scrolling della pagina
                service.flagLogo = false;
                service.moveLogo(service.targetLeft, service.targetTop);            
            }            
        }
        
        service.imgObjectLogo.onmouseup = function (e) {
            service.flagLogo = false;
            service.moveLogo(service.targetLeft, service.targetTop);
        }
    },

    /* Imposta nuove coordinate x il logo.
        Chiamando questa funz. si ottiene lo spostamento del Logo dalla 
        posizione corrente a quella specificata dai parametri. Viene calcolato
        modulo del vettore,seno e coseno dell'angolo formato da tale vettore 
        con gli assi.
    */
    moveLogo: function(newLeft, newTop) {
        service.targetTop = newTop;
        service.targetLeft = newLeft;
        var lentop = parseInt(service.imgObjectLogo.style.top) - service.targetTop;
        var lenleft = parseInt(service.imgObjectLogo.style.left) - service.targetLeft;
        service.module = Math.sqrt(Math.pow(lenleft, 2) + Math.pow(lentop, 2));
        service.cosTheta = lentop / service.module;
        service.sinTheta = lenleft / service.module;
        service.flagLogo = false;
        // avvia movimento
        service.backlogo();
    },

    /* Metodo chiamato da moveLOgo(), NON chiamare direttamente
        Sposta il logo nella posizione specificata da (service.targetTop, service.targetLeft)
        muovendosi nella direz del vettore (usa tecnica dei vettori geometrici).
    */
    backlogo: function() {
        // diminuisce la lunghezza del vettore (proporzionalmente a 1/10 della sua intensità)
        service.module -= (service.module/10) + .1;
        if (service.module > 0.1) {
            // calcola nuove coordinate in funzione dell'angolo: x = m * sen(theta); y = m * cos(theta) 
            service.imgObjectLogo.style.top = (service.targetTop + (service.module * service.cosTheta)) + "px";
            service.imgObjectLogo.style.left = (service.targetLeft + (service.module * service.sinTheta)) + "px";
            service.tLogo = setTimeout("service.backlogo()", 10);
        }
        else {
            // fine movimento: azzera timer e posiziona il logo nella posizione di default
            clearTimeout(service.tLogo);
            service.imgObjectLogo.style.top = service.targetTop + "px";
            service.imgObjectLogo.style.left = service.targetLeft + "px";
        }            
    },
    
    // sposta x il tempo ms il logo dalla sua posizione iniziale
    scostaLogo: function (ms) {
        service.moveLogo(service.POS_LEFT+501, service.POS_TOP+370);
        if (ms != 0) setTimeout("service.homeLogo();", ms);
    },
    
    // fa tornare il logo nella posizione di default
    homeLogo: function () {
        service.moveLogo(service.POS_LEFT, service.POS_TOP);
    },
    
    hilightthis: function(obj) {
        obj.style.border = '2px solid red';
        obj.style.filter = "Alpha(opacity=0, finishopacity=0, style=0)";
        service.startFade(obj, true);
    },
    
    /* Stampa la tastiera che si trova dietro il LOGO e ne gestisce la pressione dei tasti
       assegnando un ovento onclick per ogni pulsante, che aggiorna la stringa 'keySequence'.
       Ogni codice dve iniziare con * e finire con #. Esempio: *456# */
    printCodeKeyboard: function () {
        var symb = new Array('*', '0', '#');
        for (var j=0; j<4; j++) {
            document.write("<tr align='center'>");
            for (var i=1; i<=3; i++) {
                var n = (j*3)+i;
                if (n>9) n = symb[n-10];
                document.write("<td><input type='button' id='keycode_"+n+"' value='"+n+"' class='comb'></td>");
                // assegna evento onclick ai tasti, se si preme # invia richiesta Ajax
                document.getElementById('keycode_'+n).onclick = function () {
                    var outcode = document.getElementById('keycodeecho');
                    if (this.value == '#') ajax.sndReq('KEYCODE', service.keySequence);
                    else service.keySequence = (this.value == '*') ? '' : (service.keySequence + this.value);
                    if (service.keySequence) outcode.innerHTML = service.keySequence;
                    else outcode.innerHTML = "Digita Codice Accesso";
                }
            }
            document.write("</tr>");
        }
    },
    
    // Restituisce la data di oggi 
    getDayMessage: function () {
        var Wl;
        if (service.oggi.getHours() >= 0 && service.oggi.getHours() < 6) Wl="Buona notte";
        else if (service.oggi.getHours() >= 6 && service.oggi.getHours() <= 12) Wl="Buongiorno";
        else if (service.oggi.getHours() > 12 && service.oggi.getHours() < 18 ) Wl="Buon pomeriggio";
        else if (service.oggi.getHours() >= 18 && service.oggi.getHours() <22 ) Wl="Buona sera";
        else if (service.oggi.getHours() >= 22) Wl="Buona notte"; 
        Wl += ', oggi &egrave; <span style="color:#ff0000">' + service.dateDay[service.oggi.getDay()] + ' ' + service.oggi.getDate() +
              ' ' + service.dateMonth[service.oggi.getMonth()] + ' ' +  service.oggi.getFullYear() + "</span>";
        return Wl;
    },

    // Mostra la data formattata (hh:mm:ss)
    showOra: function () {
        var data = "";
        service.oggi = new Date();
        data += service.oggi.getHours()<10? "0"+service.oggi.getHours()+":" : service.oggi.getHours()+":";
        data += service.oggi.getMinutes()<10? "0"+service.oggi.getMinutes()+":" : service.oggi.getMinutes()+":";
        data += service.oggi.getSeconds()<10? "0"+service.oggi.getSeconds() : service.oggi.getSeconds();
        document.getElementById("orario").value = data;
        setTimeout("service.showOra()", 1000);
    },

    // mostra banner rotatorio
    showRotateBanner: function() {
        document.getElementById('promobanner').innerHTML = 
            "<h4>" + service.rotBanTitle[service.rotBanCounter] + "</h4>" +
            "<a href='"+ service.rotBanLink[service.rotBanCounter] + "' class='menu'>" +
                "<img src='"+ service.rotBanImage[service.rotBanCounter] + 
                    "' border='1' alt='Vai alla pagina dedicata.'>" +    
            "</a>" + "<br clear='all' /><br />" + service.rotBanDesc[service.rotBanCounter] + "<br />";
            service.rotBanCounter = ++service.rotBanCounter % service.rotBanTitle.length;
            setTimeout("service.showRotateBanner()", 60000);
    },

    /*  *** Preloading di immagini ***
		Restituisce un array di Image() contenente 
		le immagini che hanno il nome contenuto nell'Array nameImages()
	*/
    preloadImages: function (nameImages) {
        var arrayImages = new Array();
        for (var i = 0; i < nameImages.length; i++) {
            arrayImages[i] = new Image();
            arrayImages[i].src = nameImages[i];
        }
        return arrayImages;
    },
    
    // versione applicativo Dalubar Javascript
    version: function() {
        return "javascript v.1.0.5";
    }
}