These are chat archives for FreeCodeCamp/HelpFrontEnd

10th
Jan 2018
Marzouki Wissem
@mwissem
Jan 10 2018 00:00
@GilTorch try freelancing sites
E.g: Elance, toptal, 99designs, Upwork
Gilbert
@GilTorch
Jan 10 2018 00:04
thanks @mwissem ! but if there is some of them that you personally experienced and was satisfied with I'll be glad!
CamperBot
@camperbot
Jan 10 2018 00:04
giltorch sends brownie points to @mwissem :sparkles: :thumbsup: :sparkles:
:cookie: 77 | @mwissem |http://www.freecodecamp.org/mwissem
Marzouki Wissem
@mwissem
Jan 10 2018 00:11
Sorry but I didn't try them yet but from my research "Upwork" worth trying
Gilbert
@GilTorch
Jan 10 2018 00:12
ok @mwissem so I'll visit this one first
Dan Couper
@DanCouper
Jan 10 2018 00:25
It's a meat market, ypu are a commodity on the site, get ready to get massively depressed. It might work if you keep at it but it's painful. Get good at writing proposals and talking yourself up. You won't make close to a living wage from it unless you're super duper lucky, but if you can get a few projects under your belt eventually, then you can mark all the months spent rooting for pennies on the site as you being a freelance dev, so it can look good on a CV - eg "I worked freelance for X years and here is the best work that came out of it" (probs never mention that the freelancing was all Upwork tho)
This comes from personal experience; I managed to get a few repeat clients and made a little bit of money, enough to cover some bills; it wiped me financially when I tried to only do that, but it led to first full time Dev job and actual real pay so swings and roundabouts
All those sites are objectively awful though
Gilbert
@GilTorch
Jan 10 2018 00:27
very interesting @DanCouper . Someone once told me that on Freelancer.com it can happen that you don't get paid so I'd like to know if it's really the case about some or all the freelance websites
Anyway I am currently unemployed and I'd like to make some money so I think I am gonna take a look at it.
Dan Couper
@DanCouper
Jan 10 2018 00:29
It's not supposed to, there are some protections, but the way it's set up favours low bidders so it will kill you financially if you go for general design/web development stuff as Indian/etc teams will always undercut
It's definitely worth a go though
nunoserodio
@nunoserodio
Jan 10 2018 00:30
Hey guys, I am building a tribute page for Free Code Camp and ran into a problem I can't solve
Dan Couper
@DanCouper
Jan 10 2018 00:31
Avoid the super low paying stuff, set your price at a sensible level, if possible have some specialization. As I say, get good at quickly writing proposals that sell you well cos you'll write a lot
nunoserodio
@nunoserodio
Jan 10 2018 00:32
Here is the link to my project: https://codepen.io/nunoserodio/pen/jYEQgY
So my portrait div isn't inheriting the border radius from its parent bio div
Gilbert
@GilTorch
Jan 10 2018 00:33
@DanCouper thanks buddy. I have some further questions. do you mind if I write you privately?
CamperBot
@camperbot
Jan 10 2018 00:33
giltorch sends brownie points to @dancouper :sparkles: :thumbsup: :sparkles:
:cookie: 862 | @dancouper |http://www.freecodecamp.org/dancouper
nunoserodio
@nunoserodio
Jan 10 2018 00:33
Could anybody be of assistance, please?
Dan Couper
@DanCouper
Jan 10 2018 00:34
Yup, defo. Might be a bit of a delay as it's late at my end and I need some sleep, but I'll get back to you as soon as I'm up @GilTorch
Gilbert
@GilTorch
Jan 10 2018 00:34
Alright by me
lawlercoppter
@lawlercoppter
Jan 10 2018 00:35
general question: why is <code> delete myDog["tails"];</code> more correct than <code> delete myDog.tails;</code> according to the compiler?
and nunoserodio whats your issue? I can try and take a look while I wait for an answer, though idk how much help i'll be
@nunoserodio is your issue the image size?
nunoserodio
@nunoserodio
Jan 10 2018 00:40
Thanks @lawlercoppter! I call the blue box thingy the "bio" and it should have a border-radius of 20px on the bottom right and left corners, but the bottom left corner (the one with the image) is squared and I don't know why this is happening...
CamperBot
@camperbot
Jan 10 2018 00:41
nunoserodio sends brownie points to @lawlercoppter :sparkles: :thumbsup: :sparkles:
:cookie: 206 | @lawlercoppter |http://www.freecodecamp.org/lawlercoppter
Dan Couper
@DanCouper
Jan 10 2018 00:41
Btw I was on what is now Upwork but I got banned after I didn't bother completing my final jobs after getting a full time design/front end developer job (one of the Upwork jobs was illustrations for erotic pottery, the other was a website for an escort agency and I just couldn't face even thinking about having stooped so low)
nunoserodio
@nunoserodio
Jan 10 2018 00:42
No the image size is fine, I even used flexbox to make the bio responsive to te relative width of the page, which I'm kind of proud of since I've just started out
Harut
@harut-g
Jan 10 2018 00:43
@JacobStewart1 if you mean some assets (styles, js files), yes you can
lawlercoppter
@lawlercoppter
Jan 10 2018 00:45
image.png
@nunoserodio hmmm. its not responsive in my browser but whats causing my issue with display, could be causing the issue with your border.
nunoserodio
@nunoserodio
Jan 10 2018 00:46
My bad!
lawlercoppter
@lawlercoppter
Jan 10 2018 00:47
no problem dude! still looking over your code
lawlercoppter
@lawlercoppter
Jan 10 2018 00:54
@nunoserodio yeah there is something funky going on with the code you used to make it responsive. i tried it in firefox desktop, chrome desktop, and the android default browser and depending on which view i use im getting some funky stuff going on with your image. and I think because them image is getting cropped, its using sharp corners instead of the rounded where the image is getting cut off. i'm not familiar enough with flexbox (i'm pretty new as well) to troubleshoot that specific part of the code though =/ try using the bootstrap class on the image inconjunction with flexbox possibly? hopefully you can figure it out knowing where your issue is though!
nunoserodio
@nunoserodio
Jan 10 2018 00:56
@lawlercoppter I hadn't thought of using both but that sounds like a pretty good idea! I'll try and see what I can do. Thanks for the feedback!
CamperBot
@camperbot
Jan 10 2018 00:56
api offline
nunoserodio sends brownie points to @lawlercoppter :sparkles: :thumbsup: :sparkles:
Riddos
@Riddos
Jan 10 2018 01:50
Hey could someone quickly look at my code for me :)
Tom
@moT01
Jan 10 2018 01:51
@Riddos
not if theres no code to look at
Riddos
@Riddos
Jan 10 2018 01:51
hehe
cant figure out the random spacing i have down the bottom underneath the about this page section
David Belmares
@DavidBelmares
Jan 10 2018 01:52

