These are chat archives for FreeCodeCamp/HelpFrontEnd

9th
Nov 2016
Doneal Bercier
@donealbercier
Nov 09 2016 00:12
I'm working on the Portfolio Site Challenge and I was wondering whether anyone could give me some feedback on how I've done so far. Any help is welcome https://codepen.io/donealbercier/pen/bwXxMX
Ken Haduch
@khaduch
Nov 09 2016 00:17
@djangoearnhardt - you're welcome - the developer's console tells all (or at least a lot... :) )
Ken Haduch
@khaduch
Nov 09 2016 00:26
@donealbercier - looks like a good start. You don't have your collapsible navbar set up with the "hamburger" icon - you need that to make it usable when your window gets narrow. You'll also need to add jquery.js and bootstrap.js in your JS external libs, because that is how the expansion of the collapsed navbar is achieved. And it looks like you don't have all of the navbar sections linked up to the proper sections in the content area - but that's probably just as you've posted a snapshot of your current work. Looks like it's a good start!
Doneal Bercier
@donealbercier
Nov 09 2016 00:30
@khaduch Thank you so very much for the input! I will be sure to fix the navbar and sections.
CamperBot
@camperbot
Nov 09 2016 00:30
donealbercier sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1896 | @khaduch |http://www.freecodecamp.com/khaduch
Johnny
@JohnnyBizzel
Nov 09 2016 00:58
I know I should read instructions but this is probably an easy mistake to make.
Git.png
Branches are case-sensitive so name your branch exactly the way your GitHub name appears.
is the most important instruction here. I think this would stand out more in a different colour font.
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:14

I am still struggling on my quote generator challenge. I can’t figure out how to access this .json library. If i load the link into my browser I can tell it is creating different quotes. But when I try to sort it into my page, no content is generated.

http://codepen.io/djangoearnhardt/pen/woKBzJ

JSON: http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=

