How would I access the values of 'timestamp' and 'usage' in the following example,
function executeReadingsQuery(query, postQueryProcessing) {
var d = new $.Deferred();
var processing = function(tx, results) {
var result = [];
var len = results.rows.length;
for ( var i = 0; i < len; i++) {
result.push({
"timestamp" : moment(results.rows.item(i).timeStamp),
"usage" : results.rows.item(i).usage
});
}
if (postQueryProcessing) {
result = postQueryProcessing(result);
}
d.resolve(result);
};
executeQuery(query, processing);
return d;
}
A function that builds a query string will subsequently call the above function,
function getReadingsInternal(noOfReadings, postQueryProcessing) {
var query = "SELECT * from usage ORDER BY timestamp DESC limit " + noOfReadings.toString();
return executeReadingsQuery(query, postQueryProcessing);
}
And then there is another function that exposes the entire functionality globally,
getReadings : function(noOfReadings) {
return getReadingsInternal(noOfReadings);
}
The original function (the first one listed) is within a Variable called WNDatabase
So I can access the function with a call that looks like this
WNDatabase.getReadings(30)
But I would like to be able to also globally access the values of timestamp and usage which populate the result[] array of the deferred object.
It seems that it is not possible to do something like this
$.when(WNDatabase.getReadings(30)).done(function() {
for(var i=0; i<7; i++){
console.log(this[i].usage);
}
});
So what would one do in this event?
Related
I want to build up on an existing solution to find out when all elements in an array have been inserted successfully.
Web SQL Database + Javascript loop
insert: function(configurationVOs) {
var self = this;
this.database.transaction(function(transaction){
var total = 0;
for(var i=0; i<configurationVOs.length; i++) {
(function(configurationVO) {
var params = [configurationVO.id, configurationVO.key, configurationVO.value, configurationVO.type];
transaction.executeSql(self.configurationInsertSQL, params, self.insertComplete, self.insertError);
})(configurationVOs[i]);
}
});
},
if someone can provide an elegant self-contained solution within this for loop/function that can do a single callback upon success.
My attempt, please edit/suggest for any improvements.
insert: function(configurationVOs) {
var self = this;
this.database.transaction(function(transaction){
var total = 0;
for(var i=0; i<configurationVOs.length; i++) {
(function() {
var params = [configurationVOs[i].id, configurationVOs[i].key, configurationVOs[i].value, configurationVOs[i].type];
transaction.executeSql(self.configurationInsertSQL, params, function(transaction, resultSet){
if(++total == configurationVOs.length) {
self.insertComplete();
}
}, self.insertError);
})();
}
});
},
Thanks for the help in advance.
I'm working on an practice assigment using Phonegap and Javascript. Long story short: I need to use Parse.com to store information about some Lego minifigures. The problem I'm having right now is due mostly to my inexperience in Javascript.
I'm working on letting the user add tags to the figures. The user enters them, separated by comma, and I then split the string. That's working OK.
Now, I need to add the tags that don't exist yet to my database. For this, I search for any tags with that description (using query.find) and then, if it exists, I don't create it, I just modify the relationship. If it doesn't exist, I create it and then modify the relationship.
My problem is: I can't seem to be able to access the tag description (the string) from within the success callback of query.find. I'm pretty sure it's because of the scope. Is there any proper way to access variables from withing a success callback, besides the results array?
My current code is as follows:
var Figure = Parse.Object.extend("Figure");
var Tag = Parse.Object.extend("Tag");
var nombre = $('#nombre').val();
var serie = $('#serie').val();
var figure = new Figure({"Name":nombre,"Series":serie});
var tags = $('#tags').val();
res = tags.split(","); //split the
figure.save().then(function() {
for (var i = 0; i < res.length; i++) { //for each tag
var query = new Parse.Query(Tag); //create the query.
query.equalTo("Description", res[i]);
query.find( {//execute query
success: function(results, res[i]) {
if (results.length > 0){ //if there are results.
var tag = results[0]; //get the tag
var relation_tag = tag.relation("figures"); //get the relation
relation_tag.add(figure); //add figure to relation
tag.save();
}
else { //if there are no results, the tag does not exist.
new_tag = new Tag({"Description":res[i]});
//ABOVE THIS LINE: res[i] is always undefined.
var relation_tag = new_tag.relation("figures"); //get the relation
relation_tag.add(figure); //add the figure
new_tag.save();
}
},
//error with query
error: function() {
alert("ERROR");
}
});
}
}, function(error) {
alert("No se pudo guardar la figura");
});
In the success callback, res[i] always is undefined, I assume that it's because of the scope.
This is a very common problem in async Javascript programming. You are doing something like this:
for (var i = 0; i < array.length; i++) {
anAsyncFunction(function(result) { // inner function
doSomethingWith(array[i]);
}
}
The problem is that in Javascript functions store outer variables by reference and not by value, which means that a function looks up the value of a variable from an outer scope, when it is executed and not when it is defined. Since the code is async the the inner function is called after the for loop completed and at this point we have i === array.length, so array[i] === array[array.length] === undefined.
To avoid this you can use an immediately invoked function expression (IIFE, pronounced "iffy"):
for (var i = 0; i < array.length; i++) {
anAsyncFunction((function(j) { // IIFE
return function innerFunction(result) { // inner function
doSomethingWith(array[j]); // j instead of i
}
})(i); // passing "value of i"
}
Because the IIFE is invoked immediately, the current value is of i is passed and stored into j and when the inner function executes it uses the correct value.
So in your case this should work:
success: (function(j) { // IIFE
return function(results) {
if (results.length > 0) {
var tag = results[0];
var relation_tag = tag.relation("figures");
relation_tag.add(figure);
tag.save();
}
else { //if there are no results, the tag does not exist.
new_tag = new Tag({"Description":res[j]}); // j instead of i
var relation_tag = new_tag.relation("figures");
relation_tag.add(figure);
new_tag.save();
}
}
})(i) // pass "value of i"
If you prefer, you can also pass the description itself instead of just the index to the IIFE (I think I would do it that way):
success: (function(description) { // IIFE
return function(results) {
if (results.length > 0) {
var tag = results[0];
var relation_tag = tag.relation("figures");
relation_tag.add(figure);
tag.save();
}
else { //if there are no results, the tag does not exist.
new_tag = new Tag({"Description":description}); // description
var relation_tag = new_tag.relation("figures");
relation_tag.add(figure);
new_tag.save();
}
}
})(res[i]) // pass description
var Tag = Parse.Object.extend("Tag");
var query = new Parse.Query(Tag);
I have a function in my controller that adds users to a group, Once a user has been assigned to a group, the list of groups available should decrease. I tried using promises in my function to control the flow but based on the console log, all my groupServices are running first, then the userServices are running after, preventing the list of Available groups to update correction.
Controller Function:
$scope.addUserToGroup = function (){
var defer = $q.defer();
defer.promise.then(function (){
userService.addUserToGroup(
$scope.selectedUser,
$scope.selectedAvailableGroups,
$scope.assignedGroups,
$scope.availableGroups,
$scope.groups
);
}).then(compare());
defer.resolve();
};
function compare(){
console.log('comparing assigned with all ');
$scope.compareGroups = groupService.compareGroups();
}
I'm using promises trying to make sure things run in order but based on my console output it doesn't seem to be the case.
User Service function
var addUserToGroup = function (selectedUser, selectedAvailableGroups, assignedGroups, availableGroups, groups){
console.dir(selectedUser);
console.dir(selectedAvailableGroups);
console.dir(assignedGroups);
console.dir(availableGroups);
console.dir(groups);
var deferred = $q.defer();
var addPromise = [];
var selectLength = selectedAvailableGroups.length;
//Add user to selected groups on server
deferred.promise
.then(function (){
for (var i = 0; i < selectLength; i++){
addPromise[i] = $().SPServices({
operation: "AddUserToGroup",
groupName: selectedAvailableGroups[i].name,
userLoginName: selectedUser.domain
});
};
})
.then(function (){
//when promise finished, push changes to availableGroups
for (var i = 0; i < selectLength; i++){
assignedGroups.push(selectedAvailableGroups[i]);
console.log(selectedUser.name + " added to: " + selectedAvailableGroups[i].name);
};
});
//Run
deferred.resolve();
}
Group Service function:
var compareGroups = function () {
//Comparing assigned groups with allGroups to return available groups
var assignedGroupsIds = {};
var groupsIds = {};
var result = []
availableGroups = [];
console.log('assigned');
console.dir(assignedGroups);
console.log('avail');
assignedGroups.forEach(function (el, i) {
assignedGroupsIds[el.id] = assignedGroups[i];
});
allGroups.forEach(function (el, i) {
groupsIds[el.id] = allGroups[i];
});
for (var i in groupsIds) {
if (!assignedGroupsIds.hasOwnProperty(i)) {
result.push(groupsIds[i]);
availableGroups.push(groupsIds[i]);
}
};
console.dir(result);
console.dir(availableGroups);
}
Console Log:
comparing assigned with all userCtrl.js:47
assigned groups groupServices.js:63
Array[8] groupServices.js:64
available gruops groupServices.js:65
Array[3] groupServices.js:82
Array[3] groupServices.js:83
Object userServices.js:38
Array[1] userServices.js:39
Array[8] userServices.js:40
Array[4] userServices.js:41
Array[11] userServices.js:42
User added to: Test Group 4 userServices.js:64
You are using promises in wrong way.
The first problem is here:
}).then(compare());
You are trying to register result of execution of compare function as a callback, instead of registering just compare function like this:
}).then(compare);
That's why it executes first, then calls groupService.compareGroups() and only after it completes, you are calling defer.resolve() and your first registered callback executes. That's why you see your current console output.
You need to modify User Service and Controller in following way to get it work (Using $q service to work with promises):
Controller function:
function compare(){
console.log('comparing assigned with all ');
$scope.compareGroups = groupService.compareGroups();
}
$scope.addUserToGroup = function (){
userService.addUserToGroup(
$scope.selectedUser,
$scope.selectedAvailableGroups,
$scope.assignedGroups,
$scope.availableGroups,
$scope.groups
).then(compare);
};
User Service function:
(Assuming, that $().SPServices returns Promise)
var addUserToGroup = function (selectedUser, selectedAvailableGroups, assignedGroups, availableGroups, groups){
console.dir(selectedUser);
console.dir(selectedAvailableGroups);
console.dir(assignedGroups);
console.dir(availableGroups);
console.dir(groups);
var deferred = $q.defer();
var addPromise = [];
var selectLength = selectedAvailableGroups.length;
//Add user to selected groups on server
for (var i = 0; i < selectLength; i++){
addPromise[i] = $().SPServices({
operation: "AddUserToGroup",
groupName: selectedAvailableGroups[i].name,
userLoginName: selectedUser.domain
});
}
$q.all(addPromise).then(function (){
//when promise finished, push changes to availableGroups
for (var i = 0; i < selectLength; i++){
assignedGroups.push(selectedAvailableGroups[i]);
console.log(selectedUser.name + " added to: " + selectedAvailableGroups[i].name);
};
//Finish function
deferred.resolve();
});
return deferred.promise;
}
I have the following code in one of my function. I have an array 'arr' which is working correctly when used inside if{}. But its now working when using outside it. Can anyone point me what I am missing.
function runQueries()
{
var arr = new Array;
db.transaction (function (transaction)
{
var sql = "SELECT * FROM incomecategory";
transaction.executeSql (sql, undefined,
function (transaction, result)
{
if (result.rows.length)
{
for (var i = 0; i < result.rows.length; i++)
{
var row = result.rows.item (i);
var categoryname = row.categoryname;
arr[i] = categoryname;
}
//alert(arr[0]); // It works
}
else
{
}
}, error);
});
//alert (arr[0]); // It doesn't work.
}
It's asynchronous behavior. Your alert at the bottom of the code is probably executed before the database query.
I have a pretty large number of objects "usrSession" I store them in my ArrayCollection usrSessionCollection.
I'M looking for a function that returns the latest userSessions added with a unique userID. So something like this:
1.
search the usrSessionCollection and only return one userSessions per userID.
2.
When it has returned x number of userSessions then deleted them from the usrSessionCollection
I'M stuck - would really love some code that can help me with that.
function ArrayCollection() {
var myArray = new Array;
return {
empty: function () {
myArray.splice(0, myArray.length);
},
add: function (myElement) {
myArray.push(myElement);
}
}
}
function usrSession(userID, cords, color) {
this.UserID = userID;
this.Cords = cords;
this.Color = color;
}
usrSessionCollection = new ArrayCollection();
$.getJSON(dataurl, function (data) {
for (var x = 0; x < data.length; x++) {
usrSessionCollection.add(new usrSession(data[x].usrID.toString(), data[x].usrcords.toString() ,data[x].color.toString());
}
});
Thanks.
The biggest issue is that you have made the array private to the outside world. Only methods through which the array can be interacted with are add and empty. To be able to search the array, you need to either add that functionality in the returned object, or expose the array. Here is a modified ArrayCollection:
function ArrayCollection() {
var myArray = new Array;
return {
empty: function () {
myArray.splice(0, myArray.length);
},
add: function (myElement) {
myArray.push(myElement);
},
getAll: function() {
return myArray;
}
}
}
Now to get the last N unique session objects in usrSessionCollection, traverse the sessions array backwards. Maintain a hash of all userID's seen so far, so if a repeated userID comes along, that can be ignored. Once you've collected N such user sessions or reached the beginning of the array, return all collected sessions.
usrSessionCollection.getLast = function(n) {
var sessions = this.getAll();
var uniqueSessions = [];
var addedUserIDs = {}, session, count, userID;
for(var i = sessions.length - 1; i >= 0, uniqueSessions.length < n; i--) {
session = sessions[i];
userID = session.userID;
if(!addedUserIDs[userID]) {
uniqueSessions.push(session);
addedUserIDs[userID] = true;
}
}
return uniqueSessions;
}
I wouldn't combine the delete step with the traversal step, just to keep things simple. So here's the remove method that removes the given session from the array. Again, it's better to modify the interface returned by ArrayCollection rather than tampering with the sessions array directly.
function ArrayCollection(..) {
return {
..,
remove: function(item) {
for(var i = 0; i < myArray.length; i++) {
if(item == myArray[i]) {
return myArray.splice(i, 1);
}
}
return null;
}
};
}
Example: Get the last 10 unique sessions and delete them:
var sessions = usrSessionCollection.getLast(10);
for(var i = 0; i < sessions.length; i++) {
console.log(sessions[i].UserID); // don't need dummy variable, log directly
usrSessionCollection.remove(sessions[i]);
}
See a working example.
You made your array private, so you can't access the data, except adding a new element or removing them all. You need to make the array public, or provide a public interface to access the data. Like first(), next() or item(index).
Then you can add a search(userID) method to the usrSessionCollection, which uses this interface to go through the elements and search by userID.
UPDATE: this is how I would do it: - See it in action. (click preview)
// user session
function userSession(userID, cords, color) {
this.UserID = userID;
this.Cords = cords;
this.Color = color;
}
// a collection of user sessionions
// a decorated array basically, with
// tons of great methods available
var userSessionCollection = Array;
userSessionCollection.prototype.lastById = function( userID ) {
for ( var i = this.length; i--; ) {
if ( this[i].UserID === userID ) {
return this[i];
}
}
// NOTE: returns undefined by default
// which is good. means: no match
};
// we can have aliases for basic functions
userSessionCollection.prototype.add = Array.prototype.push;
// or make new ones
userSessionCollection.prototype.empty = function() {
return this.splice(0, this.length);
};
//////////////////////////////////////////////////////
// make a new collection
var coll = new userSessionCollection();
// put elements in (push and add are also available)
coll.add ( new userSession(134, [112, 443], "#fffff") );
coll.push( new userSession(23, [32, -32], "#fe233") );
coll.push( new userSession(324, [1, 53], "#ddddd") );
// search by id (custom method)
var search = coll.lastById(134);
if( search ) {
console.log(search.UserID);
} else {
console.log("there is no match");
}
// empty and search again
coll.empty();
search = coll.lastById(134);
if( search ) {
console.log(search.UserID);
} else {
console.log("there is no match");
}