These are chat archives for FreeCodeCamp/HelpFrontEnd

19th
Mar 2018
kerafyrm02
@kerafyrm02
Mar 19 2018 00:01
why make it in angular just do it with jquery
it's like super easy
i like that error msg
coderNewby
@coderNewby
Mar 19 2018 05:45
@DarrenfJ more PM's thanks
CamperBot
@camperbot
Mar 19 2018 05:45
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2428 | @darrenfj |http://www.freecodecamp.org/darrenfj
Joshua Frias
@Juke-Magic
Mar 19 2018 09:21
guys
why doesnt json collect my data from url
?
Markus Kiili
@Masd925
Mar 19 2018 09:22
@Juke-Magic You have a CORS error on browser developer tools console.
Joshua Frias
@Juke-Magic
Mar 19 2018 09:22
why i used windbow?
what do i do?
how did you know?
Markus Kiili
@Masd925
Mar 19 2018 09:23
@Juke-Magic I looked at the browser developer tools console (F12 on PC chrome).
Joshua Frias
@Juke-Magic
Mar 19 2018 09:24
what do i do then?
Stephen James
@sjames1958gm
Mar 19 2018 09:29
@Juke-Magic Look for the discussion of jsonp on http://api.jquery.com/jQuery.getJSON/
It will tell you how to modify you URL to bypass CORS
Liam Docherty
@ldocherty1
Mar 19 2018 09:42
What websites do people recommend for hosting?
paid options please, free services seem to be a waste of time
Stephen James
@sjames1958gm
Mar 19 2018 09:49
@ldocherty1 If you plan on using node back ends heroku or digital ocean. Of course AWS is the big beast out there
Liam Docherty
@ldocherty1
Mar 19 2018 09:49
@sjames1958gm Thanks
CamperBot
@camperbot
Mar 19 2018 09:49
ldocherty1 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 9115 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Markus Kiili
@Masd925
Mar 19 2018 09:58
@Juke-Magic At best, you can make it work by adding &callback=? at the end of the url you use, as the link posted by @sjames1958gm said.
Ruben Dario
@rubendmatos1985
Mar 19 2018 10:41
hello!!!, i need for some help with a challenge

Wherefore art thou
Make a function that looks through an array of objects (first argument) and returns an array of all objects that have matching property and value pairs (second argument). Each property and value pair of the source object has to be present in the object from the collection if it is to be included in the returned array.

