diff --git a/.jshintrc b/.jshintrc index 3195d9b..a14afdd 100644 --- a/.jshintrc +++ b/.jshintrc @@ -41,6 +41,7 @@ "it": true, "jasmine": true, "module": true, + "phantom": true, "process": true, "require": true, "requirejs": true, diff --git a/Gruntfile.js b/Gruntfile.js index d818b70..16ce331 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -63,11 +63,19 @@ module.exports = function (grunt) { dest: '<%= clean.app %>', cwd: './assets/app', expand: true + }, + + img: { + src: '**/*.png', + dest: '<%= clean.img %>', + cwd: './assets/images', + expand: true } }, clean: { app: './static/app', + img: './static/images', compass: './sass-cache', karma: './karma-*', tmp: './tmp-*.tmp' diff --git a/assets/app/widgets/slide/template.hbs b/assets/app/widgets/slide/template.hbs index 4d8a8f1..dcc0450 100644 --- a/assets/app/widgets/slide/template.hbs +++ b/assets/app/widgets/slide/template.hbs @@ -1,11 +1,12 @@
{{#code}} +
- - - -
-
+ + + + +
{{/code}}
diff --git a/assets/app/widgets/slide/view.js b/assets/app/widgets/slide/view.js index cc9a5cc..10b734c 100644 --- a/assets/app/widgets/slide/view.js +++ b/assets/app/widgets/slide/view.js @@ -23,9 +23,7 @@ define([ ui: { copy: '.copy', code: '.language-javascript', - button: '.request', - stdout: '.stdout', - stderr: '.stderr' + button: '.request' }, events: { @@ -50,16 +48,18 @@ define([ onRequestResult: function onRequestResult(event) { event.preventDefault(); var env = $(event.target).data('env'); + if (env === 'clear') { + this.render(); + return; + } var results = new ResultsModel({id: this.model.get('id'), env: env}); - var $stdout = this.ui.stdout; - var $stderr = this.ui.stderr; + var $code = this.ui.code; results.fetch({ success: function () { - $stdout.text(results.get('stdout')); - $stderr.text(results.get('stderr')); + $code.text(results.get('stdout') + results.get('stderr')); }, error: function () { - $stdout.text('error'); + $code.text('error'); } }); } diff --git a/assets/images/phantomjs.png b/assets/images/phantomjs.png new file mode 100644 index 0000000..52d2d34 Binary files /dev/null and b/assets/images/phantomjs.png differ diff --git a/assets/style/main.scss b/assets/style/main.scss index a995285..660a5d9 100644 --- a/assets/style/main.scss +++ b/assets/style/main.scss @@ -1,11 +1,36 @@ @import "_normalize"; +@import "compass"; + + +$slide-width: 1280px; +$slide-height: 720px; + +$main-text: #4a2c0a; +$base-font-size: 36px; +$mega-font-size: 80px; +$strong-color: #566b15; +$background-color: #ffdfdf; html, body { height: 100%; + @include background-image(linear-gradient(to bottom, $background-color, white)); } -$slide-width: 1280px; -$slide-height: 720px; +h1 { + font-size: $mega-font-size; +} + +h2 { + font-size: $mega-font-size / 12 * 9; +} + +strong { + color: $strong-color; +} + +li { + line-height: 3em; +} .deck { position: relative; @@ -13,9 +38,12 @@ $slide-height: 720px; .slide { width: $slide-width; + height: $slide-height; margin: 0 auto; -} + color: $main-text; + font-size: $base-font-size; -.page-2 { - background-color: #bada55; + pre, code { + overflow: visible; + } } diff --git a/bin/deck b/bin/deck index 265153b..e164d62 100755 --- a/bin/deck +++ b/bin/deck @@ -24,9 +24,9 @@ app.use((function log() { }())); function renderError(res, err) { - console.error(err); + console.error(err.toString()); res.writeHead(500, {'Content-Type': 'text/plain'}); - res.write(err); + res.send(err.toString()); } function pathToFile() { @@ -127,8 +127,11 @@ app.get(/slide\/(\d+)/, function showHandler(req, res, next) { app.get(/results\/([^\/]+)\/(\d\d)$/, function resultsHandler(req, res, next) { var app = req.params[0]; var slideId = req.params[1]; + var validApps = [ + 'node', 'phantomjs-1.9.8', 'phantomjs-2.0.0' + ]; - if (!_.contains(['node', 'phantomjs-1.9.8', 'phantomjs-2.0.0'], app)) { + if (!_.contains(validApps, app)) { next(); return; } @@ -177,7 +180,7 @@ app.get(/results\/([^\/]+)\/(\d\d)$/, function resultsHandler(req, res, next) { return; } if (err) { - renderError(res, err); + res.send({stdout: '', stderr: err.toString()}); return; } res.send({stdout: stdout, stderr: stderr}); diff --git a/data/code/phantom-webpage-screenshot.js b/data/code/phantom-webpage-screenshot.js new file mode 100644 index 0000000..2246a33 --- /dev/null +++ b/data/code/phantom-webpage-screenshot.js @@ -0,0 +1,10 @@ +var webpage = require('webpage'); +var page = webpage.create(); + +page.viewportSize = {width: 1280, height: 720}; + +page.open('http://phantomjs.org', function() { + page.render('phantomjs.png'); + console.log('created phantomjs.png'); + phantom.exit(); +}); diff --git a/data/code/prototypes.js b/data/code/prototypes.js index aca8eb3..abbda08 100644 --- a/data/code/prototypes.js +++ b/data/code/prototypes.js @@ -1,5 +1,11 @@ (function (phantom) { - console.log(Function.prototype.bind); + console.log('bind:', typeof Function.prototype.bind); + console.log('9 === parseInt("09"):', 9 === parseInt('09')); + + console.log('map:', typeof Array.prototype.map); + console.log('reduce:', typeof Array.prototype.reduce); + console.log('filter:', typeof Array.prototype.filter); + console.log('Object.create:', typeof Object.create); if (phantom) { phantom.exit(); diff --git a/data/copy/about.md b/data/copy/about.md new file mode 100644 index 0000000..4ca678c --- /dev/null +++ b/data/copy/about.md @@ -0,0 +1,7 @@ +# About Me + + - Hi, I'm Buddy ☺ + - Not affiliated with PhantomJS in any way + - Principal Software Engineer at Convertro/AOL (we're hiring) + - Full Stack engineer (JavaScript, Go, Python, etc) + - Like motorcycles, math, science and obnoxious 80's punk diff --git a/data/copy/define-developer.md b/data/copy/define-developer.md new file mode 100644 index 0000000..d40a1c3 --- /dev/null +++ b/data/copy/define-developer.md @@ -0,0 +1,3 @@ +# Developer Definition: + +## PhantomJS is a **JavaScript runtime** that gives access to native **Qt/WebKit** objects. diff --git a/data/copy/define-simple.md b/data/copy/define-simple.md new file mode 100644 index 0000000..008290a --- /dev/null +++ b/data/copy/define-simple.md @@ -0,0 +1,3 @@ +# Simple Definition: + +## Headless Web Browser diff --git a/data/copy/js-runtime.md b/data/copy/js-runtime.md new file mode 100644 index 0000000..204c9df --- /dev/null +++ b/data/copy/js-runtime.md @@ -0,0 +1 @@ +# JavaScript Runtime diff --git a/data/copy/only-title.md b/data/copy/only-title.md new file mode 100644 index 0000000..cfa4384 --- /dev/null +++ b/data/copy/only-title.md @@ -0,0 +1 @@ +# PhantomJS diff --git a/data/copy/screen-shot.md b/data/copy/screen-shot.md new file mode 100644 index 0000000..dd602d3 --- /dev/null +++ b/data/copy/screen-shot.md @@ -0,0 +1,3 @@ +# PhantomJS + +![PhantomJS webpage screenshot](/static/images/phantomjs.png "PhantomJS") diff --git a/data/copy/title.md b/data/copy/title.md index 27fa35c..f349254 100644 --- a/data/copy/title.md +++ b/data/copy/title.md @@ -1,3 +1,7 @@ # PhantomJS Under the Hood - - Buddy Sandidge +## Buddy Sandidge + + - [github.com/xbudex/phantom-talk](https://github.com/xbudex/phantom-talk) + + - buddy.sandidge@gmail.com diff --git a/data/slide/01.json b/data/slide/01.json index 07cd2c3..2c94aea 100644 --- a/data/slide/01.json +++ b/data/slide/01.json @@ -1,4 +1,3 @@ { - "copy": "title", - "code": "prototypes" + "copy": "title" } diff --git a/data/slide/02.json b/data/slide/02.json index a63c8ad..1a86225 100644 --- a/data/slide/02.json +++ b/data/slide/02.json @@ -1,3 +1,3 @@ { - "copy": "define" + "copy": "about" } diff --git a/data/slide/03.json b/data/slide/03.json new file mode 100644 index 0000000..5c165e9 --- /dev/null +++ b/data/slide/03.json @@ -0,0 +1,3 @@ +{ + "copy": "screen-shot" +} diff --git a/data/slide/04.json b/data/slide/04.json new file mode 100644 index 0000000..e9a3a5a --- /dev/null +++ b/data/slide/04.json @@ -0,0 +1,4 @@ +{ + "copy": "only-title", + "code": "phantom-webpage-screenshot" +} diff --git a/data/slide/05.json b/data/slide/05.json new file mode 100644 index 0000000..9302e07 --- /dev/null +++ b/data/slide/05.json @@ -0,0 +1,3 @@ +{ + "copy": "define-developer" +} diff --git a/data/slide/06.json b/data/slide/06.json new file mode 100644 index 0000000..468ceb8 --- /dev/null +++ b/data/slide/06.json @@ -0,0 +1,4 @@ +{ + "copy": "js-runtime", + "code": "prototypes" +}