These are chat archives for FreeCodeCamp/HelpFrontEnd

19th
Aug 2017
hermeticlock
@hermeticlock
Aug 19 2017 00:00

I don't @gothamknight

I'm working on notepad++ and constantly uploading changes to the FTP.

Maybe you could inspect the element and experiment with it that way?
hermeticlock
@hermeticlock
Aug 19 2017 00:07
Any ideas?
iso
@iso1048
Aug 19 2017 00:08
@hermeticlock did you try changing the margin of .main h1?
hermeticlock
@hermeticlock
Aug 19 2017 00:09
What should I change it to? @gothamknight
iso
@iso1048
Aug 19 2017 00:10
try margin-top: 50%;
hermeticlock
@hermeticlock
Aug 19 2017 00:11
Doesn't seem to have an affect on it at all.
I'm almost wondering if I'm even targeting it correctly. I'm gonna see if I can change the texts color
Yup thats the issue
I'm targeting it wrong.
Not really sure what I did wrong with it.
I thought .main h1 {} would target the h1 tag inside the main class div.
going to try .headbox h1
Alright that didnt work either. Gonna give it it's own class.
iso
@iso1048
Aug 19 2017 00:15
@hermeticlock i have to head off dude. let me know how you go
hermeticlock
@hermeticlock
Aug 19 2017 00:15
Alright I'm officially baffled.
Lol thanks.
I gave it it's own class and targetted that and it still doesn't seem to be affected. Not quite sure where to go from here...
iso
@iso1048
Aug 19 2017 00:15
@hermeticlock Im do not really know how to use chrome dev tools. would you be able to put it in codepen?
hermeticlock
@hermeticlock
Aug 19 2017 00:16
I could just copy and paste my html, css, and js files into it perhaps?
Some stuff won't work properly though like my contact form, which connects to several php files.
Bryan Jay B. Panesa
@bryanpanesa
Aug 19 2017 03:34
@hermeticlock you got it already?
Bryan Jay B. Panesa
@bryanpanesa
Aug 19 2017 03:40
@hermeticlock try removing
.h1, .h2, .h3, h1, h2, h3 {
/ margin-top: 20px; /
/ margin-bottom: 10px; /
}
and also remove your custom margin in the .boxtext class
Tai Jones
@taiJones00
Aug 19 2017 04:09
anyone on?
need help
iso
@iso1048
Aug 19 2017 04:10
I could try
Tai Jones
@taiJones00
Aug 19 2017 04:10
okay so a white page is being returned
why
iso
@iso1048
Aug 19 2017 04:19
@taiJones00 Not too sure sorry bro. try using this url https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=[yourSearch]. also, console.log your searchVal to make sure it is what you expect
Daniel
@DanJP2016
Aug 19 2017 04:21
ya looks to me like he is using the wrong url, but I found the documents for the wiki api to be convoluted and migraine inducing...
iso
@iso1048
Aug 19 2017 04:21
@DanJP2016 agreed
hermeticlock
@hermeticlock
Aug 19 2017 04:50

http://codingforkids.us/

I'm trying to get my smooth scroll to work. Any ideas?

This is where it's linking to in my html: <script src="http://codingforkids.us/projects/joesprojects/HermesWebPortfolio/js/index.js%22%3E</script>

Link to the js file: http://codingforkids.us/projects/joesprojects/HermesWebPortfolio/js/index.js(edited)

