These are chat archives for FreeCodeCamp/HelpFrontEnd

31st
Mar 2018
CallMeOrange
@EgnaroDev
Mar 31 2018 02:04
Hello
Have anyone tried beta freecodecamp? Is it completed?
Aditya
@ezioda004
Mar 31 2018 02:08
@EgnaroDev I did some ES6/React/Redux stuff and it seems mostly stable than before
CallMeOrange
@EgnaroDev
Mar 31 2018 02:09
Oh, thanks. Good to know that it is stable and since it is called "beta" I'm assuming it is not completed yet
I'll do some of the lessons to review since I have completed many lessons on fCC already
@ezioda004 thanks
CamperBot
@camperbot
Mar 31 2018 02:11
egnarodev sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Quilty Kim
@zebralight
Mar 31 2018 02:58
hello. I was wondering why there's this empty white space that precedes the li elements in my ul even though I set the margin on the li elements to 0: https://jsfiddle.net/6q41f9h2/
Brad
@bradtaniguchi
Mar 31 2018 03:05
@zebralight let me check it out
Yea you got 40px margin left of the button for some reason, let me look deeper...
Quilty Kim
@zebralight
Mar 31 2018 03:08
ok
Brad
@bradtaniguchi
Mar 31 2018 03:08
not margin, padding sorry
Alright i got it
its because your doing this on an ul element, which is an unordered list element. Which comes with the "dot" for each element right?
Well to make room for the dot the ul tag adds 40px padding to the left. So even tho you removed the dots, the padding remains
Quilty Kim
@zebralight
Mar 31 2018 03:10
ah, should I not use ul and li in this manner, when I have a flex container and flex items?
setting padding on ul fixed it though.
thanks, @bradtaniguchi . also, I was wondering how you knew how many px the indentation was
CamperBot
@camperbot
Mar 31 2018 03:12
zebralight sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 440 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Mar 31 2018 03:12
@zebralight I inspected the element using my browsers dev tools, you can see the computed amounts usually, and it showed 40px
Now technically you can use div, but the correct approach would be using some accessibility tags (like your already using nav right?) since I assume this will be used for navigation
Quilty Kim
@zebralight
Mar 31 2018 03:14
yeah. the pattern I generally use for navs is nav -> ul -> li . It's kind of puzzling how this has never come up before for me
since I use that pattern quite often
the indentation issue, that is
Brad
@bradtaniguchi
Mar 31 2018 03:17
Yea idk how come you didn't notice it before
phao5814
@phao5814
Mar 31 2018 04:15
coderNewby
@coderNewby
Mar 31 2018 04:22
@DarrenfJ thanks for all your help
CamperBot
@camperbot
Mar 31 2018 04:22
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2444 | @darrenfj |http://www.freecodecamp.org/darrenfj
Frosty427
@Frosty427
Mar 31 2018 07:09
image.png
why is it that when i add display: flex; to this it decides to shoot to the top
its my footer
Abhi
@abhishek737
Mar 31 2018 08:58
I am trying to use url.startsWith('http') in Angular template but it is throwing can't read property startwith of undefined, but I am getting URL on the screen.
Dimitris Nik.
@dimitrissnk
Mar 31 2018 11:20
Hey guys I have my quote inside my main div and I want it to go beyond the main div which is an image. How could I do that? As margin-top is moving it in accordance to the top of the page https://codepen.io/dimitris51/pen/GxOVbX
Refath
@Refath
Mar 31 2018 12:35
I'm having a hard time understanding how to use the Moodle API
Ken Haduch
@khaduch
Mar 31 2018 12:44
@Refath - what’s a moodle API, link to documentation? Where are you trying to use it?
Marco Galizzi
@Tezenn
Mar 31 2018 14:22
hello every one, i have a problem in the simon game. if use the mp3 the site offers, they don't work.. i used some alternatives ones that are longer but really awkward. So after i fixed some things i tried the freecodecamp one and still nothing.. anyone know why?
Stephen James
@sjames1958gm
Mar 31 2018 14:29
@Tezenn I used the FCC ones - like: https://s3.amazonaws.com/freecodecamp/simonSound1.mp3
Marco Galizzi
@Tezenn
Mar 31 2018 14:30
@sjames1958gm hey if i use them the don't really work.. it is because of the code i guess, but they sound once and then if they have to play again they don't
Stephen James
@sjames1958gm
Mar 31 2018 14:30
I guess it depends on how you are trying to play them? one after the other
Ken Haduch
@khaduch
Mar 31 2018 14:31
@Tezenn - I recall seeing a short while ago that there was some problem with the sounds repeating if you use an MP3? I don't know if anyone else will recall a change in this regard. I made a test pen here that does use those sounds and loops through them a couple times, but it sounds choppy. It looks like the example project is using the AudioContext object - documentation here - it might be worth investigating that? Although from the chart that they post it seems that support is somewhat limited? Well, maybe it's mostly Internet Explorer that doesn't support it... but have a look at that and see...
Marco Galizzi
@Tezenn
Mar 31 2018 14:32
ok i will link a codepen so you can see.. sorry the code is a mess. but when i used longer sounds they worked really well.
they were like a 2 seconds sound and they worked really well, but were not nice sounds, just dog barking and stuff like that but they worked. with the fcc ones nada..
Raghav Mundra
@Raghav17
Mar 31 2018 14:38
Why is bootstrap "row" class not working with divs? Please help!
https://codepen.io/raghav96/pen/YaaaEB
Marco Galizzi
@Tezenn
Mar 31 2018 14:38
and this is the same code but others sound and they work fine
Ken Haduch
@khaduch
Mar 31 2018 15:08
@Raghav17 - it looks like it's sort-of working... but you are adding extra things like the margin-left: 40% that are probably throwing off the normal operation. It might be that you want to use something other than the bootstrap grid for this application?
@Raghav17 - and you are overriding the width: 50%; that is set up for the col-xs-6 with the settings for your green and yellow classes. Try making another div within the column div and using that for the circles.

