From 8b847dc2fb6a11f1eb57881c22937e9ec0f0685c Mon Sep 17 00:00:00 2001 From: Nick Sergeant Date: Wed, 25 Jan 2012 19:40:07 -0500 Subject: [PATCH] Go --- snipt/media/cache/snipt.css | 27 +++++++++ snipt/media/cache/snipt.js | 113 ++++++++++++++++++++++++------------ snipt/media/css/style.css | 27 +++++++++ 3 files changed, 131 insertions(+), 36 deletions(-) diff --git a/snipt/media/cache/snipt.css b/snipt/media/cache/snipt.css index 1000586..465ccdf 100644 --- a/snipt/media/cache/snipt.css +++ b/snipt/media/cache/snipt.css @@ -344,6 +344,7 @@ section.main aside.main nav.footer ul { } section.main aside.main nav.footer ul li { background: transparent url('https://snipt.s3.amazonaws.com/images/api-icon.png') center left no-repeat; + list-style-type: none; margin: 6px 0 6px 0; padding-left: 22px; } @@ -685,6 +686,11 @@ article.snipt.selected div.container { article.snipt.selected div.container:after { display: none; } +article.snipt div.copy-modal textarea { + height: 200px; + margin: 0; + width: 520px; +} article.private-snipt div.container header { background: #fffdf9 url('https://snipt.s3.amazonaws.com/images/private-icon.png') top right no-repeat; background: url('https://snipt.s3.amazonaws.com/images/private-icon.png') top right no-repeat, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fffaf2)); @@ -704,6 +710,27 @@ div.pagination ul { div.pagination ul li a { color: #3BAAF3; } +div.modal .modal-header .close { + line-height: 20px; + margin-top: 0; +} +div.modal .modal-header h3 span { + display: inline-block; + max-width: 400px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +div.modal .modal-header h4 { + color: #AAA; + margin-top: 1px; +} +div#keyboard-shortcuts { + max-height: 501px; +} +div#keyboard-shortcuts table { + margin-bottom: 0; +} body.detail div.right-y { display: none; } diff --git a/snipt/media/cache/snipt.js b/snipt/media/cache/snipt.js index 56619c7..15067c3 100644 --- a/snipt/media/cache/snipt.js +++ b/snipt/media/cache/snipt.js @@ -921,7 +921,7 @@ var snipt = { jQuery(function($) { var SiteView = snipt.module('site').Views.SiteView; - var Site = new SiteView(); + window.site = new SiteView(); }); @@ -937,6 +937,7 @@ jQuery(function($) { this.$el = $(this.el); this.$search_query = $('input#search-query', this.$el); this.$snipts = $('section#snipts article.snipt', this.$el); + this.$copyModals = $('div.copy-modal', this.$snipts); this.keyboardShortcuts(); this.inFieldLabels(); @@ -971,21 +972,20 @@ jQuery(function($) { $search_query = this.$search_query; $document = $(document); - // Search $document.bind('keydown', '/', function(e) { e.preventDefault(); $search_query.focus(); }); - $document.bind('keydown', 'Shift+/', function(e) { $el.trigger('showKeyboardShortcuts'); }); - - // Escape $('input').bind('keydown', 'esc', function(e) { e.preventDefault(); this.blur(); }); + $document.bind('keydown', 'Shift+h', function(e) { + history.go(-1); + }); }, showKeyboardShortcuts: function() { $('#keyboard-shortcuts').modal('toggle'); @@ -1022,37 +1022,68 @@ jQuery(function($) { this.$aside = $('aside', this.$el); this.$container = $('div.container', this.$el); - this.$raw = $('div.raw', this.$container); + this.$copyModal = $('div.copy-modal', this.$el); + this.$copyModalBody = $('div.modal-body', this.$copyModal); + this.$copyModalClose = $('a.close', this.$copyModal); + this.$copyModalType = $('h4 span', this.$copyModal); + this.$raw = $('div.raw', this.$el); this.$tags = $('section.tags ul', this.$aside); + + this.$copyModal.on('hidden', function(e) { + $(this).parent().trigger('copyClose'); + }); + this.$copyModalClose.click(function() { + $(this).parent().parent().modal('hide'); + return false; + }); }, events: { - 'click a.copy': 'copy', + 'click a.copy': 'copyFromClick', + 'click a.embed': 'embed', 'click a.expand': 'expand', 'click .container': 'selectFromClick', 'copy': 'copy', + 'copyClose': 'copyClose', 'detail': 'detail', 'deselect': 'deselect', + 'embed': 'embed', 'expand': 'expand', 'next': 'next', 'prev': 'prev', - 'select': 'select' + 'selectSnipt': 'select' }, copy: function() { - var cmd; - if (navigator.platform == 'MacPPC' || - navigator.platform == 'MacIntel') { - cmd = 'Cmd'; + if (!this.$copyModal.is(':visible')) { + var cmd; + if (navigator.platform == 'MacPPC' || + navigator.platform == 'MacIntel') { + cmd = 'Cmd'; + } + else { + cmd = 'Ctrl'; + } + + this.$copyModalBody.append(''); + $textarea = $('textarea.raw', this.$copyModalBody).val(this.$raw.text()); + + this.$copyModalType.text(cmd); + this.$copyModal.modal('show'); + $textarea.select(); } - else { - cmd = 'Ctrl'; - } - window.prompt('Text is selected. To copy: press ' + cmd + '+C then ', this.$raw.text()); + }, + copyClose: function() { + $('textarea', this.$copyModal).remove(); + }, + copyFromClick: function() { + this.copy(); return false; }, deselect: function() { - this.$el.removeClass('selected'); - window.$selected = false; + if (!this.$copyModal.is(':visible')) { + this.$el.removeClass('selected'); + window.$selected = false; + } }, detail: function() { window.location = this.model.get('url'); @@ -1061,18 +1092,22 @@ jQuery(function($) { this.$container.toggleClass('expanded', 100); this.$tags.toggleClass('expanded'); this.select(); - return false; + }, + embed: function() { + alert('TODO'); }, next: function() { + window.site.$copyModals.modal('hide'); nextSnipt = this.$el.next('article.snipt'); if (nextSnipt.length) { - return nextSnipt.trigger('select'); + return nextSnipt.trigger('selectSnipt'); } }, prev: function() { + window.site.$copyModals.modal('hide'); prevSnipt = this.$el.prev('article.snipt'); if (prevSnipt.length) { - return prevSnipt.trigger('select'); + return prevSnipt.trigger('selectSnipt'); } }, select: function(fromClick) { @@ -1117,8 +1152,23 @@ jQuery(function($) { $selected = window.selected; $document = $(document); - $document.bind('keydown', 'c', function() { + $document.bind('keydown', 'j', function() { + if (!$selected) { + SniptList.$snipts.eq(0).trigger('selectSnipt'); + } else { + $selected.trigger('next'); + } + }); + $document.bind('keydown', 'k', function() { + if (!$selected) { + SniptList.$snipts.eq(0).trigger('selectSnipt'); + } else { + $selected.trigger('prev'); + } + }); + $document.bind('keydown', 'c', function(e) { if ($selected) { + e.preventDefault(); $selected.trigger('copy'); } }); @@ -1149,20 +1199,6 @@ jQuery(function($) { $document.bind('keydown', 'h', function() { window.location = '/'; }); - $document.bind('keydown', 'j', function() { - if (!$selected) { - SniptList.$snipts.eq(0).trigger('select'); - } else { - $selected.trigger('next'); - } - }); - $document.bind('keydown', 'k', function() { - if (!$selected) { - SniptList.$snipts.eq(0).trigger('select'); - } else { - $selected.trigger('prev'); - } - }); $document.bind('keydown', 'n', function() { var $anc = $('li.next a'); if ($anc.length) { @@ -1184,6 +1220,11 @@ jQuery(function($) { } } }); + $document.bind('keydown', 'v', function() { + if ($selected) { + $selected.trigger('embed'); + } + }); $document.bind('keydown', 'return', function() { if ($selected) { $selected.trigger('detail'); diff --git a/snipt/media/css/style.css b/snipt/media/css/style.css index 8d4be93..9c68629 100644 --- a/snipt/media/css/style.css +++ b/snipt/media/css/style.css @@ -296,6 +296,7 @@ section.main aside.main nav.footer ul { } section.main aside.main nav.footer ul li { background: transparent url('https://snipt.s3.amazonaws.com/images/api-icon.png') center left no-repeat; + list-style-type: none; margin: 6px 0 6px 0; padding-left: 22px; } @@ -637,6 +638,11 @@ article.snipt.selected div.container { article.snipt.selected div.container:after { display: none; } +article.snipt div.copy-modal textarea { + height: 200px; + margin: 0; + width: 520px; +} article.private-snipt div.container header { background: #fffdf9 url('https://snipt.s3.amazonaws.com/images/private-icon.png') top right no-repeat; background: url('https://snipt.s3.amazonaws.com/images/private-icon.png') top right no-repeat, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fffaf2)); @@ -656,6 +662,27 @@ div.pagination ul { div.pagination ul li a { color: #3BAAF3; } +div.modal .modal-header .close { + line-height: 20px; + margin-top: 0; +} +div.modal .modal-header h3 span { + display: inline-block; + max-width: 400px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +div.modal .modal-header h4 { + color: #AAA; + margin-top: 1px; +} +div#keyboard-shortcuts { + max-height: 501px; +} +div#keyboard-shortcuts table { + margin-bottom: 0; +} body.detail div.right-y { display: none; }