github/bootstrap
1
1
Fork 0
mirror of https://github.com/jasny/bootstrap.git synced 2026-01-19 19:38:05 -05:00
Code Issues Packages Projects Releases Wiki Activity

Documented Row link js

Browse Source 
Added bootstrap-rowlink.js to Makefile
Added jasny/rowlink.less to jasny/bootstrap.less
This commit is contained in:
Arnold Daniels
2012-07-17 23:07:27 +02:00
parent 75205d464a
commit ce469c01b6
6 changed files with 95 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
Makefile
View File

@@ -29,7 +29,7 @@ build:
@cp -r fonts docs/assets/
@cp js/tests/vendor/jquery.js docs/assets/js/
@echo "Compiling documentation... ${CHECK} Done"
@cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js js/bootstrap-inputmask.js > docs/assets/js/bootstrap.js
@cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js js/bootstrap-inputmask.js js/bootstrap-rowlink.js > docs/assets/js/bootstrap.js
@uglifyjs -nc docs/assets/js/bootstrap.js > docs/assets/js/bootstrap.min.tmp.js
@echo "/**\n* Bootstrap.js by @fat & @mdo\n* Copyright 2012 Twitter, Inc.\n* http://www.apache.org/licenses/LICENSE-2.0.txt\n*/" > docs/assets/js/copyright.js
@cat docs/assets/js/copyright.js docs/assets/js/bootstrap.min.tmp.js > docs/assets/js/bootstrap.min.js
@@ -69,7 +69,7 @@ bootstrap:
recess --compress ${BOOTSTRAP_LESS} ${JASNY_BOOTSTRAP_LESS} > bootstrap/css/bootstrap.min.css
recess --compile ${BOOTSTRAP_RESPONSIVE_LESS} ${JASNY_BOOTSTRAP_RESPONSIVE_LESS} > bootstrap/css/bootstrap-responsive.css
recess --compress ${BOOTSTRAP_RESPONSIVE_LESS} ${JASNY_BOOTSTRAP_RESPONSIVE_LESS} > bootstrap/css/bootstrap-responsive.min.css
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js js/bootstrap-inputmask.js > bootstrap/js/bootstrap.js
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js js/bootstrap-inputmask.js js/bootstrap-rowlink.js > bootstrap/js/bootstrap.js
uglifyjs -nc bootstrap/js/bootstrap.js > bootstrap/js/bootstrap.min.tmp.js
echo "/*!\n* Bootstrap.js by @fat & @mdo\n* Copyright 2012 Twitter, Inc.\n* http://www.apache.org/licenses/LICENSE-2.0.txt\n*/" > bootstrap/js/copyright.js
cat bootstrap/js/copyright.js bootstrap/js/bootstrap.min.tmp.js > bootstrap/js/bootstrap.min.js
@@ -84,13 +84,13 @@ jasny-bootstrap:
mkdir -p jasny-bootstrap/css
mkdir -p jasny-bootstrap/js
mkdir -p jasny-bootstrap/fonts
cp js/bootstrap-inputmask.js jasny-bootstrap/js
cp js/bootstrap-inputmask.js js/bootstrap-rowlink.js jasny-bootstrap/js
cp fonts/* jasny-bootstrap/fonts/
recess --compile ${JASNY_BOOTSTRAP_LESS} > jasny-bootstrap/css/jasny-bootstrap.css
recess --compress ${JASNY_BOOTSTRAP_LESS} > jasny-bootstrap/css/jasny-bootstrap.min.css
recess --compile ${JASNY_BOOTSTRAP_RESPONSIVE_LESS} > jasny-bootstrap/css/jasny-bootstrap-responsive.css
recess --compress ${JASNY_BOOTSTRAP_RESPONSIVE_LESS} > jasny-bootstrap/css/jasny-bootstrap-responsive.min.css
cat js/bootstrap-inputmask.js > jasny-bootstrap/js/jasny-bootstrap.js
cat js/bootstrap-inputmask.js js/bootstrap-rowlink.js > jasny-bootstrap/js/jasny-bootstrap.js
uglifyjs -nc jasny-bootstrap/js/jasny-bootstrap.js > jasny-bootstrap/js/jasny-bootstrap.min.tmp.js
echo "/*!\n* Jasny-Bootstrap.js by @ArnoldDaniels\n* Copyright 2012 Jasny BV.\n* http://www.apache.org/licenses/LICENSE-2.0.txt\n*/" > jasny-bootstrap/js/copyright.js
cat jasny-bootstrap/js/copyright.js jasny-bootstrap/js/jasny-bootstrap.min.tmp.js > jasny-bootstrap/js/jasny-bootstrap.min.js

