Class: Twb::HTMLListCollapsible

Inherits:
Object
  • Object
show all
Defined in:
lib/twb/htmllistcollapsible.rb,
lib/twb/util/htmllistcollapsible.rb

Constant Summary collapse

@@doc =
Nokogiri::HTML::Document.parse  <<-COLLAPSIBLELIST
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <title>TWB Documentation</title>
    
        <style type="text/css">
            body, a {
                color: #3B4C56;
                font-family: sans-serif;
                font-size: 14px;
                text-decoration: none;
            }
            #pgtitle
            {
               margin: 0px 0px 20px;
               font-size: 14pt;
               text-align: center;
            }
            a{
               cursor:pointer;
            }
            .tree ul {
                list-style: none outside none;
            }
            .tree li a {
                line-height: 25px;
            }
            .tree > ul > li > a {
                color: #3B4C56;
                display: block;
                font-weight: normal;
                position: relative;
                text-decoration: none;
            }
            .tree li.parent > a {
                padding: 0 0 0 28px;
            }
            .tree li.parent > a:before {
                background-image: url("UpLeftArrowsNav.png");
                background-position: 20px center;
                 content: "";
                display: block;
                height: 20px;
                left: 0;
                position: absolute;
                top: 2px;
                vertical-align: middle;
                width: 20px;
            }
            .tree ul li.active > a:before {
                background-position: 0 center;
            }
            .tree ul li ul {
                border-left: 1px solid #D9DADB;
                display: none;
                margin: 0 0 0 12px;
                overflow: hidden;
                padding: 0 0 0 25px;
            }
            .tree ul li ul li {
                position: relative;
            }
            .tree ul li ul li:before {
                border-bottom: 1px dashed #E2E2E3;
                content: "";
                left: -20px;
                position: absolute;
                top: 12px;
                width: 15px;
            }
            #wrapper {
                margin: 0 auto;
                width: 300px;
            }
        </style>
    
        <script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript" > </script>
    
        <script type="text/javascript">
            $( document ).ready( function( ) {
                    $( '.tree li' ).each( function() {
                            if( $( this ).children( 'ul' ).length > 0 ) {
                                    $( this ).addClass( 'parent' );
                            }
                    });
    
                    $( '.tree li.parent > a' ).click( function( ) {
                            $( this ).parent().toggleClass( 'active' );
                            $( this ).parent().children( 'ul' ).slideToggle( 'fast' );
                    });
    
                    $( '#all' ).click( function() {
    
                        $( '.tree li' ).each( function() {
                            $( this ).toggleClass( 'active' );
                            $( this ).children( 'ul' ).slideToggle( 'fast' );
                        });
                    });
    
                    $( '.tree li' ).each( function() {
                            $( this ).toggleClass( 'active' );
                            $( this ).children( 'ul' ).slideToggle( 'fast' );
                    });
    
            });
    
        </script>
    
    </head>
    <body>
        <div id="pgtitle">
            Expandable nested list.
        </div>
        <div id="wrapper">
        <div class="tree">
        <button id="all">Toggle all</button>
        <ul>
        </ul>
        </div>
        </div>
    
    </body>
    </html>
COLLAPSIBLELIST

Instance Method Summary collapse

Constructor Details

#initialize(hash) ⇒ HTMLListCollapsible

Returns a new instance of HTMLListCollapsible.



150
151
152
153
154
155
# File 'lib/twb/util/htmllistcollapsible.rb', line 150

def initialize(hash)
  @htmldoc = @@doc
  @list    = HashToHTMLList.new(hash).list
  ul = @htmldoc.at_xpath('//ul')
  ul.replace(@list)
end

Instance Method Details

#htmlObject



148
149
150
# File 'lib/twb/htmllistcollapsible.rb', line 148

def html
 " here's the @@doc"
end

#installNavImageFileObject



176
177
178
179
# File 'lib/twb/util/htmllistcollapsible.rb', line 176

def installNavImageFile
  navimage = File.dirname(__FILE__) + "/UpLeftArrowsNav.png"
  FileUtils.cp(navimage, Dir.pwd)
end

#title=(str) ⇒ Object



157
158
159
160
# File 'lib/twb/util/htmllistcollapsible.rb', line 157

def title=(str)
  title = @htmldoc.at_xpath('//div[@id="pgtitle"]')
  title.content = str if title 
end

#write(name = 'collapsibleList.html') ⇒ Object

Write the HTML to a file using the provided name.



167
168
169
170
171
172
173
174
# File 'lib/twb/util/htmllistcollapsible.rb', line 167

def write(name='collapsibleList.html')
  $f = File.open(name,'w')
  if $f
      $f.puts @htmldoc
      $f.close
  end
  installNavImageFile
end