Working on test.

master
Nick Sergeant 2012-02-18 14:42:30 -05:00
parent 35c093835e
commit 5f2c4807c3
6 changed files with 151 additions and 46 deletions

View File

@ -8,10 +8,6 @@
initialize: function(opts) {
_.templateSettings = {
interpolate : /\{\{(.+?)\}\}/g
};
this.$el = $(this.el);
this.$search_form = $('form.search', this.$el);
this.$search_query = $('input#search-query', this.$el);

View File

@ -15,20 +15,7 @@
this.template = _.template($('#snipt').html());
this.editTemplate = _.template($('#edit').html());
this.$el = $(this.el);
this.$aside = $('aside', this.$el);
this.$container = $('div.container', this.$el);
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.$h1 = $('header h1 a', this.$el);
this.$raw = $('div.raw', this.$el);
this.$tags = $('section.tags ul', this.$aside);
this.$copyModal.on('hidden', function(e) {
$(this).parent().trigger('copyClose');
});
this.initLocalVars();
},
events: {
'click a.copy': 'copyFromClick',
@ -45,8 +32,7 @@
'expand': 'expand',
'next': 'next',
'prev': 'prev',
'selectSnipt': 'select',
'test': 'test'
'selectSnipt': 'select'
},
copy: function() {
@ -69,6 +55,7 @@
}
},
copyClose: function() {
console.log('copyClose called');
$('textarea', this.$copyModal).remove();
},
copyFromClick: function() {
@ -82,7 +69,7 @@
}
},
detail: function() {
window.location = this.model.get('absolute_url');
window.location = this.model.get('get_absolute_url');
},
edit: function() {
if (!$('section.main-edit:visible').length) {
@ -103,6 +90,22 @@
this.select();
return false;
},
initLocalVars: function() {
this.$el = $(this.el);
this.$aside = $('aside', this.$el);
this.$container = $('div.container', this.$el);
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.$h1 = $('header h1 a', this.$el);
this.$raw = $('div.raw', this.$el);
this.$tags = $('section.tags ul', this.$aside);
this.$copyModal.on('hidden', function(e) {
$(this).parent().trigger('copyClose');
});
},
next: function() {
window.site.$copyModals.modal('hide');
nextSnipt = this.$el.next('article.snipt');
@ -121,7 +124,33 @@
console.log('SniptView.remove() called');
},
render: function() {
this.$el.html(this.template(this.model.toJSON()));
this.$el.html(this.template({
snipt: this.model.toJSON()
}));
this.initLocalVars();
if (this.model.get('pub') === true) {
this.$el.removeClass('private-snipt');
} else {
this.$el.addClass('private-snipt');
}
if (this.model.get('user').username === window.user) {
this.$el.addClass('editable');
} else {
this.$el.removeClass('editable');
}
if (this.model.get('line_count') > 8 && !window.detail) {
this.$el.addClass('expandable');
} else {
this.$el.removeClass('expandable');
}
$('script#disqus').remove();
$('body').append('<script id="disqus" type="text/javascript">' + $('script#disqus-template').text() + '</script>');
return this;
},
select: function(fromClick) {
@ -144,9 +173,6 @@
selectFromClick: function(e) {
this.select(true);
e.stopPropagation();
},
test: function() {
this.render();
}
});
SniptListView = Backbone.View.extend({
@ -164,8 +190,10 @@
addExistingSnipt: function() {
var $el = $(this);
var $created = $('li.created', $el);
var $h1 = $('header h1 a', $el);
var $pub = $('div.public', $el);
var $user = $('li.author a', $el);
var is_public = $pub.text() === 'True' ? true : false;
var tag_lis = $('section.tags li', $el);
var tags = [];
@ -179,13 +207,15 @@
}
var data = {
absolute_url: $h1.attr('href'),
code: $('div.raw', $el).text(),
created: $('li.created', $el).attr('title'),
created: $created.attr('title'),
created_formatted: $created.text(),
embed_url: $('div.embed-url', $el).text(),
id: parseInt($el.attr('id').replace('snipt-', ''), 0),
get_absolute_url: $h1.attr('href'),
pk: parseInt($el.attr('id').replace('snipt-', ''), 0),
key: $('div.key', $el).text(),
lexer: $('div.lexer', $el).text(),
lexer_name: $('div.lexer-name', $el).text(),
line_count: parseInt($('div.line-count', $el).text(), 0),
modified: $('div.modified', $el).text(),
pub: is_public,
@ -195,7 +225,10 @@
tags: tags,
tags_list: $('div.tags-list', $el).text(),
title: $h1.text(),
user: $('div.user', $el).text()
user: {
get_absolute_url: $user.attr('href'),
username: $user.text()
}
};
var view = new SniptView({
@ -208,11 +241,6 @@
$selected = window.selected;
$document = $(document);
$document.bind('keydown', 'Shift+t', function() {
if ($selected) {
$selected.trigger('test');
}
});
$document.bind('keydown', 'j', function() {
if (!$selected) {
SniptList.$snipts.eq(0).trigger('selectSnipt');

View File

@ -3,6 +3,11 @@
{% block page-title %}/ {{ snipt.title }} / {{ user.username }} - {{ block.super }}{% endblock %}
{% block body-class %}detail{% endblock %}
{% block js %}
{{ block.super }}
window.detail = true;
{% endblock %}
{% block breadcrumb %}
<li><a href="/{{ user.username }}/">{{ user.username }}</a></li>
<li>/ <a href="{{ snipt.get_absolute_url }}">{{ snipt.title }}</a></li>

View File

@ -4,6 +4,11 @@
{% block page-title %}/ {% if public %}public{% else %}{{ user.username }}{% endif %}{% if tag %} / {{ tag }}{% endif %} - {{ block.super }}{% endblock %}
{% block js %}
{{ block.super }}
window.detail = false;
{% endblock %}
{% block content %}
<section class="snipts" id="snipts">
{% autopaginate snipts 20 %}
@ -12,7 +17,20 @@
{% endfor %}
{% paginate %}
</section>
<script type="text/javascript">
<script type="text/javascript" id="disqus">
var disqus_shortname = 'snipt-net';
{% if debug %}
var disqus_developer = 1;
{% endif %}
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
<script type="text/html" id="disqus-template">
var disqus_shortname = 'snipt-net';
{% if debug %}
var disqus_developer = 1;

View File

@ -79,6 +79,7 @@
<div class="hide embed-url">{{ snipt.get_embed_url }}</div>
<div class="hide key">{{ snipt.key }}</div>
<div class="hide lexer">{{ snipt.lexer }}</div>
<div class="hide lexer-name">{{ snipt.lexer_name }}</div>
<div class="hide line-count">{{ snipt.line_count }}</div>
<div class="hide modified">{{ snipt.modified|date:"Y-m-d\TH:i:s" }}</div>
<div class="hide public">{{ snipt.public }}</div>
@ -90,5 +91,4 @@
<div class="hide slug">{{ snipt.slug }}</div>
<div class="hide stylized">{{ snipt.stylized }}</div>
<div class="hide tags-list">{{ snipt.tags_list }}</div>
<div class="hide user">{{ snipt.user.username }}</div>
</article>

View File

@ -27,7 +27,9 @@
{% else %}
<link rel="stylesheet" href="{{ STATIC_URL }}cache/snipt.css" />
<script type="text/javascript" src="{{ STATIC_URL }}cache/snipt.js"></script>
{% endif %}{% block js %}{% endblock %}
{% endif %}<script type="text/javascript">{% block js %}window.user = '{{ request.user.username }}';
window.pub = {{ public|lower }};{% endblock %} </script>
<!--[if IE]>
<style type="text/css">
.group {
@ -232,27 +234,83 @@
{% if snipts or snipt %}
{% verbatim %}
<div class="hidden" id="templates">
<div id="snipt">
<div class="number">#0</div>
<script id="snipt" type="text/html">
<div class="number">#<%= snipt.pk %></div>
<div class="group">
<div class="container">
<header>
<h2></h2>
<h1><a href="{{absolute_url}}">{{title}}</a></h1>
<h2><%= snipt.lexer_name %></h2>
<h1><a href="<%= snipt.get_absolute_url %>"><%= snipt.title %></a></h1>
</header>
<section class="code autumn">
<%= snipt.stylized %>
<% if (snipt.line_count > 8 && !window.detail) { %>
<a href="#" class="expand">
<span class="expand">Expand</span>
<span class="collapse">Collapse</span>
<span class="lines">(<%= snipt.line_count %> lines)</span>
</a>
<% } %>
<div class="raw"><%= snipt.code %></div>
</section>
<div class="ruler top-x"></div>
<div class="ruler bottom-x"></div>
</div>
<aside>
<ul class="options">
<% if (snipt.user.username === window.user) { %>
<li>
<a class="edit" href="#">Edit</a>
</li>
<% } %>
<li>
<a class="embed" href="#">Embed</a>
</li>
<li>
<a class="copy" href="#"><span class="do">Copy</span></a>
</li>
</ul>
<section class="tags">
<h2><%= snipt.tags.length %> tag<% if ((snipt.tags.length > 1) || (snipt.tags.length === 0)) { print('s'); } %></h2>
<ul>
<% for (var i=0; i < snipt.tags.length; i++) { %>
<li <% if (i > 2 && !window.detail) { %>class="hidden"<% } %>>
<a href="<%= snipt.tags[i].absolute_url %>"><%= snipt.tags[i].name %></a>
</li>
<% } %>
</ul>
</section>
</aside>
</div>
</div>
<div id="edit">
<footer>
<ul class="attrs">
<li class="author"><a href="<%= snipt.user.get_absolute_url %>"><%= snipt.user.username %></a></li>
<li class="created" title="<%= snipt.created %>"><%= snipt.created_formatted %></li>
<li class="comments"><a href="<%= snipt.get_absolute_url %>#disqus_thread" data-disqus-identifier="<%= snipt.pk %>"></a></li>
</ul>
</footer>
<div class="modal hide copy-modal">
<div class="modal-header">
<a href="#" class="close">×</a>
<h3>Copy snipt <span>&ldquo;<%= snipt.title %>&rdquo;</span></h3>
<h4>(Text is selected. <span></span>+c to copy.)</h4>
</div>
<div class="modal-body"></div>
</div>
<div class="modal hide embed-modal">
<div class="modal-header">
<a href="#" class="close">×</a>
<h3>Embed snipt <span>&ldquo;<%= snipt.title %>&rdquo;</span></h3>
</div>
<div class="modal-body">
<textarea><script type="text/javascript"><%= snipt.get_embed_url %></script></textarea>
</div>
</div>
</script>
<script id="edit" type="text/html">
<div class="inner">
{{absolute_url}}<br />
{{title}}
</div>
</div>
</script>
</div>
{% endverbatim %}
{% endif %}