protodiv demo 2/head
authorJoe Hitchens <joe@sleepless.com>
Fri, 11 Nov 2011 18:58:40 +0000 (10:58 -0800)
committerJoe Hitchens <joe@sleepless.com>
Fri, 11 Nov 2011 18:58:40 +0000 (10:58 -0800)
public/javascripts/protodiv.js [new file with mode: 0644]
public/schools.html [new file with mode: 0644]

diff --git a/public/javascripts/protodiv.js b/public/javascripts/protodiv.js
new file mode 100644 (file)
index 0000000..fa741d6
--- /dev/null
@@ -0,0 +1,134 @@
+
+/*
+Copyright 2011 Sleepless Software Inc. All rights reserved.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to
+deal in the Software without restriction, including without limitation the
+rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+sell copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+IN THE SOFTWARE. 
+*/
+
+
+ProtoDiv = {}
+
+ProtoDiv.elem = function(v) {
+       return (typeof v === "string") ? document.getElementById(v) : v
+}
+
+ProtoDiv.reduce = function(list, cb) {
+       var i, l = list.length
+       for(i = 0; i < l; i++) 
+               cb(list[i])
+}
+
+ProtoDiv.map = function(node, list, cb) {
+       if(node.hasChildNodes()) {
+               var kids = node.childNodes
+               for(var i = 0; i < kids.length; i++) {
+                       var kid = kids[i]
+                       if(cb(kid))
+                               list.push(kid)
+                       ProtoDiv.map(kid, list, cb)
+               }
+       }
+}
+
+ProtoDiv.substitute = function(s, obj) {
+       for(var key in obj) {
+               re = new RegExp("__"+key+"__", "g")
+               s = s.replace(re, obj[key])
+       }
+       return s
+}
+
+ProtoDiv.inject = function(id, obj) {
+       var proto = ProtoDiv.elem(id)
+
+       proto.innerHTML = ProtoDiv.substitute(proto.innerHTML, obj)
+
+       for(var i = 0; i < proto.attributes.length; i++) {
+               var a = proto.attributes[i]
+               a.textContent = ProtoDiv.substitute(a.textContent, obj)
+       }
+
+       for(var key in obj) {
+               var c = key.substring(1)
+               var list = []
+               switch(key.substring(0,1)) {
+               case "#":
+                       ProtoDiv.map(proto, list, function(e) {
+                               return e.id == c
+                       })
+                       ProtoDiv.reduce(list, function(e) {
+                               e.innerHTML = obj[key]
+                       })
+                       break
+               case ".":
+                       ProtoDiv.map(proto, list, function(e) {
+                               return e.className == c
+                       })
+                       ProtoDiv.reduce(list, function(e) {
+                               e.innerHTML = obj[key]
+                       })
+                       break
+               }
+       }
+
+       return proto
+}
+
+ProtoDiv.replicate = function(id, arr, keep) {
+       var proto = ProtoDiv.elem(id)
+       var sib = proto.nextSibling     // might be null
+       var mom = proto.parentNode
+       if(!(arr instanceof Array))
+               arr = [arr]
+       var l = arr.length
+       var obj
+       
+       if(proto.origSib === undefined) {
+               proto.origSib = sib
+               proto.origDisplay = proto.style.display
+       }
+
+       for(var i = 0; i < l; i++) {
+               obj = arr[i]
+               var e = proto.cloneNode(true)
+               delete e.id
+               mom.insertBefore(e, sib)
+               ProtoDiv.inject(e, obj)
+       }
+
+       if(!keep)
+               proto.style.display = "none"
+
+       return proto
+}
+
+ProtoDiv.reset = function(id) {
+       var proto = ProtoDiv.elem(id)
+       if(proto.origSib !== undefined) {
+               proto.style.display = proto.origDisplay
+               while(proto.nextSibling !== proto.origSib) {
+                       proto.parentNode.removeChild(proto.nextSibling)
+               }
+               delete proto.origSib
+               delete proto.origDisplay
+       }
+       return proto
+}
+
+
diff --git a/public/schools.html b/public/schools.html
new file mode 100644 (file)
index 0000000..a62f083
--- /dev/null
@@ -0,0 +1,72 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+       <head>
+               <title>FinalsClub.org</title>
+               <link rel='stylesheet' href='/stylesheets/fc2.css'>
+
+               <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
+               <script type='text/javascript' src='/javascripts/es5-shim.min.js'></script>
+               <script type='text/javascript' src='/javascripts/protodiv.js'></script>
+               <script type='text/javascript' src='/socket.io/socket.io.js'></script>
+
+       <meta name="viewport" content="width=device-width,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0">
+       <meta name="apple-touch-icon" href="">
+       <meta name="icon" href="">
+
+       </head>
+
+       <body>
+
+
+               <!-- masthead will be included dynamically -->
+               <div class="masthead"><div class="logbar"><div class="loginstatus">&nbsp;
+                               </div></div><div class="navbar"><table><tr><td><a href="/"><img src="/images/finals-club-wht.png" class="logo"/></a></td><td class="menu"><a href="/schools">Courses</a><a href="http://blog.finalsclub.org">Blog</a><a href="/archive">Archive</a><a href="/press">Press</a><a href="/register">Create an Account</a><!-- span(class='sub_menu')--><a href="/login" class="special">Login</a></td></tr></table></div><div class="logbar">&nbsp;
+               </div></div>
+
+
+
+               <div class="content">
+                       <div class="container1">
+                               <h1>Universities</h1>
+
+                               <div class="school" id=schoolproto>
+
+                                       <h2><a href="">__name__</a></h2>
+                                       <!-- ul>
+                                               <li id=course_proto><a href="course/__courseid__">__coursename__</a></li>
+                                       </ul -->
+                               </div>
+
+
+                       </div>
+                       <script>
+
+// this will actually come from an AJAX call to a REST interface at "/api?..."
+var schools = [
+       {
+               name: "Berkeley",
+               ref: "http://www.berkeley.edu/"
+               courses: [
+                       { id: "4e6d1e9b42bbef522c000a8f", name: "History 12: Introduction to the Middle East" },
+                       { id: "4e8aa3f62e4b97e67b001f47", name: "ANTH160AC/ISF 160: The Forms of Folklorek" }
+               }
+       }
+]
+                       ProtoDiv.replicate("schoolproto", schools);
+
+
+                       </script>
+               </div>
+
+
+
+
+               <!-- This is the footer - will be included dynamically -->
+               <div class="footer"><table><tr><td class="col1"><div class="logo"><img src="/images/finals-club-wht.png" title="FinalsClub.org" class="lilogo"/></div><div>Copyright 2011</div><div>All Rights Reserved</div></td><td class="col2"><a href="/conduct">Code of Conduct</a><a href="http://blog.finalsclub.org/about.html">About</a><a href="http://blog.finalsclub.org/contact.html">Contact</a><a href="http://blog.finalsclub.org/legal.html">Legal</a><a href="http://blog.finalsclub.org/team.html">Team</a></td></tr></table></div><div class="footerer"><p>This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 United States License
+                       </p><p><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/us/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/us/88x31.png"/></a><a href="http://mixpanel.com/f/partner"><img alt="Real Time Web Analytics" src="http://mixpanel.com/site_media/images/partner/badge_blue.png" style="border-width:0;margin:2px;"/></a></p></div>
+
+
+
+
+       </body>
+</html>