These are chat archives for FreeCodeCamp/HelpFrontEnd

19th
Aug 2016
DJ
@qualitymanifest
Aug 19 2016 00:00
was decent
tfmlol
@tfmlol
Aug 19 2016 00:05
ok thanks @qualitymanifest I was also wondering if I can submit my projects via github instead of codepen, do you know if that matters?
CamperBot
@camperbot
Aug 19 2016 00:05
tfmlol sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1360 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Aug 19 2016 00:06
@tfmlol not sure on that. i think it's okay as long as your raw code is visible, as well as the output
tfmlol
@tfmlol
Aug 19 2016 00:08
awesome, thanks man
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:13
hi guys, im working on the calculator heres my code
http://codepen.io/JackEdwardLyons/pen/AXbdRZ?editors=1100
nearly done :)
any suggestions?
encount
@encount
Aug 19 2016 00:17
@JackEdwardLyons can’t add 0.3 + 6 gives answer as 9
DJ
@qualitymanifest
Aug 19 2016 00:17
a few things:
it allows multiple decimal points or operators ....+-*/
when you first enter a decimal point or operator, it appears on the left, and doesn't move to the correct position on the right until you enter another number
it has floating point imprecision. try 0.1 + 0.2. http://floating-point-gui.de/ has good info and ideas for fixes
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:18
yeah i just realised the multiple decimals
thanks
DJ
@qualitymanifest
Aug 19 2016 00:18
@encount hm. i just tried that and i get the correct answer, 6.3
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:18
thanks @encount
CamperBot
@camperbot
Aug 19 2016 00:18
jackedwardlyons sends brownie points to @encount :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @encount |http://www.freecodecamp.com/encount
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:21
i can add one(click) for the decimal
but how do I rebind it again
when you press clear , for example
encount
@encount
Aug 19 2016 00:30
@JackEdwardLyons I add a second array - so one keeps track off the chain of values and the other just the input - that way you can make sure only one decimal / sign is added topo a value - http://codepen.io/encount/full/grENxX/
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:34
yeah i added a class js-decimal-func
wow your calculator is intense! @encount
encount
@encount
Aug 19 2016 00:37
@JackEdwardLyons you should also disallow the signs being clicked on first click - it screws it up (ie /3 …)
DamianMitchell
@DamianMitchell
Aug 19 2016 00:41
@encount nice
Chris Cullen
@123xylem
Aug 19 2016 00:49
var time=3600;

$("#action").click(function setInterval(time){
  time-=1; },1000);                          

  $("#face").text(getTime(time));
    $("#set1").text(getTime(time)); 


});
Hi can someone explain what is wrong with my setInterval click function?
Jack Lyons
@JackEdwardLyons
Aug 19 2016 00:51
ahh ok thanks @encount
CamperBot
@camperbot
Aug 19 2016 00:51
jackedwardlyons sends brownie points to @encount :sparkles: :thumbsup: :sparkles:
:warning: jackedwardlyons already gave encount points
encount
@encount
Aug 19 2016 00:54
@JackEdwardLyons i only mention it as i just finished mine and it was amazing how many errors i found while the kids tested it :)
Jack Lyons
@JackEdwardLyons
Aug 19 2016 01:09
yeah
hey do you know how to make the operators stay to the right and not the left of the numbers @encount
would I have to add a class?
with direction
encount
@encount
Aug 19 2016 01:14
@JackEdwardLyons when a btn is clicked get the value from the display and add the btn value to the end of the string and then display it might work
Jack Lyons
@JackEdwardLyons
Aug 19 2016 01:20
ok cool ill try
thanks @encount
CamperBot
@camperbot
Aug 19 2016 01:20
jackedwardlyons sends brownie points to @encount :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @encount |http://www.freecodecamp.com/encount
Jack Lyons
@JackEdwardLyons
Aug 19 2016 01:22
yeah instead of appending, i prepended it
:)
Lauren Conners
@laurenconners
Aug 19 2016 01:25
encount
@encount
Aug 19 2016 01:26
@JackEdwardLyons have you checked it ? its not working properly
@laurenconners looks good - nice topic :)
Lauren Conners
@laurenconners
Aug 19 2016 01:28
I couldn't think of a real person, so I thought, screw it. Crowley it is.
encount
@encount
Aug 19 2016 01:29
@laurenconners fair enough I did Jack the ripper
Lauren Conners
@laurenconners
Aug 19 2016 01:31
NICE. I hadn't thought about anyone nefarious in real life. Kept trying to think of "Hero" types, or people I "admire".
Oh wow, your Jack the Ripper one is very well done.
Jack Lyons
@JackEdwardLyons
Aug 19 2016 01:36
yeah woops
prepend isnt a good idea
@encount
encount
@encount
Aug 19 2016 01:37
@JackEdwardLyons they are all good ideas until you test them and they don’t work - thats how we learn
Damian Barnes
@BlackSuitAndroid
Aug 19 2016 01:46
Hey I was wondering if anyone could help me out here, I have pretty much finished the "Symmetric Difference" problem yet it doesn't seem to be working
function diffArray(arr1, arr2) {
  var newArray = arr1.concat(arr2);
  function diffArrays(obj) {
    if (arr1.indexOf(obj) === -1 || arr2.indexOf(obj) === -1) {
     return obj;
    }
  }
  return newArray.filter(diffArrays);
}

function dupes(arr) {
  var result = [];
  arr.forEach(function(value) {
    if (result.indexOf(value) < 0) {
      result.push(value);
    }
  });
}

function sym(args) {

  args = Array.prototype.slice.call(arguments);

 return args.reduce(function(acc, next) {
    acc = dupes(acc);
    next = dupes(next);
    acc = diffArray(acc, next);
    return acc;
  });
}

sym([1, 2, 3], [5, 2, 1, 4]);
Kevin Mulligan
@kmulligan
Aug 19 2016 02:05

@BlackSuitAndroid take everything else away but

function diffArray(arr1, arr2) {
var newArray = arr1.concat(arr2);
console.log(newArray);
}

what do you get?

@BlackSuitAndroid Also, here's how it looks to start the problem:
function sym(args) {
  return args;
}

sym([1, 2, 3], [5, 2, 1, 4]);
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:24
Hey people! How are you all?
I want your feedback on my Portfolio so far: https://codepen.io/gabrielshaad/full/BzLRdm/
Kevin Mulligan
@kmulligan
Aug 19 2016 02:24
@GabrielShaad Looking now. Can you look at this and tell me if it is centered on your machine?
http://codepen.io/kmulligan/full/QEPwXE/
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:25
I need a help with the background and transparency on the about section. How can I fill all the div with the transparency?
@kmulligan Totally centered! Nice job.
Kevin Mulligan
@kmulligan
Aug 19 2016 02:25
@GabrielShaad Are you running Windows, Mac, or Linux?
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:26
@kmulligan Mac, Safari.
@kmulligan Oh, now that I opened full page it's not working. :(
Kevin Mulligan
@kmulligan
Aug 19 2016 02:27
So confused it looks great in Chrome on Windows
And Internet Explorer
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:28
@kmulligan So, it looks awesome on every resolution except for 1024x768 and 1366x768.
@kmulligan So imagine the issue is with the width.
Kevin Mulligan
@kmulligan
Aug 19 2016 02:29
Yea.. but the width is set by bootstrap o_0
Anyways, you're trying to cover the entire about section with transparency?
like the whole photo?
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:30
@kmulligan It's weird then... Try setting it responsive manually.
@kmulligan Yes. I think it'll look better this way.
@kmulligan What do you think?
Kevin Mulligan
@kmulligan
Aug 19 2016 02:33
Never done that before, looking
Mostafa Syam
@pro-mos
Aug 19 2016 02:34
@kmulligan it looks good if you remove both empty .col-md-2 divs and set the container to md-12 instead of 8
Kevin Mulligan
@kmulligan
Aug 19 2016 02:36
@pro-mos --interesting... any idea why? I thought I was setting the grid up correctly...
@GabrielShaad so I'm guessing you tried
opacity: 0.7; and didn't like the result -- you want some of that different color?
Want to help, I'll look into it, but need to rock my daughter to sleep :)
Mostafa Syam
@pro-mos
Aug 19 2016 02:38
@kmulligan not sure i don't use bootstrap much
:smile:
Ken Haduch
@khaduch
Aug 19 2016 02:40
@kmulligan - that container class within your col-md-8 is conflicting with Bootstrap's definition of container. If you just change the class to.myContainer and the appropriate change in the class attribute, you'll see a different, then you can tweak the settings that you want without butting heads with Bootstrap
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:40
@kmulligan I'm concerned about the height though.
@kmulligan No worries! Thanks anyway.
CamperBot
@camperbot
Aug 19 2016 02:40
gabrielshaad sends brownie points to @kmulligan :sparkles: :thumbsup: :sparkles:
:cookie: 397 | @kmulligan |http://www.freecodecamp.com/kmulligan
Ken Haduch
@khaduch
Aug 19 2016 02:43
@kmulligan - bootstrap has a fixed width for the container, so if you just move away from that name for your 10 column div, that will make a difference. You can then tweak the remainder of the settings - maybe some left and right margin would be necessary to mimic the settings for the Bootstrap container.
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 02:46
Someone else can help me with the transparency? https://codepen.io/gabrielshaad/full/BzLRdm/
Kevin Mulligan
@kmulligan
Aug 19 2016 02:58
Thanks @khaduch
CamperBot
@camperbot
Aug 19 2016 02:58
kmulligan sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1557 | @khaduch |http://www.freecodecamp.com/khaduch
Kevin Mulligan
@kmulligan
Aug 19 2016 03:01
@GabrielShaad so have you tried opacity: 0.7 or something like that?
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:09
@kmulligan Yes, but it only gets darker.
tyl-er
@tyl-er
Aug 19 2016 03:22
Idk if we can general questions here, but I"m having a hard time with this. Only the first checkmark works and the text is supposed to be underlined.
http://codepen.io/tyl-er/pen/kXmkqB?editors=0100
Chris Cullen
@123xylem
Aug 19 2016 03:29
var time=72;
var time2=20;

function getTime(seconds) {
    var leftover = seconds;
    var hours = Math.floor(leftover / 3600);
    var minutes = Math.floor(leftover / 60); 
  leftover=leftover-(minutes*60);
console.log(hours,leftover,minutes);

  if(minutes>= 1 && minutes<=59){
        return(minutes + ':' + leftover);
    }
    else
    return(0 + ':'+ leftover);
 }
getTime(time);
Why is my first if faiiling here? Also the seconds comes out as NaN!!??
Programmer3305
@Programmer3305
Aug 19 2016 03:29
Hi guys
Can you give me the answer for 10 challenge/lesson in HTML5 and Css3
Armaan Roshani
@armaanhammer
Aug 19 2016 03:31
Hey guys, I asked in Help, but I bet this is a better place to ask: I'm working on building a tribute page, and I can't figure out how to get the bullet points (or maybe the container that the bullet points are in) to center, be narrow when the page is wide, and dynamically resize when the page gets narrower.
I've read through this page: http://getbootstrap.com/css/ and it seems like I need a <div class="container"> surrounding the bullet points, but I can't tell how to specify that it's centered, or what the max width of the container should be.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:32
@armaanhammer have your code?
Armaan Roshani
@armaanhammer
Aug 19 2016 03:34
    <div id="main-text" class="container">
      <p>Here's a time line of Gandhi's life:</p>
      <ul>
        <li>cat nip</li>
        <li>laser pointers</li>
        <li>lasagna</li>
      </ul> 
</div>
Ignore the bogus text. lol
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:35
@armaanhammer okay you want to center all the li's correct?
Armaan Roshani
@armaanhammer
Aug 19 2016 03:35
Correct
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:35
@armaanhammer look at your overall list.. which is located under the unordered list
@armaanhammer so you want your whole unordered list to be centered..you can just assign a class to your <ul> tag

``

<ul class="text-center">
``

