Tumblr Audio & Video + Infinite Scroll - audio

I went through a bunch of already asked/answered questions, but it still wont work for me. This is what I have so far.
static.tumblr.com/epkyugq/C0ym8qnir/jquery-1.7.1.min.js
masonry.desandro.com/jquery.masonry.min.js
masonry.desandro.com/js/jquery.infinitescroll.min.js
static.tumblr.com/epkyugq/4fmmajupw/decker.js
I'm not sure what I'm doing wrong or if its right and something needs to be added, but I would very much appreciate it if anyone could show me a step by step tutorial on how to do it. I'm a visual person, so I need to see all the coding. Thank you for taking your time to read this and thank you for the answers.

Your repair is occurring outside of the infinitescroll script. You should change it to include it, like this:
// other stuff up here
}, function( newElements ) {
var $newElems = $(newElements).css({
opacity: 0
});
$newElems.imagesLoaded(function () {
$newElems.animate({
opacity: 1
});
$container.masonry('appended', $newElems, true);
});
/* repair video players*/
$newElems.find('.video').each(function(){
var audioID = $(this).attr("id");
var $videoPost = $(this);
$.ajax({
url: '/api/read/json?id=' + audioID,
dataType: 'jsonp',
timeout: 10000,
success: function(data){
$videoPost.html(data.posts[0]["video-player"]);
}
});
});
/* repair audio players*/
$newElems.find('.player').each(function(){
var audioID = $(this).attr("id");
var $audioPost = $(this);
$.ajax({
url: '/api/read/json?id=' + audioID,
dataType: 'jsonp',
timeout: 10000,
success: function(data){
$audioPost.html(data.posts[0]["audio-player"]);
}
});
});
});
I'm using $newElems.find() because we only want to load up posts that are new to the page. If you just do $('.video') you'll go through all posts, including the ones that have already been loaded.

Related

Is there a method to do search query in firebase (admin) while using Node.js?

