Committed revision 40692 - Completed the initial commit for the Mobile Device Simulator, ported from the icemobile-ee/trunk as of svn rvn# 39164.

Remaining issues/tasks:

• Simulator needs to be updated as follows:
  • Remove Blackberry devices
  • Remove old iPhone 3/4 devices
  • Add iPhone 6 device(s)
  • Replace iPad with iPad Air
  • Add Windows Phone device

• The ICEfaces Showcase has the following issues when running the Simulator:
  • Opens to the Desktop Showcase instead of the Mobile Showcase
  • Mobile Showcase viewManager doesn't show "Back/Menu" button in top left corner, so no way to get to the menu from the initial page.

ipad air calculations:

ipad air: 2048 x 1536 native device pixels
**************************
device pixel ratio: default 2.5, 3.5 with device-with viewport set
total pixels = 3,145,728
pixels divided by 3.5 = 898,779
4:3 aspect ratio

calculated CSS pixels
*********************
1000 x 750 = 750000
1024 x 768 = 786432
1068 x 801 = 855468
1076 x 807 = 868332
1084 x 813 = 881292
1086 x 815 = 885090
1092 x 819 = 894348
1096 x 822 = 897624 <-------- closest match
1097 x 823 = 902831

The simulator will have to be updated to scale 3.5x for this device (when the scale to device option is selected). I think currently, it only scales the others to 2x.

The ipad air images are sized so the viewport is 1096 x 822.

The simulator control button images will also have to be updated for the ipad air.

The device pixel ratio is the difference between the number of physical pixels on the screen (ie. the published screen resolution) vs the CSS "pixels" the browser uses to display content. Devices with high resolution don't display browser content at the same dimension. They scale it up, so that the content doesn't appear unusually small on the device.

see http://www.quirksmode.org/blog/archives/2010/04/a_pixel_is_not.html for more background.

Note that the simulator passes the 'view' url query parameter to force large or small views. This was integrated with ICEmobile before and allowed the simulator to show the appropriate view for the selected device. see simulator.js#openIphone().

On the server side, the 'view' param was integrated with the DeviceResourceRenderer and ClientDescriptor classes. The DeviceResourceRenderer just used the view param to select the proper theme. So we probably no longer need that. But the ClientDescriptor will have to be updated to accept the view param.

see ClientDesciptor.getInstance() method.

Added iphone 6 plus and removed iphone 3/4

• note that the iphone 6 plus images will have to be touched up as they're missing the browser chrome and could be sharper

Also added simulator custom settings to showcase.

The simulator has now been updated with all of the new images and devices. The viewport clipping that was happening on larger devices, such as the ipad, is now also fixed. A couple of remaining minor changes should be made:

• change icemobile header logo to icefaces logo
• update icefaces ant script to include the simulator jar in the showcase when it's available

Philip,

These changes look good. What do you think of the idea of making the iPhone 6 Plus a "large" format screen for MOBI component purposes (similar to iPads, etc.)?

Doesn't seem feasible. The user agent strings are identical between the iphone 6 and iphone 6 plus, so server side detection isn't possible. And client side detection would have to rely on a generic media query based on the viewport dimensions. The CSS pixel dimensions are 414 x 767, which is too small for a large view layout.