Jump to content

Please explain mobile devices support


Recommended Posts

Hi,

 

Looking at the sources, I noticed you have introduced mobile device resolution/support.

 

Right now it seems kind of "experimental" (folder /mobile is missing from the SVN, did you forget to commit it ?) but this is great news !

 

However, even if the feature seems very basic, it is clearly located in a central place of the MVC. Would it be possible to dicuss about the way you plan to implement it ?

 

Detection algorithm

 

Currently mobile device resolution is implemented in Context :: getMobileDevice, which matches the user agent against a regular expression. This is maybe a little bit naive.

 

Are you aware that there are several well know ways to achieve the same goal ?

Wordpress Mobile Pack (http://wordpress.org/extend/plugins/wordpress-mobile-pack/) provides the Lite Detection Algorithm (http://plugins.trac.wordpress.org/browser/wordpress-mobile-pack/trunk/plugins/wpmp_switcher/lite_detection.php), which is open source and used by Spring Mobile.

There is also WURFL (http://wurfl.sourceforge.net/)

 

Mobile Layout

 

Right now the mobile detection only changes the header/footer files, allowing to change the CSS at least.

This is ok, but not sufficient. What if I want to use 3, 4 different layouts ? For desktop, tablet, mobiles... and anything that could appear in the future.

You should provide a system that allows to change the layout at runtime, and separate the desktop layout from the mobile layout. Why not add (for example) a Context :: setLayout() method ?

 

---

 

Really, I'm feeling that you are not doing it right...

Please come and discuss, IMHO this is one of the most important features.

Link to comment
Share on other sites

Sure... but they seem to want to provide a native implementation, so I want it to be really flexible and solid.

 

About changing the theme at runtime...

In 1.4 you had no choice than rewriting the settings.inc file to define a constant on the fly.

In 1.5 is this better ? Is the theme stored in Context ?

Link to comment
Share on other sites

Hi Carl, thank you for participating in the forum :D

 

What do you mean by "validating" ?

I still don't understant why they commit things that are half done, but nevermind...

 

Let me paste a tweet from @PrestaShop about something said by Tim Schulz in your BarCamp :

 

"The guys that are letting the wisdom of the community dictate their actions are winning" @timschulz #prestashopnyc

 

:rolleyes:

Link to comment
Share on other sites

Carl > Ok, I'll wait then

 

OC2PS > I believe native apps are not the right thing for e-commerce, we only need webapps. Webapps are cross-platform.

I will never install an app to browse an e-commerce website.

 

You don't "have to" : you have the choice, and Prestashop will offer multiple ways for it : native apps, mobile UI (using responsive designs or jQuery UI). It will depend on the e-merchant choice and capabilities

Link to comment
Share on other sites

I believe native apps are not the right thing for e-commerce, we only need webapps. Webapps are cross-platform.

I will never install an app to browse an e-commerce website.

I beg to differ.

 

Webapps are great, they are cross-platform. But just like we don't have everything in the PC-web browser, and we don't have all our desktop programs written in Java, there's a good reason for native apps to exist. Native apps provide a deep integration, rich experience and a more intuitive UI. I have several native ecommerce apps on my Android phone, including Amazon, eBay, Ocado and a couple of others.

 

I am firmly for an "all of the above" strategy.

Link to comment
Share on other sites

OC2PS > Yes, sure, as you are pointing, native apps make sense only if they bring features that can't be achieved in the browser.

Most of the features of the native app like push and geolocation can be done in the browser, even without HTML5.

 

I'm really happy that PS plans to include mobile web support, now let's hope their will hear what we have to say.

Link to comment
Share on other sites

OC2PS > Yes, sure, as you are pointing, native apps make sense only if they bring features that can't be achieved in the browser.

Most of the features of the native app like push and geolocation can be done in the browser, even without HTML5.

 

I'm really happy that PS plans to include mobile web support, now let's hope their will hear what we have to say.

 

Have you post a feature request on forge.prestashop.com ?

Link to comment
Share on other sites

native apps make sense only if they bring features that can't be achieved in the browser.

It's not just a technical issue. It's a huge usability issue. People on certain platforms get used to their devices working in a certain way (try right clicking your mouse on a Mac if you are a Windows user). Native apps provide the opportunity to provide a "more familiar" UI to the users, making the usage of the app more likely.

Link to comment
Share on other sites

It's not just a technical issue. It's a huge usability issue. People on certain platforms get used to their devices working in a certain way (try right clicking your mouse on a Mac if you are a Windows user). Native apps provide the opportunity to provide a "more familiar" UI to the users, making the usage of the app more likely.

 

I don't agree : you can mimic the native UI using dedicated frameworks, like Sancha. But all theses debates are not the main subject of this topic :)

Link to comment
Share on other sites

But all theses debates are not the main subject of this topic :)

 

It's OC2PS ! He debates too much ;)

 

Ok so now that the topic is flagged as "HOT", let's wait.

Once the jet lag is gone hopefully some developer will tell us what is the plan with mobile device support ?

Link to comment
Share on other sites

Hi guys,

 

Correct me if I'm missing something here but why aren't we using/talking about responsive web design?

 

Yes, its a bit of a buzz word at the moment but the reason its so popular is that its very useful.

 

Why do we even need an app? I completely disagree that a downloaded app for store is a good thing. I've bought loads of things from Amazon on my phone because their website is responsive and works natively in my phone browser.

 

I also think mimicking a Windows/iOS/Android/Blackberry/Whatever else device's interface is just asking for trouble. Is there going to be a different app / interface for each device? Its seems hard enough pushing out the latest core Prestashop release without tagging on dozens of apps too.

 

The front office (default theme, otherwise its up to the theme developer/store owner) and the back office should both be responsive in my opinion. Built to browser width NOT screen resolution, which is a big difference using CSS media queries. They'll then work on all the devices you can think of.

 

No app downloads, no seperate 'mobile optimisation' or 'mobile store' section of the back office. The same content/code made to adapt to the device. When I visit a website on my iPad, I don't want to download your app. I want your website to be useable on whatever device I happen to be using.

  • Like 1
Link to comment
Share on other sites

Hi guys,

 

Correct me if I'm missing something here but why aren't we using/talking about responsive web design?

 

Yes, its a bit of a buzz word at the moment but the reason its so popular is that its very useful.

 

Why do we even need an app? I completely disagree that a downloaded app for store is a good thing. I've bought loads of things from Amazon on my phone because their website is responsive and works natively in my phone browser.

 

I also think mimicking a Windows/iOS/Android/Blackberry/Whatever else device's interface is just asking for trouble. Is there going to be a different app / interface for each device? Its seems hard enough pushing out the latest core Prestashop release without tagging on dozens of apps too.

 

The front office (default theme, otherwise its up to the theme developer/store owner) and the back office should both be responsive in my opinion. Built to browser width NOT screen resolution, which is a big difference using CSS media queries. They'll then work on all the devices you can think of.

 

No app downloads, no seperate 'mobile optimisation' or 'mobile store' section of the back office. The same content/code made to adapt to the device. When I visit a website on my iPad, I don't want to download your app. I want your website to be useable on whatever device I happen to be using.

 

Responsive is not THE solution : you always load the same HTML content and images, but, in a mobile device, it is a problem.

 

So, there are two solutions :

- responsive for "not too little screens" like an iPad

- alternative HTML template for "small screens" like smartphones

Link to comment
Share on other sites

There's a few ways around this though without having resort to apps or 'mobile' websites.

 

For images you can use adaptive images (http://adaptive-images.com/) to show scaled versions of the images for mobiles.

 

In terms of HTML, how much extra filesize are we talking? Unless the markup is excessive we're talking a couple of KB's difference, especially when minimised.

 

Though a better solution is to design for 'mobile first' (http://www.abookapar...ts/mobile-first), and scale up the website to bigger devices/resolutions, rather than scaling something larger down.

  • Like 1
Link to comment
Share on other sites

Hi,

 

First of all thank you for your interest in this topic, and particular thanks to "mexique1" who created it.

 

Thank you again "mexique1" for the different resources about the mobile detection algorithm, it will be interesting to study.

As you aldready saw, the mobile detection is implemented in the Context class. In this way we can use this method in every controller classes.

Unlike you said in you first post, this behaviour not only change the header an footer. As you can see in the FrontControllerCore class, the method setTemplate() depending on the context and if a mobile device is detected, this method try to get a mobile template in the mobile theme directory. In this way all templates can be changed for mobile theme.

The context say to PrestaShop where we are (from what device the user came) and controllers use the context to dispatch the good templates, send necessary variables, change CSS and JS sheets, ...

This is Why the Context class can't have a setLayout() method.

 

The mobile theme is still in developpement process, it will be share when it will be advanced enough.

 

About web responsive theme against a mobile theme, we answer you asap today !

 

Thank again and keep in touch !

  • Like 2
Link to comment
Share on other sites

  • 3 weeks later...

I see that you added a way to have a layout per page, following my recommendations & with the same mechanism :

 

/**
 * Returns the layout corresponding to the current page by using the override system
 * Ex:
 * On the url: http://localhost/index.php?id_product=1&controller=product, this method will
 * check if the layout exists in the following files (in that order), and return the first found:
 * - /themes/default/override/layout-product-1.tpl
 * - /themes/default/override/layout-product.tpl
 * - /themes/default/layout.tpl
 *
 * @since 1.5
 * @return bool|string
 */
   public function getLayout()
   {
   }

 

It's great ! :D

Link to comment
Share on other sites

It seems like "Responsive Design" vs "Website + Mobile Optimized Version" is the new Holy War of the web design world.

 

Similar to back in the day when it was HTML Tables vs CSS ( remember that one?)

 

I am eager to hear what PrestaShop is doing on the mobile front. Any updates?

  • Like 1
Link to comment
Share on other sites

  • 1 month later...

WTF ? I just noticed you didn't include the mobile devices support in RC1, but you also removed it from the codebase :

 

svn log -rr15138 -v
------------------------------------------------------------------------
r15138 | vAugagneur | 2012-05-09 22:57:15 +0200 (mer., 09 mai 2012) | 1 line
Changed paths:
  M /branches/1.5.x/classes/Context.php
  M /branches/1.5.x/classes/controller/FrontController.php
  M /branches/1.5.x/config/defines_uri.inc.php
  M /branches/1.5.x/controllers/front/ContactController.php
  M /branches/1.5.x/controllers/front/IdentityController.php
  M /branches/1.5.x/controllers/front/ProductController.php
  M /branches/1.5.x/controllers/front/StoresController.php
  M /branches/1.5.x/modules/blockcms/blockcms.php
  D /branches/1.5.x/modules/blockcms/blockmobilecms.tpl
  M /branches/1.5.x/modules/blockcms/translations/fr.php
  M /branches/1.5.x/modules/blockcurrencies/blockcurrencies.php
  D /branches/1.5.x/modules/blockcurrencies/blockmobilecurrencies.tpl
  M /branches/1.5.x/modules/blocklanguages/blocklanguages.php
  D /branches/1.5.x/modules/blocklanguages/blockmobilelanguages.tpl
  M /branches/1.5.x/modules/blocknewsletter/blocknewsletter.php
  D /branches/1.5.x/modules/blocknewsletter/views/templates/hook/blockmobilenewsletter.tpl
  M /branches/1.5.x/modules/blocksearch/blocksearch-top.tpl
  M /branches/1.5.x/modules/blocksearch/blocksearch.php
  M /branches/1.5.x/modules/blockwishlist/blockwishlist.php
  D /branches/1.5.x/modules/blockwishlist/img/gift.png
  M /branches/1.5.x/modules/blockwishlist/my-account.tpl
  M /branches/1.5.x/modules/favoriteproducts/favoriteproducts.php
  D /branches/1.5.x/modules/favoriteproducts/img/favorite.png
  M /branches/1.5.x/modules/favoriteproducts/views/templates/hook/my-account.tpl
  D /branches/1.5.x/modules/homeslider/homemobileslider.tpl
  M /branches/1.5.x/modules/homeslider/homeslider.php
  M /branches/1.5.x/themes/default/layout.tpl
//remove mobile theme
------------------------------------------------------------------------

 

Why was mobile support removed from the SVN ???

  • Like 1
Link to comment
Share on other sites

Haha please don't tell me : they are going responsive so it's now useless :rolleyes:

 

To build 100% JS responsive themes, it's already possible in PrestaShop 1.4

 

I want to understand, because obviously time has been lost writing code that was finally thrown away.

Link to comment
Share on other sites

  • 2 months later...

Yes.

 

The thing is, I changed my mind about browser sniffing : I think it is outdated.

 

Moreover, PrestaShop's implementation just tells you if you are on a mobile device or not.

This is insufficient : you can be on a mobile device with no JavaScript support.

This is where browser sniffing is mandatory, when you don't have JavaScript

 

It would have been better to actually have the capabilities of each device. As mobile theme is by default implemented with Jquery Mobile, which relies on JavaScript, it will not work on very old devices.

 

Also, correct me if I'm wrong, the way to make mobile themes doesn't allow to reuse standard theme components.

Link to comment
Share on other sites

  • 4 months later...
×
×
  • Create New...