Upload
diana-michelle
View
221
Download
3
Tags:
Embed Size (px)
DESCRIPTION
Basic set up for the Google Mirror API quick start java project.
Citation preview
M I R R O R - A P ID E V E L O P I N G F O R G O O G L E G L A S S
S O , W H AT I S G L A S S ?
Google Glass has a timeline, and you can scroll forward and backward through it by using the
touchpad on the side.
N O . T H E S E T T I N G S A R E W H AT TA K E S L O N G .
Ok, cool, but is Mirror API difficult to develop for?
I ’ M C O N F U S E D ! W H AT ’ S T H E
D I F F E R E N C E B E T W E E N M I R R O R A P I A N D
G D K ?
M I R R O R A P I I T ’ S A L L A B O U T T H E C L O U D .
G D K I S A L L A B O U T I N S TA L L I N G S O F T W A R E O N Y O U R D E V I C E .
T H E P H O N E I S N ’ T D E A D . G O O G L E G L A S S I S N O T H E R E T O R E P L A C E Y O U R P H O N E .
PLAN FOR MICRO INTERACTIONS
DON’T ANNOY THE USER,
Playground
H T T P S : / / D E V E L O P E R S . G O O G L E . C O M / G L A S S / T O O L S - D O W N L O A D S / P L A Y G R O U N D
There is no emulator for glass, just the playground:
The card
The body
P R E - R E Q U I S I T E S :
• A Macintosh or PC
• A Gmail account
• Internet Serviceand most importantly:
• Positive attitude!but…
C U R I O U S FA C T:
Y O U D O N ’ T N E E D G O O G L E G L A S S T O START D E V E L O P I N G F O R M I R R O R A P I , B U T I T I S R E C O M M E N D E D T O T E S T O N A D E V I C E W H E N Y O U ’ R E R E A D Y T O S H O W T H E U S E R .
S E T T I N G T H E E N V I R O N M E N T F O R
D O W N L O A D J D K F R O M S T E P 1
http://www.oracle.com/technetwork/java/javase/downloads/index.html
**If you get a versioning problem, try JDK 7.
D O W N L O A D B I N A R Y M AV E N F R O MS T E P 2
http://maven.apache.org/download.cgi
Maven will gladly compile the project for us and also download all the external libraries your project
will use.
D O W N L O A D G O O G L E A P P E N G I N E F I L E S F O R J AVA F R O M
S T E P 3
https://developers.google.com/appengine/downloads
CLICK FIRST
You need the SDK to upload the project to Google App Engine.
E N V I R O N M E N T VA R I A B L E S W I N D O W S
S T E P 4
JAVA_HOME C:\<path to java>\jdk1.8.0_11
JAVA %JAVA_HOME%\bin
M2_HOME C:\<path to mvn>\apache-maven-3.2.2-bin\apache-maven-3.2.2
M2 %M2_HOME%\bin
GAE_HOME C:\<path to gae>\appengine-java-sdk-1.9.8\appengine-java-sdk-1.9.8
GAE %GAE_HOME%\bin
PATH %Path%;%JAVA%;%M2%;%GAE%
Open PC info, Advanced System Settings, Environment Variables and add the following variables (locally, top part). Modify the paths to where you have stored your folders. These are the recommended paths:
E N V I R O N M E N T VA R I A B L E S M A C I N T O S H
/*Modify the paths to where your folders are stored. These are the recommended settings. */
//Open terminal
vim ~/.bash_profile
//press “i” to insert:
export M2_HOME=/Users/<path to mvn>/apache-maven-3.2.2 export M2=$M2_HOME/bin export GAE_HOME=/Users/<path to gae>/appengine-java-sdk-1.9.10 export GAE=$GAE_HOME/bin export PATH=$PATH:$M2:$GAE !//Press Esc, “:w” to write and “:q” to quit editor !//It’s not necessary to add JDK here but you need to have it installed.
G O T O T H E C O N S O L E A N D C L I C K N E W P R O J E C T
S T E P 5
https://console.developers.google.com/
This will be the URL of your site!
Keep it handy!
1
Look for the word “Mirror” and turn on Google Mirror API
2
3
Check terms and click “Accept”
4
1
Add Email
Add Name
This is fairly new, Google asks for a name and email to run a project. Save changes.
1
2
Write those URLs but change
the project ID for the one you created!
3
4
D O W N L O A D T H E J AVA Q U I C K S TA R T P R O J E C T F R O M
S T E P 6
https://github.com/googleglass/mirror-quickstart-java
Download Zip
U N Z I P T H E F I L E A N D I M P O R T I N E C L I P S E
1
2
1
Browse to the root where the pom.xml file is, and click finish.
2
Spread the folder tree, and search for the
src/main/resourcesoauth.properties
Copy the client id and secret from the OAuth page in the google developers console to the oauth file,
and save.
2
Create an “appengine-web.xml” file in the WEB-INF folder
1
2
Add the following text and in the <application> tag change the application id to the project you created!
In the pom.xml file, add the <packaging> line after the <version> tag.
1
2
O P E N A T E R M I N A L O R C O M M A N D P R O M P T A N D C D T O W H E R E T H E P O M . X M L F I L E I S L O C AT E D A N D R U N :
mvn clean install !
mvn war:war !
mvn jetty:run !
open a browser and visit -> http://localhost:8080
R U N O N L O C A L H O S T:
M A K E S U R E E V E R Y T H I N G R U N S W E L L O N L O C A L H O S T B E F O R E U P L O A D I N G T O G O O G L E A P P E N G I N E .
T O S T O P T H E J E T T Y S E R V E R , J U S T C O N T R O L + C T H E T E R M I N A L /C O M M A N D P R O M P T
Mac/Windows
Free server to upload your project to:
B E F O R E U P L O A D I N G F R O M W I N D O W S … F I N D T H E “ A P P C F G . C M D ” F I L E I N T H E G O O G L E A P P E N G I N E S D K /B I N F O L D E R
change the word “java” for the location of your JDK so it doesn’t use the JRE. Use quotations.
W I N D O W SR U N N I N G O N G O O G L E A P P E N G I N E
Open a cmd window and CD to where the pom.xml file is.
!
mvn clean install !
mvn war:war !
Modify the path to where your project is stored: !
appcfg.cmd update C:\<path to glass-java-starter>\target\ glass-java-starter-0.1-SNAPSHOT
M A C I N T O S HR U N N I N G O N G O O G L E A P P E N G I N E
Open a terminal window and CD to where the pom.xml file is
!
mvn clean install !
mvn war:war !
Modify the path to where your project is stored: !
appcfg.sh update /Users/<path to glass-java-starter>/target/glass-java-starter-0.1-SNAPSHOT
If everything goes well… head over to your browser and go to:
your_project_id.appspot.com!
1Y O U C A N A LW AY S C H E C K T H E L O G S I N T H E C O N S O L E . D E V E L O P E R S . G O O G L E . C O M T O I N V E S T I G AT E T H E I S S U E S .
I F S O M E T H I N G I S W R O N G W I T H Y O U R G O O G L E A P P E N G I N E A P P L I C A T I O N ,
Sometimes Google App Engine is not the best solution for your application…
Mirror API applications can run on both Google Compute Engine and Amazon Web Services.
Google works with a Debian image and amazon works with multiple vm images. The server comes empty and you must install
everything from scratch.
T H E S T R U C T U R E O F T H E P R O J E C T
The only classes/files you need to modify:
I F Y O U N E E D T O A D D J A R S …
Search for the name of the jar file in the maven repository in Google and copy the code to the pom.xml file under the <dependencies> tag.
1
2
E X E R C I S E T I M E !
D E S I G N Y O U R O W N C A R D
Get the “ex1.html” file from the zip file you downloaded and modify HTML to your taste.
When done, put all your HTML in one line.
Use Playground to see how it will look. We will insert that card into our Google Glass Timelines.
https://developers.google.com/glass/tools-downloads/playground
S A M P L E H T M L F O R C A R D
Open the index.jsp file and find the following lines:
Just underneath, you should find one of this blocks of code: (next slide)
1
Copy paste this block and change the underlined text
In the MainServlet.java file, go to line number
117 to the else if statement
Your HTML string has to be in one long line!
Copy paste that if else statement right below
and replace the if for this text:
This is the “value” in the input tag we did before
in the index.jsp file!
S AV E A L L T H E F I L E S !
O P E N A T E R M I N A L O R C O M M A N D P R O M P T A N D C D T O W H E R E T H E P O M . X M L F I L E I S L O C AT E D A N D R U N :
mvn clean install !
mvn war:war !
mvn jetty:run !
open a browser and visit -> http://localhost:8080
R U N O N L O C A L H O S T:
M A K E S U R E E V E R Y T H I N G R U N S W E L L O N L O C A L H O S T B E F O R E U P L O A D I N G T O G O O G L E A P P E N G I N E .
CREATED BUTTON
Click it.
T H E C A R D W I L L G O F R O M Y O U R A P P L I C AT I O N T O G O O G L E S E R V E R S T O T H E G L A S S D E V I C E R E G I S T E R E D W I T H T H E E M A I L U S E D T O L O G I N T O T H E A P P L I C AT I O N .
If you see this, it means the card was sent successfully and it was added to your timeline (even if you
don’t own a pair of Google Glasses)
O K , W H AT N O W ?
T O G I V E T H E A P P L I C AT I O N T O Y O U R U S E R S
You simply have to give them the URL of your project, and have them login with their credentials and configure the settings on the browser, not glass!
It’s that easy!
U S E F U L L I N K S / B O O K S• https://developers.google.com/glass/design/ui
• https://developers.google.com/glass/develop/overview
DESIGN
CODE
And so we’ve come to the end of the presentation!
My contact information: Diana Melara