These are chat archives for FreeCodeCamp/HelpFrontEnd

8th
Aug 2017
Colin
@finkbeca
Aug 08 2017 01:05
@longnt80 Thankyou
CamperBot
@camperbot
Aug 08 2017 01:05
finkbeca sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 479 | @longnt80 |http://www.freecodecamp.com/longnt80
DavidLan777
@DavidLan777
Aug 08 2017 01:51
@gothamknight OMG i got your reply of giving help. thank you so much for your kindness
CamperBot
@camperbot
Aug 08 2017 01:51
davidlan777 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 360 | @gothamknight |http://www.freecodecamp.com/gothamknight
iso
@iso1048
Aug 08 2017 02:20
@DavidLan777 happy to help
iso
@iso1048
Aug 08 2017 02:34
@SkyC0der you could probably make something cool with this: https://watson-api-explorer.mybluemix.net/ . i tried looking at the documentation but i dont really get it.
Kingsley
@Kingwindie
Aug 08 2017 02:35
can someone help me i can't figure out how to align the green button under the red button and also i can't figure out how to align the change task button under the add task buttonhttps://codepen.io/kingwindie/pen/jLyoGN
Gulsvi
@gulsvi
Aug 08 2017 02:37
@gothamknight The watson APIs look very cool - unfortunately, my coding time is limited, just a few weeks and I'll be away from easy internet access for a school year abroad
iso
@iso1048
Aug 08 2017 02:37
@SkyC0der oh. where are you heading?
Gulsvi
@gulsvi
Aug 08 2017 02:37
Spain
iso
@iso1048
Aug 08 2017 02:38
for oe or something else?
Gulsvi
@gulsvi
Aug 08 2017 02:38
for school
iso
@iso1048
Aug 08 2017 02:38
exchange?
Gulsvi
@gulsvi
Aug 08 2017 02:38
kind of like that, but no spaniards coming to my home town :)
Just going to a university over there that is affiliated with mine
iso
@iso1048
Aug 08 2017 02:39
oh. why did you decide to do that?
Gulsvi
@gulsvi
Aug 08 2017 02:40
I figured it would be a good experience, and works well with linguistics
iso
@iso1048
Aug 08 2017 02:40
but your coding...
nah fair enough.
Gulsvi
@gulsvi
Aug 08 2017 02:40
lol, always time to code later I guess
@Kingwindie You have a margin-left of 300px on your green button that is causing it to wrap to the next line
.toggleTask{
    text-align:center;
    width:200px;
    height:50px;
    font-weight:bolder;
    font-family:'Courgette',cursive;
    letter-spacing:2px; 
    margin-top:1px;
    margin-left:300px; /* remove this or your button will wrap to the next line */
    background-color:limegreen;
    display:inline-block;
}
iso
@iso1048
Aug 08 2017 02:42
gonna watch the last jedi in spain then?
Gulsvi
@gulsvi
Aug 08 2017 02:43
I think I may travel to Germany for winter break :)
will have to watch it in german
iso
@iso1048
Aug 08 2017 02:43
haha
Gulsvi
@gulsvi
Aug 08 2017 02:43
ich schprecke kein deutsche
iso
@iso1048
Aug 08 2017 02:44
yeah i agree
Gulsvi
@gulsvi
Aug 08 2017 02:44
my spelling is bad lol
alpox would be laughing at me
iso
@iso1048
Aug 08 2017 02:45
have you made a portfolio yet
?
Gulsvi
@gulsvi
Aug 08 2017 02:45
Yeah, it sucks though lol
and so does my calculator, tic tac toe and simon....
iso
@iso1048
Aug 08 2017 02:45
surely you are good enough to become pro.
Gulsvi
@gulsvi
Aug 08 2017 02:45
all summer waiting for the beta
I don't think you can be a pro by just knowing some flexbox basics along with jQuery and HTML :)
iso
@iso1048
Aug 08 2017 02:46
you are underselling yourself
do you by any chance go to toronto uni?
Gulsvi
@gulsvi
Aug 08 2017 02:47
well, if pro means getting an entry level job, maybe I have a chance if I can learn how to interview
No, I'm not in toronto :maple_leaf: :maple_leaf:
iso
@iso1048
Aug 08 2017 02:48
true
Gulsvi
@gulsvi
Aug 08 2017 02:49
I think I'd rather work with languages, so all this front-end won't get me very far
JS algorithms are good
iso
@iso1048
Aug 08 2017 02:49
That watson api has some language stuff.
anyway, i should get back to my essay. Bye
Gulsvi
@gulsvi
Aug 08 2017 03:03
@gothamknight sorry stepped away - have fun on the essay
See you tomorrow!
Kingsley
@Kingwindie
Aug 08 2017 03:08
@SkyC0der thanks
CamperBot
@camperbot
Aug 08 2017 03:08
kingwindie sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2342 | @skyc0der |http://www.freecodecamp.com/skyc0der
Jim Tryon
@jimtryon
Aug 08 2017 03:09
Is is a good practice to commit your .git file in the repo?
Tom
@moT01
Aug 08 2017 03:12
the folder?
Jim Tryon
@jimtryon
Aug 08 2017 03:12
yeah, the hidden folder
Tom
@moT01
Aug 08 2017 03:12
no
that will get ignored when uploading
automatically
Long Nguyen
@longnt80
Aug 08 2017 03:12
can you commit it?
Tom
@moT01
Aug 08 2017 03:13
it stores all the info needed to upload and stuff
Gulsvi
@gulsvi
Aug 08 2017 03:13
lots of private info in your .git folder
email address, maybe more
Long Nguyen
@longnt80
Aug 08 2017 03:13
browser's history?
Gulsvi
@gulsvi
Aug 08 2017 03:14
bank accounts, car insurance details :)
no browser history
Long Nguyen
@longnt80
Aug 08 2017 03:15
:relieved:
Gulsvi
@gulsvi
Aug 08 2017 03:17
I think it's a bigger issue if you have a private repository
you don't want to expose it on your server
Jim Tryon
@jimtryon
Aug 08 2017 03:18
I think I should ignore the .git file in a .gitignore
Long Nguyen
@longnt80
Aug 08 2017 03:18
I think exposing your .git folder is not novice
a novice like me can only push and pull, I don't know how to push the .git folder
Gulsvi
@gulsvi
Aug 08 2017 03:19
lol
I think you just have to unhide it
attrib -r -h -s .git /s
Long Nguyen
@longnt80
Aug 08 2017 03:20
yeah, right, just a starter command line
:D
Gulsvi
@gulsvi
Aug 08 2017 03:20
totally novice
lol
Long Nguyen
@longnt80
Aug 08 2017 03:20
@jimtryon I think it is ignored by default
how did you get it to commited?
Jim Tryon
@jimtryon
Aug 08 2017 03:22
it might be ignored by default, I just saw it in the files to commit
you are right @longnt80, thanks
CamperBot
@camperbot
Aug 08 2017 03:23
jimtryon sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 483 | @longnt80 |http://www.freecodecamp.com/longnt80
Jim Tryon
@jimtryon
Aug 08 2017 03:23
don’t see it in the commit
Long Nguyen
@longnt80
Aug 08 2017 03:23
@jimtryon now you have me to go back to check all my repo

@jimtryon

don’t see it in the commit

ok, that's good

Eunice Park
@eunicode
Aug 08 2017 04:26

@SkyC0der super sorry to bother, feel free to ignore if you're busy, but if you have some time to spare, I'd like to ask for help. I used the code you gave me, and I researched jQuery event binding, but I can't get my code to work. My goal is to have the temperature in Fahrenheit when the checkbox is unchecked, and the temperature in Celsius when the checkbox is checked.
HTML

<div id="tempId"> temperature </div>   
<div><input type="checkbox" id="temp-unit-checkbox"> CHECK TO SWITCH TO TEMP UNITS
</div>

JS

$('#temp-unit-checkbox').on('change', function() {
        if ($('#temp-unit-checkbox').prop("checked")) {
          document.getElementById("tempId").innerHTML = tempC;
        } else document.getElementById("tempId").innerHTML = tempF;

 });
