# HG changeset patch # User Edho Arief # Date 1368294218 -32400 # Node ID 22c4b5f90e24c97ba593d22de9491c549aa54e9e # Parent 0993715b455d615986d6a77ad06bfa16412c4429 Massive javascript and html refactor. Also, ie9 diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/application.js --- a/app/assets/javascripts/application.js Sun May 12 02:42:43 2013 +0900 +++ b/app/assets/javascripts/application.js Sun May 12 02:43:38 2013 +0900 @@ -15,8 +15,4 @@ //= require twitter/bootstrap/tab //= require twitter/bootstrap/button //= require twitter/bootstrap/dropdown -//= require prettify -//= require marked -//= require init.marked -//= require jquery.autosize -//= require_tree . +//= require boot diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/boot.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/boot.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,10 @@ +//= require zp.init +//= require zp.formatter +//= require zp.viewer_width +//= require zp.hash_magic +//= require zp.new +$(document).ready(function() { + zp.formatter.init() + zp.viewer_width.init() + zp.new.init() +}) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/config/marked.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/config/marked.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,6 @@ +//= require marked +marked.setOptions({ + gfm: true, + pedantic: true, + sanitize: true +}) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/config/prettify.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/config/prettify.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,1 @@ +//= require prettify diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/init.marked.js --- a/app/assets/javascripts/init.marked.js Sun May 12 02:42:43 2013 +0900 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,5 +0,0 @@ -marked.setOptions({ - gfm: true, - pedantic: true, - sanitize: true -}); diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/init.tabs.js --- a/app/assets/javascripts/init.tabs.js Sun May 12 02:42:43 2013 +0900 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,80 +0,0 @@ -$(document).ready(function() { - if ($('#paste-show').length !== 1) { - return; - } - var update_state = function() { - var paste = $('#paste'), - mode = paste.data('mode'), - width = paste.data('width'), - short_mode = function(mode) { - if (mode == 'highlight') { - return 'hl' - } else if (mode =='markdown') { - return 'md' - } else { - return 'plain' - } - }, - qstring = '#!' + short_mode(mode) + '.' + width; - if (width == 'auto') { - if (mode == 'plain') { - qstring = ' '; - } else { - qstring = '#!' + short_mode(mode); - } - } - if (history.replaceState) { - history.replaceState(null, '', qstring); - } else { - window.location = qstring; - } - return false; - }, - paste_resize = function(size) { - var paste = $('#paste'), - title = $('#paste-resize a.btn'); - title.html(title.html().replace(/(auto|\d+px)/, size)); - if (size == 'auto') { - paste.css('width', ''); - paste.data('width', size); - } else { - paste.css('width', size); - paste.data('width', size); - } - update_state(); - }, - paste_resize_menu_handler = function() { - paste_resize($(this).data('size')); - $('.open').removeClass('open'); - return false; - }, - paste_mode_state_handler = function() { - $('#paste').data('mode', $(this).prop('href').split('#')[1]); - update_state(); - }, - init_state = function() { - mode = window.location.hash.substr(2).split('.'); - if (mode[0] == 'hl' || mode[0] == 'highlight') { $('#paste-mode a:eq(1)').click(); } - else if (mode[0] == 'md' || mode[0] == 'markdown') { $('#paste-mode a:eq(2)').click(); }; - if (mode[1] && mode[1].match(/^\d+px$/)) { paste_resize(mode[1]); } - }, - init_tabs_base = function() { - var raw = $('#plain pre').text(), - markdown = $('#markdown div'); - markdown.html(marked(raw)); - $('#highlight pre').text(raw); - - markdown.find('pre').addClass('prettyprint'); - markdown.find('a').prop('rel', 'nofollow'); - prettyPrint(); - }, - init_tabs_menu = function() { - $('#paste-mode a').click(paste_mode_state_handler); - $('#paste-resize ul a').click(paste_resize_menu_handler); - }; - - init_tabs_base(); - init_tabs_menu(); - init_state(); - update_state(); -}); diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/pastes.js --- a/app/assets/javascripts/pastes.js Sun May 12 02:42:43 2013 +0900 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,13 +0,0 @@ -// Place all the behaviors and hooks related to the matching controller here. -// All this logic will automatically be available in application.js. - -$(document).on('click', '#reset_paste', function() { - $('#paste_paste').val(''); - $('#paste_paste').focus(); - return false; -}); -$(document).ready(function() { - $('#paste_paste').autosize({ className: 'mirrored_text row-fluid', append: "\n"}); - $.autosize_box_fix($('.mirrored_text')); - $('#paste_paste').focus(); -}) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/zp.formatter.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/zp.formatter.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,23 @@ +//= require config/marked +//= require config/prettify +(function($) { + window.zp.formatter = { + raw: function() { return $("#pl pre").text() }, + links: function() { return $("#paste-mode a") }, + current: function() { return this.links().filter(".active").attr("href").slice(1) }, + markdown: function() { + var area = $("#md div") + area.html(marked(this.raw())) + area.find("pre").addClass("prettyprint") + area.find("a").prop("rel", "nofollow") + }, + highlight: function() { + $("#hl pre").text(this.raw()) + prettyPrint() + }, + init: function() { + this.markdown() + this.highlight() + } + } +})(jQuery) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/zp.hash_magic.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/zp.hash_magic.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,35 @@ +//= require zp.formatter +//= require zp.viewer_width +(function($) { + window.zp.hash_magic = { + load_hash: function() { + var hash_array = window.location.hash.slice(2).split(".") + format = hash_array[0] + width = hash_array[1] + if (format !== undefined) { + zp.formatter.links().filter("[href=#" + format + "]").click() + } + if (width !== undefined) { + zp.viewer_width.resize(width) + } + }, + set_hash: function(e) { + var + format = zp.formatter.current(), + width = zp.viewer_width.current, + hash = "#!" + hash += format + if (width !== "auto") { hash += "." + width } + if (hash === "#!pl") { hash = " " } + history.replaceState(null, "", hash) + if (e !== undefined) { e.preventDefault() } + }, + init: function() { + this.load_hash() + if (history.replaceState) { + this.set_hash() + $(document).on('click', $.proxy(this.set_hash, this)) + } + } + } +})(jQuery) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/zp.init.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/zp.init.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,1 @@ +window.zp = {} diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/zp.new.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/zp.new.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,19 @@ +//= jquery.autosize +//= require autosize-box-fix +(function($) { + window.zp.new = { + input: function() { return $("#paste_paste") }, + clear: function(e) { + this.input().val("").focus() + e.preventDefault() + }, + init: function() { + if (this.input() == "undefined") { return } + console.log("wheee~") + $(document).on('click', "#reset_paste", $.proxy(this.clear, this)) + this.input().autosize({ className: 'mirrored_text row-fluid', append: "\n"}); + $.autosize_box_fix($(".mirrored_text")) + this.input().focus() + } + } +})(jQuery) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/javascripts/zp.viewer_width.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/app/assets/javascripts/zp.viewer_width.js Sun May 12 02:43:38 2013 +0900 @@ -0,0 +1,25 @@ +(function($) { + window.zp.viewer_width = { + links: function() { return $("#paste-resize ul li a") }, + current: "auto", + resize: function(width) { + var + paste = $("#paste"), + title = $("#paste-resize .btn") + title.text(title.data("base").replace(":size:", width)) + this.current = width + if (width == "auto") { + paste.css("width", "") + } else { + paste.css("width", width) + } + zp.hash_magic.set_hash() + }, + do_switch: function(e) { + this.resize($(e.target).text()) + }, + init: function() { + this.links().click($.proxy(this.do_switch, this)) + } + } +})(jQuery) diff -r 0993715b455d -r 22c4b5f90e24 app/assets/stylesheets/tabs.scss --- a/app/assets/stylesheets/tabs.scss Sun May 12 02:42:43 2013 +0900 +++ b/app/assets/stylesheets/tabs.scss Sun May 12 02:43:38 2013 +0900 @@ -1,4 +1,4 @@ -#markdown { +#md { // copypasta from bootstrap's variables.scss $baseFontSize_orig: 14px; $baseLineHeight_orig: 20px; diff -r 0993715b455d -r 22c4b5f90e24 app/views/pastes/show.html.erb --- a/app/views/pastes/show.html.erb Sun May 12 02:42:43 2013 +0900 +++ b/app/views/pastes/show.html.erb Sun May 12 02:43:38 2013 +0900 @@ -13,31 +13,31 @@
- <%= 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' %> + <%= link_to 'Plain', '#pl', :data => { :toggle => 'tab' }, :class => 'btn active' %> + <%= link_to 'Highlight', '#hl', :data => { :toggle => 'tab' }, :class => 'btn' %> + <%= link_to 'Markdown', '#md', :data => { :toggle => 'tab' }, :class => 'btn' %>
-
-
+
+ 
<%= @paste.paste %>
-
+ 

     

-    

+