Passa ai contenuti principali

chrome app - applicazione delle opzioni

abbiamo creato l'estensione di chrome come pupup e abbiamo creato la pagina delle opzioni di configurazione.
ora applichiamo la configurazione alla popup.

flusso

il flusso è semplice: 
  • l'utente fa click sull'estensione
  • l'estensione legge i dati del colore
  • il colore è applicato al background dell'estensione

codice

al codice della pop-up aggiungiamo le librerie jQuery e Storage API e Bootstrap
<!doctype html>
<html>

<head>
    <title>Ciao ragazzi!</title>
    <script src="lib/jquery.min.js"></script>
    <script src="lib/jQuery-Storage-API/jquery.storageapi.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body style="padding: 30px">
    <div class="container">
        <div class="row">
            <div class="span4 offset2 well">
                <h1>hello world!</h1>
            </div>
        </div>
    </div>
    <script src="popup.js"></script>
</body>

</html>
nel file popup.js è stata aggiunta la lettura della configurazione e l'applicazione del colore alla popup

$(document).ready(function() {

    var storage = $.localStorage;

    if (storage.isSet('color')) {

        var color = storage.get('color')
        $('body').css('background', color);
    }

});

più semplice di così
e ora potete scaricare l'esempio completo da github

comunque non è finita qui...... 

Commenti

Post popolari in questo blog

install language on osTicket

this simple guide aims you to install and configure your language on osTicket i written this guide based on forum post http://osticket.com/forum/discussion/76252/installing-language-pack

Ubuntu: La propria installazione di python è danneggiata. Correggere il collegamento simbolico «/usr/bin/python».

Questa è un problema, soprattutto se si vuole aggiornare la distribuzione.+
Dì la verità: hai pacioccato con le versioni di python vero? Volevi usare la 3.5 e non 2.7 e così hai aggiunto alternatives o manipolato il symlink.
No? io si.
Così in fase di aggiornamento mi sono bloccato.
Allora per risolverlo ecco la soluzione: elimina tuttle le eventuali alternative : sudo update-alternatives –remove-all pythoncrea il symlink alla 2.7 sudo ln -s /usr/bin/python3.5 /usr/bin/pythonaggiorna i permessi: sudo chmod 7777 /usr/bin/python
Ora funziona tutto.
La soluzione l’ho scovata qui: https://askubuntu.com/questions/448926/do-release-upgrade-python-install-is-corrupted

Setup Google Tag Manager con PrestaShop per l'e-commerce avanzato

Google Tag Manage e E-commerce Avanzato all’interno della documentazione ufficiale è descritto sia il processo che il codice di implementazione per il monitoraggio avanzato dell’e-commerce
In breve il codice da inserire deve essere un array tipo dataLayer che contiene una serie di informazioni per il monitoraggio di:
impressioni di prodotto e di categoriadettaglio di prodottocheckoutacquisto Sono presenti anche i meccanismi per il monitoraggio delle promozioni, per l’annullamento ordine e per l’aggiunta dinamica del prodotto in carrello
Nel caso del modulo BwAnalytics sono monitorati i primi 4.
Google Tag Manager L’attivazione dell’ecommerce avanzato si effettua sulla vista di Google Analytics e si impostano i nomi degli step del processo di checout mappati all’interno del codice
Limpostazione di Google Tag Manager per l’e-commerce avanzato richiede la greazione di 3 tag:
impressioni e dattagli categoria e prodottocheckout acquisto pagine prestashop coinvolte Su prestashop le pagine di…