Tom
@moT01
Nov 09 2016 01:22
console.log your jd see what your getting
@djangoearnhardt
Walid Ashri
@walidashri
Nov 09 2016 01:24
@djangoearnhardt jd is object u need to use jd[0] for content
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:29
@walidashri sorry i don’t quite understand. where would i put the jd[0] (i guess i’m calling the first spot of the jd array?)
Walid Ashri
@walidashri
Nov 09 2016 01:30
@djangoearnhardt do as @moT01 said and u'll see
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:31
I see that jd is not defined
Tom
@moT01
Nov 09 2016 01:33
im not an api king but your not getting your data in somehow
not sure what the problem is, id have play with it
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:35
$('.message').append('<p>' + jd[0].content + '</p>’);
I thought that might fix it… but i’m still not getting anything back @walidashri
ok thanks anyway @moT01
CamperBot
@camperbot
Nov 09 2016 01:35
djangoearnhardt sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Nov 09 2016 01:36
it would show your object if you were getting it
Walid Ashri
@walidashri
Nov 09 2016 01:37
@djangoearnhardt it's working here
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:38
@walidashri may i see what you changed? I can’t get it to respond at all
Walid Ashri
@walidashri
Nov 09 2016 01:39
@djangoearnhardt
$(document).ready(function() {

$("#button-marg-right").click(function() {
  $.getJSON('http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=', function(jd) {
    console.log(jd);
    $('.message').html('');
    $('.message').append('<p>' + jd[0].content + '</p>');
    $('.message').append('<p>' + jd[0].title + '</p>');
  });
});


});
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:42
maybe i can’t access it from my location?? it’s so weird that it won’t work for me @walidashri
Tom
@moT01
Nov 09 2016 01:42
change append to html
maybe
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 01:42
Hi, I am looking for some guidance.. I have an h1 tag that I am trying to veritcally center.. but even when putting it inside a span, It just sticks at the top... Anyone willing to look?
Tom
@moT01
Nov 09 2016 01:42
i see your object when i log it
Tom
@moT01
Nov 09 2016 01:43
@JeffGreenlee42 maybe try margin-top: auto; margin-bottom: auto; ---ive used that for horizontal centering not sure if it will work the same vertically
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:44
@moT01 that’s really strange…
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 01:44
Hmmm.. Ok! I'll try that!
Should I do it for span? or h1?
Tom
@moT01
Nov 09 2016 01:45
@djangoearnhardt the data is working for me, im getting some things, ...i change append to html, and used jd[0].whatever
@JeffGreenlee42 not sure try both, probly h1
djangoearnhardt
@djangoearnhardt
Nov 09 2016 01:47
@moT01 I’ll keep playing with it, thanks
CamperBot
@camperbot
Nov 09 2016 01:47
djangoearnhardt sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:warning: djangoearnhardt already gave mot01 points
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 01:49
@moT01 Darn.. Neither works.
Tom
@moT01
Nov 09 2016 01:51
vertical-align: middle;
Walid Ashri
@walidashri
Nov 09 2016 01:51
@djangoearnhardt u can clean ur code a little on codepen what goes to body only goes to html what goes to head you add it to the settings
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 01:56
Is it possible that elements within Flex-box elements will not vertically align?
Sailor Code
@blkgurlcode
Nov 09 2016 01:58
codepen: my tribute page looks great when I view it in full page mode but terrible any other way. What am I doing wrong???
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 01:59
@moT01 Yes.. middle is what I am using.. Can't make it work!
Tom
@moT01
Nov 09 2016 01:59
@blkgurlcode adding max-width: 100%; to elements can make them more dynamic
Sailor Code
@blkgurlcode
Nov 09 2016 01:59
@moT01 thanks I'll try it
CamperBot
@camperbot
Nov 09 2016 01:59
blkgurlcode sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 300 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Nov 09 2016 01:59
@JeffGreenlee42 sorry man, i don't have an answer for ya. i'd have to google it just as you would
Ken Haduch
@khaduch
Nov 09 2016 01:59
@blkgurlcode - I'm thinking that you have some fixed margin or margins in there... usually makes responsive behavior difficult!
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 02:00
So frusterating! They make it look so damned easy when you watch tutorial videos!
Sailor Code
@blkgurlcode
Nov 09 2016 02:01
@khaduch yeah a lot of this going on: p {
font-family: 'Anton', sans-serif;
color: #000000;
position: absolute;
text-align: justify;
top: 75px;
right: 10px;
left: 10px;
}
Tom
@moT01
Nov 09 2016 02:02
@JeffGreenlee42 sometimes putting one thing in there, can stop the thing in the tutorial from working, similar to the problem sailer is having
Ken Haduch
@khaduch
Nov 09 2016 02:02
@blkgurlcode - definitely the absolute positioning will not let your text flow into a good position on a narrow screen. Just looking at your main <h1> setup - the left position of 350px will be that no matter the screen width. So it will just get kind of messy...
Sailor Code
@blkgurlcode
Nov 09 2016 02:03
ok should I change it to relative or eliminate positioning all together???
Ken Haduch
@khaduch
Nov 09 2016 02:04
@blkgurlcode - there are ways to center text - looks like you're trying to do that, but the absolute positioning might be overtaking that?
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 02:05
@moT01 The frustering thing is that Google searches seem to just point to one property: verical-align! can't find anything that would block that!
Tom
@moT01
Nov 09 2016 02:07
what are you trying to center
one problem i see is your trying to style a class .h1
there is no class h1
@JeffGreenlee42
Sailor Code
@blkgurlcode
Nov 09 2016 02:11
changed everything to relative still a mess. My main problem while doing this was getting each element to be where I wanted it to be. That's why I have all the left, right, top, margins in css.
My problem is getting the layout correct
Tom
@moT01
Nov 09 2016 02:12
thats why its messing up when you shrink it
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 02:13
@moT01 Good call.. I removed the "." so its just referencing the element h1... doesn't make any difference.
Tom
@moT01
Nov 09 2016 02:13
you need more relative positioning quantities, % vw
Ken Haduch
@khaduch
Nov 09 2016 02:13
@blkgurlcode - I figured that is what you were trying to do, that's usually the reason for doing things like that. But you will have trouble with responsive behavior unless you design that in somehow - use some media queries, perhaps, or use Bootstrap or something...
Sailor Code
@blkgurlcode
Nov 09 2016 02:15
got it, bootstrap and Jquery are what I'm most familiar with so I'll try try that. Might just start from scratch
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 02:26
@moT01 Alright.. I figured it out. Apparently the children of Flex objects need "display: flex;" added to each.
Praveen Saraogi
@raviloop
Nov 09 2016 02:32
technovision.github.io
can anybody help me with this project
its taking a lot of time to load
Tom
@moT01
Nov 09 2016 02:34
whats the problem
Praveen Saraogi
@raviloop
Nov 09 2016 02:34
@moT01 That is what need to be figured out
try opening technovision.github.io
in your browser
Tom
@moT01
Nov 09 2016 02:36
no response
Praveen Saraogi
@raviloop
Nov 09 2016 02:36
sorry its
technovisioncs.github.io
joshandevera
@joshandevera
Nov 09 2016 02:37
hi how can i resize the logo without affecting the size and alignmen of the navbar http://codepen.io/joshdv92/pen/ENapZR?editors=1100
Tom
@moT01
Nov 09 2016 02:37
@raviloop yea its working
Praveen Saraogi
@raviloop
Nov 09 2016 02:38
@moT01 i know its working, how much time it took to load?
Tom
@moT01
Nov 09 2016 02:38
not long
Praveen Saraogi
@raviloop
Nov 09 2016 02:39
@moT01 can you help me adding particle.js as a background to my site
Tom
@moT01
Nov 09 2016 02:40
@joshandevera cant you just set the size, ...background-size i think
or something like that
@raviloop whats the problem, ...im not sure i can
Praveen Saraogi
@raviloop
Nov 09 2016 02:41
@moT01 you know about particle.js?
Tom
@moT01
Nov 09 2016 02:41
no
what is i t
it
Praveen Saraogi
@raviloop
Nov 09 2016 02:42

https://github.com/VincentGarreau/particles.js/

check this link you will get to know

Tom
@moT01
Nov 09 2016 02:43
can't add it in the way you would put jquery on there?
just add a cdn link, ...or a link to that file
the readme file shows how i think that should be how you do it
djangoearnhardt
@djangoearnhardt
Nov 09 2016 02:52
@walidashri ok cleaned up the style sheets in the header… thanks
CamperBot
@camperbot
Nov 09 2016 02:52
:cookie: 602 | @walidashri |http://www.freecodecamp.com/walidashri
djangoearnhardt sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
Praveen Saraogi
@raviloop
Nov 09 2016 03:17
@moT01 i tried including that link using script tag
but its not working
MelloLeo9
@MelloLeo9
Nov 09 2016 03:27
Hello guys i just some help about how to put some image in codepen. because it didn't show my image.
Monesul Haque
@mones-cse
Nov 09 2016 04:57
can any one help me with react ?
@MelloLeo9 whats your current code ?
Rob
@s31181
Nov 09 2016 05:37
can anyone help me i'm trying to cycle between Celsius and Fahrenheit for the weather app i just can't seem to get it
$('#currentTemp').html(currentTempCel);
     $('#currentTemp').on('click', function(){
      $('#currentTemp').attr(currentTempFar);
     }, function() {
       $('currentTemp').attr(currentTempCel);
     });
Rob
@s31181
Nov 09 2016 05:56
i took a different route i decided to create buttons to change the properties of the #currentTemp id
thanks guys!
Chris Cullen
@123xylem
Nov 09 2016 05:57

Hello!
I am making a frogger game with a repo given me by Udacity.
Can someone help me on where or how I use the repo they gave me though as the instructins dont seem to cover that https://docs.google.com/document/d/1v01aScPjSWCCWQLIpFqvg3-vXLH2e8_SZQKC8jNO0Dc/pub

So question: How/where do i use the given Repos info to make my game???

MelloLeo9
@MelloLeo9
Nov 09 2016 06:18
@mones-cse I'm, doin the freecodecamp build a tribute page using free code camp. using codepen
joshandevera
@joshandevera
Nov 09 2016 06:30
can put the logo at the top align about? http://codepen.io/joshdv92/pen/ENapZR?editors=1100
Mitch
@MitchWilkins
Nov 09 2016 06:56
@MelloLeo9 make sure the img tag src might need to be set to https. I also found going into the website after searching for it and copying the code there worked better for me.
By code I mean copying the image link*
joshandevera
@joshandevera
Nov 09 2016 07:08
how can place the logo inside the navbar? http://codepen.io/joshdv92/pen/ENapZR?editors=1100
Mitch
@MitchWilkins
Nov 09 2016 07:16
@joshandevera what logo? Generally you'd insert it where you have your name or to the left of it. You can do this with an img tag
evakri
@evakri
Nov 09 2016 08:29
Hey guys, I'm facing the first challenge and I'm kinda lost
How do you make that gray background to be of a certain size and that the picture would fit in it as in the example?
kat-mag
@kat-mag
Nov 09 2016 08:31
@evakri u can use bootstrap classes (like in this case). Set the column width for a div with that gray background for example
heroiczero
@heroiczero
Nov 09 2016 08:31
@evakri background-color:gray?
evakri
@evakri
Nov 09 2016 08:32
I know about setting the color
It's just the positioning that I need to figure out
heroiczero
@heroiczero
Nov 09 2016 08:32
@evakri if you are using bootstrap u can contain it in a class="container"
@evakri then a jumbotron to get a grey background
evakri
@evakri
Nov 09 2016 08:33
If I want to use bootstrap in codepen, do I have to link it in the <head>?
heroiczero
@heroiczero
Nov 09 2016 08:34
@evakri or you can set up a div with a margin-left and margin-right property
kat-mag
@kat-mag
Nov 09 2016 08:34
@evakri no, in settings in codepen
u go to css tab, settings and 'quickadd' boostrap ;)
evakri
@evakri
Nov 09 2016 08:34
Oh, and I also wanna ask another thing about using bootstrap
Are those classes like "container" or "jumbotron" predefined?
heroiczero
@heroiczero
Nov 09 2016 08:35
@evakri yest
evakri
@evakri
Nov 09 2016 08:35
I mean, I don't have to write them in the CSS tab from scratch
heroiczero
@heroiczero
Nov 09 2016 08:35
@evakri it is defined in the bootstrap.css
evakri
@evakri
Nov 09 2016 08:36
But I can modify them?
kat-mag
@kat-mag
Nov 09 2016 08:36
u can
heroiczero
@heroiczero
Nov 09 2016 08:37
@evakri you just have to define it in your css. I think it overrides the css in bootstrap
kat-mag
@kat-mag
Nov 09 2016 08:37
but it's better if you create your own class that overrides the properties that you need overriden and add it in the HTML :)
Sorin Ruse
@sorinr
Nov 09 2016 08:44
@evakri for a simple project like the static tribute page I would recommend to just use your own plain css and not a framework like bs. this way you will learn on how to style your html tags and then looking at some framework code you will be able to understand whats going on under the hood.
joshandevera
@joshandevera
Nov 09 2016 09:59
i can't get my fontawesome icons to show anyone knows how to fix this? https://codepen.io/joshdv92/pen/ENapZR?editors=1100
tigger
@tanya53
Nov 09 2016 10:09
@joshandevera I don't think you are linking to them <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> see http://www.w3schools.com/icons/
joshandevera
@joshandevera
Nov 09 2016 10:10
@thanks :)
Giannis Poulis
@ioanniswd
Nov 09 2016 10:19
I don't really get the user agent header for wikipedia.What should it contain?
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 10:30
Can anyone tell me why I get a white band at the bottom of web page?
Anyone? No? .. poo! :(
Giannis Poulis
@ioanniswd
Nov 09 2016 10:34
@JeffGreenlee42 what do you mean exactly
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 10:38
@ioanniswd I have an initial first page. It's a div named "firstPage". It contains a banner and 2 following sections: "intro ductory_paragrph and "skills". All 3 flexbox items should take up 100% of the viewspace.. but for some reason there is a white section under "skills" and I can't figure out what is causing it!
kirbyedy
@kirbyedy
Nov 09 2016 10:55
@JeffGreenlee42 .firstPage {
display: flex;
flex-direction: column;
/ height: 100vh; /}
sorry
anyway, when you remove that height of 100vh, the white is gone as well
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 11:02
@kirbyedy Thanks for pointing that out! .. however, now that leads to the opposite problem.. The whitebanner is gone... but the next element shows up where the white banner was. How do I make it so that just the contents of .firstPage fill the Viewport?
CamperBot
@camperbot
Nov 09 2016 11:02
:star2: 1518 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
jeffgreenlee42 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
kirbyedy
@kirbyedy
Nov 09 2016 11:05
ughm, hard to tell for me, cause you are using this jade thingy which I dont know, its not plaint html
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 11:08
@kirbyedy Allright try it now.. I remvoved the Jade thingy.. I wasn't really using Jade for this anyways.
kirbyedy
@kirbyedy
Nov 09 2016 11:10
try with height: 100vh; on skills div
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 11:14
@kirbyedy yeah.. that doesn't really work either.. now the height of the skills section extends beyond the bottom border. My understanding was that each unit of vh is 1 % of view space! so Naturally I thought 10vh for the banner, 40 vh for the intro and 50vh for the skills would fill the space!!!
Another puzzle I haven't solved is that the banner "nav-bar" section does not take its own space.. instead it floats over the top of the next element!
Jeff Greenlee
@JeffGreenlee42
Nov 09 2016 11:22
in fact, if make the last two sections 40/60 in height.. it works.. but that seems odd.. The nav-bar will always be there! so It doesn't make sense it's verticle real estate is not accounted for!
Chaitanya
@chaitanyajosen
Nov 09 2016 12:20
Can I share my Tribute Page project on the forums?
Hristijan Gjorgjievski
@hristijankiko
Nov 09 2016 12:21
Can someone tell me why i have the white space above my .intro section? I checked all elements and they have no margins
http://codepen.io/hristijankiko/pen/MbYOgm
ADIL KARMOUZI
@mradil16
Nov 09 2016 12:21
hi everyone. How can I apply " :hover " to 13 list items without selecting each item(I mean applying the style to the whole group) ?
Chaitanya
@chaitanyajosen
Nov 09 2016 12:22
@hristijankiko I think you should apply the background image to the body instead of H1.
Hristijan Gjorgjievski
@hristijankiko
Nov 09 2016 12:23
@mradil16 you can do ul li:hover
Chaitanya
@chaitanyajosen
Nov 09 2016 12:23
Can I share my Tribute Page project on the forums?
Hristijan Gjorgjievski
@hristijankiko
Nov 09 2016 12:23
@chaitanyajosen No, I want this image to be just for the 1st section not the entire webpage
@chaitanyajosen Yeah you can you just need account
Chaitanya
@chaitanyajosen
Nov 09 2016 12:24
@hristijankiko Make a new div class around H1?
@hristijankiko Thanks!
CamperBot
@camperbot
Nov 09 2016 12:24
chaitanyajosen sends brownie points to @hristijankiko :sparkles: :thumbsup: :sparkles:
:cookie: 333 | @hristijankiko |http://www.freecodecamp.com/hristijankiko
ADIL KARMOUZI
@mradil16
Nov 09 2016 12:25
@hristijankiko it works, thanks for help
CamperBot
@camperbot
Nov 09 2016 12:25
mradil16 sends brownie points to @hristijankiko :sparkles: :thumbsup: :sparkles:
:cookie: 334 | @hristijankiko |http://www.freecodecamp.com/hristijankiko
Karim
@krimou32
Nov 09 2016 12:34
Hi guys! Quick question, when using bootstrap's classes col-md-* is the 12 column grids calculated based on the body element or the parent element?
Clyde Lobo
@oppiniated
Nov 09 2016 12:54
@krimou32 normally depending on the parent element
Karim
@krimou32
Nov 09 2016 12:55
@oppiniated I already got the answer on the main chat but thank you! ;)
CamperBot
@camperbot
Nov 09 2016 12:55
krimou32 sends brownie points to @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 339 | @oppiniated |http://www.freecodecamp.com/oppiniated
peedueedu
@peedueedu
Nov 09 2016 12:56
hi people,
do I have do inclue my codepen link to proceed to the next challenge?
This was a little bit too easy for me so I didn't finish it.
Nothing happens when i click the Ive completed this challenge
Hristijan Gjorgjievski
@hristijankiko
Nov 09 2016 12:58
@peedueedu You have to complete all challenges even if they are easy if you want the certificate
kirbyedy
@kirbyedy
Nov 09 2016 13:00
@hristijankiko no, not all of them, just the one marked with a *
peedueedu
@peedueedu
Nov 09 2016 13:00
Alright, thanks!
Gabe
@gabecastelli
Nov 09 2016 13:18
for the Random Quote Machine are we expected to use another website's .json or are we supposed to make our own
joshandevera
@joshandevera
Nov 09 2016 13:19
can't float the image to the right and resize also can't make it responsive. https://codepen.io/joshdv92/pen/ENapZR?editors=1100
leecopland
@leecopland
Nov 09 2016 13:30
I did the portfolio project in an IDE because i find it easier and now copying across to codepen has screwed up the formatting, pls help
Sorin Ruse
@sorinr
Nov 09 2016 13:34
@leecopland easy like : what u have within the <body></body> tags copy paste into the html part of codepen. for css and js apply same rule in the corresponding panel of codepen. for loading links, libs, fonts, metadata whatever go to codepen settings and you ul find the tabs there
@leecopland each codepen panel have a down arrow button with a few options that will help you nice formatting the code in the panel or check for errors in your code
@joshandevera what is the img u wanna float? and why use "float" ?
leecopland
@leecopland
Nov 09 2016 13:39
@sorinr I might sleep on it, brain is fried from writing it all day haha. I cant work out why the background and text colours are different :worried: https://codepen.io/leecopland/pen/ZBbJBR
Clyde Lobo
@oppiniated
Nov 09 2016 13:41
@leecopland What section?
leecopland
@leecopland
Nov 09 2016 13:42
@oppiniated The background colour should be 88, 148, 194. most text should be 178, 213, 239
TasmaniaKrama
@TasmaniaKrama
Nov 09 2016 13:44

