Permalink
Browse files

Adding Webserver sample

  • Loading branch information...
PaulKinlan committed Oct 9, 2012
1 parent 1de157c commit 41c66e41f73c894178248dd0cdf84511a9975dfe
View
@@ -0,0 +1,10 @@
+Web Server
+==========
+
+This sample is a demonstration of Chrome's new networking stack. Chrome now has the ability to
+listen on a tcp port AND to accept.
+
+Caveats
+-------
+
+The `listen` and `accept` API are currently only available in Canary channel of Chrome
@@ -0,0 +1,10 @@
+{
+ "appName": {
+ "message": "HTTP Webserver - File",
+ "description": "The name of the application"
+ },
+ "appDescription": {
+ "message": "HTTP Webserver - File",
+ "description": "The description of the application"
+ }
+}
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
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,66 @@
+<!doctype html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>HTTP Webserver</title>
+ <!-- build:css styles/app.css -->
+ <link rel="stylesheet" href="styles/bootstrap.css">
+ <link rel="stylesheet" href="styles/main.css">
+ <!-- endbuild -->
+ <script src="index.js"></script>
+ <style>
+ input[type="file"]::-webkit-file-upload-button {
+ background-color: red;
+ color: white;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ background-color: #006DCC;
+ background-image: -moz-linear-gradient(top, #08C, #04C);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#08C), to(#04C));
+ background-image: -webkit-linear-gradient(top, #08C, #04C);
+ background-image: -o-linear-gradient(top, #08C, #04C);
+ background-image: linear-gradient(to bottom, #08C, #04C);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
+ border-color: #04C #04C #002A80;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+ padding: 9px 14px;
+ font-size: 16px;
+ line-height: normal;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+
+ }
+ input[type="file"] {
+ margin-bottom: 20px;
+ }
+ input[type="file"][disabled]::-webkit-file-upload-button {
+ color: default;
+ background-color: #E6E6E6;
+ background-image: none;
+ opacity: 0.65;
+ filter: alpha(opacity=65);
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+ }
+
+
+ </style>
+ </head>
+ <body>
+ <div class="hero-unit">
+ <h1>HTTP Webserver</h1>
+ <p>Serving you locally</p>
+ <p>
+ <input type="file" webkitDirectory id="directory"/><br />
+ <button id="start" class="btn btn-primary btn-large" disabled>Start</button>
+ <button id="stop" class="btn btn-warning btn-large" disabled>Stop</button>
+ </p>
+ </div>
+
+
+
+ </body>
+</html>
View
@@ -0,0 +1,109 @@
+onload = function() {
+ var start = document.getElementById("start");
+ var stop = document.getElementById("stop");
+ var directory = document.getElementById("directory");
+
+ var socket = chrome.socket;
+ var socketInfo;
+ var filesMap = {};
+
+ var stringToUint8Array = function(string) {
+ var buffer = new ArrayBuffer(string.length);
+ var view = new Uint8Array(buffer);
+ for(var i = 0; i < string.length; i++) {
+ view[i] = string.charCodeAt(i);
+ }
+ return view;
+ };
+
+ var arrayBufferToString = function(buffer) {
+ var str = '';
+ var uArrayVal = new Uint8Array(buffer);
+ for(var s = 0; s < uArrayVal.length; s++) {
+ str += String.fromCharCode(uArrayVal[s]);
+ }
+ return str;
+ };
+
+ var write200Response = function(socketId, file) {
+ var contentType = (file.type === "") ? "text/plain" : file.type;
+ var contentLength = file.size;
+ var header = stringToUint8Array("HTTP/1.0 200 OK\nContent-length: " + file.size + "\nContent-type:" + contentType + "\n\n");
+ var outputBuffer = new ArrayBuffer(header.byteLength + file.size);
+ var view = new Uint8Array(outputBuffer)
+ view.set(header, 0);
+
+ var fileReader = new FileReader();
+ fileReader.onload = function(e) {
+ view.set(new Uint8Array(e.target.result), header.byteLength);
+ socket.write(socketId, outputBuffer, function(writeInfo) {
+ console.log("WRITE", writeInfo);
+ socket.destroy(socketId);
+ socket.accept(socketInfo.socketId, onAccept);
+ });
+ };
+
+ fileReader.readAsArrayBuffer(file);
+ };
+
+ var onAccept = function(acceptInfo) {
+ console.log("ACCEPT", acceptInfo)
+ // Read in the data
+ socket.read(acceptInfo.socketId, function(readInfo) {
+ console.log("READ", readInfo);
+ // Parse the request.
+ var data = arrayBufferToString(readInfo.data);
+ if(data.indexOf("GET ") == 0) {
+ // we can only deal with GET requests
+ var uriEnd = data.indexOf(" ", 4);
+ if(uriEnd < 0) { /* throw a wobbler */ return; }
+ var uri = data.substring(4, uriEnd);
+ var file = filesMap[uri];
+ if(!!file == false) { /* File does not exist */ return; }
+ write200Response(acceptInfo.socketId, file);
+ }
+ else {
+ // Throw an error
+ socket.destroy(acceptInfo.socketId);
+ }
+
+ });
+ };
+
+ directory.onchange = function(e) {
+ if(socketInfo) socket.destroy(socketInfo.socketId);
+
+ var files = e.target.files;
+
+ for(var i = 0; i < files.length; i++) {
+ //remove the first first directory
+ var path = files[i].webkitRelativePath;
+ filesMap[path.substr(path.indexOf("/"))] = files[i];
+ }
+
+ start.disabled = false;
+ stop.disabled = true;
+ directory.disabled = true;
+ };
+
+ start.onclick = function() {
+ socket.create("tcp", {}, function(_socketInfo) {
+ socketInfo = _socketInfo;
+ socket.listen(socketInfo.socketId, "127.0.0.1", 8080, 20, function(result) {
+ console.log("LISTING:", result);
+ socket.accept(socketInfo.socketId, onAccept);
+ });
+ });
+
+ directory.disabled = true;
+ stop.disabled = false;
+ start.disabled = true;
+ };
+
+ stop.onclick = function() {
+ directory.disabled = false;
+ stop.disabled = true;
+
+ socket.destroy(socketInfo.socketId);
+ };
+};
View
@@ -0,0 +1,12 @@
+/**
+ * Listens for the app launching then creates the window
+ *
+ * @see http://developer.chrome.com/trunk/apps/experimental.app.html
+ * @see http://developer.chrome.com/trunk/apps/app.window.html
+ */
+chrome.app.runtime.onLaunched.addListener(function(intentData) {
+ chrome.app.window.create('index.html', {
+ width: 500,
+ height: 400
+ });
+});
View
@@ -0,0 +1,17 @@
+{
+ "name": "__MSG_appName__",
+ "version": "1",
+ "manifest_version": 2,
+ "description": "__MSG_appDescription__",
+ "icons": {
+ "16": "icon-16.png",
+ "128": "icon-128.png"
+ },
+ "default_locale": "en",
+ "app": {
+ "background": {
+ "scripts": ["main.js"]
+ }
+ },
+ "permissions": ["experimental", {"socket":["tcp-connect", "tcp-listen"]}]
+}
Oops, something went wrong.

0 comments on commit 41c66e4

Please sign in to comment.