These are chat archives for FreeCodeCamp/HelpFrontEnd

2nd
Jun 2016
Jose Valle
@joselv
Jun 02 2016 00:10
@qckpckt could it be the 15px padding coming from .container-fluid ?
PedroCSilva
@PedroCSilva
Jun 02 2016 00:11
thats my guess as well
something like that
Casey
@w9lp
Jun 02 2016 00:15
Hi Folks… I need to try this one again. I have a set of divs that define the Simon game board. Buttons defined inside these divs fail to register a click. These same buttons work fine when I move them outside the divs into another part of the body. Another member tried the pen and it worked for him but I still can’t get it to work. Is there something obvious I’m missing? Configuration? Environment?
Right here if anyone is interested in looking at the project: http://codepen.io/w9lp/pen/YqoEQj
Bruce Young
@mutantspore
Jun 02 2016 00:21
@w9lp I get this error message in teh dev console
TypeError: null is not an object (evaluating 'document.getElementById('offPosition').style’)
Casey
@w9lp
Jun 02 2016 00:25
Interesting... haven’t seen that on my console @mutantspore . Do the other buttons work in your session?
Bruce Young
@mutantspore
Jun 02 2016 00:26
@w9lp I get that as soon as it loads .. nothing works as I guess it just stops
Mac/Safari
@w9lp is there and element called offPostition?
Casey
@w9lp
Jun 02 2016 00:28
K… I’ll try it on Safari. I’m getting nothing on Mac/Chrome or Mac/Firefox. There is an HTML input/button called offPosition… it’s the off side of the on/off switch. I checked spelling in both the HTML and JS code… I’ll check again.
@mutantspore Interesting thing is that if I move the “offPosition”/“onPosition” buttons out of the parent divs, straight into the body, both work fine.
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 00:30
Hi everyone, I'm having real trouble with the random quote machine exercise. I can't seem to get even a basic click event to work (trying to get that down before I try the other stuff). Below is my HTML, can anyone explain what I'm doing wrong.

<script>
$(document).ready(function() {
    $("#gitsome").on("click", function(){

    $(".quote").html("New Quote");

    });
  });
</script>

<body class = "container-fluid">
  <div class= "row text-center">
  <h1> History Presents: </h1>
  <h1> OG Quotes From the Realest </h1>
  </div>

  <div class = "text-center">
  <h2> Ayo, I'm not saying these quotes are the bomb, but you's about to get yo head exploded in a linguistic inferno namsayin </h2>
  </div>

  <div class = "text-center">
  <button class = "btn btn-primary" id = "gitsome"> Git Some</button>
  </div>

  <div class = "text-center quote"> old quote
  </div>

  <div class = "text-center img">
  <img src = #>
  </div>
PedroCSilva
@PedroCSilva
Jun 02 2016 00:34
do you have a codepen
of your code?
its easier to try and fix it that way
Bruce Young
@mutantspore
Jun 02 2016 00:34
@w9lp I must be blind I cannot see an ID = on or off Postition there is a on and off Label
in the HTML
pgjones72
@pgjones72
Jun 02 2016 00:35
hey guys, I'm working on the wiki viewer. I have the user entered search working and I have imported a random wiki page. The problem is that I only want the text- not the whole page. I tried the link that is posted in the challenge, but it is not an API. I have found a random API. Is that what I need? The documentation suggests that it has a limited number of pages. Any ideas?
Casey
@w9lp
Jun 02 2016 00:36
@mutantspore on HTML page <div id="onOffSwitch"> <input type="button" class="slideSwitch" id="offPosition"> <input type="button" class="slideSwitch" id="onPosition"> </div>
James Hall
@James-H33
Jun 02 2016 00:36
@Robson-Beaudry you have spaces between your id's and classes
Coy Sanders
@coymeetsworld
Jun 02 2016 00:36
@Robson-Beaudry try using the click function instead of on
Bruce Young
@mutantspore
Jun 02 2016 00:37
@w9lp
      <div id="onOffSwitch">

      </div>
perhaps you didn’t save it or send the right link
Coy Sanders
@coymeetsworld
Jun 02 2016 00:38
also make sure you're importing jQuery and BootStrap
刘增辉
@liuzenghui2007
Jun 02 2016 00:40
Hi all, Can some one give me an advice to draw a flowchart before program, such as a online design software or a guide book?
Casey
@w9lp
Jun 02 2016 00:41
@mutantspore Wow… that’s interesting… I see the gap in my Safari and Firefox sessions but it’s all there in Chrome. Something’s corrupted. I think I’m going to nuke this pen and copy over to a fresh session… maybe that’ll resolve. Thanks @mutantspore !
CamperBot
@camperbot
Jun 02 2016 00:41
:star2: 1677 | @mutantspore |http://www.freecodecamp.com/mutantspore
w9lp sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
Nikov
@nsieber
Jun 02 2016 00:42
@liuzenghui2007 If it's a small program why not use pen and paper. It's good for your brain.
Greg Duncan
@GregatGit
Jun 02 2016 00:45
@w9lp Your seGameState function is messing with everything I would check the syntax of document.getElementById("offPosition").style.backgroundColor = "white";
刘增辉
@liuzenghui2007
Jun 02 2016 00:46
@nsieber yes, but when I want to store it on Internet for reference, I still need a online software.
Casey
@w9lp
Jun 02 2016 00:46
@GregatGit … messing with everything? I sense a learning opportunity… can you be more specific? What are you looking at to reach that conclusion?
Greg Duncan
@GregatGit
Jun 02 2016 00:46
@w9lp before I could get a simple alert('hi'); working on your page I had to delete that - so at a guess that function is holding up anything else working
Casey
@w9lp
Jun 02 2016 00:47
OK… thanks @GregatGit … in the process of transferring code over to new pen… I think something’s been corrupted in my pen.
CamperBot
@camperbot
Jun 02 2016 00:47
w9lp sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 545 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jun 02 2016 00:49
@w9lp also, use more jQuery - here is a simple example of how to change the css $("p").css("background-color", "yellow"); from w3schools.com
刘增辉
@liuzenghui2007
Jun 02 2016 00:49
@nsieber However, It's a good advice. Thank you.
CamperBot
@camperbot
Jun 02 2016 00:49
liuzenghui2007 sends brownie points to @nsieber :sparkles: :thumbsup: :sparkles:
:cookie: 248 | @nsieber |http://www.freecodecamp.com/nsieber
Casey
@w9lp
Jun 02 2016 00:51
@GregatGit … I’ve been trying to get comfortable with the standard DOM manipulations, get some proper context before going all-in on jQuery… maybe that’s been my mistake! ;-)
Nikov
@nsieber
Jun 02 2016 00:52
@liuzenghui2007 In that case I would use google drawing. It is simple and stores drawings in your google docs
Bruce Young
@mutantspore
Jun 02 2016 00:54
@GregatGit @w9lp the background color line you have is fine for syntax but it seems that thing (offPosition) is a bit elusive
Elbert Cortez
@trip16661
Jun 02 2016 01:00
I finished styling up my code generator but i still think it looks crappy on small devices because i dont know how to restrain the element (quote) so it wont strech the div and push everything down
http://codepen.io/Trip1666/full/LNzMvX/
This message was deleted
Casey
@w9lp
Jun 02 2016 01:00
@mutantspore … please check for the missing buttons in this pen? codepen.io/w9lp/pen/WxbaNv I see them now in Firefox. Do you still see the null error in your console?
Bruce Young
@mutantspore
Jun 02 2016 01:03
I see the code that was missing .. nothing works though .. no error message but nothing responds @w9lp
Casey
@w9lp
Jun 02 2016 01:05
@mutantspore … yeah… that’s what I’m getting until I move the buttons out of the gameBoard divs… then they work fine. Appreciate the time you spent… thanks again.
CamperBot
@camperbot
Jun 02 2016 01:05
w9lp sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: w9lp already gave mutantspore points
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 01:09
@James-H33 Could you tell me a bit more about what you mean by that?
刘增辉
@liuzenghui2007
Jun 02 2016 01:13
@nsieber OK, I will find and try this tool.
PedroCSilva
@PedroCSilva
Jun 02 2016 01:16
@Robson-Beaudry what do you want to do?
Bruce Young
@mutantspore
Jun 02 2016 01:17
@pgjones72 yes the actual instruction give the opprtubity to just use a link to get a Random page. I you don’t want to do that, the wiki api as options to get a random page. I grabbed the returned page’s title and fed it back as a search for a page as I had forthr normal search
Greg Duncan
@GregatGit
Jun 02 2016 01:17
@trip16661 In the boxes on the bottom there is nothing to indicate that you need to click on them
Elbert Cortez
@trip16661
Jun 02 2016 01:20
@GregatGit what do you mean?
if you hover there is a pointer over there
and they resemble like buttons
pgjones72
@pgjones72
Jun 02 2016 01:22
@mutantspore how did you grab just the title? That's one of the things I've been trying to figure out.
Bruce Young
@mutantspore
Jun 02 2016 01:22
@trip16661 there is minimalism and #whatdoIdoism . I just though you’d not got your div’s right to be honest
don’t make teh user think
Greg Duncan
@GregatGit
Jun 02 2016 01:23
@trip16661 I'm on a windows10 using chrome and all you get is two shaded boxes - when you hover it shows that you can click - but it could be a addvertisment for all the user knows
Elbert Cortez
@trip16661
Jun 02 2016 01:24
so what should I do? a landing page explaining? I thought it would be pretty explicit that it's buttons
Bruce Young
@mutantspore
Jun 02 2016 01:25
@pgjones72 here is the code I wrote as you can see I got the title and fed it back to my getArticle function to get the same sort of info I had for them.
  // retrieve RANDOM Article
  function getRandom() {
    var parameters = {
      action: "query",
      list: "random",
      format: "json",
      rnnamespace: 0,
      rnlimit: 1
    };
    $.getJSON(URL_Wiki, parameters)
      .done(function(data, textStatus, jqXHR) {
        getArticle(data.query.random[0].title, 1);
      })
      .fail(function(jqXHR, textStatus, errorThrown) {
        console.log(errorThrown.toString());
      })
  };
Greg Duncan
@GregatGit
Jun 02 2016 01:25
@trip16661 they don't look like buttons to me
anthonyjl92
@anthonyjl92
Jun 02 2016 01:25

hey guys, I'm trying to POST data to an API using oauth 2.0 but when execute the following


    $http({
        method: 'POST',
        url: 'https://api.smaato.com/v1/reporting/',
        data: requestData,
        headers: {
                         'Access-Control-Request-Headers': 'Host',
                  Origin:'index.html',
                        "Content-Type": "application/json",
                  Authorization: "Bearer "+$window.sessionStorage.token,
                  Host: "api.smaato.com"
                 }
    }).success(function(response){ //on success, returns the access_token
        console.log(response);
    }).error(function(error){ //if request fails, return error 
        console.log(error);
    });

This gives me errors such as
Refused to set unsafe header "Origin"
Refused to set unsafe header "Host"
Refused to set unsafe header "Access-Control-Request-Headers"

Does anyone know how to get around this? ty

