work in progress, adding multiple examples

.gitignore

@@ -19,6 +19,6 @@ node_modules
 docs/
 lib/
 *.map
-example/build
+examples/*/build
 test/build
 test/coverage

example/src/typings.d.ts

@@ -1 +0,0 @@
-/// <reference path="../../typings/es6-promise/es6-promise.d.ts"/>

examples/console/package.json

@@ -0,0 +1,13 @@
+{
+  "private": true,
+  "name": "jupyter-js-notebook-example",
+  "scripts": {
+    "build": "tsc --project src && webpack --config webpack.conf.js",
+    "clean": "rimraf build && rimraf node_modules",
+    "postinstall": "npm dedupe",
+    "update": "rimraf node_modules/jupyter-js-notebook && npm install"
+  },
+  "devDependencies": {
+    "concurrently": "^2.0.0"
+  }
+}

examples/console/src/index.ts

@@ -0,0 +1,127 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) 2014-2015, Jupyter Development Team.
+|
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+'use strict';
+
+import {
+  deserialize, selectKernel, trustNotebook, findKernel,
+  ConsolePanel, ConsoleWidget
+} from 'jupyter-js-notebook';
+
+import {
+  ContentsManager, IKernelSpecIds, startNewSession,
+  getKernelSpecs
+} from 'jupyter-js-services';
+
+import {
+  RenderMime
+} from 'jupyter-js-ui/lib/rendermime';
+
+import {
+  HTMLRenderer, LatexRenderer, ImageRenderer, TextRenderer,
+  ConsoleTextRenderer, JavascriptRenderer, SVGRenderer
+} from 'jupyter-js-ui/lib/renderers';
+
+import {
+  getBaseUrl
+} from 'jupyter-js-utils';
+
+import {
+  CommandPalette, StandardPaletteModel, IStandardPaletteItemOptions
+} from 'phosphor-commandpalette';
+
+import {
+  KeymapManager, IKeyBinding
+} from 'phosphor-keymap';
+
+import {
+  SplitPanel
+} from 'phosphor-splitpanel';
+
+import {
+  Widget
+} from 'phosphor-widget';
+
+import 'jupyter-js-notebook/lib/index.css';
+import 'jupyter-js-notebook/lib/theme.css';
+import 'jupyter-js-ui/lib/dialog/index.css';
+import 'jupyter-js-ui/lib/dialog/theme.css';
+
+
+let SERVER_URL = getBaseUrl();
+let NOTEBOOK = 'Console';
+
+
+function main(): void {
+  // Initialize the keymap manager with the bindings.
+  var keymap = new KeymapManager();
+
+  // Setup the keydown listener for the document.
+  document.addEventListener('keydown', event => {
+    keymap.processKeydownEvent(event);
+  });
+
+  let contents = new ContentsManager(SERVER_URL);
+  let rendermime = new RenderMime<Widget>();
+  const transformers = [
+    new JavascriptRenderer(),
+    new HTMLRenderer(),
+    new ImageRenderer(),
+    new SVGRenderer(),
+    new LatexRenderer(),
+    new ConsoleTextRenderer(),
+    new TextRenderer()
+  ];
+
+  for (let t of transformers) {
+    for (let m of t.mimetypes) {
+      rendermime.order.push(m);
+      rendermime.renderers[m] = t;
+    }
+  }
+
+  let consoleWidget = new ConsolePanel();
+  consoleWidget.title.text = NOTEBOOK;
+
+  let pModel = new StandardPaletteModel();
+  let palette = new CommandPalette();
+  palette.model = pModel;
+
+  let panel = new SplitPanel();
+  panel.id = 'main';
+  panel.orientation = SplitPanel.Horizontal;
+  panel.spacing = 0;
+  SplitPanel.setStretch(palette, 0);
+  SplitPanel.setStretch(consoleWidget, 1);
+  panel.attach(document.body);
+  panel.addChild(palette);
+  panel.addChild(consoleWidget);
+  window.onresize = () => { panel.update(); };
+
+  let kernelspecs: IKernelSpecIds;
+
+  let items: IStandardPaletteItemOptions[] = [];
+  pModel.addItems(items);
+
+  let bindings: IKeyBinding[] = [];
+  keymap.add(bindings);
+
+  contents.get(NOTEBOOK, {}).then(data => {
+    // deserialize(data.content, nbModel);
+    getKernelSpecs({}).then(specs => {
+      kernelspecs = specs;
+      // start session
+      // startNewSession({
+      //   notebookPath: NOTEBOOK,
+      //   kernelName: findKernel(nbModel, specs),
+      //   baseUrl: SERVER_URL
+      // }).then(session => {
+      //   nbModel.session = session;
+      // });
+    });
+  });
+}
+
+window.onload = main;

examples/console/src/typings.d.ts

@@ -0,0 +1 @@
+/// <reference path="../../../typings/es6-promise/es6-promise.d.ts"/>

examples/notebook/index.css

@@ -0,0 +1,115 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) 2014-2016, Jupyter Development Team.
+|
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+body {
+  margin: 0;
+  padding: 0;
+}
+
+
+#main {
+  position: absolute;
+  top: 4px;
+  left: 4px;
+  right: 4px;
+  bottom: 4px;
+}
+
+.jp-Notebook-panel {
+  border-bottom: 1px solid #E0E0E0;
+}
+
+.p-CommandPalette {
+  min-width: 325px;
+  background: #F8F8F8;
+  border: 1px solid #E0E0E0;
+  color: #757575;
+  font-family: "Helvetica Neue", Helvetica;
+}
+
+
+.p-CommandPalette-search {
+  padding: 8px;
+}
+
+
+.p-CommandPalette-inputWrapper {
+  padding: 4px 6px;
+  background: white;
+  border: 1px solid #E0E0E0;
+}
+
+
+.p-CommandPalette-input {
+  width: 100%;
+  border: none;
+  outline: none;
+  font-size: 16px;
+}
+
+
+.p-CommandPalette-header {
+  padding: 4px;
+  color: #757575;
+  font-size: 12px;
+  font-weight: 600;
+  text-transform: capitalize;
+  background: #E1E1E1;
+  cursor: pointer;
+}
+
+
+.p-CommandPalette-header.p-mod-active {
+  background: #7FDBFF;
+}
+
+
+.p-CommandPalette-header:hover::before {
+  content: '\2026'; /* ellipsis */
+  float: right;
+  margin-right: 4px;
+}
+
+
+.p-CommandPalette-header > mark {
+  background-color: transparent;
+  font-weight: bold;
+}
+
+
+.p-CommandPalette-command {
+  padding: 4px 8px;
+  color: #757575;
+  font-size: 13px;
+  font-weight: 500;
+}
+
+
+.p-CommandPalette-command.p-mod-active {
+  background: #7FDBFF;
+}
+
+
+.p-CommandPalette-command:hover:not(.p-mod-active) {
+  background: #EBEBEB;
+}
+
+
+.p-CommandPalette-commandText > mark {
+  background-color: transparent;
+  font-weight: bold;
+}
+
+
+.p-CommandPalette-commandCaption {
+  color: #9E9E9E;
+  font-size: 11px;
+  font-weight: 400;
+}
+
+
+.p-CommandPalette-commandShortcut {
+  color: #bbbaaa;
+}

