this is good enough

This commit is contained in:
John Bintz 2013-07-18 18:58:23 -04:00
parent 0d18024d47
commit ab3f0b7a3d
98 changed files with 63 additions and 6 deletions

8
app.js
View File

@ -66,7 +66,8 @@ presentation.directive('presentation', function() {
replace: true, replace: true,
templateUrl: 'presentation.html', templateUrl: 'presentation.html',
controller: function($scope, options) { controller: function($scope, options) {
$scope.options = options $scope.options = options;
$scope.codeBlocks = ($scope.codeBlocks || {});
}, },
}; };
}); });
@ -77,7 +78,8 @@ presentation.directive('slide', function(boundScopeHelper) {
replace: true, replace: true,
transclude: true, transclude: true,
scope: { scope: {
'options': '=' 'options': '=',
'codeBlocks': '='
}, },
controller: function($scope) { controller: function($scope) {
$scope.state = ($scope.state || {}); $scope.state = ($scope.state || {});
@ -192,6 +194,8 @@ presentation.directive('codeDisplayer', function(boundScopeHelper) {
}, },
templateUrl: 'code_displayer.html', templateUrl: 'code_displayer.html',
link: function(scope, element, attrs) { link: function(scope, element, attrs) {
scope.codeBlocks = scope.codeBlocks || {};
scope.$watch('codeBlocks', function(codeBlocks) { scope.$watch('codeBlocks', function(codeBlocks) {
if (codeBlocks && codeBlocks[attrs.for]) { if (codeBlocks && codeBlocks[attrs.for]) {
var beautifier; var beautifier;

View File

@ -108,13 +108,49 @@
</form> </form>
</script> </script>
<code-runner for="hide_show"></code-runner> <code-runner for="hide_show"></code-runner>
<code-displayer for="hide_show" language="html"></code-displayer> </slide>
<slide id="basic-click-hide-show-code">
<section id="basic-click-hide-show-code-code">
<code-displayer for="hide_show" language="html"></code-displayer>
</section>
</slide>
<slide id="ng-directives">
<section id="ng-init" ng-show="state.current == 1">
<title><code>ng-init</code></title>
<subtitle>"Run this expression!"</subtitle>
</section>
<section id="ng-show" ng-show="state.current == 2">
<title><code>ng-show</code></title>
<subtitle>"Make me display: visible if..."</subtitle>
</section>
<section id="ng-click" ng-show="state.current == 3">
<title><code>ng-click</code></title>
<subtitle>"If I'm clicked, run this expression!"</subtitle>
</section>
<section id="ng-disabled" ng-show="state.current == 4">
<title><code>ng-disabled</code></title>
<subtitle>"Make me disabled if..."</subtitle>
</section>
<form ng-init="state.current = 1">
<fieldset class="btn-group">
<button class="btn" ng-click="state.current = 1" ng-disabled="state.current == 1">ng-init</button>
<button class="btn" ng-click="state.current = 2" ng-disabled="state.current == 2">ng-show</button>
<button class="btn" ng-click="state.current = 3" ng-disabled="state.current == 3">ng-click</button>
<button class="btn" ng-click="state.current = 4" ng-disabled="state.current == 4">ng-disabled</button>
</fieldset>
</form>
</slide> </slide>
<slide id="different-from-onclick"> <slide id="different-from-onclick">
<section id="different-from-onclick-about"> <section id="different-from-onclick-about">
<title>But how is this different from good old <code>onclick</code>, ...?</title> <title>But how is this different from good old <code>onclick</code>, ...?</title>
</section> </section>
</slide> </slide>
<slide id="scope">
<section id="scope-info">
<title>AngularJS applications have scopes</title>
<subtitle>separate out the app from the page, and the app parts from each other</subtitle>
</section>
</slide>
<slide id="html-compiler"> <slide id="html-compiler">
<section id="html-compiler-info"> <section id="html-compiler-info">
<title>AngularJS has an HTML compiler</title> <title>AngularJS has an HTML compiler</title>
@ -175,6 +211,12 @@
<subtitle>not quite the same as handlers attached to the DOM</subtitle> <subtitle>not quite the same as handlers attached to the DOM</subtitle>
</section> </section>
</slide> </slide>
<slide id="no-window-binding">
<section id="no-window-binding-info">
<title>No working with <code>window</code>, no need for <code>$.fn.data()</code></title>
<subtitle>All completely self-contained</subtitle>
</section>
</slide>
<slide id="two-way-data-binding"> <slide id="two-way-data-binding">
<section id="two-way-data-binding-info"> <section id="two-way-data-binding-info">
<title>Automatic two-way data binding</title> <title>Automatic two-way data binding</title>
@ -224,19 +266,30 @@
</form> </form>
</script> </script>
<code-runner for="bound_hide_show"></code-runner> <code-runner for="bound_hide_show"></code-runner>
<code-displayer for="bound_hide_show" language="html"></code-displayer>
</slide> </slide>
<slide id="pretty-cool"> <slide id="pretty-cool">
<section id="pretty-cool-info"> <section id="pretty-cool-info">
<title>Pretty cool, huh?</title> <title>Pretty cool, huh?</title>
</section> </section>
</slide> </slide>
<slide id="just-works">
<section id="just-works-info">
<subtitle>No event binding, no message passing, no custom classes</subtitle>
<title>It Just Works (tm)</title>
</section>
</slide>
<slide id="other-things"> <slide id="other-things">
<section id="other-things-info"> <section id="other-things-info">
<title>Has all the bits you would expect</title> <title>Has all the bits you would expect</title>
<subtitle>XHR, UI libraries, animation support, unit testing helpers, and more!</subtitle> <subtitle>XHR, UI libraries, animation support, unit testing helpers, and more!</subtitle>
</section> </section>
</slide> </slide>
<slide id="more-libraries">
<section id="more-libraries-info">
<title>More libraries being developed all the time</title>
<subtitle>Very active community</subtitle>
</section>
</slide>
<slide id="thats-all"> <slide id="thats-all">
<section id="thats-all-info"> <section id="thats-all-info">
<title>That's all I've got for now...</title> <title>That's all I've got for now...</title>

View File

@ -66,7 +66,7 @@
} }
} }
pre { pre, pre code {
font-size: 12px; font-size: 12px;
} }

View File

@ -4876,7 +4876,7 @@ input[type="submit"].btn.btn-mini {
} }
/* line 69, ../sass/screen.scss */ /* line 69, ../sass/screen.scss */
pre { pre, pre code {
font-size: 12px; font-size: 12px;
} }