If the keyPressed event is 27 by pressing 'esc' it will print the console.log("ESCY"); as many times as the loopcnt var, all at once
loopcnt = 0;
var fps = 22;
var interval = 1000 / fps;
function draw()
{
setTimeout(function()
{
if (willAnimate)
{
window.requestAnimationFrame(draw);
console.log("Framecnt: "+ loopcnt);
loopcnt++;
}
IndexJSON.each(function(key, value){ IndexOBJECT[key].render(); });
$(window).delegate('body', 'keydown', function(event){
keyPressed = event.which;
if (keyPressed == 27)
{
willAnimate = false;
console.log("ESCY");
}
});
}, interval);
};
willAnimate = true;
draw();
If you ask me, it doesn't make logical sense...
It's as if it's buffering all the console.logs, until the if statement is true..
Any idea why this happens?
(And another question: I tried cancelling the setTimeout function with return, but it won't terminate the function, probably because return will only return from the if statement, but is there a way to externally terminate the function?)
OK, apparently when I move the .delegate outside the setTimeout(); It won't trigger the if statement multiple times.
And, I'm realizing now, that I'm binding the key every time the loop loops, thus when I press the key it will trigger all the bindings..
Pretty obvious now that I think about it...
Related
I am trying to make a program that stores my button digital input so that I don't have to keep holding the button for it to work.
The algorithm I am trying to develop is when the button is pressed, it it executes the servoMomvement() function then increments count by one. If count is even then program runs, but then if the button is pressed again it will not be even and would stop working.
void loop() {
while(true){
int count = 0;
bool isEven = count%2;
bool condition = digitalRead(4);
if(condition == true && isEven == false){
servoMovement();
count++;
}
}
}
It is not working as intended. I still have to hold to push button for it to not stop executing.
You can use timer to incremenet count by one.This timer function check periodically button. And when you press it will work as you want. But first of all you have to know timers ability and capacity.
The problem is that the loop method is executed in a loop (like one could guess by the name of the method...) and therefore it's checked in every loop whether the button is pressed.
Because in your if statement it says condition == true && ... this will only be true if the condition is true (the button is pressed).
If I understood your question correctly you want to have some kind of start-/stop-button. If so you could try like this:
//global variable run
bool run;
void setup() {
run = false;
}
void loop() {
while(true){
bool condition = digitalRead(4);
if (condition) {
run = !run;//switch the state of the run variable
delay(50);//some delay to debounce the button; see https://www.brainy-bits.com/arduino-switch-debounce/ for more information
}
if(run){
servoMovement();
}
}
}
I have a quite simple solution for that.
You can compare the actual buttonstate with the buttonstate the "round" before.
bool Button = false;
bool ButtonBefore = false;
bool help = false;
void loop()
{
Button = digitalRead(ButtonPin);
if(Button > ButtonBefore) help = !help;
if(help) { do stuff; }
ButtonBefore = Button;
}
When you press the button, "Button" becomes true while "ButtonBefore" is still false. So "Button" is bigger than "ButtonBefore" so "help" changes to true. In the next cycle "ButtonBefore" is even to "Button" so "help" won't change its state. When the button is released, "ButtonBefore" is bigger than "Button" so it "help" won't change too. So the state from "help" is changed when the button is pressed.
I hope I could help you with this.
I have several charts built with dc.js. I can achieve the desired functionality by attaching a callback to each dc.js chart's .on("filterted", function(chart) {}) but this is annoying because I have to attach the same callback to each chart. And error prone because as new charts are added, someone has to remember to attach an event hander. I would prefer to just attach a callback to the underlying crossfilter. Is that possible?
Is there a way to optimize this...
var ndx = crossfilter(data);
var dimAlpha = ndx.dimension(function(d) {return d.alpha});
var dimBeta = ndx.dimension(function(d) {return d.beta});
var groupAlpha = dimAlpha.group().reduceSum(function(d) {return 1;});
var groupBeta = dimBeta.group().reduceSum(function(d) {return 1;});
dc.pieChart(myDomId1)
.dimension(dimAlpha)
.group(groupAlpha)
.on("filtered", function(chart) {
//do stuff
});
dc.pieChart(myDomId2)
.dimension(dimBeta)
.group(groupBeta)
.on("filtered", function(chart) {
//do stuff
});
into something like this...
var ndx = crossfilter(data);
var dimAlpha = ndx.dimension(function(d) {return d.alpha});
var dimBeta = ndx.dimension(function(d) {return d.beta});
var groupAlpha = dimAlpha.group().reduceSum(function(d) {return 1;});
var groupBeta = dimBeta.group().reduceSum(function(d) {return 1;});
dc.pieChart(myDomId1)
.dimension(dimAlpha)
.group(groupAlpha);
dc.pieChart(myDomId2)
.dimension(dimBeta)
.group(groupBeta);
ndx.on("filtered", function() {
//do stuff
})
If you've got a million charts and don't want to have to attach the event listener to each one manually, you could iterate through the chart registry and add them that way. Ex:
dc.chartRegistry.list().forEach(function(chart) {
chart.on('filtered', function() {
// your event listener code goes here.
});
});
Note that this code must go after the charts have instantiated to work.
In the absence of a way to attach the callback once globally, one thing you could do to mitigate the risk from duplicate code is to define the callback function once and pass in a reference instead of defining it inline on each chart.
function my_func() {
// do stuff
}
dc.pieChart(myDomId2)
.dimension(dimBeta)
.group(groupBeta)
.on("filtered", my_func);
chart and filter can also be passed to the filter function something like:
function my_func(chart,filter) {
// do stuff
}
dc.pieChart(myDomId2)
.dimension(dimBeta)
.group(groupBeta)
.on("filtered", my_func);
I have a click event bound to the following ko function:
self.select = function (entity, event) {
var ctrlPressed = false;
if (event.ctrlKey) { ctrlPressed = true; }
if (!ctrlPressed) {
manager.deselectAll();
this.selected(true);
} else {
this.selected() ? this.selected(false) : this.selected(true);
}
}
It is bound like so:
data-bind="click: select, event: { dblclick: function(){alert('test');}}"
This currently works except that it fires "select" twice when you double click, which I do not want. I tried following the advice in this SO question, but when I create the singleClick() function, I get an error that "ctrlKey is not a function of undefined". So it's not passing the event properly. Further more, the doubleClick() function in the other answer there doesn't work at all. It gives an error on the "handler.call" part saying handler is not defined.
So, how can I successfully call my ko select function on singleClick but NOT on doubleclick?
I don't think this is really a knockout issue. You have at least these two options:
1. Implement some custom logic that prevents processing if a single click has started processing already
2. Prevent the double-click function altogether. JQuery has this handy handler:
$(selector).on("dblclick", function(e){
e.preventDefault(); //cancel system double-click event
});
So I technically got it to work. Here is my new singleClick function
ko.bindingHandlers.singleClick = {
init: function (element, valueAccessor, c, viewModel) {
var handler = valueAccessor(),
delay = 400,
clickTimeout = false;
$(element).click(function (event) {
if (clickTimeout !== false) {
clearTimeout(clickTimeout);
clickTimeout = false;
} else {
clickTimeout = setTimeout(function () {
clickTimeout = false;
handler(viewModel, event);
}, delay);
}
});
}
};
This passes the viewModel and event to the handler so I can still modify observables and capture ctrlKey pressed.
The binding:
data-bind="singleClick: select, event: { dblclick: function(){alert('test');}}"
The problem is that now, obviously, single clicking an item has a delay while it waits to see if it's a double click. This is an inherent and unsolvable issue, I believe, so though this technically answers my question, I will consider a completely different route (ie, no double-clicking at all in my interface)
I have a loop that has an asynchronous call inside it, with a callback. To be able to move on, I need the callback to fire for the entire loop all the way through, to then display the results of the loop.
Every way I've tried to control this doesn't work (have tried Step, Tame.js, async.js, and others) - any suggestions on how to move forward?
array = ['test', 'of', 'file'];
array2 = ['another', 'array'];
for(i in array) {
item = array[i];
document_ids = new Array();
for (i2 in array2) {
item2 = array2[i2];
// look it up
mongodb.find({item_name: item2}).toArray(function(err, documents {
// because of async,
// the code moves on and calls this back later
console.log('got id');
document_ids.push(document_id);
}))
}
// use document_ids
console.log(document_ids); // shows []
console.log('done');
}
// shows:
// []
// done
// got id
// got id
You're logging document_ids before your callbacks fire. You have to keep track of how many callbacks you've run to know when you're done.
An easy method is to use a counter, and to check the count on each callback.
Taking your example
var array = ['test', 'of', 'file'];
var array2 = ['another', 'array'];
var document_ids = [];
var waiting = 0;
for(i in array) {
item = array[i];
for (i2 in array2) {
item2 = array2[i2];
waiting ++;
mongodb.find({item_name: item2}).toArray(
function(err, document_id) {
waiting --;
document_ids.push(document_id);
complete();
})
);
}
}
function complete() {
if (!waiting) {
console.log(document_ids);
console.log('done');
}
}
I'm tracking how fast does the text of a textArea change. If it changes faster than 500 ms then i don't want to do anything, but if it doesn't change in 500 ms, i want to call a method.
I tried like this:
public function textchangeListener(e : Event):void
{
if(((new Date).getTime() - changeTime)>500)
{
prepareText();
}
changeTime = (new Date).getTime();
}
This method is the event handler for text change.
But the problem is, if it changes only under 500 ms and after that it doesn't change, then my method won't be called. I make this for a better performance, so the prepareText() is called only when the user stops typing for 500 ms.
How about this...
Once you get the first text change event you can call a procedure like textTimeOut(). It will essentially work like this.
function textTimeOut():void
{
start a timer for 500 ms
set an event listener for it (your prepareText() function)
if textTimeOut is called again before the timer gets to 0,
reset the timer to 500 ms
}
I would use a setTimeout in the event handler and reset it everytime it changes:
var changeTimeout:Number = -1
function handler(e:Event):void {
if(changeTimeout != -1)
clearTimeout(changeTimeout)
changeTimeout = setTimeout(function():void{
changeTimeout = -1
prepareText();
}, 500)
}
So I used a timer. Thanks for the advice. This is what the end result is:
protected var timer:Timer = new Timer(300);
public function AdvancedTextArea()
{
super();
this.addEventListener(Event.CHANGE,textchangeListener);
timer.addEventListener(TimerEvent.TIMER,prepareText);
timer.repeatCount = 1;
}
public function textchangeListener(e : Event):void
{
if(timer.running)
{
timer.stop();
}
timer.start();
}