examples/notebook/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Notebook Demo</title>
+    <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML-full,Safe&amp;delayStartupUntil=configured"></script>
+    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
+    <link rel="stylesheet" type="text/css" href="index.css">
+  </head>
+  <body>
+    <script id='jupyter-config-data' type="application/json">{ "baseUrl": "{{base_url}}" }</script>
+    <script src="build/bundle.js"></script>
+  </body>
+</html>

examples/notebook/main.py

@@ -0,0 +1,83 @@
+"""
+Copyright (c) Jupyter Development Team.
+Distributed under the terms of the Modified BSD License.
+"""
+import re
+import subprocess
+import sys
+import threading
+
+import tornado.web
+
+PORT = 8765
+
+
+class MainPageHandler(tornado.web.RequestHandler):
+
+    def initialize(self, base_url):
+        self.base_url = base_url
+
+    def get(self):
+        return self.render("index.html", static=self.static_url,
+                           base_url=self.base_url)
+
+
+def main(argv):
+
+    url = "http://localhost:%s" % PORT
+
+    nb_command = [sys.executable, '-m', 'notebook', '--no-browser', '--debug',
+                  '--NotebookApp.allow_origin="%s"' % url]
+    nb_server = subprocess.Popen(nb_command, stderr=subprocess.STDOUT,
+                                 stdout=subprocess.PIPE)
+
+    # wait for notebook server to start up
+    while 1:
+        line = nb_server.stdout.readline().decode('utf-8').strip()
+        if not line:
+            continue
+        print(line)
+        if 'Jupyter Notebook is running at:' in line:
+            base_url = re.search('(http.*?)$', line).groups()[0]
+            break
+
+    while 1:
+        line = nb_server.stdout.readline().decode('utf-8').strip()
+        if not line:
+            continue
+        print(line)
+        if 'Control-C' in line:
+            break
+
+    def print_thread():
+        while 1:
+            line = nb_server.stdout.readline().decode('utf-8').strip()
+            if not line:
+                continue
+            print(line)
+    thread = threading.Thread(target=print_thread)
+    thread.setDaemon(True)
+    thread.start()
+
+    handlers = [
+        (r"/", MainPageHandler, {'base_url': base_url}),
+        (r'/(.*)', tornado.web.StaticFileHandler, {'path': '.'}),
+    ]
+
+    app = tornado.web.Application(handlers, static_path='build',
+                                  template_path='.',
+                                  compiled_template_cache=False)
+
+    app.listen(PORT, 'localhost')
+    loop = tornado.ioloop.IOLoop.instance()
+    print('Browse to http://localhost:%s' % PORT)
+    try:
+        loop.start()
+    except KeyboardInterrupt:
+        print(" Shutting down on SIGINT")
+    finally:
+        nb_server.kill()
+        loop.close()
+
+if __name__ == '__main__':
+    main(sys.argv)

examples/notebook/package.json

