I am tryting to create a Bitmap and add it to the stage, but it doesn't work.
this.queue.on("fileload", function(event) {
if(event.item.id == "bg") {
var bg = new createjs.Bitmap(this.queue.getResult("bg"));// doesn't work hereļ¼
}
}, this);
However, if I do this in the complete handler it works:
this.queue.on("complete", function(event) {
var bg = new createjs.Bitmap(this.queue.getResult("id"));
this.stage.addChild(bg); //works out and no error
}, this);
Thanks very much for helping me!!
Related
I using code like in this page. how can I add marker cluster?
Thanks.
[Google Map v3 auto refresh Markers only
Sample script...
$(function() {
var locations = {};//A repository for markers (and the data from which they were constructed).
//initial dataset for markers
var locs = {
1: { info:'11111. Some random info here', lat:-37.8139, lng:144.9634 },
2: { info:'22222. Some random info here', lat:46.0553, lng:14.5144 },
3: { info:'33333. Some random info here', lat:-33.7333, lng:151.0833 },
4: { info:'44444. Some random info here', lat:27.9798, lng:-81.731 }
};
var map = new google.maps.Map(document.getElementById('map_2385853'), {
zoom: 1,
maxZoom: 8,
minZoom: 1,
streetViewControl: false,
center: new google.maps.LatLng(40, 0),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var auto_remove = true;//When true, markers for all unreported locs will be removed.
function setMarkers(locObj) {
if(auto_remove) {
//Remove markers for all unreported locs, and the corrsponding locations entry.
$.each(locations, function(key) {
if(!locObj[key]) {
if(locations[key].marker) {
locations[key].marker.setMap(null);
}
delete locations[key];
}
});
}
$.each(locObj, function(key, loc) {
if(!locations[key] && loc.lat!==undefined && loc.lng!==undefined) {
//Marker has not yet been made (and there's enough data to create one).
//Create marker
loc.marker = new google.maps.Marker({
position: new google.maps.LatLng(loc.lat, loc.lng),
map: map
});
//Attach click listener to marker
google.maps.event.addListener(loc.marker, 'click', (function(key) {
return function() {
infowindow.setContent(locations[key].info);
infowindow.open(map, locations[key].marker);
}
})(key));
//Remember loc in the `locations` so its info can be displayed and so its marker can be deleted.
locations[key] = loc;
}
else if(locations[key] && loc.remove) {
//Remove marker from map
if(locations[key].marker) {
locations[key].marker.setMap(null);
}
//Remove element from `locations`
delete locations[key];
}
else if(locations[key]) {
//Update the previous data object with the latest data.
$.extend(locations[key], loc);
if(loc.lat!==undefined && loc.lng!==undefined) {
//Update marker position (maybe not necessary but doesn't hurt).
locations[key].marker.setPosition(
new google.maps.LatLng(loc.lat, loc.lng)
);
}
//locations[key].info looks after itself.
}
});
}
var ajaxObj = {//Object to save cluttering the namespace.
options: {
url: "........",//The resource that delivers loc data.
dataType: "json"//The type of data tp be returned by the server.
},
delay: 10000,//(milliseconds) the interval between successive gets.
errorCount: 0,//running total of ajax errors.
errorThreshold: 5,//the number of ajax errors beyond which the get cycle should cease.
ticker: null,//setTimeout reference - allows the get cycle to be cancelled with clearTimeout(ajaxObj.ticker);
get: function() { //a function which initiates
if(ajaxObj.errorCount < ajaxObj.errorThreshold) {
ajaxObj.ticker = setTimeout(getMarkerData, ajaxObj.delay);
}
},
fail: function(jqXHR, textStatus, errorThrown) {
console.log(errorThrown);
ajaxObj.errorCount++;
}
};
//Ajax master routine
function getMarkerData() {
$.ajax(ajaxObj.options)
.done(setMarkers) //fires when ajax returns successfully
.fail(ajaxObj.fail) //fires when an ajax error occurs
.always(ajaxObj.get); //fires after ajax success or ajax error
}
setMarkers(locs);//Create markers from the initial dataset served with the document.
//ajaxObj.get();//Start the get cycle.
// *******************
//test: simulated ajax
/*
var testLocs = {
1: { info:'1. New Random info and new position', lat:-37, lng:124.9634 },//update info and position and
2: { lat:70, lng:14.5144 },//update position
3: { info:'3. New Random info' },//update info
4: { remove: true },//remove marker
5: { info:'55555. Added', lat:-37, lng:0 }//add new marker
};
setTimeout(function() {
setMarkers(testLocs);
}, ajaxObj.delay);
*/
// *******************
});
I want to remove selected file of kendo upload control on click event of another button and I followed the below link
Triggering OnCancel event of kendo upload on click of button the remove event fired but not clear the file below is my code. please can any one help me what i am doing wrong.
$(document).ready(function () {
$("#files").kendoUpload({
"multiple": false,
select: function (event) {
console.log(event);
var notAllowed = false;
$.each(event.files, function (index, value) {
if ((value.extension).toLowerCase() !== '.jpg') {
alert("not allowed! only jpg files!");
notAllowed = true;
}
else if (value.size > 3000000) {
alert("file size must less than 3MB ");
notAllowed = true;
}
if (event.files.length > 1) {
alert("Please select single file.");
e.preventDefault();
}
});
var breakPoint = 0;
if (notAllowed == true) event.preventDefault();
var fileReader = new FileReader();
fileReader.onload = function (event) {
var mapImage = event.target.result;
$("#sigimage").attr('src', mapImage);
document.getElementById("sigimage").style.display = 'block';
}
fileReader.readAsDataURL(event.files[0].rawFile);
},
remove: function (e) {
alert("remove");
e.preventDefault();
},
});
$("#closewindow").click(function (e) {
$("#files").data("kendoUpload").trigger("remove");
});
});
You can use the following code for removing the file inside your click function.
$(".k-delete").parent().click();
Please visit the fiddle here for a working example
You can create your custom function like this:
function remove(){
$(".k-upload-files").remove();
$(".k-upload-status").remove();
$(".k-upload.k-header").addClass("k-upload-empty");
$(".k-upload-button").removeClass("k-state-focused");
};
It will delete trigger delete of uploaded files.
I'm a newbie at ExtJs and I'm struggling to figure out how to use callback functions in ExtJs. The ExtJs version I'm using is 4.2.1
Basically I want to chain the execution of 2 functions:
func1: function() {
}
func2: function() {
}
so that func2() only starts executing after func1() completes.
From what I've read so far, I need to use callback function, but for the life of me I cannot get it.
Here Is my code:
filter: function (filters, value) {
if (Ext.isString(filters)) {
filters = {
property: filters,
value: value
};
}
var me = this,
decoded = me.decodeFilters(filters),
i = 0,
length = decoded.length;
for (; i < length; i++) {
me.filters.replace(decoded[i]);
}
Ext.Array.each(me.filters.items, function (filter) {
Ext.Object.each(me.tree.nodeHash, function (key, node) {
if (filter.filterFn) {
if (!filter.filterFn(node)) node.remove();
} else {
if (node.data[filter.property] != filter.value) node.remove();
}
});
});
me.hasFilter = true;
console.log(me);
},
clearFilter: function() {
var me = this;
me.filters.clear();
me.hasFilter = false;
me.load();
},
isFiltered: function() {
return this.hasFilter;
},
filterNavAdminSTByUserName: function (nameValue) {
this.clearFilter();
this.filter([{
property: 'userName',
value: nameValue
}]);
}
My problem is that this.filter() gets executed before this.clearFilter(); How do I force this.filter() to execute only after this.clearFilter() completes?
Thanks in advance!
After some soul searching I've finally figured out how callback functions work.
So here is the solution:
clearAndFilter: function (nameValue) {
var me = this;
me.filters.clear();
me.hasFilter = false;
me.load({
scope: me,
callback: function () {
// filter the store
me.filter('userName', nameValue);
}
});
},
filterNavAdminSTByUserName: function (nameValue) {
this.clearAndFilter(nameValue);
}
Feels good to answer to my first ever post here!
Hi I have a problem and the error stated:- "Error: Target must be an event emitter."
If there is a change in fire variable and selectHandler is resumed, shouldn't the methods be triggered - toggleDropDown and focus?
Here's my code below:-
var fire = false;
var toggle1, toggle2 = true;
var select = new Select
({
store:storeA
}, 'node_Select');
select.startup();
fire = true;
var switchStore = new button
({
onClick: function()
{if (toggle1)
{
select.setStore(storeB);
toggle1 = false;
}
else
{
select.setStore(storeA);
toggle1 = true;
}
fire = true;
}
}, 'node_switchStore');
switchStore.startup();
var selectHandler = on.pausable(fire, 'change' function()
{
if(fire)
{
select.toggleDropDown();
select.focus();
fire=false;
}
})
var switchPause = new button
({
onClick: function()
{if (toggle2)
{
selectHandler.resume();
toggle2 = false;
}
else
{
selectHandler.pause();
toggle2 = true;
}
}
}, 'node_switchPause');
switchPause.startup();
What is event emitter? Only input change, button and DOM elements' events?
It seems that the fire variable is not event emitter, isn't it?
Please advise
Clement
It has to do with this line:
var selectHandler = on.pausable(fire, 'change' function()
You're trying to listen to one of javascripts primitive types, Boolean. In order for "dojo/on" to work, it has to listen to something that can fire off events. From what I'm seeing in your code sample, what you probably need is a function that handles the changing of the "fire" variable. How about something like this:
var openFire = function() {
select.toggleDropDown();
select.focus();
fire = false;
}
now instead of setting
fire=true;
you can just call
openFire();
I want to migrate the javascript in my site from YU2 to YUI3, but I am only a poor amateur programer and I am stuck at the first pitfall.
I have the following code:
MyApp.Core = function() {
return {
init: function(e, MyAppConfig) {
if (MyAppConfig.tabpanels) {
MyApp.Core.prepareTabpanels(MyAppConfig.tabpanels);
}
},
prepareTabpanels: function(tabpanels) {
// Code here
}
}
}();
var MyAppConfig = {
"tabpanels":{"ids":["navigation"]}
};
YAHOO.util.Event.addListener(window, "load", MyApp.Core.init, MyAppConfig);
How can I pass the MyAppConfig object to the MyApp.Core.init function by using YUI3 "domready" event listener?
Thanks in advance!
You should be able to do something like:
var MyApp = {};
MyApp.Core = function(){ return {
init: function(MyAppConfig) {
console.log(MyAppConfig);
},
prepareTabpanels: function(tabpanels) {
// Code here
}
}
}();
var MyAppConfig = {
"tabpanels":{"ids":["navigation"]}
};
YUI().use('node', 'event', function(Y){
Y.on('domready', MyApp.Core.init, this, MyAppConfig);
});
Note that the event is not passed in as the first parameter, it is the config.
Y.on accepts parameters as <event_type>, <callback_function>, <context>, <params>..
any parameter after the third item is passed through to the callback function so MyAppConfig becomes the first parameter in your init.
EDIT
See the YUI3 API documentation here: http://developer.yahoo.com/yui/3/api/YUI.html#method_on