Prevent esc from stopping audio playback - html

So, I've got a web application running only on IE11. I use a windows media player control to play an audio file.
If the user presses escape on the page, the playing of the audio file is ended.
How can I prevent this?
<!DOCTYPE html>
<HTML>
<HEAD>
</HEAD>
<BODY>
<OBJECT CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" type="application/x-oleobject">
<PARAM name="URL" value="http://sampleswap.org/samples-ghost/%20MAY%202014%20LATEST%20ADDITIONS/PUBLIC%20DOMAIN%20MUSIC/626%5Bkb%5Dbuster-brown-gonna-make-you-happy-1943.mp3.mp3">
</OBJECT>
</BODY>
</HTML>

Perhaps something like this to disable it
(document).keyup(function(e) {
if (e.keyCode == 27) { // escape key maps to keycode `27`
e.preventDefault();
return false;
}
});

Try using javascript. (If you using only IE it should be work)
document.attachEvent("onkeydown", keyHandler);
function keyHandler() {
if(event.keyCode == 27)
{
event.returnValue = false;
event.keyCode = 0;
break;
}
}
27 is ESC key value.
And, this is alternative way.
document.addEventListener("keydown",function(e){
var charCode = e.charCode || e.keyCode || e.which;
if (charCode == 27){
return false;
}
});

Related

How to implement a barcode scanner that works on a smartphone (iPhone and Android) using zxing in html

Among the answers to various questions, I checked the answers below and applied them.
Running the app and taking a picture works on Android, but it doesn't work on the iPhone. What should I do?
<!DOCTYPE html>
<HTML>
<HEAD>
<script type="text/javascript">
if(window.location.hash.substr(1,2) == "zx"){
var bc = window.location.hash.substr(3);
localStorage["barcode"] = decodeURI(window.location.hash.substr(3))
window.close();
self.close();
window.location.href = "about:blank";//In case self.close isn't allowed
}
</script>
<SCRIPT type="text/javascript" >
var changingHash = false;
function onbarcode(event){
switch(event.type){
case "hashchange":{
if(changingHash == true){
return;
}
var hash = window.location.hash;
if(hash.substr(0,3) == "#zx"){
hash = window.location.hash.substr(3);
changingHash = true;
window.location.hash = event.oldURL.split("\#")[1] || ""
changingHash = false;
processBarcode(hash);
}
break;
}
case "storage":{
window.focus();
if(event.key == "barcode"){
window.removeEventListener("storage", onbarcode, false);
processBarcode(event.newValue);
}
break;
}
default:{
console.log(event)
break;
}
}
}
window.addEventListener("hashchange", onbarcode, false);
function getScan(){
var href = window.location.href;
var ptr = href.lastIndexOf("#");
if(ptr>0){
href = href.substr(0,ptr);
}
window.addEventListener("storage", onbarcode, false);
setTimeout('window.removeEventListener("storage", onbarcode, false)', 15000);
localStorage.removeItem("barcode");
//window.open (href + "#zx" + new Date().toString());
if(navigator.userAgent.match(/Firefox/i)){
//Used for Firefox. If Chrome uses this, it raises the "hashchanged" event only.
window.location.href = ("zxing://scan/?ret=" + encodeURIComponent(href + "#zx{CODE}"));
}else{
//Used for Chrome. If Firefox uses this, it leaves the scan window open.
window.open ("zxing://scan/?ret=" + encodeURIComponent(href + "#zx{CODE}"));
}
}
function processBarcode(bc){
document.getElementById("scans").innerHTML += "<div>" + bc + "</div>";
//put your code in place of the line above.
}
</SCRIPT>
<META name="viewport" content="width=device-width, initial-scale=1" />
</HEAD>
<BODY>
<INPUT id=barcode type=text >
<INPUT style="width:100px;height:100px" type=button value="Scan" onclick="getScan();">
<div id="scans"></div>
</BODY>
</HTML>
Apple has removed its access to use camera to scan barcode directly from a website or even a app can't do it, If you want to scan barcode, you need to use their camera app to scan, more on here and if you want to link your application to a QR code, you can use their universal links to launch an app by scanning a QR code.
But yes, in android, any barcode scanner will work directly from website, even to this date.

Disable enter in input box

I have a textarea where it should not be possible to input line breaks by pressing enter. How can I disable enter in my textarea?
That is the code:
<textarea name="textarea" style="width:250px;height:150px;"></textarea>
Don't forget to use the keydown event instead of the click event
$("input").keydown(function(event) {
if (event.keyCode == 13) {
event.preventDefault();
}
});
If you use jquery in your web application you can do fallowing trick to disable enter key.
$('textarea').keydown(function(e) {
if(e.which == 13) { return false; }
});
else you can use this
document.getElementById('textarea_id').addEventListener('keydown', function(k){
if(k.keyCode == 13) return false;
});
I hope this will help you!
Use event.preventdefault and next do what you like. For example
<script>
$("textarea").click(function(event) {
if (event.keyCode == 13) {
event.preventDefault();
}
});
</script>