@@ -0,0 +1,13 @@
+{
+  "private": true,
+  "name": "jupyter-js-notebook-example",
+  "scripts": {
+    "build": "tsc --project src && webpack --config webpack.conf.js",
+    "clean": "rimraf build && rimraf node_modules",
+    "postinstall": "npm dedupe",
+    "update": "rimraf node_modules/jupyter-js-notebook && npm install"
+  },
+  "devDependencies": {
+    "concurrently": "^2.0.0"
+  }
+}

examples/notebook/src/tsconfig.json

@@ -0,0 +1,10 @@
+{
+    "compilerOptions": {
+        "noImplicitAny": true,
+        "noEmitOnError": true,
+        "module": "commonjs",
+        "moduleResolution": "node",
+        "target": "ES5",
+        "outDir": "../build"
+    }
+}

examples/notebook/src/typings.d.ts

@@ -0,0 +1 @@
+/// <reference path="../../../typings/es6-promise/es6-promise.d.ts"/>

examples/notebook/webpack.conf.js

@@ -0,0 +1,18 @@
+
+module.exports = {
+  entry: './build/index.js',
+  output: {
+    path: __dirname + "/build",
+    filename: "bundle.js",
+    publicPath: "./build/"
+  },
+  debug: true,
+  devtool: 'source-map',
+  module: {
+    loaders: [
+      { test: /\.css$/, loader: 'style-loader!css-loader' },
+      { test: /\.json$/, loader: 'json-loader' },
+      { test: /\.html$/, loader: 'file' },
+    ]
+  }
+}

example/package.json → examples/package.json

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "name": "jupyter-js-notebook-example",
+  "name": "jupyter-js-notebook-examples",
   "dependencies": {
     "jupyter-js-notebook": "file:..",
     "phosphor-commandpalette": "^0.2.0",
@@ -9,12 +9,12 @@
     "phosphor-widget": "^1.0.0-rc.1"
   },
   "scripts": {
-    "build": "tsc --project src && webpack --config webpack.conf.js",
-    "clean": "rimraf build && rimraf node_modules",
+    "build": "cd .. && npm run build:examples",
+    "clean": "rimraf node_modules",
     "postinstall": "npm dedupe",
     "update": "rimraf node_modules/jupyter-js-notebook && npm install"
   },
   "devDependencies": {
-    "concurrently": "^2.0.0"
+    "rimraf": "^2.5.2"
   }
 }

package.json

@@ -43,8 +43,8 @@
   },
   "scripts": {
     "clean": "rimraf docs && rimraf lib && rimraf test/build",
-    "clean:example": "rimraf example/build",
-    "build:example": "cd example && npm run update && npm run build",
+    "clean:examples": "node scripts/cleanexamples.js",
+    "build:examples": "node scripts/buildexamples.js",
     "build:src": "tsc --project src && node scripts/copycss.js",
     "build:test": "tsc --project test/src",
     "build": "npm run build:src && npm run build:test",
@@ -57,7 +57,7 @@
     "test:ie": "karma start --browsers=IE test/karma.conf.js",
     "test:debug": "karma start --browsers=Chrome --singleRun=false --debug=true test/karma.conf.js",
     "test": "mocha test/build/**/*.spec.js",
-    "watch:example": "watch 'npm run build && npm run build:example' src --wait 10",
+    "watch:examples": "watch 'npm run build && npm run build:examples' src --wait 10",
     "watch": "watch 'npm run build' src"
   },
   "repository": {

scripts/buildexamples.js

@@ -0,0 +1,24 @@
+var childProcess = require('child_process');
+var fs = require('fs');
+
+process.chdir('examples');
+childProcess.execSync('npm install', { stdio: 'inherit' });
+childProcess.execSync('npm run update', { stdio: 'inherit' });
+process.chdir('..');
+
+// Build all of the example folders.
+dirs = fs.readdirSync('examples');
+
+var cmd;
+for (var i = 0; i < dirs.length; i++) {
+  if (dirs[i].indexOf('.') !== -1) {
+    continue;
+  }
+  if (dirs[i].indexOf('node_modules') !== -1) {
+    continue;
+  }
+  console.log('Building: ' + dirs[i] + '...');
+  process.chdir('examples/' + dirs[i]);
+  childProcess.execSync('npm run build', { stdio: 'inherit' });
+  process.chdir('../..');
+}

scripts/cleanexamples.js

@@ -0,0 +1,15 @@
+var childProcess = require('child_process');
+var fs = require('fs');
+
+childProcess.execSync('rimraf examples/node_modules', { stdio: 'inherit' });
+
+// Clean all of the example folders.
+dirs = fs.readdirSync('examples');
+
+for (var i = 0; i < dirs.length; i++) {
+  if (dirs[i].indexOf('.') !== -1) {
+    continue;
+  }
+  var cmd = 'rimraf examples/' + dirs[i] + '/build';
+  childProcess.execSync(cmd, { stdio: [0, 1, 2] });
+}

src/notebook/index.ts

@@ -2,5 +2,6 @@
 // Distributed under the terms of the Modified BSD License.
 'use strict';
 
+export * from './console/index';
 export * from './kernelselector/index';
 export * from './notebook/index';