1 / 27

MCS 270 Spring 2014

MCS 270 Spring 2014. Object-Oriented Software Development. MCS 270 Object-Oriented Software Development. Today ’ s schedule. GWT – Google API Interaction Deploying App on Google App Store Team Planning - Project 3. MCS 270 Object-Oriented Software Development.

rey
Download Presentation

MCS 270 Spring 2014

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. MCS 270 Spring 2014 Object-Oriented Software Development

  2. MCS 270 Object-Oriented Software Development Today’s schedule GWT – Google API Interaction Deploying App on Google App Store Team Planning - Project 3

  3. MCS 270 Object-Oriented Software Development Google API Libraries for Google Web Toolkit From the project web page: “The Google API Libraries for Google Web Toolkit is a collection of libraries that provide Java language bindings for popular Google JavaScript APIs. The libraries are supported by the Google Web Toolkit team. “ https://code.google.com/p/gwt-google-apis/

  4. MCS 270 Object-Oriented Software Development Google API Libraries for GWT Google+ API Google Books API Google Calendar API Google Charts API Google Gadgets API Google Maps API Google Tasks API Google URL Shortener (goo.gl) API

  5. MCS 270 Object-Oriented Software Development Google Maps API for GWT To use the Maps API code: 1. Add the jar file “gwt-maps.jar” to war/lib 2. Add this jar file to the buildpath: Click on Project->Properties->Java Build Path Under Libraries tab, click Add Jars… Browse to war/lib and choose gwt-maps.jar Note: gwt-maps.jar is accessible from Development Environment page of class web site. http://homepages.gac.edu/~hvidsten/courses/MC270/development-environment.html

  6. MCS 270 Object-Oriented Software Development Google Maps API for GWT To use the Maps API code: 3. Make sure the gwt-maps “module” of Javscript code is loaded at runtime: Add the line <inherits name="com.google.maps.gwt.GoogleMaps" /> to project’s .gwt.xml file (e.g. GusList.gwt.xml)

  7. MCS 270 Object-Oriented Software Development Google Maps API for GWT To use the Maps API code: 4. Add the following line to the project’s entry web page (Just after the nocache.js line): <script type="text/javascript" language="javascript“ src="http://maps.google.com/maps/api/js?sensor=false"> </script>

  8. MCS 270 Object-Oriented Software Development Google Maps API for GWT – How to Use? HorizontalPanel mapPanel = new HorizontalPanel(); mapPanel.setSize("400px", "400px"); // Create the Google Map object, with set options MapOptions myOptions = MapOptions.create(); myOptions.setZoom(8.0); myOptions.setCenter(LatLng.create(-34.397, 150.644)); myOptions.setMapTypeId(MapTypeId.ROADMAP); final GoogleMap map= GoogleMap.create(mapPanel.getElement(), myOptions);

  9. MCS 270 Object-Oriented Software Development Google Maps API for GWT – Address Service // GeoCoder is Google Maps API for taking an address and finding // latitude-longitude. Geocoder geocoder = Geocoder.create(); GeocoderRequest request = GeocoderRequest.create(); final String address = post.getAddress(); request.setAddress(address);

  10. MCS 270 Object-Oriented Software Development Google Maps API for GWT – Address Service geocoder.geocode(request, new Callback() { public void handle(JsArray<GeocoderResult> results, GeocoderStatus status) { if (status == GeocoderStatus.OK) { GeocoderResult location = results.get(0); map.triggerResize(); map.setCenter(location.getGeometry().getLocation()); // Create Marker (red) to show location MarkerOptions markerOpts = MarkerOptions.create(); markerOpts.setMap(map); markerOpts.setTitle(address); markerOpts.setPosition(location.getGeometry().getLocation()); Marker.create(markerOpts); });

  11. MCS 270 Object-Oriented Software Development Google Maps - GusList Demo

  12. MCS 270 Object-Oriented Software Development Deploying Google Apps To deploy our app on the web, we upload it to Google’s App Engine web site: https://appengine.google.com/

  13. MCS 270 Object-Oriented Software Development Deploying Google Apps Application Identifier– the application ID must be unique across all App Engine applications just like a Google account username.

  14. MCS 270 Object-Oriented Software Development

  15. MCS 270 Object-Oriented Software Development Deploying Google Apps If app is created successfully:

  16. MCS 270 Object-Oriented Software Development Deploying Google Apps – Eclipse Once you have an application ID, in Eclipse right-click on your project, and select Google > App Engine Settings... Enter your application ID into the Application ID text box. Click OK.

  17. MCS 270 Object-Oriented Software Development Deploying Google Apps – Eclipse Next: Right-click on your project and select Google > Deploy to App Engine. If you haven't already signed in using your Google account, you will be prompted to do so. Click Deploy

  18. MCS 270 Object-Oriented Software Development Deploying Google Apps – Eclipse Eclipse will compile all of the modules (client Java -> Javascript) needed by the program and then transfer the app code to its appspot home address. Go to http://application-id.appspot.com/ to see your application.

  19. MCS 270 Object-Oriented Software Development

  20. MCS 270 Object-Oriented Software Development Deploying Google Apps – Login Accounts Note: Your browser might have stored the previous “test” logins from Eclipse Development server. If you get an error message, try deleting Google cookies. Demo

  21. MCS 270 Object-Oriented Software Development Google App Administrative Console Go to https://appengine.google.com/ Click on application-id to manage app:

  22. MCS 270 Object-Oriented Software Development

  23. MCS 270 Object-Oriented Software Development Google App Administrative Console Perform basic configuration (application title, authentication options, etc.) Set application performance options to manage cost and performance View configured services Disable or delete your application Administer your datastore, backup/restore, copy and delete data Split traffic between different versions of your application View resource utilization and performance statistics Report problems via the Report Production Issue button. Change user roles, invite other people to be developers for your application Create a new application View request and error logs, and analyze traffic. Test new versions of your application, and switch the version that your users see.

  24. MCS 270 Object-Oriented Software Development Google App Administrative Console Demo:

  25. MCS 270 Object-Oriented Software Development Other Web App Development Systems PHP – server Javascript – client side GUI and control

  26. MCS 270 Object-Oriented Software Development PHP vs GWT PHP good for quick development of dynamic apps tied more directly to HTML simple development cycle – save file, click reload scripting language - not well-typed or OO GWT good for “Internet - Rich” web apps (Google Maps, Mail) development cycle is fairly complex (although Eclipse handles many details) based on Java http://vschart.com/compare/google-web-toolkit/vs/php

  27. MCS 270 Object-Oriented Software Development Project 3 Team project – groups of three. Teams: Must work with at least one new person. Goal: Gain experience with teamwork in prep for major project. Task: Design an app from ground up. App: Address Book

More Related