This is supposed to append a Tweet button to my quote machine that will automatically have the quote in the tweet box when the user clicks the button. However it's not showing up on my page

$(this).append("<a class='twitter-share-button' href='https://twitter.com/intent/tweet?text=" + urlFriendlyAuthorTemp.join("") + "%20said%20that" + urlFriendlyQuoteTemp.join("") + "'" + "data-size='large'>Tweet</a>");

I feel that the issue lies in my use of quotation marks. Is there anything wrong with them? Thanks

and here's the full pen if you need to see the rest of the code https://codepen.io/daveb02/pen/wpyOwo
Tom
@moT01
Jan 10 2018 01:53
@Riddos what random spacing - im not sure i see it
Riddos
@Riddos
Jan 10 2018 01:54
@moT01 theres a grey spacing between the bottom of the about this page and footer box
Tom
@moT01
Jan 10 2018 01:55
Screenshot from 2018-01-09 19-54-59.png
Riddos
@Riddos
Jan 10 2018 01:56
@moT01 hmm weird
@Riddos must just be glitching cause i swear the code looks fine
Tom
@moT01
Jan 10 2018 01:56
firefox 57 for ubuntu
Riddos
@Riddos
Jan 10 2018 01:56
@moT01 im on chrome
Tom
@moT01
Jan 10 2018 01:57
try another browser
or maybe changing the window size
i can only make mine so big
Riddos
@Riddos
Jan 10 2018 01:58
@moT01 hmm i still get that gap
Tom
@moT01
Jan 10 2018 01:58
i guess i can slide the window off screen and make it big - that didnt do it
sounds like a margin
maybe
Riddos
@Riddos
Jan 10 2018 01:59
@moT01 ah well its only work in progress so for something so small ill move on
Tom
@moT01
Jan 10 2018 01:59
you can open the dev tools and see better whats there probly
Riddos
@Riddos
Jan 10 2018 02:00
@moT01 awesome thanks for your help i appreciate it :)
CamperBot
@camperbot
Jan 10 2018 02:00
riddos sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 953 | @mot01 |http://www.freecodecamp.org/mot01
Tom
@moT01
Jan 10 2018 02:00
@DavidBelmares try single quotes in the .joins maybe
Aditya
@ezioda004
Jan 10 2018 02:00
@Riddos Try .About-this-page-box { padding-bottom: 10px; }
Riddos
@Riddos
Jan 10 2018 02:02
@ezioda004 boom wonderfull! thanks
CamperBot
@camperbot
Jan 10 2018 02:02
riddos sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 365 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Riddos
@Riddos
Jan 10 2018 02:02
@ezioda004 is that normal? or just a codepen kinda glitch
@ezioda004 is that normal? or just a codepen kinda glitch slash preset
Nick Ross
@codecampNick
Jan 10 2018 02:03
hi everybody! I’m having an issue changing the text color of a bootstrap4 button. In codepen the changes work fine but running locally with VS Code the text color doesn’t change. anyone else experience this? I’ve tried Chrome and FF browsers……..
Aditya
@ezioda004
Jan 10 2018 02:04
@Riddos Its not normal, but in inspect element it was empty. It was just a quick workaround :D
@codecampNick Is bootstrap link properly in your local page?
Riddos
@Riddos
Jan 10 2018 02:05
@ezioda004 too easy appreciate your help :)
Nick Ross
@codecampNick
Jan 10 2018 02:07
@Riddos I think so. Intellisense works the buttons work fine. btn-primary ect all seem to work as expected
Tom
@moT01
Jan 10 2018 02:08
@DavidBelmares the code isn't making it down there - gets stuck before the loops
Nick Ross
@codecampNick
Jan 10 2018 02:14
@ezioda004 sorry about that! mentioned the wrong person! anyway, looks like maybe it’s because I was creating the button in an “a” tag. using a plain old BS button I’m getting the expected behavior. Thank you for replying!
CamperBot
@camperbot
Jan 10 2018 02:14
codecampnick sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 366 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Aditya
@ezioda004
Jan 10 2018 02:16
@codecampNick It happens, no worries.
Cristian
@GummyGod
Jan 10 2018 02:23
Hello guys
Can anyone help me with the tweet button on the random quote machine challenge?
Aditya
@ezioda004
Jan 10 2018 02:25
@GummyGod Codepen or something?
idk what to pass to the "text"
for twitter
i tried making a variable out of the scope te
then saying like variable = *code where i change html with the data from the api
Aditya
@ezioda004
Jan 10 2018 02:29
@GummyGod You almost got it, google encodeURI().
Cristian
@GummyGod
Jan 10 2018 02:30
@ezioda004 i tried that too..
can't figure the little fucker out
Aditya
@ezioda004
Jan 10 2018 02:33
window.open("https://twitter.com/intent/tweet?text=" + '"' + encodeURIComponent($("#quote").text()) + + '"')
Cristian
@GummyGod
Jan 10 2018 02:35
@ezioda004 thanks
CamperBot
@camperbot
Jan 10 2018 02:35
gummygod sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 367 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Aditya
@ezioda004
Jan 10 2018 02:35
@GummyGod The above code basically converts the text and sends it to the given url, I think you can figure out how to get content that way too
Cristian
@GummyGod
Jan 10 2018 02:35
so basically that function
sorry
that command
lets me turn the selector #quote,and it's text into the window
quote being my span id and .text obvious
Aditya
@ezioda004
Jan 10 2018 02:36
Yeah that method converts them in the appropriate format
Cristian
@GummyGod
Jan 10 2018 02:37
Thanks buddy :)
@ezioda004 thanks
CamperBot
@camperbot
Jan 10 2018 02:37
gummygod sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
api offline
Cristian
@GummyGod
Jan 10 2018 02:37
more brown points
Api offline hahaha
thanks @ezioda004
CamperBot
@camperbot
Jan 10 2018 02:37
gummygod sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
api offline
Cristian
@GummyGod
Jan 10 2018 02:37
lmao the api crashed
Aditya
@ezioda004
Jan 10 2018 02:38
No problem, this part of the project is kinda hard to figure out, took me a lot of googling too
Joseph A. Sangine
@HTML-joe
Jan 10 2018 02:43
Hey i know I have been on here a lot with this weather project, but I could really use some help. I had everything working and bam now its all just a white screen when I tried messing with the scope of it all. any and all help would be appreciated. I am honestly fed up with this project and would like to just move on to the next one
Ken Haduch
@khaduch
Jan 10 2018 02:50
@HTML-joe - I'm taking a look at your weather project. I was thinking that it was working fine, just because we have a lot of snow on the ground here, so the white screen was apropos... :) (Just kidding.) It seems that things are shifted off to the left, at least I'm seeing some dots on the left hand side? And some error in the Javascript...
David Belmares
@DavidBelmares
Jan 10 2018 02:51
@moT01 why is my code being stuck before the loops? here's my codepen if you need it again https://codepen.io/daveb02/pen/wpyOwo
Ken Haduch
@khaduch
Jan 10 2018 02:53
@HTML-joe - it looks like you moved your code to acquire the latitude and longitude inside your $.getJSON, but you have that variable at the top of the JS panel that is trying to generate the URI using lat and long, and I'm guessing that they are not available, perhaps not in scope... Or just confused. You have the call to navigator.geolocation up there at the top, but you have to synchronize with the return of the geolocation data before you can call the $.getJSON function (I was confused because I see two different declaractions of api and calls to navigator.geolocation.) Remember that the geolocation code is asynchronous!
@DavidBelmares - it looks like your quote machine is working? At least when I click the big box, I'm getting new quotes?
Shubham Sharma
@shubham1604
Jan 10 2018 02:58
Hey
Ken Haduch
@khaduch
Jan 10 2018 02:58
hello
Shubham Sharma
@shubham1604
Jan 10 2018 02:58
How do I remove a gif on smaller screens ?
I am creating a video playing website
Where there are two gifs on both sides of the video
Ken Haduch
@khaduch
Jan 10 2018 03:00
I would say to set up a media query that detects the small screen size, and define a CSS class that sets the image to display:none;for that case, it would override the behavior for a wider screen.
Shubham Sharma
@shubham1604
Jan 10 2018 03:00
Ok
David Belmares
@DavidBelmares
Jan 10 2018 03:01
@khaduch The quote is working but to complete the FCC project I must have a working button that opens up a new window, which will open up the Twitter compose tweet window, with the current quote already filled in
Shubham Sharma
@shubham1604
Jan 10 2018 03:02
And I need to give each video a play button. But on clicking the button I want the user to create an account,and after he has created an account he can play the video. Any idea ?
Ken Haduch
@khaduch
Jan 10 2018 03:02
@DavidBelmares - I guess I didn't understand your question... I see that you have some twitter code in there, I'll have to dig in a little further.
David Belmares
@DavidBelmares
Jan 10 2018 03:02
Alright, thanks
Shubham Sharma
@shubham1604
Jan 10 2018 03:03
@khaduch
Ken Haduch
@khaduch
Jan 10 2018 03:05
@DavidBelmares - it looks like you have at least one error on line 25 - you are using randomQuote for the array name, but it's randomQuotes.
David Belmares
@DavidBelmares
Jan 10 2018 03:07
Aha, thanks for that @khaduch
CamperBot
@camperbot
Jan 10 2018 03:07
davidbelmares sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3668 | @khaduch |http://www.freecodecamp.org/khaduch
Ken Haduch
@khaduch
Jan 10 2018 03:08
@DavidBelmares - and you probably want to add target="_blank" to your href for your twitter link.
David Belmares
@DavidBelmares
Jan 10 2018 03:08
What does that do
Shubham Sharma
@shubham1604
Jan 10 2018 03:08
@khaduch you have any idea ?
Ken Haduch
@khaduch
Jan 10 2018 03:09
@shubham1604 - I don't really know what you are trying to do there. I guess you would have to have some kind of javascript function that checked for the authorization of a user when they clicked the button and if they were not authorized (not logged in or no account) then you would direct them to do that. I don't really know how to do that, though, I haven't done anything like that.
David Belmares
@DavidBelmares
Jan 10 2018 03:10
well that solved it for me, thanks very much @khaduch
Shubham Sharma
@shubham1604
Jan 10 2018 03:11
Okay
Ken Haduch
@khaduch
Jan 10 2018 03:11
@DavidBelmares - target="_blank" will open the twitter quote in a new window. It's necessary because on CodePen you cannot open a new page within the same window, because of the way the properties of the frame are set up (or something along those lines.)
David Belmares
@DavidBelmares
Jan 10 2018 03:11
alright
Adam Ayd
@adamayd
Jan 10 2018 03:11
Hey everyone, I’m looking for some help with the Twitch TV API.
Ken Haduch
@khaduch
Jan 10 2018 03:12
@adamayd - please post your question and we'll try to help
Adam Ayd
@adamayd
Jan 10 2018 03:14
I made a function that successfully makes the xhr and returns JSON, but how do I do it for a list of users that doesn’t “overload” the API? Do I just map through the array of users calling the API in each iteration?
Ken Haduch
@khaduch
Jan 10 2018 03:18
@adamayd - I think that that is what you have to do, unless they provide a method in the API for requesting multiple user's data in one shot? But most of the projects that I've looked at have used a for loop or forEach method and made a series of calls, one per user.
Aditya
@ezioda004
Jan 10 2018 03:21
^ You have to iterate through the array and call the API
Adam Ayd
@adamayd
Jan 10 2018 03:23
That sucks, I was hoping for the ability to call multiple users at once. The actual TwitchTV API allows it, but the glitch.me Twitch TV doesn’t or at least doesn’t follow the format of the Twitch API
Thanks @khaduch and Thanks @ezioda004
CamperBot
@camperbot
Jan 10 2018 03:23
adamayd sends brownie points to @khaduch and @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 368 | @ezioda004 |http://www.freecodecamp.org/ezioda004
:star2: 3669 | @khaduch |http://www.freecodecamp.org/khaduch
Tom
@moT01
Jan 10 2018 03:32
@DavidBelmares any luck?
David Belmares
@DavidBelmares
Jan 10 2018 03:33
Thanks for checking in, but yes I got it to work
Tom
@moT01
Jan 10 2018 03:34
was it getting stuck like a said or was i wrong there?
David Belmares
@DavidBelmares
Jan 10 2018 03:36
Both
Oh
I didn't read the message lol
It did have a typo
Idowu Wasiu
@Hoxtygen
Jan 10 2018 04:25
hello, anybody home? I just got hit.
Juan Marin
@JuanMP429
Jan 10 2018 05:22
hello
Joseph A. Sangine
@HTML-joe
Jan 10 2018 05:25
@khaduch I think i made the adjustments suggested but still no dice
Juan Marin
@JuanMP429
Jan 10 2018 05:26
what is that?
coderAkmal
@coderAkmal
Jan 10 2018 05:31
Any wordpress user here?
@coderAkmal
Any wordpress user here?
I need to hide a specific (sign up) page from logged in users. How do I do that
?
Deepak Manjunath
@Deepak2322
Jan 10 2018 07:02
does anyone know how to disable focus ring only for mouse users ?
Vidžius
@sursider
Jan 10 2018 08:35
Anyone got idea how I could make website with changeable language with js/jquery?
with php it would be easier, but I don't want to use php
i was thinking about making divs with id's and to change content inside depending on language, but maybe there's a better way?
Claudio Restifo
@Marmiz
Jan 10 2018 08:50
@sursider there are many libraries that helps you handle that:
usually referred as i18n
primuscovenant
@primuscovenant
Jan 10 2018 09:39
@heroiczero thx
CamperBot
@camperbot
Jan 10 2018 09:39
primuscovenant sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2132 | @heroiczero |http://www.freecodecamp.org/heroiczero
Thayyeb salim
@Thayyebsalim
Jan 10 2018 11:03
image.png
There is a small space in between zero and decimal point
Henry
@GitHub-Henry
Jan 10 2018 11:14
@Thayyebsalim when i test a calculator, a standard test i use is to use the
calculator to input the calculation .1 + .2 = i expect the answer .3
without any other digits trailing.
IvanKuzaev
@IvanKuzaev
Jan 10 2018 11:33
Hello! Please help! I'm coding a calculator. I added keypress event listener and so it`s possible to use numpad keyboard. But you can also click the buttons directly with the mouse. The problem is that when you ress a numpad key after that the button is not more visible pressable. Why does this happens?
https://codepen.io/Ivan041/pen/JMrBdX
Stephen James
@sjames1958gm
Jan 10 2018 11:45
@IvanKuzaev Your keypress handler adds the border-style:outset which overrides the .button:active CSS because it is on the element.
@IvanKuzaev Try this in your setTimeout to remove the inset style
window[key]["style"]["border-style"] = "";
Thayyeb salim
@Thayyebsalim
Jan 10 2018 11:51
@sjames1958gm Could you help me out with this small space appearing between 0 and .(decimal) button?
https://codepen.io/Thayyeb_Itachi/pen/pWRqoM
IvanKuzaev
@IvanKuzaev
Jan 10 2018 11:51
@sjames1958gm O, it works! Thank you very much! If I understand it right, keypress hander "overwrites" the style attriute on the fly and "hides" the button:active pseudo class. By the statement window[key]["style"]["border-style"] = "" we make that pseudo cass again visible. How simple is it!
CamperBot
@camperbot
Jan 10 2018 11:51
ivankuzaev sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8835 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 10 2018 11:52
@IvanKuzaev Yes, I believe that is what is happening - styles on the element override styles on the class, and setting to "" makes it go away on the element.
@Thayyebsalim Let me look
Thayyeb salim
@Thayyebsalim
Jan 10 2018 11:54
@sjames1958gm Thank you
CamperBot
@camperbot
Jan 10 2018 11:54
thayyebsalim sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8836 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 10 2018 12:09
@Thayyebsalim I don't know, it might have to do with your ops class overflowing into that last row maybe move = with the row with 0 and . instead of in that column
But then again maybe not . . . I can't see where that space is coming from.
Leonardo de Melo
@Leonardo-demeloweb
Jan 10 2018 12:10

hello guys how can i Implement this?

e.g., when I input this 100,000 and return this 100k on typescript?

n<1000 = As it is

100,000>n>1000 = 1k, 2k, 9.8k, 99.1k … etc

1,000,000,000 >n> 100,000 = 0.1 m, 40.4 m … etc

n> 1,000,000,000 = Error message (Beyond Scope)

Any help?

Thayyeb salim
@Thayyebsalim
Jan 10 2018 12:13
Thanks @sjames1958gm
CamperBot
@camperbot
Jan 10 2018 12:13
thayyebsalim sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
api offline
Hemakshi Sachdev
@hemakshis
Jan 10 2018 13:33
Hello Everyone :)
I have just completed my first React Project - Markdown Previewer. Please do have a look ---> https://codepen.io/hemakshis/pen/Gyxjdd
All kinds of feedback, reviews are most welcome :)
Reinier Blanco-Diaz
@reycuban
Jan 10 2018 13:35
Hi there! I am trying to create an overlay on the img so disply info of the each boxer... that's my tribute page.. code pen does not let my transition to work smoothly when i hover..https://codepen.io/Reycuban/pen/xpPrBq
Just need a little help?
@hemakshis amazing! great job :)
Hemakshi Sachdev
@hemakshis
Jan 10 2018 13:39
@reycuban Add another div. Your thumbnail div holds your image. Now for adding info add a div (maybe with class .info) which will initially be hidden and then on hover will show up with the transition. I hope that helps
@reycuban Thanks :)
CamperBot
@camperbot
Jan 10 2018 13:39
:cookie: 157 | @reycuban |http://www.freecodecamp.org/reycuban
hemakshis sends brownie points to @reycuban :sparkles: :thumbsup: :sparkles:
Reinier Blanco-Diaz
@reycuban
Jan 10 2018 13:40
@hemakshis i was just thinking about that! let's see how ti turns.. thank you.
CamperBot
@camperbot
Jan 10 2018 13:40
reycuban sends brownie points to @hemakshis :sparkles: :thumbsup: :sparkles:
:cookie: 302 | @hemakshis |http://www.freecodecamp.org/hemakshis
Stephen James
@sjames1958gm
Jan 10 2018 13:55
@hemakshis :+1: you might consider converting some of the components to functional components
The ones that have no internal state - as practice.
Hemakshi Sachdev
@hemakshis
Jan 10 2018 14:02
@sjames1958gm Thank you! Sure I will try that :)
CamperBot
@camperbot
Jan 10 2018 14:02
hemakshis sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8838 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Ken Haduch
@khaduch
Jan 10 2018 14:19
@HTML-joe - good morning... I just took a look at your project (I was off the computer overnight, at least over night for me...) and it looks like some stuff is happening now? Sorry that I didn't get to comment further last night, my computer went bonkers on me... :point_up: January 10, 2018 12:25 AM You must have gotten something working.
@hemakshis - that markdown previewer looks really nice. One thing that doesn't seem to be working is the "inline-style link with title". I don't see the "title" for that. But I really like all of the example text and rendered output. Nice!
Marc
@MWBauer
Jan 10 2018 14:43
Morning! :wave::coffee:
Tom
@moT01
Jan 10 2018 14:46
:snowman:
Razvan Jackson
@RazvanJackson
Jan 10 2018 14:47
Is someone here a good designer?
Tom
@moT01
Jan 10 2018 14:50
yes
dinesh
@1532j0004kg
Jan 10 2018 15:11
hi
Tom
@moT01
Jan 10 2018 15:14
:leaves:
nsonhouse
@nsonhouse
Jan 10 2018 15:22
Does any one have any ideas on how to update cells in a table ?
Fabien SHAN
@X140hu4
Jan 10 2018 15:27
@nsonhouse Explain the context
nsonhouse
@nsonhouse
Jan 10 2018 15:29
@X140hu4 Thanks Fabien. Im creating a timesheet application. Im using a button to pull the system time to record the time a person logs in and out for a shift. But I am not sure how to traverse the DOM to the fields in the table.
CamperBot
@camperbot
Jan 10 2018 15:29
nsonhouse sends brownie points to @x140hu4 :sparkles: :thumbsup: :sparkles:
:cookie: 313 | @x140hu4 |http://www.freecodecamp.org/x140hu4
Fabien SHAN
@X140hu4
Jan 10 2018 15:31
@nsonhouse I haven't much experience in DOM manipulation but can't you target the cell using an id?
nsonhouse
@nsonhouse
Jan 10 2018 15:32
@X140hu4 I thought of that, but that requires an id for each cell. With 7 days and 4 times stamps, there must be a more efficient way.
Stephen James
@sjames1958gm
Jan 10 2018 15:33
@nsonhouse You might try child selectors?
tr:nth-child(2) or some such?
nsonhouse
@nsonhouse
Jan 10 2018 15:35
@sjames1958gm Thanks James. I am not familiar with this topic. Can you elaborate?
CamperBot
@camperbot
Jan 10 2018 15:35
nsonhouse sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8839 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 10 2018 15:37
@nsonhouse https://www.w3schools.com/cssref/sel_nth-child.asp
This page talks about it but only from a CSS perspective.
I am sure there is a way in javascript. maybe using element.querySelector?
nsonhouse
@nsonhouse
Jan 10 2018 16:03
@sjames1958gm Thanks James. This looks very helpful.
CamperBot
@camperbot
Jan 10 2018 16:03
nsonhouse sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
api offline
Jigal Sanders
@sandersjj
Jan 10 2018 16:19
Hello Everyone. I am busy with the Twich.tv assignment and I am struggling with how to arrange the code. I have kind of something working. But I find It hard to arrange the code in a logical way
Kaz Baig
@kbaig
Jan 10 2018 16:20
@sandersjj could take a look if you want
Jigal Sanders
@sandersjj
Jan 10 2018 16:21
@kbaig please. But I don't want you to come with a solution and tell me here is the solution. I am looking for pointers
Kaz Baig
@kbaig
Jan 10 2018 16:21
@sandersjj for sure, I'm partial to that method anyways
Jigal Sanders
@sandersjj
Jan 10 2018 16:21
I would like to hit the api once. and then every action afterwards should happen on the result from the api
so for example when i search for a channel it should do the search on an existing list of results from the api and not first do an api request again
So I thought of have the result from the api in the global scope
and then use that global scope variable to do the filtering on
Kaz Baig
@kbaig
Jan 10 2018 16:28
@sandersjj So you mean you'd rather make all the API calls when the page is loaded and then just use that info for filtering actions etc rather than make the calls again
Am I getting that right
Jigal Sanders
@sandersjj
Jan 10 2018 16:28
Yep.
Kaz Baig
@kbaig
Jan 10 2018 16:35
@sandersjj I'd follow a workflow like so:
Promise.all(channels.map(channel => $.getJSON(`${baseUrl}/channels/${channel}?callback=?`)
  .then(channelResult => $.getJSON(`${baseUrl}/streams/${channelResult.name}?callback=?`))
))
.then(results => {
  // treat this as a global scope that has access to your api results
});
Jigal Sanders
@sandersjj
Jan 10 2018 16:38
@kbaig how should I read this? first map over the channels. Then over the streams and when you're done doing that. use the results in the promise
but this will do the api calls every time not only on page load
@kbaig have to run home now. Will catch you another time. Thanks in any case
CamperBot
@camperbot
Jan 10 2018 16:41
sandersjj sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 504 | @kbaig |http://www.freecodecamp.org/kbaig
Kaz Baig
@kbaig
Jan 10 2018 16:42
@sandersjj I'm just restructuring the fetchChannels function you implemented in your pen, ie mapping over your array channels with API calls. Calling Promise.all on the resulting array to resolve, and then using the values throughout the other functionality in your project
Not sure why those calls would occur again after page load
Jigal Sanders
@sandersjj
Jan 10 2018 16:43
ok. so this is a refactor.
will have a look at it
Kaz Baig
@kbaig
Jan 10 2018 16:45
It's just reads more top down that way
Step-wise
Kuba
@axon7
Jan 10 2018 16:49
Hello guys!
Kaz Baig
@kbaig
Jan 10 2018 16:49
:wave:
Kuba
@axon7
Jan 10 2018 16:50
Can someone help me? I just want newstr to be shown on this example site. How can I do this?
https://codepen.io/axxxon7/pen/EbENWj
Kaz Baig
@kbaig
Jan 10 2018 16:52
@axon7 as you can see in the console: newstr is not defined
Kuba
@axon7
Jan 10 2018 16:52
it's not in global scope right?
Kaz Baig
@kbaig
Jan 10 2018 16:52
Simply calling your function isn't going to do anything, you need to assign it to a variable first
if you want, you could even call that variable newstr, though it could be confusing
Kuba
@axon7
Jan 10 2018 16:53
@kbaig Do you mean function expression?
Kaz Baig
@kbaig
Jan 10 2018 16:53
@axon7 pairElement("GCG"); on its own isn't doing anyting
You need to assign the resulting value from it to a variable like so:
var str = pairElement("GCG");
And now you can use that value
Kuba
@axon7
Jan 10 2018 16:56
@kbaig Thanks! It works
CamperBot
@camperbot
Jan 10 2018 16:56
axon7 sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 505 | @kbaig |http://www.freecodecamp.org/kbaig
Kuba
@axon7
Jan 10 2018 16:56
But why is it not in arrays?
Kaz Baig
@kbaig
Jan 10 2018 16:57
Must be an interaction for when you assign a node's textContent an array
If you want to display it as an array, you're going to have to make it a string that looks like one
Kuba
@axon7
Jan 10 2018 17:01
i see, i fixed it :)
@kbaig last question:
Stephen James
@sjames1958gm
Jan 10 2018 17:02
@axon7 I usually use JSON.stringify when I see these kinds of issues.
strPtag.textContent = JSON.stringify(strcontent);
Kuba
@axon7
Jan 10 2018 17:02
when I edit in local file theres':
Uncaught TypeError: Cannot read property 'appendChild' of null
Kaz Baig
@kbaig
Jan 10 2018 17:02
Oh I forgot you can call JSON.stringify on arrays durr
Kuba
@axon7
Jan 10 2018 17:03
the console it pointing to line "container.appendChild(strPtag);"
Kaz Baig
@kbaig
Jan 10 2018 17:03
Not sure what to tell you besides there's probably a diff in your local file from the pen
Kuba
@axon7
Jan 10 2018 17:06
it does not differ
  <head>
    <script src="testfile.js"></script>
  </head>
  <body>