1
docs/templates/layout.mustache vendored
View File

@@ -122,6 +122,7 @@
<script src="assets/js/bootstrap-carousel.js"></script>
<script src="assets/js/bootstrap-typeahead.js"></script>
<script src="assets/js/bootstrap-inputmask.js"></script>
<script src="assets/js/bootstrap-rowlink.js"></script>
<script src="assets/js/application.js"></script>
</body>

5
docs/templates/pages/index.mustache vendored
View File

@@ -61,6 +61,11 @@
<p>{{_i}}Force the user to enter data conform a specific format.{{/i}}</p>
<p>{{_i}}Unlike validation, the user can't enter any other key than the ones specified by the mask.{{/i}}</p>
</div>
<div class="span3">
<h3><a href="./javascript.html#rowlink">{{_i}}Row link{{/i}}</a></h3>
<p>{{_i}}Don't like when can only click on one column in a table?{{/i}}</p>
<p>{{_i}}Row link is a simple javascript plugin that makes the whole row clickable.{{/i}}</p>
</div>
</div>
<div class="row">
<div class="span3">

87
docs/templates/pages/javascript.mustache vendored
View File

@@ -2,7 +2,7 @@
================================================== -->
<header class="jumbotron subhead" id="overview">
<h1>{{_i}}Javascript for Bootstrap{{/i}}</h1>
<p class="lead">{{_i}}Bring Bootstrap's components to life&mdash;now with 13 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins.{{/i}}
<p class="lead">{{_i}}Bring Bootstrap's components to life&mdash;now with 14 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins.{{/i}}
<div class="subnav visible-desktop">
<ul class="nav nav-pills">
<li><a href="#javascript">{{_i}}All plugins{{/i}}</a></li>
@@ -26,6 +26,12 @@
<li><a href="#buttons">{{_i}}Button{{/i}}</a></li>
<li><a href="#collapse">{{_i}}Collapse{{/i}}</a></li>
<li><a href="#carousel">{{_i}}Carousel{{/i}}</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Tables{{/i}} <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#rowlink">{{_i}}Row link{{/i}}</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">{{_i}}Forms{{/i}} <b class="caret"></b></a>
<ul class="dropdown-menu">
@@ -90,16 +96,20 @@
<h3><a href="./javascript.html#carousel">{{_i}}Carousel{{/i}}</a></h3>
<p>{{_i}}Create a merry-go-round of any content you wish to provide an interactive slideshow of content.{{/i}}</p>
</div>
<div class="span3">
<h3><a href="./javascript.html#rowlink">{{_i}}Row link{{/i}}</a></h3>
<p>{{_i}}A simple plugin, to turn table rows into clickable links.{{/i}}</p>
</div>
<div class="span3">
<h3><a href="./javascript.html#typeahead">Typeahead</a></h3>
<p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p>
</div>
</div> <!-- /row -->
<div class="row" style="margin-bottom: 9px;">
<div class="span3">
<h3><a href="./javascript.html#inputmask">{{_i}}Input mask{{/i}}</a></h3>
<p>{{_i}}Make sure the user types in the data that you want, by using an input mask.{{/i}}</p>
</div>
</div> <!-- /row -->
<div class="row" style="margin-bottom: 9px;">
<div class="span3">
<h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3>
<p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p>
@@ -1348,6 +1358,75 @@ $('.carousel').carousel({
<!-- Row link
================================================== -->
<section id="rowlink">
<div class="page-header">
<h1>{{_i}}Row link{{/i}} <small>bootstrap-rowlink.js</small></h1>
</div>
<div class="row">
<div class="span3 columns">
<h3>{{_i}}About{{/i}}</h3>
<p>{{_i}}This plugin turns a table row into a clickable link.{{/i}}</p>
<a href="assets/js/bootstrap-rowlink.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
</div>
<div class="span9 columns">
<h2>{{_i}}Example{{/i}}</h2>
<table class="table table-striped table-bordered">
<thead>
<tr><th>{{_i}}Name{{/i}}</th><th>{{_i}}Description{{/i}}</th><th>Actions</th></tr>
</thead>
<tbody data-provides="rowlink">
<tr><td><a href="./javascript.html#modals" class="rowlink">{{_i}}Modals{{/i}}</a></td><td>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</td><td class="nolink"><a href="#">Action</a></td></tr>
<tr><td><a href="./javascript.html#dropdowns" class="rowlink">{{_i}}Dropdowns{{/i}}</a></td><td>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</td><td class="nolink"><a href="#">Action</a></td></tr>
<tr><td><a href="./javascript.html#scrollspy" class="rowlink">{{_i}}Scrollspy{{/i}}</a></td><td>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</td><td class="nolink"><a href="#">Action</a></td></tr>
<tr><td><a href="./javascript.html#tabs" class="rowlink">{{_i}}Togglable tabs{{/i}}</a></td><td>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</td><td class="nolink"><a href="#">Action</a></td></tr>
<tr><td><a href="./javascript.html#tooltips" class="rowlink">{{_i}}Tooltips{{/i}}</a></td><td>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images, uss CSS3 for animations, and data-attributes for local title storage.{{/i}}</td><td class="nolink"><a href="#">Action</a></td></tr>
</tbody>
</table>
<hr>
<h2>{{_i}}Using bootstrap-rowlink.js{{/i}}</h2>
<p>{{_i}}Call the input mask via javascript:{{/i}}</p>
<pre class="prettyprint linenums">$('tbody.rowlink').rowlink()</pre>
<h3>{{_i}}Options{{/i}}</h3>
<table class="table table-bordered table-striped">
<thead>
<tr>
<th style="width: 100px;">{{_i}}Name{{/i}}</th>
<th style="width: 50px;">{{_i}}type{{/i}}</th>
<th style="width: 100px;">{{_i}}default{{/i}}</th>
<th>{{_i}}description{{/i}}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{_i}}target{{/i}}</td>
<td>{{_i}}string{{/i}}</td>
<td>'a'</td>
<td>{{_i}}A jquery selector string, to select the link element within each row.{{/i}}</td>
</tr>
</tbody>
</table>
<h3>{{_i}}Markup{{/i}}</h3>
<p>{{_i}}Add <code>data-provides="rowlink"</code> to a <code>&lt;table&gt;</code>, <code>&lt;tbody&gt;</code> or <code>&lt;tr&gt;</code> element. The value should be selector to the link, which is a child of the row. A cell can be excluded by adding the <code>.nolink</code> class to the <code>&lt;td&gt;</code>.{{/i}}</p>
<pre class="prettyprint linenums">
&lt;table data-provides="rowlink"&gt;
&lt;tr&gt;&lt;td&gt;&lt;a href="javascript.html#modals"&gt;Modals&lt;/a&gt;&lt;/td&gt;&lt;td class="nohref"&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;&lt;a href="javascript.html#dropdowns"&gt;Dropdowns&lt;/a&gt;&lt;/td&gt;&lt;td class="nohref"&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
</pre>
<p><span class="label label-info">Tip!</span> {{_i}}Add <code>.rowlink</code> to your <code>&lt;a&gt;</code>. This prevents the link styling during page load.{{/i}}</p>
<h3>{{_i}}Methods{{/i}}</h3>
<h4>.inputmask({{_i}}options{{/i}})</h4>
<p>{{_i}}Initializes an input with an input mask.{{/i}}</p>
</div>
</div>
</section>
<!-- Typeahead
================================================== -->
<section id="typeahead">
@@ -1496,4 +1575,4 @@ $('.carousel').carousel({
<p>{{_i}}Initializes an input with an input mask.{{/i}}</p>
</div>
</div>
</section>
</section>

2
js/bootstrap-rowlink.js vendored
View File

@@ -2,7 +2,7 @@
* bootstrap-rowlink.js j1
* http://jasny.github.com/bootstrap/javascript.html#rowlink
* ============================================================
* Copyright 2011 Jasny BV, Netherlands.
* Copyright 2012 Jasny BV, Netherlands.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.

1
less/jasny/bootstrap.less vendored
View File

@@ -20,6 +20,7 @@
@import "forms-uneditable.less";
@import "forms-editor.less";
@import "actions-areas.less";
@import "rowlink.less";
// Components: Buttons & Alerts
@import "action-links.less";