Key capture directive not working as intended in Angularjs - angularjs

i am trying to capture keypress events in my angular app.
The intended functionality is that upon pressing g1 (i.e simulataneously pressing g and 1) the app should transition to state1. Upon pressing g2 the app should transition to state2 and so on.
However the app does not seem to be capturing two keypresses simulataneously. What am I missing here ?
Also is this the best way to achieve this or are there better solutions available.
You can see the plnkr here
http://plnkr.co/edit/sK0NYNDRtH4lFfteNd5O

You could pass the e.codeValue to a service/controller which then stores the keys pressed in an array.
On key press up, tell the service/controller to remove it from the "key pressed" array.
In the service/controller, you can then use your logic to see if g and 1 are in the array - if they are, do the state transition. That could work, although not 100% if it's the best way. Give it a try and let us know if it worked for you.

Javascript is single-threaded, so there is no way for the following if statement to ever run the true block:
if (x == 3 && x == 4) {
// true
} else {
// false
}
Aside from that, the real problem you're facing is that (to my knowledge) the browser does not directly expose rollover scan codes to Javascript. By the time the browser gets the keystrokes they're already de-rollovered (if that's a word).
BTW, style note: It's better to post your code here on Stack Overflow to save it for posterity for other readers to learn from. Adding a plunkr is a nice courtesy, but it's secondary.

Related

reactjs,how to deal with user event trigger multiple times in short time?

I use react.js + es6 + webpack to develop my application.
recently, I find if I click a button multiple times in short time, the click handler will trigger multiple times.
I think it's a common case, code snippet like this:
#debounce()
onMidCardClick(url) {
console.count('onMidCardClick trigger times : ');
window.location.href = url;
}
before navigate to the url address, onMidCardClick event handler will triggers multiple times.
So, my way is create a debounce.decorator.js to handle this situation.
I think my way's advantage is easy to read and keep maintainability.
My question is:
1. Is it necessary to handle this? I mean, maybe react synthetic event will handle this for me?
2. My application has many events, I add debounce decorator for many of them. I test it, it works fine, but I am not sure I am correct. Because I saw many applications not deal with this.
No, all you need to do is, the moment user clicks a button, disable the button till you get the response. You can also disable other buttons too if required. Ex.
<button type="button" disabled={!this.clicked}>Button</button>
From a usability point of view, if the user clicks on a button/li/div element and you are executing some logic, it is better to give a visual indicator that some processing is happening, with a loader or a progress bar.
You can write a react component for a full page loader like this and show it to the user, which effectively prevents the user from clicking the element again while giving a visual clue as well.

How can we detect when the model is back to its original value?

JS Bin here
This article describes a clever way to see if your (pure Angular) form model has changed since the initial load. In my mind it's a more accurate test of $dirty/$pristine. This allows us to do things like hide the "Save" button for a form if the model hasn't changed, even if the user has typed then deleted text.
So the question is, how can we do this with angular-formly? My hunch is that onChange for each field might be a good starting point, but I'm having a lot of trouble putting together the rest of the solution.
Hope the question makes sense. Any ideas would be very welcome. Thanks!
This might work in a limited capacity:
scope.initialValue;
var listener = scope.$watch(function(oldVal,newVal){
scope.initialValue = oldVal
listener();
})
atinder was correct in that the pure Angular approach actually works fine with angular-formly. I've created a working JS Bin here.

AngularJS: is there a debug mode for typos in bindings?

I've just wasted half an hour hunting for what turned out to be...
<select.... data-ng-options="x as x.name for x in customerController_clipped.options"
instead of
<select.... data-ng-options="x as x.name for x in customerController_Clipped.options"
That is, a one-character typo - in this case, a 'clip...' instead 'Clip...'
Sure, it's easy to see it when it's isolated above - but think of this inside huge HTML content, and you now know why I ask:
Is there a way to ask AngularJS to report any failures in names of bindings, to ease our debugging? A simple console logging of this kind of failure would suffice, instead of a silent operation that leaves our components empty...
I can't see anything built in for doing this, though maybe you could raise with angular.js as a feature request, or try writing a pull request for putting an option in $parseProvider? If you want to do this the only way I can see right now is by altering the code in the $parse service which does the interpreting of any expressions.
I've plunked a quick test to see how easy it is. The original code is from angular 1.1.5. Search for ANDYMOD in the angular-1.1.5.js file to see the code I've edited. This basically adds a console.log for whenever the y and z parts of a 'x.y.z' expression are undefined or null, rather than ignoring it.
This is in no way a production-worthy solution, and doesn't work it you want to use ng-csp, but it shows something can be done at least. Maybe you can sub these few lines in if you ever need to test again...

Radio buttons not selecting in old program

I wrote a large complex C program around 20(!) years go. As far as I can recall it worked fine at the time in all respects - it was probably running on windows 95.
Now I need to use it again. Unfortunately the radio buttons in it do not appear to work properly any more (the ordinary push buttons are all behaving correctly). As I click on the radio buttons, I get some feedback that windows is acknowledging my click in as much as I see a dotted line appear around the button's text and the circle of the button goes grey for as long as my finger is on the button, but when I take my finger off I see that the selected button has not changed.
My suspicion is that I was perhaps getting away with some bad practice at the time which worked with windows 95 but no longer works on newer versions of windows, but I'm struggling work out what I did wrong. Any ideas?
EDIT: Its difficult to extract the relevant code because the message handling in this program was a tangled nightmare. Many buttons were created programatically at runtime and there were different message loops working when the program was in different modes of operation. The program was a customisable environment for running certain types of experiment. It even had its own built-in interpreted language! So I'm not expecting an answer like "you should have a comma instead of a semicolon at line 47", but perhaps something more like "I observed similar symptoms once in my program and it turned out to be ..... " .. or perhaps "the fact that the dotted rectangle is appearing means that process AAA has happened, but maybe step BBB has gone wrong".
EDIT: I've managed to extract some key code which my contain an error...
char *process_messages_one_at_a_time()
{
MSG msg;
int temp;
temp = PeekMessage(&msg,winh,0,0,PM_NOREMOVE);
if (temp)
{
GetMessage (&msg, NULL, 0, 0);
if (msg.message == WM_LBUTTONUP)
{
mouse_just_released_somewhere = TRUE;
}
TranslateMessage (&msg);
DispatchMessage (&msg);
}
if (button_command_waiting)
{
button_command_waiting = FALSE;
return (button_command_string);
}
else
{
return (NULL);
}
}
There are two simple things to check when using radio buttons. First is to make sure that each has the BS_AUTORADIOBUTTON property set. The second is to make sure that the first button in the tab order and the next control after the set of buttons (typically a group box) have the WS_GROUP property set, while the other buttons have it clear.
A few suggestions:
I'd try to use spy++ to monitor the messages in that dialog box, particularly to and from the radiobutton controls. I wonder if you'll see a BM_SETCHECK that your program is sending (ie, somewhere you're unchecking the button programatically).
Any chance your code ever checks the Windows version number? I've been burned a few times with an == where I should have used a >= to ensure version checking compatibility.
Do you sub-class any controls? I don't remember, but it seems to me there were a few ways sub-classing could go wrong (and the effects weren't immediately noticeable until newer versions of Windows rolled in).
Owner-drawing the control? It's really easy to for the owner-draw to not work with newer Windows GUI styles.
Working with old code like that, the memories come back to me in bits and pieces, rather than a flood, so it usually takes some time before it dawns on me what I was doing back then.
If you just want to get the program running to use it, might I suggest "compatibility mode".
http://www.howtogeek.com/howto/windows-vista/using-windows-vista-compatibility-mode/
However, if you have a larger, expected useful life of the software, you might want to consider rewriting it. Rewriting it is not anywhere near the complexity or work of the initial write because of a few factors:
Developing the requirements of a program is a substantial part of the required work in making a software package (the requirements are already done)
A lot of the code is already written and only parts may need to be slightly refactored in order to be updated
New library components may be more stable alternatives to parts of the existing codebase
You'll learn how to write current applications with current library facilities
You'll have an opportunity to comment or just generally refactor and cleanup the code (thus making it more maintainable for the anticipated, extended life)
The codebase will be more maintainable/compatible going forward for additional changes in both requirements and operating systems (both because it's updated and because you've had the opportunity to re-understand the entire codebase)
Hope that helps...

Multiple Instance of AudioStreamer if tap too fast in tableview

I'm having issues with the AudioStreamer which is driving me crazy. I have a tableview with songs from a remote server. When I click on a song it stream fine, but if I tap too fast I get multiple instance of AudioStreamer playing different songs.
I heard that making AudioStreamer a singleton will fix this issue, but I tried that and it crashes too often. Does anybody had faced this issue and founded a solution?
Thanks.
UPDATED:
The solution to this problem was to remove this line from the -(void)stop method. Also change anything that says state to self.state
if (state == AS_WAITING_FOR_DATA || state == AS_STARTING_FILE_THREAD)
return;
The solution to this problem was to remove this line from the -(void)stop method. Also change anything that says state to self.state
if (state == AS_WAITING_FOR_DATA || state == AS_STARTING_FILE_THREAD)
return;
I founded the solution in another post. But just in case, here is what I did wrong.
Another post here at stackoverflow pointed to the following link. I follow the solution in that link before but not completely. I missed the most important part which was below the code.
https://github.com/mattgallagher/AudioStreamer/issues/26
"The variable pausedByInterruption is needed since we only want to resume playing after an interruption iff audio was paused by an interruption. So, the ivar pausedByInterruption needs to be set to NO in the following methods: pause, start, stop and initWithUrl."
Let me repeated, make sure that you do this part "the ivar pausedByInterruption needs to be set to NO in the following methods: pause, start, stop and initWithUrl."
After doing this, my issue was resolved.

Resources