Unknown provider: $angularCacheFactoryProvider - angular-cache can not be found - caching

I am trying to implement angular-cache in my app. I have downloaded it and include a tag in html
However I keep getting the error: Error: [$injector:unpr] Unknown provider: $angularCacheFactoryProvider <- $angularCacheFactory
I'd appreciate some help
My code is the following:
controllers.js
.controller('PlaylistsCtrl', ['$scope', '$angularCacheFactory', 'myService', '$http', '$rootScope', 'Util', '$location', function ($scope, $angularCacheFactory, myService, $http, $rootScope, Util, $location) {
$rootScope.allDeals = [];
$scope.navigate = function(url){
$location.path(url);
};
myService.getDataById(1)
.then(function (data) {
// e.g. "time taken for request: 2375ms"
// Data returned by this next call is already cached.
myService.getDataById(1)
.then(function (data) {
// e.g. "time taken for request: 1ms"
});
});
}])
services.js
.service('myService',['$http', '$q', '$rootScope', '$angularCacheFactory', function ($http, $q, $rootScope, $angularCacheFactory) {
$rootScope.allDeals = [];
$angularCacheFactory('dataCache', {
maxAge: 900000,
// Items will be actively deleted when they expire
deleteOnExpire: 'aggressive',
// This cache will clear itself every hour
cacheFlushInterval: 3600000
});
return {
getDataById: function (id) {
var deferred = $q.defer(),
start = new Date().getTime();
$http.get('http://dev.somecompany.net/bigcapi/info/info/someinfo' + id, {
params: {all: '1', mobileready: 1},
cache: $angularCacheFactory.get('dataCache')
}).success(function (data) {
$rootScope.allDeals = data;
console.log('time taken for request: ' + (new Date().getTime() - start) + 'ms');
deferred.resolve(data);
});
return deferred.promise;
}
};
}])

U forgot to include angular-cache module dependency

Related

emberjs - processing data returned from ajax call

I'm sure this is very simple but ...
I have an ember route which uses an Ajax call to retrieve an array of data. I want to create an array of model objects from that array.
When I try to create instances of the model in question I get an error
Cannot read property '_attributes' of null TypeError: Cannot read property '_attributes' of null
To try to define what the issue was I created a couple of model instances independently of the data being returned from the Ajax call, for instance :
var testPccB = ParentCostCentre.create({cceClientCode : "ABC" });
And the error occurs there as well.
The entire route code looks like this :
import Ember from 'ember';
import ParentCostCentre from "../models/parentcostcentre";
export default Ember.Route.extend({
model() {
return Ember.RSVP.hash({
costcentres: this.store.findAll('costcentre'),
parentcostcentres: this.testFindParents(),
})
},
testFindParents: function () {
var result = [];
return new Ember.RSVP.Promise(function (resolve, reject) {
const theDrvId = 888;
const theClientCode = 'ABC';
const theCceIdentifier = 'XYZXY';
console.log("About to create testPccA");
//this works
var testPccA = ParentCostCentre.create();
console.log("Finished create testPccA");
console.log("About to create testPccB");
//this generates the error
var testPccB = ParentCostCentre.create({cceClientCode : "ABC" });
console.log("Finished create testPccB");
var theUrl = "api/parentcostcentres/" + theDrvId + "/" + theClientCode + "/" + theCceIdentifier ;
Ember.$.ajax({
type: 'GET',
url: theUrl,
success: function (data) {
data.forEach(function (item) {
result.push(ParentCostCentre.create(item));
});
resolve(result);
},
error: function (request, textStatus, error) {
console.log(error);
reject(error);
}
});
});
},
setupController(controller, model) {
controller.set('costcentres', model.costcentres);
controller.set('parentcostcentres', model.parentcostcentres);
}
});
Is there something I'm failing to do here which would allow this to work ?
EDIT 1:
This is what the parentcostcentre model looks like :
import DS from 'ember-data';
export default DS.Model.extend({
cceClientCode: DS.attr('string'),
cceIdentifier: DS.attr('string'),
cciActiveFrom: DS.attr('date'),
cciActiveTo: DS.attr('date'),
cciAutoid: DS.attr('number'),
cciCcGeoLevel: DS.attr('number'),
cciCceId: DS.attr('number'),
cciDescription: DS.attr('string'),
cciPraId: DS.attr('number'),
cciMatEmpId: DS.attr('number'),
cciIsDisabled: DS.attr('number'),
cciPostsummFlag: DS.attr('string'),
cciTdEmpId: DS.attr('number'),
emiActiveToPra: DS.attr('date'),
emiActiveToTd: DS.attr('date'),
emiEmailAddressPra: DS.attr('string'),
emiEmailAddressTd: DS.attr('string'),
emiNameFamilyPra: DS.attr('string'),
emiNameFamilyTd: DS.attr('string'),
emiNameFirstPra: DS.attr('string'),
emiNameFirstTd: DS.attr('string')
});
EDIT 2
For what it's worth the data returned by the API call is shown below. I'm not sure how relevant that is given that even this processing ...
var testPccB = ParentCostCentre.create({cceClientCode : "ABC" });
... generates the error but I include it for completeness.
[
{
"id": 5101,
"cceClientCode": "ABC",
"cceIdentifier": "XYZXY",
"cciAutoid": 81415,
"cciCceId": 5111,
"cciActiveFrom": "2017-03-27T11:47:23",
"cciActiveTo": "2300-01-01T00:00:00",
"cciGeoId": 888,
"cciIsDisabled": 0,
"cciPraEmpId": 40336,
"cciTdEmpId": 14694,
"cciDescription": "South Bigtown",
"cciPostsummFlag": "S",
"cciCcFinancialLevel": 1,
"emiNameFirstPra": "Phil",
"emiNameFamilyPra": "Franklin",
"emiActiveToPra": "2300-01-01T00:00:00",
"emiEmailAddressPra": "Phil.Franklin#example.com",
"emiNameFirstTd": "Phillipa",
"emiNameFamilyTd": "Howard",
"emiActiveToTd": "2300-01-01T00:00:00",
"emiEmailAddressTd": "Phillipa.Howard#example.com"
}
]
OK I found the answer to this.
I simply passed the response from the Ajax straight back rather than trying to build an array out of it. So the testFindParents code now looks like this :
testFindParents: function () {
var result = [];
return new Ember.RSVP.Promise(function (resolve, reject) {
const theDrvId = 888;
const theClientCode = 'ABC';
const theCceIdentifier = 'XYZXY';
var theUrl = "api/parentcostcentres/" + theDrvId + "/" + theClientCode + "/" + theCceIdentifier ;
Ember.$.ajax({
type: 'GET',
url: theUrl,
success: function (data) {
resolve(data);
},
error: function (request, textStatus, error) {
console.log(error);
reject(error);
}
});
});
},
Of course that doesn't explain why I can't instantiate an instance of parentcostcentre as I was trying to in the test code but the primary problem at least is resolved.