Elbert Cortez
@trip16661
Jun 02 2016 01:26
@GregatGit I see thanks I will take a look at it
CamperBot
@camperbot
Jun 02 2016 01:26
trip16661 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 546 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jun 02 2016 01:26
@trip16661 That being said - it is still a great quote page - There are a couple of things I think you should add - when you have the '>' to click on - they shouldn't move - so you don't have to keep moving your mouse around - and you should just be able to push the left or right arrow button
Elbert Cortez
@trip16661
Jun 02 2016 01:27
@GregatGit y i hate that im currently looking to check
how to do that
if you read the principal post thats what i asked xD
Bruce Young
@mutantspore
Jun 02 2016 01:27
@trip16661 a very long time ago in the ledgendary past people used to say “Press any key to continue…” in software.. that seems ok.. any key .. but you should have seen the confusion.. .. they sat there and agonised about which any key to press… you are leaving things open to interpretation and hence failure.
pgjones72
@pgjones72
Jun 02 2016 01:28
@mutantspore Bruce, you are a beautiful man. Thanks a bunch!
CamperBot
@camperbot
Jun 02 2016 01:28
pgjones72 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1678 | @mutantspore |http://www.freecodecamp.com/mutantspore
Elbert Cortez
@trip16661
Jun 02 2016 01:29
@mutantspore what do you thing would be a better aproach to it? changing the style or just a landing page explaining?
cuz if it were for me i would just ad small boxes that pops up for a few secods when they finally get to the page
but i think that would be an over kill considering the small size of this project
Greg Duncan
@GregatGit
Jun 02 2016 01:31
@trip16661 You have an execellent search for author feature that I havn't seen on any other project - but unless someone is trusting and curious they won't know -
Bruce Young
@mutantspore
Jun 02 2016 01:32
@trip16661 no you should have to explain anything.. a read of the Apple dev guidlines re-inforces that view. Just keep things within convention. I know that can suck if you want to be “arty” but if you want an art site.. do anything you want but if you want users to do things and not get annoyed.. keep to the general conventions and they expect web sites to generally work the same way.
PedroCSilva
@PedroCSilva
Jun 02 2016 01:33
hello! need some help with my twitch app
getting all my channels offline
Bruce Young
@mutantspore
Jun 02 2016 01:34
@PedroCSSilva it should be if(data.stream === null){
PedroCSilva
@PedroCSilva
Jun 02 2016 01:35
Thanks @mutantspore
CamperBot
@camperbot
Jun 02 2016 01:35
pedrocssilva sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1679 | @mutantspore |http://www.freecodecamp.com/mutantspore
PedroCSilva
@PedroCSilva
Jun 02 2016 01:36
Now im gonna try to use the .done implementation
Elbert Cortez
@trip16661
Jun 02 2016 01:36
@GregatGit y when i first thought about quote i thought "what if i want to search for my favorite author" and it took me like 1 day or 2 to find the api that let me do such thing the api is not even that great if you dont write the full name it wont recognize the name in some cases
And i wiish i could do an auto complete search but i think im asking too much for that api xD
Greg Duncan
@GregatGit
Jun 02 2016 01:39
@trip16661 you are missing my point - your code and apis are great and work really well - but from a design point of view - you should presume that the user doesn't know to much - how would they know that this is a handy website to get random quotes or quotes from an author they may like -
@trip16661 if you turned up at a non discript website would you just start clicking buttons to see what they do?
Elbert Cortez
@trip16661
Jun 02 2016 01:41
y that makes sense
what if i rename it would it make any difference?
instead of random just (random quote)
and instead of author just "search quote by author"
Juwdohr
@Juwdohr
Jun 02 2016 01:42
Can I get some help, after inputing '=' I get NaN, not sure why?
http://codepen.io/juwdohr/pen/eZoNKB
Elbert Cortez
@trip16661
Jun 02 2016 01:42
but i think that would be too verbose
Greg Duncan
@GregatGit
Jun 02 2016 01:44
@trip16661 You have done the hardest part - the background code - now you just have to combine art and functionality (and security )
Bruce Young
@mutantspore
Jun 02 2016 01:45
@trip16661 just wack in an icon.. the standard search icon for search aand the standard circle arrow thing for refresh recycle
PedroCSilva
@PedroCSilva
Jun 02 2016 01:45
im trying to get the results by the order of the channels in the array
but its not working
now it lists online channels first
Andrew Charlebois
@andrewchar
Jun 02 2016 01:47
hey guys. i wanted to post my publication here. its about how i got a job in under 5 months using FCC. thanks! https://medium.com/@andrewchar/this-is-my-story-about-how-i-went-from-being-a-carpenter-with-zero-experience-in-the-tech-world-to-4252e93cb73#.l6nojy7fj
Elbert Cortez
@trip16661
Jun 02 2016 01:48
@andrewchar oh andrew did you get the job???
@andrewchar I wasnt really updated man!
Andrew Charlebois
@andrewchar
Jun 02 2016 01:48
yup! :)
Bruce Young
@mutantspore
Jun 02 2016 01:48
@PedroCSSilva the order it’s coming back is pretty random due to the async nature of the api requests. the online ones don’t always show first.
Elbert Cortez
@trip16661
Jun 02 2016 01:49
wow congratulation dude!!
Andrew Charlebois
@andrewchar
Jun 02 2016 01:49
ty ty :)
James Hall
@James-H33
Jun 02 2016 01:49
@andrewchar congrats!
Andrew Charlebois
@andrewchar
Jun 02 2016 01:49
i decided to make a medium post about it to share my newas
news*
in hopes that it would help new coders
PedroCSilva
@PedroCSilva
Jun 02 2016 01:50
@mutantspore is there a way of making sure its always the same order? Or is it a normal thing with these requests
Bruce Young
@mutantspore
Jun 02 2016 01:50
@PedroCSSilva I pushed mine into an array as they came back and when the length of that array was the same as the length of the original list.. i sorted them and then rendered them
Elbert Cortez
@trip16661
Jun 02 2016 01:50
@GregatGit @mutantspore I will take a look at what you guys have been pointing , you guys always help me out really thanks :)
CamperBot
@camperbot
Jun 02 2016 01:50
trip16661 sends brownie points to @gregatgit and @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1680 | @mutantspore |http://www.freecodecamp.com/mutantspore
:warning: trip16661 already gave gregatgit points
PedroCSilva
@PedroCSilva
Jun 02 2016 01:51
I thought that using done, etc would fix that
Elbert Cortez
@trip16661
Jun 02 2016 01:52
@andrewchar I will read it now I'm so happy that you got it :) I want to freelance soon so i get more experience on the go but knowing that even if i get good at it my price will be lowered just because of my nationality just takes me down a little bit but it's inspiring to hear people who succeeding
Andrew Charlebois
@andrewchar
Jun 02 2016 01:53
i tried to get freelance but it just was not working out lol
Bruce Young
@mutantspore
Jun 02 2016 01:53
well you are using .forEach to do multiple api requests.. that’s really a .done for each request… my method was to see when it’s all over
Elbert Cortez
@trip16661
Jun 02 2016 01:55
@andrewchar well in my case there are no other way around. My country is fucked up right now and I don't believe anyone would hire me (with this low experience and no cs background) if they need to help me with a visa or something
I got my own business going on so I don't really need money but i dont want to get a job in my country developing 00s looking websites and getting paid like 40$ day xD
Juwdohr
@Juwdohr
Jun 02 2016 01:58
Can I get some help, after inputing '=' I get NaN, not sure why?
http://codepen.io/juwdohr/pen/eZoNKB
Tyler Collins
@tjscollins
Jun 02 2016 02:14

https://codepen.io/tjscollins/pen/VjYbJY

Got some weird behavior I can't figure out here in the javascript. API calls are working fine, but the links at top right for All/Online/Offline streamers seem to only work once. The page loads fine; if I click one of the links it works fine; if I click one of the other links, it doesn't work. I assume something is wrong with my event handlers, but I'm not sure what.

Any ideas?
JD Tadlock
@jdtdesigns
Jun 02 2016 02:16
@Juwdohr I'm guessing you figured it out
Elbert Cortez
@trip16661
Jun 02 2016 02:23

@tjscollins

("<div class=\"header-box row\">\n<div class=\"col-xs-8 header-box\">\n<h1>Twitch Streamers</h1>\n</div>\n<div class=\"col-xs-2 switch\">\n<a><p id=\"all\">All</p></a>\n<a><p id=\"online\">Online</p></a>\n<a><p id=\"offline\">Offline</p></a>\n</div>\n</div><br>");

this is quite ugly xD

Tyler Collins
@tjscollins
Jun 02 2016 02:24
Yes, but I'm trying to fix one thing at a time. Still learning.
Elbert Cortez
@trip16661
Jun 02 2016 02:24
@tjscollins something i would recomend is
that you get the full list
and as soon as you dinamically add into the page
you add them an id
and then with the .show() .hide() you manipulate them
Tyler Collins
@tjscollins
Jun 02 2016 02:26

I think that would fix the problem I'm having too.

I just realized that because I'm rewriting the header box each time the original #all and the new #all are not the same ids to the compiled code (I'm guessing, but it makes sense and would explain why clicking doesn't work after the first time)

JD Tadlock
@jdtdesigns
Jun 02 2016 02:28
@tjscollins A very simple way to do it is to just do the api call and put a class into each stream of offline, online or closed and then you can just hide/unhide the divs based on their class
Juwdohr
@Juwdohr
Jun 02 2016 02:28
@jdtdesigns actually I am not sure. Do you mind testing it and finding any error or any way I could improve it?
Elbert Cortez
@trip16661
Jun 02 2016 02:29

so instead of this

  $("#all").click(function() {    
    getStatus(list, [1,1]);
  });
  $("#online").click(function() {
    getStatus(list, [0,1]);
  });
  $("#offline").click(function() {
    getStatus(list, [1,0]);
  });

you use something like

  $("#all").click(function() {    
    $(".ofline").show();
    $(".online").show();
  });
  $("#online").click(function() {
    $(".ofline").hide();
    $(".online").show();
  });
  $("#offline").click(function() {
     $(".ofline").hide();
    $(".online").show();
  });
