Mercurial > zeropaste
changeset 125:64f73525503b
Use button toolbar instead of nav.
author | Edho Arief <edho@myconan.net> |
---|---|
date | Mon, 12 Nov 2012 16:22:03 +0700 |
parents | 4a8cefa814f1 |
children | bf214f66874d |
files | app/assets/javascripts/application.js app/assets/javascripts/init.tabs.js app/views/pastes/show.html.erb |
diffstat | 3 files changed, 26 insertions(+), 24 deletions(-) [+] |
line wrap: on
line diff
--- a/app/assets/javascripts/application.js Mon Nov 12 15:33:11 2012 +0700 +++ b/app/assets/javascripts/application.js Mon Nov 12 16:22:03 2012 +0700 @@ -13,6 +13,7 @@ //= require jquery //= require jquery_ujs //= require twitter/bootstrap/tab +//= require twitter/bootstrap/button //= require twitter/bootstrap/dropdown //= require prettify //= require marked
--- a/app/assets/javascripts/init.tabs.js Mon Nov 12 15:33:11 2012 +0700 +++ b/app/assets/javascripts/init.tabs.js Mon Nov 12 16:22:03 2012 +0700 @@ -1,5 +1,5 @@ $(document).ready(function() { - if ($('#paste-tabs').length == 1) { + if ($('#paste-show').length == 1) { raw = $('#plain pre').text(); marked.setOptions({ @@ -31,7 +31,7 @@ paste_resize = function(size) { var paste = $('#paste'), - title = $('#tab-resize a.btn'); + title = $('#paste-resize a.btn'); title.html(title.html().replace(/(auto|\d+px)/, size)); if (size == 'auto') { paste.css('width', ''); @@ -43,11 +43,11 @@ update_state(); } - $('#paste-tabs > li > a').click(function() { + $('#paste-mode a').click(function() { $('#paste').data('mode', $(this).prop('href').split('#')[1]); update_state(); }); - $('#tab-resize ul a').click(function() { + $('#paste-resize ul a').click(function() { paste_resize($(this).data('size')); $('.open').removeClass('open'); return false;
--- a/app/views/pastes/show.html.erb Mon Nov 12 15:33:11 2012 +0700 +++ b/app/views/pastes/show.html.erb Mon Nov 12 16:22:03 2012 +0700 @@ -4,26 +4,27 @@ <h1><%= content_for :title %></h1> </div> -<div class="tabbable"> - <ul id="paste-tabs" class="nav nav-tabs"> - <li class="active"><%= link_to 'Plain', '#plain', :data => { :toggle => 'tab' } %></li> - <li><%= link_to 'Highlight', '#highlight', :data => { :toggle => 'tab' } %></li> - <li><%= link_to 'Markdown', '#markdown', :data => { :toggle => 'tab' } %></li> - <li class="pull-right"> - <div class="btn-group" id="tab-resize"> - <a class="btn btn-inverse dropdown-toggle" data-toggle="dropdown" href="#"> - Width: auto - <span class="caret"></span> - </a> - <ul class="dropdown-menu"> - <li><a href="#" data-size="auto">auto</a></li> - <li><a href="#" data-size="560px">560px</a></li> - <li><a href="#" data-size="760px">760px</a></li> - <li><a href="#" data-size="960px">960px</a></li> - </ul> - </div> - </li> - </ul> + +<div id="paste-show" class="tabbable"> + <div class="btn-toolbar"> + <div id="paste-mode" class="btn-group" data-toggle="buttons-radio"> + <%= link_to 'Plain', '#plain', :data => { :toggle => 'tab' }, :class => 'btn active' %> + <%= link_to 'Highlight', '#highlight', :data => { :toggle => 'tab' }, :class => 'btn' %> + <%= link_to 'Markdown', '#markdown', :data => { :toggle => 'tab' }, :class => 'btn' %> + </div> + <div class="btn-group" id="paste-resize"> + <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> + Width: auto + <span class="caret"></span> + </a> + <ul class="dropdown-menu"> + <li><a href="#" data-size="auto">auto</a></li> + <li><a href="#" data-size="560px">560px</a></li> + <li><a href="#" data-size="760px">760px</a></li> + <li><a href="#" data-size="960px">960px</a></li> + </ul> + </div> + </div> <div id="paste" data-mode="plain" data-width="auto" class="tab-content"> <div class="tab-pane active" id="plain"> <pre><%= @paste.paste %></pre>