For example, if the first argument is [{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], and the second argument is { last: "Capulet" }, then you must return the third object from the array (the first argument), because it contains the property and its value, that was passed on as the second argument.

Remember to use Read-Search-Ask if you get stuck. Write your own code.

i dont really know what i must to do
somebody could help me
??
Markus Kiili
@Masd925
Mar 19 2018 10:44
@rubendmatos1985 You need to keep those objects that have all the property keys that source object has and property values also match. So you need to loop or iterate the array collection and also make a nested loop or iteration over source's keys.
Ruben Dario
@rubendmatos1985
Mar 19 2018 10:46
@Masd925 thanks but i dont understand
CamperBot
@camperbot
Mar 19 2018 10:46
rubendmatos1985 sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4733 | @masd925 |http://www.freecodecamp.org/masd925
Markus Kiili
@Masd925
Mar 19 2018 10:46
So in the example case that you posted, you would keep all those objects that have the key "last" with a value "Capulet".
Ruben Dario
@rubendmatos1985
Mar 19 2018 10:47
@Masd925 i really dont understand
@Masd925 this object its a dictionary
Markus Kiili
@Masd925
Mar 19 2018 10:48
@rubendmatos1985 collection holds an array of objects and source holds an object.
Ruben Dario
@rubendmatos1985
Mar 19 2018 10:49
@Masd925 ok
@Masd925 thank u
CamperBot
@camperbot
Mar 19 2018 10:49
rubendmatos1985 sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
api offline
jenseo
@jenseo
Mar 19 2018 10:53

Hey guys,
I'm really stuck on a problem with json/php that I can't figure out. I have the following json:

[
{
"id": 1,
"stocks": [
{
"quantity": 0,
"minHandlingDays": 1,
"maxHandlingDays": 2
}
],
"sku": "F1515101"
},
{
"id": 2,
"stocks": [
{
"quantity": 48,
"minHandlingDays": 1,
"maxHandlingDays": 2
}
],
"sku": "H4510100"
},
{
"id": 6,
"stocks": [
{
"quantity": 1,
"minHandlingDays": 1,
"maxHandlingDays": 2
}
],
"sku": "H4510105"
}
]

I'm running a foreach loop on this and foreach item I'm setting up a variable from the ID:

$id = $item['id'];

With this id, I'm creating a new array, but the problem is that I'm getting the following error:

"Undefined index: id..."

If I use isset($item['id']), no IDs are being set and appended to the new array, but if I just run it with the undefined index error, it still sets the ID (although it says it's undefined) and append the ID to the new array.

And i just CAN'T figure out why! So frustrating :D

Anyone have an idea what might be wrong?
The json is json_decoded, true btw
So in the example above, the id's being set correctly is id:1, 2 and 6 for the different items, but still I get undefined index on the id:s. What have I missed?
Sorin Ruse
@sorinr
Mar 19 2018 10:59
@jenseo have you tried $id = json.id?
jenseo
@jenseo
Mar 19 2018 11:01
Tried it now, getting: Use of undefined constant id
and PHP Notice: Array to string conversion in
Weird thing is that it does set the id, since it gets added to the new array, but it still says undefined index
@sorinr Thanks for the suggestion, but as you can see above, it doesn't work
CamperBot
@camperbot
Mar 19 2018 11:04
jenseo sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1407 | @sorinr |http://www.freecodecamp.org/sorinr
Sorin Ruse
@sorinr
Mar 19 2018 11:05
@jenseo take a look here .maybe its the way you iterate the object
@jenseo so if using php it may be json->id not json.id js syntax
jenseo
@jenseo
Mar 19 2018 11:11

Unfortunately, this gives:

HP Notice: Trying to get property of non-object

And as stated, the ID gets set, but still gives undefined index
So Im really puzzled about this one :)
@sorinr
Sorin Ruse
@sorinr
Mar 19 2018 11:18
@jenseo do u have decoded json (json_decode)?
jenseo
@jenseo
Mar 19 2018 11:19
Yes, but now I'm looking at what the iterator spits out and it looks a bit weird, so that might be the problem
Have to look for errors and see
jenseo
@jenseo
Mar 19 2018 11:28
@sorinr Using this to loop the json:
new RecursiveIteratorIterator(new RecursiveArrayIterator(json_decode($str, TRUE)), RecursiveIteratorIterator::SELF_FIRST);
It seems to be returning several array for every dimension in the object
Murage
@ErickMurage
Mar 19 2018 13:03
I am having some trouble with font awesome social media icons. The other icons I have used on the site are working perfectly. Just these.
        <div class="social-media-icons">
            <a href="https://twitter.com/ErickMurage"><i class="fab fa-twitter fa-2x"></i></a>
            <a href="https://github.com/ErickMurage"><i class="fab fa-github fa-2x"></i></a>
            <a href="https://www.instagram.com/e_murage/"><i class="fab fa-instagram fa-2x"></i></a>
        </div>
kerafyrm02
@kerafyrm02
Mar 19 2018 13:06
wwhats the issue'
Murage
@ErickMurage
Mar 19 2018 13:15
@kerafyrm02 the icons are not showing. they appear as empty boxes
kerafyrm02
@kerafyrm02
Mar 19 2018 13:16
link?
Murage
@ErickMurage
Mar 19 2018 13:20
@kerafyrm02 I currently have it on github, here's the link https://github.com/ErickMurage/Portfolio
Ken Haduch
@khaduch
Mar 19 2018 14:04
@ErickMurage - I'm not sure if this might be a new setup for the font-awesome fonts, but this code: <i class="fas fa-user-circle fa-5x"></i> doesn't look right to me? I am used to seeing fa as the first class in the class attribute, instead of fas? Although I guess I don't know what the "solid.css" is in font-awesome? I guess i have to check out the new release.
Nazar
@IsaakNazar
Mar 19 2018 14:05
c argument equals to(points to) each character on the Hello string right?
function myFunction(str) {
  return str.replace( /[A-Za-z]/g , function(c) {
    return //do some stuff
  });
}
myFunction('Hello');
Ken Haduch
@khaduch
Mar 19 2018 14:08
@ErickMurage - just looked at the docs - on this page it looks like you also have to load two JS modules to use the "fas" - solid.js and fontawesome.js
Ken Haduch
@khaduch
Mar 19 2018 14:13
@ErickMurage - https://fontawesome.com/how-to-use/upgrading-from-4 - if you are accustomed to (or using documentation that references) the older version of fontawesome fonts. Anyway, it looks like there have been a lot of changes in the new version...
Claudio Restifo
@Marmiz
Mar 19 2018 14:15
@IsaakNazar @IsaakNazar no it's just what matches from the regex
Murage
@ErickMurage
Mar 19 2018 14:16
@khaduch I'm not very well accustomed to font awesome, I'm a noob in web dev. So i just thought it would be best to use the latest release.
knight2
@knight2
Mar 19 2018 14:20
Does anyone know a good video tutorial for setting up visual studio code for web development, that will allow use of SCSS, React + babel?
I really don't understand why it is only me who is having this huge issue
I didn't do anything wrong, fresh visual studio code installs, followed instructions for using those externals via the official VSC website. I have spent more time this week trying to figure out the configurations for visual studio code instead of actually programming.
Another IDE would be fine, as long as there are very clear instructions from fresh install on how to work with web development files, use SCSS, use React/babel, and automatically compile those.
And the even bigger question..... Why doesn't FCC pick a popular IDE and show you how to configure it to use all the libraries that THEY make you use?
Murage
@ErickMurage
Mar 19 2018 14:20
@khaduch however, i did find a solution. I used the bootstrap cdn and moved my google fonts reference to below the bootstrap one and then changed the classes from .fas to .fa. That seemed to solve the issue.
Nazar
@IsaakNazar
Mar 19 2018 14:22
@Marmiz means that each character on Hello will be replaced with c argument?
Ken Haduch
@khaduch
Mar 19 2018 14:28
@ErickMurage - that's good that you figured it out - it looks like there is a lot more to it than there used to be. I'll have to try and catch up to the latest developments there! Good luck!
Claudio Restifo
@Marmiz
Mar 19 2018 14:51
@IsaakNazar no, it means that in the replacer function, c holds the value in the string that is matching right now.
Imagine replace as a function that goes into a string and look for a particular match.
When that match is found it's passed to a replacer function as first argument (in your case called c).
LydaTech
@lydatech
Mar 19 2018 14:52
@knight2 SCSS, React + babel are setup OUTSIDE of your ide/editor
Nazar
@IsaakNazar
Mar 19 2018 14:52
@Marmiz oh, excellent explanation, thank you :+1:
CamperBot
@camperbot
Mar 19 2018 14:52
isaaknazar sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:star2: 1186 | @marmiz |http://www.freecodecamp.org/marmiz
Claudio Restifo
@Marmiz
Mar 19 2018 14:53
@IsaakNazar :+1: happy coding
knight2
@knight2
Mar 19 2018 14:54
@lydatech right and you can use add-ons to automatically compile them
Claudio Restifo
@Marmiz
Mar 19 2018 14:56

@IsaakNazar consider that in replace you can also pass a string as replacer, instead of using a function:

var newstr = str.replace(/xmas/i, 'Christmas');

will change 'xmas' with 'Christmas'

Nazar
@IsaakNazar
Mar 19 2018 14:57
@Marmiz I think your explanation above should be on mdn :+1:
Claudio Restifo
@Marmiz
Mar 19 2018 14:59
I think it is... there's no mention of the replacer function? :thought_balloon:
knight2
@knight2
Mar 19 2018 15:00
@lydatech thanks but 'Visual Studio' not 'visual studio code'
CamperBot
@camperbot
Mar 19 2018 15:00
knight2 sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 2730 | @lydatech |http://www.freecodecamp.org/lydatech
Nazar
@IsaakNazar
Mar 19 2018 15:01
@Marmiz it is, but for me was really hard to understand from mdn
I guess the reason is my English level
Matt Miranda
@unshelledpilot
Mar 19 2018 15:33
Hello Folks. I'm having a bit of trouble with my first portfolio page project. I'm having trouble setting the sticky navbar up properly. When I click on the navbar link, it jumps to the proper section, but its not offsetting to allow the full text to show. Could anyone take a look? https://codepen.io/Unshelledpilot/pen/gewdqz
Austin Jess
@ajess33
Mar 19 2018 15:34
Morning everyone! I’m using fetch for my local weather api and when I put the lat and long variables in the fetch URL and run it, it throws an error because lat and long variables haven’t came back from the geolocation yet. How would I run the fetch only after both of my variables are defined? Does that makes sense?
Amal Shukla
@amal1994
Mar 19 2018 15:51
@ajess33 - yes that's how it's done
That's the power of javascript which is asynchronous functionality,
you wait for results to come through api, and when we've got the results, we show them or make use of them.
That's where promises come.
Search it out you would get thousands of resources to how to go about it
LydaTech
@lydatech
Mar 19 2018 15:52
@unshelledpilot yeah you dont have your nav setup properly
@unshelledpilot you need to look over these: https://getbootstrap.com/docs/4.0/components/navbar/ and https://getbootstrap.com/docs/4.0/components/scrollspy/#how-it-works also you had 2 versions of bootstrap.js loading
Matt Miranda
@unshelledpilot
Mar 19 2018 15:58
@lydatech Thank You!! This was exactly what I needed
CamperBot
@camperbot
Mar 19 2018 15:58
unshelledpilot sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 2731 | @lydatech |http://www.freecodecamp.org/lydatech
Suyash
@pstrings
Mar 19 2018 15:58
how do I add images save on my computer to html?
LydaTech
@lydatech
Mar 19 2018 15:59
@pstrings if you will want the images viewable on the web you need to host the files somewhere
Suyash
@pstrings
Mar 19 2018 16:00
no I'm creating an epub
Darren
@DarrenfJ
Mar 19 2018 16:00
@coderNewby hey thanks for the kudos.. sorry was offline will check it today...
CamperBot
@camperbot
Mar 19 2018 16:00
darrenfj sends brownie points to @codernewby :sparkles: :thumbsup: :sparkles:
:cookie: 96 | @codernewby |http://www.freecodecamp.org/codernewby
LydaTech
@lydatech
Mar 19 2018 16:02
@pstrings <img src="location of image" />
Suyash
@pstrings
Mar 19 2018 16:02
ok thanks
Suyash
@pstrings
Mar 19 2018 16:19
when linking to social media account do I need to put the link to the image icon or is there another way?
Nate Mallison
@NJM8
Mar 19 2018 16:25
@ajess33 How are you getting the lat and lng? from geolocation you can pass two callback functions, one to run if it gets the latlng, one to run if it fails. you have to pass these functions to the geolocation.getCurrentPosition function, then when it gets the results it will run the success or error function depending on if it worked.
I did it this way:
    if ('geolocation' in navigator) {
        displayMessage('Finding your local weather');
        let successHandler = function(position){
            latLng = [position.coords.latitude, position.coords.longitude];
            getWeatherByLatLng(latLng);
        }
        const errorHandler = function(){
            displayMessage("We couldn't get your location automatically, please search above!");
        }
        navigator.geolocation.getCurrentPosition(successHandler, errorHandler);
    } else {
        displayMessage("We couldn't get your location automatically, please search above!");
    }
so I define the functions successHandler and errorHandler, and pass them into navigator.geolocation.getCurrentPosition(), then when it gets the position it know what to do.
catshark
@catshark
Mar 19 2018 16:37
Does anyone know how to extend the duration of the sounds played in the simon game project? The computer plays an extended version of each of the simon sounds in the demo project?
Nazar
@IsaakNazar
Mar 19 2018 16:37
what does it mean? Line 16: Missing radix parameter radix
line 16
const counts = parseInt(JSON.parse(json));
Claudio Restifo
@Marmiz
Mar 19 2018 16:47
@IsaakNazar that's a linter error, copy it on google and see what the linter expects you ti write
(in this case the radix argument of the parseInt method)
Brad
@bradtaniguchi
Mar 19 2018 16:47
@IsaakNazar parseInt requires a second parameter the radix
Claudio Restifo
@Marmiz
Mar 19 2018 16:48
it's also good to search it so you'll learn also the reasoning
Brad
@bradtaniguchi
Mar 19 2018 16:48
"
An integer between 2 and 36 that represents the radix (the base in mathematical numeral systems) of the above mentioned string. Specify 10 for the decimal numeral system commonly used by humans. Always specify this parameter to eliminate reader confusion and to guarantee predictable behavior. Different implementations produce different results when a radix is not specified, usually defaulting the value to 10.
"
Frosty427
@Frosty427
Mar 19 2018 17:17
image.png
guys how would i make the li items goin inside of the hamburger button on mobile
i dont need an animation when opening it
it can just be one click and it falls down
Nazar
@IsaakNazar
Mar 19 2018 17:30
@bradtaniguchi @Marmiz thanx guys, got it :+1:
CamperBot
@camperbot
Mar 19 2018 17:30
isaaknazar sends brownie points to @bradtaniguchi and @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 424 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
:star2: 1187 | @marmiz |http://www.freecodecamp.org/marmiz
Nazar
@IsaakNazar
Mar 19 2018 17:30
@planigan :clap:
Immanuel-john
@Immanuel-john
Mar 19 2018 18:16
hi ..pls help https://codepen.io/ImmanuelJohn/pen/BrKpmJ why <p> element not working
Jason Luboff
@JLuboff
Mar 19 2018 18:32
@Immanuel-john What do you mean? I see the paragraph no problem?
Ken Haduch
@khaduch
Mar 19 2018 18:33
@Immanuel-john - that is working - do you want it to look different?
@Immanuel-john - if you aren't seeing the "jumbotron" - you need to add the bootstrap.css as an External Stylesheet in the CSS config tab. Yeah, that's probably what you are missing... That will shift your navbar because it is inside the "container" element, but it will then start to apply bootstrap classes that you specify in your class attributes
Dardan Demiri
@dardandmr
Mar 19 2018 18:42

Hi everybody, so far I made the RegEx to select if the phone number is valid

But the only problem is testing if it has Opened and Closed ()


function telephoneCheck(str) {

  var reg = /^[\(]?(?:1[\s|\(]*)?\d{3}[-|\s|\)]*?\d{3}[-|\s]*?\d{4}$/;

  return reg.test(str);
}

telephoneCheck("555)-555-5555"); // Should return false but returns true

The regex for testing the opening and closing ()
is this:

 \((?=.*?\))

But when I add it:

^[\((?=.*?\))]?(?:1[\s|\((?=.*?\))]*)?\d{3}[-|\s|\)]*?\d{3}[-|\s]*?\d{4}$

It won't work
Who knows what's the problem here ?

Ken Haduch
@khaduch
Mar 19 2018 18:46
@dardandmr - I took a slightly different route to testing for opened and closed parens - making two expressions, one that has literal parens, and one that doesn't, grouping them and separating them with the | operator.
Michael Grienauer
@mgrienauer
Mar 19 2018 18:46
https://mgrienauer.github.io/local_weather/ i finished my weather app and was looking for some feedback
also wanted others to test it to make sure it works
Dardan Demiri
@dardandmr
Mar 19 2018 18:47
@mgrienauer Works great
Good job
the only thing is spacing
image.png
Ken Haduch
@khaduch
Mar 19 2018 18:48
@mgrienauer - I tried your app - it looks like it put my weather information there, and it looks clean, but perhaps there is an icon size problem as @dardandmr just posted (for some icons) it looks fine for me. One thing that I see when going to a narrower browser viewport is that the page "explodes" into a zoomed-in version of just the weather info - it doesn't look quite as neat as the wider-screen version.
Michael Grienauer
@mgrienauer
Mar 19 2018 18:49
@dardandmr @khaduch thanks guys, yea i wanted the main icon to be a bit larger than the others
CamperBot
@camperbot
Mar 19 2018 18:49
mgrienauer sends brownie points to @dardandmr and @khaduch :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @dardandmr |http://www.freecodecamp.org/dardandmr
:star2: 3804 | @khaduch |http://www.freecodecamp.org/khaduch
Michael Grienauer
@mgrienauer
Mar 19 2018 18:50
@dardandmr are you viewing it on chrome / firefox / safari? that's strange cuz the spacing doesn't show up like that for me
Ken Haduch
@khaduch
Mar 19 2018 18:51
@mgrienauer - I'm using opera on windows, since you're asking Dardan...
Michael Grienauer
@mgrienauer
Mar 19 2018 18:52
@khaduch hmm...i used a media query and readjusted the layout for mobile...it looks ok on my end
though im not using opera
ahhh i see what you're saying about the viewport height
Ken Haduch
@khaduch
Mar 19 2018 18:53
@mgrienauer - I should try it on my phone and see.
Dardan Demiri
@dardandmr
Mar 19 2018 18:53
@mgrienauer Chrome
Ken Haduch
@khaduch
Mar 19 2018 18:56
@mgrienauer - it's not working on my phone but I think that I must have location sharing disabled, and it's not asking me if I want to share location.
I switched to Chrome on my phone and allowed location, so it looks fine there.
Michael Grienauer
@mgrienauer
Mar 19 2018 19:00
@dardandmr @khaduch https://mgrienauer.github.io/local_weather/ ok i added a media query for viewport height, let me know if it works for you guys on a shorter viewport now
if you dont mind :P
Ghost
@ghost~5a4a80acd73408ce4f859755
Mar 19 2018 19:01
@mgrienauer looks great! in all sizes :)
Ken Haduch
@khaduch
Mar 19 2018 19:02
@mgrienauer - I'm still seeing the height go to a full screen height, it just looks strange. This is using a desktop browser window and just narrowing the browser window.
Michael Grienauer
@mgrienauer
Mar 19 2018 19:02
@MuhammedKarim thanks!
CamperBot
@camperbot
Mar 19 2018 19:02
mgrienauer sends brownie points to @muhammedkarim :sparkles: :thumbsup: :sparkles:
:cookie: 179 | @muhammedkarim |http://www.freecodecamp.org/muhammedkarim
Michael Grienauer
@mgrienauer
Mar 19 2018 19:03
@khaduch i mean the media query is that once the viewport width is less than 600px itll snap to fullscreen
Ken Haduch
@khaduch
Mar 19 2018 19:05
@mgrienauer - yes, it does, but I think that it looks a little strange. Here is a screenshot, sorry if it's so huge.
image.png
it just seems like it's not necessary to go to a full-height for the information?
Michael Grienauer
@mgrienauer
Mar 19 2018 19:07
@khaduch ah i see what you mean...my laptop screen isnt that big so it didnt occur to me that it might look weird on a bigger screen
Ken Haduch
@khaduch
Mar 19 2018 19:08
@mgrienauer - yes, you know what the normal view is, but here it is just before it flips to full screen...
image.png
Michael Grienauer
@mgrienauer
Mar 19 2018 19:08
any ideas on how to fix it? the media query was for mobile but not sure how id go about fixing this issue
Ken Haduch
@khaduch
Mar 19 2018 19:14
I'll have to look at the code and see how you have it set up - looks like in your .wrapper you are setting height: 500px;? Then in your reduced width class you have height: 100vh; which makes it take the full height of the viewport. I would say maybe just drop the height? Although it might not be worthwhile - chances are someone will never look at both views unless they are critiquing your site and checking responsive behavior for different viewports? Although I might not have gotten everything, because I can change the height of the .wrapper, but the icons are still spread out on the full height of the screen.
Michael Grienauer
@mgrienauer
Mar 19 2018 19:15
@khaduch yea that's pretty spot-on...i might just leave it as is since, like you said, i doubt too many people will be viewing it in that aspect ratio
@khaduch though thanks alot for the feedback i appreciate it... definitely changing the viewport height display was a good call
CamperBot
@camperbot
Mar 19 2018 19:16
mgrienauer sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
api offline
Liam Docherty
@ldocherty1
Mar 19 2018 19:23
How can I make my navigation not appear on my #home section. However, when the user scrolls down or clicks on the find more button. when the user gets to the 'features-icons' section how can I make my navigation bar appear? https://github.com/ldocherty1/Unit28_Assignment1
<!-- Navigation bar -->
    <nav class="navbar scrolled-nav fixed-top navbar-expand-sm bg-light">
        <a class="navbar-brand" href="#">Front End Web Developer</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-collapse"></button>
        <div class="collapse navbar-collapse" id="navbar-collapse">
            <ul class="nav navbar-nav ml-auto">
                <li class="nav-item active"> <a class="nav-link" href="#home">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link active" href="#features-icons">Expectations</a>
                </li>
                <li class="nav-item active"> <a class="nav-link" href="#testimonials">Testimonials</a>
                </li>
                <li class="nav-item"> <a class="nav-link" href="#about">About</a>
                </li>
                <li class="nav-item"> <a class="nav-link" href="#portfolio">Portfolio</a>
                </li>
                <li class="nav-item"> <a class="nav-link" href="#about">Design</a>
                </li>
                <li class="nav-item"> <a class="nav-link" href="#contact">Contact</a>
                </li>
            </ul>
        </div>
    </nav>