Lallo Vigil
@lalov1
Aug 08 2017 04:28
@jtan3 Thank you!
CamperBot
@camperbot
Aug 08 2017 04:28
lalov1 sends brownie points to @jtan3 :sparkles: :thumbsup: :sparkles:
:cookie: 454 | @jtan3 |http://www.freecodecamp.com/jtan3
Lallo Vigil
@lalov1
Aug 08 2017 04:29
I'm still trying to lighten the colors using sass with a class and add the class. The class gets loaded, but it isn't making the colors lighter. https://codepen.io/lalov1/pen/MvgvxY?editors=0010
Paul
@candlefish
Aug 08 2017 04:33
@eunipa Try using `$('#temp-unit-checkbox').change(function() {
@eunipa And then check if(this.checked)
CamperBot
@camperbot
Aug 08 2017 04:35
eunipa sends brownie points to @candlefish :sparkles: :thumbsup: :sparkles:
:cookie: 297 | @candlefish |http://www.freecodecamp.com/candlefish
Paul
@candlefish
Aug 08 2017 04:36
@eunipa I'll look at your codepen and get back to you in a minute
Paul
@candlefish
Aug 08 2017 04:45
@eunipia The problem is that your code to detect the checkbox state is within your AJAX call. You need to move that whole checkbox function into the window.onload scope, and also declare your variables for tempC and tempF in that scope too.
Eunice Park
@eunicode
Aug 08 2017 04:47
@candlefish Wow! I'm speechless! Thank you so much for such a detailed debugging of my code. I can only hope to one day reach your level of mastery :pray:
Eunice Park
@eunicode
Aug 08 2017 04:55
@candlefish I followed your instructions and the code works!! I learned an important lesson that jQuery event functions need to be in the window.onload scope, not in the AJAX call. I also learned an important lesson about variable scope :) Thank you so much
CamperBot
@camperbot
Aug 08 2017 04:55
eunipa sends brownie points to @candlefish :sparkles: :thumbsup: :sparkles:
:warning: eunipa already gave candlefish points
Paul
@candlefish
Aug 08 2017 05:02
@eunipa You're welcome. Glad I was able to help :smile:
Eunice Park
@eunicode
Aug 08 2017 05:02
@candlefish I don't know where I'd be without you. I'm still singing Hallelujah~~
Will Waymel
@willwaymel
Aug 08 2017 05:29
I'm having problems with my input box... when I go to mobile screens it breaks outside the size of the screen, doesn't resize with the screen resize. If I do max width:100% it still does that, if I play around with smaller ones, it works (80% on an iphone 6S works, but 75% and now the submit button jumps up next to the input box and pushes it outside the view... any advice? https://get-file-metadata.glitch.me/
Sorin Ruse
@sorinr
Aug 08 2017 05:31
@willwaymel have you tried width: 80vw ?
Will Waymel
@willwaymel
Aug 08 2017 05:33
@sorinr huh... that works. I needto read up on that, haven't learned about vw, even though I saw it a while back. it stands for vertical width right?
nope... viewport width
ok. Thanks so much @sorinr ... why doesn't 90% work but 90vw does?
CamperBot
@camperbot
Aug 08 2017 05:34
willwaymel sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1320 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 08 2017 05:34
@willwaymel vw is viewport width. as your parent div has no specified width you must refer to something. viewport width or vh height is qite handy
Will Waymel
@willwaymel
Aug 08 2017 05:35
@sorinr aha... i guess I thought that the parent did, which i specified at 100%...
@sorinr 100% -- the wrapper... but the direct parent is the form, which doesn't
@sorinr thanks, that helps alot
CamperBot
@camperbot
Aug 08 2017 05:35
willwaymel sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: willwaymel already gave sorinr points
Sorin Ruse
@sorinr
Aug 08 2017 05:36
@willwaymel the direct parent is the div. form is the parent of the div
Will Waymel
@willwaymel
Aug 08 2017 05:37
@sorinr right, thank you
CamperBot
@camperbot
Aug 08 2017 05:37
willwaymel sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: willwaymel already gave sorinr points
Sorin Ruse
@sorinr
Aug 08 2017 05:37
@willwaymel welcome
Vinoah
@Vinoah
Aug 08 2017 05:58
function destroyer(arr) {
return arr.length;
}
destroyer([1, 2, 3, 1, 2, 3], 2, 3);
Markus Kiili
@Masd925
Aug 08 2017 05:59
@Vinoah The only parameter arr only catches the first passed argument (the array).
Vinoah
@Vinoah
Aug 08 2017 05:59
I'm just wondering why arr.length returns an answer of 6 ???
Markus Kiili
@Masd925
Aug 08 2017 05:59
@Vinoah arr is [1, 2, 3, 1, 2, 3] on that function call.
Vinoah
@Vinoah
Aug 08 2017 06:00
@Masd925 I didn't know that!! Thank you!!! :smile:
CamperBot
@camperbot
Aug 08 2017 06:00
vinoah sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4384 | @masd925 |http://www.freecodecamp.com/masd925
Markus Kiili
@Masd925
Aug 08 2017 06:00
@Vinoah You need to use the arguments object for the rest of the arguments.
Vinoah
@Vinoah
Aug 08 2017 06:01
@Masd925 Perfect. Thank you. I love this forum!! :sparkles:
CamperBot
@camperbot
Aug 08 2017 06:01
vinoah sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:warning: vinoah already gave masd925 points
Bartosz
@CataciD
Aug 08 2017 07:52
@Zerka1982 ayyy, see yo got it, flex is pure awsomeness
k im back and helpin
Colin Thornton
@colinthornton
Aug 08 2017 07:58
I'm working on the Simon game
is using Underscore probably the best way to compare the current correct steps to the player's input?
Bartosz
@CataciD
Aug 08 2017 08:12
underscore? some kind of library?
never used it
i made the simon game with jquery, might be done with vanilla js
Jim Tryon
@jimtryon
Aug 08 2017 08:15
Yeah, underscore is a js library @CataciD
Bartosz
@CataciD
Aug 08 2017 08:15
yeah im kinda not touching any libs tbh
there are too many to bother :D
just vanila / react
Jim Tryon
@jimtryon
Aug 08 2017 08:16
hell, I’m focusing my attention on jquery/react
Bartosz
@CataciD
Aug 08 2017 08:17
yeah used jquery a while, but from what ive used it, everything can be done with jsut pure js so i rather stick to that
Jim Tryon
@jimtryon
Aug 08 2017 08:24
yeah, it takes longer with vanilla but you’re right
everything can be done with it
@lanbaoer
Aug 08 2017 10:11
Could danmu be seen for someone who are not sign up freecodecamp?
Liam Docherty
@ldocherty1
Aug 08 2017 10:28

Is it possible to change to the underline height from when the developer uses text-decoration: underline; in CSS to create an underline?

Using CSS I made the word "about" which has an 'id' of '#title4' have an underline and I was wondering how I can change the distance of the height from the underline to the word so there is a bigger gap between both?

Example of what I'm looking for

enter image description here

#title4 {
font-size: 2.5rem;
font-weight: 700;
margin-top: 5rem;
text-decoration: underline;
}

Site code

Fernando
@lestairon
Aug 08 2017 10:40
@ldocherty1 As far as i know there's no way to increase the gap between the text and the underline, but you could try using border-bottom then you could increase the space using padding-bottom
Liam Docherty
@ldocherty1
Aug 08 2017 10:40
@lestairon Thanks for the response. I will go with the <hr> option.
iso
@iso1048
Aug 08 2017 10:40
@ldocherty1 does increasing the line-height property do anything?
Fernando
@lestairon
Aug 08 2017 10:41
@gothamknight No
Liam Docherty
@ldocherty1
Aug 08 2017 10:41
@gothamknight I will look into that thanks :)
CamperBot
@camperbot
Aug 08 2017 10:41
ldocherty1 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @gothamknight |http://www.freecodecamp.com/gothamknight
iso
@iso1048
Aug 08 2017 10:48
@ldocherty1 yeah line-height doesnt do anything like @lestairon says
Liam Docherty
@ldocherty1
Aug 08 2017 10:49
What is the best method of changing the width of the <hr> line? I know you could do <hr width="50%">. However, I was just wondering if there is a preferred way which is suitable for mobile responsiveness.
@gothamknight No worries, just using the <hr> method. Much more easier way of doing it to be honest
Fernando
@lestairon
Aug 08 2017 10:54
@ldocherty1 Try using
hr {
  margin-right: **%;
}
Or maybe vw instead of %
Liam Docherty
@ldocherty1
Aug 08 2017 11:13
@lestairon width: 25%; worked.
https://jsfiddle.net/nab6zLzb/ Any ideas how I can remove that underline when you hover over the arrow bouncing?
Fernando
@lestairon
Aug 08 2017 11:22
@ldocherty1
text-decoration: none;
to your <a>
Chris Anthony
@CTAnthny
Aug 08 2017 12:22
hello all, does anyone understand where/how this jquery syntax is defined? "[href^='http']" from:
// Attach a delegated event handler
$( "#list" ).on( "click", "a", function( event ) {
    var elem = $( this );
    if ( elem.is( "[href^='http']" ) ) {
        elem.attr( "target", "_blank" );
    }
});
it means if "href begins with 'http'", I've just never seen that syntax
Markus Kiili
@Masd925
Aug 08 2017 12:24
@CTAnthny It is checking the element against a css selector [href^='http'].
And that is an attribute selector.
Chris Anthony
@CTAnthny
Aug 08 2017 12:27
Thanks @Masd925. I was looking at that page, I guess I still don't understand all the details though. What are the brackets and ^=?
CamperBot
@camperbot
Aug 08 2017 12:27
ctanthny sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4390 | @masd925 |http://www.freecodecamp.com/masd925
Chris Anthony
@CTAnthny
Aug 08 2017 12:28
the css selector would just be href right?
Chris Anthony
@CTAnthny
Aug 08 2017 12:28
ah ok, thanks!
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:40
Hey guys, I built this website http://www.iiitt.ac.in/.
Please explore it and give reviews.
Also, I am planning to add a Content Management System (CMS).
I recently explored http://keystonejs.com/. Would anybody provide me a review of it and tell me more about it?
Tom
@moT01
Aug 08 2017 12:45
@aps120797 looks pretty good, im not familiar with keystone
i see some things that could be a little better
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:46
@moT01 Are you familiar with any other CMS?
@moT01 Like what?
Tom
@moT01
Aug 08 2017 12:46
im not a fan of the font for that paragraphs, ...that's just an opinion
your logo gets cut off when i shrink my window
some of the text on the administration page gets cut off when i shrink my window
in the green buttons
there's a weird little animation when navigating through the pages
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:48
@moT01 Well, my friends and faculties loved the font. :smile:
Tom
@moT01
Aug 08 2017 12:48
like i said, ...my opinion, i like all the other fonts
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:48
Can you share the screenshot of the bug?
@moT01
Tom
@moT01
Aug 08 2017 12:50
Screenshot from 2017-08-08 07-49-34.png
Screenshot from 2017-08-08 07-50-41.png
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:51
@moT01 Okay. I got it. Will fix it. :smile:
Any more bug?
Tom
@moT01
Aug 08 2017 12:52
the sub menu could use a bigger hover effect on the mobile view
my opinion
i cant get a screen shot of the animation i mentioned
overall it looks good though, ...some minor stuff that would make it a little more crisp
Abhijeet Singh
@abhijeetps
Aug 08 2017 12:55
Hey @/all I built this website http://www.iiitt.ac.in/.
Please explore it and give reviews.
Also, I am planning to add a Content Management System (CMS).
I recently explored http://keystonejs.com/. Would anybody provide me a review of it and tell me more about it?
Liam Docherty
@ldocherty1
Aug 08 2017 13:21
Hi, is it just me or does my section two text doesn't look centred if you compare it wth section one? https://jsfiddle.net/nab6zLzb/1/ here is a screenshot for you to compare http://imgur.com/a/5zxQr
Tom
@moT01
Aug 08 2017 13:28
@ldocherty1 in the picture it does look a little off center, ...might just be in our heads, in the jsfiddle editor it looks fine for me. Can i take that full screen in the editor? i cant find an option for that
Liam Docherty
@ldocherty1
Aug 08 2017 13:29
@moT01 Let me try find a way of making it a full screen fiddle 1sec
@moT01 thanks for looking as well
CamperBot
@camperbot
Aug 08 2017 13:29
ldocherty1 sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 792 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Aug 08 2017 13:30
i think it is just in our heads
Saikat-Sinha
@Saikat-Sinha
Aug 08 2017 13:30
How to create an intro to the web app (on boarding users to the application)
similar to slack when joining for the first time.
A small hint will also be enough..
Tom
@moT01
Aug 08 2017 13:30
maybe cause the scroll bar there
I'm going to measure it lol
Maybe download the codepen or you should be Abel to see it better?
Tom
@moT01
Aug 08 2017 13:37
@ldocherty1 yea, it looks fine there
Liam Docherty
@ldocherty1
Aug 08 2017 13:39
Wish my eyes didn't play tricks on me lol
Andre
@nismocoder
Aug 08 2017 13:58
Hey guys have a question If I may.. Im helping my boss redo her website, and it is set up with "sitebuilder" I was looking to edit the code but I dont think I can acces it, I searched on google that I need to upgrade to Pro to do that. If I switch programs to edit the code will it affect the plug ins or anything like that if I switch programs?! thanks
Sorin Ruse
@sorinr
Aug 08 2017 14:04
@nismocoder on what platform is the site built? php?
Ken Haduch
@khaduch
Aug 08 2017 14:04
@nismocoder -is this website connected with a particular hosting service / provider that gives this site building tool? Or is "sitebuilder" the hosting service? I was thinking other providers like squarespace or wix or something? It might be that you can do your own site design and coding on those services if you subscribe to some other level of service? A little more detail would be helpful...
Sorin Ruse
@sorinr
Aug 08 2017 14:08
@ldocherty1 try to add some smooth transition to the section when you click the <a href="#part2">
@Saikat-Sinha look around for inspiration on "landing page"
Andre
@nismocoder
Aug 08 2017 14:11
sry back now
using aabaco
is there part of the text that I can provide to help? a screenshot or anything
<html>
Sorin Ruse
@sorinr
Aug 08 2017 14:13
@nismocoder can you share a link to the actual website?
I finished doing tutorials html css and javascript, its just the other technical stuff Im trying to learn
I still dont know much at all just trying to soak all this up
Andre
@nismocoder
Aug 08 2017 14:27
should I share any more info on anything?!
I musta gotten banned or smthng, thx n srry guys
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:10
I'm doing my Twitch API,
This is my code, I'm trying to do a call by id but it isnt working
https://codepen.io/Thayyeb_Itachi/pen/rzxKPg
Can I get some help please?
image.png
This is where it's not working
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:22
Looking for some feedback on this: https://znicholasbrown.github.io/cyclist-performance/
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:25
looks greaat
loved the loading wheel @znicholasbrown
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:26
@Thayyebsalim thanks man! I'm looking at your code now, what exactly isn't working?
CamperBot
@camperbot
Aug 08 2017 15:26
znicholasbrown sends brownie points to @thayyebsalim :sparkles: :thumbsup: :sparkles:
:cookie: 305 | @thayyebsalim |http://www.freecodecamp.com/thayyebsalim
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:27
I just wanna know whether this will work or not $("#"+users[i]).append("display this ");
thanks @znicholasbrown
CamperBot
@camperbot
Aug 08 2017 15:28
thayyebsalim sends brownie points to @znicholasbrown :sparkles: :thumbsup: :sparkles:
:cookie: 314 | @znicholasbrown |http://www.freecodecamp.com/znicholasbrown
Liam Docherty
@ldocherty1
Aug 08 2017 15:29
@sorinr Hi, thanks for the feedback regarding the smooth transition. Can you link me some examples please?
CamperBot
@camperbot
Aug 08 2017 15:29
ldocherty1 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1321 | @sorinr |http://www.freecodecamp.com/sorinr
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:31
@Thayyebsalim on line 20 of your codepen, you have an if-statement with out { }
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:32
Yes
But it is a single line of code so does it make a difference?
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:34
In this case it's just not doing anything. Other than that the .append looks good and seems to be working.
Your call is running and sending back the list + images for me
Sorin Ruse
@sorinr
Aug 08 2017 15:36
@ldocherty1 here some example
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:36
i just have to add a piece of data from an object to add into the div
so is there anyway
I have to add what the user is currently streaming
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:39
I would add something like this (working):
$("#streamers")
.append("<div id="+ users[i]+" class='user'><a href="+detail.url+" target='_blank'>
<img src="+img+">"+detail.display_name+"</a>"+ detail.status+ "</div>")
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:39
I think that part is okay
it is the second ajax call
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:41
What's wrong with it? It seems to be making the call?
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:44
the call is correct but I cant add the current stream to the div using the id i gave before
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:46
@Thayyebsalim Look at the nesting of the object your second call returns. You're setting text to (status.status), but it should be (stream.channel.status)
Nathan
@clarken1996
Aug 08 2017 15:46
hey can someone tell me why /[\W]/g doesnt' find underlines?_
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:47
The objects they return have different nesting
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:48

still if i try

$.ajax({
      url: streamUrl,
      type: "GET",
      dataType: "json",
      success: function(present) {
        if(status.stream!=null){
          $("#"+users[i]).append("display this ");
        }
      }
    });

it should work right

Jasmine J
@Kitana16
Aug 08 2017 15:50
Can i get some assistance with a hover effect
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:52
What seems to wrong? @Kitana16
Jasmine J
@Kitana16
Aug 08 2017 15:54
@Thayyebsalim I need the text to turn white in hover mode on the left menu
i know its simple
but the simple things are the most difficult lol
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:55
use :hover
Jasmine J
@Kitana16
Aug 08 2017 15:55
@Thayyebsalim not following
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:55
use class name or element name before hover
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:56
@Kitana16 instead of text-color: white use color: white
Jasmine J
@Kitana16
Aug 08 2017 15:56
@znicholasbrown OMG!!!!
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:57
@Thayyebsalim I'm still looking at yours, I'm not 100% sure what you're trying to accomplish with that though
But theoretically that should work, though I could be wrong
Jasmine J
@Kitana16
Aug 08 2017 15:57
@znicholasbrown thanks!
CamperBot
@camperbot
Aug 08 2017 15:57
kitana16 sends brownie points to @znicholasbrown :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @znicholasbrown |http://www.freecodecamp.com/znicholasbrown
Thayyeb salim
@Thayyebsalim
Aug 08 2017 15:58
Yeah that's what I'm pondering on
I just want to display the current stream detail
Nicholas Brown
@znicholasbrown
Aug 08 2017 15:58
@Kitana16 npnp
@Thayyebsalim adding detail.status to your first ajax call would do that, the second call doesn't return anything different if they're online, seemingly
Jasmine J
@Kitana16
Aug 08 2017 16:06
@znicholasbrown last thing how can i keep the active link hovered while on corresponding page
Thayyeb salim
@Thayyebsalim
Aug 08 2017 16:07
This is the problem @znicholasbrown
image.png
FCC is not currently streaming
but it has a status
Nicholas Brown
@znicholasbrown
Aug 08 2017 16:09
@Kitana16 I'd take a look at pagination: https://www.w3schools.com/css/css3_pagination.asp#
Liam Docherty
@ldocherty1
Aug 08 2017 16:11
@sorinr That's exactly what I'm planning to do:) just getting on the content on the pages first.
Sorin Ruse
@sorinr
Aug 08 2017 16:13
@ldocherty1 :+1: take a look at the js code and inspire from it. read on your on about scrollTop and offset functions that will do the trick :)
Nicholas Brown
@znicholasbrown
Aug 08 2017 16:24
@Thayyebsalim Try something like this
users.forEach(function (channel) {
  var url = "https://cors-anywhere.herokuapp.com/https://wind-bow.gomix.me/twitch-api/streams/" + channel;
  $.getJSON(url, 
        function (detail){


    switch (!detail.stream) {
      case true:
        offlineStreamers (channel);
        break;
      case false:
      default:
        logo = detail.stream.channel.logo;
        name = detail.stream.channel.display_name;
        streamURL= detail.stream.channel.url;
        status = detail.stream.channel.status;
        game = detail.stream.channel.game;
        profileBanner = detail.stream.channel.profile_banner;
        statusText = "ONLINE"; 

        $("#streamers").append(  whatever );


    }
  })})

function offlineStreamers (x) {

  var backupurl= "https://cors-anywhere.herokuapp.com/https://wind-bow.gomix.me/twitch-api/channels/" + x;
  $.getJSON(backupurl, 
            function (backupData) {
    backupLogo = backupData["logo"]
    backupName = backupData["display_name"];
    backupStreamURL= backupData["url"];
    backupStatus = backupData["status"];
    backupGame = backupData["game"];
    profileBanner = backupData["profile_banner"]
    statusText = "OFFLINE";

    if (backupData["error"]){
      backupStatus = "This streamer has either closed their account or never existed...";
      statusText = "OFFLINE";
    }

    $("#streamers").append( whatever  );


  })}
Sorry, that took me awhile to write out lol
Thayyeb salim
@Thayyebsalim
Aug 08 2017 16:25
wow Thanks dude @znicholasbrown
CamperBot
@camperbot
Aug 08 2017 16:25
thayyebsalim sends brownie points to @znicholasbrown :sparkles: :thumbsup: :sparkles:
:warning: thayyebsalim already gave znicholasbrown points
Thayyeb salim
@Thayyebsalim
Aug 08 2017 16:25
I appreciate the effort
Nicholas Brown
@znicholasbrown
Aug 08 2017 16:26
@Thayyebsalim No problem, I did something like that when I did it and it worked like a charm. While you're testing your code you might want to just copy an instance of the objects that Twitch sends back so you don't go over their call limit. I ran into that a few times and it was a pain in the butt.
So like, test your code using a test object rather than making repeated ajax calls as you edit
Gulsvi
@gulsvi
Aug 08 2017 16:26
@eunipa Sorry, I had already logged off when you messaged me. Maybe it is how you have integrated the code into your project, but it works great for me: https://s.codepen.io/anon/pen/QMpYbJ. If you still need some help with this, let me know.
Liam Docherty
@ldocherty1
Aug 08 2017 16:48
Instead of having to scroll down a little but on section 2 for navigation bar to come up. How can I make the navigation bar automatically be visible after I click on the arrow on section one to go to section 2. https://jsfiddle.net/nab6zLzb/3/
Thayyeb salim
@Thayyebsalim
Aug 08 2017 16:56
thanks @SkyC0der
CamperBot
@camperbot
Aug 08 2017 16:56
thayyebsalim sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2343 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 08 2017 16:56
any time, happy to help!
Chris
@bestintown23
Aug 08 2017 16:56
how can i make the image under my nav bar fill the whole div? https://codepen.io/bestintown23/pen/VzpgyM
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:00
width:100%
height:100%
@bestintown23
Ashish sb
@ashishsb95
Aug 08 2017 17:09
@ashishsb95
just completed the Random Machine generator project https://codepen.io/ashishsb/pen/wqGoeJ
any feedback on improvements , or bugs are welcome
Chris
@bestintown23
Aug 08 2017 17:15
@Thayyebsalim it made the picture to big i want the div size to remain how it was
Nicholas Brown
@znicholasbrown
Aug 08 2017 17:20
@ashishsb95 looks great! I wish I had found a good quote API when I did mine, that would have saved a ton of trouble. Good job!
Liam Docherty
@ldocherty1
Aug 08 2017 17:23
How can I make the navigation bar automatically be visible after I click on the arrow on section one to go to section 2. https://jsfiddle.net/nab6zLzb/3/ ?
Ashish sb
@ashishsb95
Aug 08 2017 17:24
how challenging is the next project, ie the locla weather
Eric Weiss
@eweiss17
Aug 08 2017 17:28
did you use an api for the quote generator? @ashishsb95
Ashish sb
@ashishsb95
Aug 08 2017 17:28
@eweiss17 https://forismatic.com/en/api/ this one
Eric Weiss
@eweiss17
Aug 08 2017 17:29
alright, then weather is not too bad then since u already know how to use apis
Ashish sb
@ashishsb95
Aug 08 2017 17:29
@eweiss17 but i am worried about the css transform/animation i have to do to inocate the kind of weather
@eweiss17 something like this https://codepen.io/joshbader/pen/EjXgqr
Eric Weiss
@eweiss17
Aug 08 2017 17:30
you don't have to create anything like that
you can use premade icons from skycons if you want those
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:31
apply width and height 100% to the img tag @bestintown23
Ashish sb
@ashishsb95
Aug 08 2017 17:32
@eweiss17 i mean shouldn't build with pure html,css instead of using the premade?
Chris
@bestintown23
Aug 08 2017 17:32
@Thayyebsalim it makes it too big
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:32
then change the div size
@ashishsb95 No just use icons or png for it
Eric Weiss
@eweiss17
Aug 08 2017 17:33
@ashishsb95 you don't need to. that would take a very long time
Chris
@bestintown23
Aug 08 2017 17:34
@Thayyebsalim how do i change the div size?
Ashish sb
@ashishsb95
Aug 08 2017 17:35
@eweiss17 ya , i think ishould rather skip building the icons
@Thayyebsalim @eweiss17 thanks
CamperBot
@camperbot
Aug 08 2017 17:35
ashishsb95 sends brownie points to @thayyebsalim and @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 589 | @eweiss17 |http://www.freecodecamp.com/eweiss17
:cookie: 307 | @thayyebsalim |http://www.freecodecamp.com/thayyebsalim
Liam Docherty
@ldocherty1
Aug 08 2017 17:37
@eweiss17 Hi, you got a sec to help me with something? If not all good.
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:38
All you have to do is display the local weather, changing element and a button to toggle the temperature unit @ashishsb95
Ashish sb
@ashishsb95
Aug 08 2017 17:40
@Thayyebsalim ohhh sure
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:40
this will be of use @ashishsb95 https://fcc-weather-api.glitch.me/
Eric Weiss
@eweiss17
Aug 08 2017 17:42
@ldocherty1 what is it
Ashish sb
@ashishsb95
Aug 08 2017 17:44
@Thayyebsalim ya bookmarked it , shall begin the project from tommorw
Thayyeb salim
@Thayyebsalim
Aug 08 2017 17:46
Ok
Martialis39
@Martialis39
Aug 08 2017 17:53
Hello all! I am trying to make it so that when you click, a square appears. I achieved that, but now I would like it to transition in. Can anyone tell me why this is not working?
Liam Docherty
@ldocherty1
Aug 08 2017 17:55
@eweiss17 How can I make the navigation bar automatically be visible after I click on the arrow on section one to go to section 2. https://jsfiddle.net/nab6zLzb/3/ ?
Eric Weiss
@eweiss17
Aug 08 2017 17:57
navigation bar?
you don't have one on the page right now
assuming you want it to be there when u click the arrow?
Martialis39
@Martialis39
Aug 08 2017 17:59
he does have one
click the arrow and scroll down a bit
Alex Dobre
@Zerelt
Aug 08 2017 17:59
anybody has any idea how to set Headers when doing a Get request ?
Martialis39
@Martialis39
Aug 08 2017 18:00
a "Fixed top" appears which is a placeholder I assume
@ldocherty1 also
you just need to change the windowHeight in here
var windowHeight = $(window).height(); $(window).on("scroll", function() { if ($(this).scrollTop() > windowHeight-50) { $(".navbar").show(); } else { $(".navbar").slideUp(400); } }); });
i added -50
and now it appears instantly
Mercy Manrique
@mers89
Aug 08 2017 18:15
Need help with google API
Liam Docherty
@ldocherty1
Aug 08 2017 18:21
@Martialis39 Thanks for the help. However, test this out and it doesn't fully function.
CamperBot
@camperbot
Aug 08 2017 18:21
ldocherty1 sends brownie points to @martialis39 :sparkles: :thumbsup: :sparkles:
:cookie: 341 | @martialis39 |http://www.freecodecamp.com/martialis39
Gulsvi
@gulsvi
Aug 08 2017 18:21
@Martialis39 I think your class is getting added too quickly, if you wrap the part where you add the embiggen class to the element in a setTimeout to give it some delay, your transitions work great.
const el = document.querySelector('.wrapper');

document.addEventListener('click', function(e){
  let element = document.createElement('div');

  el.append(element);
  let latest_card = el.lastChild;
  latest_card.classList.add('item');
  setTimeout(() => latest_card.classList.add('embiggen'));
});
Gulsvi
@gulsvi
Aug 08 2017 18:27
@ldocherty1 Can you just do $('.navbar').show() as the first line of your click function? I might be missing some context from above.
  $(".fa.fa-angle-double-down").on('click', function(event) {
    $('.navbar').show();
    ....
You could also change your scroll function to check if scrollTop() is greather than or equal to the windowHeight:
  var windowHeight = $(window).height();
  $(window).on("scroll", function() {
  if ($(this).scrollTop() >= windowHeight) {
@Zerelt It depends on how you are doing your GET request - XMLHttpRequest, Fetch(), $.ajax, $.getJSON, etc.
@mers89 Which Google API did you need help with?
Mercy Manrique
@mers89
Aug 08 2017 18:33
Im having an issue loading the script. I was hosting on codepen and it worked but once I transfer it to github it didnt pull the google coordinates
Gulsvi
@gulsvi
Aug 08 2017 18:34
@mers89 Do you have any errors in your browser's debug console?
Mercy Manrique
@mers89
Aug 08 2017 18:34
@SkyC0der this is the script Im using with my API key of course <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places"></script>
Gulsvi
@gulsvi
Aug 08 2017 18:35
If it works in codepen and not on github, I'd have to see your codepen + github to compare
Mercy Manrique
@mers89
Aug 08 2017 18:35
@SkyC0der I havent used a debug tool, let me take a look
Liam Docherty
@ldocherty1
Aug 08 2017 18:35
Hi @SkyC0der, thanks for the post. https://jsfiddle.net/vx85qub9/10/ It works which is fantastic. However, when I click on the arrow why does the navigation bar come up and go away? It does come up for section 2 which is what I'm looking for. How can I get rid of the when the navigation bar comes out and goes back before it reaches section 2.
CamperBot
@camperbot
Aug 08 2017 18:35
ldocherty1 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2344 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 08 2017 18:36
Ctrl+Shift+J on Windows/Linux. Command+Option+J on Mac OS @mers89
Liam Docherty
@ldocherty1
Aug 08 2017 18:36
@SkyC0der
$(document).ready(function(){
  $(".fa.fa-angle-double-down").on('click', function(event) {
        event.preventDefault();
    debugger;
    if (this.parentElement.hash !== "") {
      event.preventDefault();

      // Store hash
      var hash = this.parentElement.hash;
console.log(`hash = ${hash}`);
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        window.location.hash = hash;
      });
    } // End if
    console.log(`hash2 = ${hash}`);
  });
  $(".fa.fa-angle-double-down").on('click', function(event) {
    $('.navbar').show();
  var windowHeight = $(window).height();
  $(window).on("scroll", function() {
  if ($(this).scrollTop() >= windowHeight) {
    $(".navbar").show();
  } else {
    $(".navbar").slideUp(400);
  }
});
});
});
Gulsvi
@gulsvi
Aug 08 2017 18:38
@ldocherty1 Seems you've made some more changes since that last revision. Compare your current code with the working example here: https://jsfiddle.net/nab6zLzb/4/
Mercy Manrique
@mers89
Aug 08 2017 18:39
oh from the dev tools, yeah Ive used it/ Well for one it is showing the google maps API
Gulsvi
@gulsvi
Aug 08 2017 18:39
If I'm not mistaken, it seems you put your scroll function inside your click function @ldocherty1
Liam Docherty
@ldocherty1
Aug 08 2017 18:39
@SkyC0der Ignore me, all is sorted. No idea what I was doing lol :)
I put in the wrong code
Gulsvi
@gulsvi
Aug 08 2017 18:39
Okay, ignored ! :p
lol
Liam Docherty
@ldocherty1
Aug 08 2017 18:39
thanks for the help
Gulsvi
@gulsvi
Aug 08 2017 18:39
any time
@mers89 It's hard to help without seeing a working version + broken version to compare
Google Maps API should work fine from github as long as you don't have referrer restrictions set up in your Google API Console
Mercy Manrique
@mers89
Aug 08 2017 18:41
@SkyC0der here is the broken one from github. Let me know if you need link to code https://mers89.github.io/weatherapp/
Gulsvi
@gulsvi
Aug 08 2017 18:45
@mers89 I don't see your google maps api <script> in the codepen version
On github, you're getting an error because your script has a callback looking for an initMap() function which doesn't exist in your code
"initMap is not a function"
name "InvalidValueError"
@mers89 If you are using the Google Maps API to get a city name, you don't need to load that <script> and you don't need an API key
(Your codepen doesn't have the <script> or an API key)
Mercy Manrique
@mers89
Aug 08 2017 18:48
@SkyC0der yes, on codepen no script was needed
Gulsvi
@gulsvi
Aug 08 2017 18:49
On github it won't be needed either
Mercy Manrique
@mers89
Aug 08 2017 18:49
I notice without the script off the location won't pull up either.
Gulsvi
@gulsvi
Aug 08 2017 18:50
You're having the same issue on github as you had on codepen - all your API calls need to be over HTTPS
Mercy Manrique
@mers89
Aug 08 2017 18:51
Give me a sec let me try removing the script (thanks so much for trying to figure it out)
@SkyC0der so I removed it but same issue. My original API call under my index.js file are under https so that shouldnt be the issue.
Gulsvi
@gulsvi
Aug 08 2017 18:56
@mers89 You appear to have a missing closing </script> after jQuery:
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://code.jquery.com/jquery-2.2.4.min.js">     
  <script type="text/javascript" src="index.js"></script>
that's going to prevent your index.js from loading
Mercy Manrique
@mers89
Aug 08 2017 19:02
@SkyC0der just updated. But no luck.
Gulsvi
@gulsvi
Aug 08 2017 19:03
@mers89 I just refreshed and it seems to be working for me.
Mercy Manrique
@mers89
Aug 08 2017 19:04
@SkyC0der omg thanks so much. I owe you a starbucks card
CamperBot
@camperbot
Aug 08 2017 19:04
mers89 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2345 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 08 2017 19:04
lol, no you do not. Happy to help
Mike
@MikeJSchorah
Aug 08 2017 19:49
What does everyone think of my website? http://americawebdevelopment.com
Soumyojyoti Majumdar
@SoumyoNawab8
Aug 08 2017 19:59
guys there is a community created for SASS help....Please feel free to join
Thayyeb salim
@Thayyebsalim
Aug 08 2017 20:01
Looks nice @MikeJSchorah
Can I make a few suggestions?
Mike
@MikeJSchorah
Aug 08 2017 20:02
Thanks @Thayyebsalim Absolutely. Haha. I was about to ask that
CamperBot
@camperbot
Aug 08 2017 20:02
:cookie: 308 | @thayyebsalim |http://www.freecodecamp.com/thayyebsalim
mikejschorah sends brownie points to @thayyebsalim :sparkles: :thumbsup: :sparkles:
Thayyeb salim
@Thayyebsalim
Aug 08 2017 20:02
When you open up the nav bar links are not visible
Mike
@MikeJSchorah
Aug 08 2017 20:02
Which links?
Thayyeb salim
@Thayyebsalim
Aug 08 2017 20:03
I like the parallax effects
The navbar links
black in black
Mike
@MikeJSchorah
Aug 08 2017 20:03
That's strange. They work for me
I heard there was an issue with Firefox
@Thayyebsalim What do you think of the quotes on my 4 pages? That's the main thing that I was concerned about
Thayyeb salim
@Thayyebsalim
Aug 08 2017 20:04
by not visible I mean not clear
sorry for the vague description
Can I pm?
Mike
@MikeJSchorah
Aug 08 2017 20:06
Definitely
CamperBot
@camperbot
Aug 08 2017 20:40
:cookie: 268 | @soumyoahona200 |http://www.freecodecamp.com/soumyoahona200
iso
@iso1048
Aug 08 2017 20:53
@SkyC0der you on?
Gulsvi
@gulsvi
Aug 08 2017 20:54
Hi @gothamknight
iso
@iso1048
Aug 08 2017 20:58
@SkyC0der hi. Just wondering, how does one judge their level of expertise in a coding language - when people have on their portfolios that their html skills are 90%, how did they determine that?
Thayyeb salim
@Thayyebsalim
Aug 08 2017 20:59
Just guesses probably
Alex Dobre
@Zerelt
Aug 08 2017 20:59
@SkyC0der sorry I went away for a while after I saw nobody knew the answer. I'm using react so I'm guessing fetch or axios would be the best option. How would you add Headers to a get request ? I'm trying to mame a small list using Yelps new v3 api and following this issue here on github: https://github.com/Yelp/yelp-api/issues/184 I ended up using postman and just grabbing the json manually >.< ... would be nice to know how to add them
Gulsvi
@gulsvi
Aug 08 2017 21:00
@gothamknight Are you familiar with the idea of unknown unknowns? :)
we know what we know, we know what we don't know, but we also don't know what we don't know
So, yeah, those numbers are guesses based on what they know, what they want to advertise, and what they've experienced
Thayyeb salim
@Thayyebsalim
Aug 08 2017 21:02
I'm confused but some how that makes sense
Is that a paradox
Gulsvi
@gulsvi
Aug 08 2017 21:03
I forget what it's called, like the laws of ignorance or something
iso
@iso1048
Aug 08 2017 21:03
what do you rate yourselves @SkyC0der @Thayyebsalim ?
Gulsvi
@gulsvi
Aug 08 2017 21:03
it's an example where we can have more confidence in something than we should
I'd say 5/10 all around because I don't know what I don't know :)
Thayyeb salim
@Thayyebsalim
Aug 08 2017 21:04
000000
Gulsvi
@gulsvi
Aug 08 2017 21:05
On a resume, the numbers would be higher, and then I'd discuss my reasoning and logic around why I chose those numbers with the interviewer
iso
@iso1048
Aug 08 2017 21:05
@SkyC0der but what you do know you know very well
Gulsvi
@gulsvi
Aug 08 2017 21:06
@gothamknight but I could very well be doing it all wrong - I've never had an expert analyze any of my code
iso
@iso1048
Aug 08 2017 21:06
im probably a 1/10 then haha
@SkyC0der you dont really believe that though
Stanislav Chernov
@Beaglefoot
Aug 08 2017 21:07
@SkyC0der You're probably talking about Dunning–Kruger effect
Gulsvi
@gulsvi
Aug 08 2017 21:07
Well, "wrong" can be subjective in coding
@Beaglefoot Thank you! Sounds about right.
CamperBot
@camperbot
Aug 08 2017 21:07
skyc0der sends brownie points to @beaglefoot :sparkles: :thumbsup: :sparkles:
:cookie: 327 | @beaglefoot |http://www.freecodecamp.com/beaglefoot
Gulsvi
@gulsvi
Aug 08 2017 21:07
The cognitive bias of illusory superiority derives from the metacognitive inability of low-ability persons to recognize their own ineptitud
I need to remember that quote :joy:
iso
@iso1048
Aug 08 2017 21:08
definitely come in handy when insulting people in spain haha
Gulsvi
@gulsvi
Aug 08 2017 21:08
lmao
iso
@iso1048
Aug 08 2017 21:09
@Beaglefoot you a psychologist by any chance?
Stanislav Chernov
@Beaglefoot
Aug 08 2017 21:09
I took a course on cousera
nothing special
Thayyeb salim
@Thayyebsalim
Aug 08 2017 21:09
:D nice guess @gothamknight
are you a detective in a cape by any chance?
Gulsvi
@gulsvi
Aug 08 2017 21:10
hahaha
Thayyeb salim
@Thayyebsalim
Aug 08 2017 21:11
:D
iso
@iso1048
Aug 08 2017 21:11
that is all i am
@Beaglefoot are those courses free?
Stanislav Chernov
@Beaglefoot
Aug 08 2017 21:12
yep
Gulsvi
@gulsvi
Aug 08 2017 21:12
@Zerelt Sorry, just noticed your message. I don't know axios yet, but with fetch, it's fairly straight forward. This web page helped me a lot with learning fetch(): https://davidwalsh.name/fetch, there's a section on "Request Headers" that shows how to set it up.
iso
@iso1048
Aug 08 2017 21:12
cool
Gulsvi
@gulsvi
Aug 08 2017 21:13
var request = new Request('https://Your API Endpoint', {
    method: 'GET', 
    headers: new Headers({
        'Content-Type': 'text/plain'
    })
});

fetch(request).then(function() { /* handle response */ });
Stanislav Chernov
@Beaglefoot
Aug 08 2017 21:14
@gothamknight if you're interested I can also recommend amaizing podcast You Are Not So Smart
it covers even more topics than mentioned course
iso
@iso1048
Aug 08 2017 21:17
yeah it seems interesting
iso
@iso1048
Aug 08 2017 21:25
@SkyC0der did you have any ideas on how to use that star wars api?
juni
@junipberry
Aug 08 2017 21:27
hey guys, can you help with a simple array to object function Im stuck on
'transformFirstAndLast' that takes in an array, and returns an object with:
1) the first element of the array as the object's key, and
2) the last element of the array as that key's value.
function transformFirstAndLast(array) { return [“0+:+-1"]; }
did I get the syntax wrong
or is return [“key”:0, “value”:-1]; the better way to go about it?
Coy Sanders
@coymeetsworld
Aug 08 2017 21:34
so like passing ["fruit", "banana"]would return {"fruit" : "banana"} @junipberry ?
juni
@junipberry
Aug 08 2017 21:34
yes, @coymeetsworld
but it can have an unlimited number of elements in between
I just want to return the first and last element
Alex Dobre
@Zerelt
Aug 08 2017 21:35
@SkyC0der thanks i'll give it a shot tomorrow ... been up since 5 in the morning and it's 23.35 now. :)
CamperBot
@camperbot
Aug 08 2017 21:35
zerelt sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
juni
@junipberry
Aug 08 2017 21:35
as key and value, respectively
CamperBot
@camperbot
Aug 08 2017 21:35
:star2: 2346 | @skyc0der |http://www.freecodecamp.com/skyc0der
Coy Sanders
@coymeetsworld
Aug 08 2017 21:35
yeah, so w/ a variable size array it should be fine, you know it starts at 0 and index ends at length-1 @junipberry
juni
@junipberry
Aug 08 2017 21:36
yes I do
but I dont know what im doing wrong
is the syntax wrong?
Coy Sanders
@coymeetsworld
Aug 08 2017 21:37
@junipberry first thing is you want to return an object, looks like you're trying to return an array back
juni
@junipberry
Aug 08 2017 21:37
I was writing an array within an object..
or trying to
Coy Sanders
@coymeetsworld
Aug 08 2017 21:38
but it says just return an object
you take in an array, but return an object
if im reading what you wrote correctly
juni
@junipberry
Aug 08 2017 21:39
hmm ok I can replace object w parentheses
but there must be smtg else I need to fix
do I just concat the two indexes with a semicolon
Coy Sanders
@coymeetsworld
Aug 08 2017 21:40
I'm not sure what you mean w/ replacing object w/ parenthesis
juni
@junipberry
Aug 08 2017 21:40
or is that too literal
Coy Sanders
@coymeetsworld
Aug 08 2017 21:40
no you don't use concatenation
an object has a key value pair, separated w/ a colon
juni
@junipberry
Aug 08 2017 21:40
I meant replace array with parentheses
Coy Sanders
@coymeetsworld
Aug 08 2017 21:40
{"fruit" : "banana"} like I have here, there's no concatenation
curly brackets you mean?
juni
@junipberry
Aug 08 2017 21:44
function transformFirstAndLast(array) { return ("key=0:value=-1"); }
is that closer to where Im supposed to be
Coy Sanders
@coymeetsworld
Aug 08 2017 21:44
well theres no parenthesis, it should be curly brackets
also you don't specify the literal word key and value
key is left of the colon and value is to the right
juni
@junipberry
Aug 08 2017 21:45
I didnt before but I dont know what Im doing wrong
Coy Sanders
@coymeetsworld
Aug 08 2017 21:45
{key : value}, i.e. {"fruit": "banana"}
the value of key "fruit" is "banana"
Gulsvi
@gulsvi
Aug 08 2017 21:45
Maybe it helps to show how to create {fruit: "banana"}?
var myObj = {}
myObj['fruit'] = 'banana';
console.log(myObj);  // {fruit: "banana"}
Coy Sanders
@coymeetsworld
Aug 08 2017 21:46
yeah that is one way to do it
juni
@junipberry
Aug 08 2017 21:46
curly brackets are already there ..{ before the return and closing after return
Coy Sanders
@coymeetsworld
Aug 08 2017 21:46
create an object and use bracket notation
Gulsvi
@gulsvi
Aug 08 2017 21:46
pardon the lack of semicolons and mixed up quotes :p
Coy Sanders
@coymeetsworld
Aug 08 2017 21:46
@junipberry those brackets are different
thats used for the function you created
juni
@junipberry
Aug 08 2017 21:48
how would I do that within a function, @SkyC0der
Gulsvi
@gulsvi
Aug 08 2017 21:50
@junipberry Instead of console.log(myObj) you would return myObj;
(and of course replace 'fruit' and 'banana' with the array elements you want)
juni
@junipberry
Aug 08 2017 21:51
function transformFirstAndLast(array) { return {0:-1}; } something like this?
Gulsvi
@gulsvi
Aug 08 2017 21:52
@junipberry Hmmm, I don't want to give away the answer unless that's what you're asking for, so I'll ask a question - how would you get the first element of an array?
var array = ['fruit', 'banana']
// how do I get the first element of the array?
juni
@junipberry
Aug 08 2017 21:52
well I want to know which part Im doing wrong.. that would help a lot
Gulsvi
@gulsvi
Aug 08 2017 21:53
This is your current code:
function transformFirstAndLast(array) { 
  return {0:-1}; 
}
Coy Sanders
@coymeetsworld
Aug 08 2017 21:53
you still need to use the array parameter in your solution @junipberry
Gulsvi
@gulsvi
Aug 08 2017 21:54
It returns this:
{0: -1}
Coy Sanders
@coymeetsworld
Aug 08 2017 21:54
then if you use code similar to what @SkyC0der provided inside your function it should get you further
juni
@junipberry
Aug 08 2017 21:55
for an array, you call index [0] @SkyC0der
for the first element
Gulsvi
@gulsvi
Aug 08 2017 21:55
Correct @junipberry And that's the value you use for your key
index [1] is for the value
Another way to write the code I had above:
var key = 'fruit'
var value = 'banana';
var myObj = {}
myObj[key] = value;
console.log(myObj);  // {fruit: "banana"}
juni
@junipberry
Aug 08 2017 21:58
thats what I put for my initial attempt.. return [0:-1] ;
@SkyC0der
wasnt working
Gulsvi
@gulsvi
Aug 08 2017 21:59
@junipberry But that only returns the numbers 0 and -1
juni
@junipberry
Aug 08 2017 21:59
ohh
I need “"
for the strings
then I encapsulate all that within {}
Gulsvi
@gulsvi
Aug 08 2017 22:00
not sure I follow
juni
@junipberry
Aug 08 2017 22:00
function transformFirstAndLast(array) { return {[0]:[-1]}; }
Gulsvi
@gulsvi
Aug 08 2017 22:00
That returns [0] and [-1]
A number inside of brackets is an array
array[0] is the first element of an array named array
juni
@junipberry
Aug 08 2017 22:01
yes..
Gulsvi
@gulsvi
Aug 08 2017 22:02
So your last bit of code gives us this:
{0: [-1]}
juni
@junipberry
Aug 08 2017 22:03
no, I want this function transformFirstAndLast(array) { return {["0"]:["-1"]}; }
Gulsvi
@gulsvi
Aug 08 2017 22:04
@junipberry Do you have access to a programming environment where you can log the results of your code?
juni
@junipberry
Aug 08 2017 22:04
Im returning an object of arrays, am I not
Gulsvi
@gulsvi
Aug 08 2017 22:04
You are returning two numbers a 0 and a -1
juni
@junipberry
Aug 08 2017 22:04
yes I do..but I’m just stuck
even with the “”?
Gulsvi
@gulsvi
Aug 08 2017 22:05
with quotes, it makes you return a string "-1"
@junipberry What does this log?
var array = ['apple', 'banana'];
console.log(["-1"])
Zerka1982
@Zerka1982
Aug 08 2017 22:06
-1 will display what ?
juni
@junipberry
Aug 08 2017 22:06
but Im calling within a function, so wouldnt it be redundant to say ```return array[0,-1]
Gulsvi
@gulsvi
Aug 08 2017 22:07
It's always a requirement to include the array you want to access
juni
@junipberry
Aug 08 2017 22:07
it logs banana @SkyC0der
Gulsvi
@gulsvi
Aug 08 2017 22:07
It logs ["-1"]
Zerka1982
@Zerka1982
Aug 08 2017 22:07
yeah true
Gulsvi
@gulsvi
Aug 08 2017 22:07
we always have to include the name of the array we are accessing
It's the same as getting a character with a string, for example, here: https://www.freecodecamp.org/challenges/use-bracket-notation-to-find-the-last-character-in-a-string
Going inside a function doesn't change the way we access that data
Zerka1982
@Zerka1982
Aug 08 2017 22:09
how will you access the array
Zerka1982
@Zerka1982
Aug 08 2017 22:09
var array = ['apple', 'banana'];
console.log(["-1"])
I mean for this example
var array = ['apple', 'banana'];
console.log(array[1])
@Beaglefoot yeah those are good exercises ...
juni
@junipberry
Aug 08 2017 22:11
but how does this all help me with this function..
Zerka1982
@Zerka1982
Aug 08 2017 22:12
What the function should do exactly ?
juni
@junipberry
Aug 08 2017 22:13
@SkyC0der I understand I have to include the name of the array we are accessing..but I am returning within that function with a declared array..I declare the same array again?
Gulsvi
@gulsvi
Aug 08 2017 22:13
@junipberry Yes, you need to specify the array again even though it's the only array in that function
juni
@junipberry
Aug 08 2017 22:14
like this? function transformFirstAndLast(array) { return array{"[0]:[-1]"}; }
Gulsvi
@gulsvi
Aug 08 2017 22:14
Not quite
function firstElement(array) {
  return array[0];
}

