marrub
/
snipt
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Working on edit.

master
Nick Sergeant 2012-02-15 23:06:11 -05:00
parent b7a628165a
commit 99232cbf5f
4 changed files with 63 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
snipt/media/css/style.scss
View File

@ -408,6 +408,12 @@ section.main {
} }
} }
} }
section.main-edit {
div.inner {
float: none;
width: 100%;
}
}
article.snipt { article.snipt {
margin: 30px 0; margin: 30px 0;
position: relative; position: relative;
@ -808,7 +814,8 @@ div.modal {
} }
} }
div#keyboard-shortcuts { div#keyboard-shortcuts {
max-height: 590px; max-height: 617px;
top: 43%;
table { table {
margin-bottom: 0; margin-bottom: 0;

35
snipt/media/js/src/modules/snipt.js
View File

@ -11,7 +11,9 @@
this.model.view = this; this.model.view = this;
this.model.bind('change', this.render, this); this.model.bind('change', this.render, this);
this.model.bind('destroy', this.remove, this); this.model.bind('destroy', this.remove, this);
this.template = _.template($('#snipt-template').html());
this.template = _.template($('#snipt').html());
this.editTemplate = _.template($('#edit').html());
this.$el = $(this.el); this.$el = $(this.el);
this.$aside = $('aside', this.$el); this.$aside = $('aside', this.$el);
@ -30,6 +32,7 @@
}, },
events: { events: {
'click a.copy': 'copyFromClick', 'click a.copy': 'copyFromClick',
'click a.edit': 'edit',
'click a.embed': 'embed', 'click a.embed': 'embed',
'click a.expand': 'expand', 'click a.expand': 'expand',
'click .container': 'selectFromClick', 'click .container': 'selectFromClick',
@ -37,6 +40,7 @@
'copyClose': 'copyClose', 'copyClose': 'copyClose',
'detail': 'detail', 'detail': 'detail',
'deselect': 'deselect', 'deselect': 'deselect',
'edit': 'edit',
'embed': 'embed', 'embed': 'embed',
'expand': 'expand', 'expand': 'expand',
'next': 'next', 'next': 'next',
@ -80,14 +84,23 @@
detail: function() { detail: function() {
window.location = this.model.get('url'); window.location = this.model.get('url');
}, },
edit: function() {
if (!$('section.main-edit:visible').length) {
var editPane = this.editTemplate(this.model.toJSON());
$main = $('section.main');
$main.hide();
$main.after(editPane);
}
return false;
},
embed: function() {
alert('TODO');
},
expand: function() { expand: function() {
this.$container.toggleClass('expanded', 100); this.$container.toggleClass('expanded', 100);
this.$tags.toggleClass('expanded'); this.$tags.toggleClass('expanded');
this.select(); this.select();
}, },
embed: function() {
alert('TODO');
},
next: function() { next: function() {
window.site.$copyModals.modal('hide'); window.site.$copyModals.modal('hide');
nextSnipt = this.$el.next('article.snipt'); nextSnipt = this.$el.next('article.snipt');
@ -106,7 +119,6 @@
console.log('SniptView.remove() called'); console.log('SniptView.remove() called');
}, },
render: function() { render: function() {
console.log('SniptView.render() called');
this.$el.html(this.template(this.model.toJSON())); this.$el.html(this.template(this.model.toJSON()));
return this; return this;
}, },
@ -132,7 +144,6 @@
e.stopPropagation(); e.stopPropagation();
}, },
test: function() { test: function() {
console.log('test triggered');
this.model.set({'title': 'Changed title!'}); this.model.set({'title': 'Changed title!'});
} }
}); });
@ -191,8 +202,8 @@
}); });
$document.bind('keydown', 'e', function() { $document.bind('keydown', 'e', function() {
if ($selected) { if ($selected) {
if ($selected.hasClass('expandable')) { if ($selected.hasClass('editable')) {
$selected.trigger('expand'); $selected.trigger('edit');
} }
} }
}); });
@ -200,6 +211,10 @@
if ($selected) { if ($selected) {
$selected.trigger('deselect'); $selected.trigger('deselect');
} }
if ($('section.main-edit:visible').length) {
$('section.main-edit').remove();
$('section.main').show();
}
}); });
$document.bind('keydown', 'g', function() { $document.bind('keydown', 'g', function() {
if (window.$selected) { if (window.$selected) {
@ -223,7 +238,9 @@
}); });
$document.bind('keydown', 'o', function() { $document.bind('keydown', 'o', function() {
if ($selected) { if ($selected) {
$selected.trigger('detail'); if ($selected.hasClass('expandable')) {
$selected.trigger('expand');
}
} }
}); });
$document.bind('keydown', 'p', function() { $document.bind('keydown', 'p', function() {

2
snipt/snipts/templates/snipts/snipt-list.html
View File

@ -1,6 +1,6 @@
{% load humanize %} {% load humanize %}
<article class="snipt {% if not snipt.public %}private-snipt{% endif %} {% if snipt.line_count > 8 and not detail %}expandable{% endif %}"> <article class="snipt {% if not snipt.public %}private-snipt{% endif %} {% if snipt.line_count > 8 and not detail %}expandable{% endif %} {% if snipt.user == request.user %}editable{% endif %}">
<div class="number">#{{ snipt.id }}</div> <div class="number">#{{ snipt.id }}</div>
<div class="group"> <div class="group">
<div class="container"> <div class="container">

42
snipt/templates/base.html
View File

@ -207,7 +207,7 @@
<td>Go to snipt</td> <td>Go to snipt</td>
</tr> </tr>
<tr> <tr>
<td>e</td> <td>o</td>
<td>Expand / collapse snipt</td> <td>Expand / collapse snipt</td>
</tr> </tr>
<tr> <tr>
@ -218,27 +218,41 @@
<td>c</td> <td>c</td>
<td>Copy snipt</td> <td>Copy snipt</td>
</tr> </tr>
<tr>
<td>e</td>
<td>Edit snipt</td>
</tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
{% if snipts or snipt %} {% if snipts or snipt %}
{% verbatim %} {% verbatim %}
<article id="snipt-template" class="snipt"> <div class="hidden" id="templates">
<div class="number">#0</div> <div id="snipt">
<div class="group"> <div class="number">#0</div>
<div class="container"> <div class="group">
<header> <div class="container">
<h2></h2> <header>
<h1><a href="{{url}}">{{title}}</a></h1> <h2></h2>
</header> <h1><a href="{{url}}">{{title}}</a></h1>
<section class="code autumn"> </header>
</section> <section class="code autumn">
<div class="ruler top-x"></div> </section>
<div class="ruler bottom-x"></div> <div class="ruler top-x"></div>
<div class="ruler bottom-x"></div>
</div>
</div> </div>
</div> </div>
</article> <div id="edit">
<section class="main main-edit">
<div class="inner">
{{url}}<br />
{{title}}
</div>
</section>
</div>
</div>
{% endverbatim %} {% endverbatim %}
{% endif %} {% endif %}
{% if not debug %} {% if not debug %}