William Watts
@Braillon7
Aug 19 2017 05:06
https://codepen.io/Braillon7/pen/RZjjNR can anyone read and see how and where I can have a background change by time. I put a new algorithm to have it change by time but I think the original one that I got from someone else is interfering with it
Let me rephrase. The original meaning I have my background images changing by the weather. But I also want it to get dark when the time tells it to do so.
prakash chandra yadav
@prakashyadav008
Aug 19 2017 05:11
hey everyone
finally finished my weather app plzz take a look and offer suggestion on any changes i should make
@SkyC0der
Andrew Horn
@sophyphreak
Aug 19 2017 05:14
Hey, anyone willing to look at my Simon app? I'm having a problem constructing the playback feature
Burak
@BurakAy
Aug 19 2017 05:15
@sophyphreak i give it a shot
Lallo Vigil
@lalov1
Aug 19 2017 05:18
Sill having problems with the same color playing twice and to check if the first item is wrong when you have more than one. https://codepen.io/lalov1/full/MvgvxY/
Andrew Horn
@sophyphreak
Aug 19 2017 05:18
@BurakAy , thanks! I'm making it in React, but I think it's just a js problem. I have a start button that activates the function addNewColor(), which just for building purposes is supposed to click each button in sequence. But if you try it, you'll see pretty quickly that a number of weird problems show up https://codepen.io/sophyphreak/pen/dzdMRq?editors=0011
CamperBot
@camperbot
Aug 19 2017 05:18
sophyphreak sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 314 | @burakay |http://www.freecodecamp.com/burakay
Lallo Vigil
@lalov1
Aug 19 2017 05:18
@prakashyadav008 Good job!
prakash chandra yadav
@prakashyadav008
Aug 19 2017 05:20
@lalov1 thanks man..still thinking of adding more animations later
CamperBot
@camperbot
Aug 19 2017 05:20
prakashyadav008 sends brownie points to @lalov1 :sparkles: :thumbsup: :sparkles:
:cookie: 391 | @lalov1 |http://www.freecodecamp.com/lalov1
Burak
@BurakAy
Aug 19 2017 05:33
@sophyphreak is the currentTime used for the timing between color/sound changes?
i see some of your buttons aren't changing back after being highlighted
Andrew Horn
@sophyphreak
Aug 19 2017 05:36
@BurakAy , yes. I was having a problem with the playback clicking all the buttons at once, so I put in the current time as a sleep function. But now double presses (blue then blue) don't work and the highlights don't always change back
it works just find with manual clicking
Burak
@BurakAy
Aug 19 2017 05:37
also appears to play the sound back only once for each color, so if you have 3 g and 1 y it'll play green just once and yellow once
rather than once for each
Andrew Horn
@sophyphreak
Aug 19 2017 05:37
exactly
and it doesn't always trigger the color change either
it's just all kinds of mess, and I have no idea why
Burak
@BurakAy
Aug 19 2017 05:40
for playback you can use setTimeout
Andrew Horn
@sophyphreak
Aug 19 2017 05:44
I did that first, but it ended up not spacing it right
it would press all the buttons after the settimeout instead of doing one-by-one
Gulsvi
@gulsvi
Aug 19 2017 05:54
@prakashyadav008 Looks great!
iso
@iso1048
Aug 19 2017 05:58
@SkyC0der you still up?
Gulsvi
@gulsvi
Aug 19 2017 05:59
Yeah, still awake - how are you?
@gothamknight
iso
@iso1048
Aug 19 2017 05:59
ok i guess. Assignment after assignment. havent had much time to code which sucks
Gulsvi
@gulsvi
Aug 19 2017 06:01
sorry :/ yeah that sucks
and professors mispronouncing words :)
iso
@iso1048
Aug 19 2017 06:03
haha yeah dude.
Burak
@BurakAy
Aug 19 2017 06:03
@sophyphreak I'm not sure what's going on man, the react is throwing me off as well since I never used it
i just finished my Simon project earlier today too
just used javascript
iso
@iso1048
Aug 19 2017 06:04
test.gif
@SkyC0der what do you think of the vertical nav?
Andrew Horn
@sophyphreak
Aug 19 2017 06:04
@BurakAy , ah. well thanks anyway
CamperBot
@camperbot
Aug 19 2017 06:04
sophyphreak sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:warning: sophyphreak already gave burakay points
Burak
@BurakAy
Aug 19 2017 06:05
i can link you my project if you want to take a look at it
but that's all the help i can be at the moment haha
i'll keep looking and see if i can figure anything out, i'll let you know
Gulsvi
@gulsvi
Aug 19 2017 06:08
@gothamknight Nice work :)
Burak
@BurakAy
Aug 19 2017 06:09
i feel like this.state and the getTime is throwing everything off a bit
iso
@iso1048
Aug 19 2017 06:11
@SkyC0der cheers. I was trying to make it so that the text does not disappear first when the nav is retracted, but havent got it working yet.
Andrew Horn
@sophyphreak
Aug 19 2017 06:19
@BurakAy yeah sure, that'd be great
Gulsvi
@gulsvi
Aug 19 2017 06:32
@sophyphreak I still need to put my Simon together, but I'm queuing the colors + sounds with jQuery:
// take an array of colors and a delay to light up in a sequence
function playSequence(colors, delay) {
  $({}).queue("_fx",colors.map((color, i) => next => {
    $("#" + color).delay(delay + 150, "_fx").dequeue("_fx").promise("_fx").then(() =>  {
      next();
      playSound(color, delay);
      activateColor($("#" + color)[0], delay);
      if (i === colors.length - 1) colorSequenceComplete();
    });
  })).dequeue("_fx");
}
I really need to start learning React, wish I could help more
iso
@iso1048
Aug 19 2017 06:33
@SkyC0der what is $({})?
Gulsvi
@gulsvi
Aug 19 2017 06:33
And I need some help to get the audio clicks to stop happening
It's an empty object to be used as the queue
Andrew Horn
@sophyphreak
Aug 19 2017 06:33
@SkyC0der thanks. I made the mistake of just going straight to react, so I really don't understand JQuery at all unfortunately
CamperBot
@camperbot
Aug 19 2017 06:33
sophyphreak sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2453 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 19 2017 06:34
it's mostly promises under the hood, I couldn't imagine going straight to react - though, I wish I had sometimes
Gulsvi
@gulsvi
Aug 19 2017 06:54
@longnt80 maybe you can help with the clicking?
Long Nguyen
@longnt80
Aug 19 2017 06:56
@SkyC0der what's with the clicking?
Gulsvi
@gulsvi
Aug 19 2017 06:57
@longnt80 The audio clicking in the codepen above
click the button and they click at the end of every sound

I've been playing around with delays and this

gainNode.gain.setTargetAtTime(0, audioCtx.currentTime, duration - 0.05);

^^ for a while. Can't seem to get it right

Long Nguyen
@longnt80
Aug 19 2017 06:58
you want to get rid of the click sound, right?
Gulsvi
@gulsvi
Aug 19 2017 06:59
Yeah, I read the trick was to reduce the gain like in that line above
But....not working
Long Nguyen
@longnt80
Aug 19 2017 07:00
@SkyC0der I used linearRampToValueAtTime though
Gulsvi
@gulsvi
Aug 19 2017 07:00
Okay, I'll check that out - thank you! @longnt80
CamperBot
@camperbot
Aug 19 2017 07:00
skyc0der sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 512 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Aug 19 2017 07:03
@SkyC0der here's my Simon, in case you want to check the method: https://longnt80.github.io/Simon-Game/
the linearRampToValueAtTime doesn't work on Firefox though
browser support is still very bad with the API
Gulsvi
@gulsvi
Aug 19 2017 07:05
Yeah, seems it's just a matter of playing around with the delays :/
Mine was working great until chrome updated to 60
Pieter Stokkink
@forkerino
Aug 19 2017 10:47
Announcement: CodeSchool has a free weekend. Which means that all their courses are freely available until tomorrow night. https://www.codeschool.com
Jamal
@JamalPolaya
Aug 19 2017 11:39
hey there any help please with local weather project of free code camp, actually the project open in the browser correctly but in codepen the api does not work
mpontus
@mpontus
Aug 19 2017 11:39
Is there a name for such function x - x % y. I.e. find the nearest number divisible by another number.
heroiczero
@heroiczero
Aug 19 2017 11:40
@JamalPolaya codepen only accept secure connections
@mpontus isn't that a subtraction and modulo. you might have to do a loop to find the nearest divisible number
Jamal
@JamalPolaya
Aug 19 2017 11:43
@heroiczero okay thanks i will try and if there is a problem i will ask again
CamperBot
@camperbot
Aug 19 2017 11:43
jamalpolaya sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 1625 | @heroiczero |http://www.freecodecamp.com/heroiczero
mpontus
@mpontus
Aug 19 2017 11:45
@heroiczero The function I provided is working. I'm just wondering if this concept has a name.
I need to start watching Khan Academy regularly. I don't remember algebra anymore.
heroiczero
@heroiczero
Aug 19 2017 11:48
@mpontus not in particular that i know of. I think it is just a math problem. It is not like the Fib sequence or some proof
Rajat
@rajataudichya
Aug 19 2017 11:48
My contact form is not connecting can someone help me with that?
heroiczero
@heroiczero
Aug 19 2017 11:49
link to the page?
Rajat
@rajataudichya
Aug 19 2017 11:56
can some please tell me how I can connect my contact form with my email id?
heroiczero
@heroiczero
Aug 19 2017 12:00
could i see your code?
Rajat
@rajataudichya
Aug 19 2017 12:04
@heroiczero are you talking to me?
heroiczero
@heroiczero
Aug 19 2017 12:04
@rajataudichya yes
Rajat
@rajataudichya
Aug 19 2017 12:24
this a php i searched
<?php
    if(isset($_POST['submit'])){
        $name=$_POST['name'];
        $email=$_POST['email'];
        $phone=$_POST['phone'];
        $message=$_POST['message'];

        $to='rajat.audichya8@gmail.com'; // Receiver Email ID, Replace with your email ID
        $subject='Website Inquiry';
        $message="Name :".$name."\n"."Phone :".$phone."\n"."Wrote the following :"."\n\n".$message;
        $headers="From: ".$email;

             if(mail($to, $subject, $message, $headers)){
            $url='index.html';
    echo '<script>window.location="'.$url.'";</script>';
    die;
        }
        else{
            echo "Something went wrong!";
        }
    }

?>
heroiczero
@heroiczero
Aug 19 2017 12:29
@rajataudichya are you trying to do something like http://www.hyperlinkcode.com/email-address-hyperlink.php
@rajataudichya or are you trying to store your email in the backend to access a website
korzo
@korzo
Aug 19 2017 12:37
@rajataudichya are you seriously going to put this on your server?
Rajat
@rajataudichya
Aug 19 2017 12:37
I just have simple form which on clicking submit button i want to receive the details on the form on my mail and
@korzo well actually it is on my server... oops
korzo
@korzo
Aug 19 2017 12:50
@rajataudichya then your site will be blocked as soon as first robot finds this form out. I can hear like all spammers are cheering and high fiving each other
Rajat
@rajataudichya
Aug 19 2017 12:59
lol
what do you suggest me to do
I am using this for my portfolio contact form
@korzo
korzo
@korzo
Aug 19 2017 13:04
@rajataudichya find some other script with at least basic CSRF protection and headers sanitisation
Long Nguyen
@longnt80
Aug 19 2017 13:50

@forkerino

Announcement: CodeSchool has a free weekend. Which means that all their courses are freely available until tomorrow night. https://www.codeschool.com

thanks! :+1:

CamperBot
@camperbot
Aug 19 2017 13:50
longnt80 sends brownie points to @forkerino :sparkles: :thumbsup: :sparkles:
:star2: 2924 | @forkerino |http://www.freecodecamp.com/forkerino
Azel Alyne Tan
@azelalynetan
Aug 19 2017 13:50
wow that's cool
Burak
@BurakAy
Aug 19 2017 13:57
@sophyphreak were you able to figure anything out?
Liam Docherty
@ldocherty1
Aug 19 2017 14:44

Still can't figure out how to do this...

-I have a folder on my desktop called "Final-portfolio"
-Inside the folder "Final-portfolio" it has a folder called "Final-portfolio"
-Inside the "asset" folder it has a jpeg file called "background.jpeg"

The overall goal is to locate this file in my css and make it appear on my webpage.

Here is my css

url('../assets/background.jpeg');