<div id="container"></div>
  </body>
</html>
finnaly, sorry ;p
function pairElement(str){
  var newstr = [];
  for(var i = 0; i < str.length; i++){
    if (str.charAt(i) == "G"){
      newstr.push('["G", "C"]');
    } else if (str.charAt(i) == "C") {
      newstr.push('["C", "G"]');
    } else if (str.charAt(i) == "A") {
      newstr.push('["A", "T"]');
    } else if (str.charAt(i) == "T") {
      newstr.push('["T", "A"]');
    }

  }
return newstr;

}
var strcontent = pairElement("GCG");

var container = document.querySelector("#container");
var strPtag = document.createElement("p");
strPtag.textContent = strcontent;
container.appendChild(strPtag);
any ideas why i have this error?
Kuba
@axon7
Jan 10 2018 17:13
i've managed. the script tag should be on the bottom of the page
Marc
@MWBauer
Jan 10 2018 17:13
I'm working on Wiki viewer
I have the basic page structure nailed down, I'm just afraid to work the api into it.
Kuba
@axon7
Jan 10 2018 17:14
show us what you got
Kingsley
@Kingwindie
Jan 10 2018 17:26
``var pTag = document.querySelector( 'p' ); //variable to select the paragraph
pTag.addEventListener( 'click ', updateName ); //add event listener to the selected variable tag
``var pTag = document.querySelector( 'p' );
pTag.addEventListener( 'click ', updateName ); function updateName()
{
var name = prompt( "Enter a new name" );
pTag.textContent = "Player 1: " + name;
}
``var pTag = document.querySelector( 'p' ); pTag.addEventListener( 'click ', updateName ); function updateName() { var name = prompt( "Enter a new name" ); pTag.textContent = "Player 1: " + name; }
can some tell me why the click event does not work?
Aditya
@ezioda004
Jan 10 2018 17:31
@Kingwindie updateName in pTag.addEventListener( 'click ', updateName ); needs to be called so that line should be pTag.addEventListener( 'click ', updateName ());
Kingsley
@Kingwindie
Jan 10 2018 17:33
@ezioda004 right,so i did that earlier but instead it doesn't wait for the click event,it just automatically prompts when the page loads
@Kingwindie also this webpage did not call the function,it's where i'm learning it from https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript
@Kingwindie also this webpage did not call the function,it's where i'm learning it from https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript @ezioda004
Aditya
@ezioda004
Jan 10 2018 17:39
@Kingwindie Ah that was my bad, your code works on jfiddle, check here https://jsfiddle.net/cvj3d27b/6/
Ian
@toianw
Jan 10 2018 17:41
@Thayyebsalim that space is the default browser behavior for inline or inline-block elements. Any whitespace in your html markup will be interpreted by the browser as a space between the elements (just the same as the space you get between words when you hit the space-bar). If there is no whitespace between the 0 and the . button elements in your html markup, then you won't get that space between the two buttons in the webpage (by default, button elements are display: inline-block). The other options are to use float-right on the . button, or use flexbox, or have a parent element with font-size: 0 (like you do for the buttons in the .clear div).
Kingsley
@Kingwindie
Jan 10 2018 17:46
@ezioda004 thanks,it's really strange
CamperBot
@camperbot
Jan 10 2018 17:46
kingwindie sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 369 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Thayyeb salim
@Thayyebsalim
Jan 10 2018 18:33
@toianw Thank you very much
CamperBot
@camperbot
Jan 10 2018 18:33
thayyebsalim sends brownie points to @toianw :sparkles: :thumbsup: :sparkles:
:cookie: 507 | @toianw |http://www.freecodecamp.org/toianw
Garrus Napp
@GarrusNapp
Jan 10 2018 18:36
  render() {
    console.log('rerender :)')
    const areas = this.props.data
          .map((d,i) =>
          <Path
          key={d.properties.NTS}
          index={i}
          d={this.calculate(d)}
          data={d}
          className={this.showNeighbours(i)}
          clickHandler = {this.clickHandler}
          />)

    return (
      <svg width='800' height='600'
        onClick={this.clear}
        onWheel={this.wheel}
        onMouseDown={this.startDrag}
        onMouseMove={this.drag}
        onMouseUp={this.endDrag} >
        <g draggable="true" transform={"matrix(" + this.state.matrix + ")"} >
          {areas}
        </g>
      </svg>
    );
  }
