These are chat archives for FreeCodeCamp/HelpJavaScript

3rd
Jun 2018
abraham anak agung
@padunk
Jun 03 2018 03:45
@ankur1163 try surge.sh, it fast
Daniel Simeonov
@dbsimeonov
Jun 03 2018 07:45

Guys, I'm still struggling with runing json from local file.

{
    "data": [
        {
            "container": "talentsWrapper",
            "image": "css/images/bartenders/jognpape.jpg",
            "title": "JOSH PAPE",
            "location": "WILDEBEEST VANCOUVER CANADA",
            "desc": "Josh Pape lets his superior craftsmanship shine through as he mixes up Cognac West.",
            "btn": "btnWithArrow"
        }
       ]
}
var ajaxhttp = new XMLHttpRequest();
var url = '/js/data/dataTalents.json';

ajaxhttp.open("GET", url, true);
ajaxhttp.onreadystatechange = function(){
    if(this.readyState == 4 && this.status == 200){
        console.log(JSON.parse(this.responseText));
    }
}
ajaxhttp.send(null);

Any ideas what i'm doing wrong? I receive an error Uncaught SyntaxError: Unexpected token :

Aditya
@ezioda004
Jun 03 2018 09:08
@dbsimeonov Seems to be working for me (tried locally).
Daniel Simeonov
@dbsimeonov
Jun 03 2018 09:10
So you do not receive that error?
Actually somehow I fixed it thanks!
Dimitris Nik.
@dimitrissnk
Jun 03 2018 10:12
Hello, isn't there any HTML only code for clearing the previous word typed in an HTML input form? Do I have to use necessarily JS ?
Kudzu
@czhower
Jun 03 2018 14:15
@Dimitrios51 You need JS
orensaldanha
@orensaldanha
Jun 03 2018 14:36
hi
can anyone help me out with env variables
abraham anak agung
@padunk
Jun 03 2018 14:43
@Dimitrios51 do you mean you don't want previous type to show up? use autocomplete attributes.
Kudzu
@czhower
Jun 03 2018 14:56
@orensaldanha What kind of help?
Gulsvi
@gulsvi
Jun 03 2018 15:59
@Dimitrios51 onfocus="this.value=''"
<form action=".">
  <input id="myInput" onfocus="this.value=''" value="hello">
</form>
@dbsimeonov Can you share your full code? The code you pasted above works fine: https://s.codepen.io/anon/pen/ERPKBe?editors=0012
Dimitris Nik.
@dimitrissnk
Jun 03 2018 16:06
@gulsvi I found it! thanks anyway!
Gulsvi
@gulsvi
Jun 03 2018 16:12
@orensaldanha What's your question about environment variables?
arowolodaniel
@arowolodaniel
Jun 03 2018 21:21
hello guys
can someone help me with this code

<!DOCTYPE html>

<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Poller+One" rel="stylesheet">
<style>
.beep {
width: 5px;
height: 0;
border: 5px solid transparent;
border-top: 10px solid yellow;
border-bottom: 80px solid red;
position:relative;
left: 140px;
}
@keyframes blink {
50% {
background: radial-gradient(circle, red 15%, transparent 40%), #cc5;
}
}
@-webkit-keyframes blink {
50% {
background: -webkit-radial-gradient(circle, red 15%, transparent 40%), #cc5;
}
}
@-moz-keyframes blink {
50% {
background: -moz-radial-gradient(circle, red 15%, transparent 40%), #cc5;
}
}
.laser {
animation: blink .5s infinite;
-webkit-animation: blink .5s infinite;
-moz-animation: blink .5s infinite;
}
.brain {
background: radial-gradient(circle, red 15%, transparent 40%), yellow;
background: -webkit-radial-gradient(circle, red 15%, transparent 40%), yellow;
background:-moz-radial-gradient(circle, red 15%, transparent 40%), yellow;
background-size: 75px 150px;
height: 150px;
width: 150px;
border-bottom:40px double blue;
border-radius: 60px 60px 10px 10px;
position: relative;
left: 70px;
}
.torso {
height: 0;
width: 140px;
border-top: 300px solid rgba(225, 225, 0,1);
border-left: 75px solid transparent;
border-right: 75px solid transparent;
border-radius: 20px 20px 100px 100px;
}
.foot {
height: 40px;
width: 40px;
background: red;
border-radius: 40px;
border: 15px solid cyan;
position:relative;
left:110px;
top:-10px;
z-index: -1;
}
.robot {
position: relative;
left:200px;
z-index: 1;
}
.left {
font-family:'Poller One', verdana, arial, sans-serif;
font-weight: bold;
font-size: 250px;
color: red;
transform: rotate(200deg);
-webkit-transform: rotate(200deg);
-moz-transform: rotate(200deg);
position: relative;
left: -190px;
top: -320px;
z-index:-1;
}
.right {
font-family:'Poller One', verdana, arial, sans-serif;
font-weight: bold;
font-size: 250px;
color: red;
transform: scaleY(-1) rotate(20deg);
-webkit-transform: scaleY(-1) rotate(20deg);
-moz-transform: scaleY(-1) rotate(20deg);
position: relative;
right: -190px;
top: -620px;
z-index:-1;
}
@keyframes dance {
from {
left: 800px;
}
}
-@-webkit-keyframes dance {
from {
left: 800px;
}
}
-@-moz-keyframes dance {
from {
left: 800px;
}
}