node.js - Socket IO times out after some time

I'm trying to build up a socket.io server for my own multiplayer game, but for some reason the server goes down after a certain amount of time and I don't know why. I have tried several ways to run the server (nodemon and forever, everything with or without screen). I don't think that this is an inactivity problem because I added a random stuff generator to simulate some activity on the server, yet the problem persists. My cpu load with the running server stays between 2-3 %. I'm running node 4.x and the current stable socket.io build (1.3.6).
And here is my code:
var shortId = require('shortid'),
io = require('socket.io')(process.env.PORT || 4567),
mysql = require('mysql'),
connection = mysql.createConnection({
host: 'localhost',
user: 'xxx',
password: 'xxx',
database: 'xxx'
});
var clients = [];
var clientLookup = {};
//Placed Components (builded stuff from players or enviroment)
var placed_components = 'Server1_PlacedC';
connection.connect(function (err) {
if (err) {
console.error('error connecting: ' + err.stack);
return;
}
});
setInterval(function () {
var random = Math.random();
//connection.query(
// 'INSERT INTO '+placed_components+' SET ?',
// {data:countdown},
// function(err,result){
// if (err) throw err;
// }
//);
console.log(random);
}, 100);
io.on('connection', function (socket) {
var currentClient;
console.log('connected', socket.id);
//////////////////////////////////////////////////////////////////////////////
socket.on('disconnect', function () {
console.log('player disconnected', currentClient.id);
socket.broadcast.emit('disconnected', currentClient)
var index = clientLookup[currentClient.id];
clients.splice(index, 1);
})
///////////////////////////////////////////////////////////////////////////// /
socket.on('register', function (data) {
currentClient = {
id: shortId.generate(),
health: 100,
isDead: false
};
console.log('registering', currentClient.id);
clients.push(currentClient);
clientLookup[currentClient.id] = currentClient;
socket.emit('registerSuccess', {id: currentClient.id});
socket.broadcast.emit('spawn', {id: currentClient.id});
console.log('connected players', clients.length);
clients.forEach(function (client) {
if (currentClient.id == client.id)
return;
socket.emit('spawn', {id: client.id});
console.log('sending spawn to new player for playerid', client.id);
})
});
socket.on('beep', function () { // Beep Request
socket.emit('boop');
console.log("received some beep!");
});
socket.on('move', function (data) {
data.id = currentClient.id;
socket.broadcast.emit('move', data);
//console.log(JSON.stringify(data));
});
socket.on('ShareObject', function (data) {
data.id = currentClient.id;
socket.broadcast.emit('ReveiveObject', data);
console.log(JSON.stringify(data));
});
socket.on('SharePlayerAnimation', function (data) {
data.id = currentClient.id;
socket.broadcast.emit('BroadcastPlayerAnimation', data);
console.log("a Player changed his animation" + JSON.stringify(data));
});
//////////////////////////////////////////////////////////////////////////////
socket.on('benchmark', function (data) {
console.log(data);
});
//////////////////////////////////////////////////////////////////////////////
})
console.log('server started');

