Skip to content
Browse files

added static file server in /static via express

  • Loading branch information...
1 parent 2c3669a commit 0fc4eac381f9716873e54f44dca5c79ddf3d59e5 @mkrecny mkrecny committed Mar 27, 2012
Showing with 415 additions and 0 deletions.
  1. +41 −0 static/app.js
  2. +8 −0 static/package.json
  3. +8 −0 static/routes/index.js
  4. +358 −0 static/views/index.html
View
41 static/app.js
@@ -0,0 +1,41 @@
+
+/**
+ * Module dependencies.
+ */
+
+var express = require('express')
+, fs = require('fs');
+
+var app = module.exports = express.createServer();
+
+// Configuration
+
+var static_dir = __dirname + '/../client-build';
+var index = fs.readFileSync(__dirname+'/../client-build/index.html', 'utf8');
+//var gametypes = fs.readFileSync(__dirname+'/../shared/js/gametypes.js', 'utf8');
+
+app.configure(function(){
+ app.use(express.bodyParser());
+ app.use(express.methodOverride());
+ console.log('serving static from ', static_dir);
+ app.use(express.static(static_dir));
+});
+
+app.configure('development', function(){
+ app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
+});
+
+app.configure('production', function(){
+ app.use(express.errorHandler());
+});
+
+// Routes
+
+app.get('/', function(req, res){
+ res.end(index);
+});
+/*app.get('/shared/js/gametypes.js', function(req, res){
+ res.end(gametypes);
+});*/
+app.listen(8001);
+console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);
View
8 static/package.json
@@ -0,0 +1,8 @@
+{
+ "name": "application-name"
+ , "version": "0.0.1"
+ , "private": true
+ , "dependencies": {
+ "express": "2.5.8"
+ }
+}
View
8 static/routes/index.js
@@ -0,0 +1,8 @@
+
+/*
+ * GET home page.
+ */
+
+exports.index = function(req, res){
+ res.render('index', { title: 'Express' })
+};
View
358 static/views/index.html
@@ -0,0 +1,358 @@
+<!DOCTYPE html>
+<!--
+
+ , __ __
+/|/ \ / \
+ | __/ ,_ __ , _ ,_ | __ | _ , _|_
+ | \/ | / \_| | |_/ \_|/ / | |/ \| | | |/ / \_|
+ |(__/ |_/\__/ \/ \/ \/ |__/ |_/\__/\_/ \_/|_/|__/ \/ |_/
+
+Mozilla presents an HTML5 mini-MMORPG by Little Workshop http://www.littleworkshop.fr
+
+* Client libraries used: RequireJS, Underscore.js, jQuery, Modernizr
+* Server-side: Node.js, Worlize/WebSocket-Node, miksago/node-websocket-server
+* Should work in latest versions of Firefox, Chrome, Safari, Opera, Safari Mobile and Firefox for Android
+
+ -->
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
+ <link rel="icon" type="image/png" href="img/common/favicon.png">
+ <meta property="og:title" content="BrowserQuest">
+ <meta property="og:type" content="website">
+ <meta property="og:url" content="http://browserquest.mozilla.org/">
+ <meta property="og:image" content="http://browserquest.mozilla.org/img/common/promo-title.jpg">
+ <meta property="og:site_name" content="BrowserQuest">
+ <meta property="og:description" content="Play Mozilla's BrowserQuest, an HTML5 massively multiplayer game demo powered by WebSockets!">
+ <link rel="stylesheet" href="css/main.css" type="text/css">
+ <link rel="stylesheet" href="css/achievements.css" type="text/css">
+ <script src="js/lib/modernizr.js" type="text/javascript"></script>
+ <!--[if lt IE 9]>
+ <link rel="stylesheet" href="css/ie.css" type="text/css">
+ <script src="js/lib/css3-mediaqueries.js" type="text/javascript"></script>
+ <script type="text/javascript">
+ document.getElementById('parchment').className = ('error');
+ </script>
+ <![endif]-->
+ <script src="js/detect.js" type="text/javascript"></script>
+ <title>BrowserQuest</title>
+ </head>
+ <!--[if lt IE 9]>
+ <body class="intro upscaled">
+ <![endif]-->
+ <body class="intro">
+ <noscript>
+ <div class="alert">
+ You need to enable JavaScript to play BrowserQuest.
+ </div>
+ </noscript>
+ <a id="moztab" class="clickable" target="_blank" href="http://www.mozilla.org/"></a>
+ <div id="intro">
+ <h1 id="logo">
+ <span id="logosparks">
+
+ </span>
+ </h1>
+ <article id="portrait">
+ <p>
+ Please rotate your device to landscape mode
+ </p>
+ <div id="tilt"></div>
+ </article>
+ <section id="parchment" class="createcharacter">
+ <div class="parchment-left"></div>
+ <div class="parchment-middle">
+ <article id="createcharacter">
+ <h1>
+ <span class="left-ornament"></span>
+ A Massively Multiplayer Adventure
+ <span class="right-ornament"></span>
+ </h1>
+ <div id="character" class="disabled">
+ <div></div>
+ </div>
+ <form action="none" method="get" accept-charset="utf-8">
+ <input type="text" id="nameinput" class="stroke" name="player-name" placeholder="Name your character" maxlength="15">
+ </form>
+ <div class="play button disabled">
+ <div></div>
+ <img src="img/common/spinner.gif" alt="">
+ </div>
+ <div class="ribbon">
+ <div class="top"></div>
+ <div class="bottom"></div>
+ </div>
+ </article>
+ <article id="loadcharacter">
+ <h1>
+ <span class="left-ornament"></span>
+ Load your character
+ <span class="right-ornament"></span>
+ </h1>
+ <div class="ribbon">
+ <div class="top"></div>
+ <div class="bottom"></div>
+ </div>
+ <img id="playerimage" src="">
+ <div id="playername" class="stroke">
+ </div>
+ <div class="play button">
+ <div></div>
+ <img src="img/common/spinner.gif" alt="">
+ </div>
+ <div id="create-new">
+ <span><span>or</span> create a new character</span>
+ </div>
+ </article>
+ <article id="confirmation">
+ <h1>
+ <span class="left-ornament"></span>
+ Delete your character?
+ <span class="right-ornament"></span>
+ </h1>
+ <p>
+ All your items and achievements will be lost.<br>
+ Are you sure you wish to continue?
+ </p>
+ <div class="delete button"></div>
+ <div id="cancel">
+ <span>cancel</span>
+ </div>
+ </article>
+ <article id="credits">
+ <h1>
+ <span class="left-ornament"></span>
+ <span class="title">
+ Made for Mozilla by <a target="_blank" class="stroke clickable" href="http://www.littleworkshop.fr/">Little Workshop</a>
+ </span>
+ <span class="right-ornament"></span>
+ </h1>
+ <div id="authors">
+ <div id="guillaume">
+ <div class="avatar"></div>
+ Pixels by
+ <a class="stroke clickable" target="_blank" href="http://twitter.com/glecollinet">Guillaume Lecollinet</a>
+ </div>
+ <div id="franck">
+ <div class="avatar"></div>
+ Code by
+ <a class="stroke clickable" target="_blank" href="http://twitter.com/whatthefranck">Franck Lecollinet</a>
+ </div>
+ </div>
+ <div id="seb">
+
+ <span id="note"></span>
+ Music by <a class="clickable" target="_blank" href="http://soundcloud.com/gyrowolf/sets/gyrowolfs-rpg-maker-music-pack/">Gyrowolf</a>, <a class="clickable" target="_blank" href="http://blog.dayjo.org/?p=335">Dayjo</a>, <a class="clickable" target="_blank" href="http://soundcloud.com/freakified/what-dangers-await-campus-map">Freakified</a>, &amp; <a target="_blank" class="clickable" href="http://www.newgrounds.com/audio/listen/349734">Camoshark</a>
+
+ </div>
+ <div id="close-credits">
+ <span>- click anywhere to close -</span>
+ </div>
+ </article>
+ <article id="about">
+ <h1>
+ <span class="left-ornament"></span>
+ <span class="title">
+ What is BrowserQuest?
+ </span>
+ <span class="right-ornament"></span>
+ </h1>
+ <p id="game-desc">
+ BrowserQuest is a multiplayer game inviting you to explore a
+ world of adventure from your Web browser.
+ </p>
+ <div class="left">
+ <div class="img"></div>
+ <p>
+ This demo is powered by HTML5 and WebSockets, which allow for real-time gaming and apps on the Web.
+ </p>
+ <span class="link">
+ <span class="ext-link"></span>
+ <a target="_blank" class="clickable" href="http://hacks.mozilla.org/2012/03/browserquest/">Learn more</a> about the technology
+ </span>
+ </div>
+ <div class="right">
+ <div class="img"></div>
+ <p>
+ BrowserQuest is available on Firefox, Chrome, Safari as well as iOS devices and Firefox for Android.
+ </p>
+ <span class="link">
+ <span class="ext-link"></span>
+ <a target="_blank" class="clickable" href="http://github.com/mozilla/BrowserQuest">Grab the source</a> on Github
+ </span>
+ </div>
+ <div id="close-about">
+ <span>- click anywhere to close -</span>
+ </div>
+ </article>
+ <article id="death">
+ <p>You are dead...</p>
+ <div id="respawn" class="button"></div>
+ </article>
+ <article id="error">
+ <h1>
+ <span class="left-ornament"></span>
+ Your browser cannot run BrowserQuest!
+ <span class="right-ornament"></span>
+ </h1>
+ <p>
+ We're sorry, but your browser does not support WebSockets.<br>
+ In order to play, we recommend using the latest version of Firefox, Chrome or Safari.
+ </p>
+ </article>
+ </div>
+ <div class="parchment-right"></div>
+ </section>
+ </div>
+ <div id="container">
+ <div id="canvasborder">
+ <article id="instructions" class="clickable">
+ <div class="close"></div>
+ <h1>
+ <span class="left-ornament"></span>
+ How to play
+ <span class="right-ornament"></span>
+ </h1>
+ <ul>
+ <li><span class="icon"></span>Left click or tap to move, attack and pick up items.</li>
+ <li><span class="icon"></span>Press ENTER to chat.</li>
+ <li><span class="icon"></span>Your character is automatically saved as you play.</li>
+ </ul>
+ <p>- click anywhere to close -</p>
+ </article>
+ <article id="achievements" class="page1 clickable">
+ <div class="close"></div>
+ <div id="achievements-wrapper">
+ <div id="lists">
+ </div>
+ </div>
+ <div id="achievements-count" class="stroke">
+ Completed
+ <div>
+ <span id="unlocked-achievements">0</span>
+ /
+ <span id="total-achievements"></span>
+ </div>
+ </div>
+ <nav class="clickable">
+ <div id="previous"></div>
+ <div id="next"></div>
+ </nav>
+ </article>
+ <div id="canvas">
+ <canvas id="background"></canvas>
+ <canvas id="entities"></canvas>
+ <canvas id="foreground" class="clickable"></canvas>
+ </div>
+ <div id="bubbles">
+ </div>
+ <div id="achievement-notification">
+ <div class="coin">
+ <div id="coinsparks"></div>
+ </div>
+ <div id="achievement-info">
+ <div class="title">New Achievement Unlocked!</div>
+ <div class="name"></div>
+ </div>
+ </div>
+ <div id="bar-container">
+ <div id="healthbar">
+ </div>
+ <div id="hitpoints">
+ </div>
+ <div id="weapon"></div>
+ <div id="armor"></div>
+ <div id="notifications">
+ <div>
+ <span id="message1"></span>
+ <span id="message2"></span>
+ </div>
+ </div>
+ <div id="playercount" class="clickable">
+ <span class="count">0</span> <span>players</span>
+ </div>
+ <div id="barbuttons">
+ <div id="chatbutton" class="barbutton clickable"></div>
+ <div id="achievementsbutton" class="barbutton clickable"></div>
+ <div id="helpbutton" class="barbutton clickable"></div>
+ <div id="mutebutton" class="barbutton clickable active"></div>
+ </div>
+ </div>
+ <div id="chatbox">
+ <form action="none" method="get" accept-charset="utf-8">
+ <input id="chatinput" class="gp" type="text" maxlength="60">
+ </form>
+ </div>
+ <div id="population">
+ <div id="instance-population" class="">
+ <span>0</span> <span>players</span> in your instance
+ </div>
+ <div id="world-population" class="">
+ <span>0</span> <span>players</span> total
+ </div>
+ </div>
+ </div>
+ </div>
+ <footer>
+ <div id="sharing" class="clickable">
+ Share this on
+ <a href="http://twitter.com/share?url=http%3A%2F%2Fbrowserquest.mozilla.org&amp;text=Mozilla%27s%20BrowserQuest%3A%20HTML5%20massively%20multiplayer%20adventure%20game%20%23demo%20%23websockets&amp;related=glecollinet:Creators%20of%20BrowserQuest%2Cwhatthefranck" class="twitter"></a>
+ <a href="http://www.facebook.com/share.php?u=http://browserquest.mozilla.org/" class="facebook"></a>
+ </div>
+ <div id="credits-link" class="clickable">
+ – <span id="toggle-credits">Credits</span>
+ </div>
+ </footer>
+
+ <ul id="page-tmpl" class="clickable" style="display:none">
+ </ul>
+ <ul>
+ <li id="achievement-tmpl" style="display:none">
+ <div class="coin"></div>
+ <span class="achievement-name">???</span>
+ <span class="achievement-description">???</span>
+ <div class="achievement-sharing">
+ <a href="" class="twitter"></a>
+ </div>
+ </li>
+ </ul>
+
+ <img src="img/common/thingy.png" alt="" class="preload">
+
+ <div id="resize-check"></div>
+
+ <script type="text/javascript">
+ var ctx = document.querySelector('canvas').getContext('2d'),
+ parchment = document.getElementById("parchment");
+
+ if(!Detect.supportsWebSocket()) {
+ parchment.className = "error";
+ }
+
+ if(ctx.mozImageSmoothingEnabled === undefined) {
+ document.querySelector('body').className += ' upscaled';
+ }
+
+ if(!Modernizr.localstorage) {
+ var alert = document.createElement("div");
+ alert.className = 'alert';
+ alertMsg = document.createTextNode("You need to enable cookies/localStorage to play BrowserQuest");
+ alert.appendChild(alertMsg);
+
+ target = document.getElementById("intro");
+ document.body.insertBefore(alert, target);
+ } else if(localStorage && localStorage.data) {
+ parchment.className = "loadcharacter";
+ }
+ </script>
+
+ <script src="js/lib/log.js"></script>
+ <script>
+ var require = { waitSeconds: 60 };
+ </script>
+ <script data-main="js/home" src="js/lib/require-jquery.js"></script>
+ </body>
+</html>

0 comments on commit 0fc4eac

Please sign in to comment.
Something went wrong with that request. Please try again.