Dave Jarvis' Repositories
git clone https://repo.autonoma.ca/repo/delibero.git
Isolated UL elements for Miller Columns.
| Author | Dave Jarvis <email> |
|---|---|
| Date | 2014-11-24 00:59:36 GMT-0800 |
| Commit | 4f07f8fb4f152919d68554c8dc18a569b625585e |
| Parent | 7c0a304 |
xml/common.xsl
| -<?xml version="1.0"?> | ||
| +<?xml version="1.0" encoding="utf-8"?> | ||
| <!-- | ||
| | The MIT License | ||
 |
||
| <xsl:include href="tags.xsl"/> | ||
| -<!-- Minor optimization. --> | ||
| -<xsl:output indent="no" encoding="utf-8"/> | ||
| +<xsl:output | ||
| + indent="no" | ||
| + method="html" | ||
| + doctype-system="about:legacy-compat" | ||
| + encoding="utf-8"/> | ||
| <!-- Action parser that responds to HTTP requests. --> | ||
xml/css/tags.css
| -/** ********************************************************************** | ||
| - * | ||
| - * Reset | ||
| - * | ||
| - ************************************************************************/ | ||
| -h1, h2, h3, h4, h5, h6, p, blockquote, pre, | ||
| -a, abbr, code, del, dfn, em, img, ins, kbd, q, s, samp, | ||
| -small, strong, sub, sup, var, | ||
| -b, u, i, center, | ||
| -dl, dt, dd, ol, ul, li, | ||
| -fieldset, form, label, legend, | ||
| -table, caption, tbody, tfoot, thead, tr, th, td, | ||
| -article, aside, canvas, details, embed, | ||
| -figure, figcaption, footer, header, hgroup { | ||
| - margin: 0; | ||
| - padding: 0; | ||
| - border: 0; | ||
| - font-size: 100%; | ||
| - font: inherit; | ||
| - vertical-align: baseline; | ||
| -} | ||
| -footer, header, hgroup, menu, nav, section { | ||
| - display: block; | ||
| -} | ||
| -body { | ||
| - line-height: 1; | ||
| -} | ||
| -ol, ul { | ||
| - list-style: none; | ||
| -} | ||
| -blockquote, q { | ||
| - quotes: none; | ||
| -} | ||
| -table { | ||
| - border-collapse: collapse; | ||
| - border-spacing: 0; | ||
| -} | ||
| - | ||
| -/** ********************************************************************** | ||
| - * | ||
| - * hColumns | ||
| - * | ||
| - ************************************************************************/ | ||
| - | ||
| -/* column view container */ | ||
| -.column-view-container { | ||
| - width: 100%; | ||
| - height: 400px; | ||
| - padding: 0; | ||
| - border: 1px solid #ccc; | ||
| - background: #FFF; | ||
| - display: block; | ||
| - overflow-x: auto; | ||
| - overflow-y: hidden; | ||
| -} | ||
| - | ||
| -/* the composition div for colums */ | ||
| -.column-view-composition { | ||
| - display: table; | ||
| - white-space: nowrap; | ||
| -} | ||
| - | ||
| -/**/ | ||
| -.column { | ||
| - display: table-cell; | ||
| - border-right: 1px solid #999; | ||
| -} | ||
| - | ||
| -.column:last-child { | ||
| - border-right: 0; | ||
| -} | ||
| - | ||
| -.column:only-child { | ||
| - border-right: 1px solid #999; | ||
| -} | ||
| - | ||
| -/* for error messages */ | ||
| -.column > p { | ||
| - margin: 10px; | ||
| - color: #666; | ||
| -} | ||
| - | ||
| -/* for column listing */ | ||
| -.column ul { | ||
| - margin: 0; | ||
| - padding: 0; | ||
| - height: 400px; | ||
| - width: 250px; | ||
| - overflow-y: auto; | ||
| - list-style: none; | ||
| -} | ||
| - | ||
| -.column ul li { | ||
| - position: relative; | ||
| - margin: 0; | ||
| - padding: 10px 20px 10px 10px; | ||
| - overflow: hidden; | ||
| - -o-text-overflow: ellipsis; /* pour Opera 9 */ | ||
| - text-overflow: ellipsis; /* pour le reste du monde */ | ||
| -} | ||
| - | ||
| -.column ul li:hover { | ||
| - cursor: pointer; | ||
| -} | ||
| - | ||
| -.column ul li i { | ||
| - position: absolute; | ||
| - top: 9px; | ||
| - right: 5px; | ||
| -} | ||
| - | ||
| -.column ul li:hover, .column ul li.active { | ||
| - background: #999999; | ||
| - color: #FFFFFF; | ||
| -} | ||
| - | ||
| -.column ul li:hover a, .column ul li.active a { | ||
| - color: #FFFFFF; | ||
| -} | ||
| - | ||
| -.column ul li.search { | ||
| - margin: 0; | ||
| - padding: 5px; | ||
| -} | ||
| - | ||
| -.column ul li.search input { | ||
| - width: 100%; | ||
| - margin: 0; | ||
| -} | ||
| - | ||
| -[class^="icon-"], [class*=" icon-"] { | ||
| - display: inline-block; | ||
| - width: 14px; | ||
| - height: 14px; | ||
| - margin-top: 1px; | ||
| - *margin-right: .3em; | ||
| - line-height: 14px; | ||
| - vertical-align: text-top; | ||
| - background-image: url("../img/glyphicons-halflings.png"); | ||
| - background-position: 14px 14px; | ||
| - background-repeat: no-repeat; | ||
| -} | ||
| - | ||
| -.icon-chevron-right { | ||
| - background-position: -456px -72px; | ||
| +div.columns { | ||
| + margin-top: 1em; | ||
| + margin-bottom: 1em; | ||
| + border: 1px solid #C3C6CB; | ||
| + height: 250px; | ||
| + overflow-y: scroll; | ||
| } | ||
| -.icon-globe { | ||
| - background-position: -336px -144px; | ||
| +ul, li { | ||
| + list-style: none; | ||
| } | ||
| -.icon-file { | ||
| - background-position: -23px -24px; | ||
| -} | ||
xml/js/columns.js
| +(function( $ ) { | ||
| + $.fn.millerColumns = function() { | ||
| + var queue = []; | ||
| + | ||
| + // Must be a list (i.e., UL). | ||
| + var $list = $(this).first(); | ||
| + var $columns = $(this); | ||
| + | ||
| + while( ($list = $list.children()).length ) { | ||
| + $list.each( function( index, element ) { | ||
| + var text = $(element).contents().first().text(); | ||
| + var $parent = $(element).parent(); | ||
| + | ||
| + if( $(element).is( "li" ) ) { | ||
| + var id = $(element).attr( "id" ); | ||
| + console.log( index + " " + element + " [" + id + "] " + text ); | ||
| + $parent = $($parent).parent(); | ||
| + } | ||
| + else if( $(element).is( "ul" ) ) { | ||
| + console.log( "div: " + index + " " + element + " " + text ); | ||
| + } | ||
| + | ||
| + var parent_id = $($parent).attr( "id" ); | ||
| + | ||
| + // The left-most column (root div element). | ||
| + if( parent_id !== undefined ) { | ||
| + var $div = $("<div>").attr( "parent", 0 ); | ||
| + | ||
| + $(element).wrapAll( $div ); | ||
| + } | ||
| + }); | ||
| + } | ||
| + | ||
| + return this; | ||
| + }; | ||
| + | ||
| + $("div.columns").millerColumns(); | ||
| +}(jQuery)); | ||
| + | ||
xml/tags.xsl
| +<?xml version="1.0"?> | ||
| +<!-- | ||
| + | The MIT License | ||
| + | | ||
| + | Copyright 2014 White Magic Software, Inc. | ||
| + | | ||
| + | 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. | ||
| + +--> | ||
| +<xsl:stylesheet version="1.0" | ||
| + xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> | ||
| + | ||
| +<xsl:template match="policy"> | ||
| + <xsl:apply-templates /> | ||
| + <xsl:apply-templates mode="tag" /> | ||
| +</xsl:template> | ||
| + | ||
| +<xsl:template match="tags" mode="tag"> | ||
| + <div class="columns"> | ||
| + <ul> | ||
| + <xsl:apply-templates mode="tag" /> | ||
| + </ul> | ||
| + </div> | ||
| + <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> | ||
| + <script src="js/columns.js"></script> | ||
| +</xsl:template> | ||
| + | ||
| +<xsl:template match="tag" mode="tag"> | ||
| +<li> | ||
| + <xsl:attribute name="id"> | ||
| + <xsl:value-of select="@id" /> | ||
| + </xsl:attribute> | ||
| + <xsl:value-of select="name" /> | ||
| + <xsl:if test="tag"> | ||
| + <ul> | ||
| + <xsl:apply-templates select="tag" mode="tag" /> | ||
| + </ul> | ||
| + </xsl:if> | ||
| +</li> | ||
| +</xsl:template> | ||
| + | ||
| +<!-- Ignore any nodes having nothing to do with tags. --> | ||
| +<xsl:template match="*" mode="tag" /> | ||
| + | ||
| +<!-- Ignore the tags not in the correct mode. --> | ||
| +<xsl:template match="tags" /> | ||
| + | ||
| +</xsl:stylesheet> | ||
| + | ||
| Delta | 120 lines added, 153 lines removed, 33-line decrease |
|---|