Full-screen editing mode for Snipt Pro users.
Nick Sergeant
parent
011e9a2104
commit
f6cb3ea7ed
|
|
@ -62,6 +62,7 @@
|
|||
|
||||
/* DEFAULT THEME */
|
||||
|
||||
.cm-s-default { background: #FFF; }
|
||||
.cm-s-default .cm-keyword {color: #708;}
|
||||
.cm-s-default .cm-atom {color: #219;}
|
||||
.cm-s-default .cm-number {color: #164;}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1544,6 +1544,11 @@ body.detail {
|
|||
}
|
||||
}
|
||||
}
|
||||
&.full-screened {
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
aside {
|
||||
margin-right: 0;
|
||||
|
|
@ -2121,6 +2126,15 @@ body.editing {
|
|||
cursor: text;
|
||||
font: normal 12px/16px $Consolas;
|
||||
}
|
||||
.CodeMirror-fullscreen {
|
||||
display: block;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
}
|
||||
textarea.editor {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
|
|
@ -2226,6 +2240,14 @@ body.editing {
|
|||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
background: #EFEEEF;
|
||||
border: 1px solid #DDDDDD;
|
||||
font: normal 11px/14px $Helvetica;
|
||||
margin: 0 0 20px 0;
|
||||
padding: 7px 6px;
|
||||
@include border-radius;
|
||||
}
|
||||
label {
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -144,9 +144,10 @@ window.ui_halted=false;},events:{'showKeyboardShortcuts':'showKeyboardShortcuts'
|
|||
(function(Snipt){Snipt.SniptModel=Backbone.Model.extend({toSafe:function(){var snipt=this.toJSON();snipt.code=this.escape('code');snipt.title=this.escape('title');snipt.tags_list=this.escape('tags_list');if(typeof snipt.tags==='object'){for(var i;i<snipt.tags.length;i++){snipt.tags[i].name=_.escape(snipt.tags[i].name);}}
|
||||
return snipt;}});Snipt.SniptView=Backbone.View.extend({tagName:'article',initialize:function(){this.model.view=this;this.model.bind('change',this.render,this);this.template=_.template($('#snipt').html());this.editTemplate=_.template($('#edit').html());this.initLocalVars();this.initLineNumbers();},events:{'click a.copy':'copyFromClick','click a.edit':'edit','click a.favorite':'favoriteToggle','click a.embed':'embedFromClick','click a.expand':'expand','click .container':'selectFromClick','copyClose':'copyClose','copyRaw':'copy','detail':'detail','deselect':'deselect','destroy':'destroy','edit':'edit','embed':'embed','embedClose':'embedClose','expand':'expand','fadeAndRemove':'fadeAndRemove','goToAuthor':'goToAuthor','next':'next','prev':'prev','selectSnipt':'select'},copy:function(){$('textarea',this.$copyModal).remove();window.ui_halted=true;this.$copyModalBody.append('<textarea class="raw"></textarea>');$textarea=$('textarea.raw',this.$copyModalBody).val(this.model.get('code'));this.$copyModal.modal('show');$textarea.select();},copyClose:function(){$('textarea',this.$copyModal).remove();},copyFromClick:function(){this.copy();return false;},deselect:function(){this.$el.removeClass('selected');window.$selected=false;},detail:function(){window.location=this.model.get('absolute_url');},destroy:function(){this.model.destroy();},edit:function(){window.editing=true;window.ui_halted=true;this.select();that=this;var editPane=this.editTemplate({snipt:this.model.toSafe()});window.site.$main.hide();window.site.$body.addClass('detail editing');window.site.$main_edit.html(editPane);$('option[value="'+this.model.get('lexer')+'"]',window.site.$main_edit).attr('selected','selected');var $selectLexer=$('select#id_lexer',window.site.$main_edit);$selectLexer.chosen();$('label.blog-post input',window.site.$main_edit).on('change',function(){var $checkbox=$(this);var $label=$checkbox.parent();var $publish_date=$label.siblings('label.publish-date');if($checkbox.attr('checked')){$label.removeClass('is-not-blog-post').addClass('is-blog-post');$publish_date.show();}else{$label.addClass('is-not-blog-post').removeClass('is-blog-post');$publish_date.hide();}
|
||||
return false;}).trigger('change');$('label.public input',window.site.$main_edit).on('change',function(){var $checkbox=$(this);var $label=$checkbox.parent();if($checkbox.attr('checked')){$label.removeClass('is-private').addClass('is-public');}else{$label.addClass('is-private').removeClass('is-public');}
|
||||
return false;}).trigger('change');window.site.$main_edit.show();this.$editorCodeMirror=$('div.editor',window.site.$main_edit);this.$editorTextarea=$('textarea.editor',window.site.$main_edit);window.editor=CodeMirror(this.$editorCodeMirror.get(0),{autofocus:true,fixedGutter:true,gutter:true,indentUnit:4,lineNumbers:true,javascriptHint:true,matchBrackets:true,mode:that.guessCodeMirrorLexer($selectLexer.val()),value:that.model.get('code')});$selectLexer.change(function(){var $selectedLexer=$('option:selected',$selectLexer);window.editor.setOption('mode',that.guessCodeMirrorLexer($selectedLexer.val()));});var editorHeight=$(window).height()-147;window.editor.setSize('100%',editorHeight);this.$editorTextarea.height(editorHeight-8);$('textarea, input',window.site.$main_edit).bind('keydown','esc',function(e){$(this).blur();return false;});if(window.user_is_pro){var $selectEditor=$('select#id_editor',window.site.$main_edit);var $selectTheme=$('select#id_theme',window.site.$main_edit);$selectEditor.chosen();$selectEditor.change(function(){var newEditor=$selectEditor.val();if(newEditor==='textarea'){that.$editorCodeMirror.hide();that.$editorTextarea.show();that.$editorTextarea.val(window.editor.getValue());}
|
||||
return false;}).trigger('change');window.site.$main_edit.show();this.$editorCodeMirror=$('div.editor',window.site.$main_edit);this.$editorTextarea=$('textarea.editor',window.site.$main_edit);window.editor=CodeMirror(this.$editorCodeMirror.get(0),{autofocus:true,fixedGutter:true,gutter:true,indentUnit:4,lineNumbers:true,javascriptHint:true,matchBrackets:true,mode:that.guessCodeMirrorLexer($selectLexer.val()),value:that.model.get('code')});$selectLexer.change(function(){var $selectedLexer=$('option:selected',$selectLexer);window.editor.setOption('mode',that.guessCodeMirrorLexer($selectedLexer.val()));});window.editorHeight=$(window).height()-147;window.editor.setSize('100%',window.editorHeight);this.$editorTextarea.height(window.editorHeight-8);$('textarea, input',window.site.$main_edit).bind('keydown','esc',function(e){$(this).blur();return false;});if(window.user_is_pro){var $selectEditor=$('select#id_editor',window.site.$main_edit);var $selectTheme=$('select#id_theme',window.site.$main_edit);$selectEditor.chosen();$selectEditor.change(function(){var newEditor=$selectEditor.val();if(newEditor==='textarea'){that.$editorCodeMirror.hide();that.$editorTextarea.show();that.$editorTextarea.val(window.editor.getValue());}
|
||||
if(newEditor==='codemirror'){that.$editorTextarea.hide();that.$editorCodeMirror.show();window.editor.setValue(that.$editorTextarea.val());}});$selectTheme.chosen();$selectTheme.change(function(){window.editor.setOption('theme',$selectTheme.val());});if(window.editor_theme!='default'){$selectTheme.val(window.editor_theme);$selectTheme.trigger('liszt:updated');$selectTheme.trigger('change');}
|
||||
if(window.default_editor!='codemirror'){$selectEditor.val(window.default_editor);$selectEditor.trigger('liszt:updated');$selectEditor.trigger('change');}}
|
||||
if(window.default_editor!='codemirror'){$selectEditor.val(window.default_editor);$selectEditor.trigger('liszt:updated');$selectEditor.trigger('change');}
|
||||
this.setupCodeMirrorFullScreen();}
|
||||
$('button.delete',window.site.$main_edit).on('click',function(){if(confirm('Are you sure you want to delete this snipt?')){that.model.destroy();window.site.snipt_list.escapeUI(true);}
|
||||
return false;});$('button.cancel',window.site.$main_edit).on('click',function(){window.site.snipt_list.escapeUI();return false;});$('button.save',window.site.$main_edit).on('click',function(){$('button.cancel').text('Close');that.save();return false;});$('button.save-and-close',window.site.$main_edit).on('click',function(){that.save();window.site.snipt_list.escapeUI();return false;});window.scrollTo(0,0);return false;},embed:function(){$('textarea',this.$embedModal).remove();window.ui_halted=true;this.$embedModalBody.append('<textarea class="raw"></textarea>');$textarea=$('textarea.raw',this.$embedModalBody).val('<script type="text/javascript" src="'+this.model.get('embed_url')+'"></script>');this.$embedModal.modal('show');$textarea.select();},embedFromClick:function(){this.embed();return false;},embedClose:function(){$('textarea',this.$embedModal).remove();},expand:function(){this.$container.toggleClass('expanded',100);this.$tags.toggleClass('expanded');this.select();return false;},fadeAndRemove:function(){var $toRemove=$(this.el);var $nextSnipt=$toRemove.next('article.snipt');window.$selected=false;$toRemove.fadeOut('fast',function(){$(this).remove();$nextSnipt.trigger('selectSnipt');});return false;},goToAuthor:function(){window.location=this.model.get('user').absolute_url;},guessCodeMirrorLexer:function(val){if(val==='html'){return'htmlmixed';}
|
||||
if(val==='js')return'javascript';if(val==='rb')return'ruby';return val;},favoriteToggle:function(){var that=this;if(this.$el.hasClass('favorited')){$.ajax('/api/private/favorite/'+this.model.get('favorite_id')+'/',{type:'delete',success:function(){that.$el.removeClass('favorited');that.$favorite.text('Favorite');},headers:{'Authorization':'ApiKey '+window.user+':'+window.api_key}});}else{$.ajax('/api/private/favorite/',{data:'{"snipt": '+this.model.get('id')+'}',contentType:'application/json',type:'post',success:function(resp){that.$el.addClass('favorited');that.model.set({'favorite_id':resp.id},{'silent':true});that.$favorite.text('Favorited');},headers:{'Authorization':'ApiKey '+window.user+':'+window.api_key}});}
|
||||
|
|
@ -157,7 +158,11 @@ if(this.model.get('line_count')>8&&!window.detail){this.$el.addClass('expandable
|
|||
$('script#disqus').remove();window.site.$body.append('<script id="disqus" type="text/javascript">'+$('script#disqus-template').text()+'</script>');if(this.$el.attr('id')==='new-snipt'){this.$el.fadeIn('fast');this.$el.attr('id','snipt-'+this.model.get('id'));}
|
||||
return this;},save:function(){$('button.save, button.save-and-close, button.delete, button.cancel',window.site.$main_edit).attr('disabled','disabled');var code;if(this.$editorTextarea.is(':visible')){code=this.$editorTextarea.val();}else{code=window.editor.getValue();}
|
||||
that.model.save({'title':$('input#snipt_title').val(),'tags':$('label.tags textarea').val(),'tags_list':$('label.tags textarea').val(),'lexer':$('select[name="lexer"]').val(),'lexer_name':$('select[name="lexer"] option:selected').text(),'code':code,'blog_post':$('label.blog-post input').is(':checked'),'publish_date':$('label.publish-date input').val(),'public':$('label.public input').is(':checked')},{success:function(model,response){$('button.save, button.save-and-close, button.delete, button.cancel',window.site.$main_edit).removeAttr('disabled');},error:function(model,response){alert('There was a problem saving your snipt. We\'ve been notified. Sorry about that!');}});},select:function(fromClick){$('article.selected',window.site.snipt_list.$el).removeClass('selected');this.$el.addClass('selected');if(fromClick!==true){if(window.site.$snipts.index(this.$el)===0){window.scrollTo(0,0);}else{window.site.$html_body.animate({scrollTop:this.$el.offset().top-50},0);}}
|
||||
window.$selected=this.$el;},selectFromClick:function(e){this.select(true);e.stopPropagation();window.site.$aside_nav.removeClass('open');}});Snipt.SniptListView=Backbone.View.extend({el:'section#snipts',initialize:function(opts){var that=this;opts.snipts.each(this.addExistingSnipt);this.keyboardShortcuts();var cmd;if(navigator.platform=='MacPPC'||navigator.platform=='MacIntel'){cmd='Cmd';}
|
||||
window.$selected=this.$el;},selectFromClick:function(e){this.select(true);e.stopPropagation();window.site.$aside_nav.removeClass('open');},setupCodeMirrorFullScreen:function(){function isFullScreen(cm){return(/\bCodeMirror-fullscreen\b/).test(cm.getWrapperElement().className);}
|
||||
function winHeight(){return window.innerHeight||(document.documentElement||document.body).clientHeight;}
|
||||
function setFullScreen(cm,full){var wrap=cm.getWrapperElement();if(full){wrap.className+=' CodeMirror-fullscreen';wrap.style.height=winHeight()+'px';document.documentElement.style.overflow='hidden';$('header.fixed-save').hide();$('div.container').addClass('full-screened');}else{wrap.className=wrap.className.replace(' CodeMirror-fullscreen','');window.editor.setSize('100%',window.editorHeight);document.documentElement.style.overflow='';$('header.fixed-save').show();$('div.container').removeClass('full-screened');}
|
||||
cm.refresh();}
|
||||
window.editor.on(window,'resize',function(){var showing=document.body.getElementsByClassName('CodeMirror-fullscreen')[0];if(!showing)return;showing.CodeMirror.getWrapperElement().style.height=winHeight()+'px';});window.editor.setOption('extraKeys',{'Cmd-Enter':function(cm){setFullScreen(cm,!isFullScreen(cm));},'F11':function(cm){setFullScreen(cm,!isFullScreen(cm));},'Esc':function(cm){if(isFullScreen(cm))setFullScreen(cm,false);}});}});Snipt.SniptListView=Backbone.View.extend({el:'section#snipts',initialize:function(opts){var that=this;opts.snipts.each(this.addExistingSnipt);this.keyboardShortcuts();var cmd;if(navigator.platform=='MacPPC'||navigator.platform=='MacIntel'){cmd='Cmd';}
|
||||
else{cmd='Ctrl';}
|
||||
$('span.cmd-ctrl').text(cmd);$('button#add-snipt').click(function(){that.addNewSnipt();});},addExistingSnipt:function(){var $el=$(this);var $created=$('li.created',$el);var $h1=$('header h1 a',$el);var $public=$('div.public',$el);var $blog_post=$('div.blog-post',$el);var $publish_date=$('div.publish-date',$el);var $user=$('li.author a',$el);var is_public=$public.text()==='True'?true:false;var is_blog_post=$blog_post.text()==='True'?true:false;var tag_lis=$('section.tags li',$el);var tags=[];for(var i=0;i<tag_lis.length;i++){var $tag=$('a',tag_lis.eq(i));tags[i]={name:$tag.text(),absolute_url:$tag.attr('href')};}
|
||||
var is_pro=$user.siblings('span.pro').length?true:false;var data={code:$('textarea.raw',$el).text(),created:$created.attr('title'),created_formatted:$created.text(),embed_url:$('div.embed-url',$el).text(),absolute_url:$h1.attr('href'),favorite_id:$el.data('favorite-id'),id: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(),resource_uri:$('div.resource-uri',$el).text(),slug:$('div.slug',$el).text(),stylized:$('div.stylized',$el).text(),tags:tags,publish_date:$publish_date.text(),tags_list:$('div.tags-list',$el).text(),title:$h1.text(),user:{absolute_url:$user.attr('href'),username:$user.text(),profile:{is_pro:is_pro}}};data['public']=is_public;data.blog_post=is_blog_post;var view=new Snipt.SniptView({el:this,model:new Snipt.SniptModel(data)});},addNewSnipt:function(){var $articleNewSnipt=$('article#new-snipt');if($articleNewSnipt.length===0){window.site.snipt_list.$el.prepend('<article id="new-snipt" class="hidden snipt"></article>');var data={id:'',code:'',tags:[],tags_list:'',title:'',lexer:'text',lexer_name:'Text only',new_from_js:true,user:{username:'',profile:{is_pro:window.user_is_pro}}};data['public']=false;data.blog_post=false;var newSniptView=new Snipt.SniptView({el:$('article#new-snipt'),model:new Snipt.SniptModel(data)});newSniptView.edit();}else{$articleNewSnipt.trigger('edit');}
|
||||
|
|
|
|||
|
|
@ -159,9 +159,9 @@
|
|||
});
|
||||
|
||||
// Set the heights.
|
||||
var editorHeight = $(window).height() - 147;
|
||||
window.editor.setSize('100%', editorHeight);
|
||||
this.$editorTextarea.height(editorHeight - 8);
|
||||
window.editorHeight = $(window).height() - 147;
|
||||
window.editor.setSize('100%', window.editorHeight);
|
||||
this.$editorTextarea.height(window.editorHeight - 8);
|
||||
|
||||
$('textarea, input', window.site.$main_edit).bind('keydown', 'esc', function(e) {
|
||||
$(this).blur();
|
||||
|
|
@ -208,6 +208,10 @@
|
|||
$selectEditor.trigger('liszt:updated');
|
||||
$selectEditor.trigger('change');
|
||||
}
|
||||
|
||||
// Full-screen mode.
|
||||
this.setupCodeMirrorFullScreen();
|
||||
|
||||
}
|
||||
|
||||
// Edit buttons
|
||||
|
|
@ -463,6 +467,55 @@
|
|||
this.select(true);
|
||||
e.stopPropagation();
|
||||
window.site.$aside_nav.removeClass('open');
|
||||
},
|
||||
setupCodeMirrorFullScreen: function() {
|
||||
// This is kind of messy (taken from the CodeMirror docs). Clean it up some day.
|
||||
|
||||
function isFullScreen(cm) {
|
||||
return (/\bCodeMirror-fullscreen\b/).test(cm.getWrapperElement().className);
|
||||
}
|
||||
function winHeight() {
|
||||
return window.innerHeight || (document.documentElement || document.body).clientHeight;
|
||||
}
|
||||
function setFullScreen(cm, full) {
|
||||
var wrap = cm.getWrapperElement();
|
||||
if (full) {
|
||||
wrap.className += ' CodeMirror-fullscreen';
|
||||
wrap.style.height = winHeight() + 'px';
|
||||
document.documentElement.style.overflow = 'hidden';
|
||||
|
||||
// Hax.
|
||||
$('header.fixed-save').hide();
|
||||
$('div.container').addClass('full-screened');
|
||||
|
||||
} else {
|
||||
wrap.className = wrap.className.replace(' CodeMirror-fullscreen', '');
|
||||
window.editor.setSize('100%', window.editorHeight);
|
||||
document.documentElement.style.overflow = '';
|
||||
|
||||
// Hax.
|
||||
$('header.fixed-save').show();
|
||||
$('div.container').removeClass('full-screened');
|
||||
|
||||
}
|
||||
cm.refresh();
|
||||
}
|
||||
window.editor.on(window, 'resize', function() {
|
||||
var showing = document.body.getElementsByClassName('CodeMirror-fullscreen')[0];
|
||||
if (!showing) return;
|
||||
showing.CodeMirror.getWrapperElement().style.height = winHeight() + 'px';
|
||||
});
|
||||
window.editor.setOption('extraKeys', {
|
||||
'Cmd-Enter': function(cm) {
|
||||
setFullScreen(cm, !isFullScreen(cm));
|
||||
},
|
||||
'F11': function(cm) {
|
||||
setFullScreen(cm, !isFullScreen(cm));
|
||||
},
|
||||
'Esc': function(cm) {
|
||||
if (isFullScreen(cm)) setFullScreen(cm, false);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
Snipt.SniptListView = Backbone.View.extend({
|
||||
|
|
|
|||
|
|
@ -2,9 +2,10 @@
|
|||
(function(Snipt){Snipt.SniptModel=Backbone.Model.extend({toSafe:function(){var snipt=this.toJSON();snipt.code=this.escape('code');snipt.title=this.escape('title');snipt.tags_list=this.escape('tags_list');if(typeof snipt.tags==='object'){for(var i;i<snipt.tags.length;i++){snipt.tags[i].name=_.escape(snipt.tags[i].name);}}
|
||||
return snipt;}});Snipt.SniptView=Backbone.View.extend({tagName:'article',initialize:function(){this.model.view=this;this.model.bind('change',this.render,this);this.template=_.template($('#snipt').html());this.editTemplate=_.template($('#edit').html());this.initLocalVars();this.initLineNumbers();},events:{'click a.copy':'copyFromClick','click a.edit':'edit','click a.favorite':'favoriteToggle','click a.embed':'embedFromClick','click a.expand':'expand','click .container':'selectFromClick','copyClose':'copyClose','copyRaw':'copy','detail':'detail','deselect':'deselect','destroy':'destroy','edit':'edit','embed':'embed','embedClose':'embedClose','expand':'expand','fadeAndRemove':'fadeAndRemove','goToAuthor':'goToAuthor','next':'next','prev':'prev','selectSnipt':'select'},copy:function(){$('textarea',this.$copyModal).remove();window.ui_halted=true;this.$copyModalBody.append('<textarea class="raw"></textarea>');$textarea=$('textarea.raw',this.$copyModalBody).val(this.model.get('code'));this.$copyModal.modal('show');$textarea.select();},copyClose:function(){$('textarea',this.$copyModal).remove();},copyFromClick:function(){this.copy();return false;},deselect:function(){this.$el.removeClass('selected');window.$selected=false;},detail:function(){window.location=this.model.get('absolute_url');},destroy:function(){this.model.destroy();},edit:function(){window.editing=true;window.ui_halted=true;this.select();that=this;var editPane=this.editTemplate({snipt:this.model.toSafe()});window.site.$main.hide();window.site.$body.addClass('detail editing');window.site.$main_edit.html(editPane);$('option[value="'+this.model.get('lexer')+'"]',window.site.$main_edit).attr('selected','selected');var $selectLexer=$('select#id_lexer',window.site.$main_edit);$selectLexer.chosen();$('label.blog-post input',window.site.$main_edit).on('change',function(){var $checkbox=$(this);var $label=$checkbox.parent();var $publish_date=$label.siblings('label.publish-date');if($checkbox.attr('checked')){$label.removeClass('is-not-blog-post').addClass('is-blog-post');$publish_date.show();}else{$label.addClass('is-not-blog-post').removeClass('is-blog-post');$publish_date.hide();}
|
||||
return false;}).trigger('change');$('label.public input',window.site.$main_edit).on('change',function(){var $checkbox=$(this);var $label=$checkbox.parent();if($checkbox.attr('checked')){$label.removeClass('is-private').addClass('is-public');}else{$label.addClass('is-private').removeClass('is-public');}
|
||||
return false;}).trigger('change');window.site.$main_edit.show();this.$editorCodeMirror=$('div.editor',window.site.$main_edit);this.$editorTextarea=$('textarea.editor',window.site.$main_edit);window.editor=CodeMirror(this.$editorCodeMirror.get(0),{autofocus:true,fixedGutter:true,gutter:true,indentUnit:4,lineNumbers:true,javascriptHint:true,matchBrackets:true,mode:that.guessCodeMirrorLexer($selectLexer.val()),value:that.model.get('code')});$selectLexer.change(function(){var $selectedLexer=$('option:selected',$selectLexer);window.editor.setOption('mode',that.guessCodeMirrorLexer($selectedLexer.val()));});var editorHeight=$(window).height()-147;window.editor.setSize('100%',editorHeight);this.$editorTextarea.height(editorHeight-8);$('textarea, input',window.site.$main_edit).bind('keydown','esc',function(e){$(this).blur();return false;});if(window.user_is_pro){var $selectEditor=$('select#id_editor',window.site.$main_edit);var $selectTheme=$('select#id_theme',window.site.$main_edit);$selectEditor.chosen();$selectEditor.change(function(){var newEditor=$selectEditor.val();if(newEditor==='textarea'){that.$editorCodeMirror.hide();that.$editorTextarea.show();that.$editorTextarea.val(window.editor.getValue());}
|
||||
return false;}).trigger('change');window.site.$main_edit.show();this.$editorCodeMirror=$('div.editor',window.site.$main_edit);this.$editorTextarea=$('textarea.editor',window.site.$main_edit);window.editor=CodeMirror(this.$editorCodeMirror.get(0),{autofocus:true,fixedGutter:true,gutter:true,indentUnit:4,lineNumbers:true,javascriptHint:true,matchBrackets:true,mode:that.guessCodeMirrorLexer($selectLexer.val()),value:that.model.get('code')});$selectLexer.change(function(){var $selectedLexer=$('option:selected',$selectLexer);window.editor.setOption('mode',that.guessCodeMirrorLexer($selectedLexer.val()));});window.editorHeight=$(window).height()-147;window.editor.setSize('100%',window.editorHeight);this.$editorTextarea.height(window.editorHeight-8);$('textarea, input',window.site.$main_edit).bind('keydown','esc',function(e){$(this).blur();return false;});if(window.user_is_pro){var $selectEditor=$('select#id_editor',window.site.$main_edit);var $selectTheme=$('select#id_theme',window.site.$main_edit);$selectEditor.chosen();$selectEditor.change(function(){var newEditor=$selectEditor.val();if(newEditor==='textarea'){that.$editorCodeMirror.hide();that.$editorTextarea.show();that.$editorTextarea.val(window.editor.getValue());}
|
||||
if(newEditor==='codemirror'){that.$editorTextarea.hide();that.$editorCodeMirror.show();window.editor.setValue(that.$editorTextarea.val());}});$selectTheme.chosen();$selectTheme.change(function(){window.editor.setOption('theme',$selectTheme.val());});if(window.editor_theme!='default'){$selectTheme.val(window.editor_theme);$selectTheme.trigger('liszt:updated');$selectTheme.trigger('change');}
|
||||
if(window.default_editor!='codemirror'){$selectEditor.val(window.default_editor);$selectEditor.trigger('liszt:updated');$selectEditor.trigger('change');}}
|
||||
if(window.default_editor!='codemirror'){$selectEditor.val(window.default_editor);$selectEditor.trigger('liszt:updated');$selectEditor.trigger('change');}
|
||||
this.setupCodeMirrorFullScreen();}
|
||||
$('button.delete',window.site.$main_edit).on('click',function(){if(confirm('Are you sure you want to delete this snipt?')){that.model.destroy();window.site.snipt_list.escapeUI(true);}
|
||||
return false;});$('button.cancel',window.site.$main_edit).on('click',function(){window.site.snipt_list.escapeUI();return false;});$('button.save',window.site.$main_edit).on('click',function(){$('button.cancel').text('Close');that.save();return false;});$('button.save-and-close',window.site.$main_edit).on('click',function(){that.save();window.site.snipt_list.escapeUI();return false;});window.scrollTo(0,0);return false;},embed:function(){$('textarea',this.$embedModal).remove();window.ui_halted=true;this.$embedModalBody.append('<textarea class="raw"></textarea>');$textarea=$('textarea.raw',this.$embedModalBody).val('<script type="text/javascript" src="'+this.model.get('embed_url')+'"></script>');this.$embedModal.modal('show');$textarea.select();},embedFromClick:function(){this.embed();return false;},embedClose:function(){$('textarea',this.$embedModal).remove();},expand:function(){this.$container.toggleClass('expanded',100);this.$tags.toggleClass('expanded');this.select();return false;},fadeAndRemove:function(){var $toRemove=$(this.el);var $nextSnipt=$toRemove.next('article.snipt');window.$selected=false;$toRemove.fadeOut('fast',function(){$(this).remove();$nextSnipt.trigger('selectSnipt');});return false;},goToAuthor:function(){window.location=this.model.get('user').absolute_url;},guessCodeMirrorLexer:function(val){if(val==='html'){return'htmlmixed';}
|
||||
if(val==='js')return'javascript';if(val==='rb')return'ruby';return val;},favoriteToggle:function(){var that=this;if(this.$el.hasClass('favorited')){$.ajax('/api/private/favorite/'+this.model.get('favorite_id')+'/',{type:'delete',success:function(){that.$el.removeClass('favorited');that.$favorite.text('Favorite');},headers:{'Authorization':'ApiKey '+window.user+':'+window.api_key}});}else{$.ajax('/api/private/favorite/',{data:'{"snipt": '+this.model.get('id')+'}',contentType:'application/json',type:'post',success:function(resp){that.$el.addClass('favorited');that.model.set({'favorite_id':resp.id},{'silent':true});that.$favorite.text('Favorited');},headers:{'Authorization':'ApiKey '+window.user+':'+window.api_key}});}
|
||||
|
|
@ -15,7 +16,11 @@ if(this.model.get('line_count')>8&&!window.detail){this.$el.addClass('expandable
|
|||
$('script#disqus').remove();window.site.$body.append('<script id="disqus" type="text/javascript">'+$('script#disqus-template').text()+'</script>');if(this.$el.attr('id')==='new-snipt'){this.$el.fadeIn('fast');this.$el.attr('id','snipt-'+this.model.get('id'));}
|
||||
return this;},save:function(){$('button.save, button.save-and-close, button.delete, button.cancel',window.site.$main_edit).attr('disabled','disabled');var code;if(this.$editorTextarea.is(':visible')){code=this.$editorTextarea.val();}else{code=window.editor.getValue();}
|
||||
that.model.save({'title':$('input#snipt_title').val(),'tags':$('label.tags textarea').val(),'tags_list':$('label.tags textarea').val(),'lexer':$('select[name="lexer"]').val(),'lexer_name':$('select[name="lexer"] option:selected').text(),'code':code,'blog_post':$('label.blog-post input').is(':checked'),'publish_date':$('label.publish-date input').val(),'public':$('label.public input').is(':checked')},{success:function(model,response){$('button.save, button.save-and-close, button.delete, button.cancel',window.site.$main_edit).removeAttr('disabled');},error:function(model,response){alert('There was a problem saving your snipt. We\'ve been notified. Sorry about that!');}});},select:function(fromClick){$('article.selected',window.site.snipt_list.$el).removeClass('selected');this.$el.addClass('selected');if(fromClick!==true){if(window.site.$snipts.index(this.$el)===0){window.scrollTo(0,0);}else{window.site.$html_body.animate({scrollTop:this.$el.offset().top-50},0);}}
|
||||
window.$selected=this.$el;},selectFromClick:function(e){this.select(true);e.stopPropagation();window.site.$aside_nav.removeClass('open');}});Snipt.SniptListView=Backbone.View.extend({el:'section#snipts',initialize:function(opts){var that=this;opts.snipts.each(this.addExistingSnipt);this.keyboardShortcuts();var cmd;if(navigator.platform=='MacPPC'||navigator.platform=='MacIntel'){cmd='Cmd';}
|
||||
window.$selected=this.$el;},selectFromClick:function(e){this.select(true);e.stopPropagation();window.site.$aside_nav.removeClass('open');},setupCodeMirrorFullScreen:function(){function isFullScreen(cm){return(/\bCodeMirror-fullscreen\b/).test(cm.getWrapperElement().className);}
|
||||
function winHeight(){return window.innerHeight||(document.documentElement||document.body).clientHeight;}
|
||||
function setFullScreen(cm,full){var wrap=cm.getWrapperElement();if(full){wrap.className+=' CodeMirror-fullscreen';wrap.style.height=winHeight()+'px';document.documentElement.style.overflow='hidden';$('header.fixed-save').hide();$('div.container').addClass('full-screened');}else{wrap.className=wrap.className.replace(' CodeMirror-fullscreen','');window.editor.setSize('100%',window.editorHeight);document.documentElement.style.overflow='';$('header.fixed-save').show();$('div.container').removeClass('full-screened');}
|
||||
cm.refresh();}
|
||||
window.editor.on(window,'resize',function(){var showing=document.body.getElementsByClassName('CodeMirror-fullscreen')[0];if(!showing)return;showing.CodeMirror.getWrapperElement().style.height=winHeight()+'px';});window.editor.setOption('extraKeys',{'Cmd-Enter':function(cm){setFullScreen(cm,!isFullScreen(cm));},'F11':function(cm){setFullScreen(cm,!isFullScreen(cm));},'Esc':function(cm){if(isFullScreen(cm))setFullScreen(cm,false);}});}});Snipt.SniptListView=Backbone.View.extend({el:'section#snipts',initialize:function(opts){var that=this;opts.snipts.each(this.addExistingSnipt);this.keyboardShortcuts();var cmd;if(navigator.platform=='MacPPC'||navigator.platform=='MacIntel'){cmd='Cmd';}
|
||||
else{cmd='Ctrl';}
|
||||
$('span.cmd-ctrl').text(cmd);$('button#add-snipt').click(function(){that.addNewSnipt();});},addExistingSnipt:function(){var $el=$(this);var $created=$('li.created',$el);var $h1=$('header h1 a',$el);var $public=$('div.public',$el);var $blog_post=$('div.blog-post',$el);var $publish_date=$('div.publish-date',$el);var $user=$('li.author a',$el);var is_public=$public.text()==='True'?true:false;var is_blog_post=$blog_post.text()==='True'?true:false;var tag_lis=$('section.tags li',$el);var tags=[];for(var i=0;i<tag_lis.length;i++){var $tag=$('a',tag_lis.eq(i));tags[i]={name:$tag.text(),absolute_url:$tag.attr('href')};}
|
||||
var is_pro=$user.siblings('span.pro').length?true:false;var data={code:$('textarea.raw',$el).text(),created:$created.attr('title'),created_formatted:$created.text(),embed_url:$('div.embed-url',$el).text(),absolute_url:$h1.attr('href'),favorite_id:$el.data('favorite-id'),id: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(),resource_uri:$('div.resource-uri',$el).text(),slug:$('div.slug',$el).text(),stylized:$('div.stylized',$el).text(),tags:tags,publish_date:$publish_date.text(),tags_list:$('div.tags-list',$el).text(),title:$h1.text(),user:{absolute_url:$user.attr('href'),username:$user.text(),profile:{is_pro:is_pro}}};data['public']=is_public;data.blog_post=is_blog_post;var view=new Snipt.SniptView({el:this,model:new Snipt.SniptModel(data)});},addNewSnipt:function(){var $articleNewSnipt=$('article#new-snipt');if($articleNewSnipt.length===0){window.site.snipt_list.$el.prepend('<article id="new-snipt" class="hidden snipt"></article>');var data={id:'',code:'',tags:[],tags_list:'',title:'',lexer:'text',lexer_name:'Text only',new_from_js:true,user:{username:'',profile:{is_pro:window.user_is_pro}}};data['public']=false;data.blog_post=false;var newSniptView=new Snipt.SniptView({el:$('article#new-snipt'),model:new Snipt.SniptModel(data)});newSniptView.edit();}else{$articleNewSnipt.trigger('edit');}
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@
|
|||
<% if (window.user_is_pro) { %>
|
||||
<div class="editor-settings">
|
||||
<h2>Pro settings <a href="/account/" target="blank">change defaults</a></h2>
|
||||
<h4>F11 or Cmd+Enter toggles fullscreen mode</h4>
|
||||
<label class="lexer"><span>Editor<span></label>
|
||||
<select name="editor" id="id_editor">
|
||||
<option value="codemirror" selected="selected">CodeMirror</option>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/snipt.css?67" />
|
||||
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/snipt.css?68" />
|
||||
|
||||
{% if has_snipts and not detail %}
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="{{ request.path }}?rss{% if not public %}&api_key={{ request.user.api_key.key }}{% endif %}" />
|
||||
|
|
@ -339,7 +339,7 @@
|
|||
</div>
|
||||
{% endblock %}
|
||||
|
||||
<script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?40"></script>
|
||||
<script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?41"></script>
|
||||
{% block extra-scripts %}{% endblock %}
|
||||
|
||||
{% block inline-js %}
|
||||
|
|
|
|||
|
|
@ -22,17 +22,18 @@
|
|||
<li>No ads.</li>
|
||||
<li><span class="pro">Pro</span> badge throughout the site.</li>
|
||||
<li>Statistics for "views" and "favorites" of your snipts.</li>
|
||||
<li>Ability to switch between a rich-code editor and a plain textarea for editing (and set a default).</li>
|
||||
<li>Ability to change the editor theme (17 options).</li>
|
||||
<li>Multiple editors: CodeMirror (rich-code editing) or a plain-old textarea.</li>
|
||||
<li>17 CodeMirror editor themes to choose from.</li>
|
||||
<li>Full-screen editor mode.</li>
|
||||
</ul>
|
||||
<h6>Blogging features:</h6>
|
||||
<ul>
|
||||
<li>Custom domain for your <a href="/blogging/">Snipt blog</a>.</li>
|
||||
<li>Ability to customize CSS in your blog theme.</li>
|
||||
<li>Customize CSS in your blog theme.</li>
|
||||
<li>Exclusive Pro-only theme for your blog. <a href="http://nicksergeant.com/">Here's a preview</a> of the first available theme (working on more).</li>
|
||||
<li><a href="https://www.gittip.com/">GitTip</a> integration ("tip" link on every snipt next to your username, and on your profile). <a href="https://snipt.net/nick/">Sample</a>.</li>
|
||||
<li>Ability to use your own <a href="http://disqus.com">Disqus</a> account for comments on your Snipt blog.</li>
|
||||
<li>Ability to use your own <a href="http://analytics.google.com">Google Analytics</a> account for tracking visits to your Snipt blog.</li>
|
||||
<li>Use your own <a href="http://disqus.com">Disqus</a> account for comments on your Snipt blog.</li>
|
||||
<li>Use your own <a href="http://analytics.google.com">Google Analytics</a> account for tracking visits to your Snipt blog.</li>
|
||||
</ul>
|
||||
{% if request.user.profile.is_pro %}
|
||||
<h3>You're already a Pro. You know that ;)</h3>
|
||||
|
|
|
|||
Loading…
Reference in New Issue