var array = ["apple", "banana"];

firstElement(array);
^^ that code returns "apple"
javascript isn't smart enough to know that when you separate indices by colons in a object-like format, that you want all the elements of the array to go there. It also doesn't know that [-1] refers to the last index of an array
juni
@junipberry
Aug 08 2017 22:17
got it, so if I want that to be in object form, I would have to put literal “:” in between the arrays?
surrounded by {}?
Gulsvi
@gulsvi
Aug 08 2017 22:18
You'll need code like this:
var key = 'fruit'
var value = 'banana';
var myObj = {}
myObj[key] = value;
console.log(myObj);  // {fruit: "banana"}
That second to last line creates your {key: value} object
juni
@junipberry
Aug 08 2017 22:18
so..declare more variables?
Gulsvi
@gulsvi
Aug 08 2017 22:18
I declared them above to help explain this more easily, but they are not 100% required
The important part is how you create the object:
var myObj = {}
myObj[key] = value;
replace key with the first element of the array. replace value with the last element of the array.
then return myObj
Zerka1982
@Zerka1982
Aug 08 2017 22:20
key is a property and value is the value of that property
juni
@junipberry
Aug 08 2017 22:22
like this? function transformFirstAndLast(array) { var myObj = {} myObj[0] = [-1]; return myObj; } @SkyC0der
Gulsvi
@gulsvi
Aug 08 2017 22:23
@junipberry You're still not accessing the elements of your array
[0] alone does not mean get the first element of the array
I have to get going @junipberry but I think if you practice creating objects and accessing data from arrays inside of functions some more, you'll be able to figure this one out. The challenges :point_up: Linked above are good starters
Use a coding environment with a console where you can log the results of your code - and use console.log() a lot to see how your code responds
Good luck :+1:
juni
@junipberry
Aug 08 2017 22:27
I’ve already done those challenges but thanks anyway @SkyC0der
CamperBot
@camperbot
Aug 08 2017 22:27
junipberry sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2347 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 08 2017 22:27
You're welcome
dyon3334
@dyon3334
Aug 08 2017 22:42