@Raghav17 - make your HTML for the middle row look like this:

    <div class="row mid-row">
      <div class="col-xs-6"><div class="green"></div></div>
      <div class="col-xs-6"><div class="yellow"></div></div>
    </div>

In other words, and then you get a little better behavior of the grid, you might be able to play with the alignment then.

You have to look at the interactions between the elements and styles that you are trying to define and use and how it interacts with the Bootstrap settings (and expected uses of the Bootstrap classes.)
Moisés Man
@moigithub
Mar 31 2018 15:21
console.log(greenSound.error); after play.. @Tezenn
as u said.. ur sound files are corrupted
Ken Haduch
@khaduch
Mar 31 2018 15:24
@Raghav17 - here is a fork of your project with a couple fixes the circles align a little better. You can use it as an example...
Raghav Mundra
@Raghav17
Mar 31 2018 15:27
@khaduch Thanks! Sorry, I was afk for a while.
I have now understood where I was wrong.
CamperBot
@camperbot
Mar 31 2018 15:27
raghav17 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3839 | @khaduch |http://www.freecodecamp.org/khaduch
Raghav Mundra
@Raghav17
Mar 31 2018 15:27
Thanks again!
@khaduch Can you help me with just one more thing? I have applied sound on the "red" div and created an "onClick" function. But the sound only play one time and dosen't play again.
Raghav Mundra
@Raghav17
Mar 31 2018 15:36
@Tezenn I am having the same problem. Did you found the solution?
Saket Kulkarni
@saketk21
Mar 31 2018 15:37
Hello all... I am creating a website's front end and I need to display the view of my website in a phone on the website, like on the Apple website they show all the iphones mac etc. Any help?
Sorin Ruse
@sorinr
Mar 31 2018 15:39
@saketk21 can u share the code u already have?
Saket Kulkarni
@saketk21
Mar 31 2018 15:40
Oh... I was looking at a psd and found that I cannot do that.... Other stuff is manageable. I haven't begun coding yet.
I tried googling but I couldn't find helpful resources.
Saket Kulkarni
@saketk21
Mar 31 2018 15:46
Something like this: Mockup
Hemang Kumar
@hemangsk
Mar 31 2018 15:55
@saketk21 You can get screenshots for all screens such as iphone, ipad etc via Google Chrome's responsive view
Saket Kulkarni
@saketk21
Mar 31 2018 15:55
I did some digging and found out about some sites. Posting this so as to help someone else who also hits this snafu:
  1. www.magicmockups.com
  2. Mockuper
Hemang Kumar
@hemangsk
Mar 31 2018 15:56
Saket Kulkarni
@saketk21
Mar 31 2018 15:57
@hemangsk Thanks a lot... It does not have the limitations of above two mentioned sites.
CamperBot
@camperbot
Mar 31 2018 15:57
saketk21 sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:cookie: 348 | @hemangsk |http://www.freecodecamp.org/hemangsk
Jessie Cryer
@j-cryer
Mar 31 2018 21:33
Hey does anyone have an idea as to why jQuery.get won't work for me?
$.get('myurl', { data: data}, function(data){});
I get $.get isn't a function?
Kuda Bux
@kudabux
Mar 31 2018 21:41

Call .get on a DOM element. Like if you had a list of <div> elements as children to a <body> element you'd use it like this

<body>
    <div>something</div>
    <div>else</div>
</body>

console.log($('body').get(0)) returns <div>something</div>

@j-cryer
Kuda Bux
@kudabux
Mar 31 2018 21:50
"is not a function" is actually one of the better errors thrown by JS. It's telling you that whatever you've tried calling .get on doesn't have that function in it's wheelhouse. In this case you're calling .get on the jQuery library itself. So you're saying .get 'myurl from jQuery
zootechdrum
@zootechdrum
Mar 31 2018 22:06
Hello everyone and happy easter
Stephen James
@sjames1958gm
Mar 31 2018 22:06
@zootechdrum Hey
DarkxPunk
@DarkxPunk
Mar 31 2018 22:08
Anyone online who is talented with Grid?
Alex Porobe
@Zappy555
Mar 31 2018 22:28
                <nav class="navbar navbar-inverse" id="my-navbar">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                    </div>
                    <div class="collapse navbar-collapse menu" id="navbar-collapse">
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="index.html">Home</a></li>
                            <li><a href="company.html">Company</a></li>
                            <li><a href="portfolio.html">Portfolio</a></li>
                            <li><a href="contact.html">Contact</a></li>
                        </ul>
                    </div>

                </nav><!--end nav-->
Please I need help with the above. The navbar is not toggle my list even if it changes to the responsive icons on smaller screens.
Matej Bošnjak
@mbosnjak01
Mar 31 2018 22:39
@DarkxPunk just ask question, if anyone knows the answer i'm sure you'll get it
DarkxPunk
@DarkxPunk
Mar 31 2018 22:40
Well I want to see someone convert my flex design to grid