function sym(args) {
  function howMany(array, number) {
    var count = 0;
    for (var i = 0; i < array.length; i++) {
        if (array[i] === what) {
            count++;
        }
    }
    return count;
  }
  var counter = 0;
  var solution = [];
  var temp = arguments[0];
  for (var i = 1;i < arguments.length; i++) {
      temp.concat(arguments[i]);
  }

  console.log(temp);


}

sym([1, 2, 3], [5, 2, 1, 4], [5, 6, 2, 4]);
Anyone knows why concat is not joining the arrays of arguments here?
Sorin Ruse
@sorinr
Nov 09 2016 13:45
@leecopland coz for front face color u should use color: #hex rgb whatever color here, and for background you will use background, or background-color: the color u want. just let me know where do u want to apply a certain bg and what foreground do u want for it
leecopland
@leecopland
Nov 09 2016 13:46
body {
width: 100%;
height: 100%;
background-color: rgb(88, 148, 194);
font-family: 'Lato', sans-serif;
text-align: center;
}
TasmaniaKrama
@TasmaniaKrama
Nov 09 2016 13:46
nevermind I figured
leecopland
@leecopland
Nov 09 2016 13:47
@sorinr thats correct yeah?
Sorin Ruse
@sorinr
Nov 09 2016 13:47
@leecopland try in the css body background-color: rgb(88, 148, 194) !important;
leecopland
@leecopland
Nov 09 2016 13:48
@sorinr that worked
@sorinr same goes for the other css not being picked up?
2sor
@sorinr eh it looks good enough that im not embarrassed to submit it
tcar
@tcar
Nov 09 2016 13:55
i have three buttons... when i click one button i wanna give to third button a function, when i click second button i wanna give to third another function. how can i toggle between giving third button one or another function, depending on witch button i clicked
hope you understand my question
Sorin Ruse
@sorinr
Nov 09 2016 13:58
@leecopland i would still work on it a little but its ur design. not a bad one but still can be improved before submitting. anyway you can work on it even after submitting the link
JeffreyTan
@JackyJun35
Nov 09 2016 14:01
Please Help! Right now my webpage can not be scrolled. How can I make it scrollable?
@JackyJun35 It's to broad of a question. Add more content to make it scroll?
leecopland
@leecopland
Nov 09 2016 14:05
@sorinr yeah i agree it definitely needs work but i've learnt alot on this page and ill use it in future
Sorin Ruse
@sorinr
Nov 09 2016 14:09
@leecopland for example i would get rid of all that <br> tags and just replace them in css with a margin-top. etc
JeffreyTan
@JackyJun35
Nov 09 2016 14:11
@oppiniated So it will just scroll automatically if there is more content to fill up the screen?
leecopland
@leecopland
Nov 09 2016 14:15
@JackyJun35 correct
tcar
@tcar
Nov 09 2016 14:15
ok, i did it :D anyway, thanks for traying to help :)
Sorin Ruse
@sorinr
Nov 09 2016 14:15
@tcar you can do it by ether attaching or detaching an event on the buttons you want or make all them listen to the click event and based on some conditions you will call a specific function
JeffreyTan
@JackyJun35
Nov 09 2016 14:15
@leecopland thanks
CamperBot
@camperbot
Nov 09 2016 14:15
jackyjun35 sends brownie points to @leecopland :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @leecopland |http://www.freecodecamp.com/leecopland
Gabe
@gabecastelli
Nov 09 2016 14:24
hey guys i'm really having trouble figuring out how to get a JSON object from https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous
i have a key
kirbyedy
@kirbyedy
Nov 09 2016 14:26
do you have a codepen, I can take a look
Arvin
@arvkh
Nov 09 2016 14:52
When using Google Maps overflow-wrap: break-word does not work on iPhone, has this happened to anyone else?
Dylan
@dhcodes
Nov 09 2016 15:18
@arvkh looks like mobile safari doesn't support overflow-wrap but does support word-wrap
so you can replace it
@arvkh you can read the compatibility at the bottom of this page: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap
Sorin Ruse
@sorinr
Nov 09 2016 15:25
@dhcodes hi. welcome back
Dylan
@dhcodes
Nov 09 2016 15:26
;)
i never left
Sorin Ruse
@sorinr
Nov 09 2016 15:28
i meant today.
Dylan
@dhcodes
Nov 09 2016 15:32
lol
yes
how are you @sorinr
Sorin Ruse
@sorinr
Nov 09 2016 15:34
a little flu but i'm ok
Aaron
@apalm1341
Nov 09 2016 15:42
Anyone know of a way I can save my screenhero conversations with people I chatted with on there?
Or record what goes on while working together with people on there, if that is even ok to do?
DreCurrency
@drecurrency
Nov 09 2016 15:51
does anyone know how to make an image a background image using bootstrap only
Sorin Ruse
@sorinr
Nov 09 2016 16:09
@drecurrency what do you mean using bs only? bs is just css (excepting js part). as far as i know boostrap does not have a class for full image backgrounds. you should just implement it in css. here some ref: https://css-tricks.com/perfect-full-page-background-image/ if you want to achieve this
DreCurrency
@drecurrency
Nov 09 2016 16:14

