How to categorize jQuery UI-autocomplete with YouTube's categories - jquery-ui-autocomplete

I am using jQuery UI-autocomplete to get wordlist from YouTube, I used the code proposed here: How to get the wordlist from youtube search for Jquery UI autocomplete?
I wanted to know if it is possible to autocomplete from YouTube by categories, for example, category music of YouTube.
$("#q").autocomplete({
source: function(request, response){
/* Need a api key for this, so we add it: */
var apiKey = 'MYAPIKEY';
/* command */
var query = request.term;
/* youtube ajax request */
$.ajax({
url: "http://suggestqueries.google.com/complete/search?hl=en&ds=yt&client=youtube&hjson=t&cp=1&q="+query+"&key="+apiKey+"&format=5&alt=json&callback=?",
dataType: 'jsonp',
success: function(data, textStatus, request) {
response( $.map( data[1], function(item) {
return {
label: item[0],
value: item[0]
}
}));
}
});
},
/* seçilene işlem yapmak için burayı kullanabilirsin */
select: function( event, ui ) {
}
});

Related

Paypal v2 express checkout integration in .NET

I am currently checking integration process of v2 express checkout and lot of documentation making confusion.
So far i am using checkout.js from paypal domain and using below code for order creation in client side as below
paypal.Button.render({
env: 'sandbox', // Or 'sandbox',
commit: true, // Show a 'Pay Now' button
style: {
color: 'gold',
shape: 'rect',
label: 'paypal',
size: 'medium',
tagline: false,
width: 150
},
payment: function (data, actions) {
/* Set up a url on your server to create the payment */
var CREATE_URL = '/paypal/createpaypalPayment';
/* Make a call to your server to set up the payment */
return paypal.request.post(CREATE_URL)
.then(function ({ result }) {
var test = JSON.parse(result);
return test.id;
});
},
onAuthorize: function (data, actions) {
/* Set up a url on your server to execute the payment */
var EXECUTE_URL = '/paypal/executepaypalPayment';
/* Set up the data you need to pass to your server */
var data = {
paymentID: data.paymentID,
payerID: data.payerID
};
return paypal.request.post(EXECUTE_URL, data)
.then(function (res) {
return null;
});
}
}, '#paypalcheckout');
});
Please find the server side code for create order.
[HttpPost]
public JsonResult createpaypalpayment()
{
var client = new WebClient();
string credentials = clientid + secretid;
client.Headers.Add("authorization", "Basic " + credentials);
client.Headers.Add("content-type", "application/json");
client.Headers.Add("accept-language", "en_US");
client.Headers.Add("accept", "application/json");
var body = #"{
""intent"": ""AUTHORIZE"",
""purchase_units"": [{
""amount"": {
""currency_code"": ""USD"",
""value"": ""100.00""
}
}]
}";
try
{
ServicePointManager.SecurityProtocol = SecurityProtocolType.Tls12;
var response = client.UploadString("https://api.sandbox.paypal.com/v2/checkout/orders/", "POST", body);
return Json(new { result = response }, JsonRequestBehavior.AllowGet);
}
}
}
I referred below documentation
https://developer.paypal.com/docs/archive/orders-integration-guide/#integration-steps
I am struct with how to show order details after order creation and get approval from customer end ?
Can anyone provide suggestion for this.
Thanks in advance
checkout.js is deprecated and that documentation is archived, so my suggestion is that you follow the current documentation on developer.paypal.com
In your other question, links were provided to that documentation.

Launching Ionic app routing

Found this solution to lounching app via plugin
.run(['$state', '$window',
function($state, $window) {
$window.addEventListener('LaunchUrl', function(event) {
// gets page name from url
var page =/.*:[/]{2}([^?]*)[?]?(.*)/.exec(event.detail.url)[1];
// redirects to page specified in url
$state.go('tab.'+ page, {});
});
}]);
function handleOpenURL(url) {
setTimeout( function() {
var event = new CustomEvent('LaunchUrl', {detail: {'url': url}});
window.dispatchEvent(event);
}, 0);}
This solution works great if use simply state name, ex. myapp://posts
.state('app.posts', {
url: "/posts",
views: {
'menuContent': {
templateUrl: "templates/posts.html",
controller: 'PostsCtrl'
}
}})
open app/posts.
But I need open state like this
.state('app.post', {
url: "/posts/:postId",
views: {
'menuContent': {
templateUrl: "templates/post.html",
controller: 'PostCtrl'
}
}})
with link myapp://post/2525.
Can somebody help with this? Thank you!
Solved myself )))
.run(['$state', '$window',
function($state, $window) {
$window.addEventListener('LaunchUrl', function(event) {
// gets page name from url
var page =/.*:[/]{2}([^?]*)[?]?[/]{1}([^?]*)[?]?/.exec(event.detail.url)[1];
var id =/.*:[/]{2}([^?]*)[?]?[/]{1}([^?]*)[?]?/.exec(event.detail.url)[2];
// redirects to page specified in url
// alert ("id:" +id);
$state.go('app.'+ page, {'postId': + id});
});
}]);

