Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Different Slack ratio on Touch devices, show loading indicator

This commit is contained in:
Robin Ward 2013-11-28 14:17:58 -05:00
parent 47e1f1d1fe
commit 924a88b5c0
2 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app/assets/javascripts/discourse/views/cloaked_collection_view.js
View File

@ -6,9 +6,6 @@
@namespace Discourse @namespace Discourse
@module Discourse @module Discourse
**/ **/
var SLACK_RATIO = 0.75;
Discourse.CloakedCollectionView = Ember.CollectionView.extend(Discourse.Scrolling, { Discourse.CloakedCollectionView = Ember.CollectionView.extend(Discourse.Scrolling, {
topVisible: null, topVisible: null,
bottomVisible: null, bottomVisible: null,
@ -17,6 +14,10 @@ Discourse.CloakedCollectionView = Ember.CollectionView.extend(Discourse.Scrollin
var cloakView = this.get('cloakView'), var cloakView = this.get('cloakView'),
idProperty = this.get('idProperty') || 'id'; idProperty = this.get('idProperty') || 'id';
// Give ourselves more slack on touch devices
// this.set('slackRatio', Discourse.touch ? 1.5 : 0.75);
this.set('slackRatio', 1.0);
this.set('itemViewClass', Discourse.CloakedView.extend({ this.set('itemViewClass', Discourse.CloakedView.extend({
classNames: [cloakView + '-cloak'], classNames: [cloakView + '-cloak'],
cloaks: Em.String.classify(cloakView) + 'View', cloaks: Em.String.classify(cloakView) + 'View',
@ -89,7 +90,7 @@ Discourse.CloakedCollectionView = Ember.CollectionView.extend(Discourse.Scrollin
$w = $(window), $w = $(window),
windowHeight = $w.height(), windowHeight = $w.height(),
windowTop = $w.scrollTop(), windowTop = $w.scrollTop(),
slack = Math.round(windowHeight * SLACK_RATIO), slack = Math.round(windowHeight * this.get('slackRatio')),
viewportTop = windowTop - slack, viewportTop = windowTop - slack,
windowBottom = windowTop + windowHeight, windowBottom = windowTop + windowHeight,
viewportBottom = windowBottom + slack, viewportBottom = windowBottom + slack,
@ -132,12 +133,24 @@ Discourse.CloakedCollectionView = Ember.CollectionView.extend(Discourse.Scrollin
this.setProperties({topVisible: null, bottomVisible: null}); this.setProperties({topVisible: null, bottomVisible: null});
} }
var toCloak = childViews.slice(0, topView).concat(childViews.slice(bottomView+1)); var toCloak = childViews.slice(0, topView).concat(childViews.slice(bottomView+1)),
loadingView = childViews[bottomView + 1];
Em.run.schedule('afterRender', function() { Em.run.schedule('afterRender', function() {
toUncloak.forEach(function (v) { v.uncloak(); }); toUncloak.forEach(function (v) { v.uncloak(); });
toCloak.forEach(function (v) { v.cloak(); }); toCloak.forEach(function (v) { v.cloak(); });
}); });
// for (var j=bottomView; j<childViews.length; j++) {
// var checkView = childViews[j];
// if (!checkView.get('containedView')) {
// if (!checkView.get('loading')) {
// checkView.$().html("<div class='spinner'>" + I18n.t('loading') + "</div>");
// }
// return;
// }
// }
}, },
didInsertElement: function() { didInsertElement: function() {

2
app/assets/javascripts/discourse/views/cloaked_view.js
View File

@ -14,6 +14,7 @@ Discourse.CloakedView = Discourse.View.extend({
this.uncloak(); this.uncloak();
}, },
/** /**
Triggers the set up for rendering a view that is cloaked. Triggers the set up for rendering a view that is cloaked.
@ -24,6 +25,7 @@ Discourse.CloakedView = Discourse.View.extend({
if (!containedView) { if (!containedView) {
this.setProperties({ this.setProperties({
style: null, style: null,
loading: false,
containedView: this.createChildView(Discourse[this.get('cloaks')], { content: this.get('content') }) containedView: this.createChildView(Discourse[this.get('cloaks')], { content: this.get('content') })
}); });