JavaScript

This password validation function in Javascript looks really awful to be honest 😃 Thoughts ?


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
function checkPassword() {
    const val = document.querySelector('.session-input > #user_password').value
    const confirm = document.querySelector('.session-input > #user_password_confirmation').value
    const email = document.querySelector('.session-input > #user_email').value.split('@')[0]

    if (val && email) {
        if (val.length < 16) {
            document.querySelector('.pw-length').classList.remove('success')
            document.querySelector('.pw-length').classList.add('error')
        } else {
            document.querySelector('.pw-length').classList.remove('error')
            document.querySelector('.pw-length').classList.add('success')
        }

        if (val.search(/[a-z]/) < 0 || val.search(/[A-Z]/) < 0) {
            document.querySelector('.lower-upper').classList.remove('success')
            document.querySelector('.lower-upper').classList.add('error')
        } else {
            document.querySelector('.lower-upper').classList.remove('error')
            document.querySelector('.lower-upper').classList.add('success')
        }

        if (val.search(/[0-9]/) < 0 || val.search(/[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]+/) < 0) {
            document.querySelector('.num-char').classList.remove('success')
            document.querySelector('.num-char').classList.add('error')
        } else {
            document.querySelector('.num-char').classList.remove('error')
            document.querySelector('.num-char').classList.add('success')
        }

        if (val != confirm) {
            document.querySelector('.pw-match').classList.remove('success')
            document.querySelector('.pw-match').classList.add('error')
        } else {
            document.querySelector('.pw-match').classList.remove('error')
            document.querySelector('.pw-match').classList.add('success')
        }

        if (checkIdenticalConsecutive()) {
            document.querySelector('.consecutive').classList.remove('success')
            document.querySelector('.consecutive').classList.add('error')
        } else {
            document.querySelector('.consecutive').classList.remove('error')
            document.querySelector('.consecutive').classList.add('success')
        }

        if (val.search(/hydra/) >= 0 || val.toLowerCase().search(email.toLowerCase()) >= 0) {
            document.querySelector('.name-email-hydra').classList.remove('success')
            document.querySelector('.name-email-hydra').classList.add('error')
        } else {
            document.querySelector('.name-email-hydra').classList.remove('error')
            document.querySelector('.name-email-hydra').classList.add('success')
        }
    }
}
S

Member

The senior front enders in the company I recently joined are trying to convince me that it's ok to write code like this


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
divisionHelperTriangle(length, score) {
    if (score === 2) {
      return length / 28
    }
    if (score === 3) {
      return length / 26
    }
    if (score === 4) {
      return length / 26.5
    }
    if (score === 5) {
      return length / 27.5
    }
    if (score === 6) {
      return length / 26
    }
    if (score >= 7) {
      return length / 25
    }
    return length / 30
  }


Nice Module Export Function in Javascript 😀

1
2
3
module.exports = function(settings, done) {
    return '3912';
};


When you are really love setTimeout in Javascript

1
2
3
4
5
setTimeout("__zoomed_div_style__.left = parseInt(__zoomed_div_style__.left) - " + (diff_width * 0.1) + " + 'px'", 50);
setTimeout("__zoomed_div_style__.left = parseInt(__zoomed_div_style__.left) - " + (diff_width * 0.1) + " + 'px'", 100);
setTimeout("__zoomed_div_style__.left = parseInt(__zoomed_div_style__.left) - " + (diff_width * 0.1) + " + 'px'", 150);
setTimeout("__zoomed_div_style__.left = parseInt(__zoomed_div_style__.left) - " + (diff_width * 0.1) + " + 'px'", 200);
setTimeout("__zoomed_div_style__.left = parseInt(__zoomed_div_style__.left) - " + (diff_width * 0.1) + " + 'px'", 250);


Member

by letha , in category: JavaScript , a year ago
no answers

List of Constants in Javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
// Variables of elements and inputs to manipulate
const dmContainer = document.querySelector('#dmContainer');
const nameMotor = document.querySelector('#nameMotor');
const chasisBtn = document.querySelector('#chasis-btn');
const chasisModal = document.querySelector('#chasis-modal');
const chasisType = document.querySelector('#chasisType');
const colorChasis = document.querySelector('#color-chasis');
const modalPop = document.querySelector('.modalPop');
const inputName = document.querySelector('#inputName');
const motorsName = document.querySelector('.motorsName');
const behindImg = document.querySelector('.defMotor');
const tyresBtn =document.querySelector('#tyres-btn');
const tyresModal = document.querySelector('#tyres-modal');
const tyresType = document.querySelector('#tyres-type');
const handleBtn = document.querySelector('#handle-btn');
const handleModal = document.querySelector('#handle-modal');
const handleType = document.querySelector('#handle-type');
const headBtn = document.querySelector('#head-btn');
const headModal = document.querySelector('#head-modal');
const headType = document.querySelector('#head-type');
const mufflerBtn = document.querySelector('#muffler-btn');
const mufflerModal = document.querySelector('#muffler-modal');
const mufflerType = document.querySelector('#muffler-type');
const brakeBtn = document.querySelector('#brake-btn');
const brakeModal = document.querySelector('#brake-modal');
const brakeType = document.querySelector('#brake-type');
const frontFlash = document.querySelector('.flash-chasis-f');
const rearFlash = document.querySelector('.flash-chasis-r');
const flashSelect = document.querySelector('#flashSelect');
const doneChasis  = document.querySelector('#doneChasis');
const motorsName2 = document.querySelector('#motors-name');
const motorsName3 = document.querySelector('#motors-name1');
const colorHead =document.querySelector('#color-head');
const colorMuffler = document.querySelector('#color-muffler')


