mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-11 09:53:32 +03:00
Merge pull request #3949 from novaugust/js-prefixes
`js-` prefix codebase; fix content preview back button
This commit is contained in:
commit
94db4624e7
@ -44,17 +44,6 @@ var Codemirror = Ember.TextArea.extend(MarkerManager, {
|
||||
afterRenderEvent: function () {
|
||||
var initMarkers = _.bind(this.initMarkers, this);
|
||||
|
||||
// Allow tabbing behaviour when viewing on small screen (not mobile)
|
||||
$('#entry-markdown-header').on('click', function () {
|
||||
$('.entry-markdown').addClass('active');
|
||||
$('.entry-preview').removeClass('active');
|
||||
});
|
||||
|
||||
$('#entry-preview-header').on('click', function () {
|
||||
$('.entry-markdown').removeClass('active');
|
||||
$('.entry-preview').addClass('active');
|
||||
});
|
||||
|
||||
// replaces CodeMirror with TouchEditor only if we're on mobile
|
||||
mobileCodeMirror.createIfMobile();
|
||||
|
||||
@ -88,7 +77,7 @@ var Codemirror = Ember.TextArea.extend(MarkerManager, {
|
||||
codemirror.on('scroll', onScrollHandler);
|
||||
|
||||
codemirror.on('scroll', Ember.run.bind(Ember.$('.CodeMirror-scroll'), setScrollClassName, {
|
||||
target: Ember.$('.entry-markdown'),
|
||||
target: Ember.$('.js-entry-markdown'),
|
||||
offset: 10
|
||||
}));
|
||||
|
||||
|
@ -1,8 +1,6 @@
|
||||
import uploader from 'ghost/assets/lib/uploader';
|
||||
|
||||
var Markdown = Ember.Component.extend({
|
||||
classNames: ['rendered-markdown'],
|
||||
|
||||
didInsertElement: function () {
|
||||
this.set('scrollWrapper', this.$().closest('.entry-preview-content'));
|
||||
},
|
||||
|
@ -1,8 +1,8 @@
|
||||
var ModalDialog = Ember.Component.extend({
|
||||
didInsertElement: function () {
|
||||
this.$('#modal-container').fadeIn(50);
|
||||
this.$('.js-modal-container').fadeIn(50);
|
||||
|
||||
this.$('.modal-background').show().fadeIn(10, function () {
|
||||
this.$('.js-modal-background').show().fadeIn(10, function () {
|
||||
$(this).addClass('in');
|
||||
});
|
||||
|
||||
@ -13,7 +13,7 @@ var ModalDialog = Ember.Component.extend({
|
||||
|
||||
this.$('.js-modal').removeClass('in');
|
||||
|
||||
this.$('.modal-background').removeClass('in');
|
||||
this.$('.js-modal-background').removeClass('in');
|
||||
|
||||
return this._super();
|
||||
},
|
||||
@ -46,7 +46,7 @@ var ModalDialog = Ember.Component.extend({
|
||||
|
||||
return classNames.join(' ');
|
||||
}),
|
||||
|
||||
|
||||
acceptButtonClass: Ember.computed('confirm.accept.buttonClass', function () {
|
||||
return this.get('confirm.accept.buttonClass') ? this.get('confirm.accept.buttonClass') : 'btn btn-green';
|
||||
}),
|
||||
|
@ -71,23 +71,22 @@ var PostsController = Ember.ArrayController.extend(PaginationControllerMixin, {
|
||||
//let the PaginationControllerMixin know what type of model we will be paginating
|
||||
//this is necesariy because we do not have access to the model inside the Controller::init method
|
||||
this._super({'modelType': 'post'});
|
||||
|
||||
},
|
||||
|
||||
actions: {
|
||||
resetContentPreview: function () {
|
||||
$('.content-list').removeAttr('style');
|
||||
$('.content-preview').removeAttr('style');
|
||||
$('.js-content-list').removeAttr('style');
|
||||
$('.js-content-preview').removeAttr('style');
|
||||
},
|
||||
|
||||
showContentPreview: function () {
|
||||
$('.content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
|
||||
$('.content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
|
||||
$('.js-content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
|
||||
$('.js-content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
|
||||
},
|
||||
|
||||
hideContentPreview: function () {
|
||||
$('.content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
|
||||
$('.content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
|
||||
$('.js-content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
|
||||
$('.js-content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
|
||||
},
|
||||
}
|
||||
});
|
||||
|
@ -14,14 +14,14 @@ var EditorViewMixin = Ember.Mixin.create({
|
||||
|
||||
// all child views will have rendered when this fires
|
||||
afterRenderEvent: function () {
|
||||
var $previewViewPort = this.$('.entry-preview-content');
|
||||
var $previewViewPort = this.$('.js-entry-preview-content');
|
||||
|
||||
// cache these elements for use in other methods
|
||||
this.set('$previewViewPort', $previewViewPort);
|
||||
this.set('$previewContent', this.$('.rendered-markdown'));
|
||||
this.set('$previewContent', this.$('.js-rendered-markdown'));
|
||||
|
||||
$previewViewPort.scroll(Ember.run.bind($previewViewPort, setScrollClassName, {
|
||||
target: this.$('.entry-preview'),
|
||||
target: this.$('.js-entry-preview'),
|
||||
offset: 10
|
||||
}));
|
||||
},
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div id="modal-container" {{action "closeModal"}}>
|
||||
<div id="modal-container" class="js-modal-container" {{action "closeModal"}}>
|
||||
<article {{bind-attr class="klass :js-modal"}}>
|
||||
<section class="modal-content" {{action bubbles=false preventDefault=false}}>
|
||||
{{#if title}}<header class="modal-header"><h1>{{title}}</h1></header>{{/if}}
|
||||
@ -19,4 +19,4 @@
|
||||
</section>
|
||||
</article>
|
||||
</div>
|
||||
<div class="modal-background fade"></div>
|
||||
<div class="modal-background fade js-modal-background"></div>
|
||||
|
@ -10,7 +10,7 @@
|
||||
</section>
|
||||
</header>
|
||||
|
||||
<section {{bind-attr class=":entry-markdown isPreview::active"}}>
|
||||
<section {{bind-attr class=":entry-markdown :js-entry-markdown isPreview::active"}}>
|
||||
<header {{action "togglePreview" false}} class="floatingheader">
|
||||
<small>Markdown</small>
|
||||
<a class="markdown-help" href="" {{action "openModal" "markdown"}}><span class="hidden">What is Markdown?</span></a>
|
||||
@ -20,16 +20,17 @@
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section {{bind-attr class=":entry-preview isPreview:active"}}>
|
||||
<section {{bind-attr class=":entry-preview :js-entry-preview isPreview:active"}}>
|
||||
<header {{action "togglePreview" true}} class="floatingheader">
|
||||
<small>Preview <span class="entry-word-count js-entry-word-count">{{gh-count-words scratch}}</span></small>
|
||||
</header>
|
||||
<section class="entry-preview-content">
|
||||
{{gh-markdown markdown=scratch scrollPosition=view.scrollPosition
|
||||
<section class="entry-preview-content js-entry-preview-content">
|
||||
{{gh-markdown classNames="rendered-markdown js-rendered-markdown"
|
||||
markdown=scratch scrollPosition=view.scrollPosition
|
||||
uploadStarted="disableCodeMirror" uploadFinished="enableCodeMirror" uploadSuccess="handleImgUpload"}}
|
||||
</section>
|
||||
</section>
|
||||
|
||||
{{partial "publish-bar"}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,5 +1,5 @@
|
||||
<header class="post-preview-header">
|
||||
<button type="button" class="btn btn-default btn-back" href="#">Back</button>
|
||||
<button type="button" class="btn btn-default btn-back">Back</button>
|
||||
<button type="button" {{bind-attr class="featured:featured:unfeatured"}} title="Feature this post" {{action "toggleFeatured"}}>
|
||||
<span class="hidden">Star</span>
|
||||
</button>
|
||||
|
@ -8,7 +8,7 @@ var PostsView = Ember.View.extend({
|
||||
mobileInteractions: function () {
|
||||
Ember.run.scheduleOnce('afterRender', this, function () {
|
||||
var self = this;
|
||||
|
||||
//@TODO Kill all the jqueries.
|
||||
$(window).resize(function () {
|
||||
if (!mobileQuery.matches) {
|
||||
self.send('resetContentPreview');
|
||||
@ -17,14 +17,14 @@ var PostsView = Ember.View.extend({
|
||||
|
||||
// ### Show content preview when swiping left on content list
|
||||
$('.manage').on('click', '.content-list ol li', function (event) {
|
||||
responsiveAction(event, '(max-width: 800px)', function () {
|
||||
responsiveAction(event, '(max-width: 900px)', function () {
|
||||
self.send('showContentPreview');
|
||||
});
|
||||
});
|
||||
|
||||
// ### Hide content preview
|
||||
$('.manage').on('click', '.content-preview .btn .btn-default', function (event) {
|
||||
responsiveAction(event, '(max-width: 800px)', function () {
|
||||
$('.manage').on('click', '.content-preview .btn.btn-back', function (event) {
|
||||
responsiveAction(event, '(max-width: 900px)', function () {
|
||||
self.send('hideContentPreview');
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user