Component: DeviceCaps

edited February 2012 in Enyo 1.0
This is a component utility component that serves as central environment info repository, that you can use to configure your apps based on which kind of device is running.

To make use of it, you just need to include the file in a depends.js and it creates the enyo.application.device object, which contains all the methods and properties of the devicecaps component.

It includes some useful utility functions to adjust your app to the device's pixel density, and joining it with css media queries, allows you to easily adjust your interface to different pixel densities.

the component detects the type of device as follows:

- "desktop" (default)
- "phone" if window.PhoneGap exists and window.innerWidth <= 320 DIP
- "tablet" if window.PhoneGap exists and window.innerWidth > 320 DIP

so you can ask for the enyo.application.device.type value to determine your layout.

It also exposes the fetchImagePath (for PNGs) and fetchResourcePath (extension free) methods, which you can use to retrieve your graphics based on device's pixel density, so a simple enyo.application.device.fetchImagePath('icons/new') will retrieve your new.png icon based on device's pixel density it requires a tree folder structure for your bitmaps.

Also, you can use enyo.application.device.fetchDisplaySizes() (physical pixels) and enyo.application.device.fetchVirtualDisplaySizes() (DIP) to use it on your app.

enyo.application.device.deviceInfo wraps PalmSystem.deviceInfo or PhoneGap's window.device depending on both PhoneGap and PalmSystem existence.

Not sure if this is useful for anyone, but here it is anyways:

DeviceCaps on GitHub
Sign In or Register to comment.