Chrome Extension Simple Popup non rimarrà nell'ultimo stato

Ora sono sicuro che alcuni di voi hanno sentito dell'incidente che è accaduto a Byron Nuclear Plant (che mi capita di vivere vicino) Oltre a una massiccia quantità di terremoti in corso in gli Stati Uniti e il Canada. (BTW: Ho trovato this interno da cui è possibile monitorare i terremoti in tutto il mondo)Chrome Extension Simple Popup non rimarrà nell'ultimo stato

In ogni caso, con tutti questi problemi in corso ho voluto guardare gli impianti nucleari migliori, e sapevo già circa il Radiation Network Così ho fatto una estensione chrome chiamata Radiation Map che è alimentata dalla rete di radiazioni (anche se non sono in alcun modo affiliato con Radiation Network)

Ho fatto in modo non solo me stesso, ma tutti possono monitorare i livelli di radiazione negli Stati Uniti, Giappone, Sud America e l'Europa. (So che non ho fatto molto lavoro, ma vedete il motivo)

Tuttavia, ho 1 problema che non riesco a capire. Quando ho il popup aperto, e sto visualizzando i livelli di radiazione del Giappone, e quando chiudo il popup lo faccio a mostrare i livelli di radiazione degli Stati Uniti. Come faccio a farlo in modo che rimanga dove l'utente lo lascia, ad esempio nel mio caso il Giappone in questo esempio? (Ho provato script di contenuti, ma il CSS e jQuery non è stato caricato)

manifesto

{ 
    "name": "Radiation Map", 
    "version": "1.0.1", 
    "description": "See what radiation levels are anywhere in the United States, South America, Japan, and Europe! Updated in real time every minute.", 

    "browser_action": { 
     "default_icon": "images/logo.png", 
     "default_title": "Radiation Map", 
     "popup": "index.html" 
    }, 

    "icons": { 
     "48": "images/48x48.png", 
     "128": "images/128x128.png", 
     "256": "images/logo.png" 
    } 
}

Popup

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/rmd.js"></script> 
</head> 
<body id="radiationmap"> 
    <div id="rmlbbg"></div> 

    <div id="topnavradiation"> 
     <ul id="menu"> 
      <div id="themedrop"> 
       <table> 
        <tr><td> 
         <button id="cus">Contiguous United States</button> 
        </tr></td> 
        <tr><td> 
         <button id="hawaii">Hawaii</button> 
        </tr></td> 
        <tr><td> 
         <button id="alaska">Alaska</button> 
        </tr></td> 
        <tr><td> 
         <button id="sa">South America</button> 
        </tr></td> 
        <tr><td> 
         <button id="japan">Japan</button> 
        </tr></td> 
        <tr><td> 
         <button id="europe">Europe</button> 
        </tr></td> 
       </table> 
      </div> 
      <li><button id="about">About</button></li> 
      <li><button id="home">Home</button></li> 
      <li><button id="location">Location</button></li> 
     </ul> 
    </div> 

    <div id="radiationmap"> 
     <div id="cusmap"> 
      <img src="http://www.radiationnetwork.com/GGFTPMap.jpg" width="752" height="478"> 
     </div> 
     <div id="alaskamap"> 
      <img src="http://www.radiationnetwork.com/Alaska.JPG" width="752" height="478"> 
     </div> 
     <div id="hawaiimap"> 
      <img src="http://www.radiationnetwork.com/Hawaii.JPG" width="752" height="478"> 
     </div> 
     <div id="samap"> 
      <img src="http://www.radiationnetwork.com/Paraguay.JPG" width="752" height="478"> 
     </div> 
     <div id="japanmap"> 
      <img src="http://www.radiationnetwork.com/Japan.JPG" width="752" height="478"> 
     </div> 
     <div id="europemap"> 
      <img src="http://www.radiationnetwork.com/Europe.JPG" width="752" height="478"> 
     </div> 

     <table width="752"> 
      <td><img src="images/LegendWeb.bmp"></td> 
      <td><img src="images/Nuclear.bmp"> Nuclear Site</td> 
      <td>Alert Level = 100 CPM</td> 
     </table> 
    </div> 

    <div id="aboutradiationmap"> 
     Radiation Map is powered by the <a href="http://radiationnetwork.com/" target="_blank">Radiation Network</a>, and without them this extension couldn't be possible. 

     <p><a href="http://www.youtube.com/mikethedj4" target="_blank">Michael</a> created this extension for obvious reasons, and is in no way affiliated with the Radiation Network.</p> 
     <hr> 
     <center>Take control over your life, and stay safe!<br /> 
     <em>Much Love!</em> 

     <p><a href="http://swagbucks.com/refer/mikethedj4" target="_blank"><img src="images/swagbucks.jpg"></a></p> 

     </center> 
    </div> 
