These are chat archives for FreeCodeCamp/HelpFrontEnd

27th
Jan 2017
Emily Ann
@emilyaringoen
Jan 27 2017 00:13
@coymeetsworld yeah I see that most of the time
Jasmin Parent
@charlesdarkwind
Jan 27 2017 00:29
im trying to use the bootsrap row system here but for some reason my second image is in its native size
<div class="row">
<div class="col-xs-6 col-md-3">
<img src="http://i.imgur.com/Eogzbxh.jpg" alt="placeholder" class="thumbnail">
</div>
<div class="col-xs-6 col-md-3">
<img src="https://i.ytimg.com/vi/CyUDiZG75hQ/maxresdefault.jpg" alt="placeholder2" class="thumbnail">
</div>
</div>
not sure why
xemexpress
@xemexpress
Jan 27 2017 00:51
@charlesdarkwind both of your images are in their original size
by the way, numbers in your md do not add up to 12
xemexpress
@xemexpress
Jan 27 2017 00:57
You may want to add "img-responsive" class into the img tag
xemexpress
@xemexpress
Jan 27 2017 01:03
@sorinr thanks
DestroyingLight
@DestroyingLight
Jan 27 2017 01:17
import React, { Component } from 'react';
import ChessConfigList from './components/ChessConfigList';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';

const styles = {
  container: {
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
  },
  item: {
    maxWidth: '50%',
  }
};

class App extends Component {
  render() {
    return (
      <MuiThemeProvider>
        <div style={styles.container}>
          <ChessConfigList />
        </div>
      </MuiThemeProvider>
    );
  }
}

export default App;
I'm using Material UI, and trying to style something with flex, "ChessConfigList" is just a Material UI table, according to my research of flexbox, this should get the table at the center, but instead, it's still aligned on the left (50% width is applying though)
any clues?
please ignore my question, I solved it
Kaz Baig
@kbaig
Jan 27 2017 02:47
Hi guys, I'm stuck on the 'make a person' algorithm. Can't figure out why one of the tests isn't validating. Some help would be appreciated. http://bit.ly/2k7PFUs
JMNofziger
@JMNofziger
Jan 27 2017 03:06
I'm finishing up my random quote generator project and in having trouble getting my message to be populated into the attribute of my link that then generates the quote as the tweet text. Any ideas on what I'm missing here?
http://s.codepen.io/Shredderz/debug/zNErEO/vWARwWzQpOYk
thanks at @TylerMoeller
Brian Amos
@StarlingBlaze
Jan 27 2017 03:24
Could anyone please help me with the simple instructions for this early jQuery exercise?: Target HTML Elements with Selectors Using jQuery
Cant seem to get the correct insertion for this: $("button").addClass("animated bounce");

into this: <script>
$(document).ready(function() {

});
</script>

Gulsvi
@gulsvi
Jan 27 2017 03:27
@StarlingBlaze
<script>
  $(document).ready(function() {
    // your code goes here
  });
</script>
Brian Amos
@StarlingBlaze
Jan 27 2017 03:28
wow. THANK YOU @SkyCoder01
Gulsvi
@gulsvi
Jan 27 2017 03:29
I just did that one :)
Raghavendra Deepak Dupuguntala
@deepakloyola
Jan 27 2017 03:43
Hello world
Chris Wingler
@chriswingler
Jan 27 2017 03:45

i'm getting this error when trying to copy-paste the geolocation challenge code into my weather project :(

getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS.

Brittni Willett
@Willow606
Jan 27 2017 03:50
Hey can someone tell me how I can change the text of a button with JS?

I tried

document.getElementById('a').value = selectMe;

but it didn't work for some reason

Chris Wingler
@chriswingler
Jan 27 2017 03:52
@Willow606 try .innerHTML = selectMe
Brittni Willett
@Willow606
Jan 27 2017 03:53
@chriswingler that worked thank you! :)
Chris Wingler
@chriswingler
Jan 27 2017 03:54
@Willow606 no prob
Chiu Yong
@chiuyong
Jan 27 2017 04:22
hello
Is there anybody here to help me?
Brittni Willett
@Willow606
Jan 27 2017 04:34
@chiuyong what do you need?
Chiu Yong
@chiuyong
Jan 27 2017 04:48
@Willow606 Why is my div container-fluid not inside the nav container?
    <header>
        <nav id="navigation" class="navbar navbar-default navbar-fixed-top">
            <div class="container-fluid">
                    <div class="col-md-3">
                        <div class="logo"></div>
                    </div>
                    <div class="col-md-6">
                        <div class="links">

                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="user">

                        </div>
                    </div>
                </div>
            </div>
        </nav>
    </header>
Daniel
@DanJP2016
Jan 27 2017 04:52
@chiuyong drop the fluid and just use class="container"
Chiu Yong
@chiuyong
Jan 27 2017 04:53
yeah but when I see here, the div container is in outside of the nav
Daniel
@DanJP2016
Jan 27 2017 05:00
i think it is appearing that way because the container-fluid will span 100% the width of the page and is overriding the other styles you might have. dropping the fluid seems to fix it so it is inside the nav.
Veronika
@Veronika853
Jan 27 2017 05:05
Tribute Page can be on any theme?
Daniel
@DanJP2016
Jan 27 2017 05:11
yes
Veronika
@Veronika853
Jan 27 2017 05:20
How to move col-md in Bootstrap to the center?
@DanJP2016 thanks
Daniel
@DanJP2016
Jan 27 2017 05:23
@Veronika853 you can try adding class="center-block", that will work I think.
@chiuyong sorry for my previous answer it was wrong, it looks like your problem is you are missing the row class around your columns. just add a div with a class of row to it andthat should fix it. it looks like you already have a extra closing div at the bottom of the code, so just need to add <div class="row"> after the container-fluid div
Sorin Ruse
@sorinr
Jan 27 2017 05:25
@Veronika853 add offset to it col-md-offset
Veronika
@Veronika853
Jan 27 2017 05:25
@sorinr thank)
Chiu Yong
@chiuyong
Jan 27 2017 05:32
@DanJP2016 got it
@DanJP2016 but the correct is div inside nav or nav inside div?
@DanJP2016 can you explain how to build this navbar? http://dante.swiftideas.com/
Ayush Bahuguna
@relentless-coder
Jan 27 2017 05:35
does anyone here have experience with adminLTE template?
Daniel
@DanJP2016
Jan 27 2017 05:39
@chiuyong to get something similar to that I think you would need to drop the fluid from your container div, have it inside the nav section, and drop the row/col-md and use an unordered list.
Chiu Yong
@chiuyong
Jan 27 2017 05:41
only?
why aren't my social media buttons sending me to my pages?
Thank you.
Daniel
@DanJP2016
Jan 27 2017 05:49
@chiuyong this should help you figure it out, it does not collapse when the page shrinks, I could not remember how to do that off the top of my head, but the bootstrap webpage should have the instructions on how to fix that. http://codepen.io/bones211/pen/zNEbQm?editors=1010
@mikecerang add target="_blank" to your social media anchor tags, that should fix it.
Chiu Yong
@chiuyong
Jan 27 2017 05:59
@DanJP2016 , thank you :D
Daniel
@DanJP2016
Jan 27 2017 05:59
your welcome
buiphuking
@buiphuking
Jan 27 2017 06:16
anyone from Viet Nam, i wanna say happy Tet holiday !
Veronika
@Veronika853
Jan 27 2017 06:34
Normal for the first project? :D
Joe Escobedo
@joeEscob1023
Jan 27 2017 06:49
can someone give me a good definition of math.random() the FCC camp one is hard to follow through. either that or im just tired aha. So it really just generates a number between 0 and 1?
Darth Skywalker
@adityaparab
Jan 27 2017 06:51

@TacoJoe

So it really just generates a number between 0 and 1?

Yes. That's it

Joe Escobedo
@joeEscob1023
Jan 27 2017 06:51
@adityaparab ok cool! thanks
CamperBot
@camperbot
Jan 27 2017 06:51
tacojoe sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
Ayush Bahuguna
@relentless-coder
Jan 27 2017 07:35
bootstrap dropdown is not working
<li ng-show="isAdmin()" ng-cloak ng-class="routeParameter('/')" class="dropdown"><a href="#/"><i class="fa fa-lock" aria-hidden="true"></i><span>Admin</span><span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
              <li ng-class="routeParameter('/cities')" class="list-item"><a href="#/cities"><i class="fa fa-university"></i> <span>Cities</span></a></li>
              <li ng-class="routeParameter('/facilities')" class="list-item"><a href="#/facilities"><i class="fa fa-briefcase "></i> <span>Facilities</span></a></li>
              <li ng-class="routeParameter('/plans')" class="list-item"><a href="#/plans"><i class="fa fa-list"></i> <span>Plans</span></a></li>
            </ul>
          </li>
Sorin Ruse
@sorinr
Jan 27 2017 07:39
@relentless-coder what is this ang class ng-class="routeParameter('/cities')" serving for to li's ?
Ayush Bahuguna
@relentless-coder
Jan 27 2017 07:42
@sorinr that's used to add a class that would style the current selected list item
philiplee15
@philiplee15
Jan 27 2017 08:02
class didnt go over drop downs, do we need to self study bootstrap documentation to learn?
Marcin_L
@lotosiauke
Jan 27 2017 08:12
@TylerMoeller thx again ;)
@lotosiauke thank you :)
@TylerMoeller thank you xD
winroy
@winroy
Jan 27 2017 08:24
guys, i need help. :'(
Darth Skywalker
@adityaparab
Jan 27 2017 08:26
@winroy explain!
winroy
@winroy
Jan 27 2017 08:26
I don't know anymore why my scrollspy is not working properly. the navigation should be bold and underline if it is active.
i'm not good in english. so please bare with me
i'm new to bootstrap.
winroy
@winroy
Jan 27 2017 08:33
@adityaparab what's wrong with my codes?
Darth Skywalker
@adityaparab
Jan 27 2017 08:33
@winroy hold on.. looking into it
winroy
@winroy
Jan 27 2017 08:35
@adityaparab okay
Muhammad Hasham
@MohammadHasham
Jan 27 2017 08:50
@winroy have you added bootstrap to tour pen
alpox
@alpox
Jan 27 2017 08:52
@winroy Hmm one main problem is that you have to set data-target: "#myNavbar" instead of data-target: "#main-nav"
But then it still doesn't resolve right. The highlighting starts working though

