mobile channels in ez publish

Mobile Channels in eZ PublisheZ Conference 2011

Łukasz SerwatkaMobile Lead Engineer at eZ Systems

eZ Systems employee since March 2005Member of the Engineering Division

8 years experience with eZ Publish2 years experience with native mobile applications development (iOS,

Android)Author of many print and online publications about eZ PublishCreator of many eZ Publish extensions

Web: www.serwatka.netTwitter: @lserwatka

10.04.2023PRESENTER: ŁUKASZ SERWATKA 2


http://www.serwatka.net/

Mobile channels available in eZ Publish

mobile web channelweb technologies

HTML5CSS3 & SASSJavaScript

REST interfaceweb service oriented

lightweight client-server communicationJSON as output format



Content channels in eZ Publish



Mobile channels in eZ Publish



Environments: fragmentation

Symbian (Nokia)Andorid (Google)Bada (Samsung)Windows Phone (Microsoft/Nokia)iOS (Apple)BlackBerry (RIM)webOS (Palm/HP)MeeGo (Intel/Nokia/Maemo)



The Web

Cross-platformFamiliar skills & toolsEasily updatedDecentralizedIndexedWell-understood

… but



Caveats

Performance: slower to execute, limited on CPU/GPU resourceBrowser support: some needs to be ignoredDevice access: limited access to hardware, not fully there yetDebug: more difficult on the client sideDiscoverability: no official app store, yetMonetization: more difficultApp ‘experience’



Mobile web: engines

WebKit: ~57% market shareiOSBadaBlackBerry 6.0+SymbianAndoridwebOSMeeGo

Presto: ~21% market shareOpera MiniOpera Mobile

Others: ~22% market shareGecko, Trident, Mango, UC, Obigo …



Mobile HTML5



semantics

offline & storage

device access

connectivity

multimedia

3D, graphics & effects

performance & integration

CSS3

Technologies

accelerometer -webkit @page CSS Text localStorage @mediamanifest transform <video> WebSQLGeoLocationtype=camera canvas keyframe gradienttouch events<audio> Web Workers CSS3 SASS

… and more



Cross-browser

mobile web frameworks

JavaScript-based (programmatic approach)Sencha TouchSproutCore

Markup-based (progressive enhancement approach)jQTouchjQuery Mobile



Mobile web frameworks: why?

Provide user interface componentstoolbars, buttons, navigation bars, etc.

Smooth browser inconsistenciesnormalization is done under the hood, abstractions

Mimic native or server paradigmsUI elements, drop shadows, insets,

Create consistent application architectureMVC framework



jQTouch

sponsored by Sencha Labsmarkup-basedUI layer on top of jQuerylibrary progressively enhancesMIT licensewide browser support

http://jqtouch.com



http://jqtouch.com/

jQuery Mobile

still in alpha versionmarkup-basedUI layer on top of jQuerylibrary progressively enhancesMIT or GPL2 licensewide browser support

http://jquerymobile.com



http://jquerymobile.com/

Sencha Touch

self-contained librarybuilt on ExtJSJavaScript-based approachstandalone MVC applicationscommercial and open source licenseswide browser support

http://www.sencha.com/products/touch/



http://www.sencha.com/products/touch/

Back to eZ Publish …



Mobile web channel in eZ Publish

accessible via eZ Publish “siteaccess” system;supports URI, HOST and PORT based access;permissions handling;can provide mobile optimized content and layout;template engine;content engine;



Mobile web channel in eZ Publish: configuration

Web server configurationVirtual-Host setup

eZ Publish configurationSiteaccess settingsPermissions setupDesign extension



Mobile web channel in eZ Publish: mobile detection

Apache Mobile Filterhttp://www.apachemobilefilter.org/

No built-in solution



http://www.apachemobilefilter.org/

Mobile web channel in eZ Publish: mobile detection

Smart detection but let user choice.Place link to the desktop version of your site as well.



Mobile web channel in eZ Publish: VH setup

Possible scenariosUse a separate domain altogether (e.g www.mobile-example.com)

Use a subdomain (e.g m.example.com)Probably the most popular optionURI approach as alternative (e.g example.com/mobile)

Use a .mobi top level domain

Combine with smart detection



Mobile web channel in eZ Publish: siteaccess

/settings/override/site.ini.append.php...[SiteAccessSettings]AvailableSiteAccessList[]AvailableSiteAccessList[]=exampleAvailableSiteAccessList[]=mobileMatchOrder=host

HostMatchMapItems[]=www.example.com;exampleHostMatchMapItems[]=m.example.com;mobile...