hey guys, im working on a svg map with zoom/pan. svg paths are calculated from topoJSON with d3 ( d={this.calculate(d)} ). It's not working smoothly on pan, what I believe is happening may be due to const with areas being in render function. Can I somehow move it outside?
(react)
Garrus Napp
@GarrusNapp
Jan 10 2018 19:13
//fixed -> moved areas to constructor
vivekumarsinha
@vivekumarsinha
Jan 10 2018 19:35
hi
what is javascript object
vivekumarsinha
@vivekumarsinha
Jan 10 2018 19:43
where i do the best practice of javascript
Simey de Klerk
@simeydk
Jan 10 2018 20:21
Hi
I have a question on class constructors. I have the following constructor that extends the array prototype/class. However, when I call constructor.name on it, it returns array, and I am unable to access my custom methods (e.g. completedValues) on it. any thoughts on what I'm doing wrong?
class ConstrainedSet extends Array {
    constructor(initialValues) {
        super()
        this.type = '';
        this.alias = '';
        this.displayValues = Array(9).fill('').map((x,i) => i + 1);
        Object.assign(this,initialValues)
    }

    get possibleCells() {
        const cells = this.toArray;
        return this.displayValues.map((x,i) => cells.filter(cell => cell.canBe[i]))
    }

    get toArray() {
        return Array.from(this)
    }

