I'm starting out with PhoneGap, trying to write my first Android plugin. I am basing it on the Echo example from the docs. It compiles and installs, but the call to exec doesn't seem to work. Can anyone suggest what is wrong? The index.html, Java code and config.xml are below. I get the alert msg for "running exec" but then nothing.
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<meta name="msapplication-tap-highlight" content="no" />
<title>PhoneGap Test App.</title>
<script type="text/javascript">
</script>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
<a onclick="runPlugin()" href="javascript:void(0);">Run Plugin</a><br>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
function runPlugin() {
alert('running exec')
exec(function(result){ alert('ok: '+result);}, function(err){ alert('Error: '+err);}, 'Echo', 'echo', ['fred']);
alert('exec has run')
}
</script>
</body>
</html>
package org.apache.cordova.plugin;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.PluginResult;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
/**
* This class echoes a string called from JavaScript.
*/
public class Echo extends CordovaPlugin {
/**
* Executes the request and returns PluginResult.
*
* #param action The action to execute.
* #param args JSONArry of arguments for the plugin.
* #param callbackId The callback id used when calling back into JavaScript.
* #return A PluginResult object with a status and message.
*/
public PluginResult execute(String action, JSONArray args, String callbackId) {
try {
if (action.equals("echo")) {
String echo = args.getString(0);
if (echo != null && echo.length() > 0) {
return new PluginResult(PluginResult.Status.OK, echo);
} else {
return new PluginResult(PluginResult.Status.ERROR);
}
} else {
return new PluginResult(PluginResult.Status.INVALID_ACTION);
}
} catch (JSONException e) {
return new PluginResult(PluginResult.Status.JSON_EXCEPTION);
}
}
}
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.abc" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>PhoneGapTest</name>
<description>
Phonegap app. to test Wifi.
</description>
<author email="vkuruthers#gmail.com" href="http://a.com">
</author>
<content src="index.html" />
<access origin="*" />
<plugin name="Echo" value="org.apache.cordova.plugin.Echo" />
</widget>
Related
I get this error with a Parse.com JS App:
ReferenceError: Parse is not defined.
I really don't know why. Everything looks good to me. The files are linked correctly; I've checked this a few times. Is it not true, that I have to put my own JS right below Parse and it should work? This is what I've read here: Github Project
I use Chrome with the ripple extension. I serve the app via cordova serve
Any help much appreciated!
Here is index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="../css/index.css" />
<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css" />
<title>Zone</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-latest.js"></script>
<script type="text/javascript" src="../js/main.js"></script>
</head>
<body>
<img src="../img/site-logo.png" rel="external" class="logo">
<!-- <div class="site-menu">
<i class="fa fa-angle-double-left"></i><p class="title"></p><i></i>
</div> -->
<img src="img/suche.jpg" class="icon">
<img src="img/essentrinken.jpg" class="icon">
<img src="img/einkaufen.jpg" class="icon">
<img src="img/kultur.jpg" class="icon">
<img src="img/dienstleistungen.jpg" class="icon">
<img src="img/nuetzlich.jpg" class="icon">
<img src="img/nummern.jpg" class="icon">
<img src="img/sport.jpg" class="icon">
<img src="img/verwaltung.jpg" class="icon">
<img src="img/hotel.jpg" class="icon">
<img src="img/neuzuzuger.jpg" class="icon">
<div class="adad"></div>
<script type="text/javascript" src="../cordova.js"></script>
<script type="text/javascript" src="../js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
And here the JS file.
$(document).ready(function () {
Parse.initialize("", "");
var Ad = Parse.Object.extend("Ads");
function getPosts() {
var query = new Parse.Query(Ad);
query.find({
success: function (results) {
console.log("hello");
var output = "";
for (var i in results) {
var name = results[i].get("location");
if (name == 10) {
output += "<img src = '" + imageurl + "' class='media-object' height='60' width='100'>"
}
}
$("#adad").html(output);
console.log(output);
},
error: function (error) {
console.log("Query error:" + error.message);
}
});
}
getPosts();
});
I'm sorry, I have no experience with Cordova, but in general I've seen problems like these being caused by live reloading of files or by asynchronous loading, which could be caused by cordova/gulp/nodejs.
Maybe you should use a require statement as shown on the Parse quick start guide: var Parse = require('parse');
When I try your html and javascript in jsfiddle it just works, so it should have something to do with the order of loading js files in your local "webserver".
The problem could be that the parse CDN was not found i.e . download the SDK and host it yourself instead
Just run into the same issue. You are most likely missing the reference to parse.min.js.
The reference is typically in your index.html file, inside the header:
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<meta http-equiv="Content-Security-Policy"/>
<script type="text/javascript" src="cordova.js"></script>
<! ---- LOOK HERE --------->
<script src="js/parse.min.js"></script>
<! ---- LOOK HERE --------->
<link rel="stylesheet" type="text/css" href="css/one.css" />
<title>Title</title>
</head>
<body>
<div id="app"></div>
</body>
</html>
I am fairly new to programming, and I am trying to build my very first phonegap app. I am trying to play some sounds which are located in my /www/sounds/ folder. However, when I am running index.html in my browser (chrome) I get the 'Uncaught ReferenceError: Media is not defined" error.
This is my HTML:
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<!--jQuery mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<div id="files-list-page" data-role="page">
<header data-role="header">
<h1>Fragmenten</h1>
</header>
<div data-role="content">
<ul id="files-list" data-role="listview" data-autodividers="true" data-filter="false" data-split-icon="delete">
<audio id="fr1" src="sounds/5euros.mp3" type="audio/mp3" ></audio>
</ul>
<button id="btn1" class=ui-btn" onclick="playAudio('sounds/5euros.mp3')">Play</button>
</div>
<footer data-role="footer">
<h3 id="copyright-title">Soundboard</h3>
</footer>
</div>
</body>
And this is my JS:
var app = {
// Application Constructor
initialize: function() {
this.bindEvents();
},
// Bind Event Listeners
//
// Bind any events that are required on startup. Common events are:
// 'load', 'deviceready', 'offline', and 'online'.
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function() {
app.receivedEvent('deviceready');
},
// Update DOM on a Received Event
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
}
};
app.initialize();
// Play audio
//
function playAudio(url) {
// Play the audio file at url
var my_media = new Media(url,
// success callback
function () {
console.log("playAudio():Audio Success");
},
// error callback
function (err) {
console.log("playAudio():Audio Error: " + err);
}
);
// Play audio
my_media.play();
}
My config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.martijn.HuisbaasBob" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>HuisbaasBob</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
</widget>
Any suggestions would be of great help, thanks in advance!
You need to add this lines in ur config.xml to get your plugin worked...
(in app/res/xml/config.xml)
<feature name="Media">
<param name="android-package" value="org.apache.cordova.media.AudioHandler" />
</feature>
"Uncaught ReferenceError: Media is not defined" mean your code couldn't able to recognize it... meaning "not configured"
I am following this tutorial:
http://www.indiageeks.in/phonegap-jquery-ajax-example-jsonjavascript-object-notation-response/
but when I press the buttons the request not sent
this is my code
and when check the console I get this
it iays thet my function " connect is not defined "
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link href="jQueryMobile/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="jQueryMobile/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
<title>Taha king</title>
<script charset="utf−8" type="text/javascript">
function connect(e){
alert("mmmmmmmmmmmm");
var term= {button:e};
$.ajax({
url:'http://www.indiageeks.in/tutorials/reply.php',
type:'POST',
data:term,
dataType:'json',
error:function(jqXHR,text_status,strError){
alert(“no connection”);
},
timeout:60000,
success:function(data){
$("#result").html("");
for(var i in data){
$("#result").append("<li>"+data[i]+"</li>");
}
}
});}
</script>
</head>
<body>
<div data-role="header">
<h1>Your resource app</h1>
</div>
<div dara-role="content">
<center><b>Bikes or Cars</b></center>
<center><input onclick="connect(this.value)" type="button" value="cars" /></center>
<center><input onclick="connect(this.value)" type="button" value="bikes" /></center>
<center><b>Results</b></center>
<ul id="result"></ul>
</div>
<div dara-role="footer">
<h4>© carsRent.ps</h4>
</div>
<!-- <script type="text/javascript" src="cordova.js"></script>-->
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
Try to remove this:
charset="utf−8"
from your script tag.
If you want utf-8 encoding there is no need for that since you are using:
<meta charset="utf-8">
connect() function was not exist. You forgot to insert it. please recheck again.
i have downloaded plugin FileOpener
and added in m,y project like this:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no">
<title>sample</title>
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css">
<link rel="stylesheet" href="css/adidas.css">
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.3.2.min.js"></script>
<script src="js/data_en.js"></script>
<script src="js/data_sp.js"></script>
<script src="js/adidas.js"></script>
<script src="js/cordova.js"></script>
<script src="js/video.js"></script>
<script src="js/fileopener.js"></script>
</head>
<body>
<div data-role="page" data-theme="a" class="my-page" id="video">
<video id="video_player" src="#" controls="controls"></video>
</div>
</body>
in js file
$(document).on('pagebeforeshow',"#video", function () {
var xyz = document.getElementById('video_player');
alert("values xyz:" + xyz);
var x = window.plugins.fileOpener.open("file:///android_asset/www/videos/1974.mp4");
xyz.src = window.plugins.fileOpener.open("file:///android_asset/www/balls/1970.png");
alert("opener:" + x);
window.plugins.videoPlayer.play(x);
alert("xyz after src:" + xyz);
});
i am failed to open any video file/ images from assets/www/videos/abcd.mp4 and similar for images
now everything is working fine but this is alert when trying to hit play button :
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no">
<title>sample</title>
<script src="js/cordova.js"></script>
<script src="js/video.js"></script>
<script src="js/fileopener.js"></script>
<script src="js/ADD_ANY_JQUERY.MIN.JS"></script>
<script>
function openFile(filePath)
{
window.plugins.fileOpener.open(filePath);
}
</script
</head>
<body>
<div data-role="page" data-theme="a" class="my-page" id="video">
<img src="img/b_img1.png" onclick="openFile('file:///android_asset/www/videos/1974.mp4')"/>
</div>
</body>
Edited
Fileopener.js will be like this:
cordova.define("cordova/plugin/fileopener",
function(require, exports, module) {
var exec = require("cordova/exec");
var FileOpener = function () {};
FileOpener.prototype.open = function(url) {
exec(null, null, "FileOpener", "openFile", [url]);
};
FileOpener.prototype.setTAG = function(tag) {
exec(null, null, "FileOpener", "setTAG", [tag]);
};
var fileOpener = new FileOpener();
module.exports = fileOpener;
});
/**
* Load Plugin
*/
if (!window.plugins) {
window.plugins = {};
}
if (!window.plugins.fileOpener) {
window.plugins.fileOpener = cordova.require("cordova/plugin/fileopener");
}
"js/ADD_ANY_JQUERY.MIN.JS"
in this line add a any jquery.min.js
Lastly check that Cordova.js folder is in your js folder of your application.. And let me know if it is not working what's your logcat saying...
i was using cordova 2.9.0 , jquery 1.9.1 ,jqm-1.3.2 and android-sdk-version:14 after adding code i was getting error:logcat is:
01-06 19:36:53.132: D/PluginManager(9420): exec() call to unknown plugin: FileOpener
01-06 19:36:53.202: D/CordovaLog(9420): file:///android_asset/www/js/fileopener.js: Line 20 : Class not found
01-06 19:36:53.202: I/Web Console(9420): Class not found at file:///android_asset/www/js/fileopener.js:20
the solution of this problem is i have done mistake in config.xml and in plugin.xml:
config.xml replace this:
<feature name="videoplayer">
<param name="android-package" value= "com.adidas.football.app.videoPlayer.VideoPlayer"/>
</feature>
with:
<feature name="VideoPlayer">
<param name="android-package" value= "com.adidas.football.app.videoPlayer.VideoPlayer"/>
</feature>
plugin.xml replace this:
<plugin name="videoplayer" value= "com.adidas.football.app.videoPlayer.VideoPlayer"/>
with:
<plugin name="VideoPlayer" value= "com.adidas.football.app.videoPlayer.VideoPlayer"/>
a minor mistake of CAPITAL LETTER but it removes all error and finally i have no error except last one alert which i added in my edited question "cannot play video"
<?xml version="1.0" encoding="utf-8"?><widget xmlns="http://www.w3.org/ns/widgets" xmlns:rim="http://www.blackberry.com/ns/widgets" version="1.0.0" rim:header="ipaidabribenaija.com Breaking News and News Updates">
<name>ipaidabribenaija.com</name>
<description>First for Breaking News and News Updates</description>
<content src="index.html" rim:allowInvokeParams="true"/>
<author href="http://www.centurymegasystem.com" rim:copyright="Copyright 2012 wwww.ipaidabribenaija.com" email="josiahaccounts#gmail.com" xml:lang="en" its:dir="rtl" >Josiah Gerald</author>
<feature id="blackberry.invoke.BrowserArguments" />
<rim:connection timeout="25000">
<id>TCP_WIFI</id>
<id>MDS</id>
<id>BIS-B</id>
<id>TCP_CELLULAR</id>
<id>WAP2</id>
<id>WAP</id>
</rim:connection>
<license>Copyright (c) 2012 ipaidabribenaija.com.</license>
<icon src="images/icon.png" /></widget>
<!DOCTYPE html><html lang="en"><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Breaking News and News Updates</title>
<script type="text/javascript">
var args = new blackberry.invoke.BrowserArguments('http://www.ipaidabribenaija.com');
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
/*function openWebLinkInBrowser() {
// open web link in browser
blackberry.invoke.invoke({target: "sys.browser",uri: "http://www.ipaidabribenaija.com"});
}
openWebLinkInBrowser();*/
</script>
I am a newbie in this programming. I am given a task to develop an app for BlackBerry.
Once the app is launched, the browser will open to a specific URL.
I got a java code that does this. How can I achieve the same with BlackBerry Webwork API.
The code above is what I have achieve so far. However, the app is not launching the browser on load.
Thanks for your time and idea in advance.
<?xml version="1.0" encoding="utf-8"?><widget xmlns="http://www.w3.org/ns/widgets" xmlns:rim="http://www.blackberry.com/ns/widgets" version="1.0.0" rim:header="ipaidabribenaija.com Breaking News and News Updates">
<name>ipaidabribenaija.com</name>
<description>First for Breaking News and News Updates</description>
<content src="index.html" rim:allowInvokeParams="true"/>
<author href="http://www.centurymegasystem.com" rim:copyright="Copyright 2012 wwww.ipaidabribenaija.com" email="josiahaccounts#gmail.com" xml:lang="en" its:dir="rtl" >Josiah Gerald</author>
<feature id="blackberry.invoke.BrowserArguments" />
<feature id="blackberry.identity" />
<feature id="blackberry.invoke" />
<rim:connection timeout="25000">
<id>TCP_WIFI</id>
<id>MDS</id>
<id>BIS-B</id>
<id>TCP_CELLULAR</id>
<id>WAP2</id>
<id>WAP</id>
</rim:connection>
<license>(c) 2012 ipaidabribenaija.com.</license>
<icon src="images/icon.png" /></widget>
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Breaking News and News Updates</title>
<script type="text/javascript">
var args = new blackberry.invoke.BrowserArguments('http://www.ipaidabribenaija.com');
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
blackberry.app.exit();
</script>
The above code works fine, i tested it on BB simulator 9930.
Thanks for the help #HelpMeToHelpYou.
<script type="text/javascript">
var args = new blackberry.invoke.BrowserArguments('http://www.blackberry.com');
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
</script>
You must declare the feature element(s) below in your configuration document:according to following image
More information please visit
https://developer.blackberry.com/html5/apis/blackberry.invoke.browserarguments.html
Sample Code:
Please make sure that config files as following
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets"
xmlns:rim="http://www.blackberry.com/ns/widgets"
version="1.0" rim:header="WebWorks Sample">
<feature id="blackberry.invoke" />
<feature id="blackberry.invoke.BrowserArguments" />
<feature id="blackberry.identity" />
<name>Hello World</name>
<description>This is HelloWorld.</description>
<content src="index.html"/>
</widget>
And index.html as
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,
user-scalable=no">
<title>Hello World</title>
<script type="text/javascript">
function myFunction()
{
var args = new blackberry.invoke.BrowserArguments('http://www.blackberry.com');
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
}
</script>
</head>
<body onload="myFunction()">
<p>Hello World!</p>
</body>
</html>
try this