can someone tell me why this not adding numer in the array ?```
function factorialize() {
var arr=[];
for (i=1;i<10;i++){
arr.push(i);
if (i <= 10){
return arr;}
}

}

factorialize();```

Pagnito
@Pagnito
Aug 08 2017 22:42
@SkyC0der yo
Stanislav Chernov
@Beaglefoot
Aug 08 2017 22:45
@dyon3334 for (i=1;i<10;i++) this is true on the first iteration:
i = 1 and i < 10, so loop breaks
mmmurphyor
@mmmurphyor
Aug 08 2017 22:59

I can't get the calculate button to output the result. New at js. Can someone take a look? (I realize my calcs are wrong, have some math to do). Thanks! <!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css" />
<title>Insulin Dose Calculator</title>
<meta charset="utf-8">
<script type="text/javascript"></script>
<link href="styles/insulinform.css" rel="stylesheet" type= "text/css"/>
</head>
<body>
<div id = insulinCalc>

    <!--===============USER INPUT FORM=====================
    ===========TO CALCULATE INSULIN DOSAGE===============-->


        <legend>Insulin Dose Calculator</legend>
        <br/>
        <br/>
        <label>Enter the number of Carbs </label><input type="number" id="carbs"/>
        <br/>
        <label>Enter your Ratio</label>
        <br/>   
        <label>Number of Units </label><input type="number" id="units"><label>Per </label><input type="number" id="ratio"><label>Grams of Carbohydrate </label>
         <br/>           
        <label>Enter Sugar Alcohol </label><input type="number" id = sugarAlcohol/>
        <br/>
        <label>Enter Grams of Fiber </label><input type="number" id="fiber"/>
        <br/>
        <label>Your dosage is </label><button onclick="calculateDosage()">Calculate</button><p id="calculate"></p>       

