+
Irman Abdić
Informatics, TU München
Going
Mobile
Phonegap
Easily create apps using the web technologies you know and love.
+ AngularJs
...
<script src="angular.min.js"></script>
<script src="angular-touch.min.js"></script>
<script src="ng-cordov...
Development
Phonegap Developer App
ngTouch
ngClick
ngSwipeRight
ngSwipeLeft
$parent
<div ng-controller="ParentCtrl">
<ng-view></ng-view>
</div>
$routeProvider.when('/dashboard',
{templateUrl: 'templ...
module.controller('MyCtrl', function($scope, $cordovaContacts) {
$scope.addContact = function() {
$cordovaContacts.save($s...
Do not...
...refer to online static resources.
style.css:
@import url(http://fonts.googleapis.com/css?
family=Alegreya+San...
Do not...
...use .ready(...);
Use .onDeviceReady(...); instead.
Do not...
...expect fluent
animations /
transitions.
Do not...
...use jQuery Mobile.
...especially together with
jqm-angular-adapter!
Further Discussion
Irman Abdić
irmanabdic.com
https://twitter.com/irmanabdic
https://linkedin.com/in/irmanabdic
Testing Phonegap
https://wiki.apache.org/cordova/RunningTests
The device api tests live in a project called mobile-spec.
T...
Going Mobile: AngularJS and PhoneGap
Upcoming SlideShare
Loading in …5
×

Going Mobile: AngularJS and PhoneGap

893 views

Published on

Published in: Internet, Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
893
On SlideShare
0
From Embeds
0
Number of Embeds
47
Actions
Shares
0
Downloads
16
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Going Mobile: AngularJS and PhoneGap

  1. 1. + Irman Abdić Informatics, TU München Going Mobile
  2. 2. Phonegap Easily create apps using the web technologies you know and love.
  3. 3. + AngularJs ... <script src="angular.min.js"></script> <script src="angular-touch.min.js"></script> <script src="ng-cordova.js"></script> <script src="cordova.js"></script> </body> var myapp = angular.module("app", ["ngCordova", "ngTouch"]);
  4. 4. Development
  5. 5. Phonegap Developer App
  6. 6. ngTouch ngClick ngSwipeRight ngSwipeLeft
  7. 7. $parent <div ng-controller="ParentCtrl"> <ng-view></ng-view> </div> $routeProvider.when('/dashboard', {templateUrl: 'template/dashboard.html', controller: 'DashboardCtrl'})... $scope.$parent.<variable> USE CAREFULLY
  8. 8. module.controller('MyCtrl', function($scope, $cordovaContacts) { $scope.addContact = function() { $cordovaContacts.save($scope.contactForm) .then(function(result) { // Contact saved }, function(err) { // Contact error }); }; // Dummy comment });
  9. 9. Do not... ...refer to online static resources. style.css: @import url(http://fonts.googleapis.com/css? family=Alegreya+Sans);
  10. 10. Do not... ...use .ready(...); Use .onDeviceReady(...); instead.
  11. 11. Do not... ...expect fluent animations / transitions.
  12. 12. Do not... ...use jQuery Mobile. ...especially together with jqm-angular-adapter!
  13. 13. Further Discussion Irman Abdić irmanabdic.com https://twitter.com/irmanabdic https://linkedin.com/in/irmanabdic
  14. 14. Testing Phonegap https://wiki.apache.org/cordova/RunningTests The device api tests live in a project called mobile-spec. They run in an Apache Cordova shell: Create an Apache Cordova project and include the test suite in the www folder. The tests will run when the application is launched. There are two parts to the Mobile Spec: 1. a suite of Jasmine tests that assert things about the Cordova JavaScript API. Load mobile-spec up on your device, hit the "Automatic Tests" button, select which specific API to test (or select "all" to run them all). 2. a series of "manual" tests. Linked from the project's root page. Run through each one to make sure baseline functionality works as expected.

×