How can I handle a ajax request response in the Flux Architecture?

Looking at the Flux Documentation I can't figure out how the code to a ajax update, and a ajax fetch would fit into the dispatcher, store, component architecture.
Can anyone provide a simple, dummy example, of how an entity of data would be fetched from the server AFTER page load, and how this entity would be pushed to the server at a later date. How would the "complete" or "error" status of request be translated and treated by the views/components? How would a store wait for the ajax request to wait? :-?
Is this what you are looking for?
http://facebook.github.io/react/tips/initial-ajax.html
you can also implement a fetch in the store in order to manage the information.
Here is an example (it is a concept, not actually working code):
'use strict';
var React = require('react');
var Constants = require('constants');
var merge = require('react/lib/merge'); //This must be replaced for assign
var EventEmitter = require('events').EventEmitter;
var Dispatcher = require('dispatcher');
var CHANGE_EVENT = "change";
var data = {};
var message = "";
function _fetch () {
message = "Fetching data";
$.ajax({
type: 'GET',
url: 'Url',
contentType: 'application/json',
success: function(data){
message = "";
MyStore.emitChange();
},
error: function(error){
message = error;
MyStore.emitChange();
}
});
};
function _post (myData) {
//Make post
$.ajax({
type: 'POST',
url: 'Url',
// post payload:
data: JSON.stringify(myData),
contentType: 'application/json',
success: function(data){
message = "";
MyStore.emitChange();
},
error: function(error){
message = "update failed";
MyStore.emitChange();
}
});
};
var MyStore = merge(EventEmitter.prototype, {
emitChange: function () {
this.emit(CHANGE_EVENT);
},
addChangeListener: function (callback) {
this.on(CHANGE_EVENT, callback);
},
removeChangeListener: function (callback) {
this.removeListener(CHANGE_EVENT, callback);
},
getData: function (){
if(!data){
_fetch();
}
return data;
},
getMessage: function (){
return message;
},
dispatcherIndex: Dispatcher.register( function(payload) {
var action = payload.action; // this is our action from handleViewAction
switch(action.actionType){
case Constants.UPDATE:
message = "updating...";
_post(payload.action.data);
break;
}
MyStore.emitChange();
return true;
})
});
module.exports = MyStore;
Then you need to subscribe your component to the store change events
var React = require('react');
var MyStore = require('my-store');
function getComments (){
return {
message: null,
data: MyStore.getData()
}
};
var AlbumComments = module.exports = React.createClass({
getInitialState: function() {
return getData();
},
componentWillMount: function(){
MyStore.addChangeListener(this._onChange);
},
componentWillUnmount: function(){
MyStore.removeChangeListener(this._onChange);
},
_onChange: function(){
var msg = MyStore.getMessage();
if (!message){
this.setState(getData());
} else {
this.setState({
message: msg,
data: null
});
}
},
render: function() {
console.log('render');
return (
<div>
{ this.state.message }
{this.state.data.map(function(item){
return <div>{ item }</div>
})}
</div>
);
}
});
I hope it is clear enough.

How to access the JSON on HTTP from an HTTPS page?

