mirror of
https://github.com/flarum/framework.git
synced 2024-12-04 00:03:37 +08:00
c28307903b
HTMLBars goodness! Since there was some breakage and a lot of fiddling around to get some things working, I took this opportunity to do a big cleanup of the whole Ember app. I accidentally worked on some new features too :3 Note that the app is still broken right now, pending on https://github.com/emberjs/ember.js/issues/10401 Cleanup: - Restructuring of components - Consolidation of some stuff into mixins, cleanup of some APIs that will be public - Change all instances of .property() / .observes() / .on() to Ember.computed() / Ember.observer() / Ember.on() respectively (I think it is more readable) - More comments - Start conforming to a code style (2 spaces for indentation) New features: - Post hiding/restoring - Mark individual discussions as read by clicking - Clicking on a read discussion jumps to the end - Mark all discussions as read - Progressively mark the discussion as read as the page is scrolled - Unordered list post formatting - Post permalink popup Demo once that Ember regression is fixed!
58 lines
1.9 KiB
JavaScript
58 lines
1.9 KiB
JavaScript
import Ember from 'ember';
|
|
|
|
/**
|
|
This mixin defines a "paneable" controller - this is, one that has a portion
|
|
of its interface that can be turned into a pane which slides out from the
|
|
side of the screen. This is useful, for instance, when you have nested
|
|
routes (index > discussion) and want to have the parent route's interface
|
|
transform into a side pane when entering the child route.
|
|
*/
|
|
export default Ember.Mixin.create({
|
|
needs: ['application'],
|
|
|
|
// Whether or not the "paneable" interface element is paned.
|
|
paned: false,
|
|
|
|
// Whether or not the pane should be visible on screen.
|
|
paneShowing: false,
|
|
paneHideTimeout: null,
|
|
|
|
// Whether or not the pane is always visible on screen, even when the
|
|
// mouse is taken away.
|
|
panePinned: localStorage.getItem('panePinned'),
|
|
|
|
// Disable the paneable behaviour completely, regardless of if it is
|
|
// paned, showing, or pinned.
|
|
paneDisabled: false,
|
|
|
|
paneEnabled: Ember.computed.not('paneDisabled'),
|
|
paneIsShowing: Ember.computed.and('paned', 'paneShowing', 'paneEnabled'),
|
|
paneIsPinned: Ember.computed.and('paned', 'panePinned', 'paneEnabled'),
|
|
|
|
// Tell the application controller when we pin/unpin the pane so that
|
|
// other parts of the interface can respond appropriately.
|
|
paneIsPinnedChanged: Ember.observer('paneIsPinned', function() {
|
|
this.set('controllers.application.panePinned', this.get('paneIsPinned'));
|
|
}),
|
|
|
|
actions: {
|
|
showPane: function() {
|
|
if (this.get('paned')) {
|
|
clearTimeout(this.get('paneHideTimeout'));
|
|
this.set('paneShowing', true);
|
|
}
|
|
},
|
|
|
|
hidePane: function(delay) {
|
|
var controller = this;
|
|
controller.set('paneHideTimeout', setTimeout(function() {
|
|
controller.set('paneShowing', false);
|
|
}, delay || 250));
|
|
},
|
|
|
|
togglePinned: function() {
|
|
localStorage.setItem('panePinned', this.toggleProperty('panePinned') || '');
|
|
}
|
|
}
|
|
});
|