REST Routes with mongoose and express

When I try to add a review to my product from the front-end I am getting a 404 error for PUT http://localhost:3000/products. But I am to add/update data using the following curl command using my routes:
curl --data "name=Product 1&description=Product 1 Description&shine=10&price=29.95&rarity=200&color=blue&faces=3" http://localhost:3000/products
My products router
// This handles retrieving of products
// Includes Express
var express = require('express');
// Initialize the router
var router = express.Router();
var moment = require('moment');
var _ = require('underscore');
var color = require('cli-color');
var mongoose = require('mongoose');
var Product = mongoose.model('Product');
var Review = mongoose.model('Review');
// Route middleware
router.use(function(req, res, next) {
console.log("Something is happening in products!!");
next();
});
// GET route for all Products
router.get('/', function (req, res, next) {
Product.find( function (err, products) {
if (err) {
return next(err);
}
res.json(products);
});
});
// POST route for adding a Product
router.post('/', function (req, res, next) {
var product = new Product (req.body);
product.save( function (err, post) {
if(err) {
return next(err);
}
res.json(product);
});
});
// Pre-loading product object
router.param('product', function (req, res, next, id) {
var query = Product.findById(id);
query.exec( function (err, product) {
if (err) {
return next(err);
}
if(!product) {
return next(new Error('can\'t find product'));
}
req.product = product;
return next();
})
});
// GET route for retrieving a single product
router.get('/:product', function (req, res) {
req.product.populate('reviews', function (err, product) {
if (err) {
return next(err);
}
res.json(req.product);
});
});
// POST route for creating a review
router.post('/:product:reviews', function (req, res, next) {
var review = new Review(req.body);
review.product = req.product;
review.save( function (err, review){
if (err) {
return next(err);
}
req.product.reviews.push(review);
req.product.save( function (err, review) {
if (err) {
return next(err);
}
res.json(review);
});
});
});
This code is taken from a tutorial on thinkster for [MEAN stackl2
Original Post
I am having trouble figuring out how to update an existing entry in my mongodb database using a service I defined with ngResource in my Angular app. So far I have been unable to create a function that will update the back-end after a user clicks my submit button. I have been looking around for a solution for about 2 days but so far have not found a solution. I know the solution is similar to how I delete users in My User's Controller, but nothing I have tried has worked.
My Product Service
angular.module('gemStoreApp.productService',['ngResource'])
.factory('productsService', function($resource) {
return $resource('/products/:id', {},{
'update': { method: 'PUT'}
});
});
My Product Detail
angular.module('gemStoreApp')
.controller("ReviewCtrl", ['$scope', '$resource', 'productsService', function ($scope, $resource, productsService) {
this.review = {};
this.addReview = function(product){
product.reviews.push(this.review);
productService.save({id: product._id}, function() {
// I have tried .update, .$update, and .save methods
});
this.review = {};
};
}]);
I have verified that the products.review variable contains the update. Here is a sample of my JSON output from my console before and after adding the review:
Before the review is added to the front end
{"_id":"product_id","name":"Product 1","description":"Product 1 Description",...,"reviews":[{}]}
After the review is added to the front end
{"_id":"product_id","name":"Product 1","description":"Product 1 Description",...,"reviews":[{"stars":4,"body":"An Awesome review!","author":"user#domain.com","createdOn":1436963056994}]}
And I know that my productsService.save() function is being called as well, as I can put a console log in and see it run when I view in the browser.
My User's Controller
angular.module('gemStoreApp')
.controller('UsersCtrl', ['$scope', '$http', 'usersService', function ($scope, $http, usersService) {
$scope.users = {};
$scope.users = usersService.query();
$scope.remove = function(id) {
var user = $scope.users[id];
usersService.remove({id: user._id}, function() {
$scope.users.splice(user, 1);
});
};
}]);
My full source code is available on my Github page. Any help will be greatly appreciated.
I actually put it into work in this plunker
Took the same factory :
app.factory('productsService', function($resource) {
return $resource('product/:id', {id:"#id"},{
'update': { method: 'PUT'}
});
});
here is my controller :
$scope.products = productsService.query();
$scope.saveProduct = function(product){
product.$update();
}
and how i pass the value in the HTML :
<div ng-repeat="product in products">
<input type="text" ng-model="product.text">
<button ng-click="saveProduct(product)">Update</button>
</div>
If you track the networks request in the javascript console you will see a request : PUT /product/id with the updated data.
Hope it helped. If you have anymore question fell free to ask.

with ouath.io how to create the OAuth.create to use as on the callback

With oauth.io how to make a OAuth.create for twitter
for facebook it is
facebook_auth = OAuth.create("facebook", { oauth_token: "token_here" }, {
"url": "https://graph.facebook.com",
"cors": true,
"query": {
"access_token": "token_here"
}
});
that way you can use it on different parts of your website not just the callback after sign in.
facebook_auth.get('/me?fields=name,email').done(function (data) {
});
otherwise you're stuck only with the callback:
OAuth.callback('facebook', function (err, result) {
result.get('/me?fields=name,email').done(function (data) {
});
});
this is link to their documentation:
https://oauth.io/docs/api
For twitter, it's the same syntaxe than with facebook
var twitterTokens
OAuth.popup('twitter', function(err, res){
twitterTokens = res
})
//then elsewhere
function createTwitter() {
return OAuth.create('twitter', twitterTokens)
}
var twitter = createTwitter()
twitter.get(....)
The 3rd parameter is optional

upload base64 image facebook graph api how to use this script

Upload Base64 Image Facebook Graph API
i want to use this script that link is attached how i can use this in my wordpress post?
i want to use this for fbcover photo site.
Take a look at this code I hacked together from various examples - you can use this to post a pure base64 string to the Facebook API - no server side processing.
Here's a demo: http://rocky-plains-2911.herokuapp.com/
This javascript handles the converting of a HTML5 Canvas element to base64 and using the Facebook API to post the image string
<script type = "text/javascript">
// Post a BASE64 Encoded PNG Image to facebook
function PostImageToFacebook(authToken) {
var canvas = document.getElementById("c");
var imageData = canvas.toDataURL("image/png");
try {
blob = dataURItoBlob(imageData);
} catch (e) {
console.log(e);
}
var fd = new FormData();
fd.append("access_token", authToken);
fd.append("source", blob);
fd.append("message", "Photo Text");
try {
$.ajax({
url: "https://graph.facebook.com/me/photos?access_token=" + authToken,
type: "POST",
data: fd,
processData: false,
contentType: false,
cache: false,
success: function (data) {
console.log("success " + data);
$("#poster").html("Posted Canvas Successfully");
},
error: function (shr, status, data) {
console.log("error " + data + " Status " + shr.status);
},
complete: function () {
console.log("Posted to facebook");
}
});
} catch (e) {
console.log(e);
}
}
// Convert a data URI to blob
function dataURItoBlob(dataURI) {
var byteString = atob(dataURI.split(',')[1]);
var ab = new ArrayBuffer(byteString.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ab], {
type: 'image/png'
});
}
</script>
This handles the Facebook Authentication and shows basic HTML setup
<script type="text/javascript">
$(document).ready(function () {
$.ajaxSetup({
cache: true
});
$.getScript('//connect.facebook.net/en_UK/all.js', function () {
// Load the APP / SDK
FB.init({
appId: '288585397909199', // App ID from the App Dashboard
cookie: true, // set sessions cookies to allow your server to access the session?
xfbml: true, // parse XFBML tags on this page?
frictionlessRequests: true,
oauth: true
});
FB.login(function (response) {
if (response.authResponse) {
window.authToken = response.authResponse.accessToken;
} else {
}
}, {
scope: 'publish_actions,publish_stream'
});
});
// Populate the canvas
var c = document.getElementById("c");
var ctx = c.getContext("2d");
ctx.font = "20px Georgia";
ctx.fillText("This will be posted to Facebook as an image", 10, 50);
});
</script>
<div id="fb-root"></div>
<canvas id="c" width="500" height="500"></canvas>
<a id="poster" href="#" onclick="PostImageToFacebook(window.authToken)">Post Canvas Image To Facebook</a>
I needed this too, and was not happy with all the code around it because it is lengthy and usually needs jQuery. Here is my code for uploading from Canvas to Facebook:
const dataURItoBlob = (dataURI) => {
let byteString = atob(dataURI.split(',')[1]);
let ab = new ArrayBuffer(byteString.length);
let ia = new Uint8Array(ab);
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ia], {
type: 'image/jpeg'
});
}
const upload = async (response) => {
let canvas = document.getElementById('canvas');
let dataURL = canvas.toDataURL('image/jpeg', 1.0);
let blob = dataURItoBlob(dataURL);
let formData = new FormData();
formData.append('access_token', response.authResponse.accessToken);
formData.append('source', blob);
let responseFB = await fetch(`https://graph.facebook.com/me/photos`, {
body: formData,
method: 'post'
});
responseFB = await responseFB.json();
console.log(responseFB);
};
document.getElementById('upload').addEventListener('click', () => {
FB.login((response) => {
//TODO check if user is logged in and authorized publish_actions
upload(response);
}, {scope: 'publish_actions'})
})
Source: http://www.devils-heaven.com/facebook-javascript-sdk-photo-upload-from-canvas/