toolbar.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5
   6 body {
   7         overflow: hidden;
   8 }
   9
  10 .reloading {
  11         background-image: url(URLBarStopButton.png) !important;
  12 }
  13
  14 a#reload {
  15         float: left;
  16         width: 16px;
  17         height: 16px;
  18         margin-right: 1px;
  19         cursor: default;
  20         background-image: url(URLBarReloadButton.png);
  21 }
  22
  23 .hidden {
  24         display: none !important;
  25 }
  26
  27 a.bookmark {
  28         display: block;
  29         float: left;
  30         color: rgba(0, 0, 0, 0.796875);
  31         text-decoration: none;
  32         padding-top: 2px;
  33         padding-bottom: 2px;
  34         padding-left: 7px;
  35         padding-right: 7px;
  36         margin-right: 1px;
  37         cursor: default;
  38 }
  39
  40 a.bookmark:hover {
  41         color: white;
  42         background-color: rgba(0, 0, 0, 0.2);
  43         -webkit-border-radius: 10px;
  44         text-shadow: rgba(0, 0, 0, 0.398438) 0px 1px 0px;
  45 }
  46
  47
  48 </style>
  49 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  50 <script type="text/javascript">
  51
  52 function windowResized() {
  53         $('.bookmark').removeClass('to-be-hidden')
  54         $('.bookmark').removeClass('hidden');
  55         $('.bookmark').each(function() {
  56                 if ($(this).offset().top > 10) {
  57                         $(this).addClass('to-be-hidden');
  58                 }
  59         });
  60         $('.to-be-hidden').addClass('hidden').removeClass('to-be-hidden');
  61 }
  62
  63 var username = safari.extension.settings.getItem('com.ithinksw.safariextensions.delicious.username');
  64
  65 function reloadBookmarks(username) {
  66         $('#reload').addClass('reloading');
  67         $.getJSON("http://feeds.delicious.com/v2/json/" + username + "?callback=?", function (responseObj) {
  68                 var output = '';
  69                 for (var i = 0; i < responseObj.length; i++) {
  70                         var bmark = responseObj[i];
  71                         var label = bmark['d']
  72                         if (label.length > 27) {
  73                                 var firstPart = label.substr(0, 12);
  74                                 var secondPart = label.substr(label.length - 12, 12);
  75                                 label = firstPart + "&hellip;" + secondPart;
  76                         }
  77                         output += '<a class="bookmark" href="' + bmark['u'] + '">' + label + '</a>';
  78                 }
  79                 document.getElementById('bookmarks').innerHTML = output;
  80                 windowResized();
  81                 $('#reload').removeClass('reloading');
  82         });
  83 }
  84
  85 function settingsChanged(event) {
  86         if (event.key == 'com.ithinksw.safariextensions.delicious.username') {
  87                 username = event.newValue;
  88                 reloadBookmarks(username);
  89         }
  90 }
  91
  92 $(function() {
  93         reloadBookmarks(username);
  94         $(window).resize(windowResized);
  95         safari.extension.settings.addEventListener('change', settingsChanged, false);
  96 });
  97
  98 </script>
  99 <title>Toolbar</title>
 100 </head>
 101 <body><a id="reload" href="javascript:reloadBookmarks(username);"></a><div id="bookmarks"></div></body>
 102 </html>