recommit with proper nodejs skeleton

This commit is contained in:
damouse 2017-02-12 17:25:04 -06:00
commit 3485cc3c5f
20 changed files with 195950 additions and 0 deletions

5
.eslintignore Normal file
View file

@ -0,0 +1,5 @@
dist
node_modules
coverage
webpack.*.js
*Server.js

191
.eslintrc Normal file
View file

@ -0,0 +1,191 @@
{
"parser": "babel-eslint", // https://github.com/babel/babel-eslint
"env": {
"browser": true,
"node": true,
"mocha": true
},
"globals": {
"expect": true,
"sinon": true,
"__DEV__": true
},
"ecmaFeatures": {
"arrowFunctions": true,
"blockBindings": true,
"classes": true,
"defaultParams": true,
"destructuring": true,
"forOf": true,
"generators": false,
"modules": true,
"objectLiteralComputedProperties": true,
"objectLiteralDuplicateProperties": false,
"objectLiteralShorthandMethods": true,
"objectLiteralShorthandProperties": true,
"spread": true,
"superInFunctions": true,
"templateStrings": true,
"jsx": true
},
"rules": {
"no-var": 2, // http://eslint.org/docs/rules/no-var
"prefer-const": 2, // http://eslint.org/docs/rules/prefer-const
/**
* Variables
*/
"no-shadow": 2, // http://eslint.org/docs/rules/no-shadow
"no-shadow-restricted-names": 2, // http://eslint.org/docs/rules/no-shadow-restricted-names
"no-undef": 2, // http://eslint.org/docs/rules/no-undef
"no-unused-vars": [2, { // http://eslint.org/docs/rules/no-unused-vars
"vars": "local",
"args": "after-used"
}],
"no-use-before-define": 2, // http://eslint.org/docs/rules/no-use-before-define
/**
* Possible errors
*/
"no-cond-assign": [2, "always"], // http://eslint.org/docs/rules/no-cond-assign
"no-console": 1, // http://eslint.org/docs/rules/no-console
"no-debugger": 1, // http://eslint.org/docs/rules/no-debugger
"no-alert": 1, // http://eslint.org/docs/rules/no-alert
"no-constant-condition": 1, // http://eslint.org/docs/rules/no-constant-condition
"no-dupe-keys": 2, // http://eslint.org/docs/rules/no-dupe-keys
"no-duplicate-case": 2, // http://eslint.org/docs/rules/no-duplicate-case
"no-empty": 2, // http://eslint.org/docs/rules/no-empty
"no-ex-assign": 2, // http://eslint.org/docs/rules/no-ex-assign
"no-extra-boolean-cast": 0, // http://eslint.org/docs/rules/no-extra-boolean-cast
"no-extra-semi": 2, // http://eslint.org/docs/rules/no-extra-semi
"no-func-assign": 2, // http://eslint.org/docs/rules/no-func-assign
"no-inner-declarations": 2, // http://eslint.org/docs/rules/no-inner-declarations
"no-invalid-regexp": 2, // http://eslint.org/docs/rules/no-invalid-regexp
"no-irregular-whitespace": 2, // http://eslint.org/docs/rules/no-irregular-whitespace
"no-obj-calls": 2, // http://eslint.org/docs/rules/no-obj-calls
"no-sparse-arrays": 2, // http://eslint.org/docs/rules/no-sparse-arrays
"no-unreachable": 2, // http://eslint.org/docs/rules/no-unreachable
"use-isnan": 2, // http://eslint.org/docs/rules/use-isnan
"block-scoped-var": 2, // http://eslint.org/docs/rules/block-scoped-var
/**
* Best practices
*/
"consistent-return": 2, // http://eslint.org/docs/rules/consistent-return
"curly": [2, "multi-line"], // http://eslint.org/docs/rules/curly
"default-case": 2, // http://eslint.org/docs/rules/default-case
"dot-notation": [2, { // http://eslint.org/docs/rules/dot-notation
"allowKeywords": true
}],
"eqeqeq": 2, // http://eslint.org/docs/rules/eqeqeq
"guard-for-in": 2, // http://eslint.org/docs/rules/guard-for-in
"no-caller": 2, // http://eslint.org/docs/rules/no-caller
"no-else-return": 2, // http://eslint.org/docs/rules/no-else-return
"no-eq-null": 2, // http://eslint.org/docs/rules/no-eq-null
"no-eval": 2, // http://eslint.org/docs/rules/no-eval
"no-extend-native": 2, // http://eslint.org/docs/rules/no-extend-native
"no-extra-bind": 2, // http://eslint.org/docs/rules/no-extra-bind
"no-fallthrough": 2, // http://eslint.org/docs/rules/no-fallthrough
"no-floating-decimal": 2, // http://eslint.org/docs/rules/no-floating-decimal
"no-implied-eval": 2, // http://eslint.org/docs/rules/no-implied-eval
"no-lone-blocks": 2, // http://eslint.org/docs/rules/no-lone-blocks
"no-loop-func": 2, // http://eslint.org/docs/rules/no-loop-func
"no-multi-str": 2, // http://eslint.org/docs/rules/no-multi-str
"no-native-reassign": 2, // http://eslint.org/docs/rules/no-native-reassign
"no-new": 2, // http://eslint.org/docs/rules/no-new
"no-new-func": 2, // http://eslint.org/docs/rules/no-new-func
"no-new-wrappers": 2, // http://eslint.org/docs/rules/no-new-wrappers
"no-octal": 2, // http://eslint.org/docs/rules/no-octal
"no-octal-escape": 2, // http://eslint.org/docs/rules/no-octal-escape
"no-param-reassign": 2, // http://eslint.org/docs/rules/no-param-reassign
"no-proto": 2, // http://eslint.org/docs/rules/no-proto
"no-redeclare": 2, // http://eslint.org/docs/rules/no-redeclare
"no-return-assign": 2, // http://eslint.org/docs/rules/no-return-assign
"no-script-url": 2, // http://eslint.org/docs/rules/no-script-url
"no-self-compare": 2, // http://eslint.org/docs/rules/no-self-compare
"no-sequences": 2, // http://eslint.org/docs/rules/no-sequences
"no-throw-literal": 2, // http://eslint.org/docs/rules/no-throw-literal
"no-with": 2, // http://eslint.org/docs/rules/no-with
"radix": 2, // http://eslint.org/docs/rules/radix
"vars-on-top": 2, // http://eslint.org/docs/rules/vars-on-top
"wrap-iife": [2, "any"], // http://eslint.org/docs/rules/wrap-iife
"yoda": 2, // http://eslint.org/docs/rules/yoda
/**
* Style
*/
"indent": [2, 2], // http://eslint.org/docs/rules/indent
"brace-style": [
2, // http://eslint.org/docs/rules/brace-style
"1tbs", {
"allowSingleLine": true
}
],
"quotes": [
2, "single", "avoid-escape" // http://eslint.org/docs/rules/quotes
],
"camelcase": [2, { // http://eslint.org/docs/rules/camelcase
"properties": "never"
}],
"comma-spacing": [2, { // http://eslint.org/docs/rules/comma-spacing
"before": false,
"after": true
}],
"comma-style": [2, "last"], // http://eslint.org/docs/rules/comma-style
"eol-last": 2, // http://eslint.org/docs/rules/eol-last
"func-names": 1, // http://eslint.org/docs/rules/func-names
"key-spacing": [2, { // http://eslint.org/docs/rules/key-spacing
"beforeColon": false,
"afterColon": true
}],
"new-cap": [0, { // http://eslint.org/docs/rules/new-cap
"newIsCap": true
}],
"no-multiple-empty-lines": [2, { // http://eslint.org/docs/rules/no-multiple-empty-lines
"max": 2
}],
"no-nested-ternary": 2, // http://eslint.org/docs/rules/no-nested-ternary
"no-new-object": 2, // http://eslint.org/docs/rules/no-new-object
"no-spaced-func": 2, // http://eslint.org/docs/rules/no-spaced-func
"no-trailing-spaces": 2, // http://eslint.org/docs/rules/no-trailing-spaces
"no-extra-parens": [2, "functions"], // http://eslint.org/docs/rules/no-extra-parens
"no-underscore-dangle": 0, // http://eslint.org/docs/rules/no-underscore-dangle
"one-var": [2, "never"], // http://eslint.org/docs/rules/one-var
"padded-blocks": [2, "never"], // http://eslint.org/docs/rules/padded-blocks
"semi": [2, "always"], // http://eslint.org/docs/rules/semi
"semi-spacing": [2, { // http://eslint.org/docs/rules/semi-spacing
"before": false,
"after": true
}],
"space-after-keywords": 2, // http://eslint.org/docs/rules/space-after-keywords
"space-before-blocks": 2, // http://eslint.org/docs/rules/space-before-blocks
"space-before-function-paren": [2, "never"], // http://eslint.org/docs/rules/space-before-function-paren
"space-infix-ops": 2, // http://eslint.org/docs/rules/space-infix-ops
"space-return-throw-case": 2, // http://eslint.org/docs/rules/space-return-throw-case
"spaced-comment": [2, "always", {// http://eslint.org/docs/rules/spaced-comment
"exceptions": ["-", "+"],
"markers": ["=", "!"] // space here to support sprockets directives
}],
// React
"jsx-quotes": [2, "prefer-double"],
"react/display-name": 0,
"react/jsx-boolean-value": 1,
"react/jsx-no-undef": 2,
"react/jsx-sort-prop-types": 0,
"react/jsx-sort-props": 0,
"react/jsx-uses-react": 1,
"react/jsx-uses-vars": 1,
"react/no-did-mount-set-state": [2, "allow-in-func"],
"react/no-did-update-set-state": 2,
"react/no-multi-comp": 2,
"react/no-unknown-property": 2,
"react/prop-types": 2,
"react/react-in-jsx-scope": 2,
"react/self-closing-comp": 2,
"react/sort-comp": 2,
"react/wrap-multilines": 2
},
"plugins": [
"react"
]
}