@winroy Bootstrap docs:

Then add the data-target attribute with the ID or class of the parent element of any Bootstrap .nav component.

winroy
@winroy
Jan 27 2017 09:00
what is tour pen?
@MohammadHasham what is tour pen?
@alpox you're right! I tried it but it still doesn't work.
Muhammad Hasham
@MohammadHasham
Jan 27 2017 09:05
tour pen?
@winroy sorry,but i don't know
winroy
@winroy
Jan 27 2017 09:06
@MohammadHasham You said bootstrap to tour pen. so what is tour pen?
Muhammad Hasham
@MohammadHasham
Jan 27 2017 09:07
*to your pen..typos :sparkles:
just go to settings and make sure you added bootstrap there
winroy
@winroy
Jan 27 2017 09:07
oh, it's okay. I was confused back there.
Yes, I added bootstrap to my pen.
Ghulam Shabir
@ghulamshabir
Jan 27 2017 09:27
@TylerMoeller :smile: you are genious! I will make changes to them, thank you again
Elias Papachristos
@EliasPapachristos
Jan 27 2017 10:45
Can someone please help me with this?
http://codepen.io/elias_pap/pen/MJEmgg?editors=0010
Muhammad Hasham
@MohammadHasham
Jan 27 2017 10:48
anyone having flexbox cheatsheet?
kirbyedy
@kirbyedy
Jan 27 2017 11:03
funny thing, first hit on google for flexbox cheatsheet is actually a flexbox cheatsheet :D
SarrahElle
@SarrahElle
Jan 27 2017 11:09
I'm having trouble getting font awesome to work on my portfolio page for my social media icons. It's funny because I had font awesome working before for something I wound up changing. Could someone take a look please? note: I currently have my CSS code for the icons commented out because that was the only way I could even get dots to appear. http://codepen.io/SarrahElle/pen/PWwvez
Sorin Ruse
@sorinr
Jan 27 2017 11:14
@SarrahElle you r missing the class="fa ...." you wrote only fa fa....
@SarrahElle you will also have to style the ul li list in the contact to display inline :)
json
@jcharnley
Jan 27 2017 11:19
Monring
morning*
Coy Sanders
@coymeetsworld
Jan 27 2017 11:26
not sure what the issue is @SarrahElle . I couldn't render the fcc icon either
maybe the version you're using is too old
try upgrading
yeah I used the newest version of font-awesome @SarrahElle and it rendered
Walid Ashri
@walidashri
Jan 27 2017 11:29
@SarrahElle here it is 4.7.0
SarrahElle
@SarrahElle
Jan 27 2017 11:30
@coymeetsworld yes I just put in 4.7.0 working now. Have to fix my styling and such but my icons are there. Satisfied for now. Thanks @walidashri
Thank you @sorinr
Coy Sanders
@coymeetsworld
Jan 27 2017 11:31
np @SarrahElle
Sorin Ruse
@sorinr
Jan 27 2017 11:32
@SarrahElle welcome
Muyeez Farooq
@muyeezrather
Jan 27 2017 11:46
can you please tell me difference between object and classes in OOP
dot dorothy
@dotdorothy
Jan 27 2017 12:05
Can anyone help me with a question on the portfolio project? The JQuery sections on FCC don't cover anything for the smooth scrolling, so how did you approach this? I've looked up tutorials but most of them rely on plugins (cheating, right?) and I've looked up other pens (not to steal their code, I promise!) and I can see there are loads of ways to achieve this, I just feel like I don't really understand any of them. I don't know where to begin, can anyone offer advice? Thank you!
King Mhar Bayato
@kirahmadlare
Jan 27 2017 12:07
Hello, is there anyone who can help me to improve my skills like involvement in a project :(
json
@jcharnley
Jan 27 2017 12:08
hey guys
how can I make sure when I zoom in and out my jumbrotron doesnt change size?
<div class="container-fluid">
<div class="jumbotron">
<div class="col-md-9"><h1><b>Dr. Norman Borlaug</b></h1>
<p><strong>The man who saves a billion lives</strong></p>
</div>
<div class="col-md-9">
<img src=https://www.keralatourism.org/images/destination/large/devikulam_hills_in_munnar20131031103731_132_1.jpg class="img-responsive">

<p><strong>Here's a time line of Dr. Borlaug's life:</strong></p>
<ul>
<li><b>1914</b> - Born in Cresco, Iowa </li>
<li><b>1933</b> - Leaves his family's farm to attend the University of Minnesota, thanks to a Depression era program known as the "National Youth Administration"
</li>
<li><b>1935</b> - Has to stop school and save up more money. Works in the Civilian Conservation Corps, helping starving Americans. "I saw how food changed them", he said. "All of this left scars on me."
</li>
<li><b>19</b>
</ul>
</div>
</div>
Also,how can I show my more code more easily instead of copy and paste?
dot dorothy
@dotdorothy
Jan 27 2017 12:17
@heyDante Thank you so much! I will try this.
badalsaibo
@heyDante
Jan 27 2017 12:19
@dotdorothy yw
Joel Santos
@St3ps
Jan 27 2017 13:05
Quick bootstrap question gents :)
<!-- a very small snippet -->
<div class="col-md-6 col-xs-6 ">column 1</div>
<div class="col-md-6 col-xs-3 col-xs-offset-3 ">column 2</div>
<!-- shouldn't this create 2 columns where the first one occupies 50%, and the other one is also 50% 
BUT if the screen size is less than 420px, the second col will be pushed to the right, 
and the content inside the div will occupy the remaining 25%. Correct? -->
@jcharnley before and after your code type these ```
alpox
@alpox
Jan 27 2017 13:20
@St3ps Right except that the remaining 25% will be empty and not filled by anything
Pradeep
@katakampradeep
Jan 27 2017 13:20
Hi guys, What are portfolio web pages? How can we use then to our sample web pages?
alpox
@alpox
Jan 27 2017 13:22
@pk422 A portfolio page is a website on which you present yourself and probably your skills. Its being used for making an impression to companies which may employ you
Ken Haduch
@khaduch
Jan 27 2017 13:24
@katakampradeep - if you are not sure how to approach setting up a page like this, I would suggest having a look at the http://w3schools.com/bootstrap lessons, take a quick look at the "Themes" section there - they go into detail about how to design and lay out a page using Bootstrap. I found it to be helpful. And if you plan to use something other than bootstrap, the information is still useful as a design exercise - they walk you all the way through the process for a few different types of pages.
Muhammad Hasham
@MohammadHasham
Jan 27 2017 13:25
how do you learn flexbox i have got the idea but still there are many properties how can i remember them.I have downloaded several cheatsheets is all that enough.
Ken Haduch
@khaduch
Jan 27 2017 13:26
@MohammadHasham - I just happened to be looking at a page http://wesbos.com/flexbox-resources/ - looks like lots of good stuff there. Also a nice approach is this "game" website that walks you through using flexbox to align things on a page: http://flexboxfroggy.com/ - I hope that helps?
Muhammad Hasham
@MohammadHasham
Jan 27 2017 13:27
@khaduch thanks.But are the cheatsheets enogh
enough/
Ken Haduch
@khaduch
Jan 27 2017 13:28
@MohammadHasham - I don't know because I haven't really tried to use it in a project, up to this point. The http://flexboxfroggy.com/ site is good for an overview of what you can do - after you see things in action, you will probably make better use of the cheatsheets.
Muhammad Hasham
@MohammadHasham
Jan 27 2017 13:28
@khaduch thanks alot.
Muzaffar Hussain
@Muzaffarhssn5
Jan 27 2017 13:39

Hi.. I am trying to build a random quote machine... I have pasted the script below..

$.ajax({
url: 'https://andruxnet-random-famous-quotes.p.mashape.com/',
headers: {
'X-Mashape-Key': 'omICRkQlhtmshdwPT0YLZkaojcAmp1sRWrvjsnKkKVLl1QvX06',
dataType: 'application/x-www-form-urlencoded',
Accept: 'application/json'
},
success: function(data) {
console.log(data.quote);
}
});

i am unable to access the quote... it shows undefined in the log.. Someone help please

Ken Haduch
@khaduch
Jan 27 2017 13:50
@Muzaffarhssn5 - if you post the link to your project (if it's in CodePen) it would be easier. Have you loaded jQuery.js? That's the first thing to know?
Muzaffar Hussain
@Muzaffarhssn5
Jan 27 2017 14:01
Cameron Stacy
@TheDoctorCam
Jan 27 2017 14:05
Could someone help me with a hover text box? I had it working yesterday but now the text box isn't appearing over the image on hover. The div is under page 3 and the CSS is where the #pageThree styles start. http://codepen.io/TheDoctorCam/pen/jyLRWK
Ken Haduch
@khaduch
Jan 27 2017 14:06
@Muzaffarhssn5 - it looks like you are getting quotes, but you don't have any button click event set up to invoke the function again when you click the button. It seems that it works to actually get a quote the first time. Perhaps I'm just missing something?
Muzaffar Hussain
@Muzaffarhssn5
Jan 27 2017 14:08
No... You are right... I have not added the click event yet.. somehow. I was not even getting the initial values in the beginning now I am getting the quotes but still i am unable to access the author name @khaduch
this is my first project
my tribute page
Ken Haduch
@khaduch
Jan 27 2017 14:15

@Muzaffarhssn5 - I think that it is a problem with your HTML structure. You have the HTML set up like this:

  <div id="quote-display">
    <span class="text"></span>
    <footer class="author-name">- <span id="author"></span> </footer>
  </div>

so when you do this: $('#quote-display').text(q.quote); It is clobbering the structure of that div and removing your footer. You just need to change how you are updating that - maybe to use the span that you have in there? Or restructure your code to get the footer out of there.

@Muzaffarhssn5 - just changing the $('#quote-display').text(q.quote); to $('.text').text(q.quote); looks like it should work.
Muzaffar Hussain
@Muzaffarhssn5
Jan 27 2017 14:17
Okay I ll try that @khaduch
@khaduch I am either getting the quote or the author name... I am unable to get both simultaneously...
@khaduch Maybe you are right... I think i have messed up the HTML structure.
Ken Haduch
@khaduch
Jan 27 2017 14:23

@Muzaffarhssn5 - I am getting both, using your current HTML structure and this change to the code:

    $('.text').text(q.quote);
    $('.author-name').text(q.author);

I also wrapped your $.ajax call within a function, and added a .click handler, and that seems to work, as well.

json
@jcharnley
Jan 27 2017 14:29
guys how do I center lists
on the build a tribute page (timeline dates)
ronaldo007
@ronaldo001
Jan 27 2017 14:33
hello friends can anyone with my new project, I am trying to make a sign in and sign up page, In the sign up page I'm not able to put categry field and all the category in it properly.
Ken Haduch
@khaduch
Jan 27 2017 14:34
@jcharnley - are you using bootstrap? You can work with the rows and columns and put a column in the center. It's not that easy to just center a list, but using the grid it does pretty well.
ronaldo007
@ronaldo001
Jan 27 2017 14:34
here is my code
<div class="sign-up-htm">
                <div class="group">
                    <label for="user" class="label">Username</label>
                    <input id="user" type="text" class="input" required>
                </div>
                <div class="group">
                    <label for="pass" class="label">Password</label>
                    <input id="pass" type="password" class="input" data-type="password" required>
                </div>
                <div class="group">
                    <label for="pass" class="label">Repeat Password</label>
                    <input id="pass" type="password" class="input" data-type="password" required>
                </div>
                <div class="group">
                    <label for="pass" class="label">Email Address</label>
                    <input id="pass" type="text" class="input" required>
                </div>
                <div class="group">
                <label for="country">Category</label>
                <select id="country" name="country">
                  <option value="australia">Australia</option>
                  <option value="canada">Canada</option>
                  <option value="usa">USA</option>
                </select>
                    <input id="pass" type="text" class="input" required>
                </div>
                <div class="group">
                    <input type="submit" class="button" id="we1" value="Sign Up">
                </div>
                <div class="hr"></div>
                <div class="foot-lnk">
                    <label for="tab-1">Already Member?</a>
                </div>
            </div>
and this is my css file:
body{
    margin:0;
    color:#6a6f8c;
    background:#c8c8c8;
    font:600 16px/18px 'Open Sans',sans-serif;
}
*,:after,:before{box-sizing:border-box}
.clearfix:after,.clearfix:before{content:'';display:table}
.clearfix:after{clear:both;display:block}
a{color:inherit;text-decoration:none}

.login-wrap{
    width:100%;
    margin:auto;
    max-width:525px;
    min-height:670px;
    position:relative;
    background:url(https://raw.githubusercontent.com/khadkamhn/day-01-login-form/master/img/bg.jpg) no-repeat center;
    box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19);
}
.login-html{
    width:100%;
    height:100%;
    position:absolute;
    padding:90px 70px 50px 70px;
    background:rgba(40,57,101,.9);
}
.login-html .sign-in-htm,
.login-html .sign-up-htm{
    top:0;
    left:0;
    right:0;
    bottom:0;
    position:absolute;
    transform:rotateY(180deg);
    backface-visibility:hidden;
    transition:all .4s linear;
}
.login-html .sign-in,
.login-html .sign-up,
.login-form .group .check{
    display:none;
}
.login-html .tab,
.login-form .group .label,
.login-form .group .button{
    text-transform:uppercase;
}
.login-html .tab{
    font-size:22px;
    margin-right:15px;
    padding-bottom:5px;
    margin:0 15px 10px 0;
    display:inline-block;
    border-bottom:2px solid transparent;
}
.login-html .sign-in:checked + .tab,
.login-html .sign-up:checked + .tab{
    color:#fff;
    border-color:#1161ee;
}
.login-form{
    min-height:345px;
    position:relative;
    perspective:1000px;
    transform-style:preserve-3d;
}
.login-form .group{
    margin-bottom:15px;
}
.login-form .group .label,
.login-form .group .input,
.login-form .group .button{
    width:100%;
    color:#fff;
    display:block;
}
.login-form .group .input,
.login-form .group .button{
    border:none;
    padding:15px 20px;
    border-radius:25px;
    background:rgba(255,255,255,.1);
}
.login-form .group input[data-type="password"]{
    text-security:circle;
    -webkit-text-security:circle;
}
.login-form .group .label{
    color:#aaa;
    font-size:12px;
}
.login-form .group .button{
    background:#1161ee;
}
.login-form .group label .icon{
    width:15px;
    height:15px;
    border-radius:2px;
    position:relative;
    display:inline-block;
    background:rgba(255,255,255,.1);
}
.login-form .group label .icon:before,
.login-form .group label .icon:after{
    content:'';
    width:10px;
    height:2px;
    background:#fff;
    position:absolute;
    transition:all .2s ease-in-out 0s;
}
.login-form .group label .icon:before{
    left:3px;
    width:5px;
    bottom:6px;
    transform:scale(0) rotate(0);
}
.login-form .group label .icon:after{
    top:6px;
    right:0;
    transform:scale(0) rotate(0);
}
.login-form .group .check:checked + label{
    color:#fff;
}
.login-form .group .check:checked + label .icon{
    background:#1161ee;
}
.login-form .group .check:checked + label .icon:before{
    transform:scale(1) rotate(45deg);
}
.login-form .group .check:checked + label .icon:after{
    transform:scale(1) rotate(-45deg);
}
.login-html .sign-in:checked + .tab + .sign-up + .tab + .login-form .sign-in-htm{
    transform:rotate(0);
}
.login-html .sign-up:checked + .tab + .login-form .sign-up-htm{
    transform:rotate(0);
}

.hr{
    height:2px;
    margin:30px 0 50px 0;
    background:rgba(255,255,255,.2);
}
.foot-lnk{
    text-align:center;
}
.tab-1{
    margin-top: -10px;
}
#we1{
    margin-top: 20px;
}
input[type=text], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
Ken Haduch
@khaduch
Jan 27 2017 14:39
@ronaldo001 - do you have a URL for this, or is it on your own local machine?
ronaldo007
@ronaldo001
Jan 27 2017 14:41
@khaduch on my local machine
@khaduch i have taken refernce from internet and tried to make some changes in it.
Ken Haduch
@khaduch
Jan 27 2017 14:45
@ronaldo001 - okay trying to see what you have there... I have to set up a page to examine it
@ronaldo001 - one thing I found so far that is incorrect - this line in your HTML: <label for="tab-1">Already Member?</a> should not have </a> as the closing tag? Other than that, it seems to be working after I changed that to </label>?
Sami Perälahti
@SamiNami
Jan 27 2017 14:47
Guys quick question about the JSON Twitch Api, when I make the GET request for brunofin , it gives back the exact same data as an offline stream... is there still a way to check if the account has been deleted?
Ken Haduch
@khaduch
Jan 27 2017 14:49
@ronaldo001 - and it doesn't look like you've properly closed all of your divs? (Unless I just had a problem with copy and paste....)
json
@jcharnley
Jan 27 2017 14:49
@khaduch Yes im using bootstrap
Just trying to figure it out
Ken Haduch
@khaduch
Jan 27 2017 15:00
@mml3b - notice the examples on that page - any numeric value that is being assigned to a variable is on the RIGHT side of the = myVar = 5 in the example code. And they say Assignment always goes from right to left. Everything to the right of the = operator is resolved before the value is assigned to the variable to the left of the operator.
so it should be b = something on line 8.
Mostafa Masri
@thefakeweed
Jan 27 2017 15:01
var a = 7;
var b = 7;
i did this @khaduch
but im not knowing how to do the 3rd one
Eric Chung
@chungeric
Jan 27 2017 15:03
Erm hi guys, I'm trying to perform an AJAX request for the local weather app, but it doesn't seem to want to work. Here's my ajax code
$(".test-btn").on("click", function() {
    $.ajax({ 
      url: 'api.openweathermap.org/data/2.5/weather',
      datatype: 'jsonp',
      data:{ 
        lat: latitude,
        lon: longitude,
        APPID: '8a6805298d2c06c061f7d6518569fea8',
      },
      success: function(response) {
        console.log(response);
      }
    });
  });
Ken Haduch
@khaduch
Jan 27 2017 15:06
@mml3b - Actually, there are two things that are wrong. Your first line var a = 7; should not have the keyword var there, because the variable is already declared. Then in the second line, the same thing var b is already declared, so you just use b = and it should be similar to the example that they show where they have myNum = myVar; - you should have the variable a on the right hand side of the =.
@chungeric - do you need to put the http:// on your URL? I cannot recall, but I would try that first.
Mostafa Masri
@thefakeweed
Jan 27 2017 15:09
@khaduch var a = 7;
b = 7;
7 = a;
idkkk
Ken Haduch
@khaduch
Jan 27 2017 15:11
@mml3b - get rid of the 7 = a - that is just wrong. Your editor is probably flagging an error for that? the variable a should be on the left side, and the 7 on the right side, but you only need two lines there. The third is wrong. Two assignments - one to a, and one to b
Mostafa Masri
@thefakeweed
Jan 27 2017 15:12
var a = 7;
b = 7; ( a should be assigned to b )
with =
Ken Haduch
@khaduch
Jan 27 2017 15:13
@mml3b - so do that - b = a; Just like the example does - assigns a value to myVar, then assigns the myVar to myNum with myNum = myVar...
@mml3b - learn how to interpret the test results and use them as a guide to fix your code. And read the description carefully because for these early lessons they are pretty explicit about the basic steps that you need to do.
Eric Chung
@chungeric
Jan 27 2017 15:16
I'm getting a mixed content error
Mostafa Masri
@thefakeweed
Jan 27 2017 15:16
var a = 7;
b = 7;
b = a;
myNum = myVar;
Eric Chung
@chungeric
Jan 27 2017 15:16
@khaduch since it needs https for geolocation and the ajax url is http
Mostafa Masri
@thefakeweed
Jan 27 2017 15:17
@khaduch my var is not defined error
Eric Chung
@chungeric
Jan 27 2017 15:17
@khaduch maybe i'll just use getJSON...
Ken Haduch
@khaduch
Jan 27 2017 15:18
@chungeric - are you loading your page with https://? You have to load your page using http:// in your URL, because the free version of the openweather api only uses http://. The problem with the geolocation is a real problem. Can you try firefox? That is not a good solution to require people to use firefox, but at least you can see if it works because geolocation on firefox doesn't need https:// (at least not yet)
@mml3b - you are not supposed to copy the example code into the exercise... And you don't need the b = 7; line.
@chungeric - there is a discussion in the FreeCodeCamp forum about the https:// problem. FreeCodeCamp/FreeCodeCamp#7853 And they discuss alternatives to using openweather.
Hello911
@Hello911
Jan 27 2017 15:29

function reverseString(str) {
  str=[];
  str.split("");
  str.reverse();
  str.join("");
  return str;
}

reverseString("hello");
Why does the computer say Type error: str.split is not a function? The correct result should be "olleh''.
Ken Haduch
@khaduch
Jan 27 2017 15:30
@Hello911 - you have changed str to an array, and .split is a string function. Get rid of the str = []; because that is killing the value of your function argument, which is str...
Then you have some other problems - str.split(""); returns a new string, so you have to assign your value from that back to str, the same thing all the way down the line. Watch for methods that modify the variable in place (there aren't too many) vs. those that return a modified value.
And you can do all of this in one line by chaining the methods together.
Steven Failla
@Stevo99
Jan 27 2017 15:35
hey can someone please explain to me how to to put more than 1 background image in codepen. for some reason i cant figure it out and i keep hitting wall after wall
Hello911
@Hello911
Jan 27 2017 15:36

@khaduch ```

