moar
parent
3f76b3d193
commit
1db314ebb5
|
@ -487,6 +487,9 @@ header.main div.inner form.search div.infield input {
|
||||||
-moz-box-shadow: inset 0 1px 0px #1d4249;
|
-moz-box-shadow: inset 0 1px 0px #1d4249;
|
||||||
box-shadow: inset 0 1px 0px #1d4249;
|
box-shadow: inset 0 1px 0px #1d4249;
|
||||||
}
|
}
|
||||||
|
header.main div.inner form.search div.infield input:focus {
|
||||||
|
border-color: #62D5E1;
|
||||||
|
}
|
||||||
header.main div.inner nav.public {
|
header.main div.inner nav.public {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
@ -726,7 +729,10 @@ article.snipt div.container header h1 {
|
||||||
article.snipt div.container header h1 a {
|
article.snipt div.container header h1 a {
|
||||||
color: #666;
|
color: #666;
|
||||||
display: block;
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
white-space: nowrap;
|
||||||
-webkit-transition: color .08s linear;
|
-webkit-transition: color .08s linear;
|
||||||
-moz-transition: color .08s linear;
|
-moz-transition: color .08s linear;
|
||||||
-o-transition: color .08s linear;
|
-o-transition: color .08s linear;
|
||||||
|
@ -753,7 +759,7 @@ article.snipt div.container section.code {
|
||||||
article.snipt div.container section.code div.highlight pre {
|
article.snipt div.container section.code div.highlight pre {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
font: normal 12px Consolas, Menlo, "Courier New", monospace;
|
font: normal 12px/16px Consolas, Menlo, "Courier New", monospace;
|
||||||
font-weight: normal !important;
|
font-weight: normal !important;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
margin: 0 15px;
|
margin: 0 15px;
|
||||||
|
@ -973,6 +979,8 @@ article.snipt div.expanded section.code a.expand span.lines {
|
||||||
}
|
}
|
||||||
article.snipt.selected div.container {
|
article.snipt.selected div.container {
|
||||||
-webkit-box-shadow: 0 0 20px #85D2DD;
|
-webkit-box-shadow: 0 0 20px #85D2DD;
|
||||||
|
-moz-box-shadow: 0 0 20px #85D2DD;
|
||||||
|
box-shadow: 0 0 20px #85D2DD;
|
||||||
}
|
}
|
||||||
article.snipt.selected div.container:after {
|
article.snipt.selected div.container:after {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
|
@ -963,30 +963,40 @@ jQuery(function($) {
|
||||||
(function(Snipt) {
|
(function(Snipt) {
|
||||||
|
|
||||||
Snipt.SniptModel = Backbone.Model.extend({
|
Snipt.SniptModel = Backbone.Model.extend({
|
||||||
|
url: '',
|
||||||
|
title: ''
|
||||||
});
|
});
|
||||||
SniptView = Backbone.View.extend({
|
SniptView = Backbone.View.extend({
|
||||||
|
|
||||||
initialize: function() {
|
initialize: function() {
|
||||||
this.model = new Snipt.SniptModel();
|
this.$el = $(this.el);
|
||||||
|
this.$h1 = $('header h1 a', this.$el);
|
||||||
|
|
||||||
|
this.model = new Snipt.SniptModel({
|
||||||
|
title: this.$h1.text(),
|
||||||
|
url: this.$h1.attr('href')
|
||||||
|
});
|
||||||
this.model.view = this;
|
this.model.view = this;
|
||||||
|
|
||||||
this.$el = $(this.el);
|
|
||||||
this.$aside = $('aside', this.$el);
|
this.$aside = $('aside', this.$el);
|
||||||
this.$container = $('div.container', this.$el);
|
this.$container = $('div.container', this.$el);
|
||||||
this.$raw = $('div.raw', this.$container);
|
this.$raw = $('div.raw', this.$container);
|
||||||
this.$tags = $('section.tags ul', this.$aside);
|
this.$tags = $('section.tags ul', this.$aside);
|
||||||
},
|
},
|
||||||
events: {
|
events: {
|
||||||
'click a.copy': 'copy',
|
'click a.copy': 'copy',
|
||||||
'click a.expand': 'expand',
|
'click a.expand': 'expand',
|
||||||
'detail': 'detail',
|
'click .container': 'clickSelect',
|
||||||
'next': 'next',
|
'copy': 'copy',
|
||||||
'prev': 'prev',
|
'detail': 'detail',
|
||||||
'select': 'select'
|
'expand': 'expand',
|
||||||
|
'next': 'next',
|
||||||
|
'prev': 'prev',
|
||||||
|
'select': 'select'
|
||||||
},
|
},
|
||||||
expand: function() {
|
|
||||||
this.$container.toggleClass('expanded', 100);
|
clickSelect: function() {
|
||||||
this.$tags.toggleClass('expanded');
|
this.select(true);
|
||||||
return false;
|
|
||||||
},
|
},
|
||||||
copy: function() {
|
copy: function() {
|
||||||
var cmd;
|
var cmd;
|
||||||
|
@ -1000,25 +1010,13 @@ jQuery(function($) {
|
||||||
window.prompt('Text is selected. To copy: press ' + cmd + '+C then <Enter>', this.$raw.text());
|
window.prompt('Text is selected. To copy: press ' + cmd + '+C then <Enter>', this.$raw.text());
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
select: function() {
|
|
||||||
|
|
||||||
$('article.selected', SniptList.$el).removeClass('selected');
|
|
||||||
this.$el.addClass('selected');
|
|
||||||
|
|
||||||
if (SniptList.$snipts.index(this.$el) === 0) {
|
|
||||||
$('html, body').animate({
|
|
||||||
scrollTop: 0
|
|
||||||
}, 0);
|
|
||||||
} else {
|
|
||||||
$('html, body').animate({
|
|
||||||
scrollTop: this.$el.offset().top - 50
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.$selected = this.$el;
|
|
||||||
},
|
|
||||||
detail: function() {
|
detail: function() {
|
||||||
console.log('Going to detail view for ' + this.$el.find('h1').text());
|
window.location = this.model.get('url');
|
||||||
|
},
|
||||||
|
expand: function() {
|
||||||
|
this.$container.toggleClass('expanded', 100);
|
||||||
|
this.$tags.toggleClass('expanded');
|
||||||
|
return false;
|
||||||
},
|
},
|
||||||
next: function() {
|
next: function() {
|
||||||
nextSnipt = this.$el.next('article.snipt');
|
nextSnipt = this.$el.next('article.snipt');
|
||||||
|
@ -1031,6 +1029,25 @@ jQuery(function($) {
|
||||||
if (prevSnipt.length) {
|
if (prevSnipt.length) {
|
||||||
return prevSnipt.trigger('select');
|
return prevSnipt.trigger('select');
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
select: function(fromClick) {
|
||||||
|
|
||||||
|
$('article.selected', SniptList.$el).removeClass('selected');
|
||||||
|
this.$el.addClass('selected');
|
||||||
|
|
||||||
|
if (fromClick !== true) {
|
||||||
|
if (SniptList.$snipts.index(this.$el) === 0) {
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: 0
|
||||||
|
}, 0);
|
||||||
|
} else {
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: this.$el.offset().top - 50
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$selected = this.$el;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
SniptListView = Backbone.View.extend({
|
SniptListView = Backbone.View.extend({
|
||||||
|
@ -1053,31 +1070,46 @@ jQuery(function($) {
|
||||||
$snipts = this.$snipts;
|
$snipts = this.$snipts;
|
||||||
$el = this.$el;
|
$el = this.$el;
|
||||||
|
|
||||||
$(document).bind('keydown', 'j', function(e) {
|
$(document).bind('keydown', 'c', function() {
|
||||||
|
if ($selected) {
|
||||||
|
$selected.trigger('copy');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$(document).bind('keydown', 'e', function() {
|
||||||
|
if ($selected) {
|
||||||
|
if ($selected.hasClass('expandable')) {
|
||||||
|
$selected.trigger('expand');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$(document).bind('keydown', 'esc', function() {
|
||||||
|
if ($selected) {
|
||||||
|
$selected.removeClass('selected');
|
||||||
|
$selected = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$(document).bind('keydown', 'j', function() {
|
||||||
if (!$selected) {
|
if (!$selected) {
|
||||||
$snipts.eq(0).trigger('select');
|
$snipts.eq(0).trigger('select');
|
||||||
} else {
|
} else {
|
||||||
$selected.trigger('next');
|
$selected.trigger('next');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$(document).bind('keydown', 'k', function(e) {
|
$(document).bind('keydown', 'k', function() {
|
||||||
if (!$selected) {
|
if (!$selected) {
|
||||||
$snipts.eq(0).trigger('select');
|
$snipts.eq(0).trigger('select');
|
||||||
} else {
|
} else {
|
||||||
$selected.trigger('prev');
|
$selected.trigger('prev');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$(document).bind('keydown', 'return', function(e) {
|
$(document).bind('keydown', 'o', function(e) {
|
||||||
if (!$selected) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
$selected.trigger('detail');
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
$(document).bind('keydown', 'esc', function(e) {
|
|
||||||
if ($selected) {
|
if ($selected) {
|
||||||
$selected.removeClass('selected');
|
$selected.trigger('detail');
|
||||||
$selected = false;
|
}
|
||||||
|
});
|
||||||
|
$(document).bind('keydown', 'return', function(e) {
|
||||||
|
if ($selected) {
|
||||||
|
$selected.trigger('detail');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -83,6 +83,9 @@ header.main div.inner form.search div.infield input {
|
||||||
-moz-box-shadow: inset 0 1px 0px #1d4249;
|
-moz-box-shadow: inset 0 1px 0px #1d4249;
|
||||||
box-shadow: inset 0 1px 0px #1d4249;
|
box-shadow: inset 0 1px 0px #1d4249;
|
||||||
}
|
}
|
||||||
|
header.main div.inner form.search div.infield input:focus {
|
||||||
|
border-color: #62D5E1;
|
||||||
|
}
|
||||||
header.main div.inner nav.public {
|
header.main div.inner nav.public {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
@ -322,7 +325,10 @@ article.snipt div.container header h1 {
|
||||||
article.snipt div.container header h1 a {
|
article.snipt div.container header h1 a {
|
||||||
color: #666;
|
color: #666;
|
||||||
display: block;
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
white-space: nowrap;
|
||||||
-webkit-transition: color .08s linear;
|
-webkit-transition: color .08s linear;
|
||||||
-moz-transition: color .08s linear;
|
-moz-transition: color .08s linear;
|
||||||
-o-transition: color .08s linear;
|
-o-transition: color .08s linear;
|
||||||
|
@ -349,7 +355,7 @@ article.snipt div.container section.code {
|
||||||
article.snipt div.container section.code div.highlight pre {
|
article.snipt div.container section.code div.highlight pre {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
font: normal 12px Consolas, Menlo, "Courier New", monospace;
|
font: normal 12px/16px Consolas, Menlo, "Courier New", monospace;
|
||||||
font-weight: normal !important;
|
font-weight: normal !important;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
margin: 0 15px;
|
margin: 0 15px;
|
||||||
|
@ -569,6 +575,8 @@ article.snipt div.expanded section.code a.expand span.lines {
|
||||||
}
|
}
|
||||||
article.snipt.selected div.container {
|
article.snipt.selected div.container {
|
||||||
-webkit-box-shadow: 0 0 20px #85D2DD;
|
-webkit-box-shadow: 0 0 20px #85D2DD;
|
||||||
|
-moz-box-shadow: 0 0 20px #85D2DD;
|
||||||
|
box-shadow: 0 0 20px #85D2DD;
|
||||||
}
|
}
|
||||||
article.snipt.selected div.container:after {
|
article.snipt.selected div.container:after {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
Loading…
Reference in New Issue