How to work with circumflex accent in html textarea?

I have textarea in HTML file and I need to work with circumflex accent, that means a user need to have an option to type characters like:
ŝĝĉ
If I try to type it now, it does nothing (it does not type anything). Where could be problem?
I already use:
<meta charset="UTF-8">
The other not common characters works well, for example:
ěščř
The issue was caused by js:
$(document).keydown(function (e)
{
var keycode1 = (e.keyCode ? e.keyCode : e.which);
if (keycode1 == 0 || keycode1 == 9) {
e.preventDefault();
e.stopPropagation();
}
});
the solution was the change to:
$(document).keydown(function (e)
{
var keycode1 = (e.keyCode ? e.keyCode : e.which);
if (keycode1 == 9) {
e.preventDefault();
e.stopPropagation();
}
});
Now it works well. It is possible to type the characters and it still escape the "tab".

Running small snippets of code persistently in Chrome (eg. tiny extensions)

Can I run small script snippets in Chrome all the time, as they were mini extensions? Without the manifest and packaging involved with a regular extension?
I basically want to "hack" Chrome to send events when I press media keys. A script like so:
sendRequest = function(action) {
return chrome.extension.sendRequest({
action: action
}, (function() {}));
};
document.addEventListener("keydown", function(e) {
if (e.keyCode === 32) {
return sendRequest("pause");
} else if (e.keyCode === 37) {
return sendRequest("previous");
} else if (e.keyCode === 39) {
return sendRequest("next");
}
});
I'm imagining this can be added via the Sources tab and some of the new magic there, but not sure.
The extensions API (chrome.extension.sendRequest) is not available to non-extensions, obviously. A real mini-extension should do the job.

How to disable specific keyboard keys on a webpage?

I am developing a webpage using Wordpress 3.04, and I'm experiencing the following issue:
In this webpage, I implemented a script that changes the background image every 10 seconds or so. Now, when users press the Left Arrow and Right Arrow keys, it makes the background picture change back and forth accordingly, and messes up the rotation cycle.
This becomes a problem in the Contact Form section of the site, since users that might need to navigate left and right inside each field might end up changing the background pic instead.
I would also like to disable the "Enter" key, to avoid the form being sent if the users are not done writing their message.
I looked around and found this javascript code that didn't work:
document.onkeydown=function DisableCTRL(e)
{
var val=(document.all)?event.keyCode:event.which;
if(parseInt(val)==17)//CTRL
{
alert('Not Allowed!');
window.event.returnValue=false;
}
}
This JS code didn't work either:
function stopRKey(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13) && (node.type=="text")) {return false;}
}
document.onkeypress = stopRKey;
Any help will be greatly appreciated. Thanks!
I think, you should call stop() on the passed event, i.e.
document.onkeydown = function(e) {
if (e.keyCode == 17) {
alert('Not Allowed!');
e.stop();
}
};
and maybe use addEventListener(). I am not sure, intercepting the Ctrl key down will actually turn of Ctrl altogether. I guess, you need to intercept cursor left/right with the ctrlKey attribute set. For testing key events, see e.g. http://unixpapa.com/js/testkey.html.
PS. document.all: http://javascript.about.com/od/hintsandtips/a/worst_4.htm
You need to call e.preventDefault() to stop the event from going ahead.. I wrote this function to handle unwanted keys on a site recently:
PreventIllegalKeyPress = function (e) {
if (e.target) t = e.target; //Firefox and others
else if (e.srcElement) t = e.srcElement; //IE
if (e.keyCode == 116) { //prevent F5 for refresh
e.preventDefault();
}
if (e.keyCode == 122) { //F11 leave fullscreen
e.preventDefault();
} else if (e.altKey && e.keyCode == 115) { //Alt + F4
e.preventDefault();
} else if (e.altKey && e.keyCode == 37) { //Alt + left
e.preventDefault();
} else if (e.altKey && e.keyCode == 39) { //Alt + right
e.preventDefault();
} else if (e.ctrlKey && e.keyCode == 82) { //Ctrl + R (reload)
e.preventDefault();
}
if (!(t.tagName == 'INPUT')) {
if (e.keyCode == 13) { //enter
e.preventDefault();
}
if (e.keyCode == 8) { //backspace
e.preventDefault();
}
}};
Note the check for t.tagName == "INPUT". This makes sure that both enter and backspace keys are allowed in input field but no-where else.
Then in $(document).ready, paste the following snippet to call the function:
$(document).keydown(function (e) {
NFS.PreventIllegalKeyPress(e);
});
This works perfectly fine for me.