Ben Line
@Benwebdev
Aug 19 2017 14:44
@ldocherty1 you still there ?.
Liam Docherty
@ldocherty1
Aug 19 2017 14:45
@Benwebdev Yes
Ben Line
@Benwebdev
Aug 19 2017 14:45
I'll help with this one πŸ”₯
Liam Docherty
@ldocherty1
Aug 19 2017 14:45
@Benwebdev Thanks :smile:
CamperBot
@camperbot
Aug 19 2017 14:45
ldocherty1 sends brownie points to @benwebdev :sparkles: :thumbsup: :sparkles:
:cookie: 363 | @benwebdev |http://www.freecodecamp.com/benwebdev
Azel Alyne Tan
@azelalynetan
Aug 19 2017 14:46
where is your css file?
@ldocherty1 ?
Ben Line
@Benwebdev
Aug 19 2017 14:46
So the browser will always go back to the beginning path. Is your index in the root folder. You don't need the ../ to go back.
Liam Docherty
@ldocherty1
Aug 19 2017 14:46
it works :)
@Benwebdev Ty I had the file in the wrong place
Ben Line
@Benwebdev
Aug 19 2017 14:48
πŸ‘πŸΌπŸ€™πŸ»
Awesome
Keep hacking my friend 😈.
Liam Docherty
@ldocherty1
Aug 19 2017 14:48
@Benwebdev :+1:
Ben Line
@Benwebdev
Aug 19 2017 14:49
Just tag me if you get stuck with Frontend πŸ‘πŸΌ.
Liam Docherty
@ldocherty1
Aug 19 2017 14:49
Does anyone have a photoshop cs6 Mac download link, I got a new Mac and gotta re download it :( I need it for my web development stuff as well
Ben Line
@Benwebdev
Aug 19 2017 14:49
.... you buy it my friend
Liam Docherty
@ldocherty1
Aug 19 2017 14:50
@Benwebdev Much appreciated and I use to get the free cracked versions before lol
Ben Line
@Benwebdev
Aug 19 2017 14:50
Atom by GitHub for IDE
I did until I used it for commercial projects.
Just pay the monthly for adobe suite
Liam Docherty
@ldocherty1
Aug 19 2017 14:56
@Benwebdev Yes I think I will, I'm going to need it for paid projects in the future.
Ben Line
@Benwebdev
Aug 19 2017 14:59
Yes even though we all have the mentality of so many people do it so why not use the cracked version. I used the cracked versions for years as a student. As soon as you earn money from the product you should pay.
Tom
@moT01
Aug 19 2017 15:29
my slideToggle jumps on first click, any solutions?
https://codepen.io/moT01/pen/oeEEzq
Bryan Jay B. Panesa
@bryanpanesa
Aug 19 2017 16:14
@moT01 remove
canvasid {
max-width:50%;
}
Tom
@moT01
Aug 19 2017 16:16
@bryanpanesa didnt work for me
what browser you on?
Bryan Jay B. Panesa
@bryanpanesa
Aug 19 2017 16:17
@moT01 chrome, how about you?
Tom
@moT01
Aug 19 2017 16:18
firefox
Ken Haduch
@khaduch
Aug 19 2017 16:18
@moT01 - so you mean that it doesn't slide on the first click? I wonder if it is that it didn't really create the DOM information until you set the display to an on state?
Daniel
@DanJP2016
Aug 19 2017 16:18
it seems you need to set display:block at the start of the animation
you could use fadeToggle( ) and get a similar effect
Tom
@moT01
Aug 19 2017 16:20
in my codepen it doesn't slide it just jumps on first click
but im working on my voting app, and it sort of animates 40px then jumps
Daniel
@DanJP2016
Aug 19 2017 16:20
yeah, its because the display is not being set to block until the animation ends the first time
at least in my browser that is what it looks like is happening
Tom
@moT01
Aug 19 2017 16:21
@khaduch that's what feels like is happening
@DanJP2016 so set it to block in the css
or in the click event
Tom
@moT01
Aug 19 2017 16:29
@DanJP2016 @khaduch @bryanpanesa thanks for taking a look
CamperBot
@camperbot
Aug 19 2017 16:29
mot01 sends brownie points to @danjp2016 and @khaduch and @bryanpanesa :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @danjp2016 |http://www.freecodecamp.com/danjp2016
:cookie: 235 | @bryanpanesa |http://www.freecodecamp.com/bryanpanesa
:star2: 3219 | @khaduch |http://www.freecodecamp.com/khaduch
Sofus Heggemsens
@Sofeo
Aug 19 2017 16:32
hey im on the wikipedia searching project and i get the error 'Access-Control-Allow-Origin' when i try to get the api
var input = document.getElementById("input");

$("#button").on("click", function() {
  $.getJSON("https://en.wikipedia.org/w/api.php?action=query&format=json&prop=extracts&titles=" + input.value + "&exsentences=2&exintro=1&explaintext=1", function(json) {
    console.log(json);
  });
});
Ken Haduch
@khaduch
Aug 19 2017 16:38
@Sofeo - try to add &origin=* as part of your URL - that is a wikipedia API feature, I think? Otherwise use jsonp and add &callback=? at the end of your URL - but try the origin parameter first.
Sofus Heggemsens
@Sofeo
Aug 19 2017 16:45
i think it worked didnt get a error now :D
but what does origin=* do? @khaduch
Ken Haduch
@khaduch
Aug 19 2017 16:50
@Sofeo - check this link - the section on "CORS usage" https://www.mediawiki.org/wiki/API:Cross-site_requests
Sofus Heggemsens
@Sofeo
Aug 19 2017 16:52
oooh ok thanks @khaduch
CamperBot
@camperbot
Aug 19 2017 16:52
sofeo sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3220 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Aug 19 2017 16:54
@Sofeo - you're welcome
Elizabeth Paul
@Kowalatam
Aug 19 2017 16:57
They seriously want me to build a calculator ?... wow, just wow..
:)
Daniel
@DanJP2016
Aug 19 2017 16:58
@moT01 maybe you could use a promise so the animation does not start until the chart is already drawn? not sure how to write that in jquery
Tom
@moT01
Aug 19 2017 16:59
@Kowalatam no one is forcing you, ...its not too bad
Elizabeth Paul
@Kowalatam
Aug 19 2017 16:59
lol.. i know @moT01 .....
Tom
@moT01
Aug 19 2017 16:59
@DanJP2016 im sceptical on that
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:00
The task just put in a wow state ...
Tom
@moT01
Aug 19 2017 17:00
not a bad thought but it seems like more than i should need
and i dont think it would work
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:00
like wow... this is going to take me days.. :)
Tom
@moT01
Aug 19 2017 17:00
but maybe worth a try
ive spent several weeks on some of the projects
Daniel
@DanJP2016
Aug 19 2017 17:02
i just started the twitch project a few days ago. got side tracked with some freelance stuff.
i think though either the css display is not being changed until the end of the animation on the first run, or the chart is not being drawn before the animation finishes. or something weird like that
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:04
weeks.. well, nothing comes easy...
i'm just going to continue with algorithms then...
Tom
@moT01
Aug 19 2017 17:05
i like to mix it up, ...couple algorithms till i get bored with those, then do a project
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:06
yeah, i'm more than bored now
:)
Tom
@moT01
Aug 19 2017 17:06
@DanJP2016 im going with the something wierd
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:06
probably would just go to the old project and redo.. my portfolio is a mess :)
Tom
@moT01
Aug 19 2017 17:07
@Kowalatam i would suggest to keep going forward, ...those will always be there to redo, you're going to learn way more doing new projects
my opinion
Daniel
@DanJP2016
Aug 19 2017 17:08
codefights is fun or just rebuild random stuff you find on the internet
Tom
@moT01
Aug 19 2017 17:09
codetrain or codingtrain on youtube has a number of project i intended to build that looked fun. havent got around to it
Elizabeth Paul
@Kowalatam
Aug 19 2017 17:09
@moT01 i like forward, but i sometimes feel im going too fast and im probably skipping things i don't fully understand
@DanJP2016 cool, might check that out
Tom
@moT01
Aug 19 2017 17:13
yea, it's always nice to better understand things, i think reading docs/books helps with that - however slow it may be. but if there's something you really need to know better you will learn it when you need to know it
Daniel
@DanJP2016
Aug 19 2017 17:17
@moT01 if you change the animation to fadeToggle that delay is not there, so maybe its something with the slideToggle animation itself causing it.
Tom
@moT01
Aug 19 2017 17:20
@DanJP2016 youre right that the delay isnt there, ...that animation seems to work smooth
but i just saved it to more like what it actually is
so theres a few things to click and the fade makes the next clickable thing and the rest of the content jump down
if that makes sense
none of these problems are that big a deal i guess, but i want it how i want it
Raja
@virtualhandshake
Aug 19 2017 17:23
Hi all
Daniel
@DanJP2016
Aug 19 2017 17:23
yeah i understand that lol. maybe its a problem in the jquery code itself, writing a promise did not solve the problem
Tom
@moT01
Aug 19 2017 17:24
i feel like it's along the lines of what ken said
Raja
@virtualhandshake
Aug 19 2017 17:24
I was wondering if someone can help me. I am making the portfolio page using bootstrap and the drop shadow I have given to the top header gets covered by the hero area, how do I fix this? here's my code :https://codepen.io/virtualhandshake/pen/KqorZK?editors=1100
Tom
@moT01
Aug 19 2017 17:24
it feels like that chart isn't being drawn or rendered until that first animation happens
Daniel
@DanJP2016
Aug 19 2017 17:25
yeah its very strange
Tom
@moT01
Aug 19 2017 17:25
i tried displaying it right away and hiding it in the js after
several ways didn't work
and you can see it display too, for a quick frame
inspecting it in the dev tools shows everything there on a page load
Daniel
@DanJP2016
Aug 19 2017 17:28
yeah, thats what kept throwing me off and made me wanna try a different animation on it to see what happens.
Tom
@moT01
Aug 19 2017 17:29
@virtualhandshake you should try and make your code as easy for someone else to read and understand before asking a question. all those extra spaces in the code just make anyone trying to help have to spend time organizing the code before they can start to try and help
Daniel
@DanJP2016
Aug 19 2017 17:33
@virtualhandshake you need to add the bootstrap.css files in your settings tab, and it looks like you need to add another set of div tags around your about section container. after that use margin-top: 15px to push the section down.
Bryan Jay B. Panesa
@bryanpanesa
Aug 19 2017 17:36
@virtualhandshake put this styles inside ur container-fluid class
position: relative;
z-index: 5;
Tom
@moT01
Aug 19 2017 17:38
@DanJP2016 k, more weird, now its working off and on. on one load it works the first time - on the next it doesn't
Daniel
@DanJP2016
Aug 19 2017 17:43
its making two copies of the chart in some instances
Tom
@moT01
Aug 19 2017 17:53
im not sure i see what you're seeing, ...there is two charts there - one for each button
Daniel
@DanJP2016
Aug 19 2017 17:54
ah ok, i was thinking one button to open one to close lol
Tai Jones
@taiJones00
Aug 19 2017 17:55
how could I give each of the search results their own container
Tom
@moT01
Aug 19 2017 17:57
@taiJones00 append some html in there
Tai Jones
@taiJones00
Aug 19 2017 17:57
i can do .append.html() ?
hmmm
Tom
@moT01
Aug 19 2017 17:58
          $("#wiki-results").append("
            <div class='myclass'>
                 JSON.stringify(json.query.prefixsearch[i].title);
            </div>
          ");
Tai Jones
@taiJones00
Aug 19 2017 17:59
and the quotes on the JSON part don't make that a string?
Tom
@moT01
Aug 19 2017 18:00
the quotes i put in?
Tai Jones
@taiJones00
Aug 19 2017 18:00
yes
Tom
@moT01
Aug 19 2017 18:00
that should work, or be real close
here's an example from the jquery site
$( ".inner" ).append( "<p>Test</p>" );
and you can put a class in there or whatever just like html
Roxroy
@roxroy
Aug 19 2017 18:01
@moT01 , @taiJones00
 $("#wiki-results").append(" <div>"+
        JSON.stringify(json.query.prefixsearch[i].title)
      +" </div>");
Tai Jones
@taiJones00
Aug 19 2017 18:02
boi yas
okay this may help me finish the project. Thank you so much @moT01 @roxroy
CamperBot
@camperbot
Aug 19 2017 18:02
taijones00 sends brownie points to @mot01 and @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 798 | @mot01 |http://www.freecodecamp.com/mot01
:star2: 1117 | @roxroy |http://www.freecodecamp.com/roxroy
Gulsvi
@gulsvi
Aug 19 2017 18:06
@taiJones00 You don't need to stringify anything, and can use template literals like you do with your URL:
        for(var article in json.query.prefixsearch) {
          $("#wiki-results").append(
            `<div class="row">
               <div class="col">
                 <a class="https://foo">${json.query.prefixsearch[article].title}</a>
                 <p class="extract">Article Extract</p>
               </div>
             </div>`
          );
        }
Use whatever HTML you want in that .append() method ^^ and parse the JSON object as you would normally without stringify()
Tai Jones
@taiJones00
Aug 19 2017 18:09
whoa what's the var in thing
Tai Jones
@taiJones00
Aug 19 2017 18:15
and should I not use double quotes do have the indentation that you have there
Gulsvi
@gulsvi
Aug 19 2017 18:17
@taiJones00 No need for quotes - it's a template literal between the backticks ` ` like you did with your URL
the indentation spacing is ignored - just helps make it more readable
Tai Jones
@taiJones00
Aug 19 2017 18:19
now how do I get to the link of the actual article. I'm just getting the text from the json file no links
Gulsvi
@gulsvi
Aug 19 2017 18:19
A big part of the challenge is figuring out the right URL to use
Tai Jones
@taiJones00
Aug 19 2017 18:20
dang so is that the hardest part about this
Gulsvi
@gulsvi
Aug 19 2017 18:20
It was for me - I probably spent 3 hours reading about the API and practicing how to use it
Once you get the URL, it's all the same as before with weather and quotes - take a JSON object and convert it into HTML.
A for...of loop would be better for your current JSON, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of
Tom
@moT01
Aug 19 2017 18:27
what the problem with my animation sky
Daniel
@DanJP2016
Aug 19 2017 18:31
@moT01 i think i got it. remove the .wrap class and the canvas tags from your css file. add the canvas width and height straight into the html tag. thats gets rid of the delay for me
Tom
@moT01
Aug 19 2017 18:37
@DanJP2016 show me
it worked about 8 times in a row then the delay came back...
Tom
@moT01
Aug 19 2017 18:39
ahhh
yea, i still see it
Gulsvi
@gulsvi
Aug 19 2017 18:57
which animation @moT01 ?
Tom
@moT01
Aug 19 2017 18:59
https://codepen.io/moT01/pen/oeEEzq
on first click, the animation jumps, works after that
thats an illustration of the problem, im working on my voting app, and what actually happens is the animation animates for like 40px then jumps on first click
Tom
@moT01
Aug 19 2017 19:08
so it does work if i don't use display: none in the css
Daniel
@DanJP2016
Aug 19 2017 19:14
do you get the same problem outside of codepen?
Tom
@moT01
Aug 19 2017 19:20
yes
im developing locally, created that on codepen to show my problem
Raja
@virtualhandshake
Aug 19 2017 19:38
@moT01 Thanks for pointing it out, will be careful next time.
CamperBot
@camperbot
Aug 19 2017 19:38
virtualhandshake sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 799 | @mot01 |http://www.freecodecamp.com/mot01
Raja
@virtualhandshake
Aug 19 2017 19:40
@DanJP2016 @bryanpanesa Thanks both of you, I think Bryan nailed it, I will apply that rule and see what happens.
CamperBot
@camperbot
Aug 19 2017 19:40
virtualhandshake sends brownie points to @danjp2016 and @bryanpanesa :sparkles: :thumbsup: :sparkles:
:cookie: 274 | @danjp2016 |http://www.freecodecamp.com/danjp2016
:cookie: 236 | @bryanpanesa |http://www.freecodecamp.com/bryanpanesa
Daniel
@DanJP2016
Aug 19 2017 19:40
@moT01 i made a test page and i'm not getting the delay with the code setup this way
https://codepen.io/bones211/pen/eEMYPP
Raja
@virtualhandshake
Aug 19 2017 19:42
@SkyC0der Thanks for your time but that I didn't want the entire menu bar to be centered, just the last two menu items, which I figured. :-)
CamperBot
@camperbot
Aug 19 2017 19:42
virtualhandshake sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2455 | @skyc0der |http://www.freecodecamp.com/skyc0der
Raja
@virtualhandshake
Aug 19 2017 19:44
Hey @bryanpanesa thanks man, it worked. :-)
CamperBot
@camperbot
Aug 19 2017 19:44
virtualhandshake sends brownie points to @bryanpanesa :sparkles: :thumbsup: :sparkles:
:warning: virtualhandshake already gave bryanpanesa points
Gulsvi
@gulsvi
Aug 19 2017 20:03
@moT01 Add responsive: false to your chart options
    options: {
      responsive: false,      
      title: {
        display: true,
        text: 'Predicted world population (millions) in 2050'
      }
    }
