2. VOORAF
Samenwerkingsverband van
zelfstandige APEX professionals
smart4apex.nl
75 APEX sessions in 4 days +
Symposium day with Oracle Dev Team
kscope13.com
3. AGENDA
• PhoneGap: Concept en Architectuur
• APEX & PhoneGap
• PhoneGap API (met APEX)
• Cross Platform App Development
9. WAAROM PHONEGAP
Easily create apps using the web technologies
you know and love: HTML, CSS, and JavaScript
PhoneGap is a free and open source framework that allows you to create
mobile apps using standardized web APIs
10. APP = WEBVIEW +
PHONEGAP FRAMEWORK
Native OS
PhoneGap Container App
WebView
JavaScript API
Native API
<HTML />
{CSS;}
Javascript();
images.png
11. INSTALLATIE PHONEGAP VOOR
ANDROID
• Eclipse
• Android SDK
• Android Development Tools (ADT)
Plugin voor Eclipse IDE
• Apache Cordova (PhoneGap)
http://www.phonegap.com
13. VRAAG
Hoe krijgen wij APEX in de
PhoneGap WebView Container?
14. APEX & PHONEGAP
A. APEX URL ipv index.html aanroepen
in MainActivity.java:
super.loadUrl("http://apex.oracle.com/pls/apex/f?p=41097:1");
B. PhoneGap libraries in APEX pagina’s
opnemen
15. DOMAIN WHITELIST
• Domain Whitelisting is een security model om
toegang tot servers buiten de WebView
Containers te controleren.
• Standaard worden alle aanroepen in het net
geblokkeerd.
• De ontwikkelaar kan toegang tot (sub-)
domeinen declareren.
20. CAMERA API SCRIPT 1
document.addEventListener("deviceready", onDeviceReady, onFa
il);
// Cordova is ready to be used!
//
function onDeviceReady() {
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
console.log('Device ready!');
}
21. CAMERA API SCRIPT 2
// A button will call this function
//
function capturePhoto() {
// Take picture using device camera
// and retrieve image as base64-encoded string
navigator.camera.getPicture(
onPhotoDataSuccess
, onFail
, {quality: 50
,destinationType: destinationType.DATA_URL}
);
}
22. CAMERA API SCRIPT 3
function onPhotoDataSuccess(imageData) {
// Unhide image element
$("#smallImage").css("display", "block");
// Show the captured photo
$("#smallImage").attr(
"src"
, "data:image/jpg;base64," + imageData);
// Copy image data
staticImg = imageData;
}
23. APEX: BASE64 -> CLOB
// Function to upload CLOB data using APEX AJAX API
function clob_set() {
var clob_ob = new apex.ajax.clob(
function() {
var rs = p.readyState
if (rs == 1 || rs == 2 || rs == 3) {
$.mobile.showPageLoadingMsg();
} else if (rs == 4) {
$s('P1_RESPONSE', p.responseText);
$.mobile.hidePageLoadingMsg()
} else {
return false;
}
});
clob_ob._set(staticImg);
}
http://carlback.blogspot.nl/2008/04/new-stuff-4-over-head-with-clob.html
24. APEX: BASE64 -> CLOB
DECLARE
l_clob CLOB;
l_blob BLOB;
l_id NUMBER;
BEGIN
-- fetch the image CLOB from the collection
SELECT clob001
INTO l_clob
FROM apex_collections
WHERE collection_name = 'CLOB_CONTENT';
l_id := blob_test_seq.NEXTVAL;
-- convert base64 CLOB into BLOB image
l_blob := apex_web_service.clobbase642blob(l_clob);
INSERT INTO blob_test(id, blob_content, mime_type, file_name)
VALUES (l_id, l_blob, 'image/jpeg', 'image' || l_id || '.jpg');
END;
http://carlback.blogspot.nl/2008/04/new-stuff-4-over-head-with-clob.html