@sorinr thanks i will check this out. I have tried using just css but it gets rid of my fixed-top navigation bar

http://codepen.io/jaykch/pen/oYXQdm

CamperBot
@camperbot
Nov 09 2016 16:14
drecurrency sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 835 | @sorinr |http://www.freecodecamp.com/sorinr
TheGr8Lemmoncawl
@TheGr8Lemmoncawl
Nov 09 2016 16:27

Hi everyone. I'm trying to use a combination of php and javascript in my webpage, but I'm having difficulty getting it to work. Here is my php code:

<?php
    mysql_connect("localhost","root","");//Server, user, password
    mysql_select_db("search");//Name of database

    if(isset($_POST['submit'])){
        $site_title = addslashes($_POST['site_title']);
        $site_link = addslashes($_POST['site_link']);
        $site_keywords = addslashes($_POST['site_keywords']);
        $site_desc = addslashes($_POST['site_desc']);
        $site_image = $_FILES['site_image']['name'];//!!Need to add unique user ID to beginning of each photo name to avoid problems with duplicate upload names!!
        $site_image_tmp = $_FILES['site_image']['tmp_name'];

        if($site_title=='' OR $site_link=='' OR $site_keywords=='' OR $site_desc==''){
            if($site_title==''){            
                echo "<script>
                        siteError();
                    </script>";
            };
            exit();
        }
        else{

            $insert_query = "insert into sites(site_title,site_link,site_keywords,site_desc,site_image)values('$site_title','$site_link','$site_keywords','$site_desc','$site_image')";

            move_uploaded_file($site_image_tmp,"images/{$site_image}");

            if(mysql_query($insert_query)){
                echo "<script>
                    alert('added')
                </script>";
            };
        }
    }



