Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Add edit button.

  • Loading branch information...
commit fe33036b9b9ec781b115db1d332d3dde30730415 1 parent feac5e6
@epeli authored
View
3  background.html
@@ -8,7 +8,8 @@
<head>
</head>
<body>
- <script type="text/javascript" charset="utf-8" src="http://localhost:8000/socket.io/socket.io.js" ></script>
+ <!--<script type="text/javascript" charset="utf-8" src="http://localhost:8000/socket.io/socket.io.js" ></script>-->
+ <script type="text/javascript" charset="utf-8" src="jquery.js" > </script>
<script type="text/javascript" charset="utf-8" src="bg.js" > </script>
</body>
</html>
View
96 bg.coffee
@@ -1,38 +1,86 @@
-socket = new io.Socket "localhost", port: 8000
+SETTINGS =
+ hostname: "localhost"
+ port: 8000
+ editor_cmd: "gedit"
-chrome.contextMenus.create
- "title": "Edit in external editor!"
- "type": "normal"
- "contexts": ["all"]
- "onclick": (data, tab) ->
- debugger
+socket = null
+ports = {}
-socket.connect()
-ports = {}
+loadSocketIO = ->
+ clearTimeout loadSocketIO.timer
+ console.log "trying to get io"
+ if not window.io
+ jQuery.getScript "http://#{ SETTINGS.hostname }:#{ SETTINGS.port }/socket.io/socket.io.js", ->
+ createSocket()
+ clearTimeout loadSocketIO.timer
+ # TODO: Real error handling with real ajax calls
+ loadSocketIO.timer = setTimeout loadSocketIO, 500
+ else
+ console.log "we aleready have io"
-socket.on "message", (msg) ->
- obj = JSON.parse msg
- port = ports[obj.uuid]
- port.postMessage obj
+createSocket = ->
-chrome.extension.onConnect.addListener (port) ->
- if port.name isnt "textareapipe"
+ if createSocket.ran
return
- port.onMessage.addListener (msg) ->
-
- debugger
-
- ports[msg.uuid] = port
- msg.executable = "gvim"
-
- socket.send JSON.stringify msg
+ socket = new io.Socket SETTINGS.hostname, port: SETTINGS.port
+ initBridge()
+
+ socket.on "disconnect", reConnect
+ socket.on "connect", ->
+ console.log "stopping connection poller"
+ clearTimeout reConnect.timer
+
+ socket.connect()
+
+ createSocket.ran = true
+
+
+
+reConnect = ->
+
+ console.log "polling for connection status: #{ socket.connected }"
+
+ if not socket.connected
+ socket.connect()
+
+ clearTimeout reConnect.timer
+ # Retry
+ reConnect.timer = setTimeout reConnect, 2000
+
+
+
+initBridge = ->
+
+ socket.on "message", (msg) ->
+ obj = JSON.parse msg
+ console.log "getting from editor"
+ console.log obj
+ port = ports[obj.uuid]
+ port.postMessage obj
+
+
+ chrome.extension.onConnect.addListener (port) ->
+ if port.name isnt "textareapipe"
+ return
+
+
+ port.onMessage.addListener (msg) ->
+
+
+ ports[msg.uuid] = port
+ msg.executable = SETTINGS.editor_cmd
+ msg.type = msg.type or "txt"
+
+ socket.send JSON.stringify msg
+
+
+loadSocketIO()
-
View
89 bg.js
@@ -1,32 +1,69 @@
(function() {
- var ports, socket;
- socket = new io.Socket("localhost", {
- port: 8000
- });
- chrome.contextMenus.create({
- "title": "Edit in external editor!",
- "type": "normal",
- "contexts": ["all"],
- "onclick": function(data, tab) {
- debugger;
- }
- });
- socket.connect();
+ var SETTINGS, createSocket, initBridge, loadSocketIO, ports, reConnect, socket;
+ SETTINGS = {
+ hostname: "localhost",
+ port: 8000,
+ editor_cmd: "gedit"
+ };
+ socket = null;
ports = {};
- socket.on("message", function(msg) {
- var obj, port;
- obj = JSON.parse(msg);
- port = ports[obj.uuid];
- return port.postMessage(obj);
- });
- chrome.extension.onConnect.addListener(function(port) {
- if (port.name !== "textareapipe") {
+ loadSocketIO = function() {
+ clearTimeout(loadSocketIO.timer);
+ console.log("trying to get io");
+ if (!window.io) {
+ jQuery.getScript("http://" + SETTINGS.hostname + ":" + SETTINGS.port + "/socket.io/socket.io.js", function() {
+ createSocket();
+ return clearTimeout(loadSocketIO.timer);
+ });
+ return loadSocketIO.timer = setTimeout(loadSocketIO, 500);
+ } else {
+ return console.log("we aleready have io");
+ }
+ };
+ createSocket = function() {
+ if (createSocket.ran) {
return;
}
- return port.onMessage.addListener(function(msg) {
- debugger; ports[msg.uuid] = port;
- msg.executable = "gvim";
- return socket.send(JSON.stringify(msg));
+ socket = new io.Socket(SETTINGS.hostname, {
+ port: SETTINGS.port
+ });
+ initBridge();
+ socket.on("disconnect", reConnect);
+ socket.on("connect", function() {
+ console.log("stopping connection poller");
+ return clearTimeout(reConnect.timer);
+ });
+ socket.connect();
+ return createSocket.ran = true;
+ };
+ reConnect = function() {
+ console.log("polling for connection status: " + socket.connected);
+ if (!socket.connected) {
+ socket.connect();
+ }
+ clearTimeout(reConnect.timer);
+ return reConnect.timer = setTimeout(reConnect, 2000);
+ };
+ initBridge = function() {
+ socket.on("message", function(msg) {
+ var obj, port;
+ obj = JSON.parse(msg);
+ console.log("getting from editor");
+ console.log(obj);
+ port = ports[obj.uuid];
+ return port.postMessage(obj);
+ });
+ return chrome.extension.onConnect.addListener(function(port) {
+ if (port.name !== "textareapipe") {
+ return;
+ }
+ return port.onMessage.addListener(function(msg) {
+ ports[msg.uuid] = port;
+ msg.executable = SETTINGS.editor_cmd;
+ msg.type = msg.type || "txt";
+ return socket.send(JSON.stringify(msg));
+ });
});
- });
+ };
+ loadSocketIO();
}).call(this);
View
131 content.coffee
@@ -1,44 +1,127 @@
-timeStamp = (new Date().getTime())
-siteId = ->
- location.href.replace(/[^a-zA-Z]/g, "") + "_" + timeStamp
+do ->
+ timeStamp = (new Date().getTime())
+ siteId = ->
+ location.href.replace(/[^a-zA-Z]/g, "") + "_" + timeStamp
-$.fn.uuid = ->
- e = $(this.get(0))
- uuid = e.data("uuid")
- if uuid
- return uuid
- else
- $.fn.uuid.counter += 1
- uuid = siteId() + "_" + $.fn.uuid.counter
- e.data("uuid", uuid)
- return uuid
+ $.fn.edited = (callback) ->
+ this.each ->
+ active = false
+ e = this
+ $e = $(e)
+
+ $e.focusin ->
+ active = true
+ $e.focusout ->
+ active = false
+
+ $(window).keyup ->
+ callback(e) if active
+
+
+ $.fn.sizeId = ->
+ return this.height() + "" + this.width()
+
+ $.fn.sizeId = ->
+ return this.height() + "" + this.width()
+
+ $.fn.textAreaResized = (callback) ->
+ this.each ->
+ that = $ this
+ last = that.sizeId()
+ that.mousedown ->
+ last = that.sizeId()
+ that.mousemove ->
+ callback(that.get(0)) if last isnt that.sizeId()
+
+
+ $.fn.toUpperRightCorner = (e) ->
+ e = $ e
+ that = this
+ that.after e
+
+ setPosition = ->
+ offset = that.offset()
+ l = offset.left + that.width() - e.width() - 5
+ t = offset.top
+ e.css
+ left: "#{l}px !important"
+ top: "#{t}px !important"
+
+
+ setPosition()
+ $(window).resize ->
+ setPosition()
+ that.textAreaResized ->
+ setPosition()
+
+
+
+
+
+
+
+ $.fn.addButton = (callback) ->
+
+ this.each ->
+ that = $(this)
+
+ button = $ "<span>", class: "edit-in-textareaserver"
+ button.text "edit"
+
+ button.click ->
+ button.addClass "edit-active"
+
+ that.toUpperRightCorner button
+ callback that, button
+
+
+
+
+ $.fn.uuid = ->
+ e = $(this.get(0))
+ uuid = e.data("uuid")
+ if uuid
+ return uuid
+ else
+ $.fn.uuid.counter += 1
+ uuid = siteId() + "_" + $.fn.uuid.counter
+ e.data("uuid", uuid)
+ return uuid
+ $.fn.uuid.counter = 0
-$.fn.uuid.counter = 0
-
textAreas = {}
port = chrome.extension.connect name: "textareapipe"
+
port.onMessage.addListener (obj) ->
- console.log "getting from bg: " + obj.textarea
textarea = textAreas[obj.uuid]
textarea.val obj.textarea
$ ->
- $("textarea").dblclick ->
- textarea = $(this)
- textAreas[textarea.uuid()] = textarea
+ textarea = $("textarea")
+ textarea.addButton (textarea, button) ->
+ button.click ->
+ textAreas[textarea.uuid()] = textarea
+
+ sendToEditor = (spawn=false) ->
+ port.postMessage
+ textarea: textarea.val()
+ uuid: textarea.uuid()
+ spawn: spawn
+
+ sendToEditor(true)
+
+ $("textarea").edited ->
+ sendToEditor()
+
+
- port.postMessage textarea: textarea.val(), uuid: textarea.uuid()
-
-
-
-
View
147 content.js
@@ -1,41 +1,134 @@
(function() {
- var port, siteId, textAreas, timeStamp;
- timeStamp = new Date().getTime();
- siteId = function() {
- return location.href.replace(/[^a-zA-Z]/g, "") + "_" + timeStamp;
- };
- $.fn.uuid = function() {
- var e, uuid;
- e = $(this.get(0));
- uuid = e.data("uuid");
- if (uuid) {
- return uuid;
- } else {
- $.fn.uuid.counter += 1;
- uuid = siteId() + "_" + $.fn.uuid.counter;
- e.data("uuid", uuid);
- return uuid;
- }
- };
- $.fn.uuid.counter = 0;
+ var port, textAreas;
+ (function() {
+ var siteId, timeStamp;
+ timeStamp = new Date().getTime();
+ siteId = function() {
+ return location.href.replace(/[^a-zA-Z]/g, "") + "_" + timeStamp;
+ };
+ $.fn.edited = function(callback) {
+ return this.each(function() {
+ var $e, active, e;
+ active = false;
+ e = this;
+ $e = $(e);
+ $e.focusin(function() {
+ return active = true;
+ });
+ $e.focusout(function() {
+ return active = false;
+ });
+ return $(window).keyup(function() {
+ if (active) {
+ return callback(e);
+ }
+ });
+ });
+ };
+ $.fn.sizeId = function() {
+ return this.height() + "" + this.width();
+ };
+ $.fn.sizeId = function() {
+ return this.height() + "" + this.width();
+ };
+ $.fn.textAreaResized = function(callback) {
+ return this.each(function() {
+ var last, that;
+ that = $(this);
+ last = that.sizeId();
+ that.mousedown(function() {
+ return last = that.sizeId();
+ });
+ return that.mousemove(function() {
+ if (last !== that.sizeId()) {
+ return callback(that.get(0));
+ }
+ });
+ });
+ };
+ $.fn.toUpperRightCorner = function(e) {
+ var setPosition, that;
+ e = $(e);
+ that = this;
+ that.after(e);
+ setPosition = function() {
+ var l, offset, t;
+ offset = that.offset();
+ l = offset.left + that.width() - e.width() - 5;
+ t = offset.top;
+ return e.css({
+ left: "" + l + "px !important",
+ top: "" + t + "px !important"
+ });
+ };
+ setPosition();
+ $(window).resize(function() {
+ return setPosition();
+ });
+ return that.textAreaResized(function() {
+ return setPosition();
+ });
+ };
+ $.fn.addButton = function(callback) {
+ return this.each(function() {
+ var button, that;
+ that = $(this);
+ button = $("<span>", {
+ "class": "edit-in-textareaserver"
+ });
+ button.text("edit");
+ button.click(function() {
+ return button.addClass("edit-active");
+ });
+ that.toUpperRightCorner(button);
+ return callback(that, button);
+ });
+ };
+ $.fn.uuid = function() {
+ var e, uuid;
+ e = $(this.get(0));
+ uuid = e.data("uuid");
+ if (uuid) {
+ return uuid;
+ } else {
+ $.fn.uuid.counter += 1;
+ uuid = siteId() + "_" + $.fn.uuid.counter;
+ e.data("uuid", uuid);
+ return uuid;
+ }
+ };
+ return $.fn.uuid.counter = 0;
+ })();
textAreas = {};
port = chrome.extension.connect({
name: "textareapipe"
});
port.onMessage.addListener(function(obj) {
var textarea;
- console.log("getting from bg: " + obj.textarea);
textarea = textAreas[obj.uuid];
return textarea.val(obj.textarea);
});
$(function() {
- return $("textarea").dblclick(function() {
- var textarea;
- textarea = $(this);
- textAreas[textarea.uuid()] = textarea;
- return port.postMessage({
- textarea: textarea.val(),
- uuid: textarea.uuid()
+ var textarea;
+ textarea = $("textarea");
+ return textarea.addButton(function(textarea, button) {
+ return button.click(function() {
+ var sendToEditor;
+ textAreas[textarea.uuid()] = textarea;
+ sendToEditor = function(spawn) {
+ if (spawn == null) {
+ spawn = false;
+ }
+ return port.postMessage({
+ textarea: textarea.val(),
+ uuid: textarea.uuid(),
+ spawn: spawn
+ });
+ };
+ sendToEditor(true);
+ return $("textarea").edited(function() {
+ return sendToEditor();
+ });
});
});
});
View
11 manifest.json
@@ -3,16 +3,11 @@
"version": "1.0",
"description": "The first extension that I made.",
"background_page" : "background.html",
- "permissions": [
- "http://localhost:8000/",
- "http://localhost:*/",
- "http://localhost/",
- "contextMenus"
- ],
"content_scripts": [
{
- "matches": ["http://localhost/*"],
- "js": ["jquery.js", "content.js"]
+ "matches": ["http://*/*"],
+ "js": ["jquery.js", "content.js"],
+ "css": [ "style.css" ]
}
]
View
7 server/editserver.coffee
@@ -35,6 +35,8 @@ socket.on 'connection', (client) ->
obj = JSON.parse msg
file = path.join DIR, obj.uuid
+ console.log obj
+
fs.open file, "w", (err, fd) ->
fs.write fd, obj.textarea, obj.textarea.lenght, 0, ->
fs.close fd, ->
@@ -42,12 +44,11 @@ socket.on 'connection', (client) ->
path: DIR
watch_for: Inotify.IN_CLOSE_WRITE
callback: (event) ->
- console.log event
- console.log "event" + now()
fs.readFile file, (err, data) ->
obj.textarea = data.toString()
client.send JSON.stringify obj
- editor = exec obj.executable + " " + file
+ if obj.spawn
+ editor = exec obj.executable + " " + file
View
7 server/editserver.js
@@ -25,6 +25,7 @@
var file, obj;
obj = JSON.parse(msg);
file = path.join(DIR, obj.uuid);
+ console.log(obj);
return fs.open(file, "w", function(err, fd) {
return fs.write(fd, obj.textarea, obj.textarea.lenght, 0, function() {
return fs.close(fd, function() {
@@ -33,15 +34,15 @@
path: DIR,
watch_for: Inotify.IN_CLOSE_WRITE,
callback: function(event) {
- console.log(event);
- console.log("event" + now());
return fs.readFile(file, function(err, data) {
obj.textarea = data.toString();
return client.send(JSON.stringify(obj));
});
}
});
- return editor = exec(obj.executable + " " + file);
+ if (obj.spawn) {
+ return editor = exec(obj.executable + " " + file);
+ }
});
});
});
View
20 style.css
@@ -0,0 +1,20 @@
+
+
+.edit-in-textareaserver {
+ cursor: pointer !important;
+ position: absolute !important;
+ padding: 2px !important;
+ margin: 0px !important;
+ border: medium none !important;
+ height: 14px !important;
+ -webkit-border-bottom-left-radius: 2px !important;
+ -webkit-border-bottom-right-radius: 2px !important;
+ background-color: #444 !important;
+ color: white !important;
+ font-size: 12px !important;
+ opacity: 0.5 !important;
+}
+
+.edit-active {
+ background-color: green !important;
+}
Please sign in to comment.
Something went wrong with that request. Please try again.