Programmer3305
@Programmer3305
Aug 19 2016 03:36
Please answer my quetion.
Armaan Roshani
@armaanhammer
Aug 19 2016 03:36
just <ul class="centered">?
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:37
ugh messed that up
well you want your text to be centered
Armaan Roshani
@armaanhammer
Aug 19 2016 03:37
I tried that, but it left the bullet points on the left side of the screen.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:37
if you look in the docs, its text-centered
Armaan Roshani
@armaanhammer
Aug 19 2016 03:37
And, I'm sorry, I'm wrong. I don't actually want it to be centered. I want it left-justified, but I want it to be in a container that's centered.
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:38
@Programmer3305 giving you the answer is not going to help you.
Armaan Roshani
@armaanhammer
Aug 19 2016 03:38
The task is to replicate this page: https://codepen.io/FreeCodeCamp/full/NNvBQW/
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:38
@Programmer3305 but tell me what's your issue and I'll try do my best to help you.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:38
@armaanhammer can i see your whole code? your codepen page?
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:39
@armaanhammer ah your right it does push bullet points to the left
i forgot in mine i just list-style:none where it got rid of the bullet points
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:40
@armaanhammer I had the same problem when creating mine.
Armaan Roshani
@armaanhammer
Aug 19 2016 03:40
@GabrielShaad Glad I'm not the only one!
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:41
@armaanhammer To solve this, I had to search on Bootstrap API for DIV's offset.
Armaan Roshani
@armaanhammer
Aug 19 2016 03:42
How do you search an API? Are you talking about just browsing the Bootstrap website, or something more involved?
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:42
@armaanhammer Take a look and try to apply it to your container: http://v4-alpha.getbootstrap.com/layout/grid/#example-offsetting-columns
@armaanhammer Yes, what I meant by API is the documentation.
Armaan Roshani
@armaanhammer
Aug 19 2016 03:44
@GabrielShaad I actually saw that page already, but I'm not sure how to implement that. The offsets on that page appear to be static, but when I resize the example page, the offsets (or margins?) on either side shrink dynamically. It seems like the container's center-justified, with some kind of max width defined.
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:45
@armaanhammer Take my page as an example: https://codepen.io/gabrielshaad/full/eJoeEp/
Armaan Roshani
@armaanhammer
Aug 19 2016 03:45
Oooh, I think I figured part of it out. I need to define the container as .col-md-4 or whatever, then center the container that that container is in?
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:46
@armaanhammer Exactly. You have to combine the offset with you col-md
@armaanhammer Take the offset as an instance of another col-md
@armaanhammer For example: col-md-6 col-md-offset-6
Armaan Roshani
@armaanhammer
Aug 19 2016 03:47
@GabrielShaad Oh funky, you have a bunch of different offsets and col widths: <div class="col-md-7 col-md-offset-3 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2">
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:47
@armaanhammer Yes, to make it responsive on extra small, small, medium and large resolutions
@armaanhammer I don't know if this is the best approach, but this is what I worked out for me. :D
Armaan Roshani
@armaanhammer
Aug 19 2016 03:48
Ah. So, Bootstrap understands multiple col-- declarations?
er.. col/-/
hmm
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:49
@armaanhammer yes
Armaan Roshani
@armaanhammer
Aug 19 2016 03:49
how do you type an asterisk in this chat?
*
boom
col-*-* lol
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:50
@armaanhammer it sizes up.. so if you only declare col-md-6 it will declare it 6 for lg and extra large widths
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:50
@armaanhammer Indeed. That's Bootstrap's beauty. Haha You have a variety of combinations to make your page relative to a screen resolution.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:51
if you do col-4-sm col-6-md.. it will display 33.3% width on small devices and 50% width on medium devices
Greg Duncan
@GregatGit
Aug 19 2016 03:51
@armaanhammer if you can get your bootstrap down you be able to produce some really fine pages - if you go though w3schools bootstrap materials this will all be simple
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:51
50% on medium and larger i mean
Armaan Roshani
@armaanhammer
Aug 19 2016 03:51
Where can I find what the size of sm, md, xs, etc is?
I mean, the max width for that size
in number of columns
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:52
@armaanhammer it uses something called the grid system
its in the bootstraps docs there
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:54
Guys, can you give me your feedback on my portfolio so far? https://codepen.io/gabrielshaad/full/BzLRdm/
Armaan Roshani
@armaanhammer
Aug 19 2016 03:55
@Dueldrawer8 Thanks! I'm reading through that doc, but I still don't quite get it.
CamperBot
@camperbot
Aug 19 2016 03:55
armaanhammer sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:cookie: 419 | @dueldrawer8 |http://www.freecodecamp.com/dueldrawer8
Gabriel Alexandre
@GabrielShaad
Aug 19 2016 03:56
@armaanhammer Keep trying dude, you'll soon get the hang of it.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 03:58
@armaanhammer think of a whole page.. the grid system has to total up to 12 which is 100% width of your page
specifiying the numbers, or what helps me is putting it into percentages.. so 6 out of 1 is 50% of your page, 4 is 33% and so on
your whole page is 12 columns
@armaanhammer dont remember if they teach the grid system inside the responsive design part.. but google is your best friend
@armaanhammer plenty of explanation with bootstraps grid system at bootstrap docs or in google
Armaan Roshani
@armaanhammer
Aug 19 2016 04:03
They do teach it. I can run back through the lesson again. I think what I'm getting confused on though is how wide pages are when displayed on smaller screens. When a page is displayed on my phone in portrait, how many numbers out of 12 wide is it? etc
That, and what exactly the xs, sm, md, designations mean.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 04:04
its still 12 no matter what.. but there is something called breakpoints which i think is what your looking for
lg is for devices greater than 1200px, md >992px, sm >768pxx
whenever you resize your screen to say mobile, more than likely its going to be the designation col-xs-*
which is for devices less than 768pc
*px
its still 12 columns wide no matter what size
Aditya
@ezioda004
Aug 19 2016 04:07
Basic rule, xs = mobile, sm = tablets, md = laptops, lg = anything larger than laptops
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 04:07
best way to understand is just to try it out in codepen yourself
Armaan Roshani
@armaanhammer
Aug 19 2016 04:07
I want a thumbs-up button in here.
lo
lol
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 04:07
use the grid system and resize your window to see how each col-class reacts
Armaan Roshani
@armaanhammer
Aug 19 2016 04:08
Ok, going to try that.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 04:10
@armaanhammer look at my project for example.. how i specified col-xs-6 so it splits it 50% for each h3 and button when i start from extra small screen to larger screen
Armaan Roshani
@armaanhammer
Aug 19 2016 04:13
@Dueldrawer8 I think I see what you're saying; the columns maintain their position no matter how wide or small the screen is.
but if you'd specified them as col-md-6 for instance, they would stack when the screen was resized small enough.
Randy Goldsmith
@Dueldrawer8
Aug 19 2016 04:14
@armaanhammer yes exactly
and that is what responsive design is
Armaan Roshani
@armaanhammer
Aug 19 2016 04:14
Sweet. Thanks for the explanation!
Brandon
@Brandons42
Aug 19 2016 04:19
Is the tweet button optional or required for the random quote machine? In the user stories of the video it says it's a bonus, but not on the sidebar beside the video. I don't really want to do it because I don't have a Twitter and don't really know how it works.
Courtney
@csmyers
Aug 19 2016 04:21
Can someone give me a little feedback on my tribute page? https://codepen.io/csmyers/pen/Eyrrjq
Sorin Ruse
@sorinr
Aug 19 2016 04:33
@csmyers just make your target="_blank" not target:"_blank" and add to your css: img{ width: 90%; } to scale the image
Chris Cullen
@123xylem
Aug 19 2016 04:34
$("#action").click(function (){
setInterval(countdown,1000);  
  var countdownID = setInterval(countdown,1000);

}); //COuntdown Button

function countdown(){
   $("#face").text(getTime(time)); //show time 
    $("#set1").text(getTime(time));

  if (time<=0){//if time gets to 0
  clearInterval(countdownID);
  } //stop that function with variable
  time -=1;
};//Countdown Button Function


$("#break").click(function (){
  clearInterval(countdownID);
  var countdownID2 = setInterval(countdown2,1000);
  setInterval(countdown2,1000);
});


