From 64e38951f43f099c5db1175e36ea9555d024656e Mon Sep 17 00:00:00 2001 From: Anuj Gakhar Date: Tue, 17 Jan 2012 22:34:27 +0000 Subject: [PATCH] Added CF9 docs, added a Railo frame to look at it side by side Signed-off-by: Anuj Gakhar --- .gitignore | 3 +- assets/css/application.css | 18 ++++++ assets/js/app.coffee | 3 +- assets/js/app.js | 2 +- assets/js/docs_controller.coffee | 81 +++++++++++++++++--------- assets/js/docs_controller.js | 97 +++++++++++++++++++++----------- humans.txt | 17 ++++++ index.html | 13 +++-- 8 files changed, 166 insertions(+), 68 deletions(-) create mode 100644 humans.txt diff --git a/.gitignore b/.gitignore index d5c0ae6..66555b7 100644 --- a/.gitignore +++ b/.gitignore @@ -8,4 +8,5 @@ html-template bin-debug -*.tmproj \ No newline at end of file +*.tmproj +data/cfml \ No newline at end of file diff --git a/assets/css/application.css b/assets/css/application.css index e27d41d..704555d 100644 --- a/assets/css/application.css +++ b/assets/css/application.css @@ -12,8 +12,19 @@ iframe { width:100%; border:none; height:100%; + display:block; } #footer{margin:auto;text-align:center;padding-top:10px;} +ul#docItems li{ + padding:3px 5px 3px 10px; +} +ul#docItems li.selected{ + background:#404040; + color:#fff; +} +ul#docItems li.selected a{ + color:#fff; +} #docsContainer{ bottom:50; top:40; @@ -25,6 +36,12 @@ iframe { min-height:90%; background:#fff; } +#acfContainer, #railoContainer{ + height:50%; +} +#acfContainer{ + border-bottom:5px solid #404040; +} #searchBox{ background:#404040; border:none; @@ -47,6 +64,7 @@ iframe { } .container-fluid > .content{ min-height:100%; + height:100%; position:absolute; right:0; left:245px; diff --git a/assets/js/app.coffee b/assets/js/app.coffee index 0b5581c..400fbc4 100644 --- a/assets/js/app.coffee +++ b/assets/js/app.coffee @@ -2,6 +2,5 @@ $(document).ready( -> docs_controller = new DocsController({ container: $("#docsContainer") }) - - docs_controller.loadConfig("data/cfmldoc.xml") + docs_controller.loadConfig("data/cfml/toc.xml") ) \ No newline at end of file diff --git a/assets/js/app.js b/assets/js/app.js index 2ea9989..7eb4b5b 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -5,7 +5,7 @@ docs_controller = new DocsController({ container: $("#docsContainer") }); - return docs_controller.loadConfig("data/cfmldoc.xml"); + return docs_controller.loadConfig("data/cfml/toc.xml"); }); }).call(this); diff --git a/assets/js/docs_controller.coffee b/assets/js/docs_controller.coffee index dd805c7..953a6c9 100644 --- a/assets/js/docs_controller.coffee +++ b/assets/js/docs_controller.coffee @@ -11,8 +11,9 @@ class @DocsController # Content Container @docItems = params.docItems || @container.find("#docItems") @selectedItemDetails = params.selectedItemDetails || @container.find("#selectedItemDetails") - @externalFrame = params.externalFrame || @container.find('#externalFrame') - @sideBarContentArea = params.sideBarContentArea || @container.find('#sideBarMiddle') + @externalFrameACF = params.externalFrameACF || @container.find('#externalFrameACF') + @externalFrameRailo = params.externalFrameRailo || @container.find('#externalFrameRailo') + @sideBarContentArea = params.sideBarContentArea || @container.find('#sideBarMiddle') @searchInput = params.searchInput || @container.find('#searchInput') # Configurable CSS Classes @@ -28,8 +29,25 @@ class @DocsController @acfConfigLoaded = false @railoConfigLoaded = false @acfConfigXML = "" - @acfBasePath = "http://assets.coldfusiondocs.com/html/cfml/" + @acfBasePath = "/data/cfml/docs/" + @railoBasePath = "http://assets.coldfusiondocs.com/html/railo/" + @fixHeight() + @showSpinner() + + @searchInput.bind 'keyup change', ( => + @filterResults() if @acfConfigLoaded && @searchInput.val().length > 2 + false + ) + + $(window).resize( => + @fixHeight() + ) + + fixHeight: -> + @sideBarContentArea.css('height', $(document).height() - 200) + + showSpinner: -> # Configure and position spinner. @spinner = new Spinner( lines: 12 # The number of lines to draw @@ -47,19 +65,18 @@ class @DocsController spinnerElement.css("margin-left", "#{-@spinnerRadius}px") spinnerElement.css("position", "absolute") @loadingPanel.append(@spinner.el) - @sideBarContentArea.css('height', $(document).height() - 199) - @searchInput.bind 'keyup mouseup change', ( => - @filterResults() if @acfConfigLoaded - false - ) + removeSpinner: -> + @container.removeClass(@loadingClass) + $(@spinner.el).remove() filterResults: -> @parseXML(@searchInput.val()) + @searchImput.focus() false # Loads XML data for a supplied URL. - loadConfig: (url) -> + loadConfig: (url, docset = 'acf') -> @container.addClass(@loadingClass) @url = url $.ajax({ @@ -81,33 +98,43 @@ class @DocsController parseXML: (criteria = "") -> @config_xml = $(@acfConfigXML) - @objects = @config_xml.find("object") + @topics = @config_xml.find("topic") + @docItems.find('li').remove() + @docItems.find("a").unbind('click') + index = 0 - for obj in @objects - current = $(obj) - objName = current.attr("name") - docUrl = current.find("docURL").text() - if criteria == "" || objName.indexOf(criteria) != -1 + for topic in @topics + current = $(topic) + topicLabel = current.attr("label") + topicUrl = current.attr("href") + if criteria == "" || topicLabel.indexOf(criteria) != -1 listItem = $('
  • ') listItem.attr("data-index", index) - listItem.attr("data-name", objName) - listItem.attr("data-url", docUrl) + listItem.attr("data-name", topicLabel) + listItem.attr("data-url", topicUrl) href = $('') href.attr('class', 'docItem').attr('href','#') - href.bind 'click', @listItemClick - href.append(objName) + href.append(topicLabel) listItem.append(href) @docItems.append(listItem) index += 1 @docItems.find("a").click( (event) => - clickedListItem = $(event.target).parent() - objectUrl = clickedListItem.attr("data-url").split("/") - fileName = objectUrl[objectUrl.length - 1] - @externalFrame.attr("src", @acfBasePath + fileName) + @handleItemClick($(event.target).parent()) ) - - removeSpinner: -> - @container.removeClass(@loadingClass) - $(@spinner.el).remove() + + #force select first item + @handleItemClick(@docItems.find('li:first')) if criteria == "" + + handleItemClick: (obj = null) -> + @showSpinner() + @docItems.find('li').removeClass("selected") + clickedListItem = $(obj) + objectUrl = clickedListItem.attr("data-url").split("/") + objectLabel = clickedListItem.attr("data-name") + fileName = objectUrl[objectUrl.length - 1] + @externalFrameACF.attr("src", @acfBasePath + fileName) + @externalFrameRailo.attr("src", @railoBasePath + 'tag_' + objectLabel + '.html') + clickedListItem.addClass("selected") + @removeSpinner() \ No newline at end of file diff --git a/assets/js/docs_controller.js b/assets/js/docs_controller.js index 5a305b5..e6db5b1 100644 --- a/assets/js/docs_controller.js +++ b/assets/js/docs_controller.js @@ -3,15 +3,15 @@ this.DocsController = (function() { function DocsController(params) { - var spinnerElement, - _this = this; + var _this = this; if (params == null) params = {}; this.container = params.container || $("#docsContainer"); this.loadingPanel = params.loadingPanel || this.container.find("#loadingPanel"); this.spinnerRadius = params.spinnerRadius || 10; this.docItems = params.docItems || this.container.find("#docItems"); this.selectedItemDetails = params.selectedItemDetails || this.container.find("#selectedItemDetails"); - this.externalFrame = params.externalFrame || this.container.find('#externalFrame'); + this.externalFrameACF = params.externalFrameACF || this.container.find('#externalFrameACF'); + this.externalFrameRailo = params.externalFrameRailo || this.container.find('#externalFrameRailo'); this.sideBarContentArea = params.sideBarContentArea || this.container.find('#sideBarMiddle'); this.searchInput = params.searchInput || this.container.find('#searchInput'); this.loadingClass = params.loadingClass || "loading"; @@ -22,7 +22,27 @@ this.acfConfigLoaded = false; this.railoConfigLoaded = false; this.acfConfigXML = ""; - this.acfBasePath = "http://assets.coldfusiondocs.com/html/cfml/"; + this.acfBasePath = "/data/cfml/docs/"; + this.railoBasePath = "http://assets.coldfusiondocs.com/html/railo/"; + this.fixHeight(); + this.showSpinner(); + this.searchInput.bind('keyup change', (function() { + if (_this.acfConfigLoaded && _this.searchInput.val().length > 2) { + _this.filterResults(); + } + return false; + })); + $(window).resize(function() { + return _this.fixHeight(); + }); + } + + DocsController.prototype.fixHeight = function() { + return this.sideBarContentArea.css('height', $(document).height() - 200); + }; + + DocsController.prototype.showSpinner = function() { + var spinnerElement; this.spinner = new Spinner({ lines: 12, length: 7, @@ -38,21 +58,23 @@ spinnerElement.css("margin-top", "" + (-this.spinnerRadius * 4) + "px"); spinnerElement.css("margin-left", "" + (-this.spinnerRadius) + "px"); spinnerElement.css("position", "absolute"); - this.loadingPanel.append(this.spinner.el); - this.sideBarContentArea.css('height', $(document).height() - 199); - this.searchInput.bind('keyup mouseup change', (function() { - if (_this.acfConfigLoaded) _this.filterResults(); - return false; - })); - } + return this.loadingPanel.append(this.spinner.el); + }; + + DocsController.prototype.removeSpinner = function() { + this.container.removeClass(this.loadingClass); + return $(this.spinner.el).remove(); + }; DocsController.prototype.filterResults = function() { this.parseXML(this.searchInput.val()); + this.searchImput.focus(); return false; }; - DocsController.prototype.loadConfig = function(url) { + DocsController.prototype.loadConfig = function(url, docset) { var _this = this; + if (docset == null) docset = 'acf'; this.container.addClass(this.loadingClass); this.url = url; $.ajax({ @@ -77,45 +99,54 @@ }; DocsController.prototype.parseXML = function(criteria) { - var current, docUrl, href, index, listItem, obj, objName, _i, _len, _ref, + var current, href, index, listItem, topic, topicLabel, topicUrl, _i, _len, _ref, _this = this; if (criteria == null) criteria = ""; this.config_xml = $(this.acfConfigXML); - this.objects = this.config_xml.find("object"); + this.topics = this.config_xml.find("topic"); this.docItems.find('li').remove(); + this.docItems.find("a").unbind('click'); index = 0; - _ref = this.objects; + _ref = this.topics; for (_i = 0, _len = _ref.length; _i < _len; _i++) { - obj = _ref[_i]; - current = $(obj); - objName = current.attr("name"); - docUrl = current.find("docURL").text(); - if (criteria === "" || objName.indexOf(criteria) !== -1) { + topic = _ref[_i]; + current = $(topic); + topicLabel = current.attr("label"); + topicUrl = current.attr("href"); + if (criteria === "" || topicLabel.indexOf(criteria) !== -1) { listItem = $('
  • '); listItem.attr("data-index", index); - listItem.attr("data-name", objName); - listItem.attr("data-url", docUrl); + listItem.attr("data-name", topicLabel); + listItem.attr("data-url", topicUrl); href = $(''); href.attr('class', 'docItem').attr('href', '#'); - href.bind('click', this.listItemClick); - href.append(objName); + href.append(topicLabel); listItem.append(href); this.docItems.append(listItem); index += 1; } } - return this.docItems.find("a").click(function(event) { - var clickedListItem, fileName, objectUrl; - clickedListItem = $(event.target).parent(); - objectUrl = clickedListItem.attr("data-url").split("/"); - fileName = objectUrl[objectUrl.length - 1]; - return _this.externalFrame.attr("src", _this.acfBasePath + fileName); + this.docItems.find("a").click(function(event) { + return _this.handleItemClick($(event.target).parent()); }); + if (criteria === "") { + return this.handleItemClick(this.docItems.find('li:first')); + } }; - DocsController.prototype.removeSpinner = function() { - this.container.removeClass(this.loadingClass); - return $(this.spinner.el).remove(); + DocsController.prototype.handleItemClick = function(obj) { + var clickedListItem, fileName, objectLabel, objectUrl; + if (obj == null) obj = null; + this.showSpinner(); + this.docItems.find('li').removeClass("selected"); + clickedListItem = $(obj); + objectUrl = clickedListItem.attr("data-url").split("/"); + objectLabel = clickedListItem.attr("data-name"); + fileName = objectUrl[objectUrl.length - 1]; + this.externalFrameACF.attr("src", this.acfBasePath + fileName); + this.externalFrameRailo.attr("src", this.railoBasePath + 'tag_' + objectLabel + '.html'); + clickedListItem.addClass("selected"); + return this.removeSpinner(); }; return DocsController; diff --git a/humans.txt b/humans.txt new file mode 100644 index 0000000..68cc1ca --- /dev/null +++ b/humans.txt @@ -0,0 +1,17 @@ +/* the humans responsible & colophon */ +/* humanstxt.org */ + + +/* TEAM */ + Author: Anuj Gakhar + Site: http://www.anujgakhar.com + Twitter: @anujgakhar + Location: UK + +/* THANKS */ + Names (& URL): + +/* SITE */ + Standards: HTML5, CSS3 + Components: Modernizr, jQuery + Software: diff --git a/index.html b/index.html index a609527..f26262c 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,6 @@ - @@ -36,7 +35,7 @@
    -
      +
        @@ -48,8 +47,14 @@

        Loading content...

        - - + +
        + +
        + +
        + +