    get completedValues() {
        return this.toArray.map(c => c.value).filter(x => x !== null)
    }

}
Kaz Baig
@kbaig
Jan 10 2018 20:26
@simeydk You're saying ConstrainedSet.namereturns "Array"?
Simey de Klerk
@simeydk
Jan 10 2018 20:28
@kbaig my real problem is I'm trying to use my custom methods, but getting "toArray is undefined" errors
Kaz Baig
@kbaig
Jan 10 2018 20:29
@simeydk what if you turned toArray into a regular method rather than a getter
Simey de Klerk
@simeydk
Jan 10 2018 20:30
let me try
but get is supposed to work, though
Kaz Baig
@kbaig
Jan 10 2018 20:30
I think it should too
Simey de Klerk
@simeydk
Jan 10 2018 20:36
that's not it
i removed toArray()'s 'get' prefix, and it still gives me a toArray is not a function error
It works fine if I run it in the Chrome console, or in node command line
but when I try it in my app it's bombing out
Juan Marin
@JuanMP429
Jan 10 2018 20:37
what language is that @simeydk
Simey de Klerk
@simeydk
Jan 10 2018 20:37
Javascript
Juan Marin
@JuanMP429
Jan 10 2018 20:37
kk
Kaz Baig
@kbaig
Jan 10 2018 20:38
hmm yeah I don't see why it wouldn't work
Simey de Klerk
@simeydk
Jan 10 2018 20:39
@JuanMP429 Check out https://eloquentjavascript.net/06_object.html, it gives a pretty good overview of creating new classes
@kbaig Thanks anyway for the help. It's frustrating. I ran into the same problem before on a class that i extended from Object, but got around it by removing the extends clause, since I didn't actually need any of Object's properties. but in this case I really want to have an array with additional properties, so it's a bummer that it doesn't work
CamperBot
@camperbot
Jan 10 2018 20:41
simeydk sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 506 | @kbaig |http://www.freecodecamp.org/kbaig
Juan Marin
@JuanMP429
Jan 10 2018 20:43
alright ill check it out! do you know a website that teaches you this language or does freecodecamp has this to learn?
for free
Kaz Baig
@kbaig
Jan 10 2018 20:43
@JuanMP429 fCC has a focus on JavaScript.
Juan Marin
@JuanMP429
Jan 10 2018 20:43
alright
because rigth now i am learning html
Simey de Klerk
@simeydk
Jan 10 2018 20:44
@JuanMP429 yes, as @kbaig says fCC has a lot of good intro to Javascript stuff.
Juan Marin
@JuanMP429
Jan 10 2018 20:44
but it wont let me get out of the html until i finished with it
Kaz Baig
@kbaig
Jan 10 2018 20:45
Not much point to learning JS unless you know HTML
Simey de Klerk
@simeydk
Jan 10 2018 20:46
@JuanMP429 The typical order is to learn HTML, then CSS and then Javascript. HTML is how you put items on a page, CSS is how you customise their style/formatting/layout, and Javascript is how you add functionality to it (do somethign when a button is pressed, etc)
Juan Marin
@JuanMP429
Jan 10 2018 20:46
really? why is that?
Matej Bošnjak
@mbosnjak01
Jan 10 2018 20:46
@JuanMP429 w3schools, codeschool, codeacademy, tutorialspoint,
https://developer.mozilla.org/en-US/docs/Web , ... youtube videos ... and many more
Juan Marin
@JuanMP429
Jan 10 2018 20:48
thank you all for this! i did not know what css, javaS was for, but now i do! thanks now i know that everything connects together so it can work correctly!
Simey de Klerk
@simeydk
Jan 10 2018 20:50
@JuanMP429 You can use Javascript in two main ways: to write command line apps (i.e. stuff that works in command prompt / terminal), or to manipulate a web page. Command line is of limited usefulness for many cases since 'normal people' (i.e. non-developers) don't use it. So the usefulness of javascript is to manipulate webpages. However, you need to know how the page was put together in the first place before you can use Javascript to change it
it's a pleasure
DerMann97
@DerMann97
Jan 10 2018 22:15
[JAVA] Hello guys every time I create a List I go this error: "remove type arguments" what I wrote is: List<String> list = new List<String>();
Kaz Baig
@kbaig
Jan 10 2018 22:35
@DerMann97 Prob not going to have too much luck w/ Java here since it's front end
Maybe try back end?
VaseJS
@VaseJS
Jan 10 2018 22:52
@JuanMP429 I would have to disagree with @simeydk about the usesage of JS. it can be used in many way with NodeJS. The web was where it was born. command line is a very useful thing. Yes, ‘normal’ people may not use it as much as devs but they do use it. Command line was just around before GUIs and will be around forever because cli (command line interface) will be around forever also. nonetheless, JS can be and is being used everywhere. Its programming drones, making widgets do widgetty things, desktop apps, robotics, etc. Js can be just about everywhere, thus the JS Everywhere movement. JS is not mainly used for those to things. its better said that two things JS can program are the web and cli among other things. its up to you.
Kris Baillargeon
@krisb1220
Jan 10 2018 22:55
I agree with @VaseJS considering most servers that websites run on use CLI for all different types of data manipulation and installations, etc. The evidence you stated about things working, @simeydk , kind of invalidated your own point :P
And also
We're all developers here? lol
Dan Lafferty
@DanLaff
Jan 10 2018 23:05
de·vel·op·er (dəˈveləpər)
noun
a person or thing that develops something.
:)
alpox
@alpox
Jan 10 2018 23:21
@DerMann97 List in Java is only an Interface. You cannot create an instance of an interface! You probably wanted: List<String> list = new ArrayList<String>();
@DerMann97 This works because you define the variable list to hold any instance of a class which implements the interface List<String>
Which ArrayList<String> does.
texirv0203
@texirv0203
Jan 10 2018 23:33