function reverseString(str) {

str=str.split("");
str.reverse();
str=str.join("");
return str;

}

reverseString("hello");

This works Thanks @khaduch
Paul Maxwell
@paulmaxwell
Jan 27 2017 15:37
I'm doing the intermediate algorithm challenges. Does it matter if I don't use the methods in the helpful links list? Am I missing the point of the exercise?
Eric Chung
@chungeric
Jan 27 2017 15:38
@khaduch ok, I guess wunderground weather api is the solution. thanks for the link!
Steven Failla
@Stevo99
Jan 27 2017 15:38
thats funny cause it works here but not there. i cant find the image after hitting run
Chris
@bestintown23
Jan 27 2017 15:40
how can I center my social media icons ? http://codepen.io/bestintown23/full/XpzXmy/
Eric Chung
@chungeric
Jan 27 2017 15:42
Put the icons in an icon-container or something, then use text-align: center on that container
@bestintown23 ^
Hello911
@Hello911
Jan 27 2017 15:46
function factorialize(num) {
  for(var i=1;i<num;i++){
    num=num*i;
  }
  return num;
}

factorialize(5);
The computer says num=num*i; is a potential infinite loop that will crash browser, and the function doesn't work. Any hint?
Ken Haduch
@khaduch
Jan 27 2017 15:55
@Hello911 - yes, you are changing the value of num (or at least potentially changing it) and trying to use it as your loop control. Bad idea... Make a separate variable to do your multiplication with.
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:01
@winroy For scroll spy to work, you'll need to add the required attributes to your <body> tag, since codepen adds the <body> already, you can add everything dynamically in your document.ready:
$(document).ready(function(){
  $('body').attr({
    'data-spy': 'scroll',
    'data-target': '.navbar',
    'data-offset': '50'
  });
});
Naterroy1
@Naterroy1
Jan 27 2017 16:02
how do you make a caption under a picture
Ken Haduch
@khaduch
Jan 27 2017 16:02
@villain101 - unless they ask for something specific that they are going to look for, like using the .reduce() method, or somesuch, then you can do whatever works. I think that the helpful links list is good if you are a newbie, or if they are recommending functions or methods that you are not familiar with and they are trying to introduce to you, then that's fine. I've seen people using ES6, all sorts of higher-level functions, etc. just to do the basics. It depends on your level of expertise, to a large extent (and in my opinion.)
@Naterroy1 - you can read about it here - https://www.w3.org/Style/Examples/007/figures.en.html
I just googled "HTML CSS how to make a caption under a picture" and that was one of the top links.... "Read, Search, Ask" ;)
I hope it helps.
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:11
@SamiNami Not sure if you got an answer, there are three API endpoints available for twitch (users, channels, streams), analyze all three to see how you want to check if brunofin has been deleted:
Sami Perälahti
@SamiNami
Jan 27 2017 16:12
thanks @TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:13
No problem - just a hint, hope it helps ;)
Naterroy1
@Naterroy1
Jan 27 2017 16:14
thanks @khaduch
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:20
@Stevo99 Yes, you can use multiple background images. It depends on how you want it all set up. If you can send a link to a codepen and say what you're trying to achieve, we can try to help. Here's one way to do it:
<section class="section1"></section>
<section class="section2"></section>
.section1 {
  background: url(https://placehold.it/1200?text=section1) no-repeat center center;
  background-size: cover;
  border-bottom: 1px solid black;
  min-height: 50vh;
}
.section2 {
  background: url(https://placehold.it/1200?text=section2) no-repeat center center;
  background-size: cover;
  min-height: 50vh;
}
Steven Failla
@Stevo99
Jan 27 2017 16:25
@TylerMoeller thank you soo much i can really use the help..
Japneet Singh
@japsuchiha
Jan 27 2017 16:27
@bestintown23 add this :
<div class ="imga"> // added a div class
<img src="https://i.imgsafe.org/fd6f339860.png" class="icons">
<img src="https://i.imgsafe.org/fdfb20fa8d.png" class="icons">
<img src="https://i.imgsafe.org/fdfcd6a234.png" class="icons">
<img src="https://i.imgsafe.org/fdfebb2d2b.png" class="icons">
  </div>
.imga{
text-align: center;
}
Spyrantis Theodoros
@thodorisanta
Jan 27 2017 16:28
Im suppose to return the sum of all odd fibonacci numbers. But my IF doesnt quite work...can you tell me why?

function sumFibs(num) {
  var a=1;var b=0; var temp=0; var i=0;
  var arr = [];
  var sum=0;
  while(a<num){

    temp = a;
    arr[i] = a;
    a = temp + b;
    b = temp;

    if(arr[i]/2!==0){
      sum += arr[i];
    }
    i++;
  }

  return sum;
}

sumFibs(4);
Steven Failla
@Stevo99
Jan 27 2017 16:28
and I noticed also that on the html side when i started getting to line number 30 or so whenever i typed it would show up all the way at the right instead of right by the number.. why is that
even when i hit enter to bring up more line numbers theres a gap between the numbers even though theres no text at all
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:32
@Stevo99 We'd need to see the code to understand what's going on :)
Steven Failla
@Stevo99
Jan 27 2017 16:33
how can i send it to you
just send you the link to the codepen doc right
Hello911
@Hello911
Jan 27 2017 16:35
function replacer(match, p1, p2, p3, offset, string) {
  // p1 is nondigits, p2 digits, and p3 non-alphanumerics
  return [p1, p2, p3].join(' - ');
}
var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
I am trying to understand .replace() method. What does replacer do in the last line??
Moisés Man
@moigithub
Jan 27 2017 16:35
"hello".replace("l", "x") ----> "hexxo"
last line.. uses regex expression
www.regexone.com <-- a good place to start @Hello911
Steven Failla
@Stevo99
Jan 27 2017 16:36
at the bottom its a little sloppy because i was trying soo many things.
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:39

@Stevo99 This should be removed from your HTML:

  <body background="https://wallpaperscraft.com/image/laptop_table_apple_macbook_pro_retina_window_73454_1920x1080.jpg"></body>

Use CSS to set background images, like in that code example I gave above. :point_up: January 27, 2017 8:20 AM

Steven Failla
@Stevo99
Jan 27 2017 16:40
yea i only put it there cause it wont load if i do it on css
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:40
blob
Steven Failla
@Stevo99
Jan 27 2017 16:40
and i used the style you gave me and it still didnt work
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:40
Another tip, when you see colors looking different like in that image, it means something is wrong with your code
Notice how "btn btn-default" is white on the last line, but yellow in the other lines?
All of these little errors can end up with your code editor making inaccurate guesses about what you want to do
Hello911
@Hello911
Jan 27 2017 16:42
@moigithub yeah but what does replacer do? the page you gave doesnt answer that
Steven Failla
@Stevo99
Jan 27 2017 16:43
@TylerMoeller @TylerMoeller ur right i just removed it and did it your way and it worked.. omg thankyou soo much i was struggling with this for 2 days straight lol
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:44
Glad that helped - it's already looking better
Moisés Man
@moigithub
Jan 27 2017 16:44
IF u check the documentation...
replace have 2 parameters
.replace(param1, param2)
param1 can be a string or a regex expression
param2 can be a string or a callback function
mdn.io/string.replace <--- more info there @Hello911
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:44
Try to make one change at a time, sometimes it's helpful to create a new codepen to try out new things. Once you get it working, you can integrate it into your portfolio, one step at a time.
Steven Failla
@Stevo99
Jan 27 2017 16:45
yea but why is that last line a diff color if its the same text in all three lines
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:45
Look at it very carefully, there's one small thing missing
Steven Failla
@Stevo99
Jan 27 2017 16:45
yea that s kind of what ive been doing to troublshoot so i know what you mean
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:45
But it can make a big difference as far as the code editor guessing what you want to do
Steven Failla
@Stevo99
Jan 27 2017 16:45
ohh
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:46
blob
The same kind of thing is going on with your CSS here - background-size should be purple
Jon Berard
@turdfurgeson
Jan 27 2017 16:46
Anyone help me out with dropdown menu button in Bootstrap? I am pulling my hair out after spending all morning trying to get the menu to work. Any pointers as to what I have going wrong? I have followed the bootstrap documentation.
<head>
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Permanent+Marker|Raleway" rel="stylesheet">

</head>

<body>
  <!--- builds basic static navbar --->
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container-fluid">

  <!--- Branding on left side --->
        <div class="navbar-header navbar-left">
          <a class="navbar-brand" href="#">TurdFurgeson</a>
        </div>

  <!--- Dropdown menu rightside --->
      <div class="dropdown navbar-right">
        <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown"><i class="fa fa-bars 2x">           </i></button>
        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
          <a class="dropdown-item" href="#">About</a>
          <a class="dropdown-item" href="#">Projects</a>
          <a class="dropdown-item" href="#">Let's Talk</a>
        </div>       
      </div>

    </nav>


</body>
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:46
Just one small thing missing again
Jon Berard
@turdfurgeson
Jan 27 2017 16:47
Well that didn't format correct. Sorry
Steven Failla
@Stevo99
Jan 27 2017 16:47
haha your right the quotation marks!!
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:47
Yep!
Jon Berard
@turdfurgeson
Jan 27 2017 16:47
Paul Maxwell
@paulmaxwell
Jan 27 2017 16:48
@khaduch cool thanks Ken
Steven Failla
@Stevo99
Jan 27 2017 16:48
@TylerMoeller thanks again bro Im so excited to get back to work
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:48
@turdfurgeson You can edit your posts here in gitter for up to 5 minutes after making a comment. Use backticks for code formatting: https://github.com/freeCodeCamp/freeCodeCamp/wiki/Code-Formatting
@Stevo99 Good luck :+1:
Jon Berard
@turdfurgeson
Jan 27 2017 16:48
Thanks, @TylerMoeller
Baillie O'Grady
@baillieo
Jan 27 2017 16:48
Tyler, speech marks are your URL
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:49
blob
@turdfurgeson Add jQuery and Bootstrap.js to your codepen project and your dropdown should work
Hello911
@Hello911
Jan 27 2017 16:51
@moigithub That is actually the page I am reading. Thanks
Jon Berard
@turdfurgeson
Jan 27 2017 16:52
@TylerMoeller Many thanks. I was pulling my hair out trying to figure it out. lol
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 16:53
Hello friends, can somebody how to add my projects thus far (just the Tribute Page) into my portfolio. Here is my codepen link : http://codepen.io/aymohamed/pen/ZLJWwJ
Bigyan Karki
@bigyankarki
Jan 27 2017 16:53
//get the address from the IP Geolocation API
function getLocation() {
  $.getJSON("http://ip-api.com/json", function(loc){
    $("#cityName").text(loc.city + ', ' + loc.regionName + ', ' + loc.country)
    getWeather(loc.lat, loc.lon);
  })
    .fail(function(err) {
    getWeather()
  });
}

getLocation();

//Retreive temperature details from openweathermap.org using longitude and latitude from previous API
function getWeather(lat, lon) {
var apiAddress = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&units=imperial&type=accurate&APPID=9d4a841a5b68f2cc43c97d5224e11086";
  $.getJSON(apiAddress, function (weatherData){

    tempF = weatherData.main.temp.toFixed(0);
    tempC = ((tempF- 32)*(5/ 9)).toFixed(0);
    weather = weatherData.weather[0].description;
    weatherId = weatherData.weather[0].id ;
    wind= weatherData.wind.speed;

  $("#weather").text(weather + ', Wind speed: ' + wind + ' mph');
    $("#temp").text(tempF + ' °F');
            });
}

//to convert celcius into farenheit using data from earlier function.
    $("#conversion").click(function() {
      if($("#temp").text().indexOf('F') > -1) {
        $("#temp").text(tempC + ' °C');
      }

      else {
         $("#temp").text(tempF + ' °F');
      }
    })

//to change the background image according to weather.
var imageArray = [];
var png = ['01d', '01n', '02d', '02n', '03d', '03n', '04d', '04n', '09d', '09n', '10d', '10n', '11d', '11n', '13d', '13n', '50d', '50n'];
var bodyImages = [/*clear sky*/ 'https://media.giphy.com/media/l3vRoeR8KaNNs3g88/giphy.gif',
               /* clear night*/ 
                 'https://media.giphy.com/media/SE5Qvze2QBpbq/source.gif', 
                 /* few clouds*/
                 'https://media.giphy.com/media/o6qaN00DUo7x6/giphy.gif',
                 /*few clouds night*/
                 'https://media.giphy.com/media/R19AHAAwMnEpa/giphy.gif',
                 /*scattered clouds*/
                 'https://media.giphy.com/media/qZMonv0Jty1P2/giphy.gif',
                 /*night scattered clouds*/
                 'https://media.giphy.com/media/afuXKLnDHbb8I/giphy.gif',
                 /*broken clouds*/
                 'https://s-media-cache-ak0.pinimg.com/originals/58/25/32/58253287ef7d5f5bccc3490d64017ffd.jpg',
                 /*night brokenn clouds*/
                 'http://www.troyjohnstone.com/astrophotography/images/sky_clouds_night_moon_2006_09_09_04.jpg',
                 /*shower rain*/
                 'https://media.giphy.com/media/oaNFVNEcvWv5K/giphy.gif',
                 /*night shower rain*/
                 'https://s-media-cache-ak0.pinimg.com/originals/52/07/68/5207680e1eafd7233ab094b5f910e6af.gif',
                 /*rain*/
                 'https://media.giphy.com/media/BAD9hUGYZkqPe/giphy.gif',
                 /*night rain*/
                 'http://umad.com/img/2015/6/night-rain-gif-9410-9796-hd-wallpapers.jpg',
                 /*thunderstorm*/
                 'https://media.giphy.com/media/8xY1YYpEZ4dws/giphy.gif',
                 /*night thunderstorm*/
                 'https://media.giphy.com/media/8xY1YYpEZ4dws/giphy.gif',
                 /*snow*/
                 'https://media.giphy.com/media/OdOfTkw2uVADC/giphy.gif',
                 /*night snow*/
                 'https://media.giphy.com/media/Ok928ivi56clq/giphy.gif',
                 /*mist*/
                 'https://media.giphy.com/media/LmC5rpntvJPxe/giphy.gif',
                  /*night mist*/
                  'https://media.giphy.com/media/ofrQ8FYfTD8gE/giphy.gif'
                 ];
var imageArray = [];

for (var i = 0; i < png.length; i++) {
  for (var j = 0; j < bodyImages.length; j++){
    if (png[i] == weatherId) {
      imageArray.push(bodyImages[j]);
      $("body").css('background-image', 'url('+ imageArray[i] +')');
    }
  }
}
what is wrong with the last part of this code?
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 16:54
Hello friends, can somebody how to add my projects thus far (just the Tribute Page) into my portfolio. Here is my codepen link : http://codepen.io/aymohamed/pen/ZLJWwJ
here is the codepen
@aymohamed maybe you jut add a screenshot of the portfolio and link the screenshot to your portfolio codepen address
Tyler Moeller
@TylerMoeller
Jan 27 2017 16:58
@bigyankarki Use your dev console to help debug these kinds of issues. (Ctrl+Shift+J). That last part of your code is running before your getJSON calls finish, so weatherId is not defiined (yet).
Bigyan Karki
@bigyankarki
Jan 27 2017 17:01
how can i fix it @TylerMoeller
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:01
@bigyankarki , is that how it's mostly done
Bigyan Karki
@bigyankarki
Jan 27 2017 17:02
@aymohamed i dont know about that though. i am novice too. so I would have done that :D
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:03
lol ok bro
Tyler Moeller
@TylerMoeller
Jan 27 2017 17:04
@bigyankarki As a hint, you may want to refresh on how JavaScript scope works. Variables defined inside a function are only visible to that function and any sub functions. After that, look at the Weather ID values you get back from the API and compare those to the icon png values. They can't be compared with ==
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:04
How do I make my pages slide over each other ??? http://codepen.io/aymohamed/pen/ZLJWwJ
Tyler Moeller
@TylerMoeller
Jan 27 2017 17:05
For example, @bigyankarki:
    "weather": [
        {
            "id": 500,
            "main": "Rain",
            "description": "light rain",
            "icon": "10n"
        }
Bigyan Karki
@bigyankarki
Jan 27 2017 17:06
@TylerMoeller i defined weatherId as a global veriabale
so shouldn't it be available to every other functions as well?
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:08
Where are the people??
Nobody to help today
Tyler Moeller
@TylerMoeller
Jan 27 2017 17:09
@bigyankarki When you call an API, you have to visit an URL to get that data. Meanwhile, the rest of your code has already finished running. See this as an example with setTimeout:
var myGlobalVariable = 'hello';
myGetJsonFunction();

function myGetJsonFunction() {
  setTimeout(function() {
    myGlobalVariable = 'hello world';
    console.log(myGlobalVariable); // hello world
  }, 200);

  console.log(myGlobalVariable); // hello
}

console.log(myGlobalVariable) // hello
@aymohamed For your portfolio images, you can use a bootstrap grid. That's what lots of people use. http://getbootstrap.com/css/#grid
Here are some examples, with images near the bottom: http://s.codepen.io/TylerMoeller/pen/qNrbok
Nizar Soualhia
@nsoual
Jan 27 2017 17:16
hey guys ! i'm currently working on the random quote machine challenge and i can't quite figure out why i can't display the quote i receive using the ajax request. http://codepen.io/Nsoual/pen/OWxRKw?editors=1010
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:20
@TylerMoeller , I mean, I know the row column etc bootstrap concept but I mean, is it advisable to use a screenshot of the tribute page? and if yes, a screenshot does not have a url.
Tyler Moeller
@TylerMoeller
Jan 27 2017 17:21
@aymohamed Sorry, I misunderstood the question ;)
You can upload images from your computer to https://postimage.io/
That's what lots of people use.
They'll give you a URL you can use in your portfolio project
@nsoual I think for that API, you have to use dataType: 'html', instead of dataType: 'json',
Abdijabar Yussuf Mohamed
@aymohamed
Jan 27 2017 17:27
thanks @TylerMoeller
Nizar Soualhia
@nsoual
Jan 27 2017 17:31
@TylerMoeller Thanks !!
Hello911
@Hello911
Jan 27 2017 17:42
/\s{2,}/g I know /\s/targets space. And g is global (which I don't exactly understand) But what is {2,}?
Sorin Ruse
@sorinr
Jan 27 2017 17:56
hi guys. any idea whats the best db to choose for a project based on node?
Dan Anderson
@Danderson1603
Jan 27 2017 17:58
Hey! I've nearly finished my portfolio page. The only thing I have struggled with is getting the navbar to act as a drop down when on a small screen. Click on the icon and nothing happens. Can someone help? https://codepen.io/Danderson1603/pen/KaXBZm/
@TylerMoeller You're a life saver! Didn't know about that postimage link. Been trying to figure out how to do it
Ken Haduch
@khaduch
Jan 27 2017 17:59
@sorinr - it seems that MongoDB is the "standard" one that people seem to be using, but it is not a good relational database, from what I have read... If you google that question, do you get any pages that show all of the options? Are you familiar with some databases? Are they directing you to Cloud9 as a server? What do they offer if you start a node project?
vínαч puppαl
@vinaypuppal
Jan 27 2017 18:00
@Danderson1603 add jquery(first) and bootstrap.js from settings ->javascript -> quick add then it will work
Dan Anderson
@Danderson1603
Jan 27 2017 18:01
@vinaypuppal That's great! Thanks for the help
Ken Haduch
@khaduch
Jan 27 2017 18:02
@sorinr - I found this: https://blog.risingstack.com/node-js-database-tutorial/ - just scanning through it.
Sorin Ruse
@sorinr
Jan 27 2017 18:02
@Danderson1603 juat add jquery and bootstrap.js in pen settings
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:03
@sorinr There is no best db for use with node.js :) depends on what you need to do
MySQL, Mongo, Redis are all good options
akhilPotla97
@akhilPotla97
Jan 27 2017 18:05
@akhilPotla97
Hello, I have started the TwitchTV project however, my ajax does not work.
$.ajax({
url:
"https://api.twitch.tv/kraken/streams/" + streamer + "?callback=?",
dataType: "jsonp",
data: {
format: "json"
},
success: function(channel) {
console.log("111");
},
error: function(xhr, status, error) {
console.log("xhr: " + xhr);
console.log("status: " + status);
console.log("error: " + error);
}
Sorin Ruse
@sorinr
Jan 27 2017 18:06
@khaduch @TylerMoeller the idea is the project i've made last year still in production is based on laravel and mysql. its working just fine but for my learning curve i would try to transpose it to node. not sure if to change the db or not. thats my dilema :)
akhilPotla97
@akhilPotla97
Jan 27 2017 18:06
I read that I need to have a client id for twitch api; however, this is not recommended since codepen is public. So how would i work around this to successfully call the api
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:09
@akhilPotla97 You can use Freecodecamp's mirror of the twitch API that does not require a key: https://wind-bow.gomix.me/
siaka tayou karl william
@theabstact237
Jan 27 2017 18:09
hello guys, im having problem with loading the image on my code pine editor, I have used the <img src="url of the picture"> tag, but the codePen simulator dont load my image which url is on wikipedia.Help please!
Sorin Ruse
@sorinr
Jan 27 2017 18:09
@khaduch @TylerMoeller if i would go for relational i was thinking to go this time for postgres but for nonsql i don't know
akhilPotla97
@akhilPotla97
Jan 27 2017 18:09
@theabstact237 thank you very much
correction @TylerMoeller
siaka tayou karl william
@theabstact237
Jan 27 2017 18:10
@ghulamshabir hi buddy,im having problem with loading the image on my code pine editor, I have used the <img src="url of the picture"> tag, but the codePen simulator dont load my image which url is on wikipedia.Help please!
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:12
@sorinr Maybe couchdb for noSQL? There's a nodeschool workshopper for it here: https://github.com/robertkowalski/learnyoucouchdb
siaka tayou karl william
@theabstact237
Jan 27 2017 18:13
@ghulamshabir is it due to a frame issue or should i load the image on my computer and then LOAD IT ON THE codePen simulator
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:15
@theabstact237 What is the URL you are trying to use?
Hello911
@Hello911
Jan 27 2017 18:16
Is there a regex that target all punctuations? Or do I have to write them all down?
Ken Haduch
@khaduch
Jan 27 2017 18:16
@sorinr - https://www.slant.co/topics/179/~best-databases-to-use-for-node-js-applications - another one. I read an article that was really dissing the MongoDB for some applications - things that are heavy relational queries. I don't know if I could find the link to that, but perhaps googleing for it would work? Google this "problems with mongodb" and you'll find a plethora of articles. This is the one that I remember reading: http://www.sarahmei.com/blog/2013/11/11/why-you-should-never-use-mongodb/ - I cannot vouch for the information but I tend to believe that it is true. I guess that perusing a few of those articles would be interesting?
siaka tayou karl william
@theabstact237
Jan 27 2017 18:17
Sorin Ruse
@sorinr
Jan 27 2017 18:18
@TylerMoeller @khaduch thank you guys for all the info. i have what to read tonight and make my decision
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:18
@theabstact237 That's a link to a wikipedia page about the file. To get the image address, right-click it and select "Copy Image Address"
blob
Hello911
@Hello911
Jan 27 2017 18:28
function palindrome(str) {
  str=str.replace(/\s+/g,"");
  str=str.replace(/[^w\s]|_/g,"");
  var string="";
  string=str.reverse();
  if(string===str){
    return true;
  }else return false;
}


palindrome("eye");
Why does the error message say str.reverse is not a function?
JD Tadlock
@jdtdesigns
Jan 27 2017 18:33
@Hello911 You have to turn it into an array to reverse it ;)
Chris Wingler
@chriswingler
Jan 27 2017 18:35

anybody know why my query string variables are returning undefined?

http://codepen.io/chriswingler/pen/YpvRWd?editors=0011

Hello911
@Hello911
Jan 27 2017 18:36

@jdtdesigns

function palindrome(str) {
  str=str.replace(/\s+/g,"");
  str=str.replace(/[^w\s]|_/g,"");

  var string="";

  string=str.split("").reverse().join("");

  if(string===str){
    return true;
  }else return false;
}



palindrome("eye");

This sorta work. But for ex, palindrome("1 eye for of 1 eye.") is returning false.

Moisés Man
@moigithub
Jan 27 2017 18:46
str=str.replace(/[^w\s]|_/g,""); this is not accurate
ur regex saying NOT "w" (letter/character literally)
Tyler Moeller
@TylerMoeller
Jan 27 2017 18:49
@chriswingler It takes some time to visit ipinfo.io and get your location. By the time you've gone to that URL, parsed the JSON, and set a value for lon and lat, your code has already tried to set a value for your api variable.
Hello911
@Hello911
Jan 27 2017 18:49
I GOT IT. Thanks guys.
@jdtdesigns Thanks
CamperBot
@camperbot
Jan 27 2017 18:50
hello911 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 892 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Chris Wingler
@chriswingler
Jan 27 2017 19:02
thanks @TylerMoeller .. i suspected it was something like that.. is there a way to get the timing right?
CamperBot
@camperbot
Jan 27 2017 19:02
chriswingler sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1416 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sorin Ruse
@sorinr
Jan 27 2017 19:05
@chriswingler you can do it like example
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:06
@chriswingler To avoid giving the answer directly, here's a good explanation to give some approaches for you to consider: http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call
Why isnt my image working
for background
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:07
Or, just have @sorinr write the logic for you :p
Chris Wingler
@chriswingler
Jan 27 2017 19:07
alright thanks @sorinr @TylerMoeller
CamperBot
@camperbot
Jan 27 2017 19:07
chriswingler sends brownie points to @sorinr and @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: chriswingler already gave tylermoeller points
:star2: 1145 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 27 2017 19:08
@TylerMoeller lol. its the last time i'm doing it :)
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:11
lol :)
Tina Townes
@tinatownes
Jan 27 2017 19:11
Sorry to interrupt! I'm very new to HTML/CSS and barely JS/Jquery, I've been playing around with the parallax scrolling effect. Tried searching, and it seems all examples show the parallax class inside a <div> tag. I tried putting parallax class in a <span> tag and even <section> tag, and parallax doesn't seem to work in those cases. I realize there are semantic differences between <div>, <section> and <span>....but, technically, why would parallax only work with <div> and not <span>? Is this something to do with JQuery? Thanks.
Sorin Ruse
@sorinr
Jan 27 2017 19:12
@TylerMoeller i have seen so many weather apps so i can tell you the weather all around the globe without writing even one line of code :)
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:13
@ZenZate I'm guessing that server doesn't allow hotlinking or it is getting blocked by codepen. Try using postimage instead, you can paste the image URL in there and get one that will work with codepen: https://postimage.io/web.php
@tinatownes It really depends on how the parallax is implemented. Hard to say without seeing what library/framework you are using for parallax
ZenZate
@ZenZate
Jan 27 2017 19:15
@TylerMoeller Do i use this https://postimg.org/image/c4yeycog1/
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:16
@ZenZate Use the one that ends with .jpg
It should say Direct link: next to it
ZenZate
@ZenZate
Jan 27 2017 19:17
kk
Tina Townes
@tinatownes
Jan 27 2017 19:17
@TylerMoeller - Thank you! Crazy as this sounds, that's the answer I'm looking for at this time! I suspected I need to learn more and progress into JQuery libraries to fully comprehend the mechanism.
CamperBot
@camperbot
Jan 27 2017 19:17
tinatownes sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1417 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Chiu Yong
@chiuyong
Jan 27 2017 19:19
@TylerMoeller tyler, can you help me?
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:19
@chiuyong I can try :)
ZenZate
@ZenZate
Jan 27 2017 19:20
@TylerMoeller I cant find the direct link bit
Tina Townes
@tinatownes
Jan 27 2017 19:20
@TylerMoeller - BTW I took a look at your https://tylermoeller.github.io/ and it's really well organized. Do you use a little bit of the parallax with your scroll-and-shrink menu bar, or is that another effect?
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:22
@tinatownes Uggh, I want to rewrite that lol. It isn't parallax, it's the bootstrap affix plugin if I remember correctly
ZenZate
@ZenZate
Jan 27 2017 19:23
@TylerMoeller I will not be able to achieve that standard on this challenge
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:24
@ZenZate It looks like this is the image URL you want https://s24.postimg.org/5r9bv3jk5/27239392_coding_wallpapers.jpg
Tina Townes
@tinatownes
Jan 27 2017 19:24
@TylerMoeller - Ha! Well I think it's great! Bootstrap affix; I'll check it out. Thanks again.
CamperBot
@camperbot
Jan 27 2017 19:24
tinatownes sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:24
Don't worry about trying to make a profile that looks like the example - I wrote my portfolio after I finished all the front-end projects. Even since then, I've learned a lot and want to rewrite it
CamperBot
@camperbot
Jan 27 2017 19:24
:warning: tinatownes already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:25
Thanks for the compliment :)
ZenZate
@ZenZate
Jan 27 2017 19:25
SHould i skip the challenge and come back to it later
Japneet Singh
@japsuchiha
Jan 27 2017 19:25
http://codepen.io/designercoder123/pen/GrOZxB?editors=0010 need a little help! my quotes are not being generated
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:26
No, try your best and update it as you go through more projects. I think it's good practice
ZenZate
@ZenZate
Jan 27 2017 19:26
kk thx a lot
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:27
Maybe check out some of these for inspiration: https://github.com/iRaul/awesome-portfolios
I kind of like the creativity for this one lol, but wouldn't do it for my own portfolio: http://jakealbaugh.com/
Chiu Yong
@chiuyong
Jan 27 2017 19:28
Well, I want to build a navbar like this. But I don't know how to start, can you give me a start point?
ZenZate
@ZenZate
Jan 27 2017 19:29
I cannot do that
They look amazing
ughhh kmn
do they tell u to constantly update it
fcc i mean
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:30
@ZenZate You kind of have to update it constantly - at least the portfolio section. Every time you finish a project, you'll want to add a new image.
@chiuyong Do you have a screenshot?
ZenZate
@ZenZate
Jan 27 2017 19:32
How do i upload the image I use postimage right but then how do i export as direct link
Chiu Yong
@chiuyong
Jan 27 2017 19:32
@TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:32
@ZenZate Just go directly to here: https://postimage.io/
Click "Choose Images"
Chiu Yong
@chiuyong
Jan 27 2017 19:33
dante.PNG
@TylerMoeller It's better you open the link to see the scrolling effect
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:35
@chiuyong Freecodecamp is a good start for building something like that :)
I don't know how to give you a better start - you could do it with Bootstrap or write it from scratch.
It doesn't look overly complicated - a white background with a Logo on the left, links on the right.
Jessi L Wasell
@JessiW
Jan 27 2017 19:37
Hi - I just have one quick question - its related to Data Viz and React though there isn't anyone there in that room.
Chiu Yong
@chiuyong
Jan 27 2017 19:37
@TylerMoeller I'm doing freecodecamp, but I have to build this navbar urgent
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:37
The hard part might be using the search functionality - without a database, you won't have much to search
Jessi L Wasell
@JessiW
Jan 27 2017 19:37
I'm almost done with my camper leaderboard - but I'm trying to get the user names that render to also be links to their profile page - and I'm not sure how to get that done....
I'm trying to do something like this.....
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:38
@chiuyong I'm not sure how I can help, you'll have to show me what issues you are having with your code
Jessi L Wasell
@JessiW
Jan 27 2017 19:40
 let userUrl = userA.link(https://freecodecamp.com/ + userA);
but that doesn't work - is there anything else I can try?
If someone would like to go over to the DataViz room to talk about this - I'd be happy to quit posting DataViz things here! :)
Tyler Moeller
@TylerMoeller
Jan 27 2017 19:44
@JessiW Line 89 needs to append the username to the URL:
            <td><a href={this.props.userUrl + this.props.user.username}>{this.props.user.username}</a></td>
Also, don't forget target="_blank" ;)
Jessi L Wasell
@JessiW
Jan 27 2017 19:45
oh - okay - thank you @TylerMoeller - I'll try that - just a sec :)
CamperBot
@camperbot
Jan 27 2017 19:45
jessiw sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1418 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Jessi L Wasell
@JessiW
Jan 27 2017 19:48
Wow - ok - that was simple and I understand why that works - thank you @TylerMoeller ! :)
CamperBot
@camperbot
Jan 27 2017 19:48
jessiw sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: jessiw already gave tylermoeller points
Jessi L Wasell
@JessiW
Jan 27 2017 19:49
I just was having a hard time putting the proper pieces together on that for some reason :)
John Irle
@JohnIrle
Jan 27 2017 19:50
Hi I'm following this tutorial https://vladimirponomarev.com/blog/authentication-in-react-apps-creating-components and after setting up a routes.js for react-router I'm getting this error "Uncaught Error: The root route must render a single element" google searches are telling me that webpack doesn't support es6 but that doesn't seem correct.
import Base from './components/Base.jsx';
import HomePage from './components/HomePage.jsx';
import LoginPage from './containers/LoginPage.jsx';
import SignUpPage from './containers/SignUpPage.jsx';