function countdown2(){
   $("#face").text(getTime(time2)); //show BREAK time 
    $("#set2").text(getTime(time2));

  if (time2<=0){
    clearInterval(countdownID2);
    setInterval(countdown,1000);}
  time2 -=1;
};
My action works fine now (well apart from it counts double time) BUT the Problem im trying to figure out here is why my BREAK function doesnt Do ANYTHING??
Sorin Ruse
@sorinr
Aug 19 2016 04:40
@123xylem i don't see where do you initialize var time2
Chris Cullen
@123xylem
Aug 19 2016 04:41
function countdown2(){
   $("#face").text(getTime(time2)); //show BREAK time 
    $("#set2").text(getTime(time2));
Courtney
@csmyers
Aug 19 2016 04:42
@sorinr Thanks for the feedback.
CamperBot
@camperbot
Aug 19 2016 04:42
csmyers sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 669 | @sorinr |http://www.freecodecamp.com/sorinr
Chris Cullen
@123xylem
Aug 19 2016 04:43
@sorinr break doesnt even use the clearInterval properly
Sorin Ruse
@sorinr
Aug 19 2016 04:50
@123xylem by this you just show break time into #face and #set2 you are getting using function getTime() to witch you are passing parameter time2. where do you get that from?
Chris Cullen
@123xylem
Aug 19 2016 04:51
@sorinr

var time=60;
var time2=60;
$("#action").click(function (){
setInterval(countdown,1000);  
  var countdownID = setInterval(countdown,1000);

}); //COuntdown Button

function countdown(){
   $("#face").text(getTime(time)); //show time 
    $("#set1").text(getTime(time));

  if (time<=0){//if time gets to 0
  clearInterval(countdownID);
  } //stop that function with variable
  time -=1;
}//Countdown Button Function


$("#break").click(function (){
  clearInterval(countdownID);
  var countdownID2 = setInterval(countdown2,1000);
  setInterval(countdown2,1000);
});


function countdown2(){
   $("#face").text(getTime(time2)); //show BREAK time 
    $("#set2").text(getTime(time2));

  if (time2<=0){
    clearInterval(countdownID2);
    setInterval(countdown,1000);}
  time2 -=1;
}
theyre globar above it
global
Sorin Ruse
@sorinr
Aug 19 2016 04:53
ok. but haven't seen them in the first post
Chris Cullen
@123xylem
Aug 19 2016 04:54
Any reason why clearInterval wouldnt work on countdownId here? @sorinr
Sorin Ruse
@sorinr
Aug 19 2016 04:58
@123xylem first. it seems that your countdown is decreasing by 2 sec instead of 1 sec
Chris Cullen
@123xylem
Aug 19 2016 04:58
@sorinr yea thats something I have no idea about yet..
THink i worked out break... My id var was inside action scope only
Sorin Ruse
@sorinr
Aug 19 2016 05:01
@123xylem to get rid of NaN move: var time=72; var time2=20; as the first lines of your js
@123xylem you are trying to use them before u get them initialized
Chris Cullen
@123xylem
Aug 19 2016 05:03
@sorinr yes thanks
CamperBot
@camperbot
Aug 19 2016 05:03
123xylem sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 670 | @sorinr |http://www.freecodecamp.com/sorinr
my countdown keeps running when I declare countdown id globally
Sorin Ruse
@sorinr
Aug 19 2016 05:07

@123xylem comment out like: `$("#action").click(function (){
// setInterval(countdown,1000);
countdownID = setInterval(countdown,1000);

}); //COuntdown Button`

Chris Cullen
@123xylem
Aug 19 2016 05:07
@sorinr Yes I was declaring it twice i guess
Sorin Ruse
@sorinr
Aug 19 2016 05:07
@123xylem to have the counter decrease by 1 sec and not 2 sec
@123xylem you have to decide if you work by sec or by min
Chris Cullen
@123xylem
Aug 19 2016 05:11
@sorinr hmm i thought it was working by sec already
Sorin Ruse
@sorinr
Aug 19 2016 05:13
@123xylem if you press + on countdown you will see you increase the time by 60sec (1min) not by 1 sec
Chris Cullen
@123xylem
Aug 19 2016 05:18
@sorinr Right your right
I think it was double timing because I declared the function twice
when i declared the id
but I think its now WORKING!!! :)
Sorin Ruse
@sorinr
Aug 19 2016 05:30
@123xylem how would you like it to work?
@sorinr I think its functional enough here?
Obviously not perfect like Id like to be able to change the seconds aswell but meh
Darth Skywalker
@adityaparab
Aug 19 2016 05:33
@123xylem : Try clicking on the Actionbutton multiple times :laughing:
Chris Cullen
@123xylem
Aug 19 2016 05:34
@adityaparab yes it gives action... :(
Darth Skywalker
@adityaparab
Aug 19 2016 05:34
May be disable the button when timer is active?
Chris Cullen
@123xylem
Aug 19 2016 05:40
@adityaparab hmm
I can disable it until it gets to 0 but how do i re eneable it if i hit break or pause?
function countdown(){
   $("#face").text(getTime(time)); //show time 
    $("#set1").text(getTime(time));
  $('#action').prop('disabled', true);

  if (time<=0){//if time gets to 0
     $('#action').prop('disabled', false);
 clearInterval(countdownID);
  } if(!setInterval(countdownID)){    
    $('#action').prop('disabled', false);
                    }
Chris Cullen
@123xylem
Aug 19 2016 05:45
@adityaparab I can disable action when its running but how do I reenable it when its not working due to pause or break?
Darth Skywalker
@adityaparab
Aug 19 2016 06:31
@123xylem :Enable it when you click pause button?
Adam Jubert
@adamjubert
Aug 19 2016 07:06
Hey all. I'm just finishing up my portfolio project (using Sublime Text). Trying to put a working form on my site, but it's just not working. I have a PHP file set up, but every time I click submit on the HTML Form, it brings me to a plaintext page that just reads the PHP file's code. Any help?
Bhushan Patil
@mrpatil007
Aug 19 2016 07:08
@adamjubert which server you use to run php file
Adam Jubert
@adamjubert
Aug 19 2016 07:16
@mrpatil007 I just realized I'm developing locally and don't have PHP installed.
If I transfer my files to my live server, will it work?
Bhushan Patil
@mrpatil007
Aug 19 2016 07:17
you need a xammp or wamp server to run php codes @adamjubert
@adamjubert you can also use live servers to run it
Darth Skywalker
@adityaparab
Aug 19 2016 07:22
@adamjubert : I found this https://box.scotch.io/ to be much better than any traditional AMP stack.
Adam Jubert
@adamjubert
Aug 19 2016 07:39
@mrpatil007 So I transferred all of my files over to my live servers. How do I use the live server to run it?
The website is http://www.adamjubert.com if that helps
John Alcher
@alchermd
Aug 19 2016 08:13
Hey fellas. in Jquery, how do I highlight an element's border for a specific amount of time? Like, when a button is clicked, another element's border gets changed to white for half a second then returns to its original color.
Darth Skywalker
@adityaparab
Aug 19 2016 08:29

@alchermd

Something like

$('.button-in-question').on('click', function(){
  var $el = $('.element-in-question')
  $el.addClass('white-border');
  setTimeout(function(){
    $el.removeClass('white-border');
  },500);
});

and in your CSS

.white-border{
  border:1px solid white;
}
Bhushan Patil
@mrpatil007
Aug 19 2016 08:31
@adamjubert you need to configure db
John Alcher
@alchermd
Aug 19 2016 08:36
@adityaparab this is weird. I'm getting a Uncaught ReferenceError: setTimeOut is not defined error
@adityaparab nevermind, I'm dumb lmao. it's setTImeout not setTimeOut
whatever happened to camelcase :/
Darth Skywalker
@adityaparab
Aug 19 2016 08:40
:+1
@alchermd :+1:
John Alcher
@alchermd
Aug 19 2016 08:42
@adityaparab that's a nice avatar. I'm sure you'll appreciate the tribute page that I made back when I'm just starting out in FreeCodeCamp
Darth Skywalker
@adityaparab
Aug 19 2016 08:42
@alchermd : lmao! hahahahahaha
Peter is my favorite :D
John Alcher
@alchermd
Aug 19 2016 08:43
@adityaparab I'm particularly proud of the quote that I chose
lmao
Darth Skywalker
@adityaparab
Aug 19 2016 08:43
lol
yeah!
John Alcher
@alchermd
Aug 19 2016 08:44
Glad to see a family guy fan here :D
Darth Skywalker
@adityaparab
Aug 19 2016 08:44
Peter and his prostate exam lmao!
The way he runs away crying always makes me lose my shit, no matter how many times I watch it :P
John Alcher
@alchermd
Aug 19 2016 08:47
@adityaparab this is just a wild guess, but are you somewhere from Russia?
Darth Skywalker
@adityaparab
Aug 19 2016 08:50
@alchermd : Went very wild up the north mate! I come from the place where Kamasutra was originated :D
John Alcher
@alchermd
Aug 19 2016 08:50
@adityaparab Damn. WIthout googling, I must say, India?
Darth Skywalker
@adityaparab
Aug 19 2016 08:51
Let me check your profile and guess that you're a filipino :P
Correct! India :D
John Alcher
@alchermd
Aug 19 2016 08:51
@adityaparab well silly I do have my country on my profile haha
Darth Skywalker
@adityaparab
Aug 19 2016 08:51
Yeah!
John Alcher
@alchermd
Aug 19 2016 08:51
@adityaparab For some reason I thought 'ditya' was a russian name.
Darth Skywalker
@adityaparab
Aug 19 2016 08:52
I guess so :D
Had I been Russian, it would have been Aditja :D
John Alcher
@alchermd
Aug 19 2016 08:53
@adityaparab after googling a bit, ditya is indeed a russian word for "son".
Darth Skywalker
@adityaparab
Aug 19 2016 08:53
Pretty close! My name actually means "sun" :D
you know that glowing thing in the sky :D
John Alcher
@alchermd
Aug 19 2016 08:53
@adityaparab lmao
close enough
Darth Skywalker
@adityaparab
Aug 19 2016 08:54
just do a google search "Aditya meaning"
John Alcher
@alchermd
Aug 19 2016 08:54
@adityaparab ohhhhh it does make sense now
what I heard is 'ditya ra'. You know, the egyptian God Ra. So that means the 'son of the sun'. That's way closer to your name haha
Darth Skywalker
@adityaparab
Aug 19 2016 08:55
It's actually a bit poetic and not that straight forward. It is said that the Lord Sun had a child with a Woman called Aditi. And because of that the son is named Aditya meaning Son of the Sun :D
John Alcher
@alchermd
Aug 19 2016 08:56
@adityaparab yikes. we are making sense now haha.
Darth Skywalker
@adityaparab
Aug 19 2016 08:57
I think with 2 exceptions of Christianity and Islam, all other religions have the same philosophy with different languages.
John Alcher
@alchermd
Aug 19 2016 08:58
@adityaparab this is really interesting. I'm glad that I asked haha
Darth Skywalker
@adityaparab
Aug 19 2016 08:58
:+1:
@alchermd : Have you lived in America?
Or outside Asia ?
John Alcher
@alchermd
Aug 19 2016 08:59
@adityaparab Nope. I've been in my country my whole life
Darth Skywalker
@adityaparab
Aug 19 2016 09:00
Well then how come do you have English name? Is it like a normal think in Philippines?
Because Asians usually get an English name when they move out. (for obvious reasons : P )
John Alcher
@alchermd
Aug 19 2016 09:01
@adityaparab We've been colonized by the Spanish and Americans for about 400 years total. So the majority of us got an English sounding first name with a Spanish surname.
Darth Skywalker
@adityaparab
Aug 19 2016 09:01
Ah! That makes sense!
John Alcher
@alchermd
Aug 19 2016 09:04
@adityaparab It's actually bizarre here. Beauty is quantified by how light your skin is, and intelligence is measured by how much English you know.
Darth Skywalker
@adityaparab
Aug 19 2016 09:04
@alchermd : Why does that sound like India? :P
John Alcher
@alchermd
Aug 19 2016 09:04
@adityaparab Well then you know how it feels haha
Darth Skywalker
@adityaparab
Aug 19 2016 09:05
Plus I am brown skinned ffs :D So I totally know how that feels :P
@alchermd : But I tell you from experience, if you're not too fair and not too dark, you'll be a rare commodity in the US and Europe :P
John Alcher
@alchermd
Aug 19 2016 09:08
@adityaparab That's what I heard. I also think it's weird how Americans and Europeans pay money to tan their skins, while us Filipinos would sell their souls to get a 'white' complexion haha
Darth Skywalker
@adityaparab
Aug 19 2016 09:11

Yeah! Thanks to the media for making people feel they're inadequately provided for by nature. You always lack something. It's the same script everywhere, with an altered language. Unless you are not tan, you're worthless. So buy this product and become complete.

In Asia, it's like You're a piece of shit untill you reach certain amount of fairness. :D But this and get fair lol

John Alcher
@alchermd
Aug 19 2016 09:13
@adityaparab I guess only in South east asia. Other asian nations have fair skin. Like now, the Koreans are sooooooo hot in the Philippines.
Humans are weird haha
Dan Sack
@DanPete
Aug 19 2016 09:19
Is this a good setup for building a portfolio page? Or will I run into problems later by creating 3 jumbotrons in one page? https://codepen.io/DanPete/pen/kXmBwb
John Alcher
@alchermd
Aug 19 2016 09:20
@DanPete That should work fine.
@DanPete IMO, having 3 different divs inside a jumbotron looks better than 3 separate jumbotrons
Gaurav Tolani
@Gauravtolani
Aug 19 2016 09:21
how do get the users location in show the local weather?
Dan Sack
@DanPete
Aug 19 2016 09:21
@alchermd Thanks. To make different backgrounds for each jumbotron, should I just give each jumbotron a different id?
CamperBot
@camperbot
Aug 19 2016 09:21
danpete sends brownie points to @alchermd :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @alchermd |http://www.freecodecamp.com/alchermd
John Alcher
@alchermd
Aug 19 2016 09:23
@DanPete That's what I'm afraid of. I actually had the same idea as you when I started, but I found no way of changing a jumbotron's background. With a div, you can customize it as you please
Dan Sack
@DanPete
Aug 19 2016 09:24
@alchermd https://codepen.io/DanPete/pen/kXmBwb Okay, so this is probably better, now should I make a different id for each div?
John Alcher
@alchermd
Aug 19 2016 09:25
@DanPete if you plan to give them different styling, then yes give them a unique id.
Dan Sack
@DanPete
Aug 19 2016 09:25
<div class="container" id="about me">
Does this work?
John Alcher
@alchermd
Aug 19 2016 09:25
@DanPete I think spaces aren't allowed
Dan Sack
@DanPete
Aug 19 2016 09:26
<div class="container" id="aboutme">
John Alcher
@alchermd
Aug 19 2016 09:26

@DanPete becuase in css this would look like

#about me {

}

it'll look for an element with the id of #about then try to find an html me

@DanPete I suggest to stick to either camelCase or underscores
@alchermd and please add tabs to your code to make it more readable :D
Dan Sack
@DanPete
Aug 19 2016 09:28
@alchermd Great, thanks. Oh, are you supposed to tab each time for a child?
CamperBot
@camperbot
Aug 19 2016 09:28
danpete sends brownie points to @alchermd :sparkles: :thumbsup: :sparkles:
:warning: danpete already gave alchermd points
John Alcher
@alchermd
Aug 19 2016 09:28
@DanPete Yes. It makes reading much easier.
@DanPete just in case you are not familiar with camelCase, it's a naming convention where when you have to name something, you do it like this aSampleOfCamelCaseName .
so your id would be aboutMe
Dan Sack
@DanPete
Aug 19 2016 09:33
@alchermd Makes sense, thanks.
CamperBot
@camperbot
Aug 19 2016 09:33
danpete sends brownie points to @alchermd :sparkles: :thumbsup: :sparkles:
:warning: danpete already gave alchermd points
Darth Skywalker
@adityaparab
Aug 19 2016 09:38
@alchermd : Yeah... Weird species! :D lol
Dan Sack
@DanPete
Aug 19 2016 09:38
Now, how do I make it so it is not stacking like this? https://codepen.io/DanPete/pen/kXmBwb
John Alcher
@alchermd
Aug 19 2016 09:40
@adityaparab Heyy! So setTimeout works for when I want to add a delay AFTER running a block of code. What if I want to add a delay BEFORE running a block of code?
Darth Skywalker
@adityaparab
Aug 19 2016 09:41
@alchermd : Put the code you want delayed inside your setTimeout
John Alcher
@alchermd
Aug 19 2016 09:42
@DanPete Ahh, the problem that made me quit about a year ago. Welcome to bootstrap! Google 'Bootstrap Grid System' and study that stuff.
Dan Sack
@DanPete
Aug 19 2016 09:43
@alchermd Haha, dang.
John Alcher
@alchermd
Aug 19 2016 09:43
@DanPete It's not that bad! Bootstrap's documentation is really well written :D
@adityaparab oh. I misunderstood setTimeout, I thought the code is ran and then a delay is added. It turns out it's the other way around haha
Darth Skywalker
@adityaparab
Aug 19 2016 09:48
@alchermd haha!. I hope you got it now.
Joosep Sisas
@JSisas
Aug 19 2016 10:05

Hey, Codepen is not able to open my Json link. However I can open in the browser.

Challenge: https://www.freecodecamp.com/challenges/show-the-local-weather

Link:
http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&APPID=80de0f33932575b77f4f5d8aa6dba381

Any suggestions?

texyh
@texyh
Aug 19 2016 10:09

function sumFibs(num) {
  i = 1;
  j =0;
  var k ;
  var fib = 0;
  while (i <= num){
    if (prime(i) === true){
      fib+=i;
      }
    k = j+i;
    j = i;
    i = k;
  }

  return fib;
}

function prime(num){
  i = 2;
  while (i < num){
    if (num%i === 0){
      return false;
    }
    i++;
  }
  return true;
}
sumFibs(4);
please y is this giving me an infinite loop at the sumFibs part
eradityaoli
@eradityaoli
Aug 19 2016 10:35
Hi, I am facing the problem with this code

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<body>
<header>
</header>
<div class="container">
<div class="jumbotron">
<div class="row">
<div class="col-xs-12">
<h1 class="text-center">Dr. Norman Borlaug</h1>
<h2 class="text-center"><em>The man who saved a billion lives</em></h2></div>
<div class="thumbnail">
<image src="https://c2.staticflickr.com/4/3689/10613180113_fdf7bcd316_b.jpg"/>
<h5 class="caption text-center">Dr. Norman Borlaug, second from left, trains biologists in Mexico on how to increase wheat yields - part of his life-long war on hunger.</h5>

        </div>
         <h3 class="col-md-8 col-md-offset-2">Here's a time line of Dr. Borlaug's life:</h3>
         </div>

           <ul class="col-md-8 col-md-12 col-md-offset-2">
        <li><strong>1914</strong> - Born in Cresco, Iowa</li>
        <li><strong>1933</strong> - 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><strong>1935</strong> - 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><strong>1937</strong> - Finishes university and takes a job in the US Forestry Service</li>        
        <li><strong>1938</strong> - Marries wife of 69 years Margret Gibson. Gets laid off due to budget cuts. Inspired by Elvin Charles Stakman, he returns to school study under Stakman, who teaches him about breeding pest-resistent plants.</li>        
        <li><strong>1941</strong> - Tries to enroll in the military after the Pearl Harbor attack, but is rejected. Instead, the military asked his lab to work on waterproof glue, DDT to control malaria, disenfectants, and other applied science.</li>      
        <li><strong>1942</strong> - Receives a Ph.D. in Genetics and Plant Pathology</li>        
        <li><strong>1944</strong> - Rejects a 100% salary increase from Dupont, leaves behind his pregnant wife, and flies to Mexico to head a new plant pathology program. Over the next 16 years, his team breeds 6,000 different strains of disease resistent wheat - including different varieties for each major climate on Earth.</li>
        <li><strong>1945</strong> - Discovers a way to grown wheat twice each season, doubling wheat yields</li>    
        <li><strong>1953</strong> - crosses a short, sturdy dwarf breed of wheat with a high-yeidling American breed, creating a strain that responds well to fertalizer. It goes on to provide 95% of Mexico's wheat.</li>        
        <li><strong>1962</strong> - Visits Delhi and brings his high-yielding strains of wheat to the Indian subcontinent in time to help mitigate mass starvation due to a rapidly expanding population</li>        
        <li><strong>1970</strong> - receives the Nobel Peace Prize</li>
        <li><strong>1983</strong> - helps seven African countries dramatically increase their maize and sorghum yields</li>
        <li><strong>1984</strong> - becomes a distinguished professor at Texas A&M University</li>
        <li><strong>2005</strong> - states "we will have to double the world food supply by 2050." Arg
Chris Cullen
@123xylem
Aug 19 2016 10:40
@adityaparab yep did that... took me a while to figure out though :)
eradityaoli
@eradityaoli
Aug 19 2016 10:57
oops my bad! found it.
Bil
@thebiltheory
Aug 19 2016 11:06
Hi Guys
I have a stupid question
npm related
Stephen James
@sjames1958gm
Aug 19 2016 11:07
@thebiltheory Hey, ask away
Bil
@thebiltheory
Aug 19 2016 11:07
Let say I have a brand new project
I imported the framework bulma.io
using npm install bulma
What is the correct way to use it?
Stephen James
@sjames1958gm
Aug 19 2016 11:09
@thebiltheory Generally you will need to require the framework into you javascript files.
Not familiar with that framework, but with others such as express.
var express = require("express");
Ah, but that is a CSS framework
Bil
@thebiltheory
Aug 19 2016 11:09
It is a pure html/css framework
Stephen James
@sjames1958gm
Aug 19 2016 11:10
If you go to the documentation page it shows how to import into your SASS
Bil
@thebiltheory
Aug 19 2016 11:11
@import “bulma" ?
I’ll give it a shot!
Thanks @sjames1958gm
CamperBot
@camperbot
Aug 19 2016 11:11
thebiltheory sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2720 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 19 2016 11:12
@thebiltheory That's what it shows. Not much in the way docs.
Bil
@thebiltheory
Aug 19 2016 11:12
That’s the thing! It’s confusing
Stephen James
@sjames1958gm
Aug 19 2016 11:13
Looks like it is expecting some sort of bundling/preprocessing to be done to make it available on the client side. (npm, webpack, etc)
@thebiltheory Found this video - https://www.youtube.com/watch?v=ALyvtHH2VQ0
Bil
@thebiltheory
Aug 19 2016 11:15
Thanks Amigo
Dhananjay AT
@DAT1729
Aug 19 2016 11:51
I want to build a mp3 download website
can I use wordpress and still make it my way?
coz I dont see a theme that I want in wp
and also it is not a blog
I am new:confused. Please help me
I want to build a mp3 download website
can I use wordpress and still make it my way?
coz I dont see a theme that I want in wp
and also it is not a blog
I am new:confused. Please help me
Timbowser
@Timbowser
Aug 19 2016 12:17
@DAT1729 Wordpress is a way to make web templates. You could build your own Wordpress template if you like. How many of the ziplines have you done so far?
Dhananjay AT
@DAT1729
Aug 19 2016 12:18
@Timbowser ziplines? I don't know what that means. I am trying to learn programmng by building this site. I know basics
Timbowser
@Timbowser
Aug 19 2016 12:19
@DAT1729 the ziplines are the projects that Free Code Camp assigns to us.
Dhananjay AT
@DAT1729
Aug 19 2016 12:20
I recently signed up. Kind of messed up with all the tutorial sites on internet
I haven't done much there
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:20
I am working on tictactoe game and I have problem with checking if users have winning combination... Can someone help me
Timbowser
@Timbowser
Aug 19 2016 12:20
@DAT1729 I would suggest you go back and start doing the lessons and then work up to the site you want to build.
@aleksarakic are you getting an error? do you have a link to your codepen?
Dhananjay AT
@DAT1729
Aug 19 2016 12:21
@Timbowser ok Thanks. I will check that now
CamperBot
@camperbot
Aug 19 2016 12:21
dat1729 sends brownie points to @timbowser :sparkles: :thumbsup: :sparkles:
:cookie: 277 | @timbowser |http://www.freecodecamp.com/timbowser
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:22
@Timbowser I will put code on codepen now. Sending you a link in minute
userHasWinnerCombo() is function responsible for checking
Zelite
@zelite
Aug 19 2016 12:27
Hi, I'm trying to make a sliding button like on the example of the twitch app.: http://codepen.io/zelite/pen/kXmwmN check on the right side a circle and the word "All". When you mouseover it should expand. However, the circle makes the word go down. How can I keep them all on the same line?
donbale
@donbale
Aug 19 2016 12:29
Hi guys reaching out for some help on the Twitch.TV zipline. Apart from looking like trash I thought I had completed this however realized I had not put in a function to check for closed accounts. Tried using data.hasOwnProperty("error") and data.starus === 422 but all with no success can anyone help with this?
Stephen James
@sjames1958gm
Aug 19 2016 12:31
@donbale did you really look for data.starus or is that just a typo? Do you have a link?
Timbowser
@Timbowser
Aug 19 2016 12:31
@aleksarakic what function adds the x or o when I click in a box?
@aleksarakic is it the $('.field').click ?
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:32
appendSymbolForUser();
yes
donbale
@donbale
Aug 19 2016 12:32
@sjames1958gm Hi yes that was a typo I tried data.status === 422. codepen link: http://codepen.io/donbale/full/oLJxXX/
Dhananjay AT
@DAT1729
Aug 19 2016 12:33
hey free code camp has PHP tuts for backend?
Timbowser
@Timbowser
Aug 19 2016 12:34
@aleksarakic why do you not call the userHasWinCombo every click?
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:35
It was calling compHasWinCombo, but changed it when posting to codepen
Stephen James
@sjames1958gm
Aug 19 2016 12:35
@donbale You can place this .fail(function(data) { console.log(data) }) at the end of your getJSON call.
$.getJSON(url, function() {}).fail(function(data) { console.log(data) }) and get the information.
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:35
to be more clear
Just renamed function
@Timbowser Do you need more info?
Currently it console.logs every time I click on field
Stephen James
@sjames1958gm
Aug 19 2016 12:39
@donbale There was a typo up above only one . before fail
Timbowser
@Timbowser
Aug 19 2016 12:40
@aleksarakic I think the problem comes from you pushing numbers to the userCheckedFieldsArr. I can't get it to log any data. Have you been able to console.log and values from that array in the past?
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:41
Yes, on field click. Try it now
Timbowser
@Timbowser
Aug 19 2016 12:42
@aleksarakic nm I got it.
@aleksarakic just wanted to make sure all data was coming into that function that we needed.
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:43
This is process: I am trying to loop over winningCombos, then to loop over each winCombo, and than to see if usercCheckedArr has any of winningCombos
userCheckedArr.indexOf(winningCombos[i][j])
If it is there, it will return integer that is > -1
donbale
@donbale
Aug 19 2016 12:46
Hi @sjames1958gm thanks for helping me out here quite sure what I'm looking at is the clue in the fact that it is a "Unprocessable Entity"
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:46
This is example of what i am comparing: [1,3,7].indexOf(1) > -1. But there is something wrong with this
Try to console.log(winningCombos[i][j])
Timbowser
@Timbowser
Aug 19 2016 12:47
@aleksarakic the issue I think is happening is you iterating three times over every winning combo and if what you selected in there exists add +1 to the counter. It will always exist all three attempts. does that make sence?
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:47
Yes, thats probably reason why it console.logs 'we have winner' every time :)
Timbowser
@Timbowser
Aug 19 2016 12:47
@aleksarakic exactly
@aleksarakic since you are in a loop you could pull the value out of the array you are checking if it exists. that way when you iterate over it again it cannot find it. That would just be one of the possible ways of handling it.
@aleksarakic push the data to an array first you are creating in that function so you are not destroying your original data.
@aleksarakic I need to take off but I hope that at least got you moving forward a little.
Aleksa Rakic
@aleksarakic
Aug 19 2016 12:50
I will try it now
Of course, thanks @Timbowser :)
CamperBot
@camperbot
Aug 19 2016 12:51
aleksarakic sends brownie points to @timbowser :sparkles: :thumbsup: :sparkles:
:cookie: 278 | @timbowser |http://www.freecodecamp.com/timbowser
Timbowser
@Timbowser
Aug 19 2016 12:51
@aleksarakic cool good luck
Stephen James
@sjames1958gm
Aug 19 2016 12:53
@donbale You can either check for status or just assume the user in channel variable is not a user at that point.
.fail(function(data) { if (data.status = 422) { console.log("User: " + channel + " is offline") }});
replace the console.log with filling in your HTML
donbale
@donbale
Aug 19 2016 13:01
Thank you @sjames1958gm I misunderstood what were you were telling me initially but now I've got it. I can stop banging my head against that wall now
CamperBot
@camperbot
Aug 19 2016 13:01
donbale sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2724 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 19 2016 13:05
@donbale :+1: This is programming, always wear a helmet :)
donbale
@donbale
Aug 19 2016 13:07
@sjames1958gm jajaja
Ron Andrews
@rrandrews
Aug 19 2016 13:31
can someone help me figure out why this API call is failing? https://codepen.io/rrandrews/pen/yJAoOL
Jesus Vega
@ParagonChuy
Aug 19 2016 13:38
About-02.png
I'm sketching a portfolio, what do you guys thiunk?
Moisés Man
@moigithub
Aug 19 2016 13:39
@rrandrews open ur browser devtools..and check console for errors
Ron Andrews
@rrandrews
Aug 19 2016 13:42
ah got it, thanks. it wouldn't take it cause the codepen was opened with https and the call was made with http
Moisés Man
@moigithub
Aug 19 2016 13:43
:+1:
Lauren Conners
@laurenconners
Aug 19 2016 13:53
Looks good so far, Jesus.
Ahmad Ali
@microcyberz
Aug 19 2016 14:21
Janine vN
@janine9vn
Aug 19 2016 14:33
@microcyberz It works for me
@microcyberz just make sure to add this call so it'll change the quote and not cache it:
$.ajaxSetup({
cache: false
});
Vodkius
@Vodkius
Aug 19 2016 14:36
Hey guys, I have one question, so I got my first project, can I complete it with dreamweaver because it's more comfortable for me working with html/css/js, and upload .rar file?
Lauren Conners
@laurenconners
Aug 19 2016 14:38