Tyler Collins
@tjscollins
Jun 02 2016 02:29
I'll try that. Thanks @trip16661 @jdtdesigns
CamperBot
@camperbot
Jun 02 2016 02:29
tjscollins sends brownie points to @trip16661 and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 381 | @trip16661 |http://www.freecodecamp.com/trip16661
:cookie: 420 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Tonye Iyalla
@tiyalla
Jun 02 2016 02:29
hey all, i'm about to start my job search and I am working on my resume. Does anyone have tips on how they included their freecodecamp projects on their resume? If you don't mind sharing. i'd appreciate that.
Elbert Cortez
@trip16661
Jun 02 2016 02:31
@tjscollins how to make it so it puts the correct class to the correct div is easier :) good luck with that project
JD Tadlock
@jdtdesigns
Jun 02 2016 02:32
@Juwdohr Works great other than the percentage. You're logic on that needs some adjusting.
@tiyalla A basic way is to create a gallery layout and have an image of the project linking to the codepen. A more profesh way would be to put the project on github pages and link to it there for each one.
Elbert Cortez
@trip16661
Jun 02 2016 02:34
@tiyalla I dont have experience searching for jobs but i think a simple portfolio will be helpful in yuur page
telling what tecnologies did you use and the job description
@jdtdesigns i was about to say that aswell xD
JD Tadlock
@jdtdesigns
Jun 02 2016 02:35
if you can figure out firebase.google.com, you can create complete apps with database using github pages
for free
Juwdohr
@Juwdohr
Jun 02 2016 02:37
@jdtdesigns What's wrong with the logic? Can you give examples? Also what is firebase.google.com?
JD Tadlock
@jdtdesigns
Jun 02 2016 02:39
@Juwdohr 9x6% should equal 4.86
work with it until you get that result
i can give you the answer but that wouldn't challenge you :P
firebase is a cloud database
like sql but online instead
so you can access it anywhere instead of it being installed on your server
Juwdohr
@Juwdohr
Jun 02 2016 02:43
@jdtdesigns try it now?
JD Tadlock
@jdtdesigns
Jun 02 2016 02:44
@Juwdohr perfect ;)
Juwdohr
@Juwdohr
Jun 02 2016 02:44
@jdtdesigns thanks
CamperBot
@camperbot
Jun 02 2016 02:44
juwdohr sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 02:45
@PedroCSSilva Right now I just want the text below the button to change when I press the button
JD Tadlock
@jdtdesigns
Jun 02 2016 02:48
@Robson-Beaudry If you post your codepen and explain, we might be able to help
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 03:00
Sure thing. Essentially I can't seem to get even a basic click event to work with my JQuery code (trying to get that down before I try the other stuff). Like I said, right now I just want the text below my button to change when I press the button.
https://codepen.io/robsonbeaudry/pen/WxbjOo
Bruce Young
@mutantspore
Jun 02 2016 03:01
@Robson-Beaudry you need to add jquery
@Robson-Beaudry it’s not added in using teh settings quick add
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 03:06
Awesome, just added it
Still not working though :(
Juwdohr
@Juwdohr
Jun 02 2016 03:08
anyone know how to automatically have a text box resize itself due to the text length within? (width only)
JD Tadlock
@jdtdesigns
Jun 02 2016 03:09
@Robson-Beaudry Here's a some simple code to get you started ;) https://codepen.io/jdtadlock/pen/GqgYao?editors=0010
I cleaned up your html, added jquery, and took the js out of the html
Bruce Young
@mutantspore
Jun 02 2016 03:10
@Robson-Beaudry don’t put spaces in your class assignment
<div class="text-center quote”>
JD Tadlock
@jdtdesigns
Jun 02 2016 03:11
@mutantspore spaces are there to seperate classes
Bruce Young
@mutantspore
Jun 02 2016 03:11
@jdtdesigns oh boy
<div class = "text-center quote”>
JD Tadlock
@jdtdesigns
Jun 02 2016 03:11
oh lol
Bruce Young
@mutantspore
Jun 02 2016 03:11
that is what I’m talking about
JD Tadlock
@jdtdesigns
Jun 02 2016 03:12
i didn't see that due to me clicking the Tidy button :P
my bad
Bruce Young
@mutantspore
Jun 02 2016 03:12
he’s done that all though his html
@Robson-Beaudry also your CSS .. many of the lines should have ; at the end of them
well 2 of the 3 ..counts as many lol
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 03:19
Haha, good to know, just corrected it
Still not working though...
@Robson-Beaudry i put the JS in the JS box..
JD Tadlock
@jdtdesigns
Jun 02 2016 03:21
@Robson-Beaudry did you look at my code as well?
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 03:22
Yup, thanks so much for your help @jdtdesigns and @mutantspore
CamperBot
@camperbot
Jun 02 2016 03:22
robson-beaudry sends brownie points to @jdtdesigns and @mutantspore :sparkles: :thumbsup: :sparkles:
:cookie: 422 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
:star2: 1682 | @mutantspore |http://www.freecodecamp.com/mutantspore
Ali
@TruLegend
Jun 02 2016 03:29
How do you share your pen?
Juwdohr
@Juwdohr
Jun 02 2016 03:31
Hey wondering if there is a way to get a sound to beep at the end of a timer?
@TruLegend Copy and paste URL
Tonye Iyalla
@tiyalla
Jun 02 2016 03:33
@jdtdesigns @trip16661 hey guys, I'm working on doing that with my online portfolio. But in this case, I was referring to a PDF resume that I will use in my job application not an online portfolio. Any pointers>
Robson Beaudry
@Robson-Beaudry
Jun 02 2016 03:35
@TruLegend just copy paste the url
JD Tadlock
@jdtdesigns
Jun 02 2016 03:36
@Juwdohr new Audio(url to audio file);
Juwdohr
@Juwdohr
Jun 02 2016 03:37
@jdtdesigns wanting the audio to play after the timer goes off. (Working on the Pomodoro Clock) any suggestions?
Juwdohr
@Juwdohr
Jun 02 2016 03:49
@jdtdesigns is that you designing it?
JD Tadlock
@jdtdesigns
Jun 02 2016 03:50
yes
tommy
@tommygebru
Jun 02 2016 03:50

I finished the Quote machine but there is one bug I cant figure out might have to do with responsiveness ??
http://codepen.io/gebrutommy/pen/xVZOgg?editors=0010

Please leave a comment and feedback :smile:

JD Tadlock
@jdtdesigns
Jun 02 2016 03:51
@tommygebru looks awesome
What's the bug?
Juwdohr
@Juwdohr
Jun 02 2016 03:54
@jdtdesigns how do you get the sounds url from there?
Ali
@TruLegend
Jun 02 2016 03:54
@Robson-Beaudry Oh, Thanks
CamperBot
@camperbot
Jun 02 2016 03:54
trulegend sends brownie points to @robson-beaudry :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @robson-beaudry |http://www.freecodecamp.com/robson-beaudry
JD Tadlock
@jdtdesigns
Jun 02 2016 03:56
@Juwdohr click on the sound you want and click on the share button
Juwdohr
@Juwdohr
Jun 02 2016 03:57
@jdtdesigns found it. Thank you.
CamperBot
@camperbot
Jun 02 2016 03:57
juwdohr sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 423 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 02 2016 03:57
yep ;)
tommy
@tommygebru
Jun 02 2016 03:58
@jdtdesigns thanks but someone beat you to it :wink2: it had something to do with site restrictions??? ... anyway the solution was to open the link in a new window
JD Tadlock
@jdtdesigns
Jun 02 2016 04:00
ah yes
codepen doesn't want you to leave their site :P
tommy
@tommygebru
Jun 02 2016 04:01

@jdtdesigns ...this was the response...

check out your console
2index.html:1 Refused to display 'https://www.rottentomatoes.com/tv/rick-and-morty/s01/' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self' rottentomatoes.com *.rottentomatoes.com ".
open it in a blank tab to avoid codepen problems

Juwdohr
@Juwdohr
Jun 02 2016 04:02

@jdtdesigns hey here is my start:

function CountDownTimer(duration, sound) {
    this.duration = duration;
    this.granularity = 1000;
    this.tickFtns = [];
    this.running = false;
    this.ausio = sound;
}

CountDownTimer.prototype.start = function() {
    function timer() {
        that.remaining -= that.granularity / 1000;;
        if (that.remaining <= 0) {
            CountDownTimer.prototype.stop.call(that);
        } else {
            obj = CountDownTimer.parse(that.remaining);
            that.tickFtns.forEach(function(ftn) {
                ftn.call(this, obj.minutes, obj.seconds);
            }, that);
        }
    }
    if (this.running) {
        return;
    }
    this.running = true;
    var that = this,
            obj;
    if (!this.remaining) {
        this.remaining = this.duration;
    }
    this.timerHandle = window.setInterval(timer, this.granularity);
};

Where do I do the play at and also it stops at 1. wondering how I get it to show 0:00 then restart with a 2nd timer. I have a restart function.

JD Tadlock
@jdtdesigns
Jun 02 2016 04:15
@Juwdohr That's some complexity there lol. var that = this made me smile
when the seconds and minutes === 0, play the audio and then reset them
Kenzo Mendoza
@KenzoM
Jun 02 2016 04:20
is anyone familiar with CSS animation?
I'm working on the Wikipedia project and i just need some pointers on how CSS animation work
Essentially what I'm trying to do is when the user clicks the magnifiying icon, I want both magnifying and question mark to fadeout, THEN delete both element so that I can APPEND the search form on the web
but when I try to use jQuery to remove the element, it skips the animation automatically
or maybe just regular "css tricks"
Kenzo Mendoza
@KenzoM
Jun 02 2016 04:25
@tommygebru does this apply for using animation.css library?
tommy
@tommygebru
Jun 02 2016 04:32
@Neotriz are you asking how to use?
Kenzo Mendoza
@KenzoM
Jun 02 2016 04:33
@tommygebru I'm more asking how to get replace the icons with the form
after the animation of both icons fadeout
basically I want the form the be centered
Kyle W Pilkinton
@tadake
Jun 02 2016 04:36
hey guys can anyone help me with my switch? im working on the tic tac toe game and im using a materialize switch to replace checkboxes and I cant figure out how too get the value of the switch. heres my code
http://codepen.io/tadake/pen/RRwzEj
tommy
@tommygebru
Jun 02 2016 04:37
Oh I believe you are asking for the form to "appear" afterwards...you will use the visibility:hidden on the form and use jquery to make it visible
http://www.w3schools.com/cssref/pr_class_visibility.asp
JD Tadlock
@jdtdesigns
Jun 02 2016 04:41
@Juwdohr http://jsbin.com/jetejab/edit?html,js,output Here's a simple way to do a reset and call the alarm
Arvilyn Ong
@arvilyn
Jun 02 2016 04:42
hi can anyone help with my "Build a Random Quote Machine"? i would love to have some feedback and i'm kinda stuck with the "press a button to tweet out a quote." :worried: Here's my project:
http://codepen.io/whyxi4ng/full/MeYPxV/
Kenzo Mendoza
@KenzoM
Jun 02 2016 04:42
@tommygebru doesnt visiblity still takes space?
Ideally I'd like <form></form> to be where both of those icons
maybe I'm over thinking this..
JD Tadlock
@jdtdesigns
Jun 02 2016 04:44
@arvilyn You don't need html or body tags in codepen. All of your links to css or js should be added in the settings under CSS or JS tabs.
I also don't see a link to tweet a quote yet
You basically need to use the intent twitter link which looks like this https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text=
you can just concat the quote onto the end of that and also make sure the target is set to _blank
Connor Hastey-Palindat
@cpalindat
Jun 02 2016 04:50

Can anyone help me get the "Random" button under the middle of the search bar/search button?

http://codepen.io/cpalindat/pen/NrPyQg?editors=1100

redixhumayun
@redixhumayun
Jun 02 2016 04:51

http://codepen.io/redixhumayun/pen/beGKLq?editors=1011

Can anybody tell me how to add div elements to my code? What I'm doing in here doesn't seem to be working

Kenzo Mendoza
@KenzoM
Jun 02 2016 04:51
@tommygebru Found the solution! https://youtu.be/CBQGl6zokMs?t=444
redixhumayun
@redixhumayun
Jun 02 2016 04:53

@ConnHurr Add this line in your #random-button css

margin:10px 240px 0px auto;