Here is my code I am trying to access the content on HTTP page from an HTTPS page it is giving me an error in browser console that it is an insecure content, following is an error ' Loading mixed (insecure) active content on a secure page "http://pnrbuddy.com/api/station_by_code/code/cnb/format/json/pbapikey/539ff0f815ca697c681fe01d32ba52e3/pbapisign/906544ca31f9c0048e80bde8127556af828e313b" ' , it is showing Json inbrowser console but unable to read it. How can I read that JSON?
'use strict';
var context = SP.ClientContext.get_current();
var user = context.get_web().get_currentUser();
(function () {
// This code runs when the DOM is ready and creates a context object which is
// needed to use the SharePoint object model
$(document).ready(function ()
{
getUserName();
$("#button1").click(function()
{
paraupdate();
});
});
// This function prepares, loads, and then executes a SharePoint query to get
// the current users information
function paraupdate()
{
var str=""+$("#textbox1").val();
alert(""+str);
var message = str+"json539ff0f815ca697c681fe01d32ba52e3";
var secret = "<my private key>";
var crypto = CryptoJS.HmacSHA1(message, secret).toString();
alert("crypto answer is " + crypto);
var siteurl="http://pnrbuddy.com/api/station_by_code/code/"+str+"/format/json/pbapikey/539ff0f815ca697c681fe01d32ba52e3/pbapisign/"+crypto;
//////////////////////////////////////////////
$.ajax({
url: siteurl,
type: "GET",
dataType: 'json',
/* headers: {
"accept": "application/json;odata=verbose",
}, */
success: function (data) {
alert("Success");
alert(data.Station);
/* $.each(data.d.results, function (index, item)
{
alert("My ID"+index);
alert("Item"+item);
});
//var str=JSON.parse(data);
var myResults = [];
$.each(data, function (index, item) {
alert("dsfsd"+item.station_by_code)
myResults.push({
id: item.id,
//text: item.first_name + " " + item.last_name
});
}); */
},
error: function (error) {
alert("IN Error");
alert(JSON.stringify(error));
}
});
/////////////////////////////////////////////
}
function getUserName()
{
context.load(user);
context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}
// This function is executed if the above call is successful
// It replaces the contents of the 'message' element with the user name
function onGetUserNameSuccess()
{
$("#label1").html("Enter Station Code : ");
$("#button1").val("CLICK");
}
// This function is executed if the above call fails
function onGetUserNameFail(sender, args) {
alert('Failed to get user name. Error:' + args.get_message());
}
})();
'use strict';
var context = SP.ClientContext.get_current();
var user = context.get_web().get_currentUser();
(function () {
// This code runs when the DOM is ready and creates a context object which is
// needed to use the SharePoint object model
$(document).ready(function ()
{
getUserName();
$("#button1").click(function()
{
paraupdate();
});
});
// This function prepares, loads, and then executes a SharePoint query to get
// the current users information
function paraupdate()
{
var str=""+$("#textbox1").val();
alert(""+str);
var message = str+"json539ff0f815ca697c681fe01d32ba52e3";
var secret = "<my private key>";
var crypto = CryptoJS.HmacSHA1(message, secret).toString();
alert("crypto answer is " + crypto);
var siteurl="http://pnrbuddy.com/api/station_by_code/code/"+str+"/format/json/pbapikey/539ff0f815ca697c681fe01d32ba52e3/pbapisign/"+crypto;
//////////////////////////////////////////////
$.ajax({
url: siteurl,
type: "GET",
dataType: 'json',
success: function (data) {
alert("Success");
alert(" Code : "data.stations[0].code+" Name : "+data.stations[0].name);
},
error: function (error) {
alert("IN Error");
alert(JSON.stringify(error));
}
});
/////////////////////////////////////////////
}
function getUserName()
{
context.load(user);
context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}
// This function is executed if the above call is successful
// It replaces the contents of the 'message' element with the user name
function onGetUserNameSuccess()
{
$("#label1").html("Enter Station Code : ");
$("#button1").val("CLICK");
}
// This function is executed if the above call fails
function onGetUserNameFail(sender, args) {
alert('Failed to get user name. Error:' + args.get_message());
}
})();

How to work with $resource in angularjs

I am trying to get data form this url http://api.geonames.org/citiesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&lang=de&username=demo
through $resource below is my resource code
angular.module('myApp.services', ['ngResource']).
value('version', '0.1').factory('recipes1',['$resource', '$http', '$log', function ($resource, $http, $log) {
return $resource('http://api.geonames.org/citiesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&lang=de&username=demo',{ },{ locate: {method: 'GET', isArray: true, transformResponse: $http.defaults.transformResponse.concat(function(data, headersGetter) {
// probably be better if you examined the results in here
alert(data);
})}
});
}]);
but i am not getting response. i am getting out put from my controller as
function Resource(value){
"use strict";
copy(value || {}, this);
}
Use $http with promise factory:
See working Demo in fiddle
JS
var fessmodule = angular.module('myModule', ['ngResource']);
fessmodule.controller('fessCntrl', function ($scope, Data) {
$scope.runMe = function () {
Data.query($scope.url)
.then(function (result) {
$scope.data = result;
}, function (result) {
alert("Error: No data returned");
});
}
});
fessmodule.$inject = ['$scope', 'Data'];
fessmodule.factory('Data', ['$http','$q', function($http, $q) {
var data = $http({method: 'GET', url: 'http://api.geonames.org/citiesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&lang=de&username=demo'});
var factory = {
query: function (address) {
var deferred = $q.defer();
deferred.resolve(data);
return deferred.promise;
}
}
return factory;
}]);

Resources