I've never used Dream Weaver. Do you manually write the code?

CodePen is actually pretty easy. You have panels to enter in html, css, and js.

Vodkius
@Vodkius
Aug 19 2016 14:38
Adobe DreamWeaver
Mostafa Syam
@pro-mos
Aug 19 2016 14:42
@Vodkius you should start using text editors and getting comfortable with
haven't heard of a coder using dream weaver since a long time :D
Lauren Conners
@laurenconners
Aug 19 2016 14:44
When I was a teen, I did all my coding in notepad.
Good times.
Mostafa Syam
@pro-mos
Aug 19 2016 14:45
@laurenconners and i remember banging my head for an unclosed tag :smile:
im still a teen though*
Lauren Conners
@laurenconners
Aug 19 2016 14:52
@pro-mos I've done the same!
Moisés Man
@moigithub
Aug 19 2016 15:10
any1 know react? i have a question...
why on some components i can link functions to event and works ok
example: <button className="btn btn-primary" type="button" onClick={this.addCapitulos}>Add</button> :+1:
but on others if i do that.. they are autoexecuted when render
<button className="col-sm-1 btn btn-danger" type="button" onClick={()=>this.anularMirror(linkIndex,urlIndex)}>X</button> need to be wrapped on another function
Lauren Conners
@laurenconners
Aug 19 2016 15:22
I haven't gotten that far in the lessons yet. Wish I could help.
Moisés Man
@moigithub
Aug 19 2016 15:26
@laurenconners got the answer on the other room
thanks tho :) :+1:
its because adding a set of parenthesis at the end of the function .. calls it
a solution to pass parameters.. without calling.. is using bind
soo it end up like this
onClick={this.anularMirror.bind(this,linkIndex,urlIndex)}
CamperBot
@camperbot
Aug 19 2016 15:26
:cookie: 120 | @laurenconners |http://www.freecodecamp.com/laurenconners
moigithub sends brownie points to @laurenconners :sparkles: :thumbsup: :sparkles:
RagnarMjol
@RagnarMjol
Aug 19 2016 15:26
hey, could anyone help out a bit? I'm a complete beginner and I have gotten to the first challenge, but I don't think that I have centered my image correctly
http://codepen.io/RangarMjol/pen/mEgBbg
Sorin Ruse
@sorinr
Aug 19 2016 15:31
@RagnarMjol i don't think you want a margin of 500px like: margin: 50px 500px
Emido
@emido
Aug 19 2016 15:32
Hi guys
Ive got a problem when im working on my front-end project in codepen
I cant add jquery classes to my html elements
i also get this error: Parse error on line 1: Unexpected 'DOT'
any one knows why is that?
Tyler Moeller
@TylerMoeller
Aug 19 2016 15:37
@RagnarMjol Since you have bootstrap in your project, you can use the center-block class to center an image: http://getbootstrap.com/css/#images-responsive
RagnarMjol
@RagnarMjol
Aug 19 2016 15:38
@TylerMoeller thank you so much
CamperBot
@camperbot
Aug 19 2016 15:38
ragnarmjol sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 769 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Hey guys I am trying to get my TodoApp example to work, but the setState method doesn't work and I tried to bind the instance. I am wondering if someone can help
Emido
@emido
Aug 19 2016 15:41
here is my code in java
$(document).ready(function(){
$("button").hover(function(){
$(this).addClass("animated bounce");
}, function(){
$(this).addClass("animated shake");
});
});
come on guys I really stock to this part
any idea?
Tyler Moeller
@TylerMoeller
Aug 19 2016 15:47

