Open the camera or gallery from "inappbrowser" in Apache Cordova
I have a hybrid application developed using Apache Cordova, inside this application I am using "inappbrowser". Now it is necessary to open Camera or Gallery from inappbrowser, I cannot figure out how to achieve this.
I am using backbone.js, JQuery, bootstrap.js to develop this app.
Here is the Backbone View code snippet:
var mainScreenView = Backbone.View.extend({
el: $('.panel'),
templateMainScreen: _.template($('#templateOne').html()),
events: {
"click #inputBtnSubmit": "openWebView",
"click #clickSettings": "openSettings"
},
initialize: function(){
this.render();
},
render: function () {
alert($(this.el).find('.panel-body'));
var bindElement = $(this.el).find('.panel-body');
bindElement.html(this.templateMainScreen());
return this;
},
openWebView: function () {
var textValue = $('#inputValue').val();
cordova.InAppBrowser.open('**Link to an external webpage which asks for Camera or Gallery control** ', '_blank', 'location=no');
// After inappbrowser is called to load a external webpage (On a button click Camera Intent or Gallery should open)
}
});
var appView = new mainScreenView;
Thanks in advance.
source to share
Instead of using inappBrowser, I ended up implementing an HTML iframe. That is, what I wanted to do inappBrowser, now I can use an iframe. You can have access to Camera or Gallery or File Explorer similar to Native Phone Browser.
Here's what I did to solve the above problem:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=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" />
<title>Hello World!</title>
<style type='text/css'>
body, html, iframe {
margin: 0;
padding: 0;
border: 0px none;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<script type="text/javascript" src="cordova.js"></script>
<iframe src="http://SomeWebPage" width="97%" height="97%"></iframe>
</body>
Hope it helps others.
source to share
Try this plugin if it helps http://plugins.cordova.io/#/package/com.synconset.imagepicker
It should work for inappbrowser.
source to share
The reason for this is the web browsing of Cordoba. Just replace inAppBrowser with your site url and install this plugin. It will include Chromnium in your Cordova app.
https://github.com/crosswalk-project/cordova-plugin-crosswalk-webview
source to share