</body> 
</html>

RMD.JS (effetti per nascondere e mostra altre mappe che monitorano i livelli di radiazione)

$(document).ready(function() { 
    $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap, div#themedrop, div#aboutradiationmap, div#rmlbbg').hide(); 

    $('button#home').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeOut(400); 
     $('div#themedrop').slideUp(400); 
    }); 

    $('button#about').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeToggle(400); 
     $('div#themedrop').slideUp(400); 
    }); 

    $('button#location').click(function() { 
     $('div#themedrop').slideToggle(400); 
    }); 

    $('button#cus').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#cusmap').delay(400).slideDown(400); 
    }); 

    $('button#europe').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#cusmap').slideUp(400); 
     $('div#europemap').delay(400).slideDown(400); 
    }); 

    $('button#japan').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#cusmap, div#europemap').slideUp(400); 
     $('div#japanmap').delay(400).slideDown(400); 
    }); 

    $('button#sa').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#cusmap, div#japanmap, div#europemap').slideUp(400); 
     $('div#samap').delay(400).slideDown(400); 
    }); 

    $('button#alaska').click(function() { 
     $('div#cusmap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#alaskamap').delay(400).slideDown(400); 
    }); 

    $('button#hawaii').click(function() { 
     $('div#alaskamap, div#cusmap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#hawaiimap').delay(400).slideDown(400); 
    }); 

    $('div#rmlbbg').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeOut(400); 
    }); 

});

fonte

2012-02-01 Michael Schwartz

La pagina viene ricaricata ogni volta che si apre la finestra a comparsa, il che significa che lo stato non persisterà automaticamente. È possibile utilizzare sessionStorage per ricordare l'impostazione per la sessione corrente (o anche localStorage se si desidera che sopravviva al riavvio del browser). Qualcosa del genere:

$(document).ready(function() { 

    ... 

    $('button#cus').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#cusmap').delay(400).slideDown(400); 
     sessionStorage.selectedMap = "cus"; 
    }); 

    ... 

    // "Click" the button corresponding to the map previously selected 
    var selectedMap = sessionStorage.selectedMap || "cus"; 
    $('button#' + selectedMap).click(); 
});

fonte

2012-02-01 08:19:08

L'utente apre l'estensione, fa clic su Alaska, chiude l'estensione, lo apre di nuovo, e mi piacerebbe che rimanesse su come l'utente lo ha lasciato. Ci scusiamo per la confusione, ma come risolve il problema? –

@ mikethedj4: Probabilmente avrei dovuto essere più esplicito: quello che chiedi non accadrà automaticamente. La pagina viene ricaricata ogni volta che si apre il popup. Quindi devi inizializzare la pagina in modo tale che la scelta precedente dell'utente sia rispettata. Questo è ciò che il mio codice esemplifica. –

Giusto per chiarire un po 'questa risposta. L'utilizzo di localStorage mantiene lo stato dell'estensione quando si apre e si chiude l'estensione mentre sessionStorage non lo fa. Immagino che aprire e chiudere l'estensione riapra i popup in una nuova finestra/scheda in modo che sessionStorage sia cancellato. –

Chrome Extension Simple Popup non rimarrà nell'ultimo stato

risposta

Problemi correlati