const routes = {
  // base component (wrapper for the whole application).
  component: Base,
  childRoutes: [

    {
      path: '/',
      component: HomePage
    },

    {
      path: '/login',
      component: LoginPage
    },

    {
      path: '/signup',
      component: SignUpPage
    }

  ]
};

export default routes;
ReactDom.render((
    <MuiThemeProvider muiTheme={getMuiTheme()}>
        <Router history={browserHistory} routes={routes} />
    </MuiThemeProvider>), document.getElementById('react-app'));
Chiu Yong
@chiuyong
Jan 27 2017 19:55
@TylerMoeller I tried using this http://codepen.io/chiuyc/pen/MJOJmp
div class="col...
but I don't know if it's right
Philipp Scholz
@philipp32
Jan 27 2017 20:04
Hey, I need some help with the wikipedia API. How can I solve the "Access-Control-Allow-Origin"- header problem without a proxy?
Chinmaya B
@sharang108
Jan 27 2017 20:05
Do I have to create a JSON file with quotes for this https://www.freecodecamp.com/challenges/build-a-random-quote-machine project?
Japneet Singh
@japsuchiha
Jan 27 2017 20:07
@sharang108 not really. you can use an api
Chinmaya B
@sharang108
Jan 27 2017 20:07
@designercoder123 I don't know any such api
John Irle
@JohnIrle
Jan 27 2017 20:08
Found the problem. I wasn't exporting one of my components
Japneet Singh
@japsuchiha
Jan 27 2017 20:08
@sharang108 https://quotesondesign.com/api-v4-0/ ---> this is one
and there are many more out there
Chinmaya B
@sharang108
Jan 27 2017 20:10
@designercoder123 Okay but don't you think that the previous JSON tutorial should give us a head start for such APIs
@designercoder123 thanks for the help
CamperBot
@camperbot
Jan 27 2017 20:10
sharang108 sends brownie points to @designercoder123 :sparkles: :thumbsup: :sparkles:
:cookie: 282 | @designercoder123 |http://www.freecodecamp.com/designercoder123
Chinmaya B
@sharang108
Jan 27 2017 20:12
@designercoder123 Okay.
Japneet Singh
@japsuchiha
Jan 27 2017 20:12
@sharang108 yeah it should, but its more focussed on self learning. They want you to read the documentation and do it by yourself because this is what counts.
Chinmaya B
@sharang108
Jan 27 2017 20:12
@designercoder123 What documentation you are talking about?
Japneet Singh
@japsuchiha
Jan 27 2017 20:18
@sharang108 the one that says how to use the api
Chinmaya B
@sharang108
Jan 27 2017 20:23
@designercoder123 It'd be helpful if you give me a link directly.
Ivan Ngundela
@ingundela
Jan 27 2017 20:33
hi guys.. how do I style this 3 div horizontally:
<div id="menu">
          <div id="registo">Registar-me</div>
          <div id="registo1">Meu Vodacom</div>
          <div id="registo2">Ajuda e Suporte</div>


        </div>
