I stored images in sqlite database by converting it in base64 format and inserted into DB.It was inserted succssfuly as i got insert id after inserting records but when i opened my db the database's table wasnt having any column .Is that correct ??.
And my second problem is i want to fetch image and display it in the particular area i.e pictureUrl (here) but unable to do so. Below is my code. Suggest the changes required. Thanks in advance :)
app.js
var db=null;
var example=angular.module('starter', ['ionic', 'ngCordova']).run(function($ionicPlatform, $cordovaSQLite) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
db = window.openDatabase("my.db","1.0","my.db",100000);
$cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS imagewala (img blob)");
window.alert("Database Created .. !")
});
example.controller('CameraCtrl',function($scope, $cordovaCamera,$cordovaSQLite){
function dataURItoBlob(dataURI, callback) {
var byteString = atob(dataURI.split(',')[1]);
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]
var ab = new ArrayBuffer(byteString.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
var bb = new BlobBuilder();
bb.append(ab);
return bb.getBlob(mimeString);
}
$scope.pictureUrl="http://placehold.it/50x50";
$scope.takePicture=function(img){
var options = {
destinationType: Camera.DestinationType.DATA_URL,
encodingType: Camera.EncodingType.JPEG
};
$cordovaCamera.getPicture(options).then(function(imageData) {
$scope.pictureUrl = "data:image/jpeg;base64," + imageData;
var query = "INSERT INTO imagewala (img) VALUES (?)";
$cordovaSQLite.execute(db, query, [img]).then(function(res) {
window.alert("INSERT ID -> " + res.insertId);
}, function (err) {
window.alert(err);
});
window.alert("Picture Captured .. !!");
}, function(err) {
window.alert("Error hai baaaa..!!"+err);
});
}
$scope.takePhoto=function(){
var options = {
destinationType: Camera.DestinationType.DATA_URL,
sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM,
encodingType: Camera.EncodingType.JPEG
};
$cordovaCamera.getPicture(options).then(function(imageData) {
$scope.pictureUrl = "data:image/jpeg;base64," + imageData;
window.alert("Picture Captured .. !!");
}, function(err) {
window.alert("Error hai baaaa..!!"+err.message);
});
}
$scopr.selectPhoto= function () {
var query = "select img from imagewala";
$cordovaSQLite.execute(db, query, []).then(function(res) {
window.alert("SELECT ID -> " + res.insertId);
$scope.pictureUrl=res.readAsArrayBuffer();
window.alert("ahahaha");
}, function (err) {
window.alert(err);
});
window.alert("Photo Captured .. !!");
}
});
Index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<script>
window.location='./main.html';
</script>
</head>
<body>
</body>
</html>
Main.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ionic/js/ng-cordova.js"></script>
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-app="starter" ng-controller="CameraCtrl">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Camera</h1>
</ion-header-bar>
<ion-content >
<div class="list card">
<div class="item item-image">
<img src="{{pictureUrl}}">
</div>
</div>
<div class="padding">
<button ng-click="takePicture(pictureUrl)" class="button button-block button-calm">Take Picture</button>
<button ng-click="takePhoto()" class="button button-block button-positive">Choose Picture</button>
<button ng-click="selectPhoto()" class="button button-block button-assertive">Choose Picture</button>
</div>
</ion-content>
</ion-pane>
</body>
</html>
As per my knowledge cordova sqlite plugin doesn't support blob data type, Try to change data type img to TEXT data type and check.
I hope this solves your problem
Related
I'm not able to go through all children of an SVG file in JavaScript. I want to go through all the paths and perform a function on them(changing them to polygons).
I've tried creating an array of paths using querySelectorAll("path");, but it didn't work. Now I'm trying to sift through all the elements in the SVG file, converting paths as I go.
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Reader</title>
</head>
<body>
<input type="file" id="fileReader" />
<br>
<p id="Content"></p>
<script>
document.getElementById("fileReader").addEventListener('change',function(){
var fr = new FileReader();
fr.onload = function(){
console.log("File Loaded!")
}
parser = new DOMParser();
var doc = parser.parseFromString(fr.readAsText(this.files[0]), "text/xml");
console.log(doc);
var path = "path";
doc.querySelectorAll('*').forEach(function(){
if($(this).is(path)){
var polygon = doc.createElementNS("http://www.w3.org/2000/svg", "polygon");
polygon.setAttribute("id", $(this).getAttribute("id"));
console.log("Converting " + $(this).getAttribute("id"));
var len = $(this).getTotalLength();
var p = $(this).getPointAtLength(0);
var seg = $(this).getPathSegAtLength(0);
var stp=p.x+","+p.y;
for(var i=1; i<len; i++){
p=$(this).getPointAtLength(i);
if ($(this).getPathSegAtLength(i)>seg) {
stp=stp+" "+p.x+","+p.y;
seg = $(this).getPathSegAtLength(i);
}
}
polygon.setAttribute("points", stp);
$(this).replaceWith(polygon);
}
});
});
</script>
</body>
</html>
This gives me two errors:
XML Parsing Error: syntax error
Location: file:///C:/Users/Temp/Desktop/Experiment.html
Line Number 1, Column 1:.
ReferenceError: $ is not defined.
I've stopped trying to use doc.children() since it wasn't working.
Just add the jQuery library into your project.
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
CODE:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<title>Reader</title>
</head>
<body>
<input type="file" id="fileReader" />
<br>
<p id="Content"></p>
<script>
document.getElementById("fileReader").addEventListener('change',function(){
var fr = new FileReader();
fr.onload = function(){
console.log("File Loaded!")
}
parser = new DOMParser();
var doc = parser.parseFromString(fr.readAsText(this.files[0]), "text/xml");
console.log(doc);
var path = "path";
doc.querySelectorAll('*').forEach(function(){
if($(this).is(path)){
var polygon = doc.createElementNS("http://www.w3.org/2000/svg", "polygon");
polygon.setAttribute("id", $(this).getAttribute("id"));
console.log("Converting " + $(this).getAttribute("id"));
var len = $(this).getTotalLength();
var p = $(this).getPointAtLength(0);
var seg = $(this).getPathSegAtLength(0);
var stp=p.x+","+p.y;
for(var i=1; i<len; i++){
p=$(this).getPointAtLength(i);
if ($(this).getPathSegAtLength(i)>seg) {
stp=stp+" "+p.x+","+p.y;
seg = $(this).getPathSegAtLength(i);
}
}
polygon.setAttribute("points", stp);
$(this).replaceWith(polygon);
}
});
});
</script>
</body>
</html>
I am trying to parse JSON data from the url (only feeds data from the JSON) and stored the values in localstorage now I am trying to retrieve the values that are stored in the localstorage from one file to another file the stored values is in the from of array objects.while retrieving I am getting only the final object in other file. Can anyone help me how to retrieve all the objects? I am attaching the code below new.html (here I am trying to store the data in localstorage) and new1.html (here I am retrieving the data). Thank you
new.html:
<html>
<head>
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width ,height=device-height"/>
</head>
<body>
<div id="header">
<h1> Login </h1>
</div>
<div id="section">
<!--script type="text/javascript"
charset="utf-8" src="cordova-1.7.0.js"></script-->
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("#submit").click(insertId);
});
function insertId() {
// Getting the value of your text input
var did = document.getElementById("deviceId").value;
if (did == null || did == "") {
alert("Kindly enter a valid Device ID");
return false;
} else {
console.log("id: ", did);
}
window.alert("DID entered is : " + did);
window.open("new1.html");
$.ajax({
url : "https://api.thingspeak.com/channels/9/feeds.json?results=10",
dataType:"json",
cache: false,
error:function (xhr, ajaxOptions, thrownError){
debugger;
alert(xhr.statusText);
alert(thrownError);
},
success : function(json1) {
console.log(json1);
json1.feeds.forEach(function(feed, i) {
console.log("\n The deails of " + i + "th Object are : \nCreated_at: " + feed.created_at + "\nEntry_id:" + feed.entry_id + "\nField1:" + feed.field1 + "\nField2:" + feed.field2);
localStorage.setItem('Created_at', feed.created_at);
var create = localStorage.getItem('Created_at');
console.log(create);
localStorage.setItem('Entry_id', feed.entry_id);
var entry = localStorage.getItem('Entry_id');
console.log(entry);
localStorage.setItem('Field1', feed.field1);
var fd1 = localStorage.getItem('Field1');
console.log(fd1);
localStorage.setItem('Field2', feed.field2);
var fd2 = localStorage.getItem('Field2');
console.log(fd2);
});
}
});
return false;
}
</script>
<form id="insertId">
<br><input type="text" placeholder="DeviceId" id="deviceId" /><br>
<br>
<input type="submit" id="submit" name="submit" value="Submit" />
</form>
</div>
</body>
new1.html:
<html>
<body onload="init();">
<div id="header">
<h1> USER DETAILS </h1>
</div>
<div id="section">
<script>
// Called on body's `onload` event
function init() {
// Retrieving the text input's value which was stored into localStorage
var create = localStorage.getItem('Created_at');
console.log(create);
document.writeln("<br>Created_at = "+create);
var entry = localStorage.getItem('Entry_id');
document.writeln("<br>Entry_id = "+entry);
var fd1 = localStorage.getItem('Field1');
document.writeln("<br>Field1 = "+fd1);
var fd2 = localStorage.getItem('Field2');
document.writeln("<br>Field3 = "+fd2);
}
</script>
<body onload="init();">
</body>
</div>
</body>
I use PhoneGap to create mobile app which can select image from album, and then I want to pass that image and show in another html page. Anybody have any idea how to do that? Here is my code
selectImage.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
var pictureSource;
var destinationType;
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){
pictureSource=navigator.camera.PictureSourceType;
destinationType=navigator.camera.DestinationType;
}
function onPhotoURISuccess(imageURI){
window.location.href = "review.html";
var image = document.getElementById('image');
image.style.display = 'block';
image.src = imageURI;
}
function getPhoto(source){
navigator.camera.getPicture(onPhotoURISuccess, onFail, {quality: 50,
destinationType: destinationType.FILE_URI, sourceType: source});
}
function onFail(msg){
alert('Failed because: ' + msg);
}
</script>
</head>
<body>
<button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button>
<!--<img style="display:none;width:60px;height:60px;" id="image" src="" />-->
</body>
</html>
review.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Review</title>
</head>
<body>
<br>
<img style="display:none;width:60px;height:60px;" id="image" src="" />
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script src="js/jquery-2.0.3.min.js"></script>
</body>
</html>
You can use html5 localstorage.
localStorage.seItem('url','your image path');
On the next page access it in
var myUrl = localStorage.url
Since Cordova runs on a WebView you should be able to send it through the URL as a parameter and then fetch it on the next page.
Redirect and attach photoId as URL parameter
window.location.href= "review.html?photoId=1354123";
Grab it on the other side using JS
//Generic function to fetch URL query strings
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
var photoId = getParameterByName('photoId'); //grab it
I am trying to pull a list of names from parse and add them to an onsenui list, the parse query is working because I logged them and it worked, but the list items aren't showing up anywhere.
Here is the app.js
(function(){
var app = angular.module('myApp', ['onsen.directives']);
app.factory('Data', function(){
var Data = {};
Data.items = [];
var parseAPPID = "***************************************";
var parseJSID = "****************************************";
//Initialize Parse
Parse.initialize(parseAPPID,parseJSID);
var NoteOb = Parse.Object.extend("place");
//$(document).on("pageshow", "#places", function(e, ui) {
//$.mobile.loading("show");
var Places = Parse.Object.extend("Places");
var query = new Parse.Query(Places);
query.limit(100);
query.ascending("Name");
query.find({
success:function(results) {
for(var i=0; i<results.length; i++) {
Data.items[i] = results[i].get('Name');
}
},error:function(e) {
}
});
return Data;
});
app.controller('listCtrl', function($scope, Data) {
$scope.items = Data.items;
});
})();
And here is the html pages
Index.html:
<!DOCTYPE html>
<html ng-app="myApp">
<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="width=device-width, initial-scale=1, maximum- scale=1, user-scalable=no">
<meta name="msapplication-tap-highlight" content="no" />
<!--<link rel="stylesheet" src="http://code.jquery.com/jquery-1.9.1.css"></link>-->
<!--<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"> </script>-->
<link rel="stylesheet" href="lib/onsen/css/onsenui.css">
<link rel="stylesheet" href="lib/onsen/css/topcoat-mobile-onsen-blue.css">
<script src="http://www.parsecdn.com/js/parse-1.2.19.min.js"></script>
<script src="lib/onsen/js/angular/angular.js"></script>
<script src="lib/onsen/js/angular/angular-touch.js"></script>
<script src="lib/onsen/js/onsenui.js"></script>
<title>MY APP</title>
</head>
<body>
<ons-navigator page="list.html">
</ons-navigator>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
list.html:
<!DOCTYPE HTML>
<html>
<head>
<title>List A-Z</title>
</head>
<body>
<ons-page class="center">
<div ng-controller="listCtrl">
<ons-list>
<ons-list-item ng-repeat="item in items">
{{item}}
</ons-list-item>
</ons-list>
</div>
</ons-page>
</body>
</html>
According to this link, I updated my answer as follows:
(function(){
var app = angular.module('myApp', ['onsen.directives']);
app.factory('Data', function($q){
var parseAPPID = "***************************************";
var parseJSID = "****************************************";
//Initialize Parse
Parse.initialize(parseAPPID,parseJSID);
var Data = Parse.Object.extend("Places", {
// Instance methods
}, {
async: function() {
var deferred = $q.defer();
var query = new Parse.Query(Places);
query.limit(100);
query.ascending("Name");
query.find({
success:function(results) {
// Resolve the deferred $q object before returning the promise
deferred.resolve(results);
for(var i=0; i<results.length; i++) {
Data.items[i] = results[i].get('Name');
}
},error:function(e) {
}
});
return deferred.promise;
}
});
return Data;
});
app.controller('listCtrl', function($scope, Data) {
Data.async().then(function(d) {
$scope.items = d.items;
});
});
})();
Good luck. And you may need to see this: AngularJS: service query returning zero result.
I'm using phonegap to develop a mobile web application and possibly transfer it to other platforms later on such as android, etc.
I want to be able to write to local files on the device, however, no matter, what I do, it doesn't work. There is no proper documentation to support with such problems.
If anyone could help, I'd greatly appreciate it.
Here is my html file:
<!DOCTYPE html>
<html>
<head>
<!--<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />-->
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="jquery/jquery.mobile-1.0.1.min.css"/>
<script src="jquery/jquery-1.6.4.min.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css"/>
<script src="jquery/jquery.mobile-1.0.1.min.js"></script>
<title>Hello World</title>
<!-- iPad/iPhone specific css below, add after your main css >
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />-->
<!-- If your application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
<script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
<script type="text/javascript" charset="utf-8" src="NativeControls.js"></script>
<script type="text/javascript" charset="utf-8" src="js/main.js"></script>
</head>
<body onload="onBodyLoad()">
<div data-role="page" id="mainpage">
<div data-role="header">
<h1>LOGIN</h1>
</div>
<div data-role="content">
<img src="images/cslogosmall2.png" style="margin-top: -10px; margin-left: -5px;"/>
<form id="login" method="post">
<p>
<ul data-role="listview" data-theme="g" id="contentlist">
<b>Program:</b>
<input type="text" id="program"/>
<b>Username:</b>
<input type="text" id="username"/>
<b>Password:</b>
<input type="password" id="password"/>
</ul>
</p>
<br/>
<button type="submit" data-theme="a" id="submit" value="Submit"></button>
Offline
</form>
</div>
<!--<div data-role="footer">
<h1> Main Page Footer </h1>
</div>-->
</div>
<div data-role="page" id="contentpage">
<div data-role="header">
<h1> Content Page </h1>
</div>
<div data-role="content">
<a href="#" data-role="button" onclick="history.go(-1);return false;" onClick=buttonDemo()> Back to Main Page </a>
<a href="#" data-role="button" id="beepbtn" onClick=beepbeep()> Beep!</a>
</div>
<div data-role="footer">
<h1> Content Page Footer </h1>
</div>
</div>
</body>
</html>
And here is my javascript file:
function validate() {
navigator.notification.alert("validate called");
var program = document.getElementById('program');
var username = document.getElementById('username');
var password = document.getElementById('password');
if (!program || program == "") {
navigator.notification.alert("Please enter a program");
return false;
}
else if (!username || username == "") {
navigator.notification.alert("Please enter a username");
return false;
}
else if (!password || password == "") {
navigator.notification.alert("Please enter a password");
return false;
}
return true;
}
function beepbeep() {
//navigator.notification.alert("Beep function called");
navigator.notification.beep();
}
$(document).ready(function() {
$('#submit').click(function() {
var program = document.getElementById('program').value;
var username = document.getElementById('username').value;
var password = document.getElementById('password').value;
if (!program || program == "") {
alert("Please enter a program", null, "ClearSpider", "OK");
return false;
}
else if (!username || username == "") {
alert("Please enter a username", null, "ClearSpider", "OK");
return false;
}
else if (!password || password == "") {
alert("Please enter a password", null, "ClearSpider", "OK");
return false;
}
return true;
});
document.addEventListener("deviceready", onDeviceReady, false);
window.addEventListener("resize", orientationChange, false);
});
function test() {
console.log("fail");
var fs = FileWriter.write(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
alert(LocalFileSystem.PERSISTENT);
alert("Test called");
}
function onTabBarItem(id)
{
alert("hello");
//jQT.goTo("#" + id, "slide");
// if you need to modify the tabbar items that are shown, you should do
// so here.
}
function fail(error) {
console.log(error.code);
}
function gotFS(fileSystem) {
alert("at gotFS");
fileSystem.root.getFile("readme.txt", {create: true}, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
alert("at gotFileEntry");
fileEntry.createWriter(gotFileWriter, fail);
}
function gotFileWriter(writer) {
alert("at gotFileWriter");
writer.onwrite = function(evt) {
console.log("write success");
};
writer.write("some sample text");
// contents of file now 'some sample text'
writer.truncate(11);
// contents of file now 'some sample'
writer.seek(4);
// contents of file still 'some sample' but file pointer is after the 'e' in 'some'
writer.write(" different text");
// contents of file now 'some different text'
}
/* When this function is called, Cordova has been initialized and is ready to roll */
/* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
for more details -jm */
function onDeviceReady() {
// Initializating TabBar
//window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
navigator.notification.alert("hi kaan", null, "hey", "SWEET");
Cordova.exec("NativeControls.createTabBar");
//var options = "top";
var options = "bottom";
navigator.notification.alert(window.requestFileSystem);
window.onorientationchange = function() {
var orientation = window.orientation;
switch(orientation) {
case 0:
Cordova.exec("NativeControls.showTabBar", options);
Cordova.exec("NativeControls.showToolBar");
/* Add a descriptive message on "Handling iPhone or iPod touch Orientation Events" */
document.getElementById("currentOrientation").innerHTML="Now in portrait orientation (Home button on the bottom).";
break;
case 90:
Cordova.exec("NativeControls.showTabBar", options);
Cordova.exec("NativeControls.showToolBar");
document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the left (Home button to the right).";
break;
case -90:
Cordova.exec("NativeControls.showTabBar", options);
Cordova.exec("NativeControls.showToolBar");
document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the right (Home button to the left).";
break;
default:
Cordova.exec("NativeControls.showTabBar", options);
Cordova.exec("NativeControls.showToolBar");
document.getElementById("currentOrientation").innerHTML="Now the orientation must be -180. default: case: ";
break;
}//end switch
}//end window.orientationchange
//var taboptions = {"onSelect":onTabBarItemSelect};
var moreNum = 1;
Cordova.exec("NativeControls.showTabBar", options);
var onSelect = {"onSelect":onTabBarItem};
//onSelect = "hahaha";
Cordova.exec("NativeControls.createTabBarItem", "test", "test", "tabButton:Recents", onSelect);
Cordova.exec("NativeControls.createTabBarItem", "test2", "test2", "tabButton:Search", onSelect);
Cordova.exec("NaviteControls.createTabBarItem", "test3", null, "tabButton:More", onSelect);
Cordova.exec("NativeControls.showTabBarItems", "test", "test2", "test3");
Cordova.exec("NativeControls.selectTabBarItem", "test");
//Cordova.exec("NativeControls.tabBarItemSelected", "1");
/*nativeControls = window.plugins.nativeControls;
navigator.notification.alert(nativeControls);
nativeControls.createTabBar();
// Books tab
nativeControls.createTabBarItem(
"books",
"Books",
"tabButton:Recents",
"",
{"onSelect": function() {
books();
}}
);
// Stats tab
nativeControls.createTabBarItem(
"finished",
"Finished",
"tabButton:Recents",
"",
{"onSelect": function() {
finished();
}}
);
// About tab
nativeControls.createTabBarItem(
"about",
"About",
"tabButton:Recents",
"",
{"onSelect": function() {
about();
}}
);
// Compile the TabBar
nativeControls.showTabBar();
nativeControls.showTabBarItems("books", "finished", "about");
nativeControls.selectTabBarItem("books");*/
}
function orientationChange() {
var nativeControls = window.plugins.nativeControls;
nativeControls.resizeTabBar();
}
function books() {
}
function about() {
}
function finished(){
}
Note that this line doesn't work:
navigator.notification.alert(window.requestFileSystem); does not display an alert.
I was using 1.4.1 yesterday when I successfully saw the alert. When I switch to 1.5.0, the alert prints null. This is because of the require namespacing that was added in cordova-1.5.0.
However, even in 1.5.0, the API sample still works for me:
function gotFS(fileSystem) {
navigator.notification.alert(window.requestFileSystem);
myFS = fileSystem;
console.log(fileSystem.name);
console.log(fileSystem.root.name);
$('#file-system-text').html("File System: <strong>" + fileSystem.name + "</strong> " +
"Root: <strong>" + fileSystem.root.name + "</strong>");
fileSystem.root.getFile("readme.txt", {create: true, exclusive: false}, createGotFileEntry, writeFail);
}
function createFile() { // button onclick function
if (myFS) {
gotFS(myFS);
} else {
navigator.notification.alert(window.requestFileSystem);
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, failFS);
}
}