showoff 0.0.4 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.txt +3 -0
- data/lib/showoff.rb +5 -0
- data/public/css/showoff.css +19 -1
- data/public/js/jquery-print.js +109 -0
- data/public/js/showoff.js +49 -1
- data/views/index.erb +1 -0
- metadata +2 -1
data/README.txt
CHANGED
@@ -19,6 +19,7 @@ It can:
|
|
19
19
|
* bullets with incremental advancing
|
20
20
|
* re-enact command line interactions
|
21
21
|
* call up a menu of sections/slides at any time to jump around
|
22
|
+
* execute javascript or ruby live and display results
|
22
23
|
|
23
24
|
It might will can:
|
24
25
|
|
@@ -102,6 +103,8 @@ Some useful styles for each slide are:
|
|
102
103
|
will incrementally update elements on arrow key rather than switch slides
|
103
104
|
* small - make all slide text 80%
|
104
105
|
* smaller - make all slide text 70%
|
106
|
+
* execute - on ruby or js highlighted code slides, you can click on the code
|
107
|
+
to execute it and display the results on the slide
|
105
108
|
|
106
109
|
Check out the example directory included to see examples of most of these.
|
107
110
|
|
data/lib/showoff.rb
CHANGED
data/public/css/showoff.css
CHANGED
@@ -188,4 +188,22 @@ a.fg-button { float:left; }
|
|
188
188
|
.code .vc { color: #008080 } /* Name.Variable.Class */
|
189
189
|
.code .vg { color: #008080 } /* Name.Variable.Global */
|
190
190
|
.code .vi { color: #008080 } /* Name.Variable.Instance */
|
191
|
-
.code .il { color: #009999 } /* Literal.Number.Integer.Long */
|
191
|
+
.code .il { color: #009999 } /* Literal.Number.Integer.Long */
|
192
|
+
|
193
|
+
.results {
|
194
|
+
background-color:#002200;
|
195
|
+
color:#00AA00;
|
196
|
+
font-size:2em;
|
197
|
+
border:2px solid black;
|
198
|
+
position: fixed;
|
199
|
+
top:0px;
|
200
|
+
width:100%;
|
201
|
+
padding:15px;
|
202
|
+
margin:0px;
|
203
|
+
font-family: monospace;
|
204
|
+
}
|
205
|
+
|
206
|
+
.executing {
|
207
|
+
color:#0000FF !important;
|
208
|
+
background-color: yellow;
|
209
|
+
}
|
@@ -0,0 +1,109 @@
|
|
1
|
+
(function($) {
|
2
|
+
|
3
|
+
function print_array(obj, opts) {
|
4
|
+
var result = [];
|
5
|
+
for (var i = 0; i < Math.min(opts.max_array, obj.length); i++)
|
6
|
+
result.push($.print(obj[i], $.extend({}, opts, { max_array: 3, max_string: 40 })));
|
7
|
+
|
8
|
+
if (obj.length > opts.max_array)
|
9
|
+
result.push((obj.length - opts.max_array) + ' more...');
|
10
|
+
if (result.length == 0) return "[]"
|
11
|
+
return "[ " + result.join(", ") + " ]";
|
12
|
+
}
|
13
|
+
|
14
|
+
function print_element(obj) {
|
15
|
+
if (obj.nodeType == 1) {
|
16
|
+
var result = [];
|
17
|
+
var properties = [ 'className', 'id' ];
|
18
|
+
var extra = {
|
19
|
+
'input': ['type', 'name', 'value'],
|
20
|
+
'a': ['href', 'target'],
|
21
|
+
'form': ['method', 'action'],
|
22
|
+
'script': ['src'],
|
23
|
+
'link': ['href'],
|
24
|
+
'img': ['src']
|
25
|
+
};
|
26
|
+
|
27
|
+
$.each(properties.concat(extra[obj.tagName.toLowerCase()] || []), function(){
|
28
|
+
if (obj[this])
|
29
|
+
result.push(' ' + this.replace('className', 'class') + "=" + $.print(obj[this]))
|
30
|
+
});
|
31
|
+
return "<" + obj.tagName.toLowerCase()
|
32
|
+
+ result.join('') + ">";
|
33
|
+
}
|
34
|
+
}
|
35
|
+
|
36
|
+
function print_object(obj, opts) {
|
37
|
+
var seen = opts.seen || [ obj ];
|
38
|
+
|
39
|
+
var result = [], key, value;
|
40
|
+
for (var k in obj) {
|
41
|
+
if (obj.hasOwnProperty(k) && $.inArray(obj[k], seen) < 0) {
|
42
|
+
seen.push(obj[k]);
|
43
|
+
value = $.print(obj[k], $.extend({}, opts, { max_array: 6, max_string: 40, seen: seen }));
|
44
|
+
} else
|
45
|
+
value = "...";
|
46
|
+
result.push(k + ": " + value);
|
47
|
+
}
|
48
|
+
if (result.length == 0) return "{}";
|
49
|
+
return "{ " + result.join(", ") + " }";
|
50
|
+
}
|
51
|
+
|
52
|
+
function print_string(value, opts) {
|
53
|
+
var character_substitutions = {
|
54
|
+
'\b': '\\b',
|
55
|
+
'\t': '\\t',
|
56
|
+
'\n': '\\n',
|
57
|
+
'\f': '\\f',
|
58
|
+
'\r': '\\r',
|
59
|
+
'"' : '\\"',
|
60
|
+
'\\': '\\\\'
|
61
|
+
};
|
62
|
+
var r = /["\\\x00-\x1f\x7f-\x9f]/g;
|
63
|
+
|
64
|
+
var str = r.test(value)
|
65
|
+
? value.replace(r, function (a) {
|
66
|
+
var c = character_substitutions[a];
|
67
|
+
if (c) return c;
|
68
|
+
c = a.charCodeAt();
|
69
|
+
return '\\u00' + Math.floor(c / 16).toString(16) + (c % 16).toString(16);
|
70
|
+
})
|
71
|
+
: value;
|
72
|
+
if (str.length > opts.max_string)
|
73
|
+
return str.slice(0, opts.max_string + 1) + '...';
|
74
|
+
else
|
75
|
+
return str;
|
76
|
+
}
|
77
|
+
|
78
|
+
$.print = function(obj, options) {
|
79
|
+
var opts = $.extend({}, { max_array: 10, max_string: 100 }, options);
|
80
|
+
|
81
|
+
if (typeof obj == 'undefined')
|
82
|
+
return "undefined";
|
83
|
+
else if (typeof obj == 'boolean')
|
84
|
+
return obj.toString();
|
85
|
+
else if (typeof obj == 'number')
|
86
|
+
return obj.toString();
|
87
|
+
else if (!obj)
|
88
|
+
return "null";
|
89
|
+
else if (typeof obj == 'string')
|
90
|
+
return print_string(obj, opts);
|
91
|
+
else if (obj instanceof RegExp)
|
92
|
+
return obj.toString();
|
93
|
+
else if (obj instanceof Array || obj.callee || obj.item)
|
94
|
+
return print_array(obj, opts);
|
95
|
+
else if (typeof obj == 'function' || obj instanceof Function)
|
96
|
+
return obj.toString().match(/^([^)]*\))/)[1];
|
97
|
+
else if (obj.nodeType)
|
98
|
+
return print_element(obj);
|
99
|
+
else if (obj instanceof jQuery)
|
100
|
+
return "$(" + $.print(obj.get()) + ")";
|
101
|
+
else if (obj instanceof Error)
|
102
|
+
return print_object(obj, $.extend({}, options, { max_string: 200 }));
|
103
|
+
else if (obj instanceof Object)
|
104
|
+
return print_object(obj, opts);
|
105
|
+
else
|
106
|
+
return obj.toString().replace(/\n\s*/g, '');
|
107
|
+
}
|
108
|
+
|
109
|
+
})(jQuery);
|
data/public/js/showoff.js
CHANGED
@@ -94,12 +94,14 @@ function showSlide(back_step) {
|
|
94
94
|
// TODO: calculate and set the height margins on slide load, not here
|
95
95
|
|
96
96
|
$("#preso").html(slides.eq(slidenum).clone())
|
97
|
-
$("#slideInfo").text((slidenum + 1) + ' / ' + slideTotal)
|
98
97
|
curr_slide = $("#preso > .slide")
|
99
98
|
var slide_height = curr_slide.height()
|
100
99
|
var mar_top = (0.5 * parseFloat($("#preso").height())) - (0.5 * parseFloat(slide_height))
|
101
100
|
$("#preso > .slide").css('margin-top', mar_top)
|
102
101
|
|
102
|
+
percent = Math.ceil(((slidenum + 1) / slideTotal) * 100)
|
103
|
+
$("#slideInfo").text((slidenum + 1) + '/' + slideTotal + ' - ' + percent + '%')
|
104
|
+
|
103
105
|
if(!back_step) {
|
104
106
|
// determine if there are incremental bullets to show
|
105
107
|
// unless we are moving backward
|
@@ -108,6 +110,8 @@ function showSlide(back_step) {
|
|
108
110
|
incrCurr = 0
|
109
111
|
incrSteps = 0
|
110
112
|
}
|
113
|
+
|
114
|
+
removeResults()
|
111
115
|
}
|
112
116
|
|
113
117
|
function determineIncremental()
|
@@ -204,6 +208,10 @@ function keyDown(event)
|
|
204
208
|
{
|
205
209
|
$('#footer').toggle()
|
206
210
|
}
|
211
|
+
else if (key == 27) // esc
|
212
|
+
{
|
213
|
+
removeResults();
|
214
|
+
}
|
207
215
|
return true
|
208
216
|
}
|
209
217
|
|
@@ -252,3 +260,43 @@ function ListMenuItem(t, s)
|
|
252
260
|
this.slide = s
|
253
261
|
this.textName = t
|
254
262
|
}
|
263
|
+
|
264
|
+
var removeResults = function() {
|
265
|
+
$('.results').remove();
|
266
|
+
};
|
267
|
+
|
268
|
+
var print = function(text) {
|
269
|
+
removeResults();
|
270
|
+
var _results = $('<div>').addClass('results').text($.print(text));
|
271
|
+
$('body').append(_results);
|
272
|
+
_results.click(removeResults);
|
273
|
+
};
|
274
|
+
|
275
|
+
var executeJavaScript = function() {
|
276
|
+
result = null;
|
277
|
+
var codeDiv = $(this);
|
278
|
+
codeDiv.addClass("executing");
|
279
|
+
eval(codeDiv.text());
|
280
|
+
setTimeout(function() { codeDiv.removeClass("executing");}, 250 );
|
281
|
+
if (result != null) print(result);
|
282
|
+
};
|
283
|
+
|
284
|
+
var executeRuby = function() {
|
285
|
+
result = null;
|
286
|
+
var codeDiv = $(this);
|
287
|
+
codeDiv.addClass("executing");
|
288
|
+
$.ajax({
|
289
|
+
type: 'POST',
|
290
|
+
url: "/code",
|
291
|
+
data: {code: codeDiv.text()},
|
292
|
+
success: function(data) {
|
293
|
+
result = data;
|
294
|
+
if (result) print(result);
|
295
|
+
},
|
296
|
+
dataType: 'html'
|
297
|
+
});
|
298
|
+
setTimeout(function() { codeDiv.removeClass("executing");}, 250 );
|
299
|
+
};
|
300
|
+
|
301
|
+
$('.execute > .sh_javaScript code').live("click", executeJavaScript);
|
302
|
+
$('.execute > .sh_ruby code').live("click", executeRuby);
|
data/views/index.erb
CHANGED
@@ -10,6 +10,7 @@
|
|
10
10
|
<link rel="stylesheet" href="css/showoff.css" type="text/css"/>
|
11
11
|
|
12
12
|
<script type="text/javascript" src="/js/jquery-1.4.min.js"></script>
|
13
|
+
<script type="text/javascript" src="/js/jquery-print.js"></script>
|
13
14
|
<script type="text/javascript" src="/js/fg.menu.js"></script>
|
14
15
|
<script type="text/javascript" src="/js/showoff.js"></script>
|
15
16
|
<script type="text/javascript" src="/js/jTypeWriter.js"> </script>
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: showoff
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.5
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Scott Chacon
|
@@ -99,6 +99,7 @@ files:
|
|
99
99
|
- public/css/theme/ui.theme.css
|
100
100
|
- public/js/fg.menu.js
|
101
101
|
- public/js/jquery-1.4.min.js
|
102
|
+
- public/js/jquery-print.js
|
102
103
|
- public/js/jTypeWriter.js
|
103
104
|
- public/js/sh_lang/sh_bison.min.js
|
104
105
|
- public/js/sh_lang/sh_c.min.js
|