hi,

  • I am using appdyanmics in my app for monitoring user activity.
  • but the problem is it doesnt show how much time user has clicked the button.
  • so using rxjs I have wrote a click event.
  • this click event shows the mouse event and how to pass this mouse event in appdyanmics payload, so that I can generate a report usimg appdyanmics.
  • providing my code changes below

appdyanmics Reference links:

https://docs.appdynamics.com/display/PRO42/Extend+the+JavaScript+Agent+for+Single+Page+Applications+%28SPAs%29+in+Browser+RUM
https://docs.appdynamics.com/display/PRO42/Single+Page+Applications+in+Browser+RUM+-+AngularJS

sample appdynamics angular app https://github.com/derrekyoung/appd-sampleapp-angular2

<script src="https://cdn.appdynamics.com/adrum/adrum-latest.js"></script>

app.component.ts


import { Component } from '@angular/core';
import {Subject} from 'rxjs/Subject';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'AppDynamics Sample App for Angular 2';

    click = new Subject();

    ngOnInit() {
      this.click.subscribe(console.log);
    }


}

app.component.html


<h1>
  {{title}}
</h1>

<header>
  <div>

    <!-- Navigation with router directives-->
    <nav>
      <a [routerLink]="['/']">Home</a>
      <a [routerLink]="['/names']">Names</a>
      <a [routerLink]="['/posts']">Posts</a>
      <a [routerLink]="['/photos']">Photos</a>
    </nav>
  </div>
  <div>
    <!-- <button (click)="new Subject()" type="button">Click Me!</button> -->

    <button (click)="click.next($event)">Click Me!</button> 
  </div>

</header>


<router-outlet></router-outlet>

appdynamics request payload


{
  "vr": "4.4.1.154",
  "dt": "R",
  "rg": "0",
  "es": [{
    "eg": "1",
    "et": 2,
    "eu": "0://1/2/",
    "ts": 1515610064377,
    "mg": "2",
    "au": "0://3/",
    "at": 3,
    "pp": 3,
    "mx": {
      "PLC": 1,
      "FBT": 48,
      "DDT": 0,
      "DPT": 4,
      "PLT": 52,
      "ARE": 0
    },
    "md": "GET",
    "xs": 200,
    "si": 18
  }],
  "ai": "d4e7ef50_b4f3_1dd7_5cdf_49a60ff5635d",
  "gs": ["bbe438d0_0c94_63d9_2c22_700343b560b5", "cde9c933_e332_41ce_9333_5021c1502265", "4e6a7f03_4588_49e2_6c25_d8a3a1f3fe90"],
  "up": ["http", "jsonplaceholder.typicode.com", "users", "localhost:4200"]
}