update

13 files changed, 82 insertions, 128 deletions

diff --git a/2016_mirror_browser/firefox/README.md b/2016_mirror_browser/firefox/README.md
deleted file mode 100644
index e6c91e3..0000000
--- a/2016_mirror_browser/firefox/README.md
+++ /dev/null
@@ -1,2 +0,0 @@
-#mirror
-This mirror flips your online activity!
diff --git a/2016_mirror_browser/firefox/data/icon.png b/2016_mirror_browser/firefox/data/icon.png
deleted file mode 100644
index 32577f2..0000000
--- a/2016_mirror_browser/firefox/data/icon.png
+++ /dev/null
diff --git a/2016_mirror_browser/firefox/data/onoff.js b/2016_mirror_browser/firefox/data/onoff.js
deleted file mode 100644
index 945e090..0000000
--- a/2016_mirror_browser/firefox/data/onoff.js
+++ /dev/null
@@ -1,21 +0,0 @@
-var lron = document.getElementById("lron");
-var lroff = document.getElementById("lroff");
-var udon = document.getElementById("udon");
-var udoff = document.getElementById("udoff");
-
-lron.addEventListener('click', function(event) {
-	self.port.emit("lrmirror", "on");
-}, true);
-
-lroff.addEventListener('click', function() {
-	self.port.emit("lrmirror", "off");
-}, true);
-
-udon.addEventListener('click', function(event) {
-	self.port.emit("udmirror", "on");
-}, true);
-
-udoff.addEventListener('click', function() {
-	self.port.emit("udmirror", "off");
-}, true);
-
diff --git a/2016_mirror_browser/firefox/data/icon-16.png b/2016_mirror_browser/firefox/icon-16.png
index 79df038..79df038 100644
--- a/2016_mirror_browser/firefox/data/icon-16.png
+++ b/2016_mirror_browser/firefox/icon-16.png
diff --git a/2016_mirror_browser/firefox/data/icon-32.png b/2016_mirror_browser/firefox/icon-32.png
index 4e7aa3a..4e7aa3a 100644
--- a/2016_mirror_browser/firefox/data/icon-32.png
+++ b/2016_mirror_browser/firefox/icon-32.png
diff --git a/2016_mirror_browser/firefox/data/icon-64.png b/2016_mirror_browser/firefox/icon-64.png
index 32577f2..32577f2 100644
--- a/2016_mirror_browser/firefox/data/icon-64.png
+++ b/2016_mirror_browser/firefox/icon-64.png
diff --git a/2016_mirror_browser/firefox/icon.png b/2016_mirror_browser/firefox/icon.png
new file mode 100644
index 0000000..413653a
--- /dev/null
+++ b/2016_mirror_browser/firefox/icon.png
diff --git a/2016_mirror_browser/firefox/index.js b/2016_mirror_browser/firefox/index.js
deleted file mode 100644
index 6c143c7..0000000
--- a/2016_mirror_browser/firefox/index.js
+++ /dev/null
@@ -1,73 +0,0 @@
-var { ToggleButton } = require('sdk/ui/button/toggle');
-var panels = require("sdk/panel");
-var self = require("sdk/self").data;
-var pageMod = require("sdk/page-mod");
-var state = false;
-
-var button = ToggleButton({
-	id: "my-button",
-	label: "mirror",
-	icon: {
-		"16": "./icon-16.png",
-		"32": "./icon-32.png",
-		"64": "./icon-64.png"
-	},
-	onChange: handleChange
-});
-
-var panel = panels.Panel({
-	width: 500,
-	height: 180,
-	contentURL: self.url("panel.html"),
-	contentScriptFile: self.url("onoff.js"),
-	onHide: handleHide
-});
-
-function handleChange(state) {
-	if (state.checked) {
-		panel.show({
-			position: button
-		});
-	}
-}
-
-function handleHide() {
-	button.state('window', {checked: false});
-}
-
-panel.port.on("lrmirror", function (text) {
-	if(text == "on"){
-		state = true;
-		pageMod.PageMod({
-			include: "*",
-			attachTo: ["existing", "top"],
-			contentScript: 'document.getElementsByTagName("body")[0].style = "transform: rotateY(180deg)"'
-		});
-	} else if (text == "off"){
-		state == false;
-		pageMod.PageMod({
-			include: "*",
-			attachTo: ["existing", "top"],
-			contentScript: 'document.getElementsByTagName("body")[0].style = "transform: rotateY(0deg)"'
-		});
-	}
-});
-
-panel.port.on("udmirror", function (text) {
-	if(text == "on"){
-		state = true;
-		pageMod.PageMod({
-			include: "*",
-			attachTo: ["existing", "top"],
-			contentScript: 'document.getElementsByTagName("body")[0].style = "transform: rotateX(180deg)"'
-		});
-	} else if (text == "off"){
-		state == false;
-		pageMod.PageMod({
-			include: "*",
-			attachTo: ["existing", "top"],
-			contentScript: 'document.getElementsByTagName("body")[0].style = "transform: rotateX(0deg)"'
-		});
-	}
-});
-
diff --git a/2016_mirror_browser/firefox/manifest.json b/2016_mirror_browser/firefox/manifest.json
new file mode 100644
index 0000000..a7212bf
--- /dev/null
+++ b/2016_mirror_browser/firefox/manifest.json
@@ -0,0 +1,20 @@
+{
+	"manifest_version": 2,
+
+	"name": "Mirror",
+	"description": "This mirror flips your online activity!",
+	"version": "1.0",
+    "author": "joak",
+	"permissions": ["activeTab", "tabs"],
+	"browser_action": {
+		"default_icon": "icon.png",
+		"default_popup": "popup.html",
+		"default_title": "Flip horizontally page!",
+        "browser_style": false
+	},
+	"icons": { 
+		"16": "icon-16.png",
+		"32": "icon-32.png",
+		"64": "icon-64.png"
+	}
+}
diff --git a/2016_mirror_browser/firefox/mirror.js b/2016_mirror_browser/firefox/mirror.js
new file mode 100644
index 0000000..699ac39
--- /dev/null
+++ b/2016_mirror_browser/firefox/mirror.js
@@ -0,0 +1,41 @@
+
+function init(){
+    var elem1 = document.getElementById('lron');
+    elem1.addEventListener('click',funclron);
+    var elem2 = document.getElementById('lroff');
+    elem2.addEventListener('click',funclroff); 
+    var elem3 = document.getElementById('upon');
+    elem3.addEventListener('click',funcudon);
+    var elem4 = document.getElementById('upoff');
+    elem4.addEventListener('click',funcudoff);
+}
+
+function funclron(){
+	browser.tabs.executeScript({
+         code: "document.body.style.transform = 'rotateY(180deg)';"
+	});
+}
+
+function funclroff(){
+	browser.tabs.executeScript({
+        code: "document.body.style.transform = 'rotateY(0deg)';"
+	});
+}
+
+
+function funcudon(){
+	browser.tabs.executeScript({
+        code: "document.body.style.transform = 'rotateX(180deg)';"
+	});
+}
+
+function funcudoff(){
+	browser.tabs.executeScript({
+        code: "document.body.style.transform = 'rotateX(0deg)';"
+	});
+}
+
+
+document.addEventListener('DOMContentLoaded', init);
+
+
diff --git a/2016_mirror_browser/firefox/mirror.xpi b/2016_mirror_browser/firefox/mirror.xpi
deleted file mode 100644
index 3744a35..0000000
--- a/2016_mirror_browser/firefox/mirror.xpi
+++ /dev/null
diff --git a/2016_mirror_browser/firefox/package.json b/2016_mirror_browser/firefox/package.json
deleted file mode 100644
index 5cdbbbf..0000000
--- a/2016_mirror_browser/firefox/package.json
+++ /dev/null
@@ -1,17 +0,0 @@
-{
-  "title": "mirror",
-  "name": "mirror",
-  "version": "0.0.1",
-  "icon": "resource://mirror/data/icon-32.png", 
-  "homepage": "http://joak.nospace.at",
-  "description": "This mirror flips horizontally your online activity!",
-  "main": "index.js",
-  "author": "joak",
-  "engines": {
-    "firefox": ">=38.0a1"
-  },
-  "license": "GPL",
-  "keywords": [
-    "jetpack"
-  ]
-}
diff --git a/2016_mirror_browser/firefox/data/panel.html b/2016_mirror_browser/firefox/popup.html
index e904c90..a883d98 100644
--- a/2016_mirror_browser/firefox/data/panel.html
+++ b/2016_mirror_browser/firefox/popup.html
@@ -1,20 +1,23 @@
-<head>
-	<style>
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Mirror</title>
+    <style>
 	body {
 		font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif;
-        font-size: 100%;
-        background: white;
+        	font-size: 100%;
+        	background: white;
+        	width: 400px;
+        	height: 175px;
 	}
-	.extra-font{
-        font-family: Times New Roman;
-    }
-    #button {
+	#button {
 		text-align: center;
 		margin-top: 15px;
 		margin-bottom: 5px;
 	}
 	#start {
-		position: absolute:
+		position: absolute;
 		top: 50%;
 	}
 	#wrapper{
@@ -30,9 +33,9 @@
 	#settings{
 		text-align: center;
 	}
-	</style>
-</head>
-<body>
+    </style>
+  </head>
+  <body>
 	<div id="wrapper">
 		<div id="title">
 			<h2>Mirror</h2>
@@ -44,10 +47,13 @@
 					<button type="button" id="lroff">Off</button>
 				</p>
 				<p>&#8597;
-                    <button type="button" id="udon">On</button>
-					<button type="button" id="udoff">Off</button>
+					<button type="button" id="upon">O    n</button>
+					<button type="button" id="upoff">    Off</button>
 				</p>
 			</div>
 		</div>
 	</div>
-</body>
+    <script src="mirror.js"></script>
+  </body>
+</html>
+