Add example for JstPages.

rstacruz · Sep 11, 2011 · 969dc92 · 969dc92
1 parent e680245
commit 969dc92
Show file tree

Hide file tree

Showing 8 changed files with 84 additions and 3 deletions.
diff --git a/README.md b/README.md
@@ -21,10 +21,14 @@ Contents
 __Sinatra-backbone__ is comprised of two Sinatra plugins:
 
  * `Sinatra::JstPages` – Provides support for JavaScript server templates (JST) 
-  for use in Backbone views.
+  for use in Backbone views. See [JstPages example][jstx] for a full example 
+  application.
 
  * `Sinatra::RestAPI` – Provides restful API for your models for use in Backbone 
- models.
+ models. See [RestAPI example][restx] for a full example application.
+
+[jstx]: https://github.com/rstacruz/sinatra-backbone/examples/jstpages
+[restx]: https://github.com/rstacruz/sinatra-backbone/examples/restapi
 
 For usage and API reference, please see http://ricostacruz.com/sinatra-backbone. [](#api_reference)
 

diff --git a/examples/jstpages/app.rb b/examples/jstpages/app.rb
@@ -0,0 +1,21 @@
+$:.unshift File.expand_path('../../../lib', __FILE__)
+
+require 'sinatra/base'
+require 'sequel'
+require 'sinatra/backbone'
+
+class App < Sinatra::Base
+  enable   :raise_errors, :logging
+  enable   :show_exceptions  if development?
+
+  register Sinatra::JstPages
+  serve_jst '/jst.js'
+
+  set :root,   File.expand_path('../', __FILE__)
+  set :views,  File.expand_path('../views', __FILE__)
+  set :public, File.expand_path('../public', __FILE__)
+
+  get '/' do
+    erb :home
+  end
+end
diff --git a/examples/jstpages/config.ru b/examples/jstpages/config.ru
@@ -0,0 +1,3 @@
+require './app'
+App.set :run, false
+run App
diff --git a/examples/jstpages/public/app.js b/examples/jstpages/public/app.js
@@ -0,0 +1,20 @@
+// Here is our Backbone model!
+$(function() {
+  do_test();
+});
+
+function do_test() {
+  echo("<h3>Rendering from template:</h3>");
+  echo(JST['hello']({name: "Julie Kitzinger", age: "33"}));
+  echo("<h3>Success!</h3>");
+}
+
+// Helper functions
+function echo(html) {
+  $("#messages").append(html);
+};
+
+function onerror() {
+  echo("<p class='error'>Oops... an error occured.</p>");
+};
+
diff --git a/examples/jstpages/views/hello.jst.tpl b/examples/jstpages/views/hello.jst.tpl
@@ -0,0 +1,6 @@
+<p>Hello, this is me:</p>
+
+<dl>
+<dt>Name:</dt><dd><%= name %></dd>
+<dt>Age:</dt><dd><%= age %></dd>
+</dl>
diff --git a/examples/jstpages/views/home.erb b/examples/jstpages/views/home.erb
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8" />
+    <title></title>
+    <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js'></script>
+    <script src='http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.1.7/underscore-min.js'></script>
+    <script src='http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js'></script>
+    <style>
+      body { font-family: sans-serif; font-size: 13px; line-height: 1.5; background: #d0d0da; }
+      #messages { width: 400px; margin: 20px auto; background: white; padding: 20px; border: solid 10px #c0c0ca; }
+      h3 { border-top: dotted 1px #ccc; padding: 20px 20px 0 20px; margin: 20px -20px 0 -20px; color: #46a; }
+      h3:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
+      dl { overflow: hidden; }
+      dt { float: left; width: 120px; margin-right: 10px; text-align: right; color: #aaa; }
+      h3 { font-family: palatino; font-size: 1.3em; }
+    </style>
+</head>
+<body>
+    <div id="messages">
+    </div>
+    <script src='jst.js'></script>
+    <script src='app.js'></script>
+</body>
+</html>
diff --git a/examples/restapi/app.rb b/examples/restapi/app.rb
@@ -1,4 +1,4 @@
-$:.unshift File.expand_path('../../lib', __FILE__)
+$:.unshift File.expand_path('../../../lib', __FILE__)
 
 require 'sinatra/base'
 require 'sequel'

diff --git a/lib/sinatra/jstpages.rb b/lib/sinatra/jstpages.rb
@@ -1,5 +1,6 @@
 # ## Sinatra::JstPages [module]
 # A Sinatra plugin that adds support for JST (JavaScript Server Templates).
+# See [JstPages example][jstx] for a full example application.
 #
 # #### Basic usage
 # Register the `Sinatra::JstPages` plugin in your application, and use
@@ -67,6 +68,7 @@
 # [haml]: https://github.com/creationix/haml-js
 # [eco]: https://github.com/sstephenson/eco
 # [cs]: http://coffeescript.org
+# [jstx]: https://github.com/rstacruz/sinatra-backbone/examples/jstpages
 #
 module Sinatra
   module JstPages