</div>
  <!--=================== ===========JAVASCRIPT====================-->     
    <script>/*Calculate dosage subtracting sugar alchols from total carbs,
    at 1/2 the total amount rounded down. Then subtract 1 unit per 5 grams of fiber, rounded to nearest 1/2 unit.*/

        function calculateDosage() {
            //do the calculations after initializing the variables   
            var units = 0, carbs = 0, ratio = 0, sugarAlcohol = 0, fiber = 0, netCarbs = 0, d1 = 0, d2 = 0, dosage = 0, outDosage = "";
            ratio = document.getElementById("units") / document.getElementById("carbs");
            d1 = (document.getElementById("carbs") - (.5 * document.getElementById("sugarAlcohol") - document.getElementById("fiber");
            d2 = d1.toFixed(2);
            dosage = round(d2);
            //Convert value to text
            outDosage = parseFloat(dosage.value);
            //display results
            var display = document.getElementById
            document.getElementById("calculate").innerHTML = "hello" + outDosage;
    </script>
</body>

</html>

BrianWilliams28
@BrianWilliams28
Aug 08 2017 23:04
@mmmurphyor maybe I'm scanning over it, but I don't see a closing curly brace '}' for your calculate function
@mmmurphyor also try calling the function after you add that in and see what it does
might be a good idea to use some console.logs to debug some of your code and see what it's doing piece by piece
dyon3334
@dyon3334
Aug 08 2017 23:08

my solution for https://www.freecodecamp.org/challenges/factorialize-a-number

function factorialize(num) {
  var arr=[];
  var y = 0;
  var sum=1;
  for (i=1;i<=num;i++){ 
    y++;
    arr.push(y);
     }
  for(i=0;i<arr.length;i++){
  sum = sum * arr[i];}
  return sum;


}

factorialize(10);`

does anyone have a suggestion or a improvement ?

Mike
@MikeJSchorah
Aug 08 2017 23:26
Is it bad design to put parallax on mobile?
Gulsvi
@gulsvi
Aug 08 2017 23:28
@dyon3334 You can do it with one loop - no need to create an array. Also, since the factorial of any number less than 2 is equal to 1, you can check for that and return before doing a loop, kind of like they show us in the Return Early Pattern for Functions challenge: https://www.freecodecamp.org/challenges/return-early-pattern-for-functions
Sorin Ruse
@sorinr
Aug 08 2017 23:55
@mmmurphyor document.getElementById("units") or document.getElementById("carbs") does not return the value of the field. you need document.getElementById("units").value . Same for all other fields
juni
@junipberry
Aug 08 2017 23:59
hey sky, I’ve updated my work to function transformFirstAndLast(array) { var myObj= { "array[0]":"array[-1]" }; return myObj; }