Posted By

Kerrick on 02/19/11


Tagged


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

wirenaught


FreshBookMark - options.html


 / Published in: HTML
 

MIT Licensed.

  1. <title>FreshBookMark URL</title>
  2. html{background:#eee;}
  3. body{width:920px;height:300px;background:white;border-radius:10px;-webkit-box-shadow:0 3px 10px grey;font:20px / 36px Arial, Helvetica, sans-serif;margin:20px auto;padding:20px;}
  4. #help{text-align:center;}
  5. #status{text-align:center;color:green;}
  6. label{display:block;text-align:center;font-size:36px;color:grey;width:840px;margin:0 auto;}
  7. input{width:auto;color:black;border:0;border-bottom:1px dotted grey;font-size:36px;text-align:right;}
  8. input:focus{outline:none;border-bottom-color:black;}
  9. button{font-size:36px;display:block;width:770px;cursor:pointer;margin:20px auto;padding:10px 0;}
  10. </style>
  11. </head>
  12. <script type="text/javascript">
  13. // Saves options to localStorage.
  14. function save_options() {
  15. var text = document.getElementById("url");
  16. var url = text.value;
  17. localStorage["saved_url"] = url;
  18.  
  19. // Update status to let user know options were saved.
  20. var status = document.getElementById("status");
  21. status.innerHTML = "URL Saved.";
  22. setTimeout(function() {
  23. status.innerHTML = "";
  24. }, 750);
  25. restore_options();
  26. }
  27.  
  28. // Restores text box state to saved value from localStorage.
  29. function restore_options() {
  30. var saved = localStorage["saved_url"];
  31. if (saved == undefined || saved == null || saved == '') {
  32. var help = document.getElementById("help");
  33. help.innerHTML = "<p>It appears you have not set up your Freshbooks URL yet. Please do so by typing it below.</p><p>You can always get back to this page by right clicking the app icon and choosing <strong>Options</strong></p>";
  34. return;
  35. }
  36. var text = document.getElementById("url");
  37. text.value = saved;
  38. }
  39. <body onload="restore_options()">
  40. <div id="help">
  41. <p>You can always get back to this page by right clicking the app icon and choosing <strong>Options</strong></p>
  42. </div>
  43. <label for="url">https://<input type="text" id="url" name="url" />.freshbooks.com</label>
  44. <button onclick="save_options()">Save</button>
  45. <div id="status"></div>
  46. </body>
  47. </html>

Report this snippet  

You need to login to post a comment.