I like to search the database and see if an app is already been submitted. I tried:
var admin = require('firebase-admin');
var db = admin.database();
var ref = db.ref();
ref.query('name=' + formData.name, function(searchResult) {
if (searchResult.length == 0) {
response.writeHead(200, { 'Content-Type': 'text/html' });
response.write(userInfo);
response.end();
} else {
response.writeHead(500, { 'Content-Type': 'text/html' });
response.write('App existed.');
response.end();
}
});
Something like this should do the trick:
ref.orderByChild("name")
.equalTo(formData.name)
.once("value", function(snapshot) {
snapshot.forEach(function(child) {
console.log(snapshot.key, snapshot.val());
});
});
ref.query('name=' + formData.name, function(searchResult) {
I highly recommend that you spend some time in the Firebase documentation, which explains this and many more concepts. A few hours there, will save you many hours (and questions) down the line.
Particularly relevant to this question are:
the section on database queries with the Admin SDK
the section on database queries with the Web SDK (which works the same, but docs explain it differently)

Completely new to Node.js - API Programming

I've picked up Node.js recently. Before I jump to Express.js and other web frameworks, I learned few things about them but I wanted to try some API programming. I downloaded this module: https://www.npmjs.com/package/steamwebapi
Since I'm new to Node.js, I made new javascript file, app.js and my code is:
var SteamWebAPI = require('steamwebapi').SteamWebAPI;
SteamWebAPI.setAPIKey('My key is here');
SteamWebAPI.getRecentlyPlayedGames('76561198190043289', 5, function(response) {
console.log(response);
});
SteamWebAPI.getRecentlyPlayedGames('76561198190043289', 5, function(response) {
console.log(response);
});
'76561198190043289' is my steam 64 id. When I type: node app.js in terminal, I get:
{ response: { total_count: 1, games: [ [Object] ] } }
{ response: { total_count: 1, games: [ [Object] ] } }
How do I display my results, what I'm doing wrong?
You are not doing anything wrong. console.log makes the output more compact for the sake of readability. It can get very lengthy at times so it's probably a good thing.
It means that "[ [Object] ]" is actually an array of one or more games. You can try using
console.dir( response );
instead, or you can be more specific with log:
console.log( response.response.games );.
There are other ways around this as well if you can bother to search around. Converting to a string seems to be popular:
console.log( JSON.stringify( response, null, 4) );
Off topic...
I would also like to mention something else (since you are new) the one thing everyone must relearn coming to node from js. Calling functions like you do:
function1(..., callback);
function2(..., callback);
Node moves on to the second function immediately without waiting for the first callback to finish. So you have no idea of which of those functions will finish first. To force the order you would have to do this:
SteamWebAPI.getRecentlyPlayedGames('76561198190043289', 5, function(response) {
console.log(response);
SteamWebAPI.getRecentlyPlayedGames('76561198190043289', 5, function(response) {
console.log(response);
});
});
Your code will turn into the infamous callback hell. There is no avoiding it. It will happen sooner or later! To prevent that, learn how to use promises. You'll be much better off going from there!
Edit: Connect to angular
You need to create a server-backend of some kind. This is how it could look like using express (since you mention express):
var express = require('express');
var server = express();
var SteamWebAPI = require('steamwebapi').SteamWebAPI;
SteamWebAPI.setAPIKey('My key is here');
// define endpoints
server.get('/games', function (req, res) {
SteamWebAPI.getRecentlyPlayedGames('76561198190043289', 5, function(response) {
res.json(response.response.games);
});
});
// Start the server
server.listen(3000, function () {
console.log('Example app listening on port 3000!');
});
Once it's running you can test that it works by browsing to http://example.com:3000/games
Then you call your endpoint from angular:
var app = angular.module("app", []);
app.controller("myCtrl", function($scope, $http){
$scope.games = [];
$http.get('http://example.com:3000/games').then(function(response){
// The response is seldom exactly what you expect. Check your browser console.
console.log(response);
$scope.games = response.data;
});
});
html
<body ng-app="app" ng-controller="myCtrl">
<div ng-repeat="game in games">{{ game }}</div>
</body>
All done.
Mind you, this is all shooting from the hip (no testing whatsoever) , so there are bound to be errors. But it should give you a starting point at least.

How to use Parse.com with Node/Express and Backbone

I have my Todo list set up. I can persist to parse.com with Backbone if I press "Add" button to add a new todo. Only problem is that if i refresh the page, all the todos i just added is gone. Which is correct, because I'm not actually using a backend right now.
When integrating with Node/express, how do I do a post request to parse.com and get back the todos I currently have?
I read in a tutorial to do something like this:
var Todos = Backbone.Collection.extend({
url: 'http://localhost:3000/api/todos'
});
and something like this:
var TodosView = Backbone.View.extend({
model: todos,
el: $('.todos-list'),
initialize: function() {
this.model.on('add', this.render, this);
this.model.on('remove', this.render, this);
//this thing-----------
this.model.fetch({
success: function(response){
_.each(response.toJSON(), function(item) {
console.log('Successfully GOT todo with _id: '+ item._id);
});
},
error: function() {
console.log('Failed to get blogs!');
}
})
},
//this thing end-----------
render: function() {
var self = this;
this.$el.html('');
_.each(this.model.toArray(), function(todo) {
self.$el.append((new TodoView({model: todo})).render().$el);
});
return this;
}
});
this.model.fetch is trying to fetch from the url: from up there, but that tutorial was using MongoDB. How do I use parse.com to do the same thing??
It would be awesome if you explained your answers, because I just tried to learn backbone/node/express/parse yesterday.
var Messages = Backbone.Collection.extend({
model:Message,
url:'https://api.parse.com/1/something/something',
getMessages:function() {
this.fetch({
data:{
order:'-createdAt'
}
});
},
parse:function(response, options) {
return response.results.reverse();
}
});
In your example you are fetching and posting to your own computer http://localhost:3000/api/todos which I'm guessing you learned from your tutorial. Setup and account with parse.com and checkout out the docks. You will change the url to match their API. Checkout out their REST api documentation for specifics https://www.parse.com/docs/rest/guide.

Given a recording SID, how can I download the recording file to local drive (using Twilio node helper library)?

I am using the Twilio Node Helper Library to make a call and record it.
According to the API link, GET should return a WAV file, but in my case it just returns a json with the recording metadata.
This is what I'm writing:
twilioClient = require('twilio')(config.twilio.acct_sid, config.twilio.auth_token)
var request = twilioClient.recordings('RE01234567890123456789012345678901')
get(function (err, recording){ // <- this "recording" is JSON
It doesn't matter if I tack on a '.mp3' to the end of the SID, I always get a JSON.
Ideally I want to write something like this:
var file = fs.createWriteStream('/Users/yasemin/Desktop/rec.mp3');
twilioClient.recordings('RE01234567890123456789012345678901')
.get(function (err, recording) {
if(!err){ recording.pipe(file); }});
Thanks!
I came across this and had to develop my own code to handle this.
Here is the code I came up with below
con.on('getvmx', function(data){
comModel.find({_id: data.id}, function(err, results){
var https = require('https');
var options = {
host: 'api.twilio.com',
port: 443,
path: '/2010-04-01/Accounts/' + sid + '/Recordings/'+ results[0].sid + '.mp3',
method: 'GET',
auth: sid + ":" + auth,
agent: false
};
var req = https.request(options, function(res) {
res.setEncoding('binary');
var mp3data = '';
res.on('data', function (chunk) {
mp3data += chunk;
});
res.on('end', function(){
try{
var fileName = "/var/www/tcc/public/vm/" + results[0].sid + '.mp3';
fs.writeFile(fileName, mp3data, 'binary', function(err){
if(err){
return console.log(err);
}else{
console.log("File Saved");
con.emit('vmload', results);
}
});
}catch(err){
console.log(err.message);
}
});
});
req.end();
console.log(results);
//load all messages
//load line from reach message
});
});
TLDR: Node Helper Library doesn't have recoded file downloading capability at the moment.
This is the response from Twilio Support:
Looking at the documentation on our web portal, you are certainly
correct, downloading the .wav or .mp3 is possible via API call.
However, from what I can see looking at the Node example code here:
https://www.twilio.com/user/account/developer-tools/api-explorer/recording
And the documentation from the Twilio-Node developer here:
http://twilio.github.io/twilio-node/#recordings
It looks to me like the helper library doesn't actually support direct
downloading, just viewing the recording data. You can download the
application through an HTTP call, as shown in the original docs link
you noted on your Stackoverflow question. Let me know if you need help
with that.
In the mean time, I've reached out to the author of the library to see
if this is by design or a feature to be added to the library. It's
open source of course, so you could make a pull and add it yourself if
you like!

answer for "symfony2 chained selectors" not clear

I have the same task that described in this topic.
When I am looking in the answer I cant get one thing. What url should be set in the ajax.
$(document).ready(function () {
$('#city_country').change(function(){
$('#city_state option:gt(0)').remove();
if($(this).val()){
$.ajax({
type: "GET",
data: "country_id=" + $(this).val(),
url: Routing.generate('state_list'),
success: function(data){
$('#city_state').append(data);
}
});
}
});
});
You would use a route that points to a controller which accepts a country id and returns a list of state id's within that country.

Resources