Connor Hastey-Palindat
@cpalindat
Jun 02 2016 04:54
@redixhumayun So the only way to do it is through a margin?
Just curious, because that doesn't make it responsive which is what i'm trying to do...
You don't need closing input tags
Connor Hastey-Palindat
@cpalindat
Jun 02 2016 04:59
Oh okay I see
Is it possible to use font awesome icons instead of text? since they use an <i> element
JD Tadlock
@jdtdesigns
Jun 02 2016 05:00
of course
Connor Hastey-Palindat
@cpalindat
Jun 02 2016 05:04
How would I accomplish that? Because I can't put the <i> tag in the value can I?
JD Tadlock
@jdtdesigns
Jun 02 2016 05:05
change the input to <button></button>
doesn't have to be an input
doesn't have to be a form either ;)
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:07
can I do
element.style.color = "#255255255
JD Tadlock
@jdtdesigns
Jun 02 2016 05:07
no
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:07
dam
it has to be in hex
JD Tadlock
@jdtdesigns
Jun 02 2016 05:07
lol
rgb(255, 255, 255);
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:07
oh so
Connor Hastey-Palindat
@cpalindat
Jun 02 2016 05:08
okay thank you @jdtdesigns !
CamperBot
@camperbot
Jun 02 2016 05:08
connhurr sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:08
i can go
element.style.color = rgb(255,255,255)
CamperBot
@camperbot
Jun 02 2016 05:08
:cookie: 424 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:08
thanks
JD Tadlock
@jdtdesigns
Jun 02 2016 05:08
correct ;)
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:08
kept in numerical values?
not in string
sweet
JD Tadlock
@jdtdesigns
Jun 02 2016 05:08
like this 'rgb(255,255,255)';
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:09
crap
oh as a string?
JD Tadlock
@jdtdesigns
Jun 02 2016 05:09
all style values have to be in a string
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:10
nah dude
thats not correct
JD Tadlock
@jdtdesigns
Jun 02 2016 05:10
so it's either '#fff' or 'rgb(255,255,255)' or rgba(255,255,255, .7)'
how so?
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:11
Idk its just not working on my codepen, maybe I am wrong in my implementation
JD Tadlock
@jdtdesigns
Jun 02 2016 05:11
js will throw an error if you don't pass them inside a string
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:12
You can check it for yourself maybe you'll see the error
http://codepen.io/vanhealen/pen/beNBRe
I still need to put in the bootstrap stuff, I just have the functionality part for now. and I will need to actually use an API for the quotes, I just wanted to make one in vanilla JS for now though
JD Tadlock
@jdtdesigns
Jun 02 2016 05:14
Bruce Young
@mutantspore
Jun 02 2016 05:15
@Vanhealen just use concatenation to sew th’at color together
JD Tadlock
@jdtdesigns
Jun 02 2016 05:16
@Vanhealen return elem1.style.background = 'rgb(' + randNum1 +',' + randNum2 + ',' + randNum3 + ')';
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:18
yup!
thanks @jdtdesigns
CamperBot
@camperbot
Jun 02 2016 05:18
vanhealen sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 425 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 02 2016 05:18
welcome :)
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:19
That was a much needed help haha
now its coming together nicely.
The random quote generator is the hardest project to start haha
Seems daunting at first because I didn't know any javascript web api stuff
so I watched a Lynda.com tutorial on how to use it, very helpful, highly suggest the firs 8 chapters of it. If anybody has any additional resources feel free to add on.
JD Tadlock
@jdtdesigns
Jun 02 2016 05:22
only 3billion youtube videos :P
now the challenge is to make the text color bright on a dark background and vice versa @Vanhealen
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:23
I was inverting the hex colors
255 - randnum1-255
err regular colors
Ryan
@ispeakcomputer
Jun 02 2016 05:24
@Vanhealen having the same issues myself . i guess Ill at least start with the building of the website. check this out though.
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:24
I would be better off creating some conditionals that checked the different between invNum and randNum
I actually don't use Jquery, I only use vanillaJS
because Jquery makes alot of things easier than they should be, and my ultimate goal is to learn React so I want to struggle ALOT
if I did learn Jquery I would try to rewrite its functionality in vanillaJS
JD Tadlock
@jdtdesigns
Jun 02 2016 05:28
jquery is exactly what you've heard
a js helper
it makes js simple, so it's not too difficult to learn
there are some more advanced things jquery can do, but for the most part it's human readable functions
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:29
Yeah, just depends on your goals. I am taking a more under the hood approach.
JD Tadlock
@jdtdesigns
Jun 02 2016 05:30
learning vanilla first is a good plan
jquery will be much easier to pick up, knowing how it works
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:30
yeah, I also have an idea on how to make sure your text is readable upon the background
you can just use conditionals to keep it within a certain range
if you have something like rgb(num1,num2,num3) I think you can add all three num1,num2,num3 together and then compare them to invnum1,invnum2,invnum3 added together to make sure they are far enough apart to be readable
JD Tadlock
@jdtdesigns
Jun 02 2016 05:33
things like $('#myDiv').first(); does the same thing as document.getElementById('myDiv').firstChild;
just more readable
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:34
yeah, but I want to become decent with vanillaJS first before I even touch Jquery
JD Tadlock
@jdtdesigns
Jun 02 2016 05:34
or just check to see if the values are lower than 100 and change the font color to white or black based on the values ;)
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:34
Yeah but what if you want purple text on a lime green background!
JD Tadlock
@jdtdesigns
Jun 02 2016 05:35
then you'll have to get a little deeper with your logic
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:35
yup
also I am guessing theres some font-awesome thing to give me the big quotes symbol??
I am not supposed to look at anybodies example code but I don't know where to find that thing
Bruce Young
@mutantspore
Jun 02 2016 05:38
Paolo
@mav1283
Jun 02 2016 05:39
Hi everyone, how do i add fontawesome to codepen? thanks
Bruce Young
@mutantspore
Jun 02 2016 05:40
@mav1283 https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css in the add external CSS section
Paolo
@mav1283
Jun 02 2016 05:43
Thanks bruce!
Jonathan Mitchell
@Vanhealen
Jun 02 2016 05:53
uh how do I make my quotebox smaller
like put it in the middle of the page and make it smaller
JD Tadlock
@jdtdesigns
Jun 02 2016 05:57
@Vanhealen set width on the container and give it margin: 0 auto;
or add padding to the container on left and right
many ways
flexbox is another route
Bruce Young
@mutantspore
Jun 02 2016 06:04

@jdtdesigns @Vanhealen yes i was “revisiting” my Twitch app and had to resort to a transform to get the play icon in the dead center.

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

http://codepen.io/MutantSpore/full/jrEBgq/

Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:06
nice thanks
yeah I still have to add the twitter functionality
I haven't used any AJAX yet
Bruce Young
@mutantspore
Jun 02 2016 06:07
lol no ajax for you… that’s jQuery
well .ajax is
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:07
well I don't wanna use jquery
lol
.ajax can be used in vanillaJS i'm sure
I can do
var body = document.getElementById("body") right?
or would it be getElementsByTagName
Bruce Young
@mutantspore
Jun 02 2016 06:11
body is not an ID
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:11
its a tag
Bruce Young
@mutantspore
Jun 02 2016 06:11
give it a go
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:12
yup
well i did
var body = document.getElementsByTagName("body")[0]
bcuz its an array
Bruce Young
@mutantspore
Jun 02 2016 06:15
@Vanhealen you have an array of bodies?
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:15
no
but the first element in the array stored is body
getElementsByTagName returns an array
the first element of that array is the body tag
otherwise I would be saying Array.style.color = "somecolor"
this way I am accessing the body tag directly by using array[0]
JD Tadlock
@jdtdesigns
Jun 02 2016 06:16
document.querySelector('body') ;)
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:16
Havent seen that one before JD
JD Tadlock
@jdtdesigns
Jun 02 2016 06:16
been around for awhile lol
Jake
@Jaketh
Jun 02 2016 06:23
I'm curious... why not just use document.body? I probably should've read further up, but... if you're really trying to get at it?
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:24
Tried
didn't work on first attempt for some reason
let me try again
Jake
@Jaketh
Jun 02 2016 06:24
interesting...
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:24
ya that works
easier
oh so body is a property of the document object?
nice
Jake
@Jaketh
Jun 02 2016 06:25
most of the time.
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:25
does DOM work like an object and different things are simply properties of it? Like head is a property of html, so you can go html.head to get into it?
or I could go document.html.head
or does "document" refer to "html" in the dom?
Jake
@Jaketh
Jun 02 2016 06:27
DOM stands for document object model. I'm inclined to say yes.
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:27
think about what I wrote..
would you be able to go document.body or would you have to go document.html.body
Jake
@Jaketh
Jun 02 2016 06:28
you can definitely just go document.body
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:28
so then body is a property of document, and html is also a property of document
are they on the same level? because in the DOM tree they are on different levels it seems
pic_htmltree.gif
I don't think its all going to work how you think its going to work. I've never seen anyone use document.html anything
Jonathan Mitchell
@Vanhealen
Jun 02 2016 06:34
yeah haha
for sure
Ryan
@ispeakcomputer
Jun 02 2016 06:40
This message was deleted
Jake
@Jaketh
Jun 02 2016 06:41
as for your text to background comparison, you'd want to take the remainder from the rgb individual values to get your highest contrast. so, if you have rgb(100,100,100) as your background you would want rgb(255 -100, 255-100, 255 - 100) that way whatever value is passed as you're getting the opposite color, because (100,100,100) is grey, but its accumulative value is 300. but it looks nothing like (0,50,250) @Vanhealen
ofcourse, if you hit close to half of 255, accross all 3, your contrast will still go way down.
Ryan
@ispeakcomputer
Jun 02 2016 06:42
start to my quote generator . hoping to have the qoute come down from out of the frame to display .
Jake
@Jaketh
Jun 02 2016 06:43
@needsMoreCoffee you mean like, drop in from above the view?
Ryan
@ispeakcomputer
Jun 02 2016 06:43
thats right .
just something simple to get used to jquery. pretty fun so far though for sure.
I toggled between colors when you press the button like google material design calls for .
actually goes look like a button press but its just the two basic bootstrap colors.
Jake
@Jaketh
Jun 02 2016 06:44
not too hard. just set the absolute positioning off screen to start, and then add a class with the new positioning, using jquery.
its a good looking start.
Ryan
@ispeakcomputer
Jun 02 2016 06:45
@Jaketh I was curious about that. sounds easier then I was thinking .
thanks @Jaketh !
CamperBot
@camperbot
Jun 02 2016 06:45
needsmorecoffee sends brownie points to @jaketh :sparkles: :thumbsup: :sparkles:
:cookie: 302 | @jaketh |http://www.freecodecamp.com/jaketh
Jake
@Jaketh
Jun 02 2016 06:45
no problema @needsMoreCoffee
on your class with the new positioning, and the transition affect.
Theres also a bunch of effects in jquery you could use, like slideIn() and such, but adding classes will give you the most control of what you're doing I thing.
think*
nicolepepperoni
@pnicole96
Jun 02 2016 06:53
Is there anyone online right now?
Jake
@Jaketh
Jun 02 2016 06:53
yep
buiphuking
@buiphuking
Jun 02 2016 06:54
is anyone good at foundation css? help me plzzzzzzzzzzzz?
nicolepepperoni
@pnicole96
Jun 02 2016 06:55
Great! I'm trying to build my portfolio and my nav bar isn't looking how I want it to. There is a little space at the top left corner showing the background when I want it to stay completely at the top.
I don't know what to do to fix it
Jake
@Jaketh
Jun 02 2016 07:01
one sec I'll look
you want 'about' to go flush against the left side of the screen?
nicolepepperoni
@pnicole96
Jun 02 2016 07:02
I would like for that little grey space to be gone
Jake
@Jaketh
Jun 02 2016 07:03
remove the 15px of left padding from .container-fluid.
.container-fluid{
padding-left:0;
}
all better? @pnicole96
nicolepepperoni
@pnicole96
Jun 02 2016 07:05
That was fixed, now how do I get more grey space showing on the sides of the padding of my paragraph tag?
Jake
@Jaketh
Jun 02 2016 07:07
set the width of what you want to be thinner. then give it a margin on the left and right of auto
.thing-i-want-centered{
width:50%;
margin: 0 auto;
}
nicolepepperoni
@pnicole96
Jun 02 2016 07:09
thank you! @Jaketh
CamperBot
@camperbot
Jun 02 2016 07:09
pnicole96 sends brownie points to @jaketh :sparkles: :thumbsup: :sparkles:
:cookie: 304 | @jaketh |http://www.freecodecamp.com/jaketh
Jake
@Jaketh
Jun 02 2016 07:09
:)
nicolepepperoni
@pnicole96
Jun 02 2016 07:11
Can I make columns with bootstrap using pictures or no?
redixhumayun
@redixhumayun
Jun 02 2016 07:18

http://codepen.io/redixhumayun/pen/beGKLq?editors=1111

Hey, guys posted about this earlier. Can anybody tell me why I can't append the image from my json to the div tag I created via jquery in my code?

Here's the snippet of code I'm using for this

$.each(res, function(key) {
console.log(res[key]);
$('<div/>', {
id:'pic',
}).appendTo("#imgur");
$("#pic").css("background-color","red");
$("#pic").text("Welcome");
("#pic").appendTo('<img id="imgur" src='+res[key].thumbnail.source+'/>');
if(res[key].extract){
console.log(res[key].pageid);
}
});
});
}
});

kirbyedy
@kirbyedy
Jun 02 2016 07:23
@redixhumayun your console says: Uncaught TypeError: "#pic".appendTo is not a function
Richard Andrews
@Whiplash5057
Jun 02 2016 07:23
guys need help
Bruce Young
@mutantspore
Jun 02 2016 07:29
@redixhumayun first issues is lack of $ on that append line
Cindy Hsu
@Cinders-P
Jun 02 2016 07:31
https://www.crowfall.com/en/ how are animated backgrounds like this done?
Bruce Young
@mutantspore
Jun 02 2016 07:31
@Whiplash5057 second issue is not quite right quote marks in that line
redixhumayun
@redixhumayun
Jun 02 2016 07:32
@kirbyedy I tried the prepend function, still won't work
Richard Andrews
@Whiplash5057
Jun 02 2016 07:33
@mutantspore I didn't get you ??
redixhumayun
@redixhumayun
Jun 02 2016 07:33
@mutantspore Fixed that $ sign, still nothing
Bruce Young
@mutantspore
Jun 02 2016 07:34
@redixhumayun yes i’m working through the list of issues
Chris Cullen
@123xylem
Jun 02 2016 07:35
Quick Question: Can someone tell me what my error is?
function translatePigLatin(str) {
  str.split("");
  for(i=0;i<str.length;i++){
    if(str[i]!= /^[aeiou]/i){
   str=   str.split(str[i]).join("")+"ay" ;

    }
    else if (str.charAt(0)==/[aeiou]/i){
    str=  str.split().join("")  +"way";
    }

  return str;}
}

translatePigLatin("aonsonant");
Bruce Young
@mutantspore
Jun 02 2016 07:35
@redixhumayun as you can see I also used thumbnails
http://codepen.io/MutantSpore/full/rVRwor/
Richard Andrews
@Whiplash5057
Jun 02 2016 07:40
IT WORKED GUYS ...!!AWESOME
Bruce Young
@mutantspore
Jun 02 2016 07:41
@Whiplash5057 ok i’m getting mixed up between people.. what didn’t you get ? what did I say?
@Whiplash5057 ok yes.. mixed up between people sorry
Richard Andrews
@Whiplash5057
Jun 02 2016 07:44
@mutantspore LOL...!! I fixed my issue ...!! LOL thanks!!
CamperBot
@camperbot
Jun 02 2016 07:44
whiplash5057 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1683 | @mutantspore |http://www.freecodecamp.com/mutantspore
Jonathan Mitchell
@Vanhealen
Jun 02 2016 07:53
@Jaketh yeah I have that in there already
http://codepen.io/vanhealen/pen/beNBRe
96street
@96street
Jun 02 2016 07:55
where can I get a quotes API?
I have one but not working
Bruce Young
@mutantspore
Jun 02 2016 07:57
@redixhumayun ok I have the images bit working but as I can’t quite follow your other bit , which seems to be failing when I look at the resulting source, I simply appended them to the imgur ID.. just to show them.
http://codepen.io/MutantSpore/pen/WxbLae?editors=1011
Jonathan Mitchell
@Vanhealen
Jun 02 2016 07:59
@96street I wrote all my quotes by hand because I hand picked them.
I only have about 60 quotes in there
but you can get a quotes api easily by doing some basic googling
google "quotesondesign" quotes api
Christian Todd
@chrstntdd
Jun 02 2016 08:10
@96street yeah, if the API isn't working out you can always store a ton of quotes into an array as separate strings and iterate though them to get the same result.
Bruce Young
@mutantspore
Jun 02 2016 08:10
@96street can we see what’s not working for you. perhaps it can be fixed
Can someone explain to me how I can align the H3 title 'Start and the red round div ?
I'm stuck on this for way too long
And I feel stupid now x'(
kirbyedy
@kirbyedy
Jun 02 2016 08:26
text-align: center ?
on your center div
Ashutosh Narang
@Survivor75
Jun 02 2016 08:26

Media Query Doubt : What parameters do we put inside the curly braces in the @media section of the code below?
We use the following media queries in our Less files to create the key breakpoints in our grid system.
/ Extra small devices (phones, less than 768px) /
/ No media query since this is the default in Bootstrap /

/ Small devices (tablets, 768px and up) /
@media (min-width: @screen-sm-min) { ... }

/ Medium devices (desktops, 992px and up) /
@media (min-width: @screen-md-min) { ... }

/ Large devices (large desktops, 1200px and up) /
@media (min-width: @screen-lg-min) { ... }

kirbyedy
@kirbyedy
Jun 02 2016 08:28
css
Fred
@Fred-Saru
Jun 02 2016 08:29
@kirbyedy No text-align is for horizontal alignement, what I'm trying to do is to have the Start text align with the red circle.
chetanmahore
@chetanmahore
Jun 02 2016 08:29
Hows this
Bruce Young
@mutantspore
Jun 02 2016 08:31
@Survivor75 the changes to your CSS that you want to make
anthonygallina1
@anthonygallina1
Jun 02 2016 08:31
@chetanmahore Very nicely centered and responsive
Bruce Young
@mutantspore
Jun 02 2016 08:32
@Survivor75 based on the different sized screens .. such as a change in font size or width/height of an image
chetanmahore
@chetanmahore
Jun 02 2016 08:32
@anthonygallina1 thanks you :)
CamperBot
@camperbot
Jun 02 2016 08:32
chetanmahore sends brownie points to @anthonygallina1 :sparkles: :thumbsup: :sparkles:
:star2: 1832 | @anthonygallina1 |http://www.freecodecamp.com/anthonygallina1
Bruce Young
@mutantspore
Jun 02 2016 08:33
@chetanmahore should have been about Don Bradman ;)
anthonygallina1
@anthonygallina1
Jun 02 2016 08:34
:)
Ashutosh Narang
@Survivor75
Jun 02 2016 08:34
Thanks a lot @mutantspore
CamperBot
@camperbot
Jun 02 2016 08:34
survivor75 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1684 | @mutantspore |http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Jun 02 2016 08:40
@Vanhealen does the site come with anti-nausea medication? lol
Ashutosh Narang
@Survivor75
Jun 02 2016 08:41
Is there any way I can make an app that extracts texts for quotes from some website so that I can use it in my app?
anthonygallina1
@anthonygallina1
Jun 02 2016 08:44
@Vanhealen I like your javascript
kirbyedy
@kirbyedy
Jun 02 2016 08:45
@Fred-Saru oh right, in that case it would be maybe better to make an ul
anthonygallina1
@anthonygallina1
Jun 02 2016 08:45
@kirbyedy hi
kirbyedy
@kirbyedy
Jun 02 2016 08:46
@anthonygallina1 hi
nicolepepperoni
@pnicole96
Jun 02 2016 08:47
Is anyone here familiar with carousels in bootstrap?
anthonygallina1
@anthonygallina1
Jun 02 2016 08:48
@pnicole96 What did you need?
Bruce Young
@mutantspore
Jun 02 2016 08:48
@pnicole96 once months ago. you’ll need to add in bootstrap.js
kirbyedy
@kirbyedy
Jun 02 2016 08:48
nicolepepperoni
@pnicole96
Jun 02 2016 08:49
I added one to my portfolio and it's looking a little funny to me xD
anthonygallina1
@anthonygallina1
Jun 02 2016 08:50
@pnicole96 I messed around with this effect once http://fullstackwebdesign.com/
Jonathan Mitchell
@Vanhealen
Jun 02 2016 08:51
@anthonygallina1 you're down with vanillaJS? haha
anthonygallina1
@anthonygallina1
Jun 02 2016 08:51
@kirbyedy thank you for the link
CamperBot
@camperbot
Jun 02 2016 08:51
anthonygallina1 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1049 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Jonathan Mitchell
@Vanhealen
Jun 02 2016 08:51
@anthonygallina1 I still have to do the formatting for the bootstrap stuff,
So am I going to have to move the carousel?
anthonygallina1
@anthonygallina1
Jun 02 2016 08:53
@Vanhealen Still like your javascript
Bruce Young
@mutantspore
Jun 02 2016 08:54
@pnicole96 @pnicole96 yes as was saying.. you need to add in jquery and bootstrap.js in that order .. you already have bootstrap.css
nicolepepperoni
@pnicole96
Jun 02 2016 08:54
whats the link for jquery?
Bruce Young
@mutantspore
Jun 02 2016 08:55
just use the quick add in codepen settings
anthonygallina1
@anthonygallina1
Jun 02 2016 08:55
But it is in the settings like @mutantspore said check the gear on top of the js window
@pnicole96 you need all three files. bootstrap.css, jQuery.js and bootstrap.js (the last two in that order)
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 08:57

I am in the Basic Front End Development Project...where I am supposed to make a personal portfolio page....I have made one....
Codepen link : https://codepen.io/alfarhanz/full/YWPBGB/

I am facing some problems like....The menu does not opens upon clicking the menu button(which appears as the browser window is resized)....
And, also when the browser window is resized....the contents of different <div> come over each other.....It's something to do with the "position" of the <div> but I could not solve it....
Help needed...Thanks in advance....

nicolepepperoni
@pnicole96
Jun 02 2016 08:57
I didn't see that little gear, my apologies
anthonygallina1
@anthonygallina1
Jun 02 2016 08:57
np
@pnicole96 Somebody had to tell me where it was I do better with code than interfaces
Bruce Young
@mutantspore
Jun 02 2016 08:58
@Alfarhanz your issue is the same as @pnicole96 add in bootstrap.js in the JS settings
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 09:01
thanx @mutantspore ...that solved the problem......but what about the problem with the content of different of <div> overlapping each other upon resizing the window..??
CamperBot
@camperbot
Jun 02 2016 09:01
alfarhanz sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1685 | @mutantspore |http://www.freecodecamp.com/mutantspore
Khan Wali
@3kc3ntrik
Jun 02 2016 09:01
@Alfarhanz click on the gear box next to js and add bootstrap.js
Jonathan Mitchell
@Vanhealen
Jun 02 2016 09:02
@anthonygallina1 its my first program. Why
@anthonygallina1 Still have to add functionality to the color arrangement so the contrast is large enough between text and background colors
Bruce Young
@mutantspore
Jun 02 2016 09:04
@Alfarhanz which div’s, the projects?
nicolepepperoni
@pnicole96
Jun 02 2016 09:05
@anthonygallina1 @mutantspore so I move all the code for the carousel into the js section now? How do I remove the gradient on the sides and center the indicators, and change the timing of the picture speed? Would adding a background color and width percentage be the same as a paragraph tag?
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 09:05
@mutantspore ...just resize the window......into smaller dimensions....you will see that the contents are overlapping with each other....I need to remove that..
Bruce Young
@mutantspore
Jun 02 2016 09:08
@Alfarhanz @Alfarhanz yes I understand what you are saying but i’m not seeing it so I asked which part specifically? let me play with your bootstrap cols
anthonygallina1
@anthonygallina1
Jun 02 2016 09:11
@pnicole96 Is this CSS 6? .carousel-inner > .item > img, .carousel-inner > .item > a > img
Bruce Young
@mutantspore
Jun 02 2016 09:12
@Alfarhanz I see rows of 2 cols and when i narrow it it becomes 1 col. At no point do the images overlap
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 09:13
@mutantspore Not the images....It is the social links which are coming over the "About" part...
anthonygallina1
@anthonygallina1
Jun 02 2016 09:13
@pnicole96 not sure I have seen that before But it is working
nicolepepperoni
@pnicole96
Jun 02 2016 09:13
@anthonygallina1 I'm not too sure, I found it on an example and thought it would work
anthonygallina1
@anthonygallina1
Jun 02 2016 09:14
@pnicole96 The CSS6 was a jk
@pnicole96 Looks advanced though
Bruce Young
@mutantspore
Jun 02 2016 09:14
@Alfarhanz there’s an unclosed div (th eother end of teh id=wrapper.. just mentioning it
nicolepepperoni
@pnicole96
Jun 02 2016 09:15
@anthonygallina1 I'm bad at telling when people are joking sometimes xD
anthonygallina1
@anthonygallina1
Jun 02 2016 09:16
@pnicole96 So it functions on straight CSS animation?
nicolepepperoni
@pnicole96
Jun 02 2016 09:16
I know its working for the images, however I would like for the buttons I have to match up with the width of the paragraph
Apparently
Bruce Young
@mutantspore
Jun 02 2016 09:21
@Alfarhanz perhaps you could use @media queries to change the social icon size in your css
@Alfarhanz I have a similar icon setup to yours but mine are far smaller and I used a <ul> to line them up
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 09:23
@mutantspore ...ok..will try it den..
Bruce Young
@mutantspore
Jun 02 2016 09:23
@Alfarhanz @Alfarhanz with display: inline
anthonygallina1
@anthonygallina1
Jun 02 2016 09:24
@pnicole96 woow it just started working while I was pondering it. But on page refresh stoped.
Alfarhan Zahedi
@alfarhanz
Jun 02 2016 09:25
@mutantspore ..okie
nicolepepperoni
@pnicole96
Jun 02 2016 09:27
@anthonygallina1 hahaha, try refreshing again. But how will i move the buttons I have inward?
anthonygallina1
@anthonygallina1
Jun 02 2016 09:34
@pnicole96 appears putting them in a div proper breaks it
Anthony Ho
@chiho13
Jun 02 2016 09:35
anyone doing finders keepers?
96street
@96street
Jun 02 2016 09:35

Can someone tell me why my JSON function isn't working? http://codepen.io/kingdezz/pen/vKEQMZ

The "Quote goes here" should change when the button is clicked

nicolepepperoni
@pnicole96
Jun 02 2016 09:35
@anthonygallina1 ???????
Richard Andrews
@Whiplash5057
Jun 02 2016 09:36
Guys need help !!
@96street your getQuote is not defined properly
96street
@96street
Jun 02 2016 09:38
how so? @Whiplash5057
Richard Andrews
@Whiplash5057
Jun 02 2016 09:39
The first line of your JS
anthonygallina1
@anthonygallina1
Jun 02 2016 09:40
</div>
    <!-- left right ctrl-->
    <a class="left carousel-control" href="#myCarousel" role="button" data-silde="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"</span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"</span>
      <span class="sr-only">Next</span>
    </a>

  </div>
@pnicole96 Not shure I have worked with code like this before. Very interesting though
Bruce Young
@mutantspore
Jun 02 2016 09:40
@96street you don’t have jQuery loaded
96street
@96street
Jun 02 2016 09:40
whoops
oh yeah i needa remove that
but that's not affecting anything is it? @Whiplash5057
nicolepepperoni
@pnicole96
Jun 02 2016 09:41
@anthonygallina1 I did get it from an example
Richard Andrews
@Whiplash5057
Jun 02 2016 09:41
@96street there are quiet a few mistakes it it
the quotes is a class not a id ...in Your JS
96street
@96street
Jun 02 2016 09:41
ty
what other mistakes?
Bruce Young
@mutantspore
Jun 02 2016 09:42
@96street did you load jquery ???
anthonygallina1
@anthonygallina1
Jun 02 2016 09:42
@pnicole96 Did you say this is bootstrap carousel?
nicolepepperoni
@pnicole96
Jun 02 2016 09:43
@anthonygallina1 yes
Would you like the link to where I got the code for it?
anthonygallina1
@anthonygallina1
Jun 02 2016 09:44
nicolepepperoni
@pnicole96
Jun 02 2016 09:45
Nope
Bruce Young
@mutantspore
Jun 02 2016 09:45
anthonygallina1
@anthonygallina1
Jun 02 2016 09:45
Oh jeez I never did .asp or .net
@pnicole96 thank you
CamperBot
@camperbot
Jun 02 2016 09:45
anthonygallina1 sends brownie points to @pnicole96 :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @pnicole96 |http://www.freecodecamp.com/pnicole96
nicolepepperoni
@pnicole96
Jun 02 2016 09:46
No problem, thank you for answering my questions that I've had so far
@anthonygallina1 thanks
CamperBot
@camperbot
Jun 02 2016 09:46
pnicole96 sends brownie points to @anthonygallina1 :sparkles: :thumbsup: :sparkles:
:star2: 1833 | @anthonygallina1 |http://www.freecodecamp.com/anthonygallina1
anthonygallina1
@anthonygallina1
Jun 02 2016 09:49
@pnicole96 was neither asp nor .net but the example is in inclosed divs
nicolepepperoni
@pnicole96
Jun 02 2016 09:49
@anthonygallina1 may you rephrase that please?
96street
@96street
Jun 02 2016 09:49
@mutantspore Yours doesn't work?
anthonygallina1
@anthonygallina1
Jun 02 2016 09:50
@pnicole96 the code above was from your pen but the buttons are not in a div.
96street
@96street
Jun 02 2016 09:50
@mutantspore And can you explain what this is doing?
a[0].content
Bruce Young
@mutantspore
Jun 02 2016 09:51
@96street in the browser? "works for me"
nicolepepperoni
@pnicole96
Jun 02 2016 09:51
@anthonygallina1 so if I put them in a div, I could move them to where I want to??
Bruce Young
@mutantspore
Jun 02 2016 09:51
@96street I’ll explain but first are you saying the pen I gave you doesn’t work?
96street
@96street
Jun 02 2016 09:52
Yes @mutantspore
can others confirm that?
perhaps you have some sort of ad blocker
96street
@96street
Jun 02 2016 09:53
I'm pressing Get Quote and nothing happens. Ok i'll disable adBlocker
Roberto Di Lillo
@koop4
Jun 02 2016 09:53
even with adBlock disable nothing happen
96street
@96street
Jun 02 2016 09:54
Yep^
@mutantspore Still doesn't work
Bruce Young
@mutantspore
Jun 02 2016 09:54
well you must add .. it doesn’t work …for you.. as it’s obviously working for me.
in both Safari and Chrome on a mac
Anthony Ho
@chiho13
Jun 02 2016 09:56
finders keepers?
Bruce Young
@mutantspore
Jun 02 2016 09:56
Screen Shot 2016-06-02 at 5.56.28 AM.png
96street
@96street
Jun 02 2016 09:57
Hmm that's weird, i'll try find out why it's not working for me
@mutantspore
Can you first explain what
a[0].content
is doing?
Bruce Young
@mutantspore
Jun 02 2016 09:58
you chose to call your data a and if you look in the browser dev console you will see the object. the returned quotes are in an array of one item. the .content is what they called the quote.
Screen Shot 2016-06-02 at 5.59.08 AM.png
96street
@96street
Jun 02 2016 09:59
why is it a[0]?
there's only one object of content
Bruce Young
@mutantspore
Jun 02 2016 10:00
I said they send back an array of quotes..with just one in it
you asked for one in the url
Screen Shot 2016-06-02 at 5.59.08 AM.png
i asked it to send 2 that time
96street
@96street
Jun 02 2016 10:03
ty @mutantspore
CamperBot
@camperbot
Jun 02 2016 10:03
96street sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1686 | @mutantspore |http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:03
try it again . i wrapped it all in a document ready function
http://codepen.io/MutantSpore/pen/oLgmOr
96street
@96street
Jun 02 2016 10:04
Still not
i'll show u the error i'm getting
Bruce Young
@mutantspore
Jun 02 2016 10:05
ok that would be nice lol
Bruce Young
@mutantspore
Jun 02 2016 10:06
do you have https everywhere as that seems to be an issue too
96street
@96street
Jun 02 2016 10:07
on my browser? yeah
Bruce Young
@mutantspore
Jun 02 2016 10:07
well
96street
@96street
Jun 02 2016 10:08
so should I do something because of that?
Bruce Young
@mutantspore
Jun 02 2016 10:08
this is the codepen from teh actual API docs that they provide
http://codepen.io/chriscoyier/pen/MwaXpq
@96street turn it off
@96street if that example doesn’t work for you.. it’s you lol
96street
@96street
Jun 02 2016 10:09
what am i turning off?
Bruce Young
@mutantspore
Jun 02 2016 10:09
does that example work?
96street
@96street
Jun 02 2016 10:10
You just sent the JS?
or should i post that to the other JS ?
Bruce Young
@mutantspore
Jun 02 2016 10:10
@96street i just posted a pen click on teh pen URL to open it
see if it runs
96street
@96street
Jun 02 2016 10:11
Yeah you just sent the JS
html/css is empty
Bruce Young
@mutantspore
Jun 02 2016 10:11
no i didn't
yes it’s just js but it wil put stuff on teh page
96street
@96street
Jun 02 2016 10:11
can you send the link again?
pretty sure html/css is empty
Bruce Young
@mutantspore
Jun 02 2016 10:12
yes it may be empty but the thing will run
just click on teh URL
not the big image
were you clicking on run pen before too? don’t do that as it wil try to run imbeddedin gitter
96street
@96street
Jun 02 2016 10:13
Screen Shot 2016-06-02 at 8.12.42 pm.png
Clem
@ctataru
Jun 02 2016 10:13
hey guys. i'm currently working on the tic tac toe game, but i think i'm making it in a complicated way. i was thinking of coding it with a function for each move (first move, second move, third move), but it seems like it'll be way too many if/else functions. i've already been working on it for a few hours, and i only finished the firstMove() function.
am i doing this right?
http://codepen.io/wise/pen/dXbqMK?editors=0010
Bruce Young
@mutantspore
Jun 02 2016 10:14
@96street please.. that js wil generate a page. how are you running this? just click the pen url not the imaage of the pen
@96street @96street all I have done is send you the URL of teh demo that they provide at the bottom of this page
http://quotesondesign.com/api-v4-0/
in that case . press the result tab
96street
@96street
Jun 02 2016 10:17
Sorry i'm abit confused the JS on it's own won't do anything?
Do you want me to copy that JS to my other file with the html/css? @mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:18
of course it will. it gets the quote from teh api and appends it to the body
@96street i don’t want you to copy anything i want to show you that the api works and my code is almost identical to their demo
96street
@96street
Jun 02 2016 10:19
Oh right you're just trying to show me the code
Anthony Ho
@chiho13
Jun 02 2016 10:19
these bonfires make me feel like a failure
96street
@96street
Jun 02 2016 10:19
But other people on here said it doesn't work? @mutantspore
Clem
@ctataru
Jun 02 2016 10:19
amen @chiho13
Bruce Young
@mutantspore
Jun 02 2016 10:20
@96street I’m trying to seee if it will runon your system / browser as you said mine didn’t .. the one I’ve sent .. their demo should run. if it does’t it’s something about your end
96street
@96street
Jun 02 2016 10:20
So this one works for you? http://codepen.io/MutantSpore/pen/oLgmOr
Bruce Young
@mutantspore
Jun 02 2016 10:20
@96street one otehr person .. and who knows what they actually did. I’m not making stuff up to annoy you.
Anthony Ho
@chiho13
Jun 02 2016 10:21
i managed to do some intermediate bonfires, skipped fibonacci and lcm
here's my finders keepers code so far

function findElement(arr, func) {
  //var num = 0;

  for ( var i = 0; i < arr.length; i++) {
     newarr = arr[i].filter(func);
  }
  return newarr;
}

findElement([1, 2, 3, 4], function(num){ return num % 2 === 0; });
96street
@96street
Jun 02 2016 10:22
I know it works on your system, i'm saying it doesn't work for anyone outside your browser @mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:22
yes it works .. did you run teh demo they provide? that’s the key issue here. if their demo doesn’t run
96street
@96street
Jun 02 2016 10:23
I'll copy their code now
Bruce Young
@mutantspore
Jun 02 2016 10:23
nooo just run it!!
ok I dont know why you refuse to run their demo
96street
@96street
Jun 02 2016 10:24
Do you mean run on my console? @mutantspore
If so i'm getting the same error as before
Bruce Young
@mutantspore
Jun 02 2016 10:25
all you have to do is click this url http://codepen.io/chriscoyier/full/MwaXpq/
jsut the url
not the picture
96street
@96street
Jun 02 2016 10:25
I did
nothing happens
white screen
Bruce Young
@mutantspore
Jun 02 2016 10:26
ok well you have som eissue there you need to resolve as that is teh demo provided by the api people
96street
@96street
Jun 02 2016 10:26
Can someone on here please click that url and see if it works for them?
Ok i just opened it in firefox and it works @mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:27
@96street you have already told me that you are running a thing called “https anywehre “ or something like that
right!
you have something in your setup..chrome i bet
96street
@96street
Jun 02 2016 10:27
Soz bout that..i'll try see what the problem is
Ty for the help @mutantspore
CamperBot
@camperbot
Jun 02 2016 10:28
96street sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: 96street already gave mutantspore points
Richard Andrews
@Whiplash5057
Jun 02 2016 10:30
Guys need help
Bruce Young
@mutantspore
Jun 02 2016 10:31
@Whiplash5057 lol ok then
Richard Andrews
@Whiplash5057
Jun 02 2016 10:31
@mutantspore Need help
It is something small
Bruce Young
@mutantspore
Jun 02 2016 10:31
lol yes right… fire away :)
When the api loads and I hover onto it ...The blue underline comes for each link ...I don't want that.
I tried text-decoration: none
not working
@mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:35
@Whiplash5057
a:link {
  text-decoration: none !important;
  outline: 0;
}
Richard Andrews
@Whiplash5057
Jun 02 2016 10:37
@mutantspore AWESOME thankyou
CamperBot
@camperbot
Jun 02 2016 10:37
whiplash5057 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1687 | @mutantspore |http://www.freecodecamp.com/mutantspore
Richard Andrews
@Whiplash5057
Jun 02 2016 10:37
@mutantspore something is still not working
Bruce Young
@mutantspore
Jun 02 2016 10:37
@Whiplash5057 I think the outline bit is more for buttons
you can’t clear the old stuff?
Why is the first link that is generated blue in color?
@mutantspore Old stuff as in?
Bruce Young
@mutantspore
Jun 02 2016 10:40
do you intend to clear the previous search or is that part of your effect?
Richard Andrews
@Whiplash5057
Jun 02 2016 10:40
@mutantspore I just saw that ..damn
Yes
Yes
I'll fix that and come back :smile: @mutantspore
Bruce Young
@mutantspore
Jun 02 2016 10:45
@Whiplash5057 it’s blue because you have been to that page.. try a different search than you have been testing
Manuel Kessel
@liproqq
Jun 02 2016 10:46
Can someone explain why the input form is not inline?
http://codepen.io/MFK-GER/pen/ezmxqj
Bruce Young
@mutantspore
Jun 02 2016 10:47
@Whiplash5057 you’ll need this i think
a:visited { 
    color: white;
}
Richard Andrews
@Whiplash5057
Jun 02 2016 10:49
@mutantspore I'm done ....!! check it out!!!
Bruce Young
@mutantspore
Jun 02 2016 10:50
@Whiplash5057 lol ok it works now. hard to read but works :)
Richard Andrews
@Whiplash5057
Jun 02 2016 10:50
@mutantspore Damn ...! I didn't consider that ..LOL have to fix that...!! I'll get back
Manuel Kessel
@liproqq
Jun 02 2016 10:52
@Whiplash5057 You kept your typo consistent. ;)
Richard Andrews
@Whiplash5057
Jun 02 2016 10:54
@liproqq which typo?
Harshit Anand
@nerocool996
Jun 02 2016 10:55
I need some help. My code changes unit to Celsius only once., the reverse is not working :worried:. http://codepen.io/nerocool996/pen/yJyQrr?editors=1010
The problem is that the click event is generated only once :(;
Greg Duncan
@GregatGit
Jun 02 2016 10:55
@liproqq To keep things on the same line you should keep all the divs you want in the same line nested in a div with class="row"
Richard Andrews
@Whiplash5057
Jun 02 2016 10:55
@mutantspore hey what is a: visibility..? I don't know what that pseudoelement does
Manuel Kessel
@liproqq
Jun 02 2016 10:57
@Whiplash5057 straWarsLogo
Greg Duncan
@GregatGit
Jun 02 2016 10:57
@liproqq It is worth taking a bit of time to understand how the grid system works - it will save you time in the long run http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp
Richard Andrews
@Whiplash5057
Jun 02 2016 10:58
@liproqq Damn You...!! :smile:
Manuel Kessel
@liproqq
Jun 02 2016 10:58
@GregatGit I tried it.
@GregatGit Yes I know the grid system of bootstrap. It usually works. but there seems to be a problem with input-group.
Bruce Young
@mutantspore
Jun 02 2016 11:00
@Whiplash5057 not sure if that’s a “thing” this is the normal visibility . do you have a link for it?
http://www.w3schools.com/cssref/pr_class_visibility.asp
Jowze
@Jowze
Jun 02 2016 11:01
Hi guys. I'm almost done with the wikipedia viewer exercise
I'm stuck on one thing though
I cannot get the search to be submitted when pressing enter
this is driving me nuts
any ideas?
Richard Andrews
@Whiplash5057
Jun 02 2016 11:02
@mutantspore Thanks
CamperBot
@camperbot
Jun 02 2016 11:02
whiplash5057 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: whiplash5057 already gave mutantspore points
Greg Duncan
@GregatGit
Jun 02 2016 11:03
@Whiplash5057 Great wikipedia project - I love it
Manuel Kessel
@liproqq
Jun 02 2016 11:04
@Jowze It works for me
Greg Duncan
@GregatGit
Jun 02 2016 11:04
@Jowze I had the same problem too - this should help http://www.mkyong.com/jquery/how-to-check-if-an-enter-key-is-pressed-with-jquery/
Jowze
@Jowze
Jun 02 2016 11:05
For you it works when you press enter?
Richard Andrews
@Whiplash5057
Jun 02 2016 11:05
@GregatGit Thanks
CamperBot
@camperbot
Jun 02 2016 11:05
whiplash5057 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 550 | @gregatgit |http://www.freecodecamp.com/gregatgit
Jowze
@Jowze
Jun 02 2016 11:06
@liproqq for me the search term disapears but results do not show up
@GregatGit I'll check the link, thanks
CamperBot
@camperbot
Jun 02 2016 11:06
jowze sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
Manuel Kessel
@liproqq
Jun 02 2016 11:06
@Jowze Oh I misread your question. sorry.
CamperBot
@camperbot
Jun 02 2016 11:06
:cookie: 551 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jun 02 2016 11:10
@Whiplash5057 I love how the text disappears - Did you you that with css or the js?
Bruce Young
@mutantspore
Jun 02 2016 11:15
@Jowze using a form with a Enter/Return causes a page reload as the form is submitted. you need to use an event handler and event.preventDefault(); I’m sure @GregatGit page wil help
@Jowze removing the form tag and using div may end up being necessary depending on how you do it.
Jowze
@Jowze
Jun 02 2016 11:22
@mutantspore thanks for the tip
CamperBot
@camperbot
Jun 02 2016 11:22
jowze sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1688 | @mutantspore |http://www.freecodecamp.com/mutantspore
Greg Duncan
@GregatGit
Jun 02 2016 11:23

@Jowze

$('#test').click(function(){
  var mySearch = $('#theSearch').val();
  alert(mySearch);
  testResults(mySearch);
});
  function testResults (form) {

      var search = form;

and give the corrosponding ids in the html and delete the onclick function in the html

Richard Andrews
@Whiplash5057
Jun 02 2016 11:26
@GregatGit CSS only...!!
Greg Duncan
@GregatGit
Jun 02 2016 11:27
@Whiplash5057 You're a wizzard!
@Jowze <INPUT placeholder="wiki search" id="theSearch">
Anush Reddy
@anushreddy
Jun 02 2016 11:39
can anyone help me ?
Islam Ibakaev
@dagman
Jun 02 2016 11:39
hey guys portfolio again -> http://codepen.io/dagman/full/VjwGLy/
Anush Reddy
@anushreddy
Jun 02 2016 11:44
nice portfolio
nicolepepperoni
@pnicole96
Jun 02 2016 12:01
I added a carousel to my portfolio, and I can't figure out why my previous button is not working. May someone check it out for me?
Greg Duncan
@GregatGit
Jun 02 2016 12:02
@pnicole96 we can try
Greg Duncan
@GregatGit
Jun 02 2016 12:15
@pnicole96 i think you just have to remove the id, so <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
nicolepepperoni
@pnicole96
Jun 02 2016 12:17
@GregatGit It's not working still
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true" </span>
      <span class="sr-only">Previous</span>
    </a>
nicolepepperoni
@pnicole96
Jun 02 2016 12:20
I had a spelling error with slide
Greg Duncan
@GregatGit
Jun 02 2016 12:20
typos - they can really hurt
nicolepepperoni
@pnicole96
Jun 02 2016 12:21
It was spelled "silde"
Thank you for making me realize it @GregatGit
CamperBot
@camperbot
Jun 02 2016 12:21
pnicole96 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 552 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jun 02 2016 12:21
:+1:
@pnicole96 Have you seen the bootstrap scroll-spy its awesome http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp
nicolepepperoni
@pnicole96
Jun 02 2016 12:23
I use that site for guidance, it's nice to know others that use it as well. I'll check it out
I should use that feature
MilosBastaja
@MilosBastaja
Jun 02 2016 12:24
Hello all can someone help me
im building Tribute Page and im trying to put toggleable tabs on my page but its not working
i put tabs on my site but when i click on them its not working
Bhavik
@BhavikSheth
Jun 02 2016 12:37
Hi guys.
For the Random Quote Machine challenge, do I have to use an api or create my own object?
Clyde
@hea-hea
Jun 02 2016 12:40
@BhavikSheth you don't have to use API
uday
@udaychauhan
Jun 02 2016 12:42
hey guys can anyone tell me how to use fonts
Clyde
@hea-hea
Jun 02 2016 12:42
Any idea why the awesomefont icons look smaller in the full view, than they do in the editor mode? Did anyone else have this problem? Here's my website: http://codepen.io/hea-hea/pen/dXPMZE
uday
@udaychauhan
Jun 02 2016 12:42
can somebody give me the urls as we were taught in the tutorials
Clyde
@hea-hea
Jun 02 2016 12:43
@udaychauhan I'm not sure what you mean, but you can use https://www.google.com/fonts choose whatever font you like and click 'add to collection'
@udaychauhan Then, while viewing the collection you can copy the code to paste in the <head> section and in CSS - hope this helps :)
uday
@udaychauhan
Jun 02 2016 12:45
ya that is what I was asking
like the way we used lobster font
thanks clyde
Clyde
@hea-hea
Jun 02 2016 12:45
@udaychauhan :)
uday
@udaychauhan
Jun 02 2016 12:48
Also @hea-hea which font would be the best for my tribute challenge
or maybe generaly which would be the best
anthonygallina1
@anthonygallina1
Jun 02 2016 12:52
@hea-hea If you use this class does it still do it? tweet btn btn-md
@hea-hea Good job :)
Clyde
@hea-hea
Jun 02 2016 12:55
@anthonygallina1 you mean adding the button class to the icon itself? it didn't change anything :(
@udaychauhan who do you want to do it about? :) best to keep it simple
anthonygallina1
@anthonygallina1
Jun 02 2016 12:58
@hea-hea yes but without the btn-default
still nothing
uday
@udaychauhan
Jun 02 2016 12:59
but which font would look generally
everywhere
@hea-hea
Clyde
@hea-hea
Jun 02 2016 13:00
@anthonygallina1 hm, but the btn-default is just at the "next quote" button and not at the icons
anthonygallina1
@anthonygallina1
Jun 02 2016 13:00
@hea-hea yup still nothing If all else fails can you bring down to your hard drive so you can use dev tools and see what is affecting it?
Bruce Young
@mutantspore
Jun 02 2016 13:02
@udaychauhan Open Sans and Roboto are widlely used these days and can be used together. Say one for bigger text and the other for smaller. The google fonts page does give advice on pairing of fonts too.
Clyde
@hea-hea
Jun 02 2016 13:02
@anthonygallina1 Maybe I will try to do it differently, I have trouble aligning the buttons as well :/
Bruce Young
@mutantspore
Jun 02 2016 13:02
@udaychauhan I also like Lato
@udaychauhan don’t put more than 2 (maybe 3 depending on their use) on a page …
uday
@udaychauhan
Jun 02 2016 13:03
okay
thanks @mutantspore
CamperBot
@camperbot
Jun 02 2016 13:04
udaychauhan sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1689 | @mutantspore |http://www.freecodecamp.com/mutantspore
Lisa
@aGirlWhoCodes
Jun 02 2016 13:19
Hi Hello! I am working on Twitch App and I am stuck for some time now. my if-statement seems to work to good. It's printing out the accounts which are unavailable to many times. While my if else and else statement don't seem to work at all. Also the icon doesn't want to change.. Is there something with my getJSON url? Or what can be the reason why this information doesn't reach the results variable? http://codepen.io/Didi987/pen/BzBpwq?editors=1010 Can someone please take a look?
RompePC
@RompePC
Jun 02 2016 13:26
@aGirlWhoCodes Not sure, but try to do the var results and the $("#results).append in the same closure as image = data.logo
Lisa
@aGirlWhoCodes
Jun 02 2016 13:30
@RompePC I tried. It's only printing out the last channel in the array and then 8 times..
Greg Duncan
@GregatGit
Jun 02 2016 13:34
@aGirlWhoCodes
if (data.stream === null)
{
   // do api channels call
}
else
{
   // all the other data needed is in the streams api
}
@aGirlWhoCodes also - you don't need callback
Lisa
@aGirlWhoCodes
Jun 02 2016 13:38
@GregatGit What do you mean by callback?
Greg Duncan
@GregatGit
Jun 02 2016 13:39
'http://api.twitch.tv/kraken/channels/' + channel + '?callback=?' you don't need the end + '?callback=?'
Lisa
@aGirlWhoCodes
Jun 02 2016 13:39
@GregatGit Oh of course, why there's no need for it?
Xavier Velez
@JonSnow08
Jun 02 2016 13:50
body {background-image: http://www.pixelstalk.net/wp-content/uploads/2015/11/Game-of-thrones-season-4-wallpapers-hd.jpg;
  background-repeat: no-repeat; 

}
can anybody tell what's wrong with my background image?
Lisa
@aGirlWhoCodes
Jun 02 2016 13:52
@GregatGit Thanks for this info anyway!
CamperBot
@camperbot
Jun 02 2016 13:52
agirlwhocodes sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 553 | @gregatgit |http://www.freecodecamp.com/gregatgit
Clyde
@hea-hea
Jun 02 2016 14:03
@JonSnow08 it should be: background-image: url("http://.......")
Xavier Velez
@JonSnow08
Jun 02 2016 14:06
@hea-hea ah okay thank you
CamperBot
@camperbot
Jun 02 2016 14:06
jonsnow08 sends brownie points to @hea-hea :sparkles: :thumbsup: :sparkles:
:cookie: 292 | @hea-hea |http://www.freecodecamp.com/hea-hea
PedroCSilva
@PedroCSilva
Jun 02 2016 14:14
good afternoon everyone
Xavier Velez
@JonSnow08
Jun 02 2016 14:30
good afternoon @PedroCSSilva
gemaderus
@gemaderus
Jun 02 2016 14:34
Hi everyone!
Clyde
@hea-hea
Jun 02 2016 14:34
@gemaderus hello
gemaderus
@gemaderus
Jun 02 2016 14:35
@hea-hea :smile:
PedroCSilva
@PedroCSilva
Jun 02 2016 14:42
im just finishing the 1st Intermediate Algorithm Scripting
Chase
@Belax8
Jun 02 2016 14:48
Congrats!! @PedroCSSilva
Clyde
@hea-hea
Jun 02 2016 14:49
@PedroCSSilva Sum All Numbers in a Range? :) cool
PedroCSilva
@PedroCSilva
Jun 02 2016 14:49
yeah after working on the frontend projects for 2 weeks
its nice to do something different for now and then return to the projects
Clyde
@hea-hea
Jun 02 2016 14:50
I did it yesterday, but I only did the first intermediate project so far
I like it too - especially that the project require a lot of research by yourself, at least for me
PedroCSilva
@PedroCSilva
Jun 02 2016 14:50
yes
75% of my time was spent reading
or watching tutorials
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 14:51
hello
I have a question
PedroCSilva
@PedroCSilva
Jun 02 2016 14:52
go ahead
ask it :D
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 14:52
How do you remain format text when update the data-text in button tweet?
PedroCSilva
@PedroCSilva
Jun 02 2016 14:53
show codepen pls
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 14:53
because it always convert some symbols to hex
okie
PedroCSilva
@PedroCSilva
Jun 02 2016 14:55
btw @nqdai1992 your project keeps adding buttons
as you get new quotes
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 14:55
yeah
for example "A & B" was converted to "A&#38;B"
PedroCSilva
@PedroCSilva
Jun 02 2016 15:01
yes because thats the code of the char &
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 15:03
then how to remain text when I share tweet
PedroCSilva
@PedroCSilva
Jun 02 2016 15:06
probably has something to do with this line
text:data[0].content.replace(/<.*?>/g,''),
im not sure because i didnt use twitter's own button
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 15:07
:D okie thanks @PedroCSSilva
CamperBot
@camperbot
Jun 02 2016 15:07
nqdai1992 sends brownie points to @pedrocssilva :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @pedrocssilva |http://www.freecodecamp.com/pedrocssilva
PedroCSilva
@PedroCSilva
Jun 02 2016 15:07
i created my own with html and then add the href url
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 15:07
okie
PedroCSilva
@PedroCSilva
Jun 02 2016 15:07
that would also fix your problem of adding multiple buttons
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 15:09
when you update url button Do you have this problem?
Nguyễn Quốc Đại
@nqdai1992
Jun 02 2016 15:34
I ve done. I do follow your way. It's simple but effective @PedroCSSilva
Junior Mba
@juniormba
Jun 02 2016 15:45
just completed my tribute page, would love some feedback: https://codepen.io/juniormba/pen/NrPaoj
DC
@dctor
Jun 02 2016 15:47
hi all, i have a question for the random quote project. I am thinking to build a JSON object that stores quotes then call it. But where do i store this JSON file? thanks
do i just build and store it in the JS window in codepen?
kirbyedy
@kirbyedy
Jun 02 2016 15:48
@dctor you can create an array of strings
DC
@dctor
Jun 02 2016 15:49
@kirbyedy sure...do it in the JS window? or html? or store it somewhere? the lesson is calling a JSON file on FCC server
Ryan
@ispeakcomputer
Jun 02 2016 15:50
@dctor my head dev here at the company i work for told me earlier today that one of our devs store his JSON simply in github.
he says other services will do this for you but I havent had the chance to dig into it . I know there is a random quote API out there if you would like me to find the link
DC
@dctor
Jun 02 2016 15:51
@needsMoreCoffee yes please...i think others are using a quote API instead of building an array
thanks
Ryan
@ispeakcomputer
Jun 02 2016 15:52
@dctor this is a API http://forismatic.com/en/api/
for random quotes that will return JSON.
DC
@dctor
Jun 02 2016 15:53
@needsMoreCoffee thanks i'll give it a try
CamperBot
@camperbot
Jun 02 2016 15:53
dctor sends brownie points to @needsmorecoffee :sparkles: :thumbsup: :sparkles:
:cookie: 308 | @needsmorecoffee |http://www.freecodecamp.com/needsmorecoffee
Ryan
@ispeakcomputer
Jun 02 2016 15:53
still hacking away to figure this project out myself . good luck !
DC
@dctor
Jun 02 2016 15:54
@needsMoreCoffee oh cool...where are you at?
that literally all . the qoute will come in from the top while the button moves down out of the way .
DC
@dctor
Jun 02 2016 15:56
this is what i got so far
http://codepen.io/dctor/pen/rLaWZr
Ryan
@ispeakcomputer
Jun 02 2016 15:56
i have the button changing color like google material design says its framework does and it moves downward.
nice , pretty good .
looking forward to seeing the rest.
looks like to you are almost there.
DC
@dctor
Jun 02 2016 15:58
now i am figuring out how to pull in json file with many quotes
Ryan
@ispeakcomputer
Jun 02 2016 15:58
reading that API info it looks like you can get it to send you one random one each time.
so sounds like it would be easy to parse that way .
DC
@dctor
Jun 02 2016 15:59
i am still don't know how API works and need to do some reading on this
Ryan
@ispeakcomputer
Jun 02 2016 16:04
i know what you mean. my buddy here says he uses CURL at the linux command line to play with the returned output of the APIs
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:04
I'm having trouble with the Twitch.tv project. I'm pretty sure it has something to do with my (mis)use of callbacks because I wind up with all the data I need but not until after the HTML has been generated (dynamically). It's here.
Ryan
@ispeakcomputer
Jun 02 2016 16:05
im seeing some other just put a url and the other needed parts into the URL to get the info to display in the display. obviously just for testing.
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:06
I get all the object data I need but some of it arrives after the HTML has been generated (dynamically).
Ryan
@ispeakcomputer
Jun 02 2016 16:08
@mrthnmn i wish i knew enough to help you . maybe someone with more experience could chime in ?
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:11
@needsMoreCoffee I've tried skinning this cat several different ways and always wind up with the same problem.
IndiraShrestha
@IndiraShrestha
Jun 02 2016 16:13
Hi, I am working on creating a portfolio page in codepen. I am trying to change the color of list element on the nav bar to #FF7A7A however
it's not working
Chase
@Belax8
Jun 02 2016 16:14
@mrthnmn can you link your codepen? what does your code look like?
@IndiraShrestha try li a { color: #ff7a7a;} in your css
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:16
@dctor The APIs are used by constructing a URL string and going a GET with either getJSON or AJAX. You then have to parse the return for the data you're looking for. Use the Web Console to see what all the data is that's being returned by the API
IndiraShrestha
@IndiraShrestha
Jun 02 2016 16:17
Thank you
@Belax8
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:18
@Belax8 I also tried it this way: http://codepen.io/mrthnmn/pen/GZVavr
Nishanth Mane
@ngmgit
Jun 02 2016 16:19
You can use curl GUI alternatives like postman or httprequester to understand the data returned by the api.
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:20
@Belax8 The problem seems to be in the offlineChannels funtion, something about the callback.
IndiraShrestha
@IndiraShrestha
Jun 02 2016 16:21
@Belax8 :Thank you
Thankyou @Belax8
CamperBot
@camperbot
Jun 02 2016 16:22
indirashrestha sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @belax8 |http://www.freecodecamp.com/belax8
Chase
@Belax8
Jun 02 2016 16:22
@IndiraShrestha anytime
APURV SINGH
@apurvvv
Jun 02 2016 16:22
I am very new to front end. Somehow i created a portfolio web page. I am unbale to navigate to different sections of the webpage by clicking buttons in the navigation. Please help me out with this. https://codepen.io/apurv000/pen/pbvVjX
Chase
@Belax8
Jun 02 2016 16:22
@mrthnmn Ok, I'll take a look at it
Stephen James
@sjames1958gm
Jun 02 2016 16:26
@mrthnmn You could move the code that builds the html into a function - keep a counter that counts responses - count online in online code and offline or failed in offline or failed code when count === sizeof channels array then call your build html function. As you have it now your are building the html only when you have online responses.
DC
@dctor
Jun 02 2016 16:29
@mrthnmn thanks for your help i am still unclear and confused as my only API and GET AJAX knowledge is from those 3-4 slides in the prior lesson. how do you view data from the Console? do you just copy and paste a code in the console?
CamperBot
@camperbot
Jun 02 2016 16:29
dctor sends brownie points to @mrthnmn :sparkles: :thumbsup: :sparkles:
:cookie: 312 | @mrthnmn |http://www.freecodecamp.com/mrthnmn
Sorin Ruse
@sorinr
Jun 02 2016 16:30
@apurvvv you should add an id="about" or "portfolio" etc to your div containing that information
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:30
@sjames1958gm Yeah, I saw that. I build the html in a separate function but I couldn't delay it with a callback. I'll try the counter. Thanks! Good idea.
CamperBot
@camperbot
Jun 02 2016 16:30
mrthnmn sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 1429 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Huang Kai
@thehuangkai
Jun 02 2016 16:33
Hi everyone, I am doing the portfolio page and the dropdown function of my navbar is not working, does anyone knows why? I am using codepen.io
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:33
@dctor Put 'console.log(object);' in your JS and then open the web console. How depends on your browser. F12, I think, in Chrome.
Chase
@Belax8
Jun 02 2016 16:33
@thehuangkai can you share the link so we can look at it?
Sorin Ruse
@sorinr
Jun 02 2016 16:35
@thehuangkai show us your code to be able to help
Bruce Hyatt
@mrthnmn
Jun 02 2016 16:35
And read this page to learn about the getJSON method
Huang Kai
@thehuangkai
Jun 02 2016 16:35
Chase
@Belax8
Jun 02 2016 16:36
@thehuangkai you need to link jQuery and Bootstrap to your JS
Sorin Ruse
@sorinr
Jun 02 2016 16:36
@thehuangkai add bootstrap.js to your pen
@thehuangkai and of course jq
Huang Kai
@thehuangkai
Jun 02 2016 16:37
oh ok!
thanks guys haha, didn't realise I forgot that
Chase
@Belax8
Jun 02 2016 16:38
@thehuangkai no worries. That happens to me all the time.