6
.gitignore vendored Normal file
View file

@ -0,0 +1,6 @@
node_modules
.DS_Store
dist
*.log
coverage
.idea

0
.jsbeautifyrc Normal file
View file

22
LICENSE Normal file
View file

@ -0,0 +1,22 @@
The MIT License (MIT)
Copyright (c) 2015 Christian Alfoni
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

38
README.md Normal file
View file

@ -0,0 +1,38 @@
# webpack-express-boilerplate
A boilerplate for running a Webpack workflow in Node express
Please read the following article: [The ultimate Webpack setup](http://www.christianalfoni.com/articles/2015_04_19_The-ultimate-webpack-setup) to know more about this boilerplate.
## Major update to project
Inspired by [this project](https://github.com/vesparny/react-kickstart) and the evolving of [react-transform](https://github.com/gaearon/react-transform-boilerplate) and [CSS Modules]((http://glenmaddern.com/articles/css-modules)), this project has gotten a major upgrade.
**NOTE!** Use the latest version of Node, 4.x.x.
## Install and Running
`git clone https://github.com/christianalfoni/webpack-express-boilerplate.git`
or just export the files:
`svn export https://github.com/christianalfoni/webpack-express-boilerplate/trunk ./dir`
1. cd webpack-express-boilerplate
2. npm install
3. npm start
4. navigate to http://localhost:3000 in your browser of choice.
## Overview
### React by default
The project runs with React by default and hot replacement of changes to the modules. Currently it is on 0.14.3.
### CSS Modules
CSS files loaded into components are locally scoped and you can point to class names with javascript. You can also compose classes together, also from other files. These are also hot loaded. Read more about them [here](http://glenmaddern.com/articles/css-modules).
To turn off CSS Modules remove it from the `webpack.config.js` file.
### Babel and Linting
Both Node server and frontend code runs with Babel. And all of it is linted. With atom you install the `linter` package, then `linter-eslint` and `linter-jscs`. You are covered. Also run `npm run eslint` or `npm run jscs` to verify all files. I would recommend installing `language-babel` package too for syntax highlighting
### Beautify
With a beautify package installed in your editor it will also do that

196
app/index.html Normal file
View file

@ -0,0 +1,196 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
<meta name="description" content="mupen64plus via emscripten : A port of the popular Nintendo 64 emulator for the web" />
<link rel="stylesheet" type="text/css" media="screen" href="/assets/stylesheets/stylesheet.css">
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<title>Drop64</title>
</head>
<body>
<!-- MAIN CONTENT -->
<div id="main_content_wrap" class="outer">
<section id="main_content" class="inner">
<h3>
Controls
</h3>
<p>
Analog stick: Arrow keys
<br/> B button: F
<br/> A button: G
<br/> Z Trigger: Z
<br/> L/R Trigger: X,C
<br/> C buttons U/D/L/R: I,K,J,L
<br/> Start: Enter
<br/> DPAD U/D/L/R: W,S,A,D
<br/>
</p>
<h3>
Play
</h3>
<p>
<style>
.emscripten {
padding-right: 0;
margin-left: auto;
margin-right: auto;
display: block;
}
div.emscripten {
text-align: center;
}
div.emscripten_border {
border: 1px solid black;
}
/* the canvas *must not* have any border or padding, or mouse coords will be wrong */
canvas.emscripten {
border: 0px none;
}
#emscripten_logo {
display: inline-block;
margin: 0;
}
.spinner {
height: 30px;
width: 30px;
margin: 0;
margin-top: 20px;
margin-left: 20px;
display: inline-block;
vertical-align: top;
-webkit-animation: rotation .8s linear infinite;
-moz-animation: rotation .8s linear infinite;
-o-animation: rotation .8s linear infinite;
animation: rotation 0.8s linear infinite;
border-left: 5px solid rgb(235, 235, 235);
border-right: 5px solid rgb(235, 235, 235);
border-bottom: 5px solid rgb(235, 235, 235);
border-top: 5px solid rgb(120, 120, 120);
border-radius: 100%;
background-color: rgb(189, 215, 46);
}
@-webkit-keyframes rotation {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
@-moz-keyframes rotation {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(360deg);
}
}
@-o-keyframes rotation {
from {
-o-transform: rotate(0deg);
}
to {
-o-transform: rotate(360deg);
}
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
#status {
display: inline-block;
vertical-align: top;
margin-top: 30px;
margin-left: 20px;
font-weight: bold;
color: rgb(120, 120, 120);
}
#progress {
height: 20px;
width: 30px;
}
#controls {
display: inline-block;
float: right;
vertical-align: top;
margin-top: 30px;
margin-right: 20px;
}
#output {
width: 100%;
height: 200px;
margin: 0 auto;
margin-top: 10px;
display: block;
background-color: black;
color: white;
font-family: 'Lucida Console', Monaco, monospace;
outline: none;
}
</style>
<div class="spinner" id='spinner'></div>
<div class="emscripten" id="status">Downloading...</div>
<div id='filechooser' style="visibility:hidden;">
<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>
<script>
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
if (files.length != 1)
return;
var reader = new FileReader();
reader.onload = function(e) {
var rom = files[0].name;
FS.writeFile(rom, new Uint8Array(e.target.result), {
encoding: 'binary'
});
document.getElementById('filechooser').style.visibility = 'hidden';
Module['callMain'](['--resolution', '640x480', rom]);
};
reader.readAsArrayBuffer(files[0]);
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
</div>
<div class="emscripten">
<progress value="0" max="100" id="progress" hidden=1></progress>
</div>
<div class="emscripten_border">
<canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()"></canvas>
</div>
<script type='text/javascript' src='assets/main.js'></script>
<script async type="text/javascript" src="assets/mupen64plus-ui-console.js"></script>
</p>
<!-- FOOTER -->
<div id="footer_wrap" class="outer">
<footer class="inner">
<p class="copyright">mupen64plus via emscripten maintained by <a href="https://github.com/jquesnelle">jquesnelle</a></p>
<p>Published with <a href="http://pages.github.com">GitHub Pages</a></p>
</footer>
</div>
</body>
</html>