Something with chart.js and how they calculate the height is messing up the slideToggle()
Daniel
@DanJP2016
Aug 19 2017 20:07
adding a height to the .wrap class in the css fixes it, not sure if reorganizing the jquery made a difference.
https://codepen.io/bones211/pen/yoKBvJ?editors=0110
Tom
@moT01
Aug 19 2017 20:24
@DanJP2016 that looks like it might do the trick - nice work, ill have to see if that will work in my project
@SkyC0der at first glance - that looks like that will work too, thanks
CamperBot
@camperbot
Aug 19 2017 20:28
mot01 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2456 | @skyc0der |http://www.freecodecamp.com/skyc0der
Tom
@moT01
Aug 19 2017 20:31
@SkyC0der you must have taken a pretty good look at the charts library to find that?
Jerzz
@2cool4school
Aug 19 2017 20:33
hey whats up guys i have a question about dealing with layered images. for example look at this image http://www.numotgaming.com/cards/images/cards/Fire%20Sigil.png and look at its implementation here http://www.numotgaming.com/cards/ i was wondering how i could use images like this in html
Tom
@moT01
Aug 19 2017 20:34
@2cool4school can you be more specific?
like the invisible background?
you can use a css hover effect to enlarge the image
Gulsvi
@gulsvi
Aug 19 2017 20:35
@moT01 Glad that helped :) I just searched for "slideToggle doesn't animate on first click" and noticed in a stack overflow answer related to the one I went to, that everyone was using responsive: false in their options.
Kind of dumb luck - I know slideToggle animates the height, and found that the responsive option deals with sizing of the chart
Tom
@moT01
Aug 19 2017 20:36
@SkyC0der that's almost exactly what i searched and got like 8 different answers - none of which worked
Gulsvi
@gulsvi
Aug 19 2017 20:36
I'll try to find the article again - it was in the right-hand side as related, but had nothing to do with slideToggle :joy:
@moT01 That's the one - ^^ kind of dumb luck trying out that option
Tom
@moT01
Aug 19 2017 20:45
i searched jquery slideToggle jumps on first click
among other things
lots of answers - couldn't find the right one
Daniel
@DanJP2016
Aug 19 2017 20:47
ya that was a tough one to track down
Tom
@moT01
Aug 19 2017 20:49
your solution works as well, just not quite as good - if i define the height and the window is smaller there will empty space at the bottom
Daniel
@DanJP2016
Aug 19 2017 20:50
thats cool, at some point it became me vs the code and I couldn't give up on it lol
Tom
@moT01
Aug 19 2017 20:50
i suppose it probly had to do with the css transition - transitioning from an undefined height or something
i appreciate that - i pretty much played with it all day, way too much for something that is only just kind of nice to have, i guess im a little anal like that - i couldnt give up either, i should have moved on and came back to it
Daniel
@DanJP2016
Aug 19 2017 20:56
ya whenever i have an idea and I can't get it to work, but I feel like it should be able to work the way I want it to my brain gets stuck on the problem until I solve it. when I made my space invaders clone I got stuck and could have finished the game anyways but spent 3 days debugging to fix that one thing lol
Pagnito
@Pagnito
Aug 19 2017 21:17
having trouble, i used create-react-app boilerplate, but then decided not to use it, so i i deleted the node-modules and wrote my own dependencies and installed them, but i still seem to get react app boiler plate without it being mentioned anywhere in the package.json
Dan
@dankingswell
Aug 19 2017 21:17
hey @SkyC0der screen shotted a pic of one of your helpful replies for a blog i'm doing about becoming a developer, hope thats okay :D
Usama Mahmood
@usamacjs
Aug 19 2017 21:25
hello everyone, i was a question about github
i am making commits since last three days, but it is not showing as contributions in my profile
anyone has any idea why this is happening?
@SkyC0der
Tom
@moT01
Aug 19 2017 21:30
@usamacjs commiting locally and not pushing to github?
Gulsvi
@gulsvi
Aug 19 2017 21:30
@dankingswell It's fine - everything here is public :)
Glad my reply was helpful!
Usama Mahmood
@usamacjs
Aug 19 2017 21:31
no, i committed and pushed it as well @moT01
Gulsvi
@gulsvi
Aug 19 2017 21:32
@usamacjs Read this and then contact github support for an answer: https://help.github.com/articles/why-are-my-contributions-not-showing-up-on-my-profile/
We really can't help you with that :)
Usama Mahmood
@usamacjs
Aug 19 2017 21:32
you can see my profile, no contributions in last three days, whereas, commits were made to this project in the last three days https://github.com/usamacjs/university-project.git
okay, @SkyC0der thank you
CamperBot
@camperbot
Aug 19 2017 21:32
usamacjs sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2457 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 19 2017 21:33
Good luck :)
Pagnito
@Pagnito
Aug 19 2017 22:31
@SkyC0der yo
Gulsvi
@gulsvi
Aug 19 2017 22:32
@Pagnito Hey!
Pagnito
@Pagnito
Aug 19 2017 22:32
yo yo!
so i gotta qestion
question
material or bootstrap?
which one u like best
Gulsvi
@gulsvi
Aug 19 2017 22:33
They're both great
Pagnito
@Pagnito
Aug 19 2017 22:33
ya i feel u
but which one do u like more?
Gulsvi
@gulsvi
Aug 19 2017 22:33
They pretty much do the same thing, just a different UI look
Pagnito
@Pagnito
Aug 19 2017 22:33
yea the ui is what im talkin about
the visual part
Gulsvi
@gulsvi
Aug 19 2017 22:34
I like their buttons more than bootstrap's - that cool wave effect
Pagnito
@Pagnito
Aug 19 2017 22:34
me too lol
my next project im gonna use material
Gulsvi
@gulsvi
Aug 19 2017 22:34
It depends on the project though, to be honest
Pagnito
@Pagnito
Aug 19 2017 22:35
yea i think i know what u mean, it did seem like bootstrap have more stuff
Gulsvi
@gulsvi
Aug 19 2017 22:35
materialize has some features bootstrap doesn't have and vice-versa
Pagnito
@Pagnito
Aug 19 2017 22:35
ahh i see
Gulsvi
@gulsvi
Aug 19 2017 22:36
There's also mdbootstrap which combines the two
Pagnito
@Pagnito
Aug 19 2017 22:36
interesting
im gonna have to look into that
after i get the hang of material tho
Write a function that creates an array of odd numbers up to a given number, excluding the number 7.
similar challenge on the forums today ^^
iso
@iso1048
Aug 19 2017 22:40
@SkyC0der bro would you be able to help me with the smallestCommons challenge?
Gulsvi
@gulsvi
Aug 19 2017 22:40
I can try @gothamknight - that one is a pain
@gothamknight What's the question?
iso
@iso1048
Aug 19 2017 22:44
@SkyC0der so I made the array of the numbers in the range and ordered them from largest to smallest. Now I am trying to multiply the largest number by the second largest, and see if that evenly divides into all the other numbers in the array. If it does not, then I want to multiply the above product by the third largest number and test again. But my code always just multiples all the number in the array:
function smallestCommons(arr) {

  arr = arr.sort((a,b) => b-a);
  var  array= [];

  for (var i = arr[0]; i >= arr[1]; i--){
   array.push(i); 
  }

  var check = false;
  var start = array[0];

  for (var j = 1; j<array.length; j++){
      start*=array[j];
    for (var q = 2; q <array.length; q++){
      start%arr[q] == 0 ? check = true : check = false;
    }// for q
    if (check){
      break;
    }
  }//for j

  return start;
}

