Permalink
Browse files

Added messaging sample

  • Loading branch information...
1 parent ae2f4b2 commit 04e2bc918b56fd4c28e422b4bb76b0df4a522d40 @mangini mangini committed Jan 4, 2013
View
@@ -0,0 +1,9 @@
+# Messaging
+
+This sample shows how to communicate between two apps or one app and one extension. Add app1, app2 and extension to Chrome and play with sending messages between them.
+
+## Resources
+
+* [Messaging](https://developer.chrome.com/trunk/apps/runtime.html#method-sendMessage)
+* [Runtime](http://developer.chrome.com/trunk/apps/app.runtime.html)
+* [Window](http://developer.chrome.com/trunk/apps/app.window.html)
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <link href="main.css" rel="stylesheet">
+</head>
+<body>
+ <h3>Waiting for messages</h3>
+ <label>my Application ID is <input id="appid" type="text" readonly></input></label>
+ <div>
+ <label for="sendText">Send message:</label>
+ <input id="sendText" type="text"></input>
+ <label for="sendId">to application ID </label>
+ <input id="sendId" type="text"></input>
+ <button id="send">Send</button>
+ </div>
+ <div id="log"></div>
+ <script src="index.js"></script>
+</body>
+</html>
View
@@ -0,0 +1,44 @@
+(function(context){
+
+ document.getElementById("appid").value=chrome.runtime.id;
+ var logField = document.getElementById("log");
+ var sendText=document.getElementById("sendText");
+ var sendText=document.getElementById("sendText");
+ var sendId=document.getElementById("sendId");
+ var send=document.getElementById("send");
+
+ send.addEventListener('click', function() {
+ appendLog("sending to "+sendId.value);
+ chrome.runtime.sendMessage(
+ sendId.value,
+ {myCustomMessage: sendText.value},
+ function(response) {
+ appendLog("response: "+JSON.stringify(response));
+ })
+ });
+
+
+ blacklistedIds = ["none"];
+
+ chrome.runtime.onMessageExternal.addListener(
+ function(request, sender, sendResponse) {
+ if (sender.id in blacklistedIds) {
+ sendResponse({"result":"sorry, could not process your message"});
+ return; // don't allow this extension access
+ } else if (request.myCustomMessage) {
+ appendLog("from "+sender.id+": "+request.myCustomMessage);
+ sendResponse({"result":"Ok, got your message"});
+ } else {
+ sendResponse({"result":"Ops, I don't understand this message"});
+ }
+ });
+
+
+
+ var appendLog = function(message) {
+ logField.innerText+="\n"+message;
+ }
+
+ context.appendLog = appendLog;
+
+})(window)
View
@@ -0,0 +1,13 @@
+input[type="text"] {
+ width: 240px;
+}
+
+#log {
+ background-color: rgb(226, 226, 250);
+ padding: 10px 20px;
+ margin-top: 10px;
+ height: 300px;
+ border: 1px solid black;
+ overflow-y: scroll;
+ overflow-x: hidden;
+}
View
@@ -0,0 +1,11 @@
+/**
+ * Listens for the app launching then creates the window
+ *
+ * @see http://developer.chrome.com/trunk/apps/app.runtime.html
+ * @see http://developer.chrome.com/trunk/apps/app.window.html
+ */
+chrome.app.runtime.onLaunched.addListener(function() {
+ chrome.app.window.create('index.html',
+ {width: 800, height: 500});
+});
+//function addExternalMessageListener
@@ -0,0 +1,14 @@
+{
+ "manifest_version": 2,
+ "name": "Messaging App1",
+ "version": "1",
+ "minimum_chrome_version": "23",
+ "icons": {
+ "16": "icon_16.png"
+ },
+ "app": {
+ "background": {
+ "scripts": ["main.js"]
+ }
+ }
+}
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <link href="main.css" rel="stylesheet">
+</head>
+<body>
+ <h3>Waiting for messages</h3>
+ <label>my Application ID is <input id="appid" type="text" readonly></input></label>
+ <div>
+ <label for="sendText">Send message:</label>
+ <input id="sendText" type="text"></input>
+ <label for="sendId">to application ID </label>
+ <input id="sendId" type="text"></input>
+ <button id="send">Send</button>
+ </div>
+ <div id="log"></div>
+ <script src="index.js"></script>
+</body>
+</html>
View
@@ -0,0 +1,44 @@
+(function(context){
+
+ document.getElementById("appid").value=chrome.runtime.id;
+ var logField = document.getElementById("log");
+ var sendText=document.getElementById("sendText");
+ var sendText=document.getElementById("sendText");
+ var sendId=document.getElementById("sendId");
+ var send=document.getElementById("send");
+
+ send.addEventListener('click', function() {
+ appendLog("sending to "+sendId.value);
+ chrome.runtime.sendMessage(
+ sendId.value,
+ {myCustomMessage: sendText.value},
+ function(response) {
+ appendLog("response: "+JSON.stringify(response));
+ })
+ });
+
+
+ blacklistedIds = ["none"];
+
+ chrome.runtime.onMessageExternal.addListener(
+ function(request, sender, sendResponse) {
+ if (sender.id in blacklistedIds) {
+ sendResponse({"result":"sorry, could not process your message"});
+ return; // don't allow this extension access
+ } else if (request.myCustomMessage) {
+ appendLog("from "+sender.id+": "+request.myCustomMessage);
+ sendResponse({"result":"Ok, got your message"});
+ } else {
+ sendResponse({"result":"Ops, I don't understand this message"});
+ }
+ });
+
+
+
+ var appendLog = function(message) {
+ logField.innerText+="\n"+message;
+ }
+
+ context.appendLog = appendLog;
+
+})(window)
View
@@ -0,0 +1,13 @@
+input[type="text"] {
+ width: 240px;
+}
+
+#log {
+ background-color: rgb(226, 226, 250);
+ padding: 10px 20px;
+ margin-top: 10px;
+ height: 300px;
+ border: 1px solid black;
+ overflow-y: scroll;
+ overflow-x: hidden;
+}
View
@@ -0,0 +1,11 @@
+/**
+ * Listens for the app launching then creates the window
+ *
+ * @see http://developer.chrome.com/trunk/apps/app.runtime.html
+ * @see http://developer.chrome.com/trunk/apps/app.window.html
+ */
+chrome.app.runtime.onLaunched.addListener(function() {
+ chrome.app.window.create('index.html',
+ {width: 800, height: 500});
+});
+//function addExternalMessageListener
@@ -0,0 +1,14 @@
+{
+ "manifest_version": 2,
+ "name": "Messaging App2",
+ "version": "1",
+ "minimum_chrome_version": "23",
+ "icons": {
+ "16": "icon_16.png"
+ },
+ "app": {
+ "background": {
+ "scripts": ["main.js"]
+ }
+ }
+}
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <link href="main.css" rel="stylesheet">
+</head>
+<body>
+ <h3>Waiting for messages</h3>
+ <label>my extension ID is <input id="appid" type="text" readonly></input></label>
+ <div>
+ <label for="sendText">Send message:</label>
+ <input id="sendText" type="text"></input>
+ <label for="sendId">to application ID </label>
+ <input id="sendId" type="text"></input>
+ <button id="send">Send</button>
+ </div>
+ <div id="log"></div>
+ <script src="index.js"></script>
+</body>
+</html>
@@ -0,0 +1,44 @@
+(function(context){
+
+ document.getElementById("appid").value=chrome.runtime.id;
+ var logField = document.getElementById("log");
+ var sendText=document.getElementById("sendText");
+ var sendText=document.getElementById("sendText");
+ var sendId=document.getElementById("sendId");
+ var send=document.getElementById("send");
+
+ send.addEventListener('click', function() {
+ appendLog("sending to "+sendId.value);
+ chrome.runtime.sendMessage(
+ sendId.value,
+ {myCustomMessage: sendText.value},
+ function(response) {
+ appendLog("response: "+JSON.stringify(response));
+ })
+ });
+
+
+ blacklistedIds = ["none"];
+
+ chrome.runtime.onMessageExternal.addListener(
+ function(request, sender, sendResponse) {
+ if (sender.id in blacklistedIds) {
+ sendResponse({"result":"sorry, could not process your message"});
+ return; // don't allow this extension access
+ } else if (request.myCustomMessage) {
+ appendLog("from "+sender.id+": "+request.myCustomMessage);
+ sendResponse({"result":"Ok, got your message"});
+ } else {
+ sendResponse({"result":"Ops, I don't understand this message"});
+ }
+ });
+
+
+
+ var appendLog = function(message) {
+ logField.innerText+="\n"+message;
+ }
+
+ context.appendLog = appendLog;
+
+})(window)
@@ -0,0 +1,13 @@
+input[type="text"] {
+ width: 240px;
+}
+
+#log {
+ background-color: rgb(226, 226, 250);
+ padding: 10px 20px;
+ margin-top: 10px;
+ height: 300px;
+ border: 1px solid black;
+ overflow-y: scroll;
+ overflow-x: hidden;
+}
@@ -0,0 +1,11 @@
+{
+ "name": "Messaging extension",
+ "version": "1.2",
+ "description": "send message to other apps and extensions.",
+ "browser_action": {
+ "default_title": "Send message to other apps",
+ "default_icon": "icon_16.png",
+ "default_popup": "index.html"
+ },
+ "manifest_version": 2
+}

0 comments on commit 04e2bc9

Please sign in to comment.