Skip to content

Commit

Permalink
basic prompt stuff working
Browse files Browse the repository at this point in the history
  • Loading branch information
@garann
garann committed Feb 19, 2012
1 parent cda9cf9 commit 06b4579
Show file tree
Hide file tree
Showing 5 changed files with 107 additions and 11 deletions.
33 changes: 33 additions & 0 deletions js/patsy-screens/help.tmpl
View file
@@ -0,0 +1,33 @@
88
"" ,d
88
88 88 ,adPPYba, 88 8b,dPPYba, ,adPPYb,d8 8b,dPPYba, ,adPPYYba, MM88MMM ,adPPYba, 8b d8
88 88 I8[ "" 88 88P' `"8a a8" `Y88 88P' "8a "" `Y8 88 I8[ "" `8b d8'
88 88 `"Y8ba, 88 88 88 8b 88 88 d8 ,adPPPPP88 88 `"Y8ba, `8b d8'
"8a, ,a88 aa ]8I 88 88 88 "8a, ,d88 88b, ,a8" 88, ,88 88, aa ]8I `8b,d8'
`"YbbdP'Y8 `"YbbdP"' 88 88 88 `"YbbdP"Y8 88`YbbdP"' `"8bbdP"Y8 "Y888 `"YbbdP"' Y88'
aa, ,88 88 d8'
"Y8bbdP" 88 d8'


[[ Dependencies ]]

patsy needs require.js and the require.js text plugin. It also uses doT.js for template rendering, but you can get
rid of that if you want. It's also using jQuery, but only to save time - if you want to use a different library it
should be pretty easy to swap it out.

[[ Setup ]]

Create a command line by calling patsy.cli(). cli() takes three arguments: the selector for the command line
container, the directory (relative to the location of require.js) where templates will live, and, optionally, a
template to render on load if you don't want to go straight to the command prompt.

Templates are just HTML, but they'll be rendered assuming they're preformatted, so add your own word-wrapping.
Character entities won't get rendered correctly if you use the code, so just paste the actual character in.

[[ Commands ]]

ls shows index.tmpl in the current directory - you have to create that yourself, no magic :(
cd changes directories, and you can go up a directory with ../
the name of a template in the current directory will render it - you can also pass in data as JSON, like so:
$ myTemplate { "foo": "bar" }
3 changes: 3 additions & 0 deletions js/patsy-screens/interpol.tmpl
View file
@@ -0,0 +1,3 @@
who is this guy
this twee neophyte
does he say that he'd like to know you?
47 changes: 47 additions & 0 deletions js/patsy-screens/thanks.tmpl
View file
@@ -0,0 +1,47 @@
..... .. .x+=:.
.H8888888h. ~-. .uef^" « .z@8"` z` ^% xeee
888888888888x `> :d88E u. u. !@88E . «k d888R
X~ `?888888hx~ `888E u x@88k u@88c. '888E u .@8Ned8" d8888R
' x8.^"*88*" 888E .z8k us888u. ^"8888""8888" 888E u@8NL .@^%8888" @ 8888R
`-:- X8888x 888E~?888L .@88 "8888" 8888 888R 888E`"88*" x88: `)8b. .P 8888R
488888> 888E 888E 9888 9888 8888 888R 888E .dN. 8888N=*8888 :F 8888R
.. `"88* 888E 888E 9888 9888 8888 888R 888E~8888 %8" R88 x" 8888R
x88888nX" . 888E 888E 9888 9888 8888 888R 888E '888& @8Wou 9% d8eeeee88888eer
!"*8888888n.. : 888E 888E 9888 9888 "*88*" 8888" 888E 9888. .888888P` 8888R
' "*88888888* m888N= 888> "888*""888" "" 'Y" '"888*" 4888" ` ^"F 8888R
^"***"` `Y" 888 ^Y" ^Y' "" "" "*%%%%%%**~
J88"
@%
:"

s .
:8 .. @88>
.88 .u . @L %8P u. u.
:888ooo .d88B :@8c 9888i .dL . x@88k u@88c. uL
-*8888888 ="8888f8888r `Y888k:*888. .@88u ^"8888""8888" .ue888Nc..
8888 4888>'88" 888E 888I ''888E` 8888 888R d88E`"888E`
8888 4888> ' 888E 888I 888E 8888 888R 888E 888E
8888 4888> 888E 888I 888E 8888 888R 888E 888E
.8888Lu= .d888L .+ 888E 888I 888E 8888 888R 888E 888E
^%888* ^"8888*" x888N>«888' 888& "*88*" 8888" 888& .888E
'Y" "Y" "88" 888 R888" "" 'Y" *888" 888&
88F "" `" "888E
98" .dWi `88E
./" 4888~ J8%
~` ^"===*"`

.... .. s .x+=:.
+^""888h. ~"888h :8 z` ^% ..
8X. ?8888X 8888f .88 . «k @L
'888x 8888X 8888~ u :888ooo .@8Ned8" 9888i .dL
'88888 8888X "88x: us888u. -*8888888 .@^%8888" `Y888k:*888.
`8888 8888X X88x. .@88 "8888" 8888 x88: `)8b. 888E 888I
`*` 8888X '88888X 9888 9888 8888 8888N=*8888 888E 888I
~`...8888X "88888 9888 9888 8888 %8" R88 888E 888I
x8888888X. `%8" 9888 9888 .8888Lu= @8Wou 9% 888E 888I
'%"*8888888h. " 9888 9888 ^%888* .888888P` x888N>«888'
~ 888888888!` "888*""888" 'Y" ` ^"F "88" 888
X888^""" ^Y" ^Y' 88F
`88f 98"
88 ./"
"" ~`
31 changes: 21 additions & 10 deletions js/patsy.js
View file
Expand Up @@ -18,7 +18,9 @@ var patsy = {
cmd = txt.indexOf( " " ) > -1 ? txt.substring( 0, txt.indexOf( " " ) ) : txt;
if ( cmd == "ls" ) {
require( ["text!" + dir + "/index.tmpl"], function( tmpl) {
that.render( patsy.getHtml( tmpl ) );
that.render( patsy.getHtml( tmpl ), function() {
that.render( patsy.getHtml() );
});
});
} else if ( cmd == "cd" ) {
txt = txt.replace( "cd " ).split( "/" );
Expand All @@ -36,7 +38,10 @@ var patsy = {
require( ["text!" + that.currentDir + "/" + cmd + ".tmpl"], function( tmpl ) {
that.render( txt.length ?
patsy.getHtml( tmpl, txt ) :
patsy.getHtml( tmpl )
patsy.getHtml( tmpl ),
function() {
that.render( patsy.getHtml() );
}
);
});
}
Expand All @@ -45,12 +50,16 @@ var patsy = {
});

this.prompt.on( "click", function() {
that.commandLine = $( this ).find( "span.patsy-cli" );
var $t = $( this );
$t.find( "div.patsy-prompt:last" ).addClass( "patsy-active" );
that.commandLine = $t.find( "span.patsy-cli:last" );
});

this.render = function( html ) {
var txt = html.replace( "\n", "<br/>" ),
output = that.prompt.append( '<div class="patsy-prompt"></div>' ),
this.render = function( html, callback ) {
that.prompt.find( "div.patsy-active" ).removeClass( "patsy-active" );
that.commandLine = null;
var txt = html.replace( /\n/gi, "<br/>" ),
output = $( '<div class="patsy-prompt"></div>' ).appendTo( that.prompt ),
l = txt.length,
p = 0,
closing = "",
Expand All @@ -59,9 +68,11 @@ var patsy = {
printf(p);
} else {
clearInterval(printer);
that.commandLine = output;
output.addClass( "patsy-active" );
if ( output.find( "span.patsy-cli" )[0] ) that.commandLine = output.find( "span.patsy-cli" );
if ( callback ) callback();
}
}, 100);
}, 10);

function printf(position) {
var matches = txt.substr(position).match(/<(\/)?([^ \/>]*).*?(\/)?>|./),
Expand All @@ -81,15 +92,15 @@ var patsy = {
}
}

doT.templateSettings.strip = false;
this.render( patsy.getHtml() );

},
getHtml: function( tmpl, data ) {
if ( tmpl ) {
console.log(tmpl)
return doT.template( tmpl )( data || {} );
} else {
return '<div class="patsy-prompt">$ <span class="patsy-cli"></span>▒</div>';
return '$ <span class="patsy-cli"></span><b>▒</b>';
}
}

Expand Down
4 changes: 3 additions & 1 deletion main.html
View file
Expand Up @@ -4,7 +4,9 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>patsy test page</title>
<style>
#prompt { background-color: #000; color: #fff; font-family: mono; }
#prompt { background-color: #000; color: #fff; font-family: monospace; white-space: pre; }
.patsy-prompt b { display: none; }
.patsy-active b { display: inline; }
</style>
<script data-main="js/patsy" src="js/require.js"></script>
</head>
Expand Down

0 comments on commit 06b4579

Please sign in to comment.