111
app/main.js Normal file
View file

@ -0,0 +1,111 @@
var statusElement = document.getElementById('status');
var progressElement = document.getElementById('progress');
var spinnerElement = document.getElementById('spinner');
var Module = {
preRun: (function() {
document.getElementById('filechooser').style.visibility = 'visible';
document.getElementById('spinner').style.display = 'none';
document.getElementById('status').style.display = 'none';
})(),
postRun: [],
noInitialRun: true,
print: (function() {
var element = document.getElementById('output');
if (element) element.value = ''; // clear browser cache
return function(text) {
text = Array.prototype.slice.call(arguments).join(' ');
// These replacements are necessary if you render to raw HTML
//text = text.replace(/&/g, "&amp;");
//text = text.replace(/</g, "&lt;");
//text = text.replace(/>/g, "&gt;");
//text = text.replace('\n', '<br>', 'g');
// console.log(text);
if (element) {
element.value += text + "\n";
element.scrollTop = element.scrollHeight; // focus on bottom
}
};
})(),
printErr: function(text) {
text = Array.prototype.slice.call(arguments).join(' ');
if (0) { // XXX disabled for safety typeof dump == 'function') {
dump(text + '\n'); // fast, straight to the real console
} else {
console.error(text);
}
},
canvas: document.getElementById('canvas'),
setStatus: function(text) {
if (!Module.setStatus.last) Module.setStatus.last = {
time: Date.now(),
text: ''
};
if (text === Module.setStatus.text) return;
var m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);
var now = Date.now();
if (m && now - Date.now() < 30) return; // if this is a progress update, skip it if too soon
if (m) {
text = m[1];
progressElement.value = parseInt(m[2]) * 100;
progressElement.max = parseInt(m[4]) * 100;
progressElement.hidden = false;
spinnerElement.hidden = false;
} else {
progressElement.value = null;
progressElement.max = null;
progressElement.hidden = true;
if (!text) spinnerElement.style.display = 'none';
}
statusElement.innerHTML = text;
},
totalDependencies: 0,
monitorRunDependencies: function(left) {
this.totalDependencies = Math.max(this.totalDependencies, left);
Module.setStatus(left ? 'Preparing... (' + (this.totalDependencies - left) + '/' + this.totalDependencies + ')' : 'All downloads complete.');
}
};
Module.setStatus('Downloading...');
var socket = io.connect('localhost:3000');
function makeKeyboardEvent(event, key) {
var e = document.createEvent("KeyboardEvent");
var initMethod = typeof e.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";
e[initMethod](event, true, true, window, false, false, false, false, key.charCodeAt(0), key.charCodeAt(0));
e._key = key;
e._code = 13;
document.dispatchEvent(e);
}
function mycode() {
makeKeyboardEvent("keydown", 'Enter');
setTimeout(function() {
makeKeyboardEvent("keyup", 'Enter');
}, 100);
// console.log("Emitting")
// socket.emit("input", "Hello");
}
var tid = setInterval(mycode, 1000);
function abortTimer() { // to be called when you want to stop the timer
clearInterval(tid);
}
// Ending fun stuff
/*
Todo:
- Ionic setup
- Frontend Setup
- Websocket command proxying
- Basic sensors
- Is multiplayer possible?
*/

