Rune Halvorsen avatar Rune Halvorsen committed 20251e9

Changed everything

Comments (0)

Files changed (9)

extension/config.xml

 <!--
   <icon src="unshorten_64.png" width="64" height="64"/>
 -->
-  <icon src="yaynay_18.png" width="18" height="18"/>
+  <icon src="meh_18.png" width="18" height="18"/>
 
 <!--
   <preference name="debug_mode" value="false"/>

extension/feh.html

+<!doctype html>
+<style>
+
+body {
+    padding: 0;
+    margin: 0;
+    font-family: sans-serif;
+}
+
+ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    width: 195px;
+}
+
+li {
+    color: gray;
+    font-size: 26px;
+    font-weight: bold;
+    border-radius: 6px;
+    border: solid gray 2px;
+    line-height: 64px;
+    vertical-align: middle;
+    padding: 4px;
+    margin: 4px 0 4px 0;
+}
+
+li img {
+    vertical-align: middle;
+}
+
+li:hover {
+    background-color: lightblue;
+    cursor: pointer;
+}
+
+</style>
+
+<script>
+window.onload = function() {
+    var lis = document.querySelectorAll("li");
+    for (var n=0, e; e=lis[n]; n++) {
+        e.addEventListener("click", toggleMood, false);
+    }
+}
+
+function toggleMood(evt) {
+    opera.extension.postMessage(evt.target.getAttribute("data-mood"));
+    window.close();
+}
+
+</script>
+<ul>
+  <li data-mood="yay">
+    <img data-mood="yay" src="yay_64.png"> Yay!
+  <li data-mood="meh">
+    <img data-mood="meh" src="meh_64.png"> Meh!
+  <li data-mood="nay">
+    <img data-mood="nay" src="nay_64.png"> Nay!
+</ul>

extension/index.html

 {
     opera.extension.onconnect = onConnectHandler;
     opera.extension.tabs.onfocus = onFocus;
+    opera.extension.onmessage = setMood;
 
     var props = {
         disabled: false, // The button is enabled.
         title: "Button example", // The tooltip title.
-        icon: "yaynay_18.png", // The icon (18x18) to use for the button.
-        onclick: toggleMood,
-        badge: {
-            display: "block",
-            textContent: "meh",
-            color: "white",
-            backgroundColor: "rgba(211, 0, 4, 1)"
-        }
+        icon: "yay_18.png", // The icon (18x18) to use for the button.
+        //onclick: toggleMood,
+        popup: {
+            href: "feh.html",
+            width: 195,
+            height: 250
+        },
     };
     window.g_button = opera.contexts.toolbar.createItem(props);
     opera.contexts.toolbar.addItem(g_button);
 }
 
-function toggleMood(evt) {
+function setMood(evt) {
     var focused = window.opera.extension.tabs.getFocused();
     if (!focused) { return }
     var url = focused.url;
-    var currentStatus = getPageStatus(url);
-    var newStatus = null;
-    if (currentStatus == "yay") {
-        newStatus = "meh";
-    }
-    else if (currentStatus == "meh") {
-        newStatus = "nay";
-    }
-    else {
-        newStatus = "yay";
-    }
-
+    var newStatus = evt.data;
     window.localStorage[url] = newStatus;
     updateButton(url);
 }
     }
 
     if (status == "meh") {
-        g_button.badge.display = "none";        
+        g_button.icon = "meh_18.png";
     }
-    else {
-        g_button.badge.textContent = status;
-        g_button.badge.display = "block";
+    else if (status == "yay") {
+        g_button.icon = "yay_18.png";
+    }
+    else if (status == "nay") {
+        g_button.icon = "nay_18.png";
     }
 }
 
Added
New image
Added
New image
Added
New image
Added
New image
Added
New image
Added
New image
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.