Chris
@bestintown23
Jan 27 2017 20:33
how can I make my image and gif be centered in the page instead of off to the left? http://codepen.io/bestintown23/pen/XpzXmy
chris10emery
@chris10emery
Jan 27 2017 20:36
I am working on my Personal Portfolio Project and am stuck on how to start. I have not coded in um -- YEARS. I'm not having issues doing the right things from a code perspective - - but rather, if I think about my project and the related collateral being stored on a server and in folders... where is that on CodePen - how do I find support on this? If I have a set of images and buttons I have designed - where do they live? I cruised up to this point and am now feeling uh...
and @bestintown23 - what about using <center></center> ?
Chris
@bestintown23
Jan 27 2017 20:39
<center></center> is no longer obsolete according to the W3C so i cant use that. @chris10emery
Tom
@moT01
Jan 27 2017 20:39
@chris10emery im not sure if i get what your asking, on the codepen servers i suppose. you designed some buttons and images, where did you put them, how are they designed
@bestintown23 try margin: 0 auto;
Lorrie Pearson
@Lorrie01
Jan 27 2017 20:41
@chris10emery in codepen you can upload images other media..use the assets button
@chris10emery you may need to be a pro-member of Codepen to upload assets, otherwise you can link to them if you have url's. The membership starts at $9 a month.
Tyler Moeller
@TylerMoeller
Jan 27 2017 20:43
@chiuyong That's a good start. No need to use columns in the nav though, to replicate the effect you want. To place something on the right, for example, you can use the navbar-right class: http://getbootstrap.com/components/#navbar-component-alignment
chris10emery
@chris10emery
Jan 27 2017 20:43
I have designs from illustrator - etc on my desktop...
oh
maybe I can put them on google docs - I'll figure it out. ;-) thx
Tyler Moeller
@TylerMoeller
Jan 27 2017 20:44
Franco Javier Danussi
@francodanussi
Jan 27 2017 20:45
Hello there, is there anybody capable to help me debugging this codepen? https://codepen.io/francodanussi/pen/YNraEo/?editors=1111
chris10emery
@chris10emery
Jan 27 2017 20:45
thx @Lorrie01 & moTo1
CamperBot
@camperbot
Jan 27 2017 20:45
chris10emery sends brownie points to @lorrie01 :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @lorrie01 |http://www.freecodecamp.com/lorrie01
Michael Schmidt
@lafisrap
Jan 27 2017 20:47
@francodanussi What is the problem?
chris10emery
@chris10emery
Jan 27 2017 20:47
@bestintown23 ...obsolete - sigh
Tyler Moeller
@TylerMoeller
Jan 27 2017 20:49
@chris10emery To place an image up on the web, use https://postimage.org. If they're your own images and you want to add licensing information to them, you might try a site like Flickr: https://www.flickr.com/
Michael Schmidt
@lafisrap
Jan 27 2017 20:49
@francodanussi The console means that it needs jquery: "Uncaught Error: Bootstrap's JavaScript requires jQuery"
Bryan Wegman
@bwyan
Jan 27 2017 20:50
could anyone help me get the thumbnails in my gallery wrapping correctly? There’s consistently a gap in the first row. http://codepen.io/bwyan/pen/OyJaoz?editors=1000
Franco Javier Danussi
@francodanussi
Jan 27 2017 20:52
@lafisrap but if I add jQuery then what? Do you mean the code is right?
Michael Schmidt
@lafisrap
Jan 27 2017 20:52
@fdra
@francodanussi I don't know yet. Before jquery is running ... ;-)
Just tell me where you got stuck
Tyler Moeller
@TylerMoeller
Jan 27 2017 20:53
@lafisrap He isn't using jQuery, but you're right, to get rid of that error in the console, he needs to add it
Franco Javier Danussi
@francodanussi
Jan 27 2017 20:55
@lafisrap I mean, in my codepen the console doesn't give me any clue or response. I just click the button and nothing happens, I don't know if I'm doing the fetch function in a proper way
@TylerMoeller @lafisrap By the way, thanks for getting involved, both of you
CamperBot
@camperbot
Jan 27 2017 20:55
francodanussi sends brownie points to @tylermoeller and @lafisrap :sparkles: :thumbsup: :sparkles:
:cookie: 293 | @lafisrap |http://www.freecodecamp.com/lafisrap
:star2: 1419 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 27 2017 20:57
You are loading your codepen over HTTPS though, I noticed, and Open Weather Map only works over HTTP unless you pay money
And navigator.geolocation only works over HTTPS in Google Chrome
Michael Schmidt
@lafisrap
Jan 27 2017 20:58
@francodanussi Put a console.log("Hello!") before line 2 and a console.log(position) before line 3
Then look in the console (right mouse button on the output window/investigate (the lowest option) )
Franco Javier Danussi
@francodanussi
Jan 27 2017 20:59
@lafisrap I did that, as you said.
@TylerMoeller Ok, thanks for the info. I think I will code this weatherapp using jQuery. I used fetch for the previous exercise and it felt really easy, but know it's not collaborating at all.
CamperBot
@camperbot
Jan 27 2017 21:03
francodanussi sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: francodanussi already gave tylermoeller points
Michael Schmidt
@lafisrap
Jan 27 2017 21:03
@francodanussi Till the console.log(lon); it works ;-)
But @TylerMoeller is right. You have to choose either another way to get the location or to get the weather data. I chose to get the location different.
Franco Javier Danussi
@francodanussi
Jan 27 2017 21:05
yeah, now that's working, because of the https. But the fetch library it's not doing the right job
Ok @lafisrap @TylerMoeller I will think about that
Michael Schmidt
@lafisrap
Jan 27 2017 21:07
@francodanussi $.getJSON() is a nice command ;-)
Franco Javier Danussi
@francodanussi
Jan 27 2017 21:07
So if the API does not allow HTTPS and the only way to have geodata is with HTTP, then? Do you know any free option?
@lafisrap Yeah. I know that get.JSON() is smooth but I wanted to try new stuff
Michael Schmidt
@lafisrap
Jan 27 2017 21:08
@francodanussi Try: $.getJSON( "http://ip-api.com/json", function( location ) { });
Franco Javier Danussi
@francodanussi
Jan 27 2017 21:08
@lafisrap There you go, nice! thank you Michael
CamperBot
@camperbot
Jan 27 2017 21:08
francodanussi sends brownie points to @lafisrap :sparkles: :thumbsup: :sparkles:
:warning: francodanussi already gave lafisrap points
Michael Schmidt
@lafisrap
Jan 27 2017 21:08
Or fetch( "http://ip-api.com/json" );
Franco Javier Danussi
@francodanussi
Jan 27 2017 21:09
@lafisrap ;)
Jon Berard
@turdfurgeson
Jan 27 2017 21:20
Hey, everyone! I can't seem to figure out the white line at the top of my navbar on my portfolio project. I have everything set to transparent, thought it was maybe a chrome bug, but it shows up in safari too. So it must be something on my end. Thanks in advance.
http://codepen.io/turdfurgeson/pen/apVvzV
Mike Boardley
@Boardley
Jan 27 2017 21:22
@turdfurgeson
.splash-hi { margin-top: 0;}
Jon Berard
@turdfurgeson
Jan 27 2017 21:23
Learned a new trick@! THANKS, @Boardley! Had no idea. Still pretty new to this.
CamperBot
@camperbot
Jan 27 2017 21:23
turdfurgeson sends brownie points to @boardley :sparkles: :thumbsup: :sparkles:
:cookie: 281 | @boardley |http://www.freecodecamp.com/boardley
Mike Boardley
@Boardley
Jan 27 2017 21:24
@turdfurgeson - You're welcome.
Bryan Wegman
@bwyan
Jan 27 2017 22:38
If anyone’s looking for things to answer later, you can disregard my earlier question. Figured it out.
Icah Banton
@remdata
Jan 27 2017 22:43
Hello. HELP!!!. I had gotten my Random Quote machine working. Now for some reason it is not working. Can someone please take a look at it to see if there is perhaps some setting I have neglected? https://codepen.io/ibanton/pen/jyrNLj
Bigyan Karki
@bigyankarki
Jan 27 2017 22:50
@remdata remove 's' from https
Tom
@moT01
Jan 27 2017 22:51
@remdata seems to be getting stuck when you try to set the colors
i dont see anything with an id of quotetext
can anyone go through this and figure out why background picture is not changing
Icah Banton
@remdata
Jan 27 2017 23:00
@moT01 . I will check it. Guess I did not save my changes. Thanks.
CamperBot
@camperbot
Jan 27 2017 23:00
remdata sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 477 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 27 2017 23:02
@remdata yea, that got it working, let me know if more problems
Bigyan Karki
@bigyankarki
Jan 27 2017 23:02
@moT01 can you go through my problem ?
Tom
@moT01
Jan 27 2017 23:02
@bigyankarki i took a quick look, wondering if maybe you could make an object instead of going through loops
Bigyan Karki
@bigyankarki
Jan 27 2017 23:03
what do you mean by make an object instead of loops @moT01
dont we need it to check condition?
Tom
@moT01
Jan 27 2017 23:04
the condition is already in your json
Bigyan Karki
@bigyankarki
Jan 27 2017 23:04
how? @moT01
Tom
@moT01
Jan 27 2017 23:06
for the background image, make the key the description and the value the url...
object = {
    'broken clouds' : 'url here'
Icah Banton
@remdata
Jan 27 2017 23:08
@bigyankarki . I used document.body.style.backgroundImage in my javascript and removed "body{} " from CSS.
Tom
@moT01
Jan 27 2017 23:09
then set it with jquery, ... $("body").css('background-image', 'object.weather.description'); ...you may need to set the weather.description to a variable for that to work, ...if that makes any sense
im gonna try n make that work, ...gimme a bit
Chris Wingler
@chriswingler
Jan 27 2017 23:16
according to openweathermap api, it's 279.913 degrees outside
Matthew Bailin
@mdbailin
Jan 27 2017 23:22
Hey all, I was wondering if anyone had found a way to decouple a css class from an element midway as the class were being played
My question is in the context of the simon game
I'm trying to get the off button to work. I
I'd like something to happen like where the game is in mid "beep" and when the button is pressed, any button that's beeping would stop.
Icah Banton
@remdata
Jan 27 2017 23:31
@moT01 . I made the change for quoteText. However, It seems that somehow none of my layout is being applied.
Tom
@moT01
Jan 27 2017 23:54
@remdata still having problems?