Mobile web channel in eZ Publish: viewport

Use the viewport meta tag to improve the presentation of your web content

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=yes" />



DEMO

10.04.2023PRESENTER: ŁUKASZ SERWATKA SLIDE 25

Mobile web channel in eZ Publish: hybrid apps

Native shell for a mobile webEmbedded WebView

PhoneGapaccess to device APIsonline build toolwide range of supported platforms

Distributed via AppStore, Android Market, etc.Access to download statisticsAccess to the application via native shell (Icon on device screen)



DEMO


REST

REpresentationalStateTransfer



REST


REST is a set of principles that how Web standards, such as HTTP and URIs, are supposed to be used.

Give every “thing” an IDLink things togetherUse standard methodsResource with multiple representationsCommunicate statelessly



REST


Key goals of REST include:

Scalability of component interactionsGenerality of interfacesIndependent deployment of componentsIntermediary components to reduce latency, enforce security and

encapsulate legacy systems



Life before eZ Publish REST interface

custom siteaccess s and template based XML outputcustom web service implementations involving eZ Publish modules/viewezjscore based web service implementations



eZ Publish REST interface

available as a core feature since version 4.5





dedicated front-end controller (index_rest.php as REST endpoint)





dedicated front-end controller (index_rest.php as REST endpoint)based on the Zeta Components: MVCTools component






content retrieval only, with possibility to extend







extensions mechanism








versioning





dedicated front-controller (index_rest.php as REST endpoint)based on the Zeta Components: MVCTools component



versioning

OAuth 2.0 authentication



eZ Publish REST interface: other features

built-in caching

template based output for various resources

returned fields configured per request: responseGroups



eZ Publish REST interface: front-controller



eZ Publish REST interface: OAuth 2.0

web interface for applications management

support for custom OAuth login pages: override oauthloginpagelayout.tpl

configurable token expiry time in the rest.ini




content is mapped into the resourcenodeobjectlistsfields

resources provided by the ezprestapiprovider extensionfor better upgradability and easier maintenance

new resources can be provided without eZ Publish upgrade



ezpRestProviderInterface

every REST resource provider needs to implement ezpRestProviderInterface

interface ezpRestProviderInterface{ /** * Returns registered versioned routes for provider * * @abstract * @return array */ public function getRoutes();

/** * Returns associated with provider view controller * * @abstract * @return ezpRestViewController */ public function getViewController();}



REST URI pattern explained






global prefix which can be configured in the rest.iniworks as a token to trigger your re-write rule;/api/ as default prefix;


ezpRestPrefixFilterInterfaceresponsible for handling providers informationresponsible for handling version tokenezpRestDefaultRegexpPrefixFilter

/ezp/ as default provider tokenv + integer (e.g v1) as a version token



Versioning

versioning is supportedversion token is part of the URI resource e.g. /api/ezp/v1/…

use ezpRestVersionedRoute class to register your versioned resources



Versioning: examples

new ezpRestVersionedRoute( new ezpMvcRailsRoute( '/content/node/:nodeId/fields', 'ezpRestContentController', 'viewFields' ), 1 )

new ezpRestVersionedRoute( new ezpMvcRailsRoute( '/content/node/:nodeId/field/:fieldIdentifier', 'ezpRestContentController', 'viewField' ), 1 )

new ezpRestVersionedRoute( new ezpMvcRailsRoute( '/content/node/:nodeId/childrenCount', 'ezpRestContentController', 'countChildren' ), 1 )

new ezpRestVersionedRoute( new ezpMvcRailsRoute( '/content/object/:objectId', 'ezpRestContentController', 'viewContent' ), 1 )



Extensibility

done via eZ Publish extension systemcreate new provider by implementing ezpRestProviderInterface

register your new versioned resources

see ezprestapiprovider extension as a source of your inspiration



Resources

content consumption only

full CRUD in the next versionsneeds to be inline with eZ Publish PHP API



Resources: example

GET /[api]/v1/content/object/<objectId>/fields HTTP/1.1

/content/node/:nodeId/content/node/:nodeId/fields/content/node/:nodeId/field/:fieldIdentifier/content/node/:nodeId/childrenCount/content/object/:objectId/content/object/:objectId/fields



Resources: example



DEMO


Knowledge sharing

guidelines for the developersmobile webhybrid applicationsnative applications

source code for sample apps available on GitHub



mobile channels in ez publish

Technology

ez publishez conference

ez publish11

ez publishaccessible

ez publishcreator

ukasz serwatka2mobile

ukasz serwatka3mobile

ukasz serwatka4mobile

ukasz serwatka5mobile