File diff suppressed because it is too large Load diff

176329
app/mupen64plus-ui-console.js Normal file

File diff suppressed because one or more lines are too long

View file

@ -0,0 +1,70 @@
.highlight .hll { background-color: #ffffcc }
.highlight { background: #f0f3f3; }
.highlight .c { color: #0099FF; font-style: italic } /* Comment */
.highlight .err { color: #AA0000; background-color: #FFAAAA } /* Error */
.highlight .k { color: #006699; font-weight: bold } /* Keyword */
.highlight .o { color: #555555 } /* Operator */
.highlight .cm { color: #0099FF; font-style: italic } /* Comment.Multiline */
.highlight .cp { color: #009999 } /* Comment.Preproc */
.highlight .c1 { color: #0099FF; font-style: italic } /* Comment.Single */
.highlight .cs { color: #0099FF; font-weight: bold; font-style: italic } /* Comment.Special */
.highlight .gd { background-color: #FFCCCC; border: 1px solid #CC0000 } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gr { color: #FF0000 } /* Generic.Error */
.highlight .gh { color: #003300; font-weight: bold } /* Generic.Heading */
.highlight .gi { background-color: #CCFFCC; border: 1px solid #00CC00 } /* Generic.Inserted */
.highlight .go { color: #AAAAAA } /* Generic.Output */
.highlight .gp { color: #000099; font-weight: bold } /* Generic.Prompt */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #003300; font-weight: bold } /* Generic.Subheading */
.highlight .gt { color: #99CC66 } /* Generic.Traceback */
.highlight .kc { color: #006699; font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: #006699; font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: #006699; font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: #006699 } /* Keyword.Pseudo */
.highlight .kr { color: #006699; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #007788; font-weight: bold } /* Keyword.Type */
.highlight .m { color: #FF6600 } /* Literal.Number */
.highlight .s { color: #CC3300 } /* Literal.String */
.highlight .na { color: #330099 } /* Name.Attribute */
.highlight .nb { color: #336666 } /* Name.Builtin */
.highlight .nc { color: #00AA88; font-weight: bold } /* Name.Class */
.highlight .no { color: #336600 } /* Name.Constant */
.highlight .nd { color: #9999FF } /* Name.Decorator */
.highlight .ni { color: #999999; font-weight: bold } /* Name.Entity */
.highlight .ne { color: #CC0000; font-weight: bold } /* Name.Exception */
.highlight .nf { color: #CC00FF } /* Name.Function */
.highlight .nl { color: #9999FF } /* Name.Label */
.highlight .nn { color: #00CCFF; font-weight: bold } /* Name.Namespace */
.highlight .nt { color: #330099; font-weight: bold } /* Name.Tag */
.highlight .nv { color: #003333 } /* Name.Variable */
.highlight .ow { color: #000000; font-weight: bold } /* Operator.Word */
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
.highlight .mf { color: #FF6600 } /* Literal.Number.Float */
.highlight .mh { color: #FF6600 } /* Literal.Number.Hex */
.highlight .mi { color: #FF6600 } /* Literal.Number.Integer */
.highlight .mo { color: #FF6600 } /* Literal.Number.Oct */
.highlight .sb { color: #CC3300 } /* Literal.String.Backtick */
.highlight .sc { color: #CC3300 } /* Literal.String.Char */
.highlight .sd { color: #CC3300; font-style: italic } /* Literal.String.Doc */
.highlight .s2 { color: #CC3300 } /* Literal.String.Double */
.highlight .se { color: #CC3300; font-weight: bold } /* Literal.String.Escape */
.highlight .sh { color: #CC3300 } /* Literal.String.Heredoc */
.highlight .si { color: #AA0000 } /* Literal.String.Interpol */
.highlight .sx { color: #CC3300 } /* Literal.String.Other */
.highlight .sr { color: #33AAAA } /* Literal.String.Regex */
.highlight .s1 { color: #CC3300 } /* Literal.String.Single */
.highlight .ss { color: #FFCC33 } /* Literal.String.Symbol */
.highlight .bp { color: #336666 } /* Name.Builtin.Pseudo */
.highlight .vc { color: #003333 } /* Name.Variable.Class */
.highlight .vg { color: #003333 } /* Name.Variable.Global */
.highlight .vi { color: #003333 } /* Name.Variable.Instance */
.highlight .il { color: #FF6600 } /* Literal.Number.Integer.Long */
.type-csharp .highlight .k { color: #0000FF }
.type-csharp .highlight .kt { color: #0000FF }
.type-csharp .highlight .nf { color: #000000; font-weight: normal }
.type-csharp .highlight .nc { color: #2B91AF }
.type-csharp .highlight .nn { color: #000000 }
.type-csharp .highlight .s { color: #A31515 }
.type-csharp .highlight .sc { color: #A31515 }

View file

@ -0,0 +1,423 @@
/*******************************************************************************
Slate Theme for GitHub Pages
by Jason Costello, @jsncostello
*******************************************************************************/
@import url(pygment_trac.css);
/*******************************************************************************
MeyerWeb Reset
*******************************************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
ol, ul {
list-style: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*******************************************************************************
Theme Styles
*******************************************************************************/
body {
box-sizing: border-box;
color:#373737;
background: #212121;
font-size: 16px;
font-family: 'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
margin: 10px 0;
font-weight: 700;
color:#222222;
font-family: 'Lucida Grande', 'Calibri', Helvetica, Arial, sans-serif;
letter-spacing: -1px;
}
h1 {
font-size: 36px;
font-weight: 700;
}
h2 {
padding-bottom: 10px;
font-size: 32px;
background: url('../images/bg_hr.png') repeat-x bottom;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 21px;
}
h5 {
font-size: 18px;
}
h6 {
font-size: 16px;
}
p {
margin: 10px 0 15px 0;
}
footer p {
color: #f2f2f2;
}
a {
text-decoration: none;
color: #007edf;
text-shadow: none;
transition: color 0.5s ease;
transition: text-shadow 0.5s ease;
-webkit-transition: color 0.5s ease;
-webkit-transition: text-shadow 0.5s ease;
-moz-transition: color 0.5s ease;
-moz-transition: text-shadow 0.5s ease;
-o-transition: color 0.5s ease;
-o-transition: text-shadow 0.5s ease;
-ms-transition: color 0.5s ease;
-ms-transition: text-shadow 0.5s ease;
}
a:hover, a:focus {text-decoration: underline;}
footer a {
color: #F2F2F2;
text-decoration: underline;
}
em {
font-style: italic;
}
strong {
font-weight: bold;
}
img {
position: relative;
margin: 0 auto;
max-width: 739px;
padding: 5px;
margin: 10px 0 10px 0;
border: 1px solid #ebebeb;
box-shadow: 0 0 5px #ebebeb;
-webkit-box-shadow: 0 0 5px #ebebeb;
-moz-box-shadow: 0 0 5px #ebebeb;
-o-box-shadow: 0 0 5px #ebebeb;
-ms-box-shadow: 0 0 5px #ebebeb;
}
p img {
display: inline;
margin: 0;
padding: 0;
vertical-align: middle;
text-align: center;
border: none;
}
pre, code {
width: 100%;
color: #222;
background-color: #fff;
font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace;
font-size: 14px;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}
pre {
width: 100%;
padding: 10px;
box-shadow: 0 0 10px rgba(0,0,0,.1);
overflow: auto;
}
code {
padding: 3px;
margin: 0 3px;
box-shadow: 0 0 10px rgba(0,0,0,.1);
}
pre code {
display: block;
box-shadow: none;
}
blockquote {
color: #666;
margin-bottom: 20px;
padding: 0 0 0 20px;
border-left: 3px solid #bbb;
}
ul, ol, dl {
margin-bottom: 15px
}
ul {
list-style: inside;
padding-left: 20px;
}
ol {
list-style: decimal inside;
padding-left: 20px;
}
dl dt {
font-weight: bold;
}
dl dd {
padding-left: 20px;
font-style: italic;
}
dl p {
padding-left: 20px;
font-style: italic;
}
hr {
height: 1px;
margin-bottom: 5px;
border: none;
background: url('../images/bg_hr.png') repeat-x center;
}
table {
border: 1px solid #373737;
margin-bottom: 20px;
text-align: left;
}
th {
font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;
padding: 10px;
background: #373737;
color: #fff;
}
td {
padding: 10px;
border: 1px solid #373737;
}
form {
background: #f2f2f2;
padding: 20px;
}
/*******************************************************************************
Full-Width Styles
*******************************************************************************/
.outer {
width: 100%;
}
.inner {
position: relative;
max-width: 640px;
padding: 20px 10px;
margin: 0 auto;
}
#forkme_banner {
display: block;
position: absolute;
top:0;
right: 10px;
z-index: 10;
padding: 10px 50px 10px 10px;
color: #fff;
background: url('../images/blacktocat.png') #0090ff no-repeat 95% 50%;
font-weight: 700;
box-shadow: 0 0 10px rgba(0,0,0,.5);
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
}
#header_wrap {
background: #212121;
background: -moz-linear-gradient(top, #373737, #212121);
background: -webkit-linear-gradient(top, #373737, #212121);
background: -ms-linear-gradient(top, #373737, #212121);
background: -o-linear-gradient(top, #373737, #212121);
background: linear-gradient(top, #373737, #212121);
}
#header_wrap .inner {
padding: 50px 10px 30px 10px;
}
#project_title {
margin: 0;
color: #fff;
font-size: 42px;
font-weight: 700;
text-shadow: #111 0px 0px 10px;
}
#project_tagline {
color: #fff;
font-size: 24px;
font-weight: 300;
background: none;
text-shadow: #111 0px 0px 10px;
}
#downloads {
position: absolute;
width: 210px;
z-index: 10;
bottom: -40px;
right: 0;
height: 70px;
background: url('../images/icon_download.png') no-repeat 0% 90%;
}
.zip_download_link {
display: block;
float: right;
width: 90px;
height:70px;
text-indent: -5000px;
overflow: hidden;
background: url(../images/sprite_download.png) no-repeat bottom left;
}
.tar_download_link {
display: block;
float: right;
width: 90px;
height:70px;
text-indent: -5000px;
overflow: hidden;
background: url(../images/sprite_download.png) no-repeat bottom right;
margin-left: 10px;
}
.zip_download_link:hover {
background: url(../images/sprite_download.png) no-repeat top left;
}
.tar_download_link:hover {
background: url(../images/sprite_download.png) no-repeat top right;
}
#main_content_wrap {
background: #f2f2f2;
border-top: 1px solid #111;
border-bottom: 1px solid #111;
}
#main_content {
padding-top: 40px;
}
#footer_wrap {
background: #212121;
}
/*******************************************************************************
Small Device Styles
*******************************************************************************/
@media screen and (max-width: 480px) {
body {
font-size:14px;
}
#downloads {
display: none;
}
.inner {
min-width: 320px;
max-width: 480px;
}
#project_title {
font-size: 32px;
}
h1 {
font-size: 28px;
}
h2 {
font-size: 24px;
}
h3 {
font-size: 21px;
}
h4 {
font-size: 18px;
}
h5 {
font-size: 14px;
}
h6 {
font-size: 12px;
}
code, pre {
min-width: 320px;
max-width: 480px;
font-size: 11px;
}
}

69
package.json Normal file
View file

@ -0,0 +1,69 @@
{
"name": "webpack-express-boilerplate",
"version": "0.1.0",
"description": "A boilerplate for running a Webpack workflow in Node express",
"main": "server.js",
"repository": {
"type": "git",
"url": "https://github.com/christianalfoni/webpack-express-boilerplate.git"
},
"keywords": [
"express",
"webpack",
"node"
],
"author": "Christian Alfoni",
"license": "MIT",
"bugs": {
"url": "https://github.com/christianalfoni/webpack-express-boilerplate/issues"
},
"homepage": "https://github.com/christianalfoni/webpack-express-boilerplate",
"scripts": {
"test": "",
"start": "node server",
"build": "rimraf dist && cross-env NODE_ENV=production webpack --config ./webpack.production.config.js --progress --profile --colors",
"eslint": "eslint .",
"jscs": "jscs ."
},
"dependencies": {
"babel-cli": "^6.4.0",
"babel-core": "^6.22.1",
"react": "^0.14.3",
"react-dom": "^0.14.3",
"socket.io": "^1.7.2"
},
"devDependencies": {
"autoprefixer": "^6.0.3",
"babel-eslint": "^4.1.6",
"babel-loader": "^6.2.3",
"babel-jscs": "^2.0.5",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-react-hmre": "^1.1.0",
"babel-preset-stage-0": "^6.3.13",
"chai": "^3.2.0",
"cross-env": "^1.0.7",
"css-loader": "^0.19.0",
"eslint": "^1.5.0",
"eslint-plugin-react": "^3.4.2",
"express": "^4.13.3",
"extract-text-webpack-plugin": "^0.8.2",
"html-webpack-plugin": "^1.6.1",
"jscs": "^2.1.1",
"jsdom": "^6.5.1",
"json-loader": "^0.5.3",
"mocha": "^2.3.3",
"mocha-jsdom": "^1.0.0",
"postcss-loader": "^0.6.0",
"react-addons-test-utils": "^0.14.3",
"react-transform-hmr": "^1.0.0",
"rimraf": "^2.4.3",
"sinon": "^1.16.1",
"sinon-chai": "^2.8.0",
"stats-webpack-plugin": "^0.2.1",
"style-loader": "^0.12.4",
"webpack": "^1.12.2",
"webpack-dev-middleware": "^1.2.0",
"webpack-hot-middleware": "^2.2.0"
}
}

17
server.js Normal file
View file

@ -0,0 +1,17 @@
const express = require('express');
const app = express();
const port = process.env.PORT || 3000;
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.use('/assets', express.static('./app'));
app.get('/', (req, res) => { res.sendFile('index.html', { root: './app' }) })
io.on('connection', (socket) => {
socket.on("input", (m) => {
console.log(m);
})
});
http.listen(port, '0.0.0.0');;

5
typings.json Normal file
View file

@ -0,0 +1,5 @@
{
"globalDependencies": {
"socket.io-client": "registry:dt/socket.io-client#1.4.4+20161116080703"
}
}

View file

@ -0,0 +1,668 @@
// Generated by typings
// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/8a087da260f4d46ab13450cf531417b940c11797/socket.io-client/index.d.ts
declare var io: SocketIOClientStatic;
declare module 'socket.io-client' {
export = io;
}
interface SocketIOClientStatic {
/**
* Looks up an existing 'Manager' for multiplexing. If the user summons:
* 'io( 'http://localhost/a' );'
* 'io( 'http://localhost/b' );'
*
* We reuse the existing instance based on the same scheme/port/host, and
* we initialize sockets for each namespace. If autoConnect isn't set to
* false in the options, then we'll automatically connect
* @param uri The uri that we'll connect to, including the namespace, where '/' is the default one (e.g. http://localhost:4000/somenamespace)
* @opts Any connect options that we want to pass along
* @return A Socket object
*/
( uri: string, opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Socket;
/**
* Auto-connects to the window location and defalt namespace.
* E.g. window.protocol + '//' + window.host + ':80/'
* @opts Any connect options that we want to pass along
* @return A Socket object
*/
( opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Socket;
/**
* @see the default constructor (io(uri, opts))
*/
connect( uri: string, opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Socket;
/**
* @see the default constructor (io(opts))
*/
connect( opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Socket;
/**
* The socket.io protocol revision number this client works with
* @default 4
*/
protocol: number;
/**
* Socket constructor - exposed for the standalone build
*/
Socket: SocketIOClient.Socket;
/**
* Manager constructor - exposed for the standalone build
*/
Manager: SocketIOClient.ManagerStatic;
}
declare namespace SocketIOClient {
/**
* The base emiter class, used by Socket and Manager
*/
interface Emitter {
/**
* Adds a listener for a particular event. Calling multiple times will add
* multiple listeners
* @param event The event that we're listening for
* @param fn The function to call when we get the event. Parameters depend on the
* event in question
* @return This Emitter
*/
on( event: string, fn: Function ):Emitter;
/**
* @see on( event, fn )
*/
addEventListener( event: string, fn: Function ):Emitter;
/**
* Adds a listener for a particular event that will be invoked
* a single time before being automatically removed
* @param event The event that we're listening for
* @param fn The function to call when we get the event. Parameters depend on
* the event in question
* @return This Emitter
*/
once( event: string, fn: Function ):Emitter;
/**
* Removes a listener for a particular type of event. This will either
* remove a specific listener, or all listeners for this type of event
* @param event The event that we want to remove the listener of
* @param fn The function to remove, or null if we want to remove all functions
* @return This Emitter
*/
off( event: string, fn?: Function ):Emitter;
/**
* @see off( event, fn )
*/
removeListener( event: string, fn?: Function ):Emitter;
/**
* @see off( event, fn )
*/
removeEventListener( event: string, fn?: Function ):Emitter;
/**
* Removes all event listeners on this object
* @return This Emitter
*/
removeAllListeners():Emitter;
/**
* Emits 'event' with the given args
* @param event The event that we want to emit
* @param args Optional arguments to emit with the event
* @return Emitter
*/
emit( event: string, ...args: any[] ):Emitter;
/**
* Returns all the callbacks for a particular event
* @param event The event that we're looking for the callbacks of
* @return An array of callback Functions, or an empty array if we don't have any
*/
listeners( event: string ):Function[];
/**
* Returns if we have listeners for a particular event
* @param event The event that we want to check if we've listeners for
* @return True if we have listeners for this event, false otherwise
*/
hasListeners( event: string ):boolean;
}
/**
* The Socket static interface
*/
interface SocketStatic {
/**
* Creates a new Socket, used for communicating with a specific namespace
* @param io The Manager that's controlling this socket
* @param nsp The namespace that this socket is for (@default '/')
* @return A new Socket
*/
( io: SocketIOClient.Manager, nsp: string ): Socket;
/**
* Creates a new Socket, used for communicating with a specific namespace
* @param io The Manager that's controlling this socket
* @param nsp The namespace that this socket is for (@default '/')
* @return A new Socket
*/
new ( url: string, opts: any ): SocketIOClient.Manager;
}
/**
* The Socket that we use to connect to a Namespace on the server
*/
interface Socket extends Emitter {
/**
* The Manager that's controller this socket
*/
io: SocketIOClient.Manager;
/**
* The namespace that this socket is for
* @default '/'
*/
nsp: string;
/**
* The ID of the socket; matches the server ID and is set when we're connected, and cleared
* when we're disconnected
*/
id: string;
/**
* Are we currently connected?
* @default false
*/
connected: boolean;
/**
* Are we currently disconnected?
* @default true
*/
disconnected: boolean;
/**
* Opens our socket so that it connects. If the 'autoConnect' option for io is
* true (default), then this is called automatically when the Socket is created
*/
open(): Socket;
/**
* @see open();
*/
connect(): Socket;
/**
* Sends a 'message' event
* @param args Any optional arguments that we want to send
* @see emit
* @return This Socket
*/
send( ...args: any[] ):Socket;
/**
* An override of the base emit. If the event is one of:
* connect
* connect_error
* connect_timeout
* connecting
* disconnect
* error
* reconnect
* reconnect_attempt
* reconnect_failed
* reconnect_error
* reconnecting
* ping
* pong
* then the event is emitted normally. Otherwise, if we're connected, the
* event is sent. Otherwise, it's buffered.
*
* If the last argument is a function, then it will be called
* as an 'ack' when the response is received. The parameter(s) of the
* ack will be whatever data is returned from the event
* @param event The event that we're emitting
* @param args Optional arguments to send with the event
* @return This Socket
*/
emit( event: string, ...args: any[] ):Socket;
/**
* Disconnects the socket manually
* @return This Socket
*/
close():Socket;
/**
* @see close()
*/
disconnect():Socket;
/**
* Sets the compress flag.
* @param compress If `true`, compresses the sending data
* @return this Socket
*/
compress(compress: boolean):Socket;
}
/**
* The Manager static interface
*/
interface ManagerStatic {
/**
* Creates a new Manager
* @param uri The URI that we're connecting to (e.g. http://localhost:4000)
* @param opts Any connection options that we want to use (and pass to engine.io)
* @return A Manager
*/
( uri: string, opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Manager;
/**
* Creates a new Manager with the default URI (window host)
* @param opts Any connection options that we want to use (and pass to engine.io)
*/
( opts: SocketIOClient.ConnectOpts ):SocketIOClient.Manager;
/**
* @see default constructor
*/
new ( uri: string, opts?: SocketIOClient.ConnectOpts ): SocketIOClient.Manager;
/**
* @see default constructor
*/
new ( opts: SocketIOClient.ConnectOpts ):SocketIOClient.Manager;
}
/**
* The Manager class handles all the Namespaces and Sockets that we're using
*/
interface Manager extends Emitter {
/**
* All the namespaces currently controlled by this Manager, and the Sockets
* that we're using to communicate with them
*/
nsps: { [namespace:string]: Socket };
/**
* The connect options that we used when creating this Manager
*/
opts: SocketIOClient.ConnectOpts;
/**
* The state of the Manager. Either 'closed', 'opening', or 'open'
*/
readyState: string;
/**
* The URI that this manager is for (host + port), e.g. 'http://localhost:4000'
*/
uri: string;
/**
* The currently connected sockets
*/
connecting: Socket[];
/**
* If we should auto connect (also used when creating Sockets). Set via the
* opts object
*/
autoConnect: boolean;
/**
* Gets if we should reconnect automatically
* @default true
*/
reconnection(): boolean;
/**
* Sets if we should reconnect automatically
* @param v True if we should reconnect automatically, false otherwise
* @default true
* @return This Manager
*/
reconnection( v: boolean ): Manager;
/**
* Gets the number of reconnection attempts we should try before giving up
* @default Infinity
*/
reconnectionAttempts(): number;
/**
* Sets the number of reconnection attempts we should try before giving up
* @param v The number of attempts we should do before giving up
* @default Infinity
* @return This Manager
*/
reconnectionAttempts( v: number ): Manager;
/**
* Gets the delay in milliseconds between each reconnection attempt
* @default 1000
*/
reconnectionDelay(): number;
/**
* Sets the delay in milliseconds between each reconnection attempt
* @param v The delay in milliseconds
* @default 1000
* @return This Manager
*/
reconnectionDelay( v: number ): Manager;
/**
* Gets the max reconnection delay in milliseconds between each reconnection
* attempt
* @default 5000
*/
reconnectionDelayMax(): number;
/**
* Sets the max reconnection delay in milliseconds between each reconnection
* attempt
* @param v The max reconnection dleay in milliseconds
* @return This Manager
*/
reconnectionDelayMax( v: number ): Manager;
/**
* Gets the randomisation factor used in the exponential backoff jitter
* when reconnecting
* @default 0.5
*/
randomizationFactor(): number;
/**
* Sets the randomisation factor used in the exponential backoff jitter
* when reconnecting
* @param The reconnection randomisation factor
* @default 0.5
* @return This Manager
*/
randomizationFactor( v: number ): Manager;
/**
* Gets the timeout in milliseconds for our connection attempts
* @default 20000
*/
timeout(): number;
/**
* Sets the timeout in milliseconds for our connection attempts
* @param The connection timeout milliseconds
* @return This Manager
*/
timeout(v: number): Manager;
/**
* Sets the current transport socket and opens our connection
* @param fn An optional callback to call when our socket has either opened, or
* failed. It can take one optional parameter of type Error
* @return This Manager
*/
open( fn?: (err?: any) => void ): Manager;
/**
* @see open( fn );
*/
connect( fn?: (err?: any) => void ): Manager;
/**
* Creates a new Socket for the given namespace
* @param nsp The namespace that this Socket is for
* @return A new Socket, or if one has already been created for this namespace,
* an existing one
*/
socket( nsp: string ): Socket;
}
/**
* Options we can pass to the socket when connecting
*/
interface ConnectOpts {
/**
* Should we force a new Manager for this connection?
* @default false
*/
forceNew?: boolean;
/**
* Should we multiplex our connection (reuse existing Manager) ?
* @default true
*/
multiplex?: boolean;
/**
* The path to get our client file from, in the case of the server
* serving it
* @default '/socket.io'
*/
path?: string;
/**
* Should we allow reconnections?
* @default true
*/
reconnection?: boolean;
/**
* How many reconnection attempts should we try?
* @default Infinity
*/
reconnectionAttempts?: number;
/**
* The time delay in milliseconds between reconnection attempts
* @default 1000
*/
reconnectionDelay?: number;
/**
* The max time delay in milliseconds between reconnection attempts
* @default 5000
*/
reconnectionDelayMax?: number;
/**
* Used in the exponential backoff jitter when reconnecting
* @default 0.5
*/
randomizationFactor?: number;
/**
* The timeout in milliseconds for our connection attempt
* @default 20000
*/
timeout?: number;
/**
* Should we automically connect?
* @default true
*/
autoConnect?: boolean;
/**
* The host that we're connecting to. Set from the URI passed when connecting
*/
host?: string;
/**
* The hostname for our connection. Set from the URI passed when connecting
*/
hostname?: string;
/**
* If this is a secure connection. Set from the URI passed when connecting
*/
secure?: boolean;
/**
* The port for our connection. Set from the URI passed when connecting
*/
port?: string;
/**
* Any query parameters in our uri. Set from the URI passed when connecting
*/
query?: Object;
/**
* `http.Agent` to use, defaults to `false` (NodeJS only)
*/
agent?: string|boolean;
/**
* Whether the client should try to upgrade the transport from
* long-polling to something better.
* @default true
*/
upgrade?: boolean;
/**
* Forces JSONP for polling transport.
*/
forceJSONP?: boolean;
/**
* Determines whether to use JSONP when necessary for polling. If
* disabled (by settings to false) an error will be emitted (saying
* "No transports available") if no other transports are available.
* If another transport is available for opening a connection (e.g.
* WebSocket) that transport will be used instead.
* @default true
*/
jsonp?: boolean;
/**
* Forces base 64 encoding for polling transport even when XHR2
* responseType is available and WebSocket even if the used standard
* supports binary.
*/
forceBase64?: boolean;
/**
* Enables XDomainRequest for IE8 to avoid loading bar flashing with
* click sound. default to `false` because XDomainRequest has a flaw
* of not sending cookie.
* @default false
*/
enablesXDR?: boolean;
/**
* The param name to use as our timestamp key
* @default 't'
*/
timestampParam?: string;
/**
* Whether to add the timestamp with each transport request. Note: this
* is ignored if the browser is IE or Android, in which case requests
* are always stamped
* @default false
*/
timestampRequests?: boolean;
/**
* A list of transports to try (in order). Engine.io always attempts to
* connect directly with the first one, provided the feature detection test
* for it passes.
* @default ['polling','websocket']
*/
transports?: string[];
/**
* The port the policy server listens on
* @default 843
*/
policyPost?: number;
/**
* If true and if the previous websocket connection to the server succeeded,
* the connection attempt will bypass the normal upgrade process and will
* initially try websocket. A connection attempt following a transport error
* will use the normal upgrade process. It is recommended you turn this on
* only when using SSL/TLS connections, or if you know that your network does
* not block websockets.
* @default false
*/
rememberUpgrade?: boolean;
/**
* Are we only interested in transports that support binary?
*/
onlyBinaryUpgrades?: boolean;
/**
* Header options for Node.js client
*/
extraHeaders?: Object;
/**
* (SSL) Certificate, Private key and CA certificates to use for SSL.
* Can be used in Node.js client environment to manually specify
* certificate information.
*/
pfx?: string;
/**
* (SSL) Private key to use for SSL. Can be used in Node.js client
* environment to manually specify certificate information.
*/
key?: string;
/**
* (SSL) A string or passphrase for the private key or pfx. Can be
* used in Node.js client environment to manually specify certificate
* information.
*/
passphrase?: string
/**
* (SSL) Public x509 certificate to use. Can be used in Node.js client
* environment to manually specify certificate information.
*/
cert?: string;
/**
* (SSL) An authority certificate or array of authority certificates to
* check the remote host against.. Can be used in Node.js client
* environment to manually specify certificate information.
*/
ca?: string|string[];
/**
* (SSL) A string describing the ciphers to use or exclude. Consult the
* [cipher format list]
* (http://www.openssl.org/docs/apps/ciphers.html#CIPHER_LIST_FORMAT) for
* details on the format.. Can be used in Node.js client environment to
* manually specify certificate information.
*/
ciphers?: string;
/**
* (SSL) If true, the server certificate is verified against the list of
* supplied CAs. An 'error' event is emitted if verification fails.
* Verification happens at the connection level, before the HTTP request
* is sent. Can be used in Node.js client environment to manually specify
* certificate information.
*/
rejectUnauthorized?: boolean;
}
}

View file

@ -0,0 +1,8 @@
{
"resolution": "main",
"tree": {
"src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/8a087da260f4d46ab13450cf531417b940c11797/socket.io-client/index.d.ts",
"raw": "registry:dt/socket.io-client#1.4.4+20161116080703",
"typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/8a087da260f4d46ab13450cf531417b940c11797/socket.io-client/index.d.ts"
}
}

1
typings/index.d.ts vendored Normal file
View file

@ -0,0 +1 @@
/// <reference path="globals/socket.io-client/index.d.ts" />

47
webpack.config.js Normal file
View file

@ -0,0 +1,47 @@
'use strict';
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
devtool: 'eval-source-map',
entry: [
'webpack-hot-middleware/client?reload=true',
path.join(__dirname, 'app/main.js')
],
output: {
path: path.join(__dirname, '/dist/'),
filename: '[name].js',
publicPath: '/'
},
plugins: [
new HtmlWebpackPlugin({
template: 'app/index.tpl.html',
inject: 'body',
filename: 'index.html'
}),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
})
],
module: {
loaders: [{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
"presets": ["react", "es2015", "stage-0", "react-hmre"]
}
}, {
test: /\.json?$/,
loader: 'json'
}, {
test: /\.css$/,
loader: 'style!css?modules&localIdentName=[name]---[local]---[hash:base64:5]'
}]
}
};

View file

@ -0,0 +1,59 @@
'use strict';
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var StatsPlugin = require('stats-webpack-plugin');
module.exports = {
entry: [
path.join(__dirname, 'app/main.js')
],
output: {
path: path.join(__dirname, '/dist/'),
filename: '[name]-[hash].min.js',
publicPath: '/'
},
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new HtmlWebpackPlugin({
template: 'app/index.tpl.html',
inject: 'body',
filename: 'index.html'
}),
new ExtractTextPlugin('[name]-[hash].min.css'),
new webpack.optimize.UglifyJsPlugin({
compressor: {
warnings: false,
screw_ie8: true
}
}),
new StatsPlugin('webpack.stats.json', {
source: false,
modules: false
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
})
],
module: {
loaders: [{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
"presets": ["es2015", "stage-0", "react"]
}
}, {
test: /\.json?$/,
loader: 'json'
}, {
test: /\.css$/,
loader: ExtractTextPlugin.extract('style', 'css?modules&localIdentName=[name]---[local]---[hash:base64:5]!postcss')
}]
},
postcss: [
require('autoprefixer')
]
};