@RagnarMjol No problem - to control the size of the image, you can then use bootstrap grids instead of the inline styles you're using in combination with margins in css.

<div id="photo" class="row">
  <div class="col-xs-6 col-xs-offset-3">
    <img id="logo" src="https://jessicagolich.files.wordpress.com/2016/04/deftones-logo-1600-1200.jpg" alt="Deftones" class="img-responsive center-block">
  </div>
</div>

http://getbootstrap.com/css/#grid-offsetting

Moisés Man
@moigithub
Aug 19 2016 15:51
@emido u mean javascript (or JS abreviated)
cuz java is something different :)
Emido
@emido
Aug 19 2016 15:51
I dont know actually what is the difference
but your right its JS
Josef Kolena
@ggverysoon
Aug 19 2016 15:52
Hello. I want to cover whole width of my page witch img, but i still have margin on the right. I tryied to fix it with body {margin-right: -10%} - that works, but then Iam running into problem with text-center - text is not centered, because of the -margin thing. what is the best/easiest solution to this problem? thank you
I just trying to set a background atm https://codepen.io/ggverysoon/pen/VjNjzm
Emido
@emido
Aug 19 2016 15:53
@ggverysoon have you tried class="img-responsive"?
Lauren Conners
@laurenconners
Aug 19 2016 15:53
@ggverysoon what if you did the same margin on both sides? Wouldn't that make your centered text appear in the correct position>
Or what emido said. :)
Josef Kolena
@ggverysoon
Aug 19 2016 15:54
@emido I have the class there.
Emido
@emido
Aug 19 2016 15:54
@laurenconners lauren do you have any idea about what is my problem about?
Lauren Conners
@laurenconners
Aug 19 2016 15:56
@emido Unfortunately, no. I haven't made it to the JS section yet. I'm just about to start my portfolio page.
Emido
@emido
Aug 19 2016 15:56
@ggverysoon I actually solved the same problem by embedding my img insile a div with class="container-fluid"
@laurenconners Ok thank you
CamperBot
@camperbot
Aug 19 2016 15:56
emido sends brownie points to @laurenconners :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @laurenconners |http://www.freecodecamp.com/laurenconners
Moisés Man
@moigithub
Aug 19 2016 15:57
@emido do u have included jquery library on ur code ?
ur code seems ok.. except it add classes on mouseenter/mouseleave (hover)
soo at some point ur button will have all classes added (probably on mouseleave u need to remove ? )
if some library is missing.. checking ur browser devtools/console for errors help...
Emido
@emido
Aug 19 2016 15:59
@moigithub yes i did add the jquery library through the quick add in setting and I tried the remove but still it doesnt work
Moisés Man
@moigithub
Aug 19 2016 15:59
doing on codepen ? share link ?
Emido
@emido
Aug 19 2016 16:00
@moigithub how can i check my browser dev tool?
yes
ok
Moisés Man
@moigithub
Aug 19 2016 16:00
F12 on most browsers.. then go to console tab
Josef Kolena
@ggverysoon
Aug 19 2016 16:00
@emido but the thing is I have it in container-fluid :/
@ggverysoon try this:
<div class="container-fluid">
<div class="row">
<img class="img-responsive"
in the same manner
@moigithub I found the developer tool but i dont know how to work with
@ggverysoon did it work?
Albert Brennan
@bluegreybolt
Aug 19 2016 16:05
Hey can anyone help me with something CSS related?
Emido
@emido
Aug 19 2016 16:06
@bluegreybolt what is your question
Albert Brennan
@bluegreybolt
Aug 19 2016 16:07
Ok so I'm trying to do inline anchor tags for my portfolio page
But the problem is because of my navbar
Moisés Man
@moigithub
Aug 19 2016 16:07
@emido i see u added a lot of jquery on there.. u only need 1
Albert Brennan
@bluegreybolt
Aug 19 2016 16:07
The anchor tags dont go to the right place
so is there any way to move the anchor tag?
Moisés Man
@moigithub
Aug 19 2016 16:07
jquery-ui is something else....
also.. u need to include on ur CSS
animated.css
@emido
Josef Kolena
@ggverysoon
Aug 19 2016 16:08
@emido well Iam just playing around. I actually solved the problem by deleating img-responsive class, the problem apears just when the class is there. And my page is actually too wide as well. Now Iam super confused actually
Emido
@emido
Aug 19 2016 16:09
@moigithub do you know which one is the right one?
Moisés Man
@moigithub
Aug 19 2016 16:09
on quickAdd.. jquery <-- only
Emido
@emido
Aug 19 2016 16:10
@moigithub oh ok let me try
@moigithub yess it worked thank you so much
CamperBot
@camperbot
Aug 19 2016 16:11
emido sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1947 | @moigithub |http://www.freecodecamp.com/moigithub
Moisés Man
@moigithub
Aug 19 2016 16:11
:)
Emido
@emido
Aug 19 2016 16:12
@bluegreybolt try reading this template it may help you figure it out
<!-- Fixed navbar -->
<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Project name</a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#contact">Contact</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li class="dropdown-header">Nav header</li>
            <li><a href="#">Separated link</a></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</nav>
