I am using dropzone.js for my project.
Is it possible to use or to call two(2) "init: function" there?
Thanks for helping .
I have this
Dropzone.options.filedrop = {
maxFilesize: 4096,
init: function () {
this.on("complete", function (file) {
doSomething();
});
}
};
Sure, you can do it like this:
Dropzone.options.filedrop = {
maxFilesize: 4096,
init: function () {
this.on("complete", function (file) {
doSomething();
}),
this.on('sending', function () {
doSomethingElse();
})
}
};
Related
I am looking to assign as an object a Fetch API promise from a local GeoJSON file.
Here is the code
fetch("data/sites.geojson")
.then(function(response) {
return response.json();
})
.then(function(data) {
L.geoJSON(data, {
pointToLayer: styles_sites
}).addTo(map);
});
};
I tried the call back method, as advised here
Saving fetched JSON into variable
(EDIT) New code, but there is still a missing formal parameter
function getData("data/sites.geojson", cb) {
fetch("data/sites.geojson")
.then(function(response) {
return response.json();
})
.then(function(data) {
L.geoJSON(data, {
pointToLayer: styles_sites,
onEachFeature: function (feature, layer) {
layer.on('mouseover', function() {
layer.openPopup(layer.bindPopup("<b>"+feature.properties.nombre+"</b>"))
});
layer.on('mouseout', function() {
layer.closePopup();
});
layer.on('click', function () {
layer.bindPopup("<b>Nombre: </b>"+feature.properties.nombre+"<br><b>Barrio: </b>"+feature.properties.barrio+"<br><b>Tipo: </b>"+feature.properties.tipo+"<br><b>Ubicacion: </b>"+feature.properties.ubicacion+"<br><b>Correo: </b>"+feature.properties.contacto);
});
}
}).addTo(map);
.then(function(result) {
cb(result);
});
});
};
getData("data/sites.geojson", function (data) {
return console.log({data});
});
Most probably just incorrect syntax of your callback function:
// Use either arrow function
getData("data/sites.geojson", (data) => {
return console.log({data});
});
// or standard function
getData("data/sites.geojson", function (data) {
return console.log({data});
});
I found the way to work this out by adding within the fetch function, what I originally wanted to do on the map.
This was to add a L.controlLayer using the geojson as overlay.
This is the code that made it work:
let sites = getData()
.then((function(data) {
L.geoJSON(data, {
pointToLayer: styles_sites,
onEachFeature: function LayerControl(feature, layer) {
var popupText = "<b>" + feature.properties.nombre + "<br>";
layer.bindPopup(popupText);
category = feature.properties.tipo;
// Initialize the category array if not already set.
if (typeof categories[category] === "undefined") {
categories[category] = L.layerGroup().addTo(map);
layersControl.addOverlay(categories[category], category);
}
categories[category].addLayer(layer);
layer.on('mouseover', function() {
layer.openPopup(layer.bindPopup("<b>"+feature.properties.nombre+"</b>"))
});
layer.on('mouseout', function() {
layer.closePopup();
});
layer.on('click', function () {
layer.bindPopup("<b>Nombre: </b>"+feature.properties.nombre+"<br><b>Barrio: </b>"+feature.properties.barrio+"<br><b>Tipo: </b>"+feature.properties.tipo+"<br><b>Ubicacion: </b>"+feature.properties.ubicacion+"<br><b>Correo: </b>"+feature.properties.contacto);
});
}
}).addTo(map);
}));
Actually it comes from one of your answer on another post ghybs.
My controller file :
define(['app', 'back123','loginService'], function (app) {
app.controller('loginController', function ($scope, $window, loginService, srvAuth) {$scope.emailValidate = function () {
var pattern = /^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (!pattern.test($scope.Email) ) {
$scope.email_invalid = true;
return false;
}
else {
$scope.email_invalid = false;
return true;
}
};
})
});
My test file:
define(['app', 'jquery', 'angular-mock', 'coreService', 'setterService', 'loginService','logincontroller'], function (App, $) {
describe('app', function () {
beforeEach(module('app'));
describe('logincontroller Email Vaidate', function () {
var scope;
beforeEach(inject(function ($rootScope, $controller) {
scope = $rootScope.$new();
$controller("loginController", {
$scope: scope
});
}));
it('sets email false', function () {
scope.email_invalid = false;
scope.Email = 'true';
scope.emailValidate();
expect(scope.email_invalid).toEqual(false);
});
});
});
});
In my browser 'Sources' tab loginCtrl file is loaded which contains logincontroller function
Still getting error
Error: [ng:areq] Argument 'loginController' is not a function, got undefined
Please suggest
Since I have used angularAMD, I updated the code as folows :
angularAMD.inject(function ($rootScope, $controller) {
scope = $rootScope.$new();
$controller("loginController", {
$scope: scope
});
});
Also, I included angularAMD as dependency in define module:
define(['app', 'jquery', 'angularAMD', 'angular-mock', 'coreService', 'setterService', 'loginService', 'loginController'], function (App, $, angularAMD) {
I'm using the accordion component of uikit and I'm trying to extend the plugin ... this is what I wrote
UIkit.on('beforeready.uk.dom', function () {
$.extend(UIkit.components.accordion.prototype, {
init: function () {
}
});
and this is the init code that is changing:
init: function() {
var $this = this;
this.element.on('click.uikit.accordion', this.options.toggle, function(e) {
e.preventDefault();
$this.toggleItem(UI.$(this).data('wrapper'), $this.options.animate, $this.options.collapse);
});
this.update();
if (this.options.showfirst) {
this.toggleItem(this.toggle.eq(0).data('wrapper'), false, false);
}
},
as you can see with this code I can override the init function ...however I want to keep the existing init function and add some code in it....is it possible to do so?
Thanks in advance
I'm using jasmine+karma to run the following code...
and get the following error:
Expected { then : Function, catch : Function, finally : Function } to equal 123.
Can someone help me understand why I don't get a resolved value for my promise. thanks
'use strict';
angular
.module('example', ['ui.router'])
.config(function($stateProvider) {
$stateProvider
.state('stateOne', {
url: '/stateOne',
resolve: {cb: function($q) {
var deferred = $q.defer();
deferred.resolve(123);
return deferred.promise;
}},
controller: function($scope, cb) {console.log(' * in controller', cb);},
templateUrl: 'stateOne.html'
});
})
.run(function($templateCache) {
$templateCache.put('stateOne.html', 'This is the content of the template');
});
describe('main tests', function() {
beforeEach(function() {module('example');});
describe('basic test', function($rootScope) {
it('stateOne', inject(function($rootScope, $state, $injector, $compile) {
var config = $state.get('stateOne');
expect(config.url).toEqual('/stateOne');
$compile('<div ui-view/>')($rootScope);
$rootScope.$digest();
expect($injector.invoke(config.resolve.cb)).toEqual(123);
}));
});
});
Ok, Figured it out with some help (via email) from Nikas, whose blog I found at:
http://nikas.praninskas.com/angular/2014/09/27/unit-testing-ui-router-configuration/.
Here is a succinct example that demonstrates how to test the resolve values in ui.router, where the values involve $http.
angular
.module('example', ['ui.router'])
.factory('Clipboard', function($http) {
return {
get: function(args) {
return $http.get('/db/clipboard');
}
};
})
.config(function($stateProvider) {
$stateProvider
.state('stateOne', {
resolve: {cb: function(Clipboard) {
return Clipboard.get();
}}
});
});
describe('main tests', function() {
beforeEach(function() {module('example');});
it('stateOne', inject(function($state, $injector, $httpBackend) {
$httpBackend.whenGET('/db/clipboard').respond({a:1});
$injector.invoke($state.get('stateOne').resolve['cb'])
.then(function(res) {console.log(' *res ', res.data);})
.catch(function(err) {console.log(' *err ', err);});
$httpBackend.flush();
}));
afterEach(inject(function($httpBackend) {
$httpBackend.verifyNoOutstandingExpectation();
$httpBackend.verifyNoOutstandingRequest();
}));
});
I'm having difficulty testing that Reflux actions are triggering correctly in my application, and in fact they do not seem to be working at all with Jest. I have this example test:
jest.autoMockOff();
describe('Test', function () {
it('Tests actions', function () {
var Reflux = require('../node_modules/reflux/index');
var action = Reflux.createAction('action');
var mockFn = jest.genMockFn();
var store = Reflux.createStore({
init: function () {
this.listenTo(action, this.onAction);
},
onAction: function () {
mockFn();
}
});
action('Hello World');
expect(mockFn).toBeCalled();
});
});
Which outputs:
● Test › it Tests actions
- Expected Function to be called.
at Spec.<anonymous> (__tests__/Test.js:20:20)
at Timer.listOnTimeout [as ontimeout] (timers.js:112:15)
Even with Jasmine async functions it doesn't seem to be working
jest.autoMockOff();
describe('Test', function () {
it('Tests actions', function () {
var Reflux = require('../node_modules/reflux/index');
var action = Reflux.createAction('action');
var mockFn = jest.genMockFn();
var flag = false;
var store = Reflux.createStore({
init: function () {
this.listenTo(action, this.onAction);
},
onAction: function () {
mockFn();
flag = true;
}
});
runs(function () {
action();
});
waitsFor(function () {
return flag;
}, 'The action should be triggered.', 5000);
runs(function () {
expect(mockFn).toBeCalled();
});
});
});
gives me...
FAIL __tests__/Test.js (6.08s)
● Test › it Tests actions
- Throws: [object Object]
Has anybody made this work?
I figured it out! I just needed to use Jest's own methods for fast-forwarding any timers. i.e. just add the line
jest.runAllTimers();
So the working version of my first example would be
jest.autoMockOff();
describe('Test', function () {
it('Tests actions', function () {
var Reflux = require('../node_modules/reflux/index');
var action = Reflux.createAction('action');
var mockFn = jest.genMockFn();
var store = Reflux.createStore({
init: function () {
this.listenTo(action, this.onAction);
},
onAction: function () {
mockFn();
}
});
action('Hello World');
jest.runAllTimers();
expect(mockFn).toBeCalled();
});
});