You will never speak in Javascript language 😃

1
2
3
4
5
6
7
console.log(parseInt(0.5)); // 0
console.log(parseInt(0.05)); // 0
console.log(parseInt(0.005)); // 0
console.log(parseInt(0.0005)); // 0
console.log(parseInt(0.00005)); // 0
console.log(parseInt(0.000005)); // 0
console.log(parseInt(0.0000005)); // 5


Initialize multiple times instead of using comma in jQuery

1
2
3
4
5
6
7
8
9
$(document).ready(function () {
	$("a").easyTooltip()
});
$(document).ready(function () {
	$("img").easyTooltip()
});
$(document).ready(function () {
	$("span").easyTooltip()
});


When one setTimeout in Javascript is not enough 😁

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
setTimeout(()=>{

  $('.arrowDashed, .OG1ficon, .OG1LeaderLeft, .OG1LeaderRight').css({'transition':'1s', 'opacity':'1'});
  map.opacity.inside([1,0,0], 1);

  setTimeout(()=>{
    map.animate.og1Results(50, 2);
    $('#anotherIdToCall6').css({'transition':'1s', 'opacity':'1'})

    setTimeout(()=>{
      map.opacity.main([1,1,0], 1)
      $('.IGTopContestWrap').css({'transition':'0s', 'opacity':'0'});
      $('.IGBottomContestWrap').css({'transition':'0s', 'opacity':'0'});
    },650)

  }, 1250)

}, 100)


Member

I think too many parentNode in JavaScript 😁

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
for(var i=obj.parentNode.parentNode.childNodes.length;i>=0;i--)
{
  if(obj.parentNode.parentNode.childNodes[i]!=undefined)
  {
    if(obj.parentNode.parentNode.childNodes[i].tagName=="TR")
    {
      if (obj.parentNode.parentNode.childNodes[i].childNodes[0]!=undefined){
        for (var j=obj.parentNode.parentNode.childNodes[i].childNodes.length;j>=0;j--)
        {
          if(obj.parentNode.parentNode.childNodes[i].childNodes[j]!=undefined){
            if(obj.parentNode.parentNode.childNodes[i].childNodes[j].childNodes[0].tagName=="TABLE"){
              obj.parentNode.parentNode.childNodes[i].childNodes[j].childNodes[0].childNodes[0].childNodes[0].childNodes[0].attributes.getNamedItem("background").value = "images/category_n.png";
            }
          }
        }
      }
    }
  }
}


Member

by letha , in category: JavaScript , a year ago
no answers

Check hash function in Javascript

1
2
3
4
5
6
7
function checkHash(){
    if(getCookie("needHash") != null){
        if(getCookie("needHash").length>0){
            ensureHash(getCookie("needHash"));
        }
    }
}


by mark.berge , in category: JavaScript , a year ago
no answers

Preload images in Javascript 😁

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
function newImage(arg) {
    if (document.images) {
        rslt = new Image();
        rslt.src = arg;
        return rslt;
    }
}

function preloadImages() {
          newImage("bigphoto/kran.jpg");
          newImage("bigphoto/z1.jpg");
          newImage("bigphoto/z2.jpg");
          newImage("bigphoto/truba.jpg");
          newImage("bigphoto/put.jpg");
}


by mark.berge , in category: JavaScript , a year ago
no answers

Javascript code

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
if((value == '284') && (jQuery('#elt_31').val() != 0))
{
       setTimeout(function(){jQuery('#elt_31_fake span[name="287"]').mousedown();},500);
}
if((value == '285') && (jQuery('#elt_31').val() != 0))
{
       setTimeout(function(){jQuery('#elt_31_fake span[name="288"]').mousedown();},500);
}     
if((value == '286') && (jQuery('#elt_31').val() != 0))
{
       setTimeout(function(){jQuery('#elt_31_fake span[name="289"]').mousedown();},500);
}


When one setTimeout is not enough in JavaScript😐

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
setTimeout(function() {

  graph.removeLink('3_3', '2_1')
  keepNodesOnTop()

}, nextval())

setTimeout(function() {

  graph.removeLink('5_2', '9_1')
  keepNodesOnTop()

}, nextval())

setTimeout(function() {

  graph.removeLink('2_2', '4_1')
  keepNodesOnTop()

}, nextval())

When you exactly know how animation works in JavaScript 😁

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
let header = document.querySelector('.header');
let elem = document.querySelector('.elem');

setTimeout(() => elem.style.display = 'block', 7500);
setTimeout(() => elem.style.opacity = '0.2', 7700);
setTimeout(() => elem.style.opacity = '0.3', 7800);
setTimeout(() => elem.style.opacity = '0.4', 7900);
setTimeout(() => elem.style.opacity = '0.5', 8000);
setTimeout(() => elem.style.opacity = '0.6', 8100);
setTimeout(() => elem.style.opacity = '0.7', 8200);
setTimeout(() => elem.style.opacity = '0.8', 8300);
setTimeout(() => elem.style.opacity = '0.9', 8400);
setTimeout(() => elem.style.opacity = '1', 8500);


by adelia_boyer , in category: JavaScript , a year ago
no answers

Computed function in Vue.js, I am not sure if step Four is bug or as designed 😁

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
computed: {
  isStepOne() {
    return this.formStep === 0
  },
  isStepTwo() {
    return this.formStep === 1
  },
  isStepThree() {
    return this.formStep === 2
  },
  isStepFour() {
    return this.formStep === 3
  },
  isStepFive() {
    return this.formStep === 3
  },
},