you can customize this in any order you like
here is what it looks like
@ggverysoon try to read your code again and fine out what each line is doing
Albert Brennan
@bluegreybolt
Aug 19 2016 16:13
No sorry I explained the problem badly
I already have a navbar with links in it
That link to part of the page
However if I put an anchor tag where I want to link to
The navbar covers it up
So it scrolls to the wrong place
So is there any way to say "go to 200px under this element"
With your anchor tag
Rather than going right to the <div name="whatever">
I want to go underneath it, but keep the anchor tag in the same place
Sorry <div><a name="whatever></a>
Moisés Man
@moigithub
Aug 19 2016 16:17
<a href="#section1">goto section1</a>
....
<div id="section1">.... </div>
clicking the link above... (anchor)
goes to the div

if div hides below the navbar.. u can add some margin-top.. on div

#section1 {
   margin-top: 300px;
}

soo it scroll down the div content

Ahmad Ali
@microcyberz
Aug 19 2016 16:18
http://codepen.io/microcyberz/pen/wWJQeP I created this weather app some weeks ago. It was working. Now I open to check and I see JSON data is not being fetched from servers. HELP!
Albert Brennan
@bluegreybolt
Aug 19 2016 16:20
Sorry @moigithub that doesn't work
Take a look at the codepen if you like
Josef Kolena
@ggverysoon
Aug 19 2016 16:20
@emido yea man. I will. I'll take small break. Iam trying to solve it for last 2 hours - getting litlle tired. thx for help
CamperBot
@camperbot
Aug 19 2016 16:20
ggverysoon sends brownie points to @emido :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @emido |http://www.freecodecamp.com/emido
Moisés Man
@moigithub
Aug 19 2016 16:21
@bluegreybolt on which link ?? portfolio ?
Albert Brennan
@bluegreybolt
Aug 19 2016 16:22
Yes
See how it scrolls past?
I want to keep the page looking the same
But make it so the divider between the divs is right under the navbar
when the link is clicked
Emido
@emido
Aug 19 2016 16:24
@ggverysoon +1:
@ggverysoon :+1:
Moisés Man
@moigithub
Aug 19 2016 16:24
@bluegreybolt if margin-top doesnt work.. try padding-top
Emido
@emido
Aug 19 2016 16:32
how we can smoothly slide into a part of the page?
and also how to animate a dropdown in navbar
Moisés Man
@moigithub
Aug 19 2016 16:40
slide like.. scroll ??
Eric Weiss
@eweiss17
Aug 19 2016 16:43
I'm doing the local weather page and am trying to use the geolocator provided in a lesson and it is not doing anything?
greg
@wearenotgroot
Aug 19 2016 16:45
@eweiss17 what browser you using?
Eric Weiss
@eweiss17
Aug 19 2016 16:45
chrome
it works on the freecodecamp site but not codepen
greg
@wearenotgroot
Aug 19 2016 16:45
@eweiss17 on chrome the getCurrentPosition and watchPosition only works on https
Emido
@emido
Aug 19 2016 16:45
@moigithub yes but i dont understand the code in the link
greg
@wearenotgroot
Aug 19 2016 16:45
@eweiss17 you can view the warning in the dev console
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. See https://goo.gl/rStTGz for more details.
Eric Weiss
@eweiss17
Aug 19 2016 16:46
yeah i see it
greg
@wearenotgroot
Aug 19 2016 16:47
@eweiss17 geolocation work on other browser on http and https
Eric Weiss
@eweiss17
Aug 19 2016 16:48
right so codepen is not an https so it doesn't allow it...
greg
@wearenotgroot
Aug 19 2016 16:48
@eweiss17 the problem you'll encounter is if you want the geolocation to work on chrome, you'll be using https. however only paid version of the openweather api key is allowed to connect via https, so you'll have to use http
Eric Weiss
@eweiss17
Aug 19 2016 16:49
so i need to use firefox or find another api?
greg
@wearenotgroot
Aug 19 2016 16:49
@eweiss17 you can use https all the way but the problem is the openweather api connection(free key version is only on http)
or you can get the ip of the user without using geolocation
Eric Weiss
@eweiss17
Aug 19 2016 16:50
i'm pretty new to api's and don't know how to use them much
greg
@wearenotgroot
Aug 19 2016 16:50
try api for getting ip's
@eweiss17
jess-schiff
@jess-schiff
Aug 19 2016 16:53
hey how do you center a thumbnail that includes an image
i tried align:middle which didn't work
Emido
@emido
Aug 19 2016 16:53
@bluegreybolt look at this doc for scrolling into a specific link
Eric Weiss
@eweiss17
Aug 19 2016 16:54
@wearenotgroot alright thanks i'll look into it
CamperBot
@camperbot
Aug 19 2016 16:54
eweiss17 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1410 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Tyler Moeller
@TylerMoeller
Aug 19 2016 16:54
@eweiss17 Another option I recommend is to check out Weather Underground's API. They give you location + weather all in one URL and it works over HTTP/HTTPS with up to 500 connections/day. https://www.wunderground.com/weather/api/d/docs?d=data/geolookup&MR=1
Just use this URL to access the API: http://api.wunderground.com/api/Your_Key/geolookup/q/autoip.json
jess-schiff
@jess-schiff
Aug 19 2016 16:54
how could i get this centered?
<div margin="auto" class="img col-md-8 thumbnail">
<img src = "http://107.170.118.181/wp-content/uploads/2015/01/marie-curie_toned.jpg" style="vertical-align:middle">
rodascesar
@cesarrodas
Aug 19 2016 16:55
can someone please check out my project. I am trying to set the state on the todoApp example but it says it doesn't exist. the function is binded already
Albert Brennan
@bluegreybolt
Aug 19 2016 16:55
@jess-schiff try display:block and text-align:center
jess-schiff
@jess-schiff
Aug 19 2016 16:56
hmm, no luck
jess-schiff
@jess-schiff
Aug 19 2016 17:02
i can't seem to figure this out
Sorin Ruse
@sorinr
Aug 19 2016 17:02
@jess-schiff can you post the link to your pen?
freecodegh
@freecodegh
Aug 19 2016 17:05
Hi everybody! I have a "thumbnail"-related question if anyone is available. http://codepen.io/fccp/full/zBXPjY/ On my tribute page, my picture of Shirley Chisholm is only 222px wide. I'd love to have the white box around it & the caption just barely overshoot the width of the picture, yet keep the "Polaroid" centered.
i want the thumbnail to have margins around the image but haven't been able to get that to work
if i change the width of the thumbnail it stops centering though
freecodegh
@freecodegh
Aug 19 2016 17:18
Ditto @jess-schiff
It looks like this is one of the most under-answered questions on the net... :-)
jess-schiff
@jess-schiff
Aug 19 2016 17:19
yeah haha! i've been googling and trying things for an hour now
Sorin Ruse
@sorinr
Aug 19 2016 17:21
@jess-schiff try adding to your css: div.thumbnail{ padding: 20px; }
freecodegh
@freecodegh
Aug 19 2016 17:23
@sorinr : Didn't fix the problem for me.
Sorin Ruse
@sorinr
Aug 19 2016 17:25
@freecodegh what do you mean? its not adding the padding around img?
Albert Brennan
@bluegreybolt
Aug 19 2016 17:26
@jess-schiff what exactly are you trying to do?
isnt the image already centered?
freecodegh
@freecodegh
Aug 19 2016 17:26
@sorinr : There's too much padding, and that isn't taking it away.
@jess-schiff : I got it!
Wrap the "thumbnail"-classed DIV in another DIV
Give that DIV a "style=text-align:center;" attribute.
Then give your "thumbnail"-classed DIV a "style=display:inline-block;" attribute.
Gotta go - friend here for lunch
Altaryum
@Altaryum
Aug 19 2016 17:31
http://codepen.io/Altaryum/pen/mEgpOK I cant make the dropdown menu to work.
Bhushan Patil
@mrpatil007
Aug 19 2016 17:33
@Altaryum you need js to work it
Altaryum
@Altaryum
Aug 19 2016 17:33
but in settings i added the js
And I also added Jquery to of them
it link gives u more info
Altaryum
@Altaryum
Aug 19 2016 17:42
ok thx ill remake it
Tyler Moeller
@TylerMoeller
Aug 19 2016 17:48
@Altaryum Move jQuery to the top of the list in your Codepen's JS settings. Bootstrap.js requires jQuery, so jQuery needs to load first. After making that change your dropdown will work.
Altaryum
@Altaryum
Aug 19 2016 17:49
Oh ok ill try that
it worked. Didnt knew that it needs to be in a certain order for it to work.
Will Kempster
@kempsterrrr
Aug 19 2016 18:01
Has anyone experienced codepen having issues with 3rd party libraries from https?
Gary Siu
@GarySiu
Aug 19 2016 18:05
@WilliamFace No but some things break if you mix http and https
Will Kempster
@kempsterrrr
Aug 19 2016 18:09
@GarySiu thanks Gary, will have a look at the links I am using. Had a similar issues with the open weather API, ended having to use a proxy URL to call it!
CamperBot
@camperbot
Aug 19 2016 18:09
williamface sends brownie points to @garysiu :sparkles: :thumbsup: :sparkles:
:cookie: 202 | @garysiu |http://www.freecodecamp.com/garysiu
Gary Siu
@GarySiu
Aug 19 2016 18:09
@WilliamFace A lot of people switched to using a different API now because of that issue
@WilliamFace Probably going to change when they next rewrite the challenge
Guilherme Salomé
@Salompas
Aug 19 2016 18:18
hey fellows! What is the best way to change the layout of a website depending on the width of the device?
Bhushan Patil
@mrpatil007
Aug 19 2016 18:19
col-- is best way @Salompas
jess-schiff
@jess-schiff
Aug 19 2016 18:19
@freecodegh yo thanks so much man!
CamperBot
@camperbot
Aug 19 2016 18:19
jess-schiff sends brownie points to @freecodegh :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @freecodegh |http://www.freecodecamp.com/freecodegh
Tyler Moeller
@TylerMoeller
Aug 19 2016 18:20
@Salompas media queries let you style elements differently depending on the size of the screen: https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
Guilherme Salomé
@Salompas
Aug 19 2016 18:21
@mrpatil007 thanks for the suggestion, but I didn't design my website to work with columns
CamperBot
@camperbot
Aug 19 2016 18:21
salompas sends brownie points to @mrpatil007 :sparkles: :thumbsup: :sparkles:
:cookie: 286 | @mrpatil007 |http://www.freecodecamp.com/mrpatil007
Guilherme Salomé
@Salompas
Aug 19 2016 18:21
@TylerMoeller thanks for the suggestion, I will take a look at that. It seems to be what I was looking for :D
CamperBot
@camperbot
Aug 19 2016 18:21
salompas sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 771 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Guilherme Salomé
@Salompas
Aug 19 2016 18:23
@TylerMoeller I am assuming you have some experience with it. Do you know how it differs from using jQuery .resize() method to change css?
Tyler Moeller
@TylerMoeller
Aug 19 2016 18:27
@Salompas I haven't used .resize() before. Sorry...from a quick read, it looks like it just tells you when the window is resized, but won't tell you what the size of the window is before changing the width.
Dylan
@dhcodes
Aug 19 2016 18:52
@Salompas media-queries don't require jQuery. They allow you to write new styles based on the size of the display. When used in conjunction with a grid-system, it makes it easier to make different layouts using the same content on varying screen sizes
Guilherme Salomé
@Salompas
Aug 19 2016 18:53
@dhcodes thanks :D
CamperBot
@camperbot
Aug 19 2016 18:53
salompas sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1342 | @dhcodes |http://www.freecodecamp.com/dhcodes
Julian Montague
@roastchicken
Aug 19 2016 19:10
any CSS gurus that could help me out? I'm trying to get the right quotation mark to align with the bottom of the lorem ipsum. http://codepen.io/roastchicken/pen/LkaNaV
Albert Brennan
@bluegreybolt
Aug 19 2016 19:14
@roastchicken try "#right-quote {margin-left:-75px;}" and tweak the number
Thats probably the easiest way
Julian Montague
@roastchicken
Aug 19 2016 19:14
If at all possible I want to use a non-hacky way
And I guess I wasn't clear enough
I want it vertically aligned with the lorem ipsum
So the bottom of the quote is the bottom of the ipsum
Albert Brennan
@bluegreybolt
Aug 19 2016 19:16
Wait whereabouts?
Above the button?
Or below?
Julian Montague
@roastchicken
Aug 19 2016 19:17
I want it to the right of the lorem ipsum, so the bottom of the quotation mark and the bottom of the lorem ipsum are aligned
Andy
@andythedandyone
Aug 19 2016 19:23
so, whats the deal on running js on codepen?