?>

and the external js code:

function siteError(){
    var error = <div id='error'>Please enter site name.</div>;
    var element = document.getElementById('siteTitleInput');
    element.insertAdjacentHTML('afterend',error);
};
Casey Heath
@ExhibitArts
Nov 09 2016 16:38
Check this out.
I'm running my own server.
Sorin Ruse
@sorinr
Nov 09 2016 16:39
@TheGr8Lemmoncawl where is the link("call") between js function and your php code?
TheGr8Lemmoncawl
@TheGr8Lemmoncawl
Nov 09 2016 16:40
@sorinr in the head tag
Or do you mean the function call? That's in the php code- I used
echo "<script>
                        siteError();
                    </script>";
Sorin Ruse
@sorinr
Nov 09 2016 16:42
@TheGr8Lemmoncawl can i see ajax call in the js part thats calling the php file? this is what i mean
TheGr8Lemmoncawl
@TheGr8Lemmoncawl
Nov 09 2016 16:44
Hmm.. I'm not using ajax, but here is the entirety of my code:
<!DOCTYPE html>
<html>
<head>
    <title>Insert Site</title>
    <script type="text/javascript" src="insert_site.js"></script>
<style type="text/css">
h2{
//color: white;
}

input, textarea{
width:175px;
vertical-align:middle;
}
textarea{
height:50px;
}

#error{
    color:red;
}
.changed{
    border:black 1px solid;
}

</style>
</head>

<body>
    <form action="insert_site.php" method="post" enctype="multipart/form-data">
        <table bgcolor="#ff4d4d" width="400" border="2" cellspacing="2" align="center">
            <tr>
                <td colspan="5" align="center"><h2>Inserting new website:</h2></td>
            </tr>

            <tr>
                <td align="right">Site Title:</td>
                <td id="siteTitleInput"><input type="text" name="site_title"/></td>
            </tr>

            <tr>
                <td align="right">Site Link:</td>
                <td><input type="text" name="site_link"/></td>
            </tr>

            <tr>
                <td align="right">Site Keywords:</td>
                <td><textarea style="resize:none" name="site_keywords" placeholder="Separate each keyword with a comma."></textarea></td>
            </tr>

            <tr>
                <td align="right">Site Description:</td>
                <td><textarea style="resize:none" name="site_desc" placeholder="Enter up to 500 words to describe your business."></textarea></td>
            </tr>

            <tr>
                <td align="right">Site Image:</td>
                <td><input type="file" name="site_image"/></td>
            </tr>

            <tr>
                <td align="center" colspan="5"><input type="submit" name="submit" value="Add Site Now"/></td>
            </tr>

        </table>

</body>
</html>

<?php
    mysql_connect("localhost","root","");//Server, user, password
    mysql_select_db("search");//Name of database

    if(isset($_POST['submit'])){
        $site_title = addslashes($_POST['site_title']);
        $site_link = addslashes($_POST['site_link']);
        $site_keywords = addslashes($_POST['site_keywords']);
        $site_desc = addslashes($_POST['site_desc']);
        $site_image = $_FILES['site_image']['name'];//!!Need to add unique user ID to beginning of each photo name to avoid problems with duplicate upload names!!
        $site_image_tmp = $_FILES['site_image']['tmp_name'];

        if($site_title=='' OR $site_link=='' OR $site_keywords=='' OR $site_desc==''){
            if($site_title==''){            
                echo "<script>
                        siteError();
                    </script>";
            };
            exit();
        }
        else{

            $insert_query = "insert into sites(site_title,site_link,site_keywords,site_desc,site_image)values('$site_title','$site_link','$site_keywords','$site_desc','$site_image')";

            move_uploaded_file($site_image_tmp,"images/{$site_image}");

            if(mysql_query($insert_query)){
                echo "<script>
                    alert('added')
                </script>";
            };
        }
    }



?>
function siteError(){
    var error = <div id='error'>Please enter site name.</div>;
    var element = document.getElementById('siteTitleInput');
    element.insertAdjacentHTML('afterend',error);
};
Casey Heath
@ExhibitArts
Nov 09 2016 16:45
Who in here lives in Burien?
Burien, WA
US
Sorin Ruse
@sorinr
Nov 09 2016 16:50
@TheGr8Lemmoncawl and when this form action="insert_site.php" will be called ?
TheGr8Lemmoncawl
@TheGr8Lemmoncawl
Nov 09 2016 16:53
It seems to be communicating with the sql database and I've been able to get js alerts to run. I even got it to work when I was just inserting some text next to the #siteTitleInput div. The problem arose when I tried to add a class to the new div.
Casey Heath
@ExhibitArts
Nov 09 2016 16:53
What about Arizona?
Tucson
85711
TheGr8Lemmoncawl
@TheGr8Lemmoncawl
Nov 09 2016 16:55
@sorinr for example- this works
if($site_title=='' OR $site_link=='' OR $site_keywords=='' OR $site_desc==''){        
                echo "<script>
                        alert('no');
                    </script>";
            exit();
        }
I get the alert to pop up when I click the submit button. But it won't execute siteError()
Aaron Bell
@awb715
Nov 09 2016 17:35
im trying to figure out how to link a search input to a button and carry that value
can anyone help out?
Ken Haduch
@khaduch
Nov 09 2016 17:49
@awb715 - this looks like it is working - at least it is reading the word "test" from the input element and outputting to the console? Is that all that you're trying to do, or am I missing some part of your question?
Aaron Bell
@awb715
Nov 09 2016 17:53
yea its working now. @khaduch now im applying it to the wikipedia project
Ken Haduch
@khaduch
Nov 09 2016 18:01
@awb715 - good luck with that!
Gabe
@gabecastelli
Nov 09 2016 18:23
can anyone help me with fetching data from a website to parse into a json object
Sorin Ruse
@sorinr
Nov 09 2016 18:27
@gabecastelli what website?
Gabe
@gabecastelli
Nov 09 2016 18:30
Here's what I have so far:
function getQuote() {
    const key = IXVa4v8h4kmshsbg7Y3NsoWNDYw3p1BiR3OjsnfbBoVLwH1wI7;
    $.ajax({
      url: "https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous&mashape-key=" + key,
      success: function(data) {
        var quote = JSON.parse(data);
        alert(quote);
      }
    });
forgot quotation marks
Tiago Fuelber
@TiagoFuelber
Nov 09 2016 18:31
fellows. How can I use HTTPS in my codepen's pages.?
Gabe
@gabecastelli
Nov 09 2016 18:31
it gives me net::ERR_CONNECTION_RESET
Sorin Ruse
@sorinr
Nov 09 2016 18:36
@gabecastelli you mean something like quotes?
@sorinr so I was missing stringify()?
ok it works @sorinr thanks
CamperBot
@camperbot
Nov 09 2016 18:38
gabecastelli sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 836 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Nov 09 2016 18:38
@gabecastelli welcome
Muhammad Hasham
@MohammadHasham
Nov 09 2016 18:39
can anyone guide me regarding psd to html?
Gabe
@gabecastelli
Nov 09 2016 18:39
the error it was giving me was irrelevant
Sorin Ruse
@sorinr
Nov 09 2016 18:44
@gabecastelli you also didn't had the key within "" or '' like const = "your key here"
@gabecastelli btw. the alert function works with strings so i transformed ("strigified") the object returned by the ajax call to be displaid
Muhammad Hasham
@MohammadHasham
Nov 09 2016 18:50
do we have to create wrapper for each content in html and the wrapper's height and width accordingly?
@sorinr
Sorin Ruse
@sorinr
Nov 09 2016 18:54
@MohammadHasham it depends on your layout
Muhammad Hasham
@MohammadHasham
Nov 09 2016 18:54
please can you elaborate a little because in some tutorials i see that the wrapper has not been created while some guys have done that
does it effect responsiveness and what are the consequences ?
@sorinr
Sorin Ruse
@sorinr
Nov 09 2016 18:59
@MohammadHasham for example i would do <div class="mywrapper"><h1>My Title</h1><div class="content">content here</div></div>but not <div class="mywrapper"><div class="anotherwrapper"><h1>My Title</h1</div><div class="content">content here</div></div>
Muhammad Hasham
@MohammadHasham
Nov 09 2016 19:02
so there should only be a single container/wrapper?am i right?
@sorinr
Sorin Ruse
@sorinr
Nov 09 2016 19:04
@MohammadHasham i see more a wrapper as a group of elements that belongs together as a unit. imagine a <form> tag. you can consider that tag as a wrapper for everything inside
Muhammad Hasham
@MohammadHasham
Nov 09 2016 19:05
yeah! thats okay.Can you recommend any good tutorials out there so i can wrap my head around
@sorinr
Sorin Ruse
@sorinr
Nov 09 2016 19:12
@MohammadHasham lol. read a little this react tutorial to understand components (wrappers i would say) concept: https://facebook.github.io/react/docs/thinking-in-react.html
Muhammad Hasham
@MohammadHasham
Nov 09 2016 19:12
@sorinr Thanks
CamperBot
@camperbot
Nov 09 2016 19:12
:cookie: 837 | @sorinr |http://www.freecodecamp.com/sorinr
mohammadhasham sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Nov 09 2016 19:13
@MohammadHasham i don't say u should learn react now. just take a look at the way of thinking. it will help you decide when and where to use a wrapper div
Aarya Bhorra
@aarya1302
Nov 09 2016 19:24
Hey guys I need help to make my code responsive you guys have any ideas?
Here is my code
Please help thanks
Sorin Ruse
@sorinr
Nov 09 2016 19:28
@aarya1302 your layout its already responsive as I see. maybe you can just use a media query to make the font-size a little smaller on mobiles
José Olórtegui
@jolortegui98
Nov 09 2016 19:33

$font__size--base: 16 !default

@function em($px, $base: $font__size--base)
@return ($px / $base) * 1em

Buenas tardes..les dejo una función en sass para pasar de px a em..
:smile:
$font__size--base: 16 !default

@function em($px, $base: $font__size--base)
    @return ($px / $base) * 1em
Mejor asi..jajaja
Sorin Ruse
@sorinr
Nov 09 2016 19:36
@aarya1302 you can try also adding to #entire a width: 80vw
Aarya Bhorra
@aarya1302
Nov 09 2016 19:39
@sorinr I'll try that thank you
CamperBot
@camperbot
Nov 09 2016 19:39
aarya1302 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 838 | @sorinr |http://www.freecodecamp.com/sorinr
Aarya Bhorra
@aarya1302
Nov 09 2016 19:40
@jolortegui98 thanks
CamperBot
@camperbot
Nov 09 2016 19:40
aarya1302 sends brownie points to @jolortegui98 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for jolortegui98
Pericles
@periman2
Nov 09 2016 19:43
hello there
Aman saxena
@neille2406
Nov 09 2016 19:44
hello
need help in making a resume its an assignment!
djangoearnhardt
@djangoearnhardt
Nov 09 2016 19:46
Hello, I’m struggling on this random quote generator. I’ve built something that works ok in Atom, when I put it in Codepen it won’t generate the quotes anymore. Can someone help me find what’s causing my code to be unresponsive? thank you!
http://codepen.io/djangoearnhardt/pen/woKBzJ
Aarya Bhorra
@aarya1302
Nov 09 2016 19:52
$("#button-marg-right").("click", function(){
Change your first line of code to this
ohh sorry my mistake
It should be this:
$("#button-marg-right").on("click", function(){
djangoearnhardt
@djangoearnhardt
Nov 09 2016 19:56
@aarya1302 I changed that, and it still isn’t working…
TasmaniaKrama
@TasmaniaKrama
Nov 09 2016 19:56
Does anyone know how to remove all copies of certain element from array? Like [2, 2, 2, 3, 5, 2] and I just want to have [3, 5]?
Aarya Bhorra
@aarya1302
Nov 09 2016 19:56
and also add a jquery library
Sorin Ruse
@sorinr
Nov 09 2016 19:57
@djangoearnhardt here ur working pen quotes
Aarya Bhorra
@aarya1302
Nov 09 2016 19:57
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
Add this to your html code
djangoearnhardt
@djangoearnhardt
Nov 09 2016 19:57
Oh yea!! that helped @aarya1302
thank you @aarya1302
CamperBot
@camperbot
Nov 09 2016 19:57
djangoearnhardt sends brownie points to @aarya1302 :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @aarya1302 |http://www.freecodecamp.com/aarya1302
Sorin Ruse
@sorinr
Nov 09 2016 19:57
@djangoearnhardt be aware that Fertigo font its not free and the pen it will not load it
djangoearnhardt
@djangoearnhardt
Nov 09 2016 19:58
ok thanks @sorinr I’ll fix that
CamperBot
@camperbot
Nov 09 2016 19:58
djangoearnhardt sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 839 | @sorinr |http://www.freecodecamp.com/sorinr
Aarya Bhorra
@aarya1302
Nov 09 2016 19:58
your welcome @djangoearnhardt
*you're
Justin Vernon
@Jvernz
Nov 09 2016 20:00
How long does it take most people to complete the "Build a Personal Portfolio Webpage" challenge? The app shown in the challenge seems incredibly refined. No idea how to create something even remotely similar
djangoearnhardt
@djangoearnhardt
Nov 09 2016 20:00
For my tweet button, I thought I could use
$("#button-marg-left").click(function(){
              $.getJSON('http://quotes.stormconsultancy.co.uk/random.json', function(jd) {
                $("#button-marg-left").attr("href", 'https://twitter.com/intent/tweet?text=' + jd.quote + ' ' + jd.author);});
              });
Does it make sense to create a new function just for my tweet button (#button-marg-left)
sorry that’s a little confusing… I’ve updated my codepen, and here’s the questions: Why won’t my tweet button link to twitter and share my quote
http://codepen.io/djangoearnhardt/full/woKBzJ/
Thayyeb salim
@Thayyebsalim
Nov 09 2016 20:09
Hello guys, I am building a tribute page.
Can anyone help me with improvements
Brady
@soccer99
Nov 09 2016 20:23
Started learning VueJS this week. I have a decently strong grasp on ReactJS and I have to say Vue is so much more fun and rewarding than React
Ken Haduch
@khaduch
Nov 09 2016 20:26
@Thayyebsalim - I think that the page looks nice. There is a lot of information there, but nicely laid out and easy to read. One suggestion is that instead of using a fixed width or height on the image, use max-height: 800px; it makes for better responsive behavior, the image won't get "pinched" on different screen sizes.
djangoearnhardt
@djangoearnhardt
Nov 09 2016 20:48
Still struggling on being able to tweet my quote, I’ve tried a few things now and am stumped. I’d appreciate if anyone could lend a hand…
http://codepen.io/djangoearnhardt/pen/woKBzJ?editors=1010
aqm225
@aqm225
Nov 09 2016 21:13
can someone please help me with how this all works/
how do i start contributing to projects and learn
i have newly joined this site
Tyler Moeller
@TylerMoeller
Nov 09 2016 21:25
@djangoearnhardt The url should have ?text= in it: https://www.twitter.com/intent/tweet?text=. Keep in mind, if you call the API again for the tweet text, you'll be tweeting a different quote than what you have on the page.
djangoearnhardt
@djangoearnhardt
Nov 09 2016 21:27
thanks @TylerMoeller how would I have it tweet the current quote. I thought setting up a variable for those values would preserve that
CamperBot
@camperbot
Nov 09 2016 21:27
djangoearnhardt sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 923 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Nov 09 2016 21:28
@djangoearnhardt You can read them from the page $('.message').text(), or you can update the href value like you had earlier, a couple posts above and place that code in the same anonymous function you use for displaying the quote on the page.
Just make sure to use target="_blank" in codepen URLs so they open in a new tab
And, this will be helpful for ensuring you can tweet quotes with punctuation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
djangoearnhardt
@djangoearnhardt
Nov 09 2016 21:29
thank you so much, this is a bit to digest, but i’ll get on it @TylerMoeller
CamperBot
@camperbot
Nov 09 2016 21:29
djangoearnhardt sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: djangoearnhardt already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Nov 09 2016 21:34
@aqm225 Welcome to Free Code Camp. You can start here: https://freecodecamp.com/map
Peter Andersson
@repeterande
Nov 09 2016 21:37
I am working on my quote machine and I would like to render <p>{this.state.quote}</p> and I can see the quote in App.state using react dev tools in codepen debug view, but it doesn't work when I add the jsx to render(), any pointers would be much appreciated: http://codepen.io/repeterande/pen/pNJjzE?editors=1010
Thayyeb salim
@Thayyebsalim
Nov 09 2016 21:44
thank you @khaduch Here are your brownie points :smile:
CamperBot
@camperbot
Nov 09 2016 21:45
thayyebsalim sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1899 | @khaduch |http://www.freecodecamp.com/khaduch
ZaynMalloc
@ZaynMalloc
Nov 09 2016 21:47
@repeterande The problem is that you are missing getInitialState from your component lifecycle. Add getInitialState: function(){
return{
quote:''
};
}, . Then in your render add <h1>{this.state.quote}</h1>
Peter Andersson
@repeterande
Nov 09 2016 21:48
ah, thank you very much @ZaynMalloc
CamperBot
@camperbot
Nov 09 2016 21:48
repeterande sends brownie points to @zaynmalloc :sparkles: :thumbsup: :sparkles:
:cookie: 253 | @zaynmalloc |http://www.freecodecamp.com/zaynmalloc
Peter Andersson
@repeterande
Nov 09 2016 21:49
:)
ZaynMalloc
@ZaynMalloc
Nov 09 2016 21:50
@repeterande You're welcome!
djangoearnhardt
@djangoearnhardt
Nov 09 2016 21:52

@TylerMoeller I’ve tried to figure out what you were advising and I’m just not getting it. Why can’t I put my tweet behavior inside the generate quote function. And use

var tweetQuote = jd.quote;
var tweetAuthor = jd.author;

as local variable for the same two things like this:

$(document).ready(function() {

             $("#button-marg-right").on("click", function(){
                $.getJSON('http://quotes.stormconsultancy.co.uk/random.json', function(jd) {
                  var tweetQuote = jd.quote;
                  var tweetAuthor = jd.author;

                  $('.message').html('');
                   $('.message').append('<p>' + jd.quote + '</p>');
                   $('.author').html('');
                   $('.author').append('<p>- ' + jd.author + '</p>');
                });
                $("#button-marg-left").on("click", function(){

                 $.getJSON('http://quotes.stormconsultancy.co.uk/random.json', function(jd) {
                   var tweetQuote = jd.quote;
                   var tweetAuthor = jd.author;
                   window.open("https://www.twitter.com/intent/tweet?text=" + tweetQuote + tweetAuthor)});
                            });    });   

             });
Ian
@IJACOBS
Nov 09 2016 22:05
Anyone else working on the Twitch project and realize that their workaround site to use the API has gone down?
Tyler Moeller
@TylerMoeller
Nov 09 2016 22:06

@djangoearnhardt You can put your tweet behavior inside the generate quote function:

$('#button-marg-right').on('click', function () {
  $.getJSON('http://quotes.stormconsultancy.co.uk/random.json', function (jd) {
    var tweetQuote = jd.quote;
    var tweetAuthor = jd.author;

    $('.message').html('');
    $('.message').append('<p>' + jd.quote + '</p>');
    $('.author').html('');
    $('.author').append('<p>- ' + jd.author + '</p>');
    $('#button-marg-left').attr('href', 'https://twitter.com/intent/tweet?text=' + tweetQuote + ' ' + tweetAuthor);
  });
});

There is no need to use a .click handler for the quote button since it is already a <a> in your HTML. When the user clicks, it will go to the URL you specify.

djangoearnhardt
@djangoearnhardt
Nov 09 2016 22:14
Wow!!! I’ve been on this for two days… Thank you so much @TylerMoeller. The amount of questions I had moving from the JSON API's section to these challenges in FCC is just so vast.
I see how I was being redundant on that click behavior but never would have put that together :) @TylerMoeller :+1:
Tyler Moeller
@TylerMoeller
Nov 09 2016 22:16
@djangoearnhardt No problem. :) There's also no need to clear the contents with .html() and then use .append():
  $.getJSON('http://quotes.stormconsultancy.co.uk/random.json').done(function(jd) {
    var tweetText = encodeURIComponent(jd.quote + ' ' + jd.author);
    $('.message').html('<p>' + jd.quote + '</p>');
    $('.author').html('<p>- ' + jd.author + '</p>');
    $("#button-marg-left").attr("href", 'https://twitter.com/intent/tweet?text=' + tweetText)
  });
djangoearnhardt
@djangoearnhardt
Nov 09 2016 22:18
hahah awesome @TylerMoeller , that looks much cleaner. I was just using it because it worked by chance
you’ve definitly brought me a little peace of mind today :clap:
Jonathan Doliver
@porygonj
Nov 09 2016 23:03
I'm really stuck with my Tic-Tac-Toe AI. I don't understand why it is mostly only choosing the first space available to it. Any help would be appreciated. http://codepen.io/porygonj/pen/EybYZg?editors=0110
Gaddieshack
@Gaddieshack
Nov 09 2016 23:22
Howdy, guys. I'm at building a tribute page. What exactly am I supposed to create? There aren't many evident parameters for the assignment.
At least, not ones that specify what they're looking for when you're making this.
Like, is jQuery required for Building a Tribute Page?
It seems the only things you need to play around with are the HTML basics and Bootstrap.
Amit Patel
@AmitP88
Nov 09 2016 23:26
hey guys, I managed to get my modal image right for the first menu item on this website: https://amitp88.github.io/Khmer-Family-Cafe/ but I'm struggling to figure out how to add them to the rest of the menu items when I look at the javascript part
Anicic
@Anicic
Nov 09 2016 23:27
Hello world, i'm practicing with bootstrap and responding.I'm trying to use a minimum of CSS, only HTML and bootstrap to reach a goal. Look, and please give a comment!:) https://codepen.io/AnicicZ/pen/NbWJNd
CamperBot
@camperbot
Nov 09 2016 23:27

welcome to FreeCodeCamp @Anicic!

kat-mag
@kat-mag
Nov 09 2016 23:31
@Anicic Fonts are bit big, that bold-text part doesn't look too pleasant. Just adjust the fonts & give paragraphs some padding and it'll be cool ;)
Gaddieshack
@Gaddieshack
Nov 09 2016 23:31
Er...anyone there?
kat-mag
@kat-mag
Nov 09 2016 23:33
@Gaddieshack everything you need for that is html & css
Nothing else is required tho u can use whatever you want
And the topic - whatever interests you. It may even be pizza xD
Gaddieshack
@Gaddieshack
Nov 09 2016 23:34
@kat-mag The video of the example said it was made entirely in Bootstrap, so I figured that it was Bootstrap and HTML. Thanks for responding. Mine is over Satoru Iwata.
CamperBot
@camperbot
Nov 09 2016 23:34
gaddieshack sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 404 | @kat-mag |http://www.freecodecamp.com/kat-mag
kat-mag
@kat-mag
Nov 09 2016 23:35
@AmitP88 maybe some on click function that adds & removes classes from your menu items?
jquery would be simple enough I suppose @AmitP88
@Gaddieshack Well, they do recommend bootstrap because it's faster to make this way, I suppose. But doing it purely in css may benefit you in the future
on the other hand knowing a css framework is beneficial too.. but no rush ;D
Anicic
@Anicic
Nov 09 2016 23:38
Thank's for a comment @kat-mag and @Gaddieshack...
CamperBot
@camperbot
Nov 09 2016 23:38
anicic sends brownie points to @kat-mag and @gaddieshack :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @gaddieshack |http://www.freecodecamp.com/gaddieshack
:cookie: 405 | @kat-mag |http://www.freecodecamp.com/kat-mag
Anicic
@Anicic
Nov 09 2016 23:41
The focus is little bit on a responding of elements on variety of devices.
Anicic
@Anicic
Nov 09 2016 23:52
Actually responsive design.
Gaddieshack
@Gaddieshack
Nov 09 2016 23:55
Like "container-fluid" and "xs-col-*"?
Anicic
@Anicic
Nov 09 2016 23:58
Yeah, I try to figure all that stuff.
Gaddieshack
@Gaddieshack
Nov 09 2016 23:59
Alright. Thanks.