Vue update data within mongoose database and using axios call - javascript

I have a problem, I used a get and post function to retrieve and save some url in my database, but now I d like to update a variable count, that should rapresent the votes that every video get, and after that I shoul be able to disable the button that a user click to vote. So I'm having some troubles to make the update function, or I should use another post? But if so I probably create another element inside my DB or not?
so here there is my video and for now I set the video's id invisible using css, to test it and try to find the video with that specific id and make the update
<p class="invisible" id="idVideo"> {{item._id}} </p>
<iframe class="partecipant" v-bind:src="item.video.url"> </iframe>
<p id="voti" > {{item.voti.count}} </p>
<input type="button" id="buttonVoti" v-on:click="addVoto">
so here, when the user click the button with id= buttonVoti the v-on click call addVoto function
methods: {
...
//ALL THE OTHERS METHODS
...
...
...
//AND THEN THE ADDVOTO FUNCTION
addVoto : function () {
var self = this;
//self.videos[1].voti.count++
//console.log(self.videos._id);
var i = document.getElementById("idVideo");
var idVid =i.innerHTML;
console.log(idVid);
so here I can change the variable count, using self....count++ but I have to store and then retrieve again the same video with the new count updated.
here there is my model so the logic to access to the count should be this one
var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var videoSchema = new Schema({
video : {
id : String,
url : String,
idchallenge : String
},
voti : {
count : {}
}
});
module.exports = mongoose.model('Video', videoSchema);
yes so I have a method called load video, that is activated when the user click a button called loadVideo
loadVideo : function (){
var linkYoutube = this.text;
console.log(linkYoutube);
//POST
axios.post('/video',{
method: 'post',
video: {
id: '1',
url: linkYoutube
},
voti: {
count: 0
}
});
and this is my get function,
getVideo: function () {
var self = this;
// Make a request for a user with a given ID
axios.get('/video')
.then(function (response) {
self.videos = response.data;
console.log(self.videos);

When you do you GET request to your video route, in your route logic, you should be able to use Mongoose count. Here is what that route might look like:
var Router = require('express').Router();
var mongoose = require('mongoose');
var Video = mongoose.model('Video');
Router.get('/videos', function(req, res) {
var response = {};
Video.find({}, function(queryErr, videos) {
if (!queryErr) {
response.videos = videos;
Video.count({}, function(countErr, count) {
if (!countErr) {
response.count = count;
res.status(200).send(response);
} else {
res.status(500).send(countErr);
}
});
} else {
res.status(500).send(queryErr);
}
});
});
module.exports = Router;
Here is a question about Mongoose count on Stack Overflow.

Related

How to insert data in ground.db in meteor when offline

i have a fully working meteor application but now i want to make it offline so I installed ground:db and appcache here is my package file:
...
ground:db
appcache
ground:localstorage
then I changed my Collections to this:
Gebiete = new Mongo.Collection('gebiete');
Straßen = new Mongo.Collection('straßen');
Nummern = new Mongo.Collection('nummern');
Ground.Collection(Gebiete);
Ground.Collection(Straßen);
Ground.Collection(Nummern);
and now when the app is online i can insert data and then i disconnect the app and relaunch (cordova) and no data is lost.
But when im offline and i want to insert sth. it doesnt work ;(. I thaught i dont have to change my methods file but here is one method just to make sure if it is right:
Meteor.methods({
neuesGebiet(Besitzer, Gebietsname, Gebietsnummer, Ort, Erstellungsdatum) {
Gebiete.insert({
Besitzer: Besitzer,
Gebietsname: Gebietsname,
Gebietsnummer: Gebietsnummer,
Ort: Ort,
Erstellungsdatum: Erstellungsdatum
});
}
});
and on the client the message is called like this:
import { Meteor } from 'meteor/meteor'
Template.neuesGebietErstellen.onCreated(function () {
this.subscribe('gebiete');
});
Template.neuesGebietErstellen.events({
"submit .add-Gebiet": function (event) {
var Gebietsname = event.target.Gebietsname.value;
var Gebietsnummer = event.target.Gebietsnummer.value;
var Ort = event.target.Ort.value;
var Besitzer = Meteor.userId();
var Erstellungsdatum = new Date();
var Datum = Erstellungsdatum.toLocaleDateString();
Meteor.call('neuesGebiet', Besitzer, Gebietsname, Gebietsnummer, Ort, Datum)
FlowRouter.go('/');
return false;
}
});
Please help me to get the data inserted when offline because i want it to be 100% offline
Thank you ;)
It's been a while since I used Ground:db but here's what I think you are missing...
First, you probably only want grounded collections on Cordova, so
if(Meteor.isCordova) {
Ground.Collection(Gebiete);
Ground.Collection(Straßen);
Ground.Collection(Nummern);
}
Then you need to use Groundmethods to store your method calls. So after the definition of the method:
Meteor.methods({
'neuesGebiet': function(...) {
...
}
});
if( Meteor.isClient ) {
Ground.methodResume([
'neuesGebiet'
]);
}

Firebase and crossroads user profile

how can I make a router system with crossroads.js where if I go to for example this URL: localhost/user/{{username}} then get the details of that user there's entered in the URL with firebase.
get user detail once :
var database = firebase.database();
var route1 = crossroads.addRoute('/user/{username}', function(id){
firebase.database().ref('/user/' + id).once('value').then(function(snapshot) {
var username = snapshot.val().username;
// ...
});
});

How to update on node js using sqlite3?

I would like to ask how to update on sqlite3 node js, the first function is working (views the data in the HTML from the database), my problem is how to update it. Thanks!
exports.post = function(req, res){
var id = JSON.stringify(req.body.id);
var inputData = [req.body.GIVENNAME, req.body.SURNAME, id];
db.run("UPDATE f11 SET GIVENNAME=$GIVENNAME, SURNAME=? WHERE id=?",inputData,
{
$GIVENNAME : GIVENNAME,
$SURNAME : SURNAME,
});
res.redirect("/legone/survey/surveyform/form11");
};
Update :
You can try running your query like this:
var inputData = [req.body.GIVENNAME, req.body.SURNAME, id];
db.run("UPDATE f11 SET GIVENNAME=?, SURNAME=? WHERE id=?",inputData,function(err,rows){
....
});
Hope this helps!

How to display image stored in variable using the url?

USING PARSE.COM AND THE JAVASCRIPT SDK
With the below code I can get as far as letting the user upload an image from the webpage and storing that as an object in a "file" column in the parse db.
I can store the image details, including the url in the
What i'm unable to do is extract the url back out and display the image on a html page.
I've added the screen shots to show how the data is held in var profilePhoto but i'm then unable to make it show on the page using $("profile_pic").attr('src',jobApplication[0]);
What have I overlooked ? I've searched SO and cannot find an relevant question that helps with this.
RESULTS IN INSPECT ELEMENT
Arguments[1]0: t.Filecallee: function () {length: 1__proto__: Object user_profile.html:408
t.File {_name: "tfss-fe809632-ffb8-445c-99f3-1149e4ffdec5-IMG_0047.jpg", _source:
t.Promise, _previousSave: t.Promise, _url:
"http://files.parsetfss.com/0fc5cba8-caf7-4c81-aafc…fe809632-ffb8-445c-99f3-1149e4ffdec5-IMG_0047.jpg",
name: function…}_name:
"tfss-fe809632-ffb8-445c-99f3-1149e4ffdec5-IMG_0047.jpg"_previousSave:
t.Promise_source: t.Promise_url:
"http://files.parsetfss.com/0fc5cba8-caf7-4c81-aafc-36390888e497/tfss-fe809632-ffb8-445c-99f3-1149e4ffdec5-IMG_0047.jpg"proto:
Object
CODE
$(document).ready(function() {
var parseAPPID = "XXX";
var parseJSID = "XXXX";
//Initialize Parse
Parse.initialize(parseAPPID,parseJSID);
$("#fileUploadBtn").on("click", function(e) {
var fileUploadControl = $("#fileUploader")[0];
if (fileUploadControl.files.length > 0) {
var file = fileUploadControl.files[0];
var name = file.name;
console.log("here goes nothing...");
var parseFile = new Parse.File(name, file);
parseFile.save().then(function() {
console.log("Woot!");
console.dir(arguments);
var User = Parse.Object.extend("_User")
var jobApplication = Parse.User.current();
jobApplication.set("ProfilePic", parseFile);
jobApplication.save();
var profilePhoto = jobApplication.get("ProfilePic");
console.log(profilePhoto);
$("profile_pic").attr('src',jobApplication[0]);
}, function(error) {
console.log("Error");
console.dir(error);
});
}
});
});
$("profile_pic") returns elements with profile_pic tag name, which obviously is not the thing you need. Don't see your HTML, but if profile_pic is id or class name of your img element, this will work if you type $("#profile_pic") or $(".profile_pic") respectively.

How to Update View For new Data from Database

<script type="text/javascript">
$(document).ready(function () {
function getPlanetFeeds() {
$("#planetFeedsDiv").load('/PlanetFeed/GetPlanetFeeds', function (data) {
});
var refreshPartial = setInterval(function () { getPlanetFeeds() }, 3000);
function myStopFunction() {
clearInterval(refreshPartial);
}
<div id="planetFeedsDiv">
</div>
I am trying to get Feed from database when updated in it but the problem is that if i am uploading the video than it is getting refresh and not able to watch video continuously
if i am removing this function of time interval or increasing the time interval
var refreshPartial = setInterval(function () { getPlanetFeeds() }, 3000);
function myStopFunction() {
clearInterval(refreshPartial);
}
than i am not able to get updated feed regularly
and i am getting the planetfeed from controller as follows
public ActionResult GetPlanetFeeds()
{
var planetfeedsOrder = from a in db.PlanetFeeds
join c in db.Graphs
on a.PlanetFeedItemGraphId equals c.GraphID
join u in db.UserInfos
on c.ItemUserID equals u.UserID
orderby a.PostDate descending
select new UserInfoViewModel
{
FirstName = u.FirstName,
LastName = u.LastName,
UserID = u.UserID,
AvatarURL = u.AvatarURL,
GraphItemDescription = c.GraphItemDescription,
GraphItemURL = c.GraphItemURL,
GraphID = c.GraphID,
ItemType = c.ItemType,
ItemUserID = c.ItemUserID,
GraphItemTitle = c.GraphItemTitle
} ;
return PartialView("_PlanetFeeds", planetfeedsOrder.ToList());
}
check count with old and update value by searching in database and call getPartial method when NewDataCount is greater than old data

Categories

Resources