$(document).ready(function() {
   $("#gen").on("click", function(){
      // Only change code below this line.
      $('.message').html("Here is the message");  
      // Only change code above this line.
    });
  });
won't work
Stephen James
@sjames1958gm
Aug 19 2016 19:25
@andythedandyone did you load jquery?
Andy
@andythedandyone
Aug 19 2016 19:25
what u mean? @sjames1958gm
Stephen James
@sjames1958gm
Aug 19 2016 19:26
@andythedandyone There are settings (gear icon) that allow you to load libraries.
jquery is needed to do what you have there.
Andy
@andythedandyone
Aug 19 2016 19:26
hum.. let me check
garhh..lol
@sjames1958gm thanks
CamperBot
@camperbot
Aug 19 2016 19:27
andythedandyone sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2733 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 19 2016 19:27
@andythedandyone :+1:
Andy
@andythedandyone
Aug 19 2016 19:27
and on my local machine, it won't run correct? i have node installed on my mac, but it doesn't work either.
Albert Brennan
@bluegreybolt
Aug 19 2016 19:28
@roastchicken Have you tried making a separate container only containing the two quotation marks and the actual quote?
Then making them floating objects inside the div
And floating the left quote to the left
Julian Montague
@roastchicken
Aug 19 2016 19:28
Yes, but then the button and author are no longer aligned
Albert Brennan
@bluegreybolt
Aug 19 2016 19:28
The quote to the left
But you can put them in a second div and align them easily cant you?
CasiqueJhon
@CasiqueJhon
Aug 19 2016 19:29
how can I put <blockquote> into one text? is necesary make a html and css element?
Julian Montague
@roastchicken
Aug 19 2016 19:30
@bluegreybolt align them with margin, yes
Albert Brennan
@bluegreybolt
Aug 19 2016 19:30
So what's wrong with that?
Julian Montague
@roastchicken
Aug 19 2016 19:30
I want to avoid hard coded values if possible
Albert Brennan
@bluegreybolt
Aug 19 2016 19:30
Is that bad practice?
Julian Montague
@roastchicken
Aug 19 2016 19:30
So that I can scale this
Albert Brennan
@bluegreybolt
Aug 19 2016 19:30
It wont even be margin relative to the page
Only margin relative to the container div
so your div will be moveable without changing
Julian Montague
@roastchicken
Aug 19 2016 19:31
How would I do a margin relative to the container div?
Armaan Roshani
@armaanhammer
Aug 19 2016 20:06
Hey guys, I'm having a weird issue. Whenever I add a col-\*-\* class into my div, the well that the div sits in ends after the </p> and prior to the first <ul>
    <div id="main-text" class="col-sm-6 col-sm-offset-2">
      <p>Here's a time line of Gandhi's life:</p>
      <ul>
        <li>cat nip</li>
        <li>laser pointers</li>
        <li>lasagna</li>
      </ul> 
</div>
Eric Weiss
@eweiss17
Aug 19 2016 20:18
@armaanhammer I can look into this to help you if you want
Egarat
@egarat
Aug 19 2016 20:21
@armaanhammer you might consider using a jumbotron instead of wells, if you want a big box: http://www.w3schools.com/bootstrap/bootstrap_jumbotron_header.asp
Eric Weiss
@eweiss17
Aug 19 2016 20:22
I have a pretty jank fix...
#main-text {
 position: absolute;
  left: 65px;
  margin-top: 30px;
}
also your div doesn't even have the well class.....
the text is actually in the well before it
Egarat
@egarat
Aug 19 2016 20:24
the 4. line has the class well
butand 2. line
-but
Eric Weiss
@eweiss17
Aug 19 2016 20:24
yeah but line 9 doesn't, what they wrote made it seem like they wanted it in a new well
Egarat
@egarat
Aug 19 2016 20:25
I think the problem is, that the well finishes before the unorded list starts
thats the issue
Eric Weiss
@eweiss17
Aug 19 2016 20:25
they closed the div with the well in it before they even started the list
no point in arguing about it considering it is neither of our project anyway
Egarat
@egarat
Aug 19 2016 20:26
:smile:
I was just wondering where the problem lies and I am also interested in your point of view
but it has no meaning as long as the owner is not around...
greg
@wearenotgroot
Aug 19 2016 20:28

@egarat @eweiss17 well the most important thing is, looking at
Here's a time line of Gandhi's life:

  • cat nip
  • laser pointer
  • lasagna

:smile:

Armaan Roshani
@armaanhammer
Aug 19 2016 20:29
Hahaha, right?
greg
@wearenotgroot
Aug 19 2016 20:29
:smile:
Egarat
@egarat
Aug 19 2016 20:30
@armaanhammer armaan
the col-- need to be inside a row class div
try removing that and you will see the well works fine
Armaan Roshani
@armaanhammer
Aug 19 2016 20:30
For reference, I'm trying to imitate this page: https://codepen.io/FreeCodeCamp/pen/NNvBQW
Jerzz
@2cool4school
Aug 19 2016 20:31
guys how do i use the "tab" key with html?
Armaan Roshani
@armaanhammer
Aug 19 2016 20:31
@egarat Do you mean put the <p> and all the <ul>s into one <div class="row">?
Jerzz
@2cool4school
Aug 19 2016 20:32
i know there was a tag for this similar to line break <br>
or... i believe there was?
Eric Weiss
@eweiss17
Aug 19 2016 20:33
just use css padding-left: 30px;
or whatever
Egarat
@egarat
Aug 19 2016 20:33
@armaanhammer everything which should be in a line, should be in a row, a row spans 12 collumns as you can see by the name such as col-xs-1 which uses 1 collumn while col-xs-6 uses 6 collumns
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:33
@armaanhammer They use jumbotron, not a well. Like @egarat said, your columns need to be in a row.
<div id="main-text" class="row">
  <div class="col-sm-6 col-sm-offset-2">
    <p>Here's a time line of Gandhi's life:</p>
    <ul>
      <li>cat nip</li>
      <li>laser pointers</li>
      <li>lasagna</li>
    </ul>
  </div>
</div>
Formatted ^^
Egarat
@egarat
Aug 19 2016 20:34
so in this case you might want to put the hol <li></li in a row
or better
yeah
this looks better
you can use col-sm-12 instead of col-sm-6
and remove the offset class
Armaan Roshani
@armaanhammer
Aug 19 2016 20:35
It seems like the page I'm trying to mimic has everything in the page within a
<div class="jumbotron>
  <div class="row">
Jerzz
@2cool4school
Aug 19 2016 20:35
@eweiss17 that wasnt what i was looking for. Im not making the text an element of its own, rather 2 textual elements in a div, i dont want all elements inside it to have the same padding
Armaan Roshani
@armaanhammer
Aug 19 2016 20:36
@TylerMoeller I have everything in a row class. Line 4 of my code is a row. Do I need another row class closer to the column class?
Egarat
@egarat
Aug 19 2016 20:36
@armaanhammer if I understood correctly (I am pretty new as well), well are used for smaller elements, such as a list and jumbotron is used for a whole page
Eric Weiss
@eweiss17
Aug 19 2016 20:37
@2cool4school this?  
&nbsp;
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:37
@armaanhammer Line 4 is <div class="well main-image-box">. I don't see any rows in your code
Armaan Roshani
@armaanhammer
Aug 19 2016 20:37
@TylerMoeller wait, I'm wrong. Sorry. I had a well class on line 4, not a row
exactly
trying it now
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:38
But yeah, if you want to use columns, they need to be in rows and rows need to be in containers.
Daniel
@DanielMW34
Aug 19 2016 20:39

Can anyone check this link and tell me if you are able to get a response from the openweathermap.org website. They seem to be having trouble at the moment and I'm not sure if it is something in my link or their website...

https://api.openweathermap.org/data/2.5/weather?q=Cincinnati,Ohio,US&units=Imperial&callback=weatherData&appid=1f2215f659201e233c0256bde6cc2e79atherData&appid=1f2215f659201e233c0256bde6cc2e79

Egarat
@egarat
Aug 19 2016 20:39
you might need a row for the title, for the image, for the test text, etc. @armaanhammer
and inside those rows another div with col classes
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:39
@DanielMW34 Openweathermap doesn't support HTTPS unless you've paid money
Eric Weiss
@eweiss17
Aug 19 2016 20:40
@DanielMW34 try https://www.wunderground.com/weather/api/d/docs?d=data/geolookup&MR=1 and sign up to get a key.... i legit just did this because i was having similar problems to you
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:40
Glad that worked out for you @eweiss17
emreozcan3320
@emreozcan3320
Aug 19 2016 20:40
hey guys ı cant pass Show the Local Weather challange what will ı do
Tyler Moeller
@TylerMoeller
Aug 19 2016 20:40
Definitely the easier API to use with all these HTTP/HTTPS issues
Daniel
@DanielMW34
Aug 19 2016 20:41
gotcha. Even the main website for openweathermap.org doesn't seem to be working properly today
Eric Weiss
@eweiss17
Aug 19 2016 20:41
it took me like an hour to figure out I needed a key for it to work
emreozcan3320
@emreozcan3320
Aug 19 2016 20:42
ı spent about 3 hours but ı cant figure jguery part
and ı take jquery lesson but
ı cant
ı dont understand
for the javascript/jquery
Daniel
@DanielMW34
Aug 19 2016 20:42
@TylerMoeller @eweiss17 Thank you both
CamperBot
@camperbot
Aug 19 2016 20:42
danielmw34 sends brownie points to @tylermoeller and @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @eweiss17 |http://www.freecodecamp.com/eweiss17
:cookie: 772 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Eric Weiss
@eweiss17
Aug 19 2016 20:42
if you are using the api from that site
Daniel
@DanielMW34
Aug 19 2016 20:43
@emreozcan3320 send me a private message and I will work with you on this
Eric Weiss
@eweiss17
Aug 19 2016 20:45
the api section from this website is pretty weak. i understand why everyone gets caught up on this weather app one.... considering it is basically exclusively built using an api
emreozcan3320
@emreozcan3320
Aug 19 2016 20:46
@DanielMW34 actually ı dont figure out how ı send private message can u help a little bit
Daniel
@DanielMW34
Aug 19 2016 20:48
@emreozcan3320 right click on my avatar, it opens a window, select "chat privately'
Jerzz
@2cool4school
Aug 19 2016 20:48
I can't get any normal output to these divs, guys...
emreozcan3320
@emreozcan3320
Aug 19 2016 20:49
@DanielMW34 ı figure it and sent some trial message
Jerzz
@2cool4school
Aug 19 2016 20:49

html += "<div class='stream'>" + streamers[i] +"&emsp;" + status + "</div>";
this code wont output status, even though im logging it to console its working perfectly. on matter what i do it wont output "status", anywhere
Daniel
@DanielMW34
Aug 19 2016 20:50
@TylerMoeller @eweiss17 could either of you take a quick glance at my JavaScript here and help troubleshoot where I am going wrong (besides perhaps using the openweathermap.org API)
http://codepen.io/Daniel_Widrich/pen/VjgRqQ
ehekatlOf
@ehekatlOf
Aug 19 2016 20:54
This message was deleted
Daniel
@DanielMW34
Aug 19 2016 21:06
I cannot understand why I am able to access the first API (ip-api) and I am able to access the jsonp data in a new browser tab from openweathermap.org, yet I am unable to access that data in my JavaScript function
Daniel
@DanielMW34
Aug 19 2016 21:19
Did I end all conversation in this room?
Owlie
@Owlie
Aug 19 2016 21:21
Seems to be working fine, what data specifically are you not able to access?
Oh okay I see what you're saying now.
Emido
@emido
Aug 19 2016 21:28
hi guys
Daniel
@DanielMW34
Aug 19 2016 21:28
@Owlie main.temp
$.getJSON(wAPIurlIMP, function weatherData(json) {
      $("#temp").html(json.main.temp);
    });
