Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

initial commit

  • Loading branch information...
commit 631fbeb4593a375bb17c692aa3c5b7c2cdcfc6b9 0 parents
@jgallen23 authored
2  .gitignore
@@ -0,0 +1,2 @@
+.DS_Store
+node_modules
4 Makefile
@@ -0,0 +1,4 @@
+run:
+ ./node_modules/.bin/smoosh make ./build.json
+install:
+ npm install smoosh
0  README.md
No changes.
25 build.json
@@ -0,0 +1,25 @@
+{
+ "JAVASCRIPT": {
+ "DIST_DIR": "./dist",
+ "jquery.toc": [
+ "./lib/copyright.js",
+ "./lib/toc.js"
+ ]
+ },
+ "JSHINT_OPTS": {
+ "boss": true,
+ "forin": false,
+ "curly": true,
+ "debug": false,
+ "devel": false,
+ "evil": false,
+ "regexp": false,
+ "undef": false,
+ "sub": true,
+ "white": false,
+ "indent": 2,
+ "whitespace": false,
+ "asi": true
+ }
+}
+
87 dist/jquery.toc.js
@@ -0,0 +1,87 @@
+/*!
+ * jquery.toc.js - A jQuery plugin that will automaticall generate a table of contents.
+ * v0.0.1
+ * https://github.com/jgallen23/toc
+ * copyright JGA 2012
+ * MIT License
+ */
+
+jQuery.fn.toc = function(options) {
+ var self = this;
+ var opts = $.extend({}, jQuery.fn.toc.defaults, options);
+
+ var container = $(opts.container);
+ var headings = $(opts.selectors, container);
+ var headingOffsets = [];
+
+ var scrollTo = function(e) {
+ if (opts.smoothScrolling) {
+ e.preventDefault();
+ var elScrollTo = $(e.target).attr('href');
+ var $el = $(elScrollTo);
+ $(opts.container).animate({ scrollTop: $el.offset().top }, 400, 'swing', function() {
+ location.hash = elScrollTo;
+ });
+ }
+ };
+
+ //highlight on scroll
+ var timeout;
+ var highlightOnScroll = function(e) {
+ if (timeout) {
+ clearTimeout(timeout);
+ }
+ timeout = setTimeout(function() {
+ var top = $(window).scrollTop();
+ for (var i = 0, c = headingOffsets.length; i < c; i++) {
+ if (headingOffsets[i] >= top) {
+ $('li', self).removeClass('active');
+ $('li:eq('+i+')', self).addClass('active');
+ break;
+ }
+ }
+ }, 50);
+ };
+ if (opts.highlightOnScroll) {
+ $(window).bind('scroll', highlightOnScroll);
+ highlightOnScroll();
+ }
+
+
+ return this.each(function() {
+ //build TOC
+ var ul = $('<ul/>');
+ headings.each(function(i, heading) {
+ var $h = $(heading);
+ headingOffsets.push($h.offset().top);
+
+ //add anchor
+ var anchor = $('<span/>').attr('id', opts.prefix+i).insertBefore($h);
+
+ //build TOC item
+ var a = $('<a/>')
+ .text($h.text())
+ .attr('href', '#'+opts.prefix+i)
+ .bind('click', scrollTo);
+
+ var li = $('<li/>')
+ .addClass(opts.prefix+$h[0].tagName)
+ .append(a);
+
+ ul.append(li);
+ });
+ var el = $(this);
+ console.log(el);
+ el.html(ul);
+ });
+};
+
+
+jQuery.fn.toc.defaults = {
+ container: 'body',
+ selectors: 'h1,h2,h3',
+ smoothScrolling: true,
+ prefix: 'toc',
+ highlightOnScroll: true
+};
+
8 dist/jquery.toc.min.js
@@ -0,0 +1,8 @@
+/*!
+ * jquery.toc.js - A jQuery plugin that will automaticall generate a table of contents.
+ * v0.0.1
+ * https://github.com/jgallen23/toc
+ * copyright JGA 2012
+ * MIT License
+ */
+jQuery.fn.toc=function(a){var b=this,c=$.extend({},jQuery.fn.toc.defaults,a),d=$(c.container),e=$(c.selectors,d),f=[],g=function(a){if(c.smoothScrolling){a.preventDefault();var b=$(a.target).attr("href"),d=$(b);$(c.container).animate({scrollTop:d.offset().top},400,"swing",function(){location.hash=b})}},h,i=function(a){h&&clearTimeout(h),h=setTimeout(function(){var a=$(window).scrollTop();for(var c=0,d=f.length;c<d;c++)if(f[c]>=a){$("li",b).removeClass("active"),$("li:eq("+c+")",b).addClass("active");break}},50)};return c.highlightOnScroll&&($(window).bind("scroll",i),i()),this.each(function(){var a=$("<ul/>");e.each(function(b,d){var e=$(d);f.push(e.offset().top);var h=$("<span/>").attr("id",c.prefix+b).insertBefore(e),i=$("<a/>").text(e.text()).attr("href","#"+c.prefix+b).bind("click",g),j=$("<li/>").addClass(c.prefix+e[0].tagName).append(i);a.append(j)});var b=$(this);console.log(b),b.html(a)})},jQuery.fn.toc.defaults={container:"body",selectors:"h1,h2,h3",smoothScrolling:!0,prefix:"toc",highlightOnScroll:!0}
62 example/index.html
@@ -0,0 +1,62 @@
+<html>
+ <head>
+ <title></title>
+ <script src="live.js"></script>
+ <style>
+ #wrapper {
+ width: 980px;
+ margin: 0 auto;
+ }
+ .toc {
+ background: #000;
+ width: 200px;
+ position: fixed;
+ color: #fff;
+ }
+ .toc a {
+ color: #fff;
+ }
+ .toc .tocH2 {
+ margin-left: 10px
+ }
+ .toc .tocH3 {
+ margin-left: 20px
+ }
+ .toc .active {
+ background: red;
+ }
+ .toc.right {
+ right: 0
+ }
+ </style>
+ </head>
+ <body>
+ <div class="toc">
+ </div>
+ <div class="toc right">
+ </div>
+ <div id="wrapper">
+ <h1>Page Title</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <h2>Sub Heading</h2>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <h2>Sub Heading</h2>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <h3>SubSub Heading</h3>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum fermentum ligula a augue sollicitudin a tincidunt felis tincidunt. Donec et urna augue, sed consectetur lacus. Maecenas tincidunt volutpat lorem. Suspendisse turpis tellus, sodales ac commodo id, rhoncus vel augue. Vestibulum nisl nibh, rutrum eu bibendum vitae, bibendum et libero. Suspendisse vel odio vitae leo commodo lacinia. Sed non lacinia nulla. Pellentesque faucibus euismod dictum. Suspendisse potenti.</p>
+ </div>
+ <script src="jquery.js"></script>
+ <script src="../lib/toc.js"></script>
+ <script>
+ $('.toc').toc({
+ });
+ </script>
+ </body>
+</html>
9,266 example/jquery.js
9,266 additions, 0 deletions not shown
233 example/live.js
@@ -0,0 +1,233 @@
+/*
+ Live.js - One script closer to Designing in the Browser
+ Written for Handcraft.com by Martin Kool (@mrtnkl).
+
+ Version 4.
+ Recent change: Made stylesheet and mimetype checks case insensitive.
+
+ http://livejs.com
+ http://livejs.com/license (MIT)
+ @livejs
+
+ Include live.js#css to monitor css changes only.
+ Include live.js#js to monitor js changes only.
+ Include live.js#html to monitor html changes only.
+ Mix and match to monitor a preferred combination such as live.js#html,css
+
+ By default, just include live.js to monitor all css, js and html changes.
+
+ Live.js can also be loaded as a bookmarklet. It is best to only use it for CSS then,
+ as a page reload due to a change in html or css would not re-include the bookmarklet.
+ To monitor CSS and be notified that it has loaded, include it as: live.js#css,notify
+*/
+(function () {
+
+ var headers = { "Etag": 1, "Last-Modified": 1, "Content-Length": 1, "Content-Type": 1 },
+ resources = {},
+ pendingRequests = {},
+ currentLinkElements = {},
+ oldLinkElements = {},
+ interval = 1000,
+ loaded = false,
+ active = { "html": 1, "css": 1, "js": 1 };
+
+ var Live = {
+
+ // performs a cycle per interval
+ heartbeat: function () {
+ if (document.body) {
+ // make sure all resources are loaded on first activation
+ if (!loaded) Live.loadresources();
+ Live.checkForChanges();
+ }
+ setTimeout(Live.heartbeat, interval);
+ },
+
+ // loads all local css and js resources upon first activation
+ loadresources: function () {
+
+ // helper method to assert if a given url is local
+ function isLocal(url) {
+ var loc = document.location,
+ reg = new RegExp("^\\.|^\/(?!\/)|^[\\w]((?!://).)*$|" + loc.protocol + "//" + loc.host);
+ return url.match(reg);
+ }
+
+ // gather all resources
+ var scripts = document.getElementsByTagName("script"),
+ links = document.getElementsByTagName("link"),
+ uris = [];
+
+ // track local js urls
+ for (var i = 0; i < scripts.length; i++) {
+ var script = scripts[i], src = script.getAttribute("src");
+ if (src && isLocal(src))
+ uris.push(src);
+ if (src && src.match(/\blive.js#/)) {
+ for (var type in active)
+ active[type] = src.match("[#,|]" + type) != null
+ if (src.match("notify"))
+ alert("Live.js is loaded.");
+ }
+ }
+ if (!active.js) uris = [];
+ if (active.html) uris.push(document.location.href);
+
+ // track local css urls
+ for (var i = 0; i < links.length && active.css; i++) {
+ var link = links[i], rel = link.getAttribute("rel"), href = link.getAttribute("href", 2);
+ if (href && rel && rel.match(new RegExp("stylesheet", "i")) && isLocal(href)) {
+ uris.push(href);
+ currentLinkElements[href] = link;
+ }
+ }
+
+ // initialize the resources info
+ for (var i = 0; i < uris.length; i++) {
+ var url = uris[i];
+ Live.getHead(url, function (url, info) {
+ resources[url] = info;
+ });
+ }
+
+ // add rule for morphing between old and new css files
+ var head = document.getElementsByTagName("head")[0],
+ style = document.createElement("style"),
+ rule = "transition: all .3s ease-out;"
+ css = [".livejs-loading * { ", rule, " -webkit-", rule, "-moz-", rule, "-o-", rule, "}"].join('');
+ style.setAttribute("type", "text/css");
+ head.appendChild(style);
+ style.styleSheet ? style.styleSheet.cssText = css : style.appendChild(document.createTextNode(css));
+
+ // yep
+ loaded = true;
+ },
+
+ // check all tracking resources for changes
+ checkForChanges: function () {
+ for (var url in resources) {
+ if (pendingRequests[url])
+ continue;
+
+ Live.getHead(url, function (url, newInfo) {
+ var oldInfo = resources[url],
+ hasChanged = false;
+ resources[url] = newInfo;
+ for (var header in oldInfo) {
+ // do verification based on the header type
+ var oldValue = oldInfo[header],
+ newValue = newInfo[header],
+ contentType = newInfo["Content-Type"];
+ switch (header.toLowerCase()) {
+ case "etag":
+ if (!newValue) break;
+ // fall through to default
+ default:
+ hasChanged = oldValue != newValue;
+ break;
+ }
+ // if changed, act
+ if (hasChanged) {
+ Live.refreshResource(url, contentType);
+ break;
+ }
+ }
+ });
+ }
+ },
+
+ // act upon a changed url of certain content type
+ refreshResource: function (url, type) {
+ switch (type.toLowerCase()) {
+ // css files can be reloaded dynamically by replacing the link element
+ case "text/css":
+ var link = currentLinkElements[url],
+ html = document.body.parentNode,
+ head = link.parentNode,
+ next = link.nextSibling,
+ newLink = document.createElement("link");
+
+ html.className = html.className.replace(/\s*livejs\-loading/gi, '') + ' livejs-loading';
+ newLink.setAttribute("type", "text/css");
+ newLink.setAttribute("rel", "stylesheet");
+ newLink.setAttribute("href", url + "?now=" + new Date() * 1);
+ next ? head.insertBefore(newLink, next) : head.appendChild(newLink);
+ currentLinkElements[url] = newLink;
+ oldLinkElements[url] = link;
+
+ // schedule removal of the old link
+ Live.removeoldLinkElements();
+ break;
+
+ // check if an html resource is our current url, then reload
+ case "text/html":
+ if (url != document.location.href)
+ return;
+
+ // local javascript changes cause a reload as well
+ case "text/javascript":
+ case "application/javascript":
+ case "application/x-javascript":
+ document.location.reload();
+ }
+ },
+
+ // removes the old stylesheet rules only once the new one has finished loading
+ removeoldLinkElements: function () {
+ var pending = 0;
+ for (var url in oldLinkElements) {
+ // if this sheet has any cssRules, delete the old link
+ try {
+ var link = currentLinkElements[url],
+ oldLink = oldLinkElements[url],
+ html = document.body.parentNode,
+ sheet = link.sheet || link.styleSheet,
+ rules = sheet.rules || sheet.cssRules;
+ if (rules.length >= 0) {
+ oldLink.parentNode.removeChild(oldLink);
+ delete oldLinkElements[url];
+ setTimeout(function () {
+ html.className = html.className.replace(/\s*livejs\-loading/gi, '');
+ }, 100);
+ }
+ } catch (e) {
+ pending++;
+ }
+ if (pending) setTimeout(Live.removeoldLinkElements, 50);
+ }
+ },
+
+ // performs a HEAD request and passes the header info to the given callback
+ getHead: function (url, callback) {
+ pendingRequests[url] = true;
+ var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XmlHttp");
+ xhr.open("HEAD", url, true);
+ xhr.onreadystatechange = function () {
+ delete pendingRequests[url];
+ if (xhr.readyState == 4 && xhr.status != 304) {
+ xhr.getAllResponseHeaders();
+ var info = {};
+ for (var h in headers) {
+ var value = xhr.getResponseHeader(h);
+ // adjust the simple Etag variant to match on its significant part
+ if (h.toLowerCase() == "etag" && value) value = value.replace(/^W\//, '');
+ if (h.toLowerCase() == "content-type" && value) value = value.replace(/^(.*?);.*?$/i, "$1");
+ info[h] = value;
+ }
+ callback(url, info);
+ }
+ }
+ xhr.send();
+ }
+ };
+
+ // start listening
+ if (document.location.protocol != "file:") {
+ if (!window.liveJsLoaded)
+ Live.heartbeat();
+
+ window.liveJsLoaded = true;
+ }
+ else if (window.console)
+ console.log("Live.js doesn't support the file protocol. It needs http.");
+})();
7 lib/copyright.js
@@ -0,0 +1,7 @@
+/*!
+ * jquery.toc.js - A jQuery plugin that will automaticall generate a table of contents.
+ * v0.0.1
+ * https://github.com/jgallen23/toc
+ * copyright JGA 2012
+ * MIT License
+ */
79 lib/toc.js
@@ -0,0 +1,79 @@
+jQuery.fn.toc = function(options) {
+ var self = this;
+ var opts = $.extend({}, jQuery.fn.toc.defaults, options);
+
+ var container = $(opts.container);
+ var headings = $(opts.selectors, container);
+ var headingOffsets = [];
+
+ var scrollTo = function(e) {
+ if (opts.smoothScrolling) {
+ e.preventDefault();
+ var elScrollTo = $(e.target).attr('href');
+ var $el = $(elScrollTo);
+ $(opts.container).animate({ scrollTop: $el.offset().top }, 400, 'swing', function() {
+ location.hash = elScrollTo;
+ });
+ }
+ };
+
+ //highlight on scroll
+ var timeout;
+ var highlightOnScroll = function(e) {
+ if (timeout) {
+ clearTimeout(timeout);
+ }
+ timeout = setTimeout(function() {
+ var top = $(window).scrollTop();
+ for (var i = 0, c = headingOffsets.length; i < c; i++) {
+ if (headingOffsets[i] >= top) {
+ $('li', self).removeClass('active');
+ $('li:eq('+i+')', self).addClass('active');
+ break;
+ }
+ }
+ }, 50);
+ };
+ if (opts.highlightOnScroll) {
+ $(window).bind('scroll', highlightOnScroll);
+ highlightOnScroll();
+ }
+
+
+ return this.each(function() {
+ //build TOC
+ var ul = $('<ul/>');
+ headings.each(function(i, heading) {
+ var $h = $(heading);
+ headingOffsets.push($h.offset().top);
+
+ //add anchor
+ var anchor = $('<span/>').attr('id', opts.prefix+i).insertBefore($h);
+
+ //build TOC item
+ var a = $('<a/>')
+ .text($h.text())
+ .attr('href', '#'+opts.prefix+i)
+ .bind('click', scrollTo);
+
+ var li = $('<li/>')
+ .addClass(opts.prefix+$h[0].tagName)
+ .append(a);
+
+ ul.append(li);
+ });
+ var el = $(this);
+ console.log(el);
+ el.html(ul);
+ });
+};
+
+
+jQuery.fn.toc.defaults = {
+ container: 'body',
+ selectors: 'h1,h2,h3',
+ smoothScrolling: true,
+ prefix: 'toc',
+ highlightOnScroll: true
+};
+
Please sign in to comment.
Something went wrong with that request. Please try again.