I am new to python on android and I am trying to buid the small example of a web application found here ( http://pythoncentral.io/python-for-android-using-webviews-sl4a/ ) where a python script opens a web page and communicates with it (you enter a text in the web page and the python script process it and send it back to the web page for display). In my attempt to do this the python script can open the page but there is no dialog between the web page and the script. It seems that the line " var android = new Android() " in the web page doesn't work as in the example.
Here is the code for the webpage :
<!DOCTYPE HTML>
<html>
<head>
<script>
var droid = new Android();
function postInput(input) {
if (event.keyCode == 13)
droid.eventPost('line', input)
droid.registerCallback('stdout', function(e) {
document.getElementById('output').innerHTML = e.data;
});
}
</script>
</head>
<body>
<div id="banner">
<h1>SL4A Webviews</h1>
<h2>Example: Python Evaluator</h2>
</div>
<input id="userin" type="text" spellcheck="false"
autofocus="autofocus" onkeyup="postInput(this.value)"
/>
<div id="output"></div>
<button id="killer" type="button"
onclick="droid.eventPost('kill', '')"
>QUIT</button>
</body>
</html>
and the python code launching the web page above :
import sys, androidhelper
droid = androidhelper.Android()
def line_handler(line):
''' Evaluate user input and print the result into a webview.
This function takes a line of user input and calls eval on
it, posting the result to the webview as a stdout event.
'''
output = str(eval(line))
droid.eventPost('stdout', output)
droid.webViewShow('file:///storage/emulated/0/com.hipipal.qpyplus/scripts/webview1.html')
while True:
event = droid.eventWait().result
if event['name'] == 'kill':
sys.exit()
elif event['name'] == 'line':
line_handler(event['data'])
I really don't understand how the Android() instance in the web page was supposed to work. Thank you for any help !
(I am running qpython with SL4A library on android lollipop)
Finally yesterday I found that qpython comes with a nice framework called Bottle. And it is very easy to use for a beginner like me.
from bottle import route, run, request, template
#route('/hello')
def hello():
line = ""
output = ""
return template('/storage/emulated/0/com.hipipal.qpyplus/webviewbottle2.tpl', line=line, output=output)
#route('/submit', method='POST')
def submit():
line = request.forms.get('line')
output = str(eval(line))
return template('/storage/emulated/0/com.hipipal.qpyplus/webviewbottle2.tpl', line=line, output=output)
run(host='localhost', port=8080, debug=True)
# open a web browser with http://127.0.0.1:8080/hello to start
# enter 40 + 2 in the input and "submit" to get the answer in the output window.
and the template file :
<h1>bottle Webview</h1>
<h2>Example: Python Evaluator</h2>
<form action="/submit" method = "post">
<input name="line" type = "text" value = {{line}}><br>
<input name="output" type = "text" value = {{output}}>
<button name="submit" type = "submit">submit</button>
</form>
Related
Hi got following code from sitepoint:
<!DOCTYPE HTML>
<html>
<head>
<style>
body, input {font-size:14pt}
input, label {vertical-align:middle}
.qrcode-text {padding-right:1.7em; margin-right:0}
.qrcode-text-btn {display:inline-block; background:url(//dab1nmslvvntp.cloudfront.net/wp-content/uploads/2017/07/1499401426qr_icon.svg) 50% 50% no-repeat; height:1em; width:1.7em; margin-left:-1.7em; cursor:pointer}
.qrcode-text-btn > input[type=file] {position:absolute; overflow:hidden; width:1px; height:1px; opacity:0}
</style>
</head>
<body>
<input type=text size=16 placeholder="Tracking Code" class=qrcode-text>
<label class=qrcode-text-btn><input type=file accept="image/*" capture=environment onclick="return showQRIntro();" onchange="openQRCamera(this);" tabindex=-1></label>
<input type=button value="Go" disabled>
<script src="qr_packed.js"></script>
<script>
function openQRCamera(node) {
var reader = new FileReader();
reader.onload = function() {
node.value = "";
qrcode.callback = function(res) {
if(res instanceof Error) {
alert("No QR code found. Please make sure the QR code is within the camera's frame and try again.");
} else {
node.parentNode.previousElementSibling.value = res;
}
};
qrcode.decode(reader.result);
};
reader.readAsDataURL(node.files[0]);
}
function showQRIntro() {
return confirm("Use your camera to take a picture of a QR code.");
}
</script>
</body>
</html>
In this code on click of QR icon Mobile camera is opened. But I want to open camera on page lode in specified area of web page. My screen design is below:
My requirement is below:
By default mobile camera or webcam in PC/laptop should open and start scanning. After scanning the code should display in input box.
On click of QR icon file upload opens, after QR image upload, the code appears in input box
OR user can type/copy paste QR code received in the input box.
I've create one code after modifying webqr.com which is working fine on desktop/ laptop and android device but camera is not opening in ios device and macbook.
Hence I searched and found above code which is able to open camera in iphone and ipad. But have no idea how to achieve my above mentioned requirement.
In an Android Webview I'm displaying a page with an HTML button that only works fine when it makes a GET request. This button loads a PDF document in the browser when it's working correctly.
I need this to be a POST request, however, because I was passing a lot of data in the query string, but when making a POST request nothing happens at all (on a smartphone) or the downloaded file is corrupted (on a tablet). The same button works perfectly fine when clicked on a Windows browser, whichever of GET or POST is used.
Here's the JS code and the HTML that makes the call:
function ExportPDF()
{
var name = document.getElementById('lblName').innerHTML;
var surname = document.getElementById('lblSurname').innerHTML;
var div = '<form id="myform" method="post" action="URL"><input type="hidden" name="Name" value="'+name+'"><input type="hidden" name="Surname" value="'+surname+'"></form>';
jQuery('#divExportPDF').append(div);
jQuery('#myform').submit();
}
<button class="btnExport" onclick="ExportPDF()">EXPORT TO PDF</button>
<div id="divExportPDF"></div>
I am a beginner in learning Android app development. Here is my issue
I am using the eclipse given along with Android SDK to develop the Apps. To web enable the Apps i have used phonegap build tutorial to add cordova API. Now i am able to see the html file if i just use a normal HTML controls or text. But i have a code which calls a webservice from another WebSphere server and displays the data. When i run the code in IIS server (using DreanWeaver IDE) it works perfectly. But when i try to run this as an app in the emulator (From Android SDK) i dont see any output from the webservice. I can't even see a call from the android app to my webspehere server (which i can see when i run this code as a web page in Dreamweaver). Here is my index.html code. I have included the ws.js and prototype.js inside assets/www/scripts/ if anyone is wondering about that. Can somebody help me to resolve this issue.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8">
<script type="text/javascript" src="scripts/prototype.js"></script>
<script type="text/javascript" src="scripts/ws.js"></script>
<script type="text/javascript">
function onBodyLoad(name, container)
{
console.log("Here1");
var call = new WS.Call('http://localhost:9080/ILM/services/ILMReports');
var nsuri = '';
var qn_op = new WS.QName('getInboundSearchByItemReport',nsuri);
var qn_op_resp = new WS.QName('getInboundSearchByItemReportResponse',nsuri);
call.invoke_rpc(
qn_op,
new Array(
{name:'name',value:name}
),null,
function(call,envelope) {
var ret =
envelope.get_body().get_all_children()[0].
get_all_children()[0].get_value();
container.innerHTML = ret;
}
);
/*window.location = "TestingAJAXWS.html";*/
}
function onDeviceReady()
{
// do your thing!
navigator.notification.alert("PhoneGap is working")
}
</script>
</head>
<body onload="onBodyLoad('aaa',$('result'))">
<h1>Hey, it's PhoneGap!</h1>
</body>
The problem i can see is the localhost address you are using to access the web service.
Somehow android emulator don't allow to the localhost address as it is unknown to the emulator. (if you know the reason please write)
This is an old thread. But i hope it'l help somebody else.
/T
i'm developing an app for iOS and Android with Phonegap 2.1.0 and jQuery Mobile 1.2.0. iOS version is already finished but we are experimenting some problems with the Android one...
One of the app sections is a list of videos and they are opened in a iframe inside a pop up, in iOS works well but if we try this in an Android device (Nexus 7 with Android 4.2) we only get the fist screenshot and when we press play only sound is played, without video. We've tryed to open the iframe url with childbrowser in a webview and the result is the same. Only if we open it in an external browser (openExternal) it seems to work.
I think maybe is Vimeo's player problem, but when we try to play the videos, we see this errors in the log:
01-08 22:45:12.084: E/libEGL(26580): call to OpenGL ES API with no current context (logged once per thread)
01-08 22:45:12.094: D/MediaPlayer(26580): Couldn't open file on client side, trying server side
I've been searching for hours without success, so i expect someone may know how to make it works... :/
For the iFrame, we are using the code Vimeo's giving us from the embed section of each video (i can´t post them here cause theyre private), and... Vimeo's option to make video compatible with mobile devices is marked as well.
Thanks!
HTML
<head>
<meta charset="utf-8">
<!--
| 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="width=device-width,height=device-height,target-densitydpi=device-dpi,user-scalable=no,initial-scale=1,minimum-scale=1,maximum-scale=1,minimal-ui">
</head>
<body>
<div class="close">
fechar
</div>
<script id="tmpl-player" type="text/template">
<iframe id="video" src="https://player.vimeo.com/video/[[video]]?autoplay=1&autopause=1&byline=0&badge=0&title=0&portrait=1&color=333&loop=0" width="100%" height="100%" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</script>
<script>
var bodyEl = document.querySelector('body');
var tmplPlayerEl = window.document.getElementById('tmpl-player');
var tmplPlayer = template(tmplPlayerEl.innerHTML, getURLParams());
function getURLParams() {
var query = location.search.substr(1);
var result = {};
query.split('&').forEach(function(part) {
var item = part.split('=');
result[item[0]] = decodeURIComponent(item[1]);
});
return result;
}
function template(raw, data, keep404) {
return raw.replace(/\[{2,}[(\s\uFEFF\xA0a-zA-Z0-9_\./]+\]{2,}/gi, function(match, value) {
value = match.replace(/^\[{2,}|\s+|\]{2,}$/g, '');
return typeof data[value] !== 'undefined' ? data[value] : (keep404 ? match : '');
});
}
var newNode = window.document.createElement('div');
newNode.innerHTML = tmplPlayer;
bodyEl.appendChild(newNode);
</script>
</body>
JAVASCRIPT:
var fsVideo = window.open('vimeo.html?video='+video, '_blank', 'location=no,zoom=no');
fsVideo.addEventListener('loaderror', onLoadError);
fsVideo.addEventListener('loadstop', onLoadStop);
fsVideo.addEventListener('exit', onExit);
function onLoadError(evt){
fsVideo.close();
}
function onLoadStop(evt){
evt.url.match('cordova:close') && fsVideo.close();
}
function onExit(evt){
fsVideo.removeEventListener('loaderror', onLoadError);
fsVideo.removeEventListener('loadstop', onLoadStop);
fsVideo.removeEventListener('exit', onExit);
fsVideo = null;
}
Don't forget https://github.com/apache/cordova-plugin-inappbrowser
I have been working on calling a simple web service in html5 from Android Browser(Android 2.2). Its not working on Android browser. But, it works if i run it on a PC. Nothing happens when i click the button. I have been on net for couple of weeks now. But, didn't get anything to work. Below is the code of the html page. please help.
<html>
<head>
<title>UseSwap</title>
<script language="JavaScript">
function InitializeService(){
service.useService("http://localhost:2913/WebServicesUsingCSharp/WebService.asmx?wsdl",
"GetAgeService");
}
var StrYear, StrMonth, StrDay;
function GetAge(){
StrYear = document.DemoForm.StringYear.value;
StrMonth = document.DemoForm.StringMonth.value;
StrDay = document.DemoForm.StringDay.value;
service.GetAgeService.callService("GetAge", StrYear, StrMonth, StrDay);
}
function ShowResult(){
alert(event.result.value);
}
</script>
</head>
<body onload="InitializeService()" id="service"
style="behavior:url(webservice.htc)" onresult="ShowResult()">
<form name="DemoForm">
Year : <input type="text" name="StringYear"/>
Month : <input type="text" name="StringMonth"/>
Day : <input type="text" name="StringDay"/>
<button onclick="GetAge()">Get Age</button>
</form>
</body>
</html>
Regards,
Parshant.
your html references a service on the same machine
http://localhost:2913
i dont think that you have the webservice running on your android phone.
replace localhost with the ip of your server