I establish the url for the api call earlier, not sure why this is not displaying data in the appropriate html element #temp
Emido
@emido
Aug 19 2016 21:29
I tried to animate using a scrollTop to scroll down to a specific part of the page but before it does the scrolling the page make a quick blank. do you know why is that?
here is my pen
Daniel
@DanielMW34
Aug 19 2016 21:31
@Owlie at first I though I had missed indexing the value somehow but after reviewing other people's code, I see that is not the case.
Emido
@emido
Aug 19 2016 21:31
oh this is the correct one
Owlie
@Owlie
Aug 19 2016 21:32
Yeah something is getting caught up in the api call I think. That function is not being executed.
@DanielMW34 Yeah I just changed out the API call with the first one and it works fine.
@DanielMW34 Something in the URL maybe is causing it not to respond
Daniel
@DanielMW34
Aug 19 2016 21:33
so you think this problem exists on the openweathermap.org side or in the way I am calling that API ?
@Owlie
kakismash
@kakismash
Aug 19 2016 21:39
hi guys!
Daniel
@DanielMW34
Aug 19 2016 21:40
@Owlie thank you
CamperBot
@camperbot
Aug 19 2016 21:40
danielmw34 sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:cookie: 312 | @owlie |http://www.freecodecamp.com/owlie
kakismash
@kakismash
Aug 19 2016 21:42
I need help with something, I am building my calculator, but when I find with the RegExp the doc, dont work
Emido
@emido
Aug 19 2016 21:42
any help in my question
?
Bryce
@BryceV
Aug 19 2016 21:43
Hey all! Working on my portfolio page and need some pointers. How can I get my nav bar to extend across the top of the entire page (left right)? I have already set the margin and padding to zero. http://codepen.io/justcallmebob/full/mEgxoq/
Василий
@Zver64
Aug 19 2016 21:45
Hi guys! Can anyone help me with JQuery? I want to get a random quote from another website and i tried to use get and post methods but it doesn;t work....
Elbert Cortez
@trip16661
Aug 19 2016 21:45
@Zver64 take a look at AJAX and the get
you do not need post
for it
Василий
@Zver64
Aug 19 2016 21:46
@trip16661 I did....But it doesn't work anyway....
@trip16661 I'm stuck....
Elbert Cortez
@trip16661
Aug 19 2016 21:46
The dots are extra
just paste the code you have so far
@BryceV Right click
on the padding
and inspect
when u do it u will see that you are actally inspecting the html document so that gives u a lead
it means there is a little padding in there caused by the body document or the html document
by default I usually take it off at the begining of any project
Bryce
@BryceV
Aug 19 2016 21:51
@trip16661 I am unfamiliar with the dev tools thus far. I gave it a look and it threw an error. Padding and margin should be set to zero, but there's a mysterious white space.
Elbert Cortez
@trip16661
Aug 19 2016 21:51
@BryceV okay
go to the part where it says
body
try to hover it
it will show u how much space it takes
TopKlar
@topklar
Aug 19 2016 21:52
hi folks
Elbert Cortez
@trip16661
Aug 19 2016 21:52
the padding
the margin
u will see that there is a margin in the right side
Василий
@Zver64
Aug 19 2016 21:54
How can i use this api?
http://forismatic.com/en/api/
Elbert Cortez
@trip16661
Aug 19 2016 21:55
@trip16661 now check this
@media (min-width: 768px)
.container {
/ width: 750px; /
}
TopKlar
@topklar
Aug 19 2016 21:55
would love to use an image on my website am building but wouldnt love to upload the image first on social media.... anybody here got an idea how i can crack this ?
Elbert Cortez
@trip16661
Aug 19 2016 21:56
@topklar can you explain it again?
Василий
@Zver64
Aug 19 2016 21:58
Does anyone know what it mean?
net::ERR_INSECURE_RESPONSE
TopKlar
@topklar
Aug 19 2016 21:59
@trip16661 tryn to source and image on my app which am building on CodePen. Inothere for me to use any image i would have to add the source. but this images are located locally on my computer
Julian Montague
@roastchicken
Aug 19 2016 22:01
@topklar use an image host
not sure what good ones are, since imgur blocks codepen :(
TopKlar
@topklar
Aug 19 2016 22:02
@roastchicken got any reccomendations ?
Julian Montague
@roastchicken
Aug 19 2016 22:03
no, unfortunately not. you could use base64 encoding, but only for testing sites.
Elbert Cortez
@trip16661
Aug 19 2016 22:03
@topklar you can use many host kind of sites
I would recomend cloudinary
TopKlar
@topklar
Aug 19 2016 22:04
@trip16661 got any reccomendations ?
@trip16661 aii.... let me have a look... thanks
CamperBot
@camperbot
Aug 19 2016 22:04
topklar sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:cookie: 452 | @trip16661 |http://www.freecodecamp.com/trip16661
Bryce
@BryceV
Aug 19 2016 22:05
@trip16661 Ok, I figured it out with your help. It had to do with the body.container and I also had to make its width 100%. Why doesnt the .container start with 100%?
Elbert Cortez
@trip16661
Aug 19 2016 22:05
@Zver64 it can be many things but what im guessing is that you have HTTP HTTPS cross origin
I'm really not sure I havent learned bootstrap
I dont really want to either xD
Василий
@Zver64
Aug 19 2016 22:07
@trip16661 I used HTTPS
Elbert Cortez
@trip16661
Aug 19 2016 22:07
@Zver64 yes but you must have a request to an http
and that might cause it
Василий
@Zver64
Aug 19 2016 22:07
This is my code
$('#myBtn').click(function() {
$.ajax({
  type: 'GET',
  dataType: 'jsonp',
  url: 'https://api.forismatic.com/api/1.0/',
  success: function (response) {
     $('#myTable').append(response);
  }
});

});
@trip16661 Why do i have to use http instead of https?
Elbert Cortez
@trip16661
Aug 19 2016 22:09
@Zver64 umm i think forismatic api only runs on http not sure tho
You should check cors
CORS
Василий
@Zver64
Aug 19 2016 22:10
@trip16661 Can you give me another api then?
Elbert Cortez
@trip16661
Aug 19 2016 22:10
@Zver64 is that my job?
Василий
@Zver64
Aug 19 2016 22:11
@trip16661 No
Spyrantis Theodoros
@thodorisanta
Aug 19 2016 22:11

https://codepen.io/oshikurou/pen/RRxdpr

guys help...for some reason the "social media" icons that i have on the bottom of the page dont work, they were working till today though. i checked from google chrome and firefox and they didnt work with neither.They work when i visit the codepen from phone though. What changed?

TopKlar
@topklar
Aug 19 2016 22:11
@trip16661 nice reply to @Zver64
Elbert Cortez
@trip16661
Aug 19 2016 22:12
@Zver64 one the important things is to search it yourself I could simply tell you but
would you really learn how to to?
I really dont lose anything doing it
Василий
@Zver64
Aug 19 2016 22:12
@trip16661 I've been strugling with this task for couple of weeks
@trip16661 And i read a lot of information on internet
Elbert Cortez
@trip16661
Aug 19 2016 22:14
Okay.
stands4
is the one I used
TopKlar
@topklar
Aug 19 2016 22:16
@trip16661 nice reply to @Zver64
Elbert Cortez
@trip16661
Aug 19 2016 22:44
Okay im out
TopKlar
@topklar
Aug 19 2016 22:49
@thodorisanta I cant seem to find any Social media icons on your pagr
Davi Pereira
@xdavipereira
Aug 19 2016 22:50
@topklar because the link to the font-awesome is wrong, open your browser console and see the error mensage.
TopKlar
@topklar
Aug 19 2016 22:55
@xdavipereira i ahve seen the error message on my console. but can you see the Social media at all ?
Armaan Roshani
@armaanhammer
Aug 19 2016 22:59
Hey guys, I'm trying to complete the last Basic Front End Dev Project - building a portfolio website. The example website they give is way above my knowledge level though: https://codepen.io/FreeCodeCamp/full/YqLyXB/
Do you guys know if we're supposed to just write the basic HTML and CSS now and edit in all the javascript, etc later on?
TopKlar
@topklar
Aug 19 2016 23:01
@armaanhammer Just get on it. been on it for a while too
Armaan Roshani
@armaanhammer
Aug 19 2016 23:02
@topklar What do you mean? It's not like I haven't studied enough. I haven't actually gotten to javascript yet. It's the next section after this project.
Owlie
@Owlie
Aug 19 2016 23:04
@armaanhammer Yeah. Just build it with what you know, and then go back and update it as you progress through the courses.
TopKlar
@topklar
Aug 19 2016 23:05
@armaanhammer you dont have to use javascript. I am using bootstrap, which is pretty easy. I hope i would be done tomorow, so i can start learning Javascript
Armaan Roshani
@armaanhammer
Aug 19 2016 23:05
Does bootstrap allow you to autoscroll with buttons?
Kevin Murphy
@kaym0
Aug 19 2016 23:06
Hey, I'm doing a bit of a test here to try and get the background to switch using the API and comparing the response based on weather, and returning a specific background image
Owlie
@Owlie
Aug 19 2016 23:06
@armaanhammer Don't worry about making it look like the example, just try you best to fulfill the stories.
Kevin Murphy
@kaym0
Aug 19 2016 23:06
Anybody able to help me? I'm doing it in Angular.
Armaan Roshani
@armaanhammer
Aug 19 2016 23:07
@Owlie Ah, I see. I might have been approaching the last page wrong too then. I'll focus on the stories. Thx!
CamperBot
@camperbot
Aug 19 2016 23:07
armaanhammer sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @owlie |http://www.freecodecamp.com/owlie
Owlie
@Owlie
Aug 19 2016 23:16
@kaym0 I may be able to help. What do you need?
Armaan Roshani
@armaanhammer
Aug 19 2016 23:31
Ok, I thought I understood columns, but apparently I don't. Can anyone help me debug this? http://codepen.io/armaanhammer/pen/WxWJEq
I'm trying to get my picture to sit beside the row above it, not below it. The <div class="well"> lines aren't necessary, just trying different things.
Owlie
@Owlie
Aug 19 2016 23:33
@armaanhammer You might have a typo in your second column. You have it set at '2'.
Armaan Roshani
@armaanhammer
Aug 19 2016 23:34
Ah. I've been playing with numbers. The first numbers I tried were col-md-8 and col-md-4 respectively.
Owlie
@Owlie
Aug 19 2016 23:34
@armaanhammer In that case you need to put it within the same 'row' element
Armaan Roshani
@armaanhammer
Aug 19 2016 23:34
@Owlie Aaah, so "row" is a container that columns fit inside? Got it.
Owlie
@Owlie
Aug 19 2016 23:35
Correct, and each row will be on it's own 'line'. Like a spreadsheet.
Armaan Roshani
@armaanhammer
Aug 19 2016 23:35
That worked. Thank you! I overlooked that in the jQuery lesson that I was basing this off of.
Do you know how to center an element? I want to center that picture within the column.
Owlie
@Owlie
Aug 19 2016 23:36
add the 'text-center' class to the column div
<div class="col-xs-6 text-center"></div>
Armaan Roshani
@armaanhammer
Aug 19 2016 23:38
@Owlie Thanks! For some reason I thought that applied only to text.
CamperBot
@camperbot
Aug 19 2016 23:38
armaanhammer sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:warning: armaanhammer already gave owlie points
Owlie
@Owlie
Aug 19 2016 23:38
No problem. Yeah it's not a very accurate class name but it works!