kerafyrm02
@kerafyrm02
Mar 19 2018 19:27
.navbar {
   display: none;
}
$("#learn_more").on("click", function(){
    $(".navbar").toggle();
});
Liam Docherty
@ldocherty1
Mar 19 2018 19:34
@kerafyrm02 Doesn't seem to be working?
kerafyrm02
@kerafyrm02
Mar 19 2018 19:37
$("body, html").on("scroll", function(){
      var features_top = $("#features-icon").position().top;
      var top_of_window = $(window).scrollTop();
      if (top_of_window >= features_top){
         $(".navbar").show();
      }
      else {
         $(".navbar").hide();
      }
});
do you have a page up
im at work lol
you cant just copy paste that on click event-- you have to name it the same as your learn more buttton
Liam Docherty
@ldocherty1
Mar 19 2018 19:40
@kerafyrm02 Thanks
CamperBot
@camperbot
Mar 19 2018 19:40
ldocherty1 sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 285 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
Dardan Demiri
@dardandmr
Mar 19 2018 19:43
@mgrienauer Still the same View with no spacing
You should better use a grid system like Bootstrap's grid...
It will then show in every browser same
Ken Haduch
@khaduch
Mar 19 2018 20:29
@dardandmr - :point_up: March 19, 2018 2:42 PM - if you are still looking for an answer for your regexp, I was just looking at it and I think that if your expression for testing the parens works, then a possible problem is that first set of square brackets around that part of the expression, which makes that into a character grouping for the match? Although I haven't looked at that in detail. Maybe I'm just not familiar with the operators that you are using, if there is look-ahead or some other technique involved. I went a slightly different route and made that matching for parens or no parens a little simpler (at least in my mind it's simpler...)
Donnie
@Donnie-D
Mar 19 2018 23:44
Has anyone used the weather underground api for their weather application?
or is there any better option?
Teejay Parker
@TeejayParker
Mar 19 2018 23:47
Anyone know why this wouldn't work?
function playVideo() {

    var video = document.getElementById('contactVideo');

    document.addEventListener('DOMContentLoaded', enableAutoplay);

    function enableAutoplay() {
        video.autoplay = true;
        video.load();
    }

}
Dardan Demiri
@dardandmr
Mar 19 2018 23:50
@khaduch Thank you, but I have finished that challenge
CamperBot
@camperbot
Mar 19 2018 23:50
dardandmr sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3805 | @khaduch |http://www.freecodecamp.org/khaduch
Dardan Demiri
@dardandmr
Mar 19 2018 23:50
;)