Enable mobile view. Use local storage to remember whether you chose mobile or desktop view. Mobile device detection needs to be replaced with a better solution.

This commit is contained in:
Neil Lalonde
2013-09-10 16:43:51 -04:00
parent 2319924206
commit cc2acafc9a
6 changed files with 63 additions and 19 deletions

View File

@ -143,8 +143,7 @@ Discourse = Ember.Application.createWithMixins(Discourse.Ajax, {
bootbox.animate(false);
bootbox.backdrop(true); // clicking outside a bootbox modal closes it
Discourse.Session.currentProp('mobileDevice', $html.hasClass('mobile-device'));
Discourse.Session.currentProp('mobileView', $html.hasClass('mobile-view'));
Discourse.Mobile.init();
setInterval(function(){
Discourse.Formatter.updateRelativeAge($('.relative-date'));

View File

@ -0,0 +1,36 @@
/**
A class that is responsible for logic related to mobile devices.
@class Mobile
@namespace Discourse
@module Discourse
**/
Discourse.Mobile = {
isMobileDevice: false,
mobileView: false,
init: function() {
var $html = $('html');
this.isMobileDevice = $html.hasClass('mobile-device');
this.mobileView = $html.hasClass('mobile-view');
if (localStorage && localStorage.mobileView) {
var savedValue = (localStorage.mobileView === 'true' ? true : false);
if (savedValue !== this.mobileView) {
this.reloadPage(savedValue);
}
}
},
toggleMobileView: function() {
if (localStorage) {
localStorage.mobileView = !this.mobileView;
}
this.reloadPage(!this.mobileView);
},
reloadPage: function(mobile) {
window.location.assign(window.location.pathname + '?mobile_view=' + (mobile ? '1' : '0'));
}
};

View File

@ -25,15 +25,15 @@ Discourse.HeaderController = Discourse.Controller.extend({
}.property('currentUser', 'topic.isPrivateMessage'),
mobileDevice: function() {
return Discourse.Session.currentProp('mobileDevice');
return Discourse.Mobile.isMobileDevice;
}.property(),
mobileView: function() {
return Discourse.Session.currentProp('mobileView');
return Discourse.Mobile.mobileView;
}.property(),
toggleMobileView: function() {
window.location.assign(window.location.pathname + '?mobile_view=' + (Discourse.Session.currentProp('mobileView') ? '0' : '1'));
Discourse.Mobile.toggleMobileView();
}
});

View File

@ -98,7 +98,7 @@ Discourse.HeaderView = Discourse.View.extend({
**/
logoHTML: function() {
var result = "<div class='title'><a href='" + Discourse.getURL("/") + "'>";
if (!Discourse.Session.currentProp('mobileView') && this.get('controller.showExtraInfo')) {
if (!Discourse.Mobile.mobileView && this.get('controller.showExtraInfo')) {
var logoSmall = Discourse.SiteSettings.logo_small_url;
if (logoSmall && logoSmall.length > 1) {
result += "<img class='logo-small' src='" + logoSmall + "' width='33' height='33'>";

View File

@ -117,8 +117,7 @@ module ApplicationHelper
end
def mobile_device?
# For now, don't show mobile view unless you put ?mobile_view=1 in the URL.
# request.user_agent =~ /Mobile|webOS/
false
# TODO: this is dumb. user agent matching is a doomed approach. a better solution is coming.
request.user_agent =~ /Mobile|webOS/ and !(request.user_agent =~ /iPad/)
end
end