smallestCommons([1,5]);
Gulsvi
@gulsvi
Aug 19 2017 22:46
Hmmm, need to revisit my math. Can you do that to get the LCM?
korzo
@korzo
Aug 19 2017 22:48
@gothamknight I think you need while loop and iterate from 1 up until you find result.
iso
@iso1048
Aug 19 2017 22:48
as an example: [5,4,3,2,1]. so 54 = 20. Test if 20 is divisible by 3, 2,1. 20 is not divisible by 3. 54*3 = 60. test if 60 is divisible by 2 and 1. It is, so 60 is LCM.
@korzo oh yeah did not even think of using a while loop. I'll give it another go. Thanks.
CamperBot
@camperbot
Aug 19 2017 22:48
gothamknight sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 393 | @korzo |http://www.freecodecamp.com/korzo
korzo
@korzo
Aug 19 2017 22:49
@gothamknight There is 100x faster way, but it require some Math knowledge
Gulsvi
@gulsvi
Aug 19 2017 22:50
I calculated the Greatest Common Divisor to get the Least Common Multiple
korzo
@korzo
Aug 19 2017 22:50
@SkyC0der Exactly
Gulsvi
@gulsvi
Aug 19 2017 22:51
Otherwise, it's going to be hard to do really big arrays
iso
@iso1048
Aug 19 2017 22:52
true
korzo
@korzo
Aug 19 2017 22:53
@SkyC0der I tested it and it's 100x faster. But with higher numbers the speed is nearly constant because most result are about the same number of iterations
Siddarth Krishnan
@siddarthk123
Aug 19 2017 22:55
can someone
help me out with the wikipedia
search
Gulsvi
@gulsvi
Aug 19 2017 22:57
@siddarthk123 Sure, what's the question?
Siddarth Krishnan
@siddarthk123
Aug 19 2017 22:58
what is....
how to use the javascript
to extract
i mean
sky
to get the api
to get the api
Gulsvi
@gulsvi
Aug 19 2017 22:58
@siddarthk123 It's the same way that you did with the last project, show the local weather
Access the JSON object and convert it to HTML
Siddarth Krishnan
@siddarthk123
Aug 19 2017 22:59
How do you do it?
where do you learn to do that?
Gulsvi
@gulsvi
Aug 19 2017 22:59
I learned it doing the first project, the Random Quote Generator
Siddarth Krishnan
@siddarthk123
Aug 19 2017 23:00
would i use
fetch?
Gulsvi
@gulsvi
Aug 19 2017 23:00
Where we called an API, got JSON back, and then accessed the data we needed to display it on the page
What did you use for the Weather Project?
@siddarthk123 Have you done the Quote Machine challenge or Weather Challenges yet?
Janelle deMent
@janelledement
Aug 19 2017 23:06
@SkyC0der Hey there, how are you? Sorry to bug you again but do you happen to have experience with google maps api?
Gulsvi
@gulsvi
Aug 19 2017 23:08
@janelledement Yeah, I used it in my weather project
Only reverse geocode and the places services though
Janelle deMent
@janelledement
Aug 19 2017 23:12
@SkyC0der That's what I'm trying to use it for. I was going to ask you a question about getting specific values from the json but I just answered my own question. Not always able to do that lol. Thanks anyway :-)
CamperBot
@camperbot
Aug 19 2017 23:12
janelledement sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2459 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 19 2017 23:13
lol, okay - congrats on figuring it out
Janelle deMent
@janelledement
Aug 19 2017 23:30
thanks!