These are chat archives for FreeCodeCamp/HelpFrontEnd

22nd
Aug 2017
Gulsvi
@gulsvi
Aug 22 2017 00:03
@aguyinmontreal That does not look valid - do you see it functioning somewhere?
iso
@iso1048
Aug 22 2017 00:06
@SkyC0der it does work though.
Emil
@aguyinmontreal
Aug 22 2017 00:08
@SkyC0der @gothamknight you're both correct, it's a valid Jquery-UI function, but an invalid Jquery function...
thanks @gothamknight
CamperBot
@camperbot
Aug 22 2017 00:08
aguyinmontreal sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @gothamknight |http://www.freecodecamp.com/gothamknight
Pagnito
@Pagnito
Aug 22 2017 00:09

@SkyC0der hey i was trying to put the codepen together, but the api request seems to fail on codepen

var accountLink = 'https://www.freecodecamp.org/'+leader.username;

  <a className="link" target="_blank" href={accountLink}

thats what i did tho

@SkyC0der is it bad to make a bunch of repositories that can have a http address?
makig them a site or w/e
Gulsvi
@gulsvi
Aug 22 2017 00:11
Don't put any banking apps up on http :) @Pagnito
It's probably fine though
I think Google might penalize you for no https
Pagnito
@Pagnito
Aug 22 2017 00:15
penalize for no http? i dont get it?
korzo
@korzo
Aug 22 2017 00:17
@Pagnito https is one of the ranking signals
Pagnito
@Pagnito
Aug 22 2017 00:17
@korzo whats that?
korzo
@korzo
Aug 22 2017 00:20
@Pagnito Google use "signals" (like # of backlinks, domain authority, social shares...) to determine order of results at SERP and one of the signals is secure connection
Pagnito
@Pagnito
Aug 22 2017 00:22
@korzo oh ok thanks
CamperBot
@camperbot
Aug 22 2017 00:22
pagnito sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 400 | @korzo |http://www.freecodecamp.com/korzo
Pagnito
@Pagnito
Aug 22 2017 00:22
@SkyC0der i was actually talking about something else tho i dunno how to explain, u know how i made my github potfolio a site? i want to do the same with my other projects, make them into viewable projects
Gulsvi
@gulsvi
Aug 22 2017 00:25
@Pagnito Yeah, I understood, but since you're using a custom domain, you can't use HTTPS
So, all of your github pages projects will be served over HTTP
Pagnito
@Pagnito
Aug 22 2017 00:25
@SkyC0der ah i see
Gulsvi
@gulsvi
Aug 22 2017 00:26
Which is fine, if you don't mind a google penalty and don't want to host sensitive data
Pagnito
@Pagnito
Aug 22 2017 00:26
@SkyC0der what about my current portfolio, if i go to pavelyeganov.com, i want the link to turn into https
@SkyC0der whats the penalty?
Gulsvi
@gulsvi
Aug 22 2017 00:26
@Pagnito Korzo just explained it above
Every site gets a rank, yours will rank lower in search results if you don't have HTTPS
Pagnito
@Pagnito
Aug 22 2017 00:27
i see
yea that dont really matter as far as my projects go
but yea i noticed my portfolio isnt over https, how do i make it over https
Gulsvi
@gulsvi
Aug 22 2017 00:28
There are some hacks, but I don't know much about them. Github's official stance is that you can't.
If you use a custom domain, no HTTPS for you
Pagnito
@Pagnito
Aug 22 2017 00:28
oh wtf
Gulsvi
@gulsvi
Aug 22 2017 00:28
isaacs/github#156
Pagnito
@Pagnito
Aug 22 2017 00:32
im confused why everyone has https, but github doesnt support it for custom domains
korzo
@korzo
Aug 22 2017 00:33
skowksowksowsk.png
@Pagnito @SkyC0der Here is impact of turning SSL on position at SERP. It's old site, no other changes, no new content...
Pagnito
@Pagnito
Aug 22 2017 00:33
and that articel says its ssl isnt possible with custom domains?
aRtoo
@artoodeeto
Aug 22 2017 00:33
for this problem do you really need recursion?

function steamrollArray(arr) {
  // I'm a steamroller, baby
  return arr;
}

steamrollArray([1, [2], [3, [[4]]]]);
korzo
@korzo
Aug 22 2017 00:38
@artoodeeto Otherwise you'll be duplicating functionality
aRtoo
@artoodeeto
Aug 22 2017 00:39
@korzo what bro?
CuttureSync
@culturesync
Aug 22 2017 00:45
now all my content is smased together
:(
korzo
@korzo
Aug 22 2017 00:49
@artoodeeto you loop over arr. If current element is array, you have to start new loop.
without the recursion you would need to write the same code for every possible depth of arrays
aRtoo
@artoodeeto
Aug 22 2017 00:50
@korzo damn so it will be long without recursion
CuttureSync
@culturesync
Aug 22 2017 00:50

``` <div class="container">

<div class="content home">
  <div class="row ">
    <div class="col-4 ">
      <h1> The City </h1>
      <p> <Lorem ipsum dolor
      </p>
    </div>
    <div class="col-8">
      <h1>Slider Here</h1>
    </div>
  </div>
</div>

    <div class="content about">
  ABOUT US <br>
  Lorem ipsum
</div>

</div>```

korzo
@korzo
Aug 22 2017 00:51
@artoodeeto considering depth of array could be "infinite".. Yes :)
aRtoo
@artoodeeto
Aug 22 2017 00:55
@korzo aight. im just going to copy. then study it
Burak
@BurakAy
Aug 22 2017 00:56
@culturesync if you're still working on that effect I fixed the site
if you want to check it out again
basically just toggling a class
CuttureSync
@culturesync
Aug 22 2017 01:02
ok
nice
Burak
@BurakAy
Aug 22 2017 01:03
so add a class for example to a div surrounding the content you want to slide
<body>
     <div id="main" class="slideRight">
            [page content[
     </div>

     <script>
          $("a").toggleClass("slideRight")
     </script>
</body>
oops
CuttureSync
@culturesync
Aug 22 2017 01:03
That looks good
Burak
@BurakAy
Aug 22 2017 01:04
$("a").click(funtion() {
     $("main").toggleClass("slideRight")
});
and then create an effect in your css for the class for example .slideRight
everytime that class is toggled the effect from your css is applied
Brandon Carlino
@bacarlino
Aug 22 2017 01:11
Hi guys, I'm revisiting my Simon project. I'm using simple HTML audio via the JavaScript API to create the audio element and setting the HTMLAudioElement.currentTime directly in order to control my audiosprite file for playing the audio when clicking the buttons. This always worked in all browsers tested, but all of a sudden it is no longer working when first opening in Chrome (still working in other test browsers - Safari on iOS and Firefox specifically). If I refresh the browser in chrome though, it will work as expected. It will actually continue to work even in a new tab unless I clear the cache. Obviously this won't work because a new user wouldn't have the audio cached. Does anybody have experience with this issue? Through troubleshooting, I've concluded that while the issue is happening, currentTime just simply can't be assigned. The file will play, so it works, but always from the very beginning. Again, I can refresh Chrome, and the currentTime will then be assigned the seek time as expected and the app works fine. Thoughts?
Just in case - did not mean any offense by addressing the group as "guys"... sorry ladies!
Long Nguyen
@longnt80
Aug 22 2017 01:16
@bacarlino do you have the code to view?
Brandon Carlino
@bacarlino
Aug 22 2017 01:24
The following code is inside of an audio initialization function:
'''
sounds.soundEffects = new Audio('/static/react/audio/padsounds.mp3');
sounds.soundEffects.play();
sounds.soundEffects.addEventListener('timeupdate', function () {
if (sounds.soundEffects.currentTime >= sounds.stopTime) {
sounds.soundEffects.pause();
}
'''
CamperBot
@camperbot
Aug 22 2017 01:24
:bulb: to format code use backticks! ``` more info
Brandon Carlino
@bacarlino
Aug 22 2017 01:25
Haha...
I clearly am new to the chats....
I'll try that again with the next snippet...
Gulsvi
@gulsvi
Aug 22 2017 01:25
@bacarlino Is it specific to your simon game? In my Chrome browser, none of the simon games that use those mp3 files make any noise. A codec issue I haven't figured out yet.
Brandon Carlino
@bacarlino
Aug 22 2017 01:26
This code is inside of the function that activates the audio when pressed...
sounds.stopTime = sounds[this.props.id].start + sounds[this.props.id].length;
sounds.soundEffects.currentTime = sounds[this.props.id].start;
sounds.soundEffects.play();
@SkyC0der I haven't not experimented with HTML Audio outside of my Simon game, so I can't say...
Gulsvi
@gulsvi
Aug 22 2017 01:27
@bacarlino Go to https://codepen.io and search for Simon. Try some others.
Burak
@BurakAy
Aug 22 2017 01:28
here's mine if you want to check it out https://codepen.io/BurakAy/pen/KvVWPV
Gulsvi
@gulsvi
Aug 22 2017 01:28
Yeah, that's silent for me too in my Chrome browser
It's an audio codec issue
Burak
@BurakAy
Aug 22 2017 01:29
it's working in my Chrome
on the codepen site
Gulsvi
@gulsvi
Aug 22 2017 01:30
Many of them used to work for me too in my Chrome browser, but then suddenly stopped working
Burak
@BurakAy
Aug 22 2017 01:31
interesting
Daniel
@DanJP2016
Aug 22 2017 01:32
i always get problems running sound files in chrome unless i'm running a server, if your developing locally maybe try running node lite-server or python server
Brandon Carlino
@bacarlino
Aug 22 2017 01:37
Running it through Django development server
But the result is the same off of Heroku
I may have to scrap it and take a different approach... but since it works in other browsers (and even used to be fine in chrome!) it just really has me scratching my head
Chrome just isn't loading the audio it seems. I think I need to find a solution to force it. Strange it works just fine after refreshing.
Feel free to check it out here! But please ignore the ugly portfolio... I've neglected it and it's not in a shareable state... https://brandoncarlino.herokuapp.com/portfolio/react/simon
Burak
@BurakAy
Aug 22 2017 01:44
i just used in in chrome
sound was working fine
at first there was a slight delay but read the bottom of your page about refreshing
Brandon Carlino
@bacarlino
Aug 22 2017 01:45
Interesting... I experience the issue in Chrome on my laptop, desktop, iPhone, and wife's Samsung
yeah, it'll work after a refresh... that's the thing
Burak
@BurakAy
Aug 22 2017 01:45
very odd because i've had no problems with audio at all
first time i'm hearing about it
Daniel
@DanJP2016
Aug 22 2017 01:46
if i'm understanding the code right, it's not grabbing the sound files until the game starts right?
Brandon Carlino
@bacarlino
Aug 22 2017 01:46
I'm using the ON/OFF button to initiate the audio.... If I recall (been a while since I did the project), this was to properly initiate the audio on mobile devices where user input is required
Pagnito
@Pagnito
Aug 22 2017 01:56
@SkyC0der yo
Gulsvi
@gulsvi
Aug 22 2017 01:58
Yo @Pagnito
Pagnito
@Pagnito
Aug 22 2017 01:58
@SkyC0der u ever play mobile games?
Gulsvi
@gulsvi
Aug 22 2017 01:58
Yeah
Pagnito
@Pagnito
Aug 22 2017 01:59
dude i always wanted to ind the perfect mobile game to play whenver the moment comes
and for years
i have been dissapointed
or my phone couldnt support it
Brandon Carlino
@bacarlino
Aug 22 2017 01:59
Golf Clash has me hooked as hell.... just saying...
Pagnito
@Pagnito
Aug 22 2017 01:59
but today is not that day
Brandon Carlino
@bacarlino
Aug 22 2017 01:59
:-D
Pagnito
@Pagnito
Aug 22 2017 01:59
i found traffic rider
Gulsvi
@gulsvi
Aug 22 2017 01:59
Kitty Fashion Day is awesome /s
:p
Pagnito
@Pagnito
Aug 22 2017 01:59
and war wings
Gulsvi
@gulsvi
Aug 22 2017 02:00
I play star wars games - Galaxy of Heroes, and Star Wars Commander
Pagnito
@Pagnito
Aug 22 2017 02:00
hold on ima look em up
dude there was a time when world of warcraft was on mobile
it was called order and chaos
i loved that shit
tho my phone was really hot when i played it
Gulsvi
@gulsvi
Aug 22 2017 02:00
I've never played wow, but I'm sure I'd be hooked
love Fallout, Skyrim, Assassin's Creed
Pagnito
@Pagnito
Aug 22 2017 02:01
assasins creed on mobile?
Gulsvi
@gulsvi
Aug 22 2017 02:01
No, xbox
Pagnito
@Pagnito
Aug 22 2017 02:01
oh
yea i loved assasis creed when i used to play it on my roommates xbox
Gulsvi
@gulsvi
Aug 22 2017 02:02
Black Flag was awesome
Pagnito
@Pagnito
Aug 22 2017 02:03
yea it was, it was one of the ones i played
have u watched the movie?
Gulsvi
@gulsvi
Aug 22 2017 02:04
No, haven't seen it
Pagnito
@Pagnito
Aug 22 2017 02:04
the actual movie not the fan made one
Daniel
@DanJP2016
Aug 22 2017 02:08
@bacarlino two solutions you could try would be to set a preload on the audio element to grab the audio files when the app loads, this is often ignored on mobile apps anyways, or create the sounds straight from the web audio api.
Bryce
@BGarbs
Aug 22 2017 02:13
Anyone in here right now?
Gulsvi
@gulsvi
Aug 22 2017 02:15
Yes
always :)
Brandon Carlino
@bacarlino
Aug 22 2017 02:15
@DanJP2016 Wow, that's exactly what I was trying! Just popped back on here to say I think I've fixed it!
Bryce
@BGarbs
Aug 22 2017 02:15
@SkyC0der well sometimes it's completely dormant
@bacarlino @SkyC0der either of you done worked through the JS projects?
ie., random quote generator
Gulsvi
@gulsvi
Aug 22 2017 02:16
Yeah, I made one based off of BS4 cards like you were trying earlier
Brandon Carlino
@bacarlino
Aug 22 2017 02:16
I have some more testing to do on it... but wow... I have way too much time wrapped in this old project of mine...
@BGarbs I got the front end cert a few months back... haven't really touched much on FCC since
Bryce
@BGarbs
Aug 22 2017 02:17
@bacarlino man I long for that day! haha Congrats! Any chance you have a moment to help a n00b?
Brandon Carlino
@bacarlino
Aug 22 2017 02:18
I think I'm still a newb myself haha, but I could try. Might be hitting the sack soon, but I'm sure there are others here that can help too
Alex
@cyberpunk1971
Aug 22 2017 02:19
hello all
Brandon Carlino
@bacarlino
Aug 22 2017 02:19
I admit, when I did the random quote generator, at the time I didn't realize I was supposed to be using an API and I had hardcoded my quotes lol... I never revisited it to fix it.
Alex
@cyberpunk1971
Aug 22 2017 02:19
anyone here familiar with github
?
Bryce
@BGarbs
Aug 22 2017 02:19
@cyberpunk1971 hey there
@cyberpunk1971 I am ish
Bryce
@BGarbs
Aug 22 2017 02:20
@bacarlino dude, that's exactly how I did it the first time. I think I hard-coded like 4-5 quotes and just cycled through them. But that was SOOO long ago
Brandon Carlino
@bacarlino
Aug 22 2017 02:20
@cyberpunk1971 Whatcha need?
Alex
@cyberpunk1971
Aug 22 2017 02:20
@BGarbs i'm trying to push files from my cpu to github repository but keep getting publickey errors
Bryce
@BGarbs
Aug 22 2017 02:20
@cyberpunk1971 what error?
@SkyC0der is that hard-coded quotes or an actual API?
Brandon Carlino
@bacarlino
Aug 22 2017 02:21
From the command line?
Gulsvi
@gulsvi
Aug 22 2017 02:21
It's an API
Alex
@cyberpunk1971
Aug 22 2017 02:21

$ git push origin master
Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

Bryce
@BGarbs
Aug 22 2017 02:21
@SkyC0der teach me your ways, wise one
Alex
@cyberpunk1971
Aug 22 2017 02:21
@bacarlino yes from command line
Gulsvi
@gulsvi
Aug 22 2017 02:21
This API has sample code @BGarbs https://quotesondesign.com/api-v4-0/
But if you have a specific question, I can maybe answer better
Alex
@cyberpunk1971
Aug 22 2017 02:22
i'm not using ssh
Brandon Carlino
@bacarlino
Aug 22 2017 02:22
when you "git remote -v" does it look correct?
Alex
@cyberpunk1971
Aug 22 2017 02:22
yeah, it shows the repository
Brandon Carlino
@bacarlino
Aug 22 2017 02:22
I'm not that familiar with the error... so i'm just guessing really
Alex
@cyberpunk1971
Aug 22 2017 02:22
i read the article
Brandon Carlino
@bacarlino
Aug 22 2017 02:23
and you're pushing with 'git push origin <branch-name>'?
Alex
@cyberpunk1971
Aug 22 2017 02:23
and tried with https but it still won't push it

overmind@overmind-PC MINGW64 ~/Desktop/projects/love-of-travel (master)
$ git push origin master
Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

Gulsvi
@gulsvi
Aug 22 2017 02:23
This one uses the Quotes on Design API: https://codepen.io/skycoder/pen/eROEqx?editors=0011
Kyle Janka
@EverythingEpi
Aug 22 2017 02:24
hello, was wondering if anyone could help me stop my hamburger icon (on mobile side) from scrolling to the landing page on click. I have the href set to "#" not sure what else to put it as to stop it from scrolling up. I don't want it to scroll at all. https://codepen.io/Everything_Epi/pen/eEeyRz
Bryce
@BGarbs
Aug 22 2017 02:26
@EverythingEpi hey there! Not sure what you're experiencing. I tried the icon and seemed to work????
Gulsvi
@gulsvi
Aug 22 2017 02:26
@EverythingEpi You could change it to a <span> element with cursor: pointer in your CSS:
<span id="menu-icon" style="cursor:pointer"></span>
Kyle Janka
@EverythingEpi
Aug 22 2017 02:27
@BGarbs the icon works, but I don't want it to take me to the top of the webpage on click
let me give the span a whirl
Bryce
@BGarbs
Aug 22 2017 02:27

@EverythingEpi or just remove the

href="#"

portion of the anchor tag

Kyle Janka
@EverythingEpi
Aug 22 2017 02:28
Oh I didn't even know you could do that haha!
That worked @BGarbs thanks
CamperBot
@camperbot
Aug 22 2017 02:28
everythingepi sends brownie points to @bgarbs :sparkles: :thumbsup: :sparkles:
:cookie: 178 | @bgarbs |http://www.freecodecamp.com/bgarbs
Kyle Janka
@EverythingEpi
Aug 22 2017 02:28
@SkyC0der thanks as well
Gulsvi
@gulsvi
Aug 22 2017 02:29
Removing href="#" makes it so you don't get a pointer cursor any more
Bryce
@BGarbs
Aug 22 2017 02:29
@EverythingEpi you bet. Check this for some additional info...https://stackoverflow.com/questions/5292343/is-an-anchor-tag-without-the-href-attribute-safe
Gulsvi
@gulsvi
Aug 22 2017 02:29
another option is : <a href="#" id="menu-icon" onclick="event.preventDefault()"></a>
Kyle Janka
@EverythingEpi
Aug 22 2017 02:30
Thanks a lot! That worked perfectly
Bryce
@BGarbs
Aug 22 2017 02:30
@EverythingEpi :thumbsup:
@EverythingEpi when did you start here at FCC?
Kyle Janka
@EverythingEpi
Aug 22 2017 02:31
Is that JS sky? or jQuery? I probably would of figured that out eventually, I just been working on portfolio for a bit
Gulsvi
@gulsvi
Aug 22 2017 02:31
And another good one lol (lots of solutions!): <a href="#!" id="menu-icon"></a>
Bryce
@BGarbs
Aug 22 2017 02:31
@EverythingEpi and what do you current do as your day job? Saw your portfolio page. Seems like we are in a similar boat!
Kyle Janka
@EverythingEpi
Aug 22 2017 02:31
back in May. But took about 5 months off. Been just getting back to it
Bryce
@BGarbs
Aug 22 2017 02:31
@EverythingEpi nice
Gulsvi
@gulsvi
Aug 22 2017 02:31
That is vanilla javascript @EverythingEpi preventDefault()
Kyle Janka
@EverythingEpi
Aug 22 2017 02:31
I work in a Marketing field.
Bryce
@BGarbs
Aug 22 2017 02:31
@EverythingEpi likewise!
Kyle Janka
@EverythingEpi
Aug 22 2017 02:32
That's what I thought sky. I got into JS last time I went through and then took a break, so I decided to start from the beginning. Haven't start JS again yet
I should probably move past, the portfolio and start working on the JS, but I really want to have even a foundation done so I feel like I completed something haha.
Bryce
@BGarbs
Aug 22 2017 02:34

@EverythingEpi I gotcha and completely agree. Well keep up the great work. I'm working toward that full-time web-dev job too (as many I'm sure).

Btw, anyone know (with legit experience) what the industry going rate is for a full-time web developer?

Gulsvi
@gulsvi
Aug 22 2017 02:34
I procrastinated a long time on my Portfolio
It was way too hard for me when I first got to it, so I did all the other projects and came back to it later
Daniel
@DanJP2016
Aug 22 2017 02:34
thats what im doing lol
i made one but I don't like it lol
Kyle Janka
@EverythingEpi
Aug 22 2017 02:35
Ever since I came and restarted the course, I found it surprisingly easier on the responsive side and styling.
I decided to do the portfolio as I went through the lessons
Bryce
@BGarbs
Aug 22 2017 02:35
@SkyC0der @DanJP2016 yeah, it's just to get a handle on structure and order I think
Kyle Janka
@EverythingEpi
Aug 22 2017 02:36
I was so happy I recently figured out @mediaQueries that made my life 10x easier for responsive side
Bryce
@BGarbs
Aug 22 2017 02:37
@EverythingEpi oh definitely - they should be "baked in" to frameworks like Bootstrap though, yeah?
@EverythingEpi of course you could come up with your own, but why re-invent the wheel
Kyle Janka
@EverythingEpi
Aug 22 2017 02:37
Oh yeah, I mean I start with bootstraps and then use @mediaqueries to clean things up
Brandon Carlino
@bacarlino
Aug 22 2017 02:38
Just a follow up for those that were with me - my Simon audio works!
Kyle Janka
@EverythingEpi
Aug 22 2017 02:38
Thanks again everyone, you all have a wonderful night/day!
Daniel
@DanJP2016
Aug 22 2017 02:39
@bacarlino awesome
Bryce
@BGarbs
Aug 22 2017 02:39
@EverythingEpi you do the same! good luck and keep coding
Gulsvi
@gulsvi
Aug 22 2017 02:39
Congrats @bacarlino :confetti_ball:
Brandon Carlino
@bacarlino
Aug 22 2017 02:42
The solution was as you said. I created the Audio element earlier in the code, but kept the mobile 'initialiation' code tied to the on/off button. Works everywhere I've test it so far.
@DanJP2016
Daniel
@DanJP2016
Aug 22 2017 02:42
quick question, the new class feature in javascript is just a way of writing object constructors so the prototype can be extended without have to reset the constructor for the new object? does that make sense lol
Gaurav
@gauravmagan
Aug 22 2017 02:44
@SkyC0der how the user can be authenticated by clicking the email
so that he is the right user
Daniel
@DanJP2016
Aug 22 2017 02:45
@bacarlino nice. I got into web development to build a app to better organize all my pdf files and videos into an app I could watch or read in the browser. had all kinds of weird sound problems with it, that can be tricky with the audio setup.
Gaurav
@gauravmagan
Aug 22 2017 02:46
when the user registers and a cinfirmation link is sent to them and the link i need a confirmation setupp so that the user gets authenticated if and only if he clicks the link
Gulsvi
@gulsvi
Aug 22 2017 02:46
@gauravmagan I'm not really sure - server-side code though for sure
I'm guessing you'd send them a link with a secret key, when they click the link, your server checks the key and compares it with what is expected in your database
Long Nguyen
@longnt80
Aug 22 2017 02:47

@DanJP2016

the new class feature in javascript is just a way of writing object constructors so the prototype can be extended without have to reset the constructor for the new object?

it is just a new way to write, syntactic sugar

Daniel
@DanJP2016
Aug 22 2017 02:51
@longnt80 thanks, I think I understand. nothing special happening under the hood, just makes it cleaner to write?
CamperBot
@camperbot
Aug 22 2017 02:51
danjp2016 sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 526 | @longnt80 |http://www.freecodecamp.com/longnt80
Brandon Carlino
@bacarlino
Aug 22 2017 02:51
@DanJP2016 Through all the research and troubleshooting - I saw there is a Web Audio API - a technology I haven't dove into just yet. But it looks to be a much more advanced way of handling audio on the web.
Not going down that road just yet...
Long Nguyen
@longnt80
Aug 22 2017 02:52
@DanJP2016 I don't know if it is cleaner, maybe just a way to attract developers from other languages
I haven't used it extensively so I can't tell you more
Daniel
@DanJP2016
Aug 22 2017 02:54
@bacarlino the web audio api is pretty cool stuff, should definitely check it out.
Long Nguyen
@longnt80
Aug 22 2017 02:55
@bacarlino browser support is still pretty bad for Web Audio API though
Daniel
@DanJP2016
Aug 22 2017 02:56
@longnt80 ah I see. I'm working my way through secrets of the javascript ninja ver2 and I'm at the chapters on object-oriented programming. I was wondering if the class was there to prevent needing to reset the constructor when setting up prototype chains.
Long Nguyen
@longnt80
Aug 22 2017 02:56
if you're into audio then definitely check it out, it is very cool
Brandon Carlino
@bacarlino
Aug 22 2017 02:57
@longnt80 Thanks for the heads up! I'll wait until the day I take on a project requiring it :-)
CamperBot
@camperbot
Aug 22 2017 02:57
bacarlino sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 527 | @longnt80 |http://www.freecodecamp.com/longnt80
Brandon Carlino
@bacarlino
Aug 22 2017 02:57
As for now, I'm gonna let my Simon game sit as is....
I'm finally getting around to cleaning up some of these old projects...
Long Nguyen
@longnt80
Aug 22 2017 03:01
@bacarlino here's a library to work with the Web Audio API: https://alemangui.github.io/pizzicato/
it is said to make it much easier
Brandon Carlino
@bacarlino
Aug 22 2017 03:03
@longnt80 Thanks! Bookmarked.
CamperBot
@camperbot
Aug 22 2017 03:03
bacarlino sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:warning: bacarlino already gave longnt80 points
Lallo Vigil
@lalov1
Aug 22 2017 03:30
I'm really close finishing up my Simon project. Would anyone be able to help? https://codepen.io/lalov1/pen/MvgvxY
Pagnito
@Pagnito
Aug 22 2017 03:35
whats D3?
Lallo Vigil
@lalov1
Aug 22 2017 03:39
@Pagnito It's a JavaScript framework for displaying data
Pagnito
@Pagnito
Aug 22 2017 03:39
@lalov1 k thanks
CamperBot
@camperbot
Aug 22 2017 03:39
pagnito sends brownie points to @lalov1 :sparkles: :thumbsup: :sparkles:
:cookie: 392 | @lalov1 |http://www.freecodecamp.com/lalov1
Lallo Vigil
@lalov1
Aug 22 2017 03:39
CuttureSync
@culturesync
Aug 22 2017 03:42

Hello again :sparkles: I am coming back with another bug to fix. This time it's the pages. All of my slide pages are siblings to the parent of 'container'
However when the mark up translates to the browser the siblings are all stacked on top of each other rather than as their intended separate content page slides.
HTML

<div class="container"> 
    <div class="content home">
      <div class="row">
        <div class="col-4 ">
          <h1> The City </h1>
        </div>
        <div class="col-8">
          <h1>Slider Here</h1>
        </div>
      </div>
    </div>
    <div class="content about">
      ABOUT US
    </div>
    <div class="content donate">
      DONATE HERE
    </div>
    <div class="content privacy">
      PRIVACY POLICY
    </div>
  </div>

CSS

.container {
  background-color: rgba(43, 43, 43, 0.8);
  margin: 0 4%;
  padding: 0 0;
  border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.44);
  transform: translateX(0);
  transition: transform 700ms cubic-bezier(.58,-0.4,.36,1.24);
}
.content {
  margin: 0 auto;
  padding: 1% 2%;
  transform: translateX(100%); 
  transition: transform 1s cubic-bezier(.58,-0.4,.36,1.24) 400ms;
  overflow-x: hidden;
}
.is_visible {
  transform: translateX(0);
}
.home_is_visible .home, .about_is_visible .about, .donate_is_visible .donate .privacy_is_visible .privacy{
  z-index: 5000;
}
/* end of page selectors for off-canvas page slides */
oh :poop: sorry guys...I just became annoyingwith that huge code post
Gulsvi
@gulsvi
Aug 22 2017 03:53
D3 = Data Driven Documents @Pagnito https://d3js.org/
Though I'm guessing you searched for that and still don't quite understand
Pagnito
@Pagnito
Aug 22 2017 03:53
@SkyC0der thanks
CamperBot
@camperbot
Aug 22 2017 03:53
pagnito sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2527 | @skyc0der |http://www.freecodecamp.com/skyc0der
iso
@iso1048
Aug 22 2017 03:55
@SkyC0der react vs angular?
Gulsvi
@gulsvi
Aug 22 2017 03:55
@gothamknight Yes
:smirk:
Learn one, and you'll figure out the other if you ever need a job that uses it
iso
@iso1048
Aug 22 2017 03:57
@SkyC0der I read this post on medium about react not being ideal if you want to do a start up - did you see that post?
Gulsvi
@gulsvi
Aug 22 2017 03:57
@gothamknight Yeah, I've heard a lot of concern about the react license
some companies won't touch react as a result
But Google and Microsoft use it...maybe they are more confident with their big teams of lawyers
iso
@iso1048
Aug 22 2017 03:59
yeah true. the negativity bias draws me to learning angular haha
Pagnito
@Pagnito
Aug 22 2017 03:59
@SkyC0der ya i did search it, tho im still not there yet, so i didnt look into much, i got that its a framework to help visualize data, for now im satsified knowing that much till i get to those projects
Gulsvi
@gulsvi
Aug 22 2017 03:59
charts, maps, stuff like that
@Pagnito Look at all the cool stuff you can do with it: https://codepen.io/search/pens/?q=d3&limit=all&type=type-pens
Pagnito
@Pagnito
Aug 22 2017 04:01
im guessing it can be really good to build complex interfaces
iso
@iso1048
Aug 22 2017 04:01
@Pagnito the website says it is a library...
Pagnito
@Pagnito
Aug 22 2017 04:02
@gothamknight yea i dunno lol ppl always confuse the two
and i dont know enought to just glance at something and determine what it is
this one looks nice
Gulsvi
@gulsvi
Aug 22 2017 04:04
That's awesome
Pagnito
@Pagnito
Aug 22 2017 04:05
ya
have u seen some of the open source projects at the end of the map
Gulsvi
@gulsvi
Aug 22 2017 04:07
No, I haven't looked at them
CuttureSync
@culturesync
Aug 22 2017 04:09
GTG
Pagnito
@Pagnito
Aug 22 2017 04:09
@SkyC0der they have one called mail for good
when i looked at the package.json, my jaw dropped lol
Burak
@BurakAy
Aug 22 2017 04:10
@culturesync you can try adding a position: absolute
to each section
in the css
Pagnito
@Pagnito
Aug 22 2017 04:10
i wonder how learning python is gonna be when i get to that, my brother says that python has versions of itself for diffirent purposes so u dont have to worry about all the bullshit we worry about with node
i mean im starting to love node but sometimes i hate it lol
i like the original FCC coding environment UI
Lallo Vigil
@lalov1
Aug 22 2017 04:33
I've been stuck on the Simon project for a week. Could someone please help? I'm trying to get the check to work and I can't get that. Also, I have a problem when it is the same button twice. https://codepen.io/lalov1/pen/MvgvxY
Rajat
@rajataudichya
Aug 22 2017 05:27
Hello guys, I want to connect my portfolio page i made using code pen to my EMail can I do it just by JS?
iso
@iso1048
Aug 22 2017 05:38
@rajataudichya don't think so. try this though: https://formspree.io/
vínαч puppαl
@vinaypuppal
Aug 22 2017 05:40
@rajataudichya You can have a Contact me link and when clicked it can open users email client with your email pre-filled. In this http://htmlreference.io/element/a/ under href section check this part href="mailto:alex@smith.com" and <a href="mailto:alex@smith.com">Contact me</a>.
Rajat
@rajataudichya
Aug 22 2017 05:45
I have created an enquiry form
So I want the content of that enquiry form, I researched on the web that you require php for that but as I am just on the portfolio challenge I have not yet learnt php
@gothamknight beautiful ! Thank you so much
CamperBot
@camperbot
Aug 22 2017 05:47
rajataudichya sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 387 | @gothamknight |http://www.freecodecamp.com/gothamknight
BuntyBru
@BuntyBru
Aug 22 2017 07:24
Hi all
I have implemented the Random Quote Generator But I do not have any idea on how to create the "Twitter" button
heroiczero
@heroiczero
Aug 22 2017 07:29
@BuntyBru use https://dev.twitter.com/web/tweet-button documentation

@BuntyBru

<a class="twitter-share-button"
  href="https://twitter.com/intent/tweet?text=Hello%20world">
Tweet</a>

the text component is what you are looking for

BuntyBru
@BuntyBru
Aug 22 2017 07:41
@heroiczero
Will have to add it under eventListener right?
eventlistener in JS
heroiczero
@heroiczero
Aug 22 2017 07:44
@BuntyBru you need a target="_blank" to open it in a new page for your <a href="" target="_blank">
BuntyBru
@BuntyBru
Aug 22 2017 07:46
have already done that in HTML
heroiczero
@heroiczero
Aug 22 2017 07:47

@BuntyBru personally i would add it

$("#quotes").html(a[0].content + "<p>&mdash; " + a[0].title + "</p>")

in the content something like "<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text="+a[0].content + " target=\"_blank\">" because $.getJSON is async

BuntyBru
@BuntyBru
Aug 22 2017 07:47
Now thinking about the implementation in JS
so that upon clicking the Tweet button our job is done
heroiczero
@heroiczero
Aug 22 2017 07:59
yeah pretty much but you need to include the text of the quote when you click it
CuttureSync
@culturesync
Aug 22 2017 08:02
@BurakAy i was thinking have the .container as relative and the content as absolute
heroiczero
@heroiczero
Aug 22 2017 08:04
@culturesync if you are using bootstrap. It may get overridden by Bootstrap.css
CuttureSync
@culturesync
Aug 22 2017 08:07
I'm using a css grid on my code pen
I added bootstraps font awesome to the meta
@heroiczero I'm attemting to separate the slide pages, however right now when I click each of the Nav menu links they all switch but they are still stacked in the container
https://codepen.io/culturesync/pen/brMwgo
i'm thinking I have to have a separate style for each of the .home . about . donate .privacy sections
either that or figure out how to modify to add a third class to buffer between the container and the content classes
heroiczero
@heroiczero
Aug 22 2017 08:12
@culturesync are you trying to use JS or just pure CSS
CuttureSync
@culturesync
Aug 22 2017 08:12
I'm using both
i'm using the css to animate the sliding effect and the JS as the function
behind it
heroiczero
@heroiczero
Aug 22 2017 08:13
@culturesync You could change the contents of the page when you click the button
CuttureSync
@culturesync
Aug 22 2017 08:13
how do you mean?
as in separate the mark up to look like this;
heroiczero
@heroiczero
Aug 22 2017 08:15
@culturesync because you don't want your text to be stacked. you can just change the content when you click on the different buttons for Home About and donate
CuttureSync
@culturesync
Aug 22 2017 08:16
it wont let me type
ok there we go
<div class="container"
<div class="content"
<div class="home>
@heroiczero if i was implementing this into a real website I would
I don't have hosting
I could probably use github though huh?
Rajat
@rajataudichya
Aug 22 2017 08:18
Any one here good with form?
CuttureSync
@culturesync
Aug 22 2017 08:18
nope
heroiczero
@heroiczero
Aug 22 2017 08:19
@culturesync you dont need to have hosting you just have to append the content or you could just use https://css-tricks.com/almanac/properties/v/visibility/ or display property and on click hide the content
CuttureSync
@culturesync
Aug 22 2017 08:19
true
I was thinking about using the display property earlier
heroiczero
@heroiczero
Aug 22 2017 08:20
something like adding a display:none; on click
CuttureSync
@culturesync
Aug 22 2017 08:21
I'll try it an see how I like it... I was hoping for a more fluid container with changing content slides. Similar to what people do for Off Canvas Nav sites
@heroiczero thank you also
CamperBot
@camperbot
Aug 22 2017 08:21
culturesync sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 1637 | @heroiczero |http://www.freecodecamp.com/heroiczero
CuttureSync
@culturesync
Aug 22 2017 08:21
:bow:

right now I have this in my CSS

 .is_visible {
  transform: translateX(0);
}

and this in my JS

 var ele;

$(document).ready(function() {
  $(".home").addClass("is_visible");

  function changeClass(ele) {
    var link = $(ele).data("pos");
    if ($("." + link).hasClass("is_visible")) {
      return;
    } else {
      $("." + link).addClass("is_visible").siblings().removeClass("is_visible");
    }
  }
I am thinking taht I can add a slide and then change these 2 areas of my code to make slides that actually interchange
gotta lotta digging to do
BuntyBru
@BuntyBru
Aug 22 2017 08:26
@heroiczero
what do you mean by "$.getJSON is asyn"
heroiczero
@heroiczero
Aug 22 2017 08:31
@BuntyBru like your quote you are retrieving from quotesondesign. You can't store it in a variable and call it outside the $.getJSON method

@BuntyBru because the nature of async : When you add a console.log('after post') after the $.getJson() call and console.log('after callback') in it.

If you check your console after sending the request you will find that "after post" appears before "after callback" which means that the script execution continued without waiting for the response from the server.

Long Nguyen
@longnt80
Aug 22 2017 08:48
@culturesync @heroiczero display: none; won't show the animation though
use position: absolute so the content won't be stacked
BuntyBru
@BuntyBru
Aug 22 2017 09:27
@heroiczero
help me here mate
I dont understand where to put this
I am trying to put the event listener on the twitter button
iso
@iso1048
Aug 22 2017 09:33
@BuntyBru you want to set the href of the a tag to https://twitter.com/intent/tweet?text=[yourQuote]. so you could do something like document.getElementById("newTweet).setAttribute('href', "https://twitter.com/intent/tweet?text="+yourQuote) I have not tried it though
Naveen Sharma
@Naveenbitw
Aug 22 2017 09:46
guys can you all please review my first ever FCC project https://codepen.io/naveenbitw434/full/oeoGqR/
Markus Kiili
@Masd925
Aug 22 2017 09:56
@Naveenbitw Should you also make the first picture responsive? Now it only shows a part of it on smaller screens.
Colors are also somewhat disturbing for my eye (matter of taste perhaps). I don't think you should use underlining unless it is a link, and perhaps not even then anymore.
Markus Kiili
@Masd925
Aug 22 2017 10:03
There are also problems with responsivity on large screens. Most content stays on the center but some content is on the side and some span the whole width.
Most browsers have emulators that help you test responsivity on different screen sizes.
BuntyBru
@BuntyBru
Aug 22 2017 10:08
@gothamknight
i did that but now in the twitter feed I am getting html tags like <p>
BuntyBru
@BuntyBru
Aug 22 2017 10:16
@sorinr
Help
iso
@iso1048
Aug 22 2017 10:19
@BuntyBru this removes one p tag: $("#quotes").html(a[0].content + "&mdash;" + a[0].title ) });
@BuntyBru the json contains the quote within p tags which is why you are having the issue
BuntyBru
@BuntyBru
Aug 22 2017 10:26
@gothamknight
After using the above Its not doing what i expected
Its moving somewhere else
iso
@iso1048
Aug 22 2017 10:28
@BuntyBru i have muddled with your ajax function. try it out:
$.getJSON("https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]="+ count +"&callback=", function(a) {
     console.log(a);
     var quote = a[0].content;
     quote = quote.slice(3, quote.length-5);
     console.log(quote);
      $("#quotes").html(quote + "&mdash;" + a[0].title ) 
   });
BuntyBru
@BuntyBru
Aug 22 2017 10:33
@gothamknight
Its working thanks
btw
Please explain the two lines below
CamperBot
@camperbot
Aug 22 2017 10:33
buntybru sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 389 | @gothamknight |http://www.freecodecamp.com/gothamknight
BuntyBru
@BuntyBru
Aug 22 2017 10:33
var quote = a[0].content;
quote = quote.slice(3, quote.length-5);
iso
@iso1048
Aug 22 2017 10:37
@BuntyBru before you had a[0].content, which was accessing the quote in the json - the first line is simply assigning the quote in the json to the variable quote. the quote in the json is a string which includes an opening and closing p tag, so the next line of code is removing these tags. 3 is the index of the first letter in the quote you want to keep, and quote.length-5 is the index of the last letter in the quote you want to keep.
so then you 're-assign' this 'sliced' string to quote var
BuntyBru
@BuntyBru
Aug 22 2017 10:55

So suppose the JSON consists of the following quote

<p>Hey How are you <p>

now
var quote = a[0].content;

means now quote = <p>Hey How are you <p>

now, quote = quote.slice(3, quote.length-5);

With reference to 3 it means the letter "H", and quote.length-5 is equal to 17

So "Hey How are you" is extracted

@gothamknight
am i right?
iso
@iso1048
Aug 22 2017 10:57
@BuntyBru yeah bro, except you forgot the / in the closing p tag
BuntyBru
@BuntyBru
Aug 22 2017 10:58
oh, It just missed my mind
I guess some designing needs to be done then the project is ready
@gothamknight
iso
@iso1048
Aug 22 2017 10:59
@BuntyBru looks good at the moment. what more do you want to add?
BuntyBru
@BuntyBru
Aug 22 2017 11:00
WIll take help of bootstrap adding a bit of animation
thats it
iso
@iso1048
Aug 22 2017 11:01
oh ok. good luck
Elias Lebid
@eliaslebid
Aug 22 2017 13:35

I'm rendering menu in footer from objects

block footer
    +footer({
        "footer": [{
                "text": "Single service",
                "href": "#"
            },
            {
                "text": "Couple service",
                "href": "#"
            },
            {
                "text": "Giftcards",
                "href": "#"
            },
            {
                "text": "About us",
                "href": "#"
            },
            {
                "text": "FAQs",
                "href": "#"
            },
            {
                "text": "Contact us",
                "href": "#"
            },
        ]
    })

But from max-width 486px I need to add 2 extra items to the end of its, how I can achieve this?

dinesh
@1532j0004kg
Aug 22 2017 14:14
Guys anybody know the ,FCC certificates names ?
limbu
@limbu
Aug 22 2017 14:33
has anybody had an issue when trying to set the width of a select dropdown box?
Peter Steele
@PeterHSteele
Aug 22 2017 15:21
Hi guys. Can't figure out why my handleClick won't fire when passed to my <Recipe /> component
Tom
@moT01
Aug 22 2017 16:00
I think you need to create a recipe component
you're just returning a component that doesn't exist
pretty sure anyway
@PeterHSteele
Peter Steele
@PeterHSteele
Aug 22 2017 16:05
the recipe component's in there on line 44, that's why the names of the recipes show up, but obviously there's still something wrong with it. thanks though @moT01
CamperBot
@camperbot
Aug 22 2017 16:05
peterhsteele sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 806 | @mot01 |http://www.freecodecamp.com/mot01
Liam Docherty
@ldocherty1
Aug 22 2017 16:14

Hi, I'm trying to find an JPG file and place it onto my webpage. Below is my code.

<img class="img-fluid rounded mb-3 mb-md-0" src="../assets/test1.jpg" alt="webdesign2">

However, it doesn't locate my file.

The file is in the correct folder and is named the name as stated in the code.
Wael Azar
@Waelazar
Aug 22 2017 16:16
if the file in the same folder with the your main file so you don't need the ../assets
<img class="img-fluid rounded mb-3 mb-md-0" src="test1.jpg" alt="webdesign2">
just like this
@ldocherty1
Tom
@moT01
Aug 22 2017 16:20
@PeterHSteele https://codepen.io/moT01/pen/zdjyJV?editors=1010
Liam Docherty
@ldocherty1
Aug 22 2017 16:21
@Waelazar It still doesn't seem to find it.
Wael Azar
@Waelazar
Aug 22 2017 16:24
i said if the file in the same folder (same directory) like your main file @ldocherty1
because when you write ".." that means you went back to folders backward
Ken Haduch
@khaduch
Aug 22 2017 16:25
@ldocherty1 - check the console.log and see what error message is being reported when it tries to access the file? It might provide some additional clue about what's going wrong.
SOmetimes the file has to be addressed relative to the CSS file and other times relative to the top page?
so you might just need src="assets/test1.jpg" or something, @ldocherty1
Liam Docherty
@ldocherty1
Aug 22 2017 16:26
@Waelazar @khaduch Thanks for the help, I sorted the issue.
CamperBot
@camperbot
Aug 22 2017 16:26
ldocherty1 sends brownie points to @waelazar and @khaduch :sparkles: :thumbsup: :sparkles:
:cookie: 345 | @waelazar |http://www.freecodecamp.com/waelazar
:star2: 3228 | @khaduch |http://www.freecodecamp.com/khaduch
Wael Azar
@Waelazar
Aug 22 2017 16:27
great , welcome
Ken Haduch
@khaduch
Aug 22 2017 16:27
@ldocherty1 - good! You're welcome!
Michuello
@Michuello
Aug 22 2017 16:32
Hi everyone! I have a problem with my Wikipedia Viewer. It's almost done but I don't know what to do with my input field. I want my function responsible for wikipedia searching to start working after user clicks "enter" but it starts every time user mousecliks on input field. What do I do wrong? https://codepen.io/Michuello/pen/VzQWeo
Peter Steele
@PeterHSteele
Aug 22 2017 16:38
thanks @moT01 do you mind explaining what the issue was? i still can't figure out why what i had wasn't working
CamperBot
@camperbot
Aug 22 2017 16:38
peterhsteele sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:warning: peterhsteele already gave mot01 points
Ken Haduch
@khaduch
Aug 22 2017 16:38
@Michuello - you are using a <form> element, and the default action when you submit a form is to reload the page. What you can do it remove the form, and set up a click handler for the input. Or in your click function, pass in event as the parameter, and in your callback function, add this event.preventDefault();
Sorin Ruse
@sorinr
Aug 22 2017 16:38
@Michuello where is your szukanie() function that should deal with the form submission?
Ken Haduch
@khaduch
Aug 22 2017 16:39
@Michuello - actually - you don't have the szukanie() function anywhere? Seems like a little confusion there...
Michuello
@Michuello
Aug 22 2017 16:43
Oh yes, I forgot to delete Szukanie function. I tried to use "onsubmit" function but it didn't work either...
Sorin Ruse
@sorinr
Aug 22 2017 16:47
@Michuello anyway, try to give to your js functions, variables, css class names a meaningful name but in English as all the programming languages are based on English. when you ask for help or even worst, when you collaborate with a team everybody should understand whats going on
Jorge
@OrangeKulture
Aug 22 2017 16:52
hey guys
Michuello
@Michuello
Aug 22 2017 16:53
Good point @sorinr :smile: So I can set an extra button to submit my input. But what can I do to submit input also for clicking enter?
Sorin Ruse
@sorinr
Aug 22 2017 16:55
you should check for keyup event. if its 13 it means the user pressed the enter key
Michuello
@Michuello
Aug 22 2017 16:57
thanks @sorinr
CamperBot
@camperbot
Aug 22 2017 16:57
michuello sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1328 | @sorinr |http://www.freecodecamp.com/sorinr
Gulsvi
@gulsvi
Aug 22 2017 16:58
@Michuello Since you're using a <form>, the browser will fire a submit event whenever you press Enter or click a button inside that form. See this tutorial for some basic instructions on how to handle the submit event: https://codepen.io/skycoder/pen/MpKpJj
Tom
@moT01
Aug 22 2017 17:00
@PeterHSteele i played with it a bit and changed a few things, ...not sure exactly what the issue was
I moved the handleClick function to after render()
changed the syntax for calling it in your <Recipe/>
and again in the <div>
Michuello
@Michuello
Aug 22 2017 17:02
thanks @SkyC0der . Very nice tutorial
CamperBot
@camperbot
Aug 22 2017 17:02
michuello sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2529 | @skyc0der |http://www.freecodecamp.com/skyc0der
Peter Steele
@PeterHSteele
Aug 22 2017 17:08
@moT01 got it, appreciate you taking the time
Michuello
@Michuello
Aug 22 2017 17:19
@SkyC0der I used event.preventDefault(); as in your tutorial but it still reloades the page...
Gulsvi
@gulsvi
Aug 22 2017 17:22
@Michuello You need to attach the .on('submit' to the <form> element, not the <input> element
Michuello
@Michuello
Aug 22 2017 17:24
Oh right, thak you very much @SkyC0der . Project is ready
Gulsvi
@gulsvi
Aug 22 2017 17:25
@Michuello Congrats - you got some search results now :)
CuttureSync
@culturesync
Aug 22 2017 18:04
@longnt80 I tried that and it doesn't actually work.
@longnt80 my apologies after looking at the code for a while (sometimes too long) I figured out where to place the absolute position
@longnt80 however the content is still stacked, BUT the home page collapses (fluily) like it's supposed to... check it out if you want.
https://codepen.io/culturesync/pen/brMwgo
I may have to position another element or make some changes to the container and is_visible elements
Kent Saeteurn
@sansae
Aug 22 2017 18:32

hello; can anyone help me figure out how to retrieve the first sentence of a wiki article from wiki's api? i'm having one helluva time trying to figure this one out;

what i currently have is a snippet of my search results (10 total); i was going to let this slide, but quite a few of the snippets returned from other search words really suck; an example of what i mean is that for a search of "apples", the first result yields a first sentence whose snippet begins as "found today. Apples have been grown for ....." That second sentence is fine, but that first one? not ideal. Additionally, those two sentences are somewhere in the middle of the first paragraph (of the actual apple article on wikipedia).

i'm using wiki's "Search" Protocol; my url looks like this: "https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=apples&format=json"

i understand wikipedia has properties to return such as extracts, exintro, and exsentences. exsentences, when set to 1, appears to be what i want, but adding this property to my specific api url does not work ===> https://en.wikipedia.org/w/api.php?action=query&prop=extracts&exintro&exsentences=1&list=search&srsearch=apples&format=json

this api url works (sort of): https://en.wikipedia.org/w/api.php?action=query&prop=extracts&exintro&exsentences=1&titles=Albert%20Einstein&format=jsonfm;
however, this only works for one specific title and returns only one result

can anyone help me out?

Andrew Knox
@iamknox
Aug 22 2017 18:39
@sansae You're having trouble accessing the extract key from the object that's object that is returned by your api call?
sorry from the object that's returned by your api call
Ross Scarborough
@SourceHorse
Aug 22 2017 18:42
anyone know how to get my "random" button to stay on the same line as my form "search" button?
CuttureSync
@culturesync
Aug 22 2017 18:43
@SourceHorse depends... lemme look
Mercifex
@Mercifex
Aug 22 2017 18:44
I have a bootstrap grid question. Is there anything special you have to do to get an image in the same grid row as some text? I have a div container and a div row, with the image in a div and the text in another div but it places them on two different lines.
CuttureSync
@culturesync
Aug 22 2017 18:49
@Mercifex try float:left;
@SourceHorse so you closed you <form> tag BEFORE the <button> tag... it should look like this
 <form name = "wQuery" action = "" method = "GET" onSubmit = "return false">
    <input type = "text" name = "searchbox" class = "searchfield" id = "search" value = "">
    <input type = "button" name = "qButton" class = "searchbutton" value = "Search" onClick = "test(this.form)">
 <a href = "https://en.wikipedia.org/wiki/Special:Random"><button class = "searchbutton">Random</button></a> </form>
@SourceHorse so you nest the button within the form... at the end
Ross Scarborough
@SourceHorse
Aug 22 2017 18:51
when I do that, the page won't load the link unless i open in new tap
tab*
i found a workaround using inline-block
thanks @culturesync
CamperBot
@camperbot
Aug 22 2017 18:51
:cookie: 160 | @culturesync |http://www.freecodecamp.com/culturesync
sourcehorse sends brownie points to @culturesync :sparkles: :thumbsup: :sparkles:
Mercifex
@Mercifex
Aug 22 2017 18:51
@culturesync Oh wow, so simple but it works. Thanks!
CamperBot
@camperbot
Aug 22 2017 18:51
mercifex sends brownie points to @culturesync :sparkles: :thumbsup: :sparkles:
:cookie: 161 | @culturesync |http://www.freecodecamp.com/culturesync
CuttureSync
@culturesync
Aug 22 2017 18:54
@Mercifex WOW... cool That was a guess based off what I know about bootstrap :P
CuttureSync
@culturesync
Aug 22 2017 19:01
@SourceHorse okay that was going to be my second guess
:thumbsup:
Gulsvi
@gulsvi
Aug 22 2017 19:03
@SourceHorse A <button> inside <a> is invalid HTML. Remove the button code and style your link like a button instead.
@Mercifex Use the bootstrap grid - columns are always on the same line as long as you don't put more than 12 in a row:
<div class="row">
  <div class="col-sm-6">
    <img class="img-responsive" src="https://placehold.it/800">
  </div>
  <div class="col-sm-6">
    Text in another div
  </div>
</div>
using a float will work, but you sacrifice the built in responsiveness provided by bootstrap
CuttureSync
@culturesync
Aug 22 2017 19:08
@SkyC0der I use CSS grid
I don't prefer bootstrap but I know a little about it... just what FCC taught
Gulsvi
@gulsvi
Aug 22 2017 19:10
@culturesync I like CSS grid, but not much support yet. We learned how to put elements side by side with bootstrap in this (optional) challenge: https://www.freecodecamp.org/challenges/use-the-bootstrap-grid-to-put-elements-side-by-side
CuttureSync
@culturesync
Aug 22 2017 19:10
Yeah I remember. There's a lot of solutions to a single problem it just depends on your preference and understanding of what you are trying to acheive. The guy didn't post up his code so it was a shot in the dark.
I liked your suggestion for SourceHorse
Gulsvi
@gulsvi
Aug 22 2017 19:12
@sansae I think you'll need to use a generator to get that data in the format you want: https://en.wikipedia.org/w/api.php?action=query&prop=extracts&exintro&generator=search&gsrsearch=apples&format=json
(generator instead of list)
CuttureSync
@culturesync
Aug 22 2017 19:13
TTFN
Gulsvi
@gulsvi
Aug 22 2017 19:13
Ta :)
And, yeah, usually a shot in the dark without code :p
Thomas Alves
@suforozinho
Aug 22 2017 19:16
guys, what is javascript:;
CuttureSync
@culturesync
Aug 22 2017 19:17
@SkyC0der I'm sure once I get the hang of all of this and get quicker with problem sovling I'd be able to find better solutions.. p r a c t i c e m a k e s b e t t e r
Very true! @culturesync I keep going back and re-doing projects as I learn more. Shake my head at my older code
Thomas Alves
@suforozinho
Aug 22 2017 19:19
so i write the javascript code between the : and ;?
@SkyC0der
Gulsvi
@gulsvi
Aug 22 2017 19:20
@suforozinho I don't see it used very often except with void like shown at that link. Usually you have javascript in a separate file that performs an action when you interact with an HTML element. You can do that with onclick, for example, or any of the other events you want to monitor
CuttureSync
@culturesync
Aug 22 2017 19:21
@SkyC0der this is from the first FCC project click here :P :gun:
Gulsvi
@gulsvi
Aug 22 2017 19:21
$('button').on('click', someFunction);

function someFunction() {
  console.log('clicked!');
}
@suforozinho
@culturesync That looks great for a first tribute page :) but yeah, I know, lol. I can't even look at my first one. So boring and basic lol
Thomas Alves
@suforozinho
Aug 22 2017 19:22
Thanks @SkyC0der, i am reading a book here and the author use this but doesn't explain, thanks again
CamperBot
@camperbot
Aug 22 2017 19:22
suforozinho sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2531 | @skyc0der |http://www.freecodecamp.com/skyc0der
CuttureSync
@culturesync
Aug 22 2017 19:23
haha, While I was doing the tribute page I was watching Travis from DevTips on Youtube and learning about animations and overlays and then I asked someone to explain to me how to do the JS to make page items FADE IN for aethetic
haha
iso
@iso1048
Aug 22 2017 19:32
@SkyC0der back to the original. nice.
Gulsvi
@gulsvi
Aug 22 2017 19:33
Hello @gothamknight :wave:
Thomas Alves
@suforozinho
Aug 22 2017 19:35
@SkyC0der man, i didn't solved the problem here :worried:
Gulsvi
@gulsvi
Aug 22 2017 19:35
which one @suforozinho ?
iso
@iso1048
Aug 22 2017 19:35
@SkyC0der hi
Corbled
@Corbled
Aug 22 2017 19:35
Hello
CuttureSync
@culturesync
Aug 22 2017 19:37
hello
... it's me
Thomas Alves
@suforozinho
Aug 22 2017 19:37

with the URI, look what i am trying to do:

<a href="javascript:;" class="toogle">Quero me cadastrar</a>

The author write this and then write this:

JQuery(function($) {
    $('section').on('click', 'a', function() {
        $('card').toggleClass('flipped');
    })
});

i simply don't know what to do...

@SkyC0der
Gulsvi
@gulsvi
Aug 22 2017 19:39
@suforozinho that should add a class "flipped" to an element named <card> (or remove it if exists) whenever you click on an <a> element that's inside of a <section> element
Corbled
@Corbled
Aug 22 2017 19:40
In codepen I have set a font-size for the body of my project in a css class but am also trying to set a larger font-size for header elements in the body in a separate headers css class. For some reason codepen is not allowing me to do it
When I try to change the font-size in the second class it returns an error saying it is invalid
Thomas Alves
@suforozinho
Aug 22 2017 19:40
@SkyC0der Yeah, but where i need to put this jquery code to make that happen?
iso
@iso1048
Aug 22 2017 19:41
@Corbled hey man, could you link the pen
Corbled
@Corbled
Aug 22 2017 19:41
Yeah of course, sorry should have done that
Kent Saeteurn
@sansae
Aug 22 2017 19:42

@iamknox hi andrew, thanks for the response; my issue isn't in accessing the json data, but rather how to return the exact type of data; i wanted my json to return the first sentence of the first paragraph in an article/result; instead, using the api url that i put together from this sandbox ==> https://www.mediawiki.org/wiki/Special:ApiSandbox, i was only able to return a snippet;

the issue has been resolved thanks to @SkyC0der, who deserves like, a million dollars, for all his help

CamperBot
@camperbot
Aug 22 2017 19:42
sansae sends brownie points to @iamknox :sparkles: :thumbsup: :sparkles:
:cookie: 296 | @iamknox |http://www.freecodecamp.com/iamknox
iso
@iso1048
Aug 22 2017 19:43
@Corbled you are missing a ; dude
Corbled
@Corbled
Aug 22 2017 19:44
ah sorry yes I accidentally removed it but even after fixing it the font size does not change
The About, Projects and Contacts headers are all different sizes even though they all have the same class="headers"
Gulsvi
@gulsvi
Aug 22 2017 19:46
@suforozinho It's hard to say without seeing what you are reading. I'm guessing, they want you to do something like this: https://s.codepen.io/anon/pen/Bdxgye?editors=1111
iso
@iso1048
Aug 22 2017 19:46
@Corbled h1, h2, h3 all have default font-sizes.
Corbled
@Corbled
Aug 22 2017 19:47
Ok, that makes total sense. So in this case I should change all to the same
iso
@iso1048
Aug 22 2017 19:47
@Corbled you would want to use the same tag for the contacts, about and portfolio headings. so make them all h2 or something. Then apply the class directly to that to change it
Kent Saeteurn
@sansae
Aug 22 2017 19:47

@SkyC0der thank you so much sky, as always :)

that did the trick! is it safe to say that that api sandbox isn't too user friendly? i spent so much time messing around with various combinations; super frustrating; i haven't been able to find any documentation that 'walks' you through on how to properly use all the different protocols and params

CamperBot
@camperbot
Aug 22 2017 19:47
sansae sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2532 | @skyc0der |http://www.freecodecamp.com/skyc0der
Thomas Alves
@suforozinho
Aug 22 2017 19:48
@SkyC0der ok, gonna make a test
Gulsvi
@gulsvi
Aug 22 2017 19:49
@sansae No problem! I think it depends on the user lol, but yeah, not very user friendly. It makes you look up every single word in the documentation to read about it. Then go over it all over again once you have a little bit of a better understanding. It takes hours and hours to do :/
Corbled
@Corbled
Aug 22 2017 19:50
@gothamknight Thank you, that's exactly what I needed, I appreciate it
CamperBot
@camperbot
Aug 22 2017 19:50
corbled sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 390 | @gothamknight |http://www.freecodecamp.com/gothamknight
Corbled
@Corbled
Aug 22 2017 19:51
@gothamknight One last thing is that I am trying to link to each section on the navbar but because of it being at the top of the screen when I click the links on the navbar it goes to the heading but it is hidden behind the navbar
Thomas Alves
@suforozinho
Aug 22 2017 19:52
@SkyC0der i didn't solved the problem yet but you helped me a lot, thanks
CamperBot
@camperbot
Aug 22 2017 19:52
suforozinho sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: suforozinho already gave skyc0der points
Corbled
@Corbled
Aug 22 2017 19:52
is there a way to set a margin of sorts so that the heading is just below the navbar and can be seen
@gothamknight is there a way to set a margin of sorts so that the heading is just below the navbar and can be seen
iso
@iso1048
Aug 22 2017 19:53
ill have a look.
@Corbled im not sure sorry. But yeah, setting a margin could help.
Gulsvi
@gulsvi
Aug 22 2017 19:55
@Corbled With a fixed navbar, you'll want to add padding to the top of your body element equal to the height of your navbar. So, in your case:
body {
  padding-top: 50px
}
Corbled
@Corbled
Aug 22 2017 19:56
@gothamknight No problem, your help has been great.
iso
@iso1048
Aug 22 2017 19:56
and there you go.
Gaurav
@gauravmagan
Aug 22 2017 19:56

freecoding bootcamp great community to grow ourself and acieve your goals
today i have launched one of my clients application where im getting paid for it i thank the community members and team for it
_

@SkyC0der @moigithub

CamperBot
@camperbot
Aug 22 2017 19:56
gauravmagan sends brownie points to @skyc0der and @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 2533 | @skyc0der |http://www.freecodecamp.com/skyc0der
:star2: 3603 | @moigithub |http://www.freecodecamp.com/moigithub
CuttureSync
@culturesync
Aug 22 2017 19:57
so I am stuck again
I need the container to fluidly collapse and un-collase as the page slides move through
Corbled
@Corbled
Aug 22 2017 19:58
@SkyC0der That makes sense, what I had done before was create a main css class with margin-top and I had a div element just below with this class
@SkyC0der Is padding better when used in this case?
Gulsvi
@gulsvi
Aug 22 2017 19:59
@Corbled Padding is better to use for your body element - the padding controls the distance inside the element, the margin is for outside.
You usually want your body to take up the full height of the screen
CuttureSync
@culturesync
Aug 22 2017 20:01
Thinking I might have to ass some JS for this feature that I am looking for
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:03
@SkyC0der Can you give me a hint on what to write next?
function sumFibs(num) {
  var arr = [1,1];
  var nextNumber = arr[arr.length - 1] + arr[arr.length - 2];

  while (nextNumber >= num) {


  }

  return num;
}

sumFibs(4);
Gulsvi
@gulsvi
Aug 22 2017 20:03
I don't understand what effect you're going for @culturesync I don't see any page slides
@BrianWilliams28 Use .push() to put nextNumber into arr
but switch your while loop condition around or else you'll have an infinite loop
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:07
@SkyC0der while (nextNumber <= num) ?
Gulsvi
@gulsvi
Aug 22 2017 20:07
Try it out - see how it works
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:08
<= gives me an infinite loop
Gulsvi
@gulsvi
Aug 22 2017 20:09
Can you show your updated code?
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:09
function sumFibs(num) {
  var arr = [1,1];
  var nextNumber = arr[arr.length - 1] + arr[arr.length - 2];

  while (nextNumber >= num) {
  arr.push(nextNumber);

  }
  console.log(arr); // outputs only [1,1]
  return num;
}

sumFibs(4);
Gulsvi
@gulsvi
Aug 22 2017 20:09
In your while loop, you need to change the value of nextNumber, or it's always going to stay the same
That's why you have an infinite loop
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:10
so i should move the var nextNumber = arr[arr.length - 1] + arr[arr.length - 2]; line into the while loop?
nvm that doesn't change anything
:(
Corbled
@Corbled
Aug 22 2017 20:18
@SkyC0der The padding makes sense to me now but I have added it and it has not resolved the problem with the link. The padding works to begin with but not for when I link to each header
CuttureSync
@culturesync
Aug 22 2017 20:20
@SkyC0der they aren't defined as slides per say. It's just how I am describing the sliding effect of the 'li' elemensts as styles by the css and js
Razvan Fecico
@razvaf
Aug 22 2017 20:21
@BrianWilliams28 your while condition is the problem, and you need to make the calculations inside the loop
CuttureSync
@culturesync
Aug 22 2017 20:21
@SkyC0der I am trying to fix what is happening when you click from home to about to home again. The container doesn't move fluidly ... it just pops back into the ize of the content
Gulsvi
@gulsvi
Aug 22 2017 20:22
@BrianWilliams28 Yes, you need to update nextNumber in that loop. Try it out with console.log() to see what's happening
Razvan Fecico
@razvaf
Aug 22 2017 20:23
@BrianWilliams28 if you want to calculate the first n numbers i think a for would be better
in this problem a while is more confusing
Gulsvi
@gulsvi
Aug 22 2017 20:23
@Corbled I misunderstood - you'll need to add that padding to each section you link to as well. Or, use javascript. Here's a discussion on it around bootstrap's fixed top navbar - even though you aren't using Bootstrap, it's still the same issue. Fixed top elements will cover up your content: twbs/bootstrap#1768
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:24
@razvaf to say i'm confused right now wouldn't be inaccurate
Razvan Fecico
@razvaf
Aug 22 2017 20:24
with for you now how many times you need to do the loop
Gulsvi
@gulsvi
Aug 22 2017 20:24
@culturesync I'm still confused - nothing happens when I click home, about, then home again
CuttureSync
@culturesync
Aug 22 2017 20:25
@SkyC0der I'm on Mozilla... Do you use chrome?
If i defined the height for the .container property rather than just having it set to height: auto; it could fix it
BrianWilliams28
@BrianWilliams28
Aug 22 2017 20:25
@razvaf i'm pretty good with for loops, i wanted to try a while loop this time to familiarize myself with it more
Razvan Fecico
@razvaf
Aug 22 2017 20:25
oh ok
Gulsvi
@gulsvi
Aug 22 2017 20:25
@culturesync I'm on Firefox and Chrome
Razvan Fecico
@razvaf
Aug 22 2017 20:25
so use the same idea for the condition
Gulsvi
@gulsvi
Aug 22 2017 20:26
Have IE if you need me to check that too :joy:
Razvan Fecico
@razvaf
Aug 22 2017 20:26
a counter that goes to num
CuttureSync
@culturesync
Aug 22 2017 20:27
@SkyC0der for some reason the container snaps, or jerks, to the size of the content as you click through the list items in the nav rather than fluidly sliding up and down to match the fluidity of the sliding effect & size of content
Gulsvi
@gulsvi
Aug 22 2017 20:28
@culturesync Have you tried adding min-height?
CuttureSync
@culturesync
Aug 22 2017 20:29
@SkyC0der click here I took off the overflow-x: hidden; property so you can see what I'm talking about.
I will also try adding the min-height... which in that case shouls I also do a max-height for responsiveness
@SkyC0der danke :bow:
CamperBot
@camperbot
Aug 22 2017 20:33
culturesync sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2534 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 22 2017 20:34
@culturesync I don't know what to say. The buttons don't do anything - I'm shooting in the dark guessing what you're seeing
culturesync.gif
CuttureSync
@culturesync
Aug 22 2017 20:38
@SkyC0der wow this is crazy! I'm so suprised that you can't see it. thank you for taking the time to make that animation
CamperBot
@camperbot
Aug 22 2017 20:38
culturesync sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: culturesync already gave skyc0der points
CuttureSync
@culturesync
Aug 22 2017 20:38
@SkyC0der The min height did work though. It specifies the height of the container
which is cool with me too
Gulsvi
@gulsvi
Aug 22 2017 20:40
Okay, cool :)
@razvaf What's your solution to that challenge with the for() loop?
Peter Steele
@PeterHSteele
Aug 22 2017 20:44
Hey guys, I can't figure out why the handleClick() method of my <RecipeBox > component won't fire when I pass it down to my child <Recipe /> component. I feel like I'm doing the handleclick.bind(this) correctly but can't get it to work. Let me know if you guys have any tips
https://codepen.io/psteele1128/pen/mMxNLw
iso
@iso1048
Aug 22 2017 21:09
@SkyC0der you on bro, or busy packing?
Gulsvi
@gulsvi
Aug 22 2017 21:10
@gothamknight Yeah. Just finished No Repeats Please - finally!
I'm pretty much all packed
iso
@iso1048
Aug 22 2017 21:10
@SkyC0der is that an advanced algo?
Gulsvi
@gulsvi
Aug 22 2017 21:11
Yeah, it's one of the advanced ones
iso
@iso1048
Aug 22 2017 21:11
oh true. you must be an organised person
Gulsvi
@gulsvi
Aug 22 2017 21:11
I've had several months to figure out what to pack :p
iso
@iso1048
Aug 22 2017 21:11
i wanted your opinion on something....could I pm you (it wont take long)?
Gulsvi
@gulsvi
Aug 22 2017 21:11
sure
Dian
@diantai23
Aug 22 2017 21:59
Hi all, I’m new here and just finished my tic tac toe app. I am having trouble with identifying why there is a white line between the navbar and the body. I did not place it there intentionally and would like to either remove or minimize it. Also please check out the game and let me know what you think, thanks! http://kit-cat-toe.pancakeapps.com/
Liam Docherty
@ldocherty1
Aug 22 2017 22:14
Hi, how can I centre my button? I did add text-center to this line <a class="btn btn-primary text-center" href="#">View Project <span class="glyphicon glyphicon-chevron-right"></span> </a> However, it doesn't seem to work.
 <!-- Project One -->
            <div class="row">
               <div class="col-md-7">
                  <a href="#">
                  <img class="img-fluid rounded mb-3 mb-md-0" src="http://placehold.it/700x300" alt="">
                  </a>
               </div>
               <div class="col-md-5">
                  <h3>Project One</h3>
                  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium veniam exercitationem expedita laborum at voluptate. Labore, voluptates totam at aut nemo deserunt rem magni pariatur quos perspiciatis atque eveniet unde.</p>
                  <a class="btn btn-primary text-center" href="#">View Project
                  <span class="glyphicon glyphicon-chevron-right"></span>
                  </a>
               </div>
            </div>
            <!-- /.row -->
Gaurav
@gauravmagan
Aug 22 2017 22:15
Screen Shot 2017-08-22 at 6.15.18 PM.png
created a function to capture the data but isnt taking out
Screen Shot 2017-08-22 at 6.16.46 PM.png
this function is assigned to campaing summary
but aint printing out in the console while checkin in
Mercy Manrique
@mers89
Aug 22 2017 22:22
I need help with the Wikipedia API. Still work in progress. In the meantime the console should pickup the ajax. https://codepen.io/mers89/pen/eErpPr?editors=1011
Basically if you type in the search button, it should process in the console
Gulsvi
@gulsvi
Aug 22 2017 22:23
@ldocherty1 Use text-center on the parent element, use d-block mx-auto and give it a width, or put it in a grid with an offset.
It's the same as centering an image since it's also an inline element
@mers89 You have it set up now to process when you click the submit button. Just add jQuery to your codepen project and it will work.
If you mean to make it call the Wikipedia API every time you enter a letter in the text box, you'll want to look at the keyup event
$("#searchTerm").on('keyup', function() {
Mercy Manrique
@mers89
Aug 22 2017 22:27
@SkyC0der Really. Let me see if it works
Omg @skycoder you're a genius. You always help me so fast :)
CuttureSync
@culturesync
Aug 22 2017 22:28
Got Most of it fixed there is just one more aesthetically pleasing variable I need to debug then it's off to fill the content and make a responsive multi-grid slideshow for the home page :)
https://codepen.io/culturesync/pen/brMwgo
Let me know what you think
Gulsvi
@gulsvi
Aug 22 2017 22:28
@mers89 It's all thanks to the console :) This means jQuery isn't added: Uncaught ReferenceError: $ is not defined
CamperBot
@camperbot
Aug 22 2017 22:28
skyc0der sends brownie points to @mers89 :sparkles: :thumbsup: :sparkles:
:cookie: 263 | @mers89 |http://www.freecodecamp.com/mers89
Gulsvi
@gulsvi
Aug 22 2017 22:28
lol @camperbot
Liam Docherty
@ldocherty1
Aug 22 2017 22:29
@SkyC0der Thanks
CamperBot
@camperbot
Aug 22 2017 22:29
ldocherty1 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2536 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gaurav
@gauravmagan
Aug 22 2017 22:32
@SkyC0der how can i print values out from a javascript function
in browser console i need to check weather the values are in picked
Screen Shot 2017-08-22 at 6.16.46 PM.png
from the form
Gulsvi
@gulsvi
Aug 22 2017 22:33
@gauravmagan Now that I know you aren't doing these projects for Free Code Camp, and you're making money, I'm going to have to ask for a percentage of your paycheck if you want more help
:)
Gaurav
@gauravmagan
Aug 22 2017 22:34
hahaha
im learning while making some
im a student @SkyC0der
and thats a side project to pay my college loan
Gulsvi
@gulsvi
Aug 22 2017 22:35
Me too, a broke and starving student who needs some money $$$
:)
CuttureSync
@culturesync
Aug 22 2017 22:35
I'll join the club
Gulsvi
@gulsvi
Aug 22 2017 22:35
Anyway, just use console.log() in your function
Gaurav
@gauravmagan
Aug 22 2017 22:35
hahaha
ok
yes but if you see the values are returned or not
Gulsvi
@gulsvi
Aug 22 2017 22:36
I think it would just be console.log(dataTuples.value) but hard to know without seeing more
CuttureSync
@culturesync
Aug 22 2017 22:37
my poor :dog: :dog: s have to watch me learn this all day. I just started an online tuition free accredited college to get a computer science degree. Hopefully I can make it thru all the way.
Gaurav
@gauravmagan
Aug 22 2017 22:37
Screen Shot 2017-08-22 at 6.16.46 PM.png
@SkyC0der
Screen Shot 2017-08-22 at 6.38.37 PM.png
assigned the function to this button to see the preivew of the form by clicking the button it should show out
Gulsvi
@gulsvi
Aug 22 2017 22:40
Do you have this in codepen?
Gaurav
@gauravmagan
Aug 22 2017 22:40
Screen Shot 2017-08-22 at 6.40.15 PM.png
this is the browser error
Gulsvi
@gulsvi
Aug 22 2017 22:42
dataTuples.elements('name') doesn't seem right, the console confirms. I'd need to see more to help you with the error
Though, you could try to just console.log(dataTuples) and look at it in your console to study how to get the data you need
Gaurav
@gauravmagan
Aug 22 2017 22:43
ok
ill check it if its working
CuttureSync
@culturesync
Aug 22 2017 22:49
looking for opinions
If ya wanna check out my pen. suggestions, ideas, and solutions are welcome :)
Liam Docherty
@ldocherty1
Aug 22 2017 23:28
@gauravmagan Why don't you put the full code in a text format instead of displaying it in a multiple pictures? This may help you find a faster resolution to your problem. In addition, it might make the issue of your post more understandable as it will be in one text box.
DJ Nixon
@tGxcoder
Aug 22 2017 23:46

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
  var result = "";
  // Your code below this line

   results= "My " + myAdjective + " stupid " + myNoun + " didn't " + myVerb + " very " + myAdverb + " anywhere.";
  // Your code above this line
  return result;
}

// Change the words here to test your function
wordBlanks("dog", "big", "ran", "quickly");
nvm i see it.....
Ken Haduch
@khaduch
Aug 22 2017 23:55
@culturesync - not sure what kind of things you are looking for - some things about the responsiveness might be that you should have a collapsible navbar because on a narrow screen it takes a third of the real estate. Also your "The City" section has a very narrow column when on a narrow screen.
Also on a narrow screen if I'm looking at the "Home" section, and scrolled to the bottom, when I press one of the footer links for the other sections that are much shorter in content, I see a blank screen because it doesn't scroll up to the top of the text area - that might be a good thing to fix, although I know that you just have placeholder text in there, but typically when you are doing something like a smooth scroll or regular jump scroll, you bring the top of the section you are scrolling to to the top of the viewing area.