img {
position : absolute;
top: 200px;
left: 400px;
animation: dance 4s infinite;
-webkit-animation: dance 4s infinite;
-moz-animation: dance 4s infinite;
}
</style>
</head>

<body>
<div class="robot">
<div class="laser"></div>
<div class="beep"></div>
<div class="brain"></div>
<div class="torso">
<div class="left">j</div>
<div class="right">j</div>
</div>
<div class="foot"></div>
</div>
<button class="flash"> laser eyes on/off</button>
<button class="color"> change color!</button>
<button class="moves"> break dance!</button>
<img src="https://i.imgur.com/FfNxebt.gif">
<script>
//on ever click on the button, put on/off the blink
$(".flash").click(function() {
$(".brain").toggleClass('laser');
});
/$(".color").click(function() {
var red = Math.floor(Math.random()
255);
var green = Math.floor(Math.random() 255);
var blue = Math.floor(Math.random()
255);
// display the number in an alert window
alert(red + "," + green + "," + blue);
});
/
$(".color").click(function() {
// assign each named color a random number 0-255
var red = Math.floor(Math.random()
255);
var green = Math.floor(Math.random() 255);
var blue = Math.floor(Math.random()
255);
// generate an RGBa value from red,green,blue
var randomRGBA = 'rgba('+red+','+green+','+blue+',1)';
//Display the three values in an alert window
//alert(randomRGBA);
});
$("body").css("background", (randomRGBA) {
alert(randomRGBA);
});
$(".moves").click(function() {
$("img").toggle();
});
</script>
</body>

Craig Freeman
@Craig939393_twitter
Jun 03 2018 21:23
Anyone willing to explain something to me about prototype inheritance please?
Daniel Simeonov
@dbsimeonov
Jun 03 2018 22:33
@gulsvi Thanks, it was working but faced an issues that I can not pass a variable to the json file and changed my approach, to store my data in js file. Is it possible even to set my values to variable in json?
Tiago Correia
@tiagocorreiaalmeida
Jun 03 2018 22:35
You will need to use json.parse to turn it in an js object and after making the changes you can use json.stringify and you have.json once again
Daniel Simeonov
@dbsimeonov
Jun 03 2018 22:41
@tiagocorreiaalmeida So how to convert the string to a variable? stringify returns me a string?
Joshua Arnett
@josha5
Jun 03 2018 23:10
Could anyone help with with mern stack react saving form data to mongoDB database?
aRtoo
@artoodeeto
Jun 03 2018 23:13
is there something that im missing? i know my logic is correct but its returing wrong value.
//Setup
var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["JavaScript", "Gaming", "Foxes"]
    }
];


function lookUpProfile(name, prop){

for(let i=0; i<contacts.length; i++) {


  if(contacts[i].firstName === name) {
    if(Object.keys(contacts[i]).includes(prop)) {
      return contacts[i][prop];
    } else {
      return "No such property";
    }
  } else if (contacts[i].firstName !== name) {
    return "No such contact";
  }

}

lookUpProfile("Kristian", "lastName") //should return "Vos"
arowolodaniel
@arowolodaniel
Jun 03 2018 23:14
/ . /
Norvin Burrus
@ndburrus
Jun 03 2018 23:19
@Craig939393_twitter this may be helpful :sparkles:
aRtoo
@artoodeeto
Jun 03 2018 23:20
nvm i got it ;0
Norvin Burrus
@ndburrus
Jun 03 2018 23:33
@josha5 this may be useful :sparkles:
Joshua Arnett
@josha5
Jun 03 2018 23:52
@ndburrus I figured it out I was handling my form data incorrectly on my server. I hate react so much and I have to do my final presentation on it lol
@ndburrus Thanks anyway. Gonna be building out my dashboard until the weee hours of the morning :(
Norvin Burrus
@ndburrus
Jun 03 2018 23:53
@josha5 you're welcome! you'll be ready! :smile: nice work :palm_tree: