These are chat archives for FreeCodeCamp/HelpFrontEnd

21st
Sep 2016
Omar Salem
@OmarSalem563
Sep 21 2016 00:22
hi i need hlp
Aaron
@crazyxrp
Sep 21 2016 00:23
let me try
Omar Salem
@OmarSalem563
Sep 21 2016 00:23
i need hlp in the p element
林水溶/shuiRong Lin
@shuiRong
Sep 21 2016 00:30
what's wrong
Cameron Burkholder
@Cameron-Burkholder
Sep 21 2016 00:30
Hey, I'm looking for some clarification on the Pomodoro Clock: do I have to make the clock able to be paused?
Omar Salem
@OmarSalem563
Sep 21 2016 00:31
its hard
林水溶/shuiRong Lin
@shuiRong
Sep 21 2016 00:31
show me your code
@OmarSalem563
Omar Salem
@OmarSalem563
Sep 21 2016 00:32

<style>
.red-text {
color: red;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

underOneFlag
@underOneFlag
Sep 21 2016 00:33
@OmarSalem563 adding a p element?
to add an element just do
<elementTagName>text inside element</elementTageName>
林水溶/shuiRong Lin
@shuiRong
Sep 21 2016 00:33
so, what's wrong
Omar Salem
@OmarSalem563
Sep 21 2016 00:34
can u show me an example
林水溶/shuiRong Lin
@shuiRong
Sep 21 2016 00:35
no computer with me.....
Jordan Bartholomew
@tourdejord
Sep 21 2016 00:43
I have a few minutes. Anyone need assistance. I just finished the local weather app. So past that I'm not much help.
15 minutes to be exact.
Jordan Bartholomew
@tourdejord
Sep 21 2016 00:57
How's it going @OmarSalem563 Did you get it yet?
Omar Salem
@OmarSalem563
Sep 21 2016 00:57
not yet
@tourdejord not yet
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:07
ok, can you send me a link to your code and I'll see what the question is.
Cameron Burkholder
@Cameron-Burkholder
Sep 21 2016 01:13

Can anyone find why some of the code isn't running on the Pomodoro Clock?

https://codepen.io/CameronBurkholder/pen/jrrXzZ?editors=0010

Jordan Bartholomew
@tourdejord
Sep 21 2016 01:15
Thank you. One second.
Omar Salem
@OmarSalem563
Sep 21 2016 01:16
@tourdejord your welcome
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:19
So you just need to know how to create an entry for p element and change the font size, correct?
Cameron Burkholder
@Cameron-Burkholder
Sep 21 2016 01:19
Has anyone completed pomodoro clock?
Omar Salem
@OmarSalem563
Sep 21 2016 01:20
@tourdejord yes but how should i do it can u give me the steps
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:21
Yes, it's very simple to the learned eye. I'd recommend doing codecademy.com "HTML/CSS" also. It will help you immensely in the tutorials ahead. So...
Robert Ridley
@robertridley1988
Sep 21 2016 01:22

Hey everyone. I have just finished the local weather app. It identifies the user's location and shows the weather for that location. Can you guys run it and let me know what it shows? I can obviously only run it from my current location to test it. Thanks!

http://codepen.io/robertridley1988/full/rrOmPq/

Omar Salem
@OmarSalem563
Sep 21 2016 01:22
i started the code academy
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:22
I'm trying to tell you without giving the answer. Basically if you make p look like the .red-text in editor you will find your answer.
Omar Salem
@OmarSalem563
Sep 21 2016 01:23
@tourdejord ima try
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:24
<style>
  .red-text {
    color: red;
  }
</style>
p won't need a . Because it's not a custom defined class so you can just use p.
Omar Salem
@OmarSalem563
Sep 21 2016 01:28
wat do u mean define p
@tourdejord wat do u mean define p
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:32
You've suffered enough man. It's not crucial to figure on your own.
Add this between your style tags. Define actually was poor wording.
P {
Font-size: 16px;
}
Omar Salem
@OmarSalem563
Sep 21 2016 01:34
i did it
Cameron Burkholder
@Cameron-Burkholder
Sep 21 2016 01:34

Can anyone look at this and figure out why the timer and break functions aren't running?

https://codepen.io/CameronBurkholder/pen/jrrXzZ?editors=1010

The timer function is pomodoro and the break funciton is breaker
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:36
Right on man. Keep it up.
Omar Salem
@OmarSalem563
Sep 21 2016 01:36
@tourdejord thank you for the help
Robinsond7691
@Robinsond7691
Sep 21 2016 01:50
@robertridley1988 working for me, cool :D
Could someone take a quick look and see why my button doesnt work? http://codepen.io/Robinsond76/pen/mAOBjj?editors=1100
Trommelochse
@Trommelochse
Sep 21 2016 01:55
@Cameron-Burkholder confusing code . why don't your work with the Date Object?
@Robinsond7691 what is it supposed to do!?
Jordan Bartholomew
@tourdejord
Sep 21 2016 01:56
You are welcome.
Robinsond7691
@Robinsond7691
Sep 21 2016 01:56
@Trommelochse I want my button to update the message according to the script i wrote
is that script correct?
Trommelochse
@Trommelochse
Sep 21 2016 01:57
can't see any JS in your script
George Miller
@GMiller64
Sep 21 2016 01:57
my attempt at the Random Quote Generator. http://codepen.io/GMiller64/full/QKGOGN/
Robinsond7691
@Robinsond7691
Sep 21 2016 01:57
@Trommelochse oh i copied it and threw it inside the html tab, and just wrote it between script tags. I'll copy it and paste into the JS tab again
George Miller
@GMiller64
Sep 21 2016 01:58
constructive critiques welcome.
Robert Ridley
@robertridley1988
Sep 21 2016 01:59
@Robinsond7691 Thank you!
Robinsond7691
@Robinsond7691
Sep 21 2016 02:00
@GMiller64 looks great to me, I'm trying to do it now too. I don't want to look at your code, but can you see why my button isnt working? check out the code pen I pasted just above yours.
Kashyap Pandya
@Kashyap-pandya
Sep 21 2016 02:00
@GMiller64 Its working preety fine but it will be better looking if you change design. Cong :+1:
@GMiller64 Only if you are into design thing :) otherwise your code is just working well :)
Trommelochse
@Trommelochse
Sep 21 2016 02:03
@Robinsond7691 did you quickAdd jQuery as a library???
Florencia
@flopywood
Sep 21 2016 02:03
@GMiller64 it looks great and the functionality is great too! congrats!!
Trommelochse
@Trommelochse
Sep 21 2016 02:03
I don't think you did :/
Robinsond7691
@Robinsond7691
Sep 21 2016 02:04
@Trommelochse No! I wasn't aware of that, I didn't see it in the lesson -_-
how do I do that?
Trommelochse
@Trommelochse
Sep 21 2016 02:04
@Robinsond7691 yeah, that was the issue... just click the options button in the JS tab @codepen and add jQuery
the smoll Cog, left upper corner of the JS part
Robinsond7691
@Robinsond7691
Sep 21 2016 02:04
ok let me see
George Miller
@GMiller64
Sep 21 2016 02:05
@Robinsond7691 your JS is going to a class that doesn't exist. Try pointing to an ID and use .text insteat of .html and see if that works better.
Robinsond7691
@Robinsond7691
Sep 21 2016 02:05
@Trommelochse yeah that was the problem! Thanks a lot for the help.
Trommelochse
@Trommelochse
Sep 21 2016 02:05
@GMiller64 not true, the missing jQuery library is the issue, everything works fine if he adds it
yw @Robinsond7691
Robinsond7691
@Robinsond7691
Sep 21 2016 02:06
@GMiller64 Thanks for the attention though, George
George Miller
@GMiller64
Sep 21 2016 02:07
@Kashyap-pandya I'm not very artsy (?) that's something I struggle with quite a bit and need a lot more practice at..
@Trommelochse ah, I didn't scroll up far enough to see that he didn't have the JS library scripted.
@Robinsond7691 well? did it work after you added the JS library?
Robinsond7691
@Robinsond7691
Sep 21 2016 02:09
@GMiller64 Yeah, thanks
Salomon
@zarruk
Sep 21 2016 02:18
So I've been trying that the tweet button makes the quote to be contained within the tweet but haven't been able to. Any Ideas?
https://codepen.io/zarruk/pen/jrrbAB
Kashyap Pandya
@Kashyap-pandya
Sep 21 2016 02:22
@GMiller64 yes i can understand. Same here :worried: !
Trommelochse
@Trommelochse
Sep 21 2016 02:23
@zarruk this basically lets you tweet stuff via a simple link
all you need to do is to pull your quote to a variable and put it into the link after '?text='
feel free to check my code
Robinsond7691
@Robinsond7691
Sep 21 2016 02:28
@Trommelochse I liked that John Carmack quote, basically sums me up haha Great design btw
Salomon
@zarruk
Sep 21 2016 02:30
@Trommelochse and how do i put it after "?text=" ?
it just takes it as text, you know what i mean?
George Miller
@GMiller64
Sep 21 2016 02:30
going to be starting the weather challenge soon. What API is everyone using to get the weather information?
Trommelochse
@Trommelochse
Sep 21 2016 02:30
@Robinsond7691 which John Carmack quote, using an API, don't know all of them by heart :D
@zarruk you basically need to tell you anchor element that it's href attribute has to be 'https://twitter.com/intent/tweet?text=' + quoteText
so let'S say your twitter button has the ID 'tweet'
then simply include in your getQuote function
$('#tweet').attr('href', 'https://twitter.com/intent/tweet?text=' + $('#quote').text());
obviously only works, if your quote is in an element with the id 'quote'
George Miller
@GMiller64
Sep 21 2016 02:36
never mind I just saw it in the instructions. I must be more tired than I thought.
Salomon
@zarruk
Sep 21 2016 02:45
@Trommelochse that's very useful, thanks. I don't know how to make the quote have the id "quote". COuld you help me please?
Alexandro Pequeno
@Argestis
Sep 21 2016 04:48
Guys I'm trying to get the URL of Wiki through a JSON object.
But when i do it, is takins the quotes of the string and is not taking me to the url correctly
Does anyone know how to remove the quotes or get the url from a wiki using a json query?
Alexandro Pequeno
@Argestis
Sep 21 2016 05:03
:V got it!
Amit Patel
@AmitP88
Sep 21 2016 06:47
hey guys, I'm using a typewriter effect on my title screen here: https://amitp88.github.io/New-Portfolio/ and I'm trying to figure out how to get the cursor to stop after typing the last character on-screen
I've played around with the css but nothing I tried worked
kirbyedy
@kirbyedy
Sep 21 2016 06:51
why would you do that ? :)
focus on making a good responsive easy to read, pleasant for eye portfolio
that typing thing should be a last thing to implement... if its really neccessary
Amit Patel
@AmitP88
Sep 21 2016 06:53
after looking at different websites I realized I needed more animations so I figured that would be a creative way to go
some people told me they liked it, just that I had to get the cursor to disappear once the last character was typed
kirbyedy
@kirbyedy
Sep 21 2016 06:56
ok
did you use any library for that ?
Amit Patel
@AmitP88
Sep 21 2016 06:56
I used the typewriter css class
looks simple to implement
Amit Patel
@AmitP88
Sep 21 2016 07:04
yeah, I've seen that one. but it didn't have the | cursor so I didn't use it =P
I wanted to show as if it was being typed by a keyboard instead of just appearing from left to right
there you go
with a TypeIt library
Amit Patel
@AmitP88
Sep 21 2016 07:06
perfect, thank you :)
dunno why I didnt come across this one before lol
oh wait so I have to save the typeit library in another file huh?
kirbyedy
@kirbyedy
Sep 21 2016 07:08
no just link it
Amit Patel
@AmitP88
Sep 21 2016 07:08
ah ok
kirbyedy
@kirbyedy
Sep 21 2016 07:09
you need a jquery as well, but I assume you already have it
Amit Patel
@AmitP88
Sep 21 2016 07:09
yeah, had to for bootstrap
kirbyedy
@kirbyedy
Sep 21 2016 07:09
load this script after jquery
Amit Patel
@AmitP88
Sep 21 2016 07:09
gotcha
@kirbyedy thx :)
CamperBot
@camperbot
Sep 21 2016 07:09
amitp88 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1399 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Angela
@Baby007mix
Sep 21 2016 07:46
Hi Everyone, I am on codepen trying to build my tribute page. I just wanted to find out if i need to add code to link to bootstrap?
Virgil Ion
@nelusan
Sep 21 2016 07:59
you have everything you need on codepen
Angela
@Baby007mix
Sep 21 2016 08:00
Thanks guys just figured it out after 45 minutes....duh to me!
William Martinez
@WilliamM1976
Sep 21 2016 08:00
I had to add bootstrap from a cdn because for some reason it wasnt loading from codepen.
Dany Din
@danydin
Sep 21 2016 09:27
This message was deleted
honesty1997
@Honesty1997
Sep 21 2016 09:45
Hello guys need help here
I am working with twitch.tv project now.
var Twitch_broadcasterId = ['.Swifty','.freecodecamp','.Bajheera','.blusewilly_retry',".habathcx", ".RobotCaleb"] this is an array i create.
$(Twitch_broadcasterId[i]).html('');
I think this should work like when i call a object which is also a class name in an array ,I am able to change the thing in the class.
Instead,it seems not work at all.
The work right now.
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:01
https://codepen.io/jesspen/pen/QKGBGy?editors=1000, Suggestions and modification are loved.
Stephen James
@sjames1958gm
Sep 21 2016 10:01
@Honesty1997 Read this link below - one issue is by the time the success callback runs, i has already been incremented past end of the array
http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example
kat-mag
@kat-mag
Sep 21 2016 10:06
@intrnt-sud-b-free Oh, this one looks nice! But I'm not loving the bright-yellow footer, hurts the eyes. And you could make it more responsive by moving the left bar to the top when page is displayed on smaller devices ;)
honesty1997
@Honesty1997
Sep 21 2016 10:09
@sjames1958gm Oh thanks that's the trick! Need some time to read through it
CamperBot
@camperbot
Sep 21 2016 10:09
honesty1997 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3396 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:12
@kat-mag I made col-xs-4 width to fit the right side bar, Thats the reason it is not adjusting ! Any tip to make the left side adjust its height ?
Stephen James
@sjames1958gm
Sep 21 2016 10:13
@Honesty1997 :+1:
Richa
@richa-coder
Sep 21 2016 10:14
@intrnt-sud-b-free ,better use offsets,it will help u avoid such problems.
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:16
I will be on it, thanks @richa-coder
CamperBot
@camperbot
Sep 21 2016 10:16
intrnt-sud-b-free sends brownie points to @richa-coder :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for richa-coder
Richa
@richa-coder
Sep 21 2016 10:21
could not find receiver for richa-coder, why is this error coming?
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:25
thank you @richa-coder
CamperBot
@camperbot
Sep 21 2016 10:25
intrnt-sud-b-free sends brownie points to @richa-coder :sparkles: :thumbsup: :sparkles:
:cookie: 2 | @richa-coder |http://www.freecodecamp.com/richa-coder
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:29
hay @richa-coder
honesty1997
@Honesty1997
Sep 21 2016 10:31
@sjames1958gm I kind of know what happened,but still don't know why....
Richa
@richa-coder
Sep 21 2016 10:32
@intrnt-sud-b-free ,hello
Jaswanth Chadalavada
@intrnt-sud-b-free
Sep 21 2016 10:33
hai
can i adjust the height of coloumn
?
column !
Stephen James
@sjames1958gm
Sep 21 2016 10:40
@Honesty1997 When you have callback functions like that in a loop they all share the same i variable.
Since they are asynchronous and happen in the future by the time they run i has already be incremented to the end of the loop and is array.length
honesty1997
@Honesty1997
Sep 21 2016 10:51
So it means the loop and the function inside work asynchronously?
When the function still ready to run,the loop outside have run i to the array.length?
grantknaver
@grantknaver
Sep 21 2016 11:18
I have been trying to get this collapsible bootstrap navbar to work for awhile now maybe someone can help me
anyone awake at this hour?
deepakSpatil
@deepakSpatil
Sep 21 2016 11:21

can any one help me to convert the below array of JSON

    [{"day1":10,"day2":154,"day3":24,"day4":48,"day5":154,"day6":48,"day7":154,"name":"Packet"}],
    [{"day1":10,"day2":154,"day3":24,"day4":48,"day5":154,"day6":48,"day7":154,"name":"car"}],
]

into

    {"name":"Packet","date":"Day1","value":10},
    {"name":"Packet","date":"Day2","value":154},
    {"name":"Packet","date":"Day3","value":24},
    {"name":"Packet","date":"Day4","value":48},
    {"name":"Packet","date":"Day5","value":154},
    {"name":"Packet","date":"Day6","value":48},
    {"name":"Packet","date":"Day7","value":154},

    {"name":"car","date":"Day1","value":10},
    {"name":"car","date":"Day2","value":154},
    {"name":"car","date":"Day3","value":24},
    {"name":"car","date":"Day4","value":48},
    {"name":"car","date":"Day5","value":154},
    {"name":"car","date":"Day6","value":48},
    {"name":"car","date":"Day7","value":154},

]
Ken Haduch
@khaduch
Sep 21 2016 11:21
@grantknaver - what's up? Did you add jquery.js and bootstrap.js to your JS external files (if you're on CodePen) they have to be in that order.
@grantknaver - post a link to your code if you already have those in there...
msnr
@msnr
Sep 21 2016 11:23
somebody here who can answer me a react router question?
kirbyedy
@kirbyedy
Sep 21 2016 11:23
@grantknaver jquery and bootstrap are missing
grantknaver
@grantknaver
Sep 21 2016 11:23
The nav collapses but when you shrink the window the button wont dropdrop the content
kirbyedy
@kirbyedy
Sep 21 2016 11:24
@grantknaver :point_up: September 21, 2016 2:23 PM
grantknaver
@grantknaver
Sep 21 2016 11:25
It says there is bootstrap
kirbyedy
@kirbyedy
Sep 21 2016 11:26
nope
bootstrap.js
not bootstrap.css
and you need jquery to load before bootstrap
grantknaver
@grantknaver
Sep 21 2016 11:27
You are freaking awesome
thank you thank you thank you
I knew the damn code was right
makes sense. you have to do that in an outside coder
There should be a way to reward you guys for your help
Ken Haduch
@khaduch
Sep 21 2016 11:40
@grantknaver - there is, at least in a free code camp way - just put the person's name with @ and their name, and say "thanks"
@grantknaver - if you put the word thanks without the quotes, it gives "brownie points", which is a way to show a person is participating by doing challenges or helping others with answers to questions.
CamperBot
@camperbot
Sep 21 2016 11:43
khaduch sends brownie points to @grantknaver :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for grantknaver
Marcin Kluska
@marcinkluska
Sep 21 2016 11:47

Hello i have problem with Build a Random Quote Machine and post on twitter.

'''function randomQuote(){
$.getJSON( "https://api.icndb.com/jokes/random", function( json ) {
var item = "";
$.each( json, function(key, val) {
item = val.joke;
});
$("#text").html(item);

    $("#twitter").attr("data-text", item);
});  

}

$(document).ready(function() {
randomQuote();
$('#newQuote').on('click', randomQuote);
var item = ""
$('#twitter').click(function (e) {
var twtLink = 'http://twitter.com/home?status=' +encodeURIComponent(item);
window.open(twtLink,'_blank');
});
});
'''
My code take random joke about Chuck Norris and i dont know how to post it on twitter. Please help me

zeddyouj
@zeddyouj
Sep 21 2016 11:51
hello, i have been wondering how to move the list's bullet to the center of the page. I tried adding "text-center" class but it doesn't move the bullet to the center
Marcin Kluska
@marcinkluska
Sep 21 2016 11:55

Hello i have problem with Build a Random Quote Machine and post on twitter.

'''function randomQuote(){
$.getJSON( "https://api.icndb.com/jokes/random", function( json ) {
var item = "";
$.each( json, function(key, val) {
item = val.joke;
});
$("#text").html(item);

    $("#twitter").attr("data-text", item);
});  

}

$(document).ready(function() {
randomQuote();
$('#newQuote').on('click', randomQuote);
var item = ""
$('#twitter').click(function (e) {
var twtLink = 'http://twitter.com/home?status=' +encodeURIComponent(item);
window.open(twtLink,'_blank');
});
});
'''
My code take random joke about Chuck Norris and i dont know how to post it on twitter. Please help me

zeddyouj
@zeddyouj
Sep 21 2016 12:27
@glgirl28 thanks!
CamperBot
@camperbot
Sep 21 2016 12:27
zeddyouj sends brownie points to @glgirl28 :sparkles: :thumbsup: :sparkles:
:cookie: 341 | @glgirl28 |http://www.freecodecamp.com/glgirl28
Michael Bomholt
@bomholtm
Sep 21 2016 12:42
how do i align a text inside a absolute div
text-align isnt working anymore because of position absolute
is there a common fix for that?
vínαч puppαl
@vinaypuppal
Sep 21 2016 12:54
@bomholt hey hi what exactly are you trying to achieve??
@bomholt did you try width: 100% along with text-align: center on that div ??
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 12:57
anyone know what is happening with twitch API looks like its nt working
Stephen James
@sjames1958gm
Sep 21 2016 12:58
@caa1982 A recent change requires a client_id to access the API have you gotten your client_id
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 12:58
ok tks
Sorin Ruse
@sorinr
Sep 21 2016 13:01
@bomholt you can try flex
Michael Bomholt
@bomholtm
Sep 21 2016 13:03
@vinaypuppal haha yea already found that width: 100% is going to fix it on stackoverflow
@vinaypuppal @sorinr thanks
CamperBot
@camperbot
Sep 21 2016 13:03
bomholt sends brownie points to @vinaypuppal and @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 555 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
:cookie: 718 | @sorinr |http://www.freecodecamp.com/sorinr
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:04
:smile: @bomholt
Michael Bomholt
@bomholtm
Sep 21 2016 13:04
@vinaypuppal i think you send me some js thingy for touch events
Sorin Ruse
@sorinr
Sep 21 2016 13:05
@bomholt welcome
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:05
@bomholt yes its http://hammerjs.github.io/
Michael Bomholt
@bomholtm
Sep 21 2016 13:07
@vinaypuppal does is require jquery?
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:08
@bomholt no
Marcin Kluska
@marcinkluska
Sep 21 2016 13:08

Hello i have problem with Build a Random Quote Machine and post on twitter.

'''function randomQuote(){
$.getJSON( "https://api.icndb.com/jokes/random", function( json ) {
var item = "";
$.each( json, function(key, val) {
item = val.joke;
});
$("#text").html(item);

    $("#twitter").attr("data-text", item);
});  

}

$(document).ready(function() {
randomQuote();
$('#newQuote').on('click', randomQuote);
var item = ""
$('#twitter').click(function (e) {
var twtLink = 'http://twitter.com/home?status=' +encodeURIComponent(item);
window.open(twtLink,'_blank');
});
});
'''
My code take random joke about Chuck Norris and i dont know how to post it on twitter. Please help me

vínαч puppαl
@vinaypuppal
Sep 21 2016 13:09
@bomholt it does not have any dependencies you can read here http://hammerjs.github.io/getting-started/
Michael Bomholt
@bomholtm
Sep 21 2016 13:09
@vinaypuppal okay thanks i will look into that when i finished the stuff im currently working on =)
CamperBot
@camperbot
Sep 21 2016 13:09
bomholt sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: bomholt already gave vinaypuppal points
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:09
:+1: @bomholt
Michael Bomholt
@bomholtm
Sep 21 2016 13:09
@vinaypuppal yea just pulled up that page =)
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:10
@marcinkluska use this URL
http://twitter.com/share?text=encodeURIComponent(your quote and author)
instead of
'http://twitter.com/home?status=' +encodeURIComponent(item);
Brandon
@chunb
Sep 21 2016 13:14
I'm doing the "Build a Personal Portfolio Webpage" challenge on Free Code Camp. I'm running into a couple issues:
  1. The URLs for my LinkedIn and GitHub that I put into my webpage lead me to a blank screen. But, the links for other websites like Wikipedia work.
Michael Bomholt
@bomholtm
Sep 21 2016 13:15
@chunb can you post the pen?
Brandon
@chunb
Sep 21 2016 13:16
  1. I'm trying to upload a screenshot of my tribute page codepen onto my webpage from my local computer. This is the code I use: <img class="img-responsive" src=""C:\Users\chunb\Pictures\website thumbnail.JPG"" alt="image failed to load">
Marcin Kluska
@marcinkluska
Sep 21 2016 13:17
@vinaypuppal don't work can u look on my code https://codepen.io/marcinkl1987/pen/ozzwOv?editors=0010
Brandon
@chunb
Sep 21 2016 13:18
@bomholt here's the code I'm using to link to my linkedin: <a href='https://www.linkedin.com/in/brandon-chun-755896104'> <button class="btn"> LinkedIn </button> </a> github is identical but with a different URL
Rimi.
@Codevotee
Sep 21 2016 13:20
@chunb you need to upload the image to a site then copy the link and set it as the img source
@chunb Codepen doesnt read paths from the PC
@bomholt when ur making buttons with urls, you have to add target = "_blank" after the href attribute because Codepen doesnt open urls
Brandon
@chunb
Sep 21 2016 13:22
@APRim05 Makes sense. I have a Flickr. Do you know what URL would work for CodePen on Flickr?
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:22
@marcinkluska First I see your quotes are not loading
even your API https://api.icndb.com/jokes/random is not working in browser
Rimi.
@Codevotee
Sep 21 2016 13:23
@chunb idk
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:23
@chunb yes you can even save your images in dropbox and use those URLs or use cloud service like http://cloudinary.com
kirbyedy
@kirbyedy
Sep 21 2016 13:24
@vinaypuppal the api works
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:25

@kirbyedy oh but in my browser i see

Service Unavailable
The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.

kirbyedy
@kirbyedy
Sep 21 2016 13:25
Screen Shot 2016-09-21 at 16.25.09.png
Brandon
@chunb
Sep 21 2016 13:25
@APRim05 CodePen does open URLs. This works: <a href='https://en.wikipedia.org/wiki/Mechatronics'> Mechatronics </a>
Marcin Kluska
@marcinkluska
Sep 21 2016 13:26
@vinaypuppal In Browser i have { "type": "success", "value": { "id": 270, "joke": "The phrase 'dead ringer' refers to someone who sits behind Chuck Norris in a movie theater and forgets to turn their cell phone off.", "categories": [] } }
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:26
blob
Gordon
@gordoh
Sep 21 2016 13:27
@marcinkluska "https://twitter.com/intent/tweet?text=" <---This link might work better for your tweet button
Rimi.
@Codevotee
Sep 21 2016 13:27
@chunb oh nice, didnt know that
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:27

@marcinkluska try this it will work

@marcinkluska use this URL
http://twitter.com/share?text=encodeURIComponent(your quote and author)
instead of
'http://twitter.com/home?status=' +encodeURIComponent(item);

lackodan
@lackodan
Sep 21 2016 13:27
Are there any AngularJS (1) developers here? Could use some help.
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:29
@marcinkluska in you code use above link like this
var twtLink = 'http://twitter.com/share?text=' +encodeURIComponent(item);
Marcin Kluska
@marcinkluska
Sep 21 2016 13:30
@vinaypuppal yes
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:31

@marcinkluska so did it work becoz i cant test as i am not able load quotes
if it does not work try below one as @gordoh suggested

"https://twitter.com/intent/tweet?text=" <---This link might work better for your tweet button

Marcin Kluska
@marcinkluska
Sep 21 2016 13:32
@vinaypuppal dont work i check it
kirbyedy
@kirbyedy
Sep 21 2016 13:33
$("#tweet").on("click", function() {
    window.open("http://twitter.com/home/?status=" + $("#quote").text());
  });
this is an example code that works for me
vínαч puppαl
@vinaypuppal
Sep 21 2016 13:33
@marcinkluska oh now i see you dont have access to item variable
just define var item; at top of your all code
or above @kirbyedy code will also work
Marcin Kluska
@marcinkluska
Sep 21 2016 13:35
@vinaypuppal it works :):):) thanks for help :)
CamperBot
@camperbot
Sep 21 2016 13:35
marcinkluska sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 556 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Gordon
@gordoh
Sep 21 2016 13:42
@marcinkluska You might wanna use if statements to make sure that your quote is under 140 characters else substring it to ...
It will cause problems if your quote is too big. Your user wont be able to tweet it
hes probably gone lol...
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 14:01
now that I finished the front end certificate should I go for the data visualization or back end? seems like visualization is not finish bulding...
Takács Ádám
@AdamTakacs05
Sep 21 2016 14:09
Hi everyone! If anyone has a minute to help that'd be great! I'm doing the Show Local Weather challange, I started it in Microsoft Edge (shame on me) in codepen and it works as expected I mean the partial elements like console log...but now that I opened it in chrome the scrpit doesn't want to run not even the console.log! Anyone has any idea why can that be?
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 14:24
this c9.io is evil... I don't have credit card! I just don't like CC... is their any other solution?
vínαч puppαl
@vinaypuppal
Sep 21 2016 14:25
@caa1982 yes u can try https://hyperdev.com/about/ for Backend projects
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 14:25
@vinaypuppal tks will look at it
Cyril Alvarez Adriaansen
@caa1982
Sep 21 2016 14:49
ok after reading this FreeCodeCamp/FreeCodeCamp#9826
looks like freecodecamp is moving to hyperdev so I will us it
Michael Bomholt
@bomholtm
Sep 21 2016 15:01
@caa1982 c9.io requieres a credit card?
What happens to existing accounts?
nabzster
@nabzster
Sep 21 2016 15:10
http://codepen.io/nabzster/pen/rrWjGz Guys, how can i make the image go from the left side (bottom of the about text) to the right side of the about text?
Michael Bomholt
@bomholtm
Sep 21 2016 15:14
@chunb hey sorry i was afk and my gitter didnt notified me somehow.. seems you got it working?
Jason Luboff
@JLuboff
Sep 21 2016 15:29
@nabzster One way would be to use Bootstraps built in grid system
RomualdasT
@RomualdasT
Sep 21 2016 15:35
Hello friends. Anyone have problems with openwearherapi these days? I don't know if my program somehow broke or problem is with API.
Jason Luboff
@JLuboff
Sep 21 2016 15:35
@nabzster There is also a built in method with Bootstrap if you wanted the image to be on the right and inline with the text...I just can't remember what its called right now..
RomualdasT
@RomualdasT
Sep 21 2016 15:35
Can some1 open my app and say is it working on their city?
Jason Luboff
@JLuboff
Sep 21 2016 15:36
@RomualdasT It looks like your openweather api call is failing. The ip-api is working though
RomualdasT
@RomualdasT
Sep 21 2016 15:38
@JLuboff you sure ip-api works?
Jason Luboff
@JLuboff
Sep 21 2016 15:39
@RomualdasT Ya, I checked with console.log(data); underneath the ip-api call
@RomualdasT It looks like openweather api is currently down
I just tried mine, and I am getting the same failure
RomualdasT
@RomualdasT
Sep 21 2016 15:41
@JLuboff But for example I call $("#data").html(city) (city from ip-api); to print in html and I receive nothing...
@JLuboff Well thank You, I wanted to show this app for people who may someday hire me and now it is sadly not working and I can't even find out problem :D
CamperBot
@camperbot
Sep 21 2016 15:42
romualdast sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 372 | @jluboff |http://www.freecodecamp.com/jluboff
Jason Luboff
@JLuboff
Sep 21 2016 15:42
Well the secondary issue is you need to change your link to http instead of https
RomualdasT
@RomualdasT
Sep 21 2016 15:44
Whoa, thank you , man (y) How you found out that? :D
Everything works fine now :D
Jason Luboff
@JLuboff
Sep 21 2016 15:45
I ran into the same issue when I worked on this project. The problem is, the openweather api and ip-api both run over http, they can't accept https (thus secure) calls.
You'd have to prepend a crossorigin url to both to run over https (such as https://crossorigin.me)
Basically one of those wierd little things with the internet lol
RomualdasT
@RomualdasT
Sep 21 2016 15:46
@JLuboff lol, thank You again :D
CamperBot
@camperbot
Sep 21 2016 15:46
romualdast sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:warning: romualdast already gave jluboff points
Nicole Horn
@N1CKL3
Sep 21 2016 16:08
@glgirl28 Thanks!
CamperBot
@camperbot
Sep 21 2016 16:08
n1ckl3 sends brownie points to @glgirl28 :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @glgirl28 |http://www.freecodecamp.com/glgirl28
Safbek
@safbek
Sep 21 2016 16:15
how can I make this form with flexbox without the use of the Flex-basis? Maybe better to just set the width and height without using flexbox
http://www.pixic.ru/i/O09103E166P5C4g6.png
coldboy
@coldboy
Sep 21 2016 16:16
@camperbot he is a robot?
Jason Luboff
@JLuboff
Sep 21 2016 16:21
@coldboy Yes
nabzster
@nabzster
Sep 21 2016 16:32
@JLuboff ahhh aaaa thanks man
CamperBot
@camperbot
Sep 21 2016 16:32
nabzster sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 374 | @jluboff |http://www.freecodecamp.com/jluboff
Stephen Suratos
@stephenfs
Sep 21 2016 16:58
Any front end pros here?
I have a general question.
Jason Luboff
@JLuboff
Sep 21 2016 17:01
While I'm not a pro, I'll at least look at the question :)
Stephen Suratos
@stephenfs
Sep 21 2016 17:04

Its more about work flow..

How often do front end designers code html/css without using any framework but build everything from scratch..

and accomodate for all screen sizes.
is it more common to use a framework like Bootstrap? I would love to know the percentage… in general sense.
I know a lot of designers start with a framework and they hack it as needed.
Jason Luboff
@JLuboff
Sep 21 2016 17:05
Ah...ya..I don't know the answer to that :( I would venture to say that most use a framework though. Why reinvite the wheel when you don't have to? I would think most would use frameworks, and modify as needed
Stephen Suratos
@stephenfs
Sep 21 2016 17:06
yep. Thats what I thought. And this is good news for newbies like a lot of us here.
I know a good chunk of HTML and CSS but its a relief to know I dont have to build everything from scratch.
Jason Luboff
@JLuboff
Sep 21 2016 17:07
Ya I know a bit of HTML/CSS...but when I discovered Bootstrap..it made life so much easier
Stephen Suratos
@stephenfs
Sep 21 2016 17:07
for sure.
for me, adding that with css processor like SASS is powerful.
Spartano
@Spartano
Sep 21 2016 17:08
Hello, i have writen an tutorial about the Dungeon React Challenge. This is my article https://medium.com/@victorcatalintorac/react-redux-dungeon-crawler-7b52e67806bd#.8ouxkx7t0 Any feedback is greatly apreciated.
Jason Luboff
@JLuboff
Sep 21 2016 17:08
I went through the Codecademy SASS lessons...I can definitely see how powerful it can be, but haven't had a chance to use/practice it
Stephen Suratos
@stephenfs
Sep 21 2016 17:10

I use it in my codeine projects. Its awesome!

http://codepen.io/ssuratosjr/pen/JRRAWJ

codepen**
It forced me to write clean code and be organized.
Jason Luboff
@JLuboff
Sep 21 2016 17:12
Ya definitely looks better then my code haha
Stephen Suratos
@stephenfs
Sep 21 2016 17:14
haha
Nicole Horn
@N1CKL3
Sep 21 2016 17:19
How would you make an unordered/ordered list where you have a heading at the top, indented bullets, and bullets that were further indented. For example, Cats as the heading. Domestic indented bullet. Short-hair, Medium-hair,Long-hair double indented. I'm just curious so I can store it in my head for later if I need it.
Would you just make different CSS with different padding and apply them as needed?
Salomon
@zarruk
Sep 21 2016 17:21
Hello. Can someone help me: how can I make the Tweet button to redirect me to its href attribute?
https://codepen.io/zarruk/pen/jrrbAB?editors=1010
Stephen Suratos
@stephenfs
Sep 21 2016 17:32
@N1CKL3
<p>Cats</p>
<ul>
  <li> <!— First level li —>
    Domestic
    <ul> <!— second level li —>
      <li>Short-hair</li>
      <li>Medium-hair</li>
      <li>Long-hair</li>
    </ul>
  </li>
</ul>
the second tier li’s are nested in a first level li… if that makes sense.
Nicole Horn
@N1CKL3
Sep 21 2016 17:37
@SteveAmaki OOOH. That looks so clean. Makes sense too, thanks Steve! You always help me out!
CamperBot
@camperbot
Sep 21 2016 17:37
n1ckl3 sends brownie points to @steveamaki :sparkles: :thumbsup: :sparkles:
:cookie: 184 | @steveamaki |http://www.freecodecamp.com/steveamaki
Stephen Suratos
@stephenfs
Sep 21 2016 17:38
haha.. thanks and you’re welcome . I like helping out while learning at the same time. :)
Nicole Horn
@N1CKL3
Sep 21 2016 17:41
@SteveAmaki I try to help out where I can lol, but the help is always greatly appreciated
Jason Luboff
@JLuboff
Sep 21 2016 17:52
sweet gif
Stephen Suratos
@stephenfs
Sep 21 2016 17:54
haha. Thanks @JLuboff . I have a lot more and Im not afraid to use them.
CamperBot
@camperbot
Sep 21 2016 17:54
steveamaki sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 375 | @jluboff |http://www.freecodecamp.com/jluboff
Mauricia Goods
@FullStack-Sponge
Sep 21 2016 18:06
Hello World!
CamperBot
@camperbot
Sep 21 2016 18:06

welcome to FreeCodeCamp @FullStack-Sponge!

Jason Luboff
@JLuboff
Sep 21 2016 18:11
Hello
Stephen Suratos
@stephenfs
Sep 21 2016 18:14
Hi there.
Stuart Taylor
@Bouncey
Sep 21 2016 18:34
Hey guys, I need a pointer for the tic-tac-toe challenge. I have the computer playing random squares and I have read up on the minimax algorithm, but I have no idea how to implement it
Nicole Horn
@N1CKL3
Sep 21 2016 19:58
So I'm ALMOST done with my tribute page but I ran into another speedbump. My containers are spaced really far a part from each other. What would cause that? Can I fix it by making a CSS adjusting the margins?
vínαч puppαl
@vinaypuppal
Sep 21 2016 20:01
@N1CKL3 yes you can adjust the margins but can you provide link to your pen so i can see whats causing that issue
Nicole Horn
@N1CKL3
Sep 21 2016 20:02
vínαч puppαl
@vinaypuppal
Sep 21 2016 20:05

@N1CKL3 this CSS is causing that issue

.bullets {
    padding: 5em;
}

if you want some spacing you could try

.bullets {
    padding: 30px; 
}
Nicole Horn
@N1CKL3
Sep 21 2016 20:07
@vinaypuppal I forgot I still had that applied. I thought I had taken it out...That would explain the ridiculously large gaps. Thank you!
CamperBot
@camperbot
Sep 21 2016 20:07
n1ckl3 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 557 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Sep 21 2016 20:09
@N1CKL3 welcome :smile: . some suggestion there is a unused li tag on line 80 you can remove it and some div tags are not closed properly , you can find them easily since codepen is highlighting them.
Nicole Horn
@N1CKL3
Sep 21 2016 20:11
@vinaypuppal Okay thank you. I'm still working on the project so I'm about to use the li tag lol. I will have to go back and check my div elements though.
CamperBot
@camperbot
Sep 21 2016 20:11
n1ckl3 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: n1ckl3 already gave vinaypuppal points
Nicole Horn
@N1CKL3
Sep 21 2016 20:16
@vinaypuppal I don't see the highlights anywhere.
Kevin Angga
@KevinAngga
Sep 21 2016 20:20
why the example of intermediate frontend development project so cool = ='
Nicole Horn
@N1CKL3
Sep 21 2016 20:23
@KevinAngga ?
@KevinAngga What are you referring to?
Kevin Angga
@KevinAngga
Sep 21 2016 20:24
@N1CKL3 just wondering did u guys make it as near as the example or just follow the user story?
Nicole Horn
@N1CKL3
Sep 21 2016 20:28
@KevinAngga The tribute project said to try and get as close as you can to the example project. Some of the stuff I did I went and looked up myself. Other stuff I looked at the coding of the example if I didn't know how to form it into a google search, such as the gray bar down the center of the page. Doing the project I realized there are a lot of different ways you can get the same result. Don't worry too much about it as long as the techniques are there, such as the heading element, sub-heading element, bulleted list, etc., and make sure you have fun with it.
@KevinAngga I have spent the past 2 days working on this. I started coding on the 15th of this month with no prior coding experience and that is what I am able to make already. Really fun, challenging, and rewarding but you have to be willing to put in the work and effort, which I'm sure you are :3
Rimi.
@Codevotee
Sep 21 2016 20:31
@N1CKL3 The grey thing down the middle aka thumbnail was mentioned in the intro video
Nicole Horn
@N1CKL3
Sep 21 2016 20:32
@APRim05 I have it as the jumbotron class. I just added it in now.
Kevin Angga
@KevinAngga
Sep 21 2016 20:33
@N1CKL3 goodluck for us! haha xD
Nicole Horn
@N1CKL3
Sep 21 2016 20:34
@APRim05 The thumbnail refers to the photo and the caption. There is a white border around it which is the thumbnail.
Juwdohr
@Juwdohr
Sep 21 2016 20:44

Hey having an issue with the Twitch.TV Viewer:

tempUserInfo.streaming = (data.stream !== null);
            if (tempUserInfo.streaming) {
              tempUserInfo.viewers = data.stream[0].viewers;
              tempUserInfo.preview = data.stream[0].preview.large;
            }

Getting error on the data.stream[0].viewers. I have also tried it without the [0]

Tyler Moeller
@TylerMoeller
Sep 21 2016 20:53
@Juwdohr You need to specify a client ID for Twitch.tv now. https://blog.twitch.tv/client-id-required-for-kraken-api-calls-afbb8e95f843
Do a console.log(data) and you'll see errors in your console like this:
Object {
  error: "Bad Request",
  message: "No client id specified",
  status: 400
}
Harry Adel
@harryadel
Sep 21 2016 21:32
Anybody here who knows React? I'm stuck on the markdown project
Igor Amidzic
@igoramidzic
Sep 21 2016 21:36
Can someone help me with my jQuery?
When I click on the box, it should make say "Hello" next to it:
http://codepen.io/amidzicigor/pen/NRdPXa
Harry Adel
@harryadel
Sep 21 2016 21:38
@amidzicigor There's no such thing called onclick
just click
There're some issues with practisejs, it's not working
I'm getting 404 not found in my console
Igor Amidzic
@igoramidzic
Sep 21 2016 21:40
@Harry97 Hmm.. what does that mean?
Harry Adel
@harryadel
Sep 21 2016 21:41
@amidzicigor You can add whichever libraries you want using settings tab then navigating to js or css as you want
It means it's getting nothing
you gotta fetch it correctly
ok, no erros now, and I went ahead and added jquery for you http://s.codepen.io/Hadouken/debug/dpNPZo
although when I click the box it disappears btw
@amidzicigor now it's working fine http://s.codepen.io/Hadouken/pen/dpNPZo
Igor Amidzic
@igoramidzic
Sep 21 2016 21:44
@Harry97 ah okay, thank you
CamperBot
@camperbot
Sep 21 2016 21:44
amidzicigor sends brownie points to @harry97 :sparkles: :thumbsup: :sparkles:
:cookie: 252 | @harry97 |http://www.freecodecamp.com/harry97
Igor Amidzic
@igoramidzic
Sep 21 2016 21:44
@amidzicigor :+1: :shipit:
JD Tadlock
@jdtdesigns
Sep 21 2016 21:45
@amidzicigor You don't put html/head/body elements in your html on codepen. Also, it's .click() and .append() http://codepen.io/jdtadlock/pen/bwgNxY
Harry Adel
@harryadel
Sep 21 2016 21:45
cheers, m8
@jdtdesigns I don't mean to be a dick, but do you happen to know React?
JD Tadlock
@jdtdesigns
Sep 21 2016 21:46
@Harry97 not much, but what's the issue?
Harry Adel
@harryadel
Sep 21 2016 21:47
How can I access change method from Displayarea class and output it to a div?
http://codepen.io/Hadouken/pen/PGGgjj?editors=1010
I'm fairly new to react, so I'm still trying to get the hang of it
ivanposavec
@ivanposavec
Sep 21 2016 21:54
can someone help me with col- push and col-pull? i have this website: http://www.oblizeki-satovic.hr/ , and there are on desktops two columns, one with text, and one with rounded picture. i want this on desktops: two rows, in first row text first then picture, in second row, first picture then text. BUT, when you look at site on mobilephone and tablets, i want that, there is not rows, just one column and: text, picture, text, picture etc. Can someone help me please?
JD Tadlock
@jdtdesigns
Sep 21 2016 21:55
@Harry97 Looks like there's a couple ways. Using ref to return a callback that's accessible or by chaining a method to the previous class
var Hello = React.createClass({
    displayName: 'Hello',
    statics: {
        alertMessage: function () {
            alert('static message');
        }
    },
    alertMessage: function () {
        alert(this.props.name);
    },

    render: function () {
        return React.createElement("div", null, "Hello ", this.props.name);
    }
});

var HelloElement = React.createElement(Hello, {
    name: "World"
});
Harry Adel
@harryadel
Sep 21 2016 21:58
@jdtdesigns Thanks a lot :+1:
CamperBot
@camperbot
Sep 21 2016 21:58
:cookie: 598 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
harry97 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
Nicole Horn
@N1CKL3
Sep 21 2016 22:13
Just finished my Codepen Tribute Page :smile: http://codepen.io/n_horn/full/xEgGxG/
Sarah Chima
@sayrah901
Sep 21 2016 22:36
This message was deleted
Sarah Chima
@sayrah901
Sep 21 2016 22:43
Please how can I change the text of my tweet button to make it tweet the new quote. I'll highly appreciate any help. Here is my code. https://codepen.io/sayrah901/pen/ozjamg
greg
@wearenotgroot
Sep 21 2016 22:45
@sayrah901 you need to remove the previous button and then create a new one with the updated text ----->https://dev.twitter.com/web/tweet-button/javascript-create
an alternative is to use your own tweet button and change the href
Sarah Chima
@sayrah901
Sep 21 2016 22:47
what do I change the href to? @wearenotgroot
greg
@wearenotgroot
Sep 21 2016 22:48
@sayrah901 something like
href = 'https://twitter.com/intent/tweet?text='+quote
Sarah Chima
@sayrah901
Sep 21 2016 22:55
I've tried that before. Nothing seems to be working. If you can click on the link and view my pen, you'll notice that the tweet button next to the "new Quote" includes the text of the message displayed initially. The major challenge here is to be able to set the text part of the js twitter code to be able to tweet the new quotes that are displayed in the message part.
greg
@wearenotgroot
Sep 21 2016 23:04

@sayrah901 try this

 var quote = "";

 $(document).ready(function() {
   $("#btnNewQuote").on("click", function() {
     // Only change code below this line.

     /*$.getJSON("https://crossorigin.me/http://quotes.rest/quote.json", function(json){
            $(".message").html(json);
          });*/
     $.ajax({
       url: ' https://crossorigin.me/http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?',
       dataType: 'json',
       type: 'get',
       cache: false,
       success: function(data) {
         /* var items = [];
         $.each(data, function (key, val){
           items.push(Object.keys(data));
         });   */
         quote = data.quoteText;
         $("#randomQuote").html(data.quoteText);
         $("#quoteAuthor").html(data.quoteAuthor);
         // $("randomQuote").inner
         //});

         //randomQuote.innerHTML = randomQuote.html(data.quoteText);
         $("#tweet").empty();     //<--------remove child, previous button
         twttr.widgets.createShareButton(
           "https://codepen.io/sayrah901/pen/ozjamg",
           document.getElementById("tweet"), {
             size: "large",
             via: "Sparkles901",
             related: "twitterapi,twitter",
             text: quote,
             hashtags: "quote"
           }
         );
       },

     });

   });

 });

and on html

<body>
  <div class="container text-center spacing milk-body">
    <h3 class="text-center yellowColor"> Random Quote</h3>
    <div class="well">
      <div id="randomQuote" class=" message text-center">The text goes here
      </div>
      <div id="quoteAuthor" class="text-right">
      </div>
    </div>


    <div class="row">


    </div>
    <div class="col-md-1">

      <div id="tweet" class="col-md-1">
        <a class="twitter-share-button" href='https://twitter.com/intent/tweet?text='>
Tweet</a>
      </div>
    </div>
    <div class="col-md-1">
      <button id="btnNewQuote" class="btn  yellowColor"> New Quote</button>

    </div>


  </div>
  </div>


  </div>
</body>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
Sarah Chima
@sayrah901
Sep 21 2016 23:11
wow.. It worked. thanks a lot @wearenotgroot What exactly did u change?
CamperBot
@camperbot
Sep 21 2016 23:11
sayrah901 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1784 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Sep 21 2016 23:11
@sayrah901 i move the tweet button in that container
@sayrah901 and the code to remove the previous child and the creation of the new tweet button inside the callback(since $.ajax is asynchronous it needs to happen in that callback otherwise the text wont update)
Sarah Chima
@sayrah901
Sep 21 2016 23:16
thank u
greg
@wearenotgroot
Sep 21 2016 23:16
@sayrah901 :+1:
Angela
@Baby007mix
Sep 21 2016 23:23
I need HELP. I just cant understand why my images wont centre. Any ideas ?
http://codepen.io/baby007mix/pen/QKGqjz?editors=1100
Salomon
@zarruk
Sep 21 2016 23:29
Can anybody help me please: why is the #weather_widget not displaying the object I'm importing?
https://codepen.io/zarruk/pen/dpNyOj
Brady
@soccer99
Sep 21 2016 23:38
@zarruk I know certain browsers (Chrome) block the browser’s default geolocation by default
in my case its blocking it so the latitude and longitude variables are null, causing the weather api call to fail
Salomon
@zarruk
Sep 21 2016 23:40
@soccer99 I already tried it with Safari (I allowed my location) and wont work either
Brady
@soccer99
Sep 21 2016 23:40
@Baby007mix add the class center-image to the image class and write this .center-image {
margin: auto;
}
@zarruk I solved by making a call to ip-api.com and getting the location based on IP address rather than browser geolocation, its a more reliable solution
Salomon
@zarruk
Sep 21 2016 23:43
@soccer99 but I think the project is sopposed to be made by browser geolocation, right?
greg
@wearenotgroot
Sep 21 2016 23:44
@zarruk not really, you can use whatever api you want
Brady
@soccer99
Sep 21 2016 23:44
@zarruk "Rule #2: Fulfill the below user stories. Use whichever libraries or APIs you need. Give it your own personal style."
Salomon
@zarruk
Sep 21 2016 23:49
@wearenotgroot @soccer99 Ok, yes, I get it but I want to do it with geolocation as they just taught it to us and shouldn't be that difficult for a rookie like me :) am I right?
Angela
@Baby007mix
Sep 21 2016 23:50
@soccer99 I tried but it did not work. Do I add .center-image {
margin: auto;
} to the CSS section or HTML?
Brady
@soccer99
Sep 21 2016 23:52
Css, then give the img a class of center-image
greg
@wearenotgroot
Sep 21 2016 23:56
@zarruk well the problem with that is, getCurrentPosition(..) will not work on chrome unless the connection is in https. However when you use https, you then get some problem connecting to the openweather api since it only accepts https connection if you pay for a premium api key
Angela
@Baby007mix
Sep 21 2016 23:56
@soccer99 fantastic help. A comma was the problem. Thank you
CamperBot
@camperbot
Sep 21 2016 23:56
baby007mix sends brownie points to @soccer99 :sparkles: :thumbsup: :sparkles:
:cookie: 78 | @soccer99 |http://www.freecodecamp.com/soccer99
greg
@wearenotgroot
Sep 21 2016 23:58
anyways going to catch some :zzz:
GL and Happy Coding everyone :wave: