These are chat archives for FreeCodeCamp/HelpFrontEnd

26th
Jan 2017
Walid Ashri
@walidashri
Jan 26 2017 00:00
@themixedcoder the last class is the dominant one , this is the point of the challenge
themixedcoder
@themixedcoder
Jan 26 2017 00:00
it doesnt work
Walid Ashri
@walidashri
Jan 26 2017 00:01
your code now please
themixedcoder
@themixedcoder
Jan 26 2017 00:02
nevermind
Janina Pohorecki
@janepohorecka
Jan 26 2017 00:25
@jdtdesigns For some reason, the javascript doesn't want to run when I place it into my Atom document
JD Tadlock
@jdtdesigns
Jan 26 2017 00:27
@janepohorecka You'll need to make sure you're including jQuery and also linking to the js file if it's separate
Janina Pohorecki
@janepohorecka
Jan 26 2017 00:27
Even when I type in " $(document).ready(function() {
"
JD Tadlock
@jdtdesigns
Jan 26 2017 00:27
  <script src="https://code.jquery.com/jquery-3.1.0.js"></script>  
  <script src="myjs.js"></script>
</body>
Janina Pohorecki
@janepohorecka
Jan 26 2017 00:27
@jdtdesigns oh, of course :P I know very little but I definately know that!
JD Tadlock
@jdtdesigns
Jan 26 2017 00:28
check out the browser console and see what it says (ctrl shift j)
gstpierre11
@gstpierre11
Jan 26 2017 00:31
Hi - so I'm doing the Local Weather project, and the API suggested doesn't seem to take https - but I have to use https in order to use getcurrentposition. Codepen doesn't seem to like mixing http and https. Any easy way around this? Or should I try a different API?
Tom
@moT01
Jan 26 2017 00:35
@gstpierre11 worked for me, if you care to take a look http://codepen.io/moT01/pen/ZpVOXo
Tyler Moeller
@TylerMoeller
Jan 26 2017 00:42
@gstpierre11 Yeah, the challenge needs to be updated. You should try to support both HTTP and HTTPS, ideally, and that means using a different weather API along with a fallback location API like https://freegeoip.net/json
@moT01 On Chrome, your pen says "Share location to get the local weather."
Tom
@moT01
Jan 26 2017 00:45
no pop up asking if you want to share it?
gstpierre11
@gstpierre11
Jan 26 2017 00:46
Thanks @TylerMoeller
CamperBot
@camperbot
Jan 26 2017 00:46
gstpierre11 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1408 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
gstpierre11
@gstpierre11
Jan 26 2017 00:47
@moT01 - was able to get it to work by manually changing the URL to https
Tyler Moeller
@TylerMoeller
Jan 26 2017 00:47
@moT01 No, chrome only supports navigator.geolocation over HTTPS. No popup asking to share when loading your pen over HTTP
Tom
@moT01
Jan 26 2017 00:48
maybe my browsers are too old, ...works on my firefox and chrome
gstpierre11
@gstpierre11
Jan 26 2017 00:48
@moT01 thanks all! Anytime I run into a roadblock like this I end up learning way more than I expected
CamperBot
@camperbot
Jan 26 2017 00:48
gstpierre11 sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 474 | @mot01 |http://www.freecodecamp.com/mot01
Tyler Moeller
@TylerMoeller
Jan 26 2017 00:49
@moT01 Must be really old, this has been issue for around 9-10 months now: FreeCodeCamp/FreeCodeCamp#7853
May depend on your OS too though... not 100% sure.
Tom
@moT01
Jan 26 2017 00:51
im osx 10.6 snow leopard, pretty old, nothing gets updates anymore
Janina Pohorecki
@janepohorecka
Jan 26 2017 01:00
@jdtdesigns darn, I hate to bother you again but I have parsed and tried editing the javascript for the hamburger menu to appear but I have not been able to get it. https://janepohorecka.github.io/Test-Northwest/
JD Tadlock
@jdtdesigns
Jan 26 2017 01:04
@janepohorecka you need font awesome ;)
put this in your head
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
Janina Pohorecki
@janepohorecka
Jan 26 2017 01:10
@jdtdesigns damn, it!!! I feel like an idiot. Thank you so much for pointing this out to me.
CamperBot
@camperbot
Jan 26 2017 01:10
janepohorecka sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 891 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Adrian Warholm
@adrianwarholm
Jan 26 2017 02:02
Is anyone online currently?
Tom
@moT01
Jan 26 2017 02:27
@adrianwarholm whats up
Adrian Warholm
@adrianwarholm
Jan 26 2017 03:05
@moT01 Hey.
Thanks for replying
I was just doing a challenge with freeCodeCamp on CodePen.
But I find it hard to center the unordered list.
I use column classes from bootstraps grid system but that doesn't align the bullet points in the center.
How could I go about this?
Icah Banton
@remdata
Jan 26 2017 03:08
hello. Does anyone know how to display the weather icon in the weather challenge?
Veronika
@Veronika853
Jan 26 2017 03:12
How better to create buttons? <input type="submit"> or <button></button>?
badalsaibo
@heyDante
Jan 26 2017 03:17
@Veronika853 latter one
Veronika
@Veronika853
Jan 26 2017 03:20
@heyDante Why?
badalsaibo
@heyDante
Jan 26 2017 03:20
because button is used for buttons.
Tyler Moeller
@TylerMoeller
Jan 26 2017 03:20

@adrianwarholm One way is to use column offsets:

    <div class="row">
      <div class="col-xs-8 col-xs-offset-2">
        <ul>
          <li>List item</li>
        </ul>
      </div>
    </div>

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

Veronika
@Veronika853
Jan 26 2017 03:22
@heyDante thanks )
CamperBot
@camperbot
Jan 26 2017 03:22
:warning: veronika853 already gave heydante points
veronika853 sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
Adrian Warholm
@adrianwarholm
Jan 26 2017 03:26
@TylerMoeller Thank you very much.
CamperBot
@camperbot
Jan 26 2017 03:26
:star2: 1409 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
adrianwarholm sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Robin
@LuckyRabbits
Jan 26 2017 04:02
@here Hey hey people working on a tribute page for Malala Yousafzia: https://codepen.io/luckyrabbit/pen/ygzYxv?editors=1100 Would love some feedback on how to make it a bit better!
Noah Overcash
@smileytechguy
Jan 26 2017 04:37
@LuckyRabbits looks great
Really is pretty good, but i'd remove the list bullets, and maybe remove the list format altogether
h1tag
@h1tag
Jan 26 2017 04:57

Hey, I'm on the Wiki Viewer project, after typing in the search text box and clicking the button to search, I get these 2 errors:

I also get "You clicked a broken link" on Codepen results screen after clicking the search button
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:29
@fortMaximus why you need a form ?
use ajax calls
<form id="s-form" action="api.php?action=opensearch&search="> this line is trying to execute 'api.php' when u click search
h1tag
@h1tag
Jan 26 2017 05:32
@NitinNair89 the form is for the text box
what do you mean by the ajax calls?
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:32
@fortMaximus
h1tag
@h1tag
Jan 26 2017 05:33
@NitinNair89 and yea, I forgot about this link in the form action
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:34
the getJSON medhod or the .ajax() method. With challenges like these, FCC is expecting you to learn asynchronous calls.. these calls make things happen without the need to refresh the webpage.. in simpler terms
you can add text box without the form as well
h1tag
@h1tag
Jan 26 2017 05:35
I just removed the link in the form action and got rid of the GET 404() error but still got the other error
I'm already using getJSON
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:38
@fortMaximus sVal += document.getElementById("s-val").value;
the syntax was incorrect. Try the line above
Dipen Bagia
@dbagia
Jan 26 2017 05:39
@fortMaximus the 'Access-Control-Allow-Origin' error is a browser security feature.
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:41
@fortMaximus Try Wiki's API docs and check their Sandbox mode. There you can test/request what all data you want Wiki to return when you use your API. Also you need to send some headers in your API call. Please refer Wiki's API Documentation
Dipen Bagia
@dbagia
Jan 26 2017 05:41
You will need to use JSONP
h1tag
@h1tag
Jan 26 2017 05:45
@NitinNair89 I already checked the sandbox. I also read the documentation, which headers are you referring to specifically?
Dipen Bagia
@dbagia
Jan 26 2017 05:46
According to the definition of getJSON, you will need to supply a callback in the URL in order to treat it as JSONP request
h1tag
@h1tag
Jan 26 2017 05:46
@dbagia so what's the solution?
Dipen Bagia
@dbagia
Jan 26 2017 05:48
Define a function which will accept the response of the getJSON
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:48
@fortMaximus "When you make HTTP requests to the MediaWiki web service API, be sure to specify a User-Agent header that properly identifies your client. "
Dipen Bagia
@dbagia
Jan 26 2017 05:48
In your url you will have to add &callback=your_function_name
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 05:48
Dipen Bagia
@dbagia
Jan 26 2017 05:51
Basically, you cannot make a direct ajax call to a domain other than your current one. That's why you are getting Access Control error. JSONP solves that problem
h1tag
@h1tag
Jan 26 2017 05:54
@dbagia i think i just have to add a function that receives the response because i used getJSON in the weather project with a function inside it and I didn't get this error
Dipen Bagia
@dbagia
Jan 26 2017 05:55
@fortMaximus Thats correct. The function name needs to be appended in the URL.
h1tag
@h1tag
Jan 26 2017 05:56
@dbagia but I didn't do that in the weather project
Dipen Bagia
@dbagia
Jan 26 2017 05:56
Can you share the link?
Dipen Bagia
@dbagia
Jan 26 2017 05:59
@fortMaximus Thanks. I will get back.
CamperBot
@camperbot
Jan 26 2017 06:00
dbagia sends brownie points to @fortmaximus :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for fortmaximus
h1tag
@h1tag
Jan 26 2017 06:23
to whom it may concern, I changed my name from fortMaximus to kemG
Dipen Bagia
@dbagia
Jan 26 2017 06:27
@kemG so according to my findings, it depends on the api weather to allow calling it from a different domain or not. The weather api allows making ajax calls from any domain. But the mediawiki api does not.
Gururaj Birajdar
@grajsb
Jan 26 2017 06:27
Hello would like some feedback on my weather app
Dipen Bagia
@dbagia
Jan 26 2017 06:28
Whether*
@kemG so in case of wiki, you will need to supply a callback.
XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=test. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access.
h1tag
@h1tag
Jan 26 2017 06:30
@dbagia so I also have to add &callback =function_name at the end of the url and add a function that takes response?
Dipen Bagia
@dbagia
Jan 26 2017 06:30
That's correct
This will automatically convert your getJSON ajax call from simple JSON request to JSONP request
h1tag
@h1tag
Jan 26 2017 06:32
@dbagia I'll try that and get back to you asap
Dipen Bagia
@dbagia
Jan 26 2017 06:32
okay. Good luck!
@grajsb your weather app looks great! Just one finding; If I hit enter after entering Zip code in the search box, then the form submits instead of making a HTTP call.
Dipen Bagia
@dbagia
Jan 26 2017 06:38
@grajsb and it only works for the first search entry. Can you check the browser console. There are some errors.
Gururaj Birajdar
@grajsb
Jan 26 2017 06:38
@dbagia yeah i still need to work on it..but how about the functionality
did it show correct data?
Dipen Bagia
@dbagia
Jan 26 2017 06:39
@grajsb yeah it did! It's working great.
Gururaj Birajdar
@grajsb
Jan 26 2017 06:39
@dbagia that feels good after few days of work on this app :smile:
Dipen Bagia
@dbagia
Jan 26 2017 06:39
Even the use of background color and placement of data looks good!
Gururaj Birajdar
@grajsb
Jan 26 2017 06:40
Actually i wanted to replace the temperature that is already displayed
Dipen Bagia
@dbagia
Jan 26 2017 06:40
Yes, the effort you have put in is clearly visible
Gururaj Birajdar
@grajsb
Jan 26 2017 06:41
but as I am constructing the html in the js function or jquery i did not take a risk of breaking it
by using another div for temperature specifically
Dipen Bagia
@dbagia
Jan 26 2017 06:42
you mean you wanted to change the value of temperature on the next search?
Gururaj Birajdar
@grajsb
Jan 26 2017 06:43
ideally clicking on F should change the temperature data that was originally shown..
but i am showing that as another div...which is not pretty though
Dipen Bagia
@dbagia
Jan 26 2017 06:44
okay...right. You can always go back and optimize.
Gururaj Birajdar
@grajsb
Jan 26 2017 06:44
yeah for time being i want to go further so i will go with next wiki challenge and i can optimize this one later too
but appreciate your feedback Dipen @dbagia
Dipen Bagia
@dbagia
Jan 26 2017 06:44
okay. All the best!
Gururaj Birajdar
@grajsb
Jan 26 2017 06:45
Thank you
h1tag
@h1tag
Jan 26 2017 06:51
@dbagia still getting the same error: https://codepen.io/FortMax/pen/YNrwpG
r2d2
@UsamaHameed
Jan 26 2017 06:57
@kemG can you find your mistake here?
sVal += document.getElementById("s-val").value;
nvm, it is okay
Dipen Bagia
@dbagia
Jan 26 2017 07:18
@kemG there are some other errors. One of them pointed out by @UsamaHameed
@kemG you will also need to restrict your form from getting submitted. For simplicity, just remove the form tag for now.
h1tag
@h1tag
Jan 26 2017 07:19
@dbagia then he said it's okay
Dipen Bagia
@dbagia
Jan 26 2017 07:20
Yes. I just realized. It won't cause any error
h1tag
@h1tag
Jan 26 2017 07:21
@dbagia I removed the form tag, what other errors still there?
r2d2
@UsamaHameed
Jan 26 2017 07:23
@kemG aVal += "https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=" + sVal + "&callback=?";
This is the correct API call
Also, you had a typo here render(response);
h1tag
@h1tag
Jan 26 2017 07:25
oh, damn me, typos :p
it finally worked
thanks @UsamaHameed @dbagia @NitinNair89
CamperBot
@camperbot
Jan 26 2017 07:26
kemg sends brownie points to @usamahameed and @dbagia and @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @dbagia |http://www.freecodecamp.com/dbagia
:cookie: 560 | @usamahameed |http://www.freecodecamp.com/usamahameed
:cookie: 382 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Dipen Bagia
@dbagia
Jan 26 2017 07:28
@kemG Great :smile:
r2d2
@UsamaHameed
Jan 26 2017 07:33
:+1:
h1tag
@h1tag
Jan 26 2017 08:20
@jdtdesigns we were talking about looping through the response object you receive from the wiki api for the Wiki Viewer project. The code example you gave me: http://jsbin.com/qudufej/edit?js,console uses the "query" action not the "opensearch" action, I'm using "opensearch" for this project. The object returned when you use "opensearch" action doesn't have keys like in your example.
Zhanibek
@zhann1982
Jan 26 2017 08:30
Hi guys! Remind me please: Do i have to make two tribute pages ?
badalsaibo
@heyDante
Jan 26 2017 08:30
@zhann1982 One
Zhanibek
@zhann1982
Jan 26 2017 08:31
it says 2 user stories
badalsaibo
@heyDante
Jan 26 2017 08:31
@zhann1982 user stories are like the objectives. you need to fulfill the given user stories on your tribute page.
Nitin Chandran Nair
@NitinNair89
Jan 26 2017 08:31
user stories = requirements
h1tag
@h1tag
Jan 26 2017 08:39
@jdtdesigns nvm, solved
Zhanibek
@zhann1982
Jan 26 2017 08:46
@heyDante Thanks! Soon i will finish my tribute page
CamperBot
@camperbot
Jan 26 2017 08:46
zhann1982 sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
:cookie: 314 | @heydante |http://www.freecodecamp.com/heydante
Archit Chandra
@architchandra
Jan 26 2017 08:59
Can we ask for help on projects outside Free Code Camp here as well? Something that we might be working on on a personal level?
If no, can you suggest a channel or resource that I should try?
macieqx
@macieqx
Jan 26 2017 09:02
Hi there, anyone eager to rate my website project?
badalsaibo
@heyDante
Jan 26 2017 09:04
@architchandra you're free to take help from any resources.
@macieqx link'
Here you got both links to github repo and live version
badalsaibo
@heyDante
Jan 26 2017 09:10
@macieqx Looks great and polished!
macieqx
@macieqx
Jan 26 2017 09:11
Thank you @heyDante
CamperBot
@camperbot
Jan 26 2017 09:11
macieqx sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @heydante |http://www.freecodecamp.com/heydante
macieqx
@macieqx
Jan 26 2017 09:11
Anything you would have changed?
Veronika
@Veronika853
Jan 26 2017 09:11
@macieqx nice job
macieqx
@macieqx
Jan 26 2017 09:11
Thank you @Veronika853
CamperBot
@camperbot
Jan 26 2017 09:11
macieqx sends brownie points to @veronika853 :sparkles: :thumbsup: :sparkles:
:cookie: 112 | @veronika853 |http://www.freecodecamp.com/veronika853
badalsaibo
@heyDante
Jan 26 2017 09:12
@macieqx I think the form and info of the hotel should be below
macieqx
@macieqx
Jan 26 2017 09:13
I will consider that :D
badalsaibo
@heyDante
Jan 26 2017 09:14
nevermind good luck
Veronika
@Veronika853
Jan 26 2017 09:15
telephone number in header maybe shift below, not close to the frame
Archit Chandra
@architchandra
Jan 26 2017 09:15
@heyDante Thanks
CamperBot
@camperbot
Jan 26 2017 09:15
architchandra sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @heydante |http://www.freecodecamp.com/heydante
Ivan Temchur
@ttemcha
Jan 26 2017 09:26
hey folks. have a question! when i slice a laptop image in PNG format it's size is about 400kb. Why is it so big ?
Veronika
@Veronika853
Jan 26 2017 09:27
not compressed
or size very large
r2d2
@UsamaHameed
Jan 26 2017 09:42
Can someone explain to me how reduce "knows" that allNames is the whole array instead of just an element from the array (like the usual case)?
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

var countedNames = names.reduce(function(allNames, name) { 
  if (name in allNames) {
    allNames[name]++;
  }
  else {
    allNames[name] = 1;
  }
  return allNames;
}, {});
// countedNames is { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
alpox
@alpox
Jan 26 2017 10:13
@UsamaHameed It kows that allNames is an Object - not an array.
Reduce gives you as first parameter your "aggregated value" - which is in the first iteration the {} you gave as second argument to reduce.
In the second iteration, allNames will be the value returned in the first iteration.
Reduce iterates as long as there are elements in the array names and gives you in each iteration a value from this array as name (Second parameter)
r2d2
@UsamaHameed
Jan 26 2017 10:15
Got it. @alpox thanks for the explanation
CamperBot
@camperbot
Jan 26 2017 10:15
usamahameed sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 750 | @alpox |http://www.freecodecamp.com/alpox
alpox
@alpox
Jan 26 2017 10:16
@UsamaHameed You're welcome
Strazz1337
@Strazz1337
Jan 26 2017 10:56
Is someone able to help me out with my portfolio project?
I've added a background attribute, but it doesn't fill in the whole page
Clyde Lobo
@oppiniated
Jan 26 2017 10:57
@Strazz1337 link?
Johnny
@JohnnyBizzel
Jan 26 2017 11:10
@Strazz1337 Can't help you http://codepen.io/Strazz1337 (not found)
and https://github.com/Strazz1337 (empty)
Simon Cordova
@gbsimon87
Jan 26 2017 11:30
Hey guys :)
Does anybody know how to change the default color of radio buttons?
blob
blob
That black color, how do I make it blue?
Larisa Escobar
@larisaescobar
Jan 26 2017 12:29
Hello, I'm working on the Random Quote Machine challenge but I'm stuck with the tweet this button.
I know how to add it but I don't know how to make it tweet the quote
MaxLAB
@Max-LAB
Jan 26 2017 12:29
@gbsimon87 try to look at this demo and try to replicate it http://jsfiddle.net/nmu8H/1/
Larisa Escobar
@larisaescobar
Jan 26 2017 12:30
Could someone please help me? :)
MaxLAB
@Max-LAB
Jan 26 2017 12:31
@larisaescobar you can look at this examples https://dev.twitter.com/web/tweet-button
@larisaescobar
<a class="twitter-share-button"
  href="https://twitter.com/intent/tweet?text=Hello%20world">
Tweet</a>
in your *.js you can change href tag replacing text=Hello%20world with your quote
Larisa Escobar
@larisaescobar
Jan 26 2017 12:34
Thanks @Max-LAB :)
MaxLAB
@Max-LAB
Jan 26 2017 12:35
@larisaescobar :+1: if you get stuck with your *.js code, feel free to ask
Larisa Escobar
@larisaescobar
Jan 26 2017 12:36
I don;t understand the .js part
I don't know how to do this "in your *.js you can change href tag replacing text=Hello%20world with your quote"
MaxLAB
@Max-LAB
Jan 26 2017 12:40

This is your html code

<a class="twitter-share-button"
  href="https://twitter.com/intent/tweet?text=Hello%20world">
Tweet</a>

now, in your javascript file you need to add selector that will change this href part in html when new quote is displayed. You can do that with

$(' css selector').attr('href','https://twitter.com/intent/tweet?text=" + quote + "');

something like this

Look at this example https://codepen.io/freeCodeCamp/pen/ONjoLe

Try to replicate $('#tweet-quote').attr('href', ...... part.

PipsChips
@PipsChips
Jan 26 2017 12:46
Hi! I'm stuck with 'Random Quote Machine' project. Could someone pls check my (JavaScript) code for typos and/or mistakes:
$(document).ready(function(){  
  $("#quote_bttn").on("click", function (){    
    $.getJSON("https://crossorigin.me/http://api.forismatic.com/api/1.0/?method=getQuote&format=json&lang=en", function(json) {      
    $("#quote_text").html(JSON.stringify(json));
    });      
  });    
});
Larisa Escobar
@larisaescobar
Jan 26 2017 12:50
@Max-LAB Great, thanks!! :) I'm not supposed to look at the code tho, I feel like cheating, haha.
MaxLAB
@Max-LAB
Jan 26 2017 12:54
@larisaescobar call it "learning by replicating " :) you are on the right track now, good luck :+1:
Muhammad Hasham
@MohammadHasham
Jan 26 2017 12:59
i am finding it really hard to grasp polymorphism concepts from eloquent javascript(a book).I have good concepts about OOP but is OOP really important in JS.If yes,then can someone give me a simple example of polymorphism in js.
Larisa Escobar
@larisaescobar
Jan 26 2017 13:03
@Max-LAB Thank you for your help!! :)
mohzo
@mohzo
Jan 26 2017 13:59
hello
@evryone. i have been trying to display picture on my page but i cant get it. pls help me
i have uploaded the picture to my github repository but i dont know how to embed the path
i have tried this code since yestaday but its not working <img class="img-responsive center-block" src=""https://github.com/mohzo/repo1/m.jpg" hight="400px" alt="mohzo picture">
Moisés Man
@moigithub
Jan 26 2017 14:10
@mohzo u need to link the RAW version of ur img/file
Icah Banton
@remdata
Jan 26 2017 14:25
Hello. I need some help in displaying the weather icons in the weather challenge?
@moigithub. I have the same issue. What do you mean by "the RAW version of ur img/file"?
Tyler Moeller
@TylerMoeller
Jan 26 2017 14:37
@remdata One way is to paste the location of your file here and it will give you an URL to use: http://rawgit.com/
You can also set up your repo with a gh-pages branch and it will serve the files as a website, then you would get the file at, for example, https://username.github.io/reponame/filename
Icah Banton
@remdata
Jan 26 2017 14:49
@TylerMoeller . I went with the first option. I will try the second option later. thank you.
bapuni123
@bapuni123
Jan 26 2017 14:57
how to make a portfolio page
how to use bootstrap in portfolio
i m stuck ,please help me
Brittni Willett
@Willow606
Jan 26 2017 14:58
thank you @Manish-Giri
Manish Giri
@Manish-Giri
Jan 26 2017 15:01
@Willow606 welcome
looks like cbot is broken
Brittni Willett
@Willow606
Jan 26 2017 15:02
apparently was trying to give you brownie points lol
Manish Giri
@Manish-Giri
Jan 26 2017 15:02
poor me, no cookies, so sad :cry:
Brittni Willett
@Willow606
Jan 26 2017 15:02
lol
Faizi
@FaiziA
Jan 26 2017 15:07
Hi, this might sound a stupid question to you guys but being a newbie I am kinda stuck or you can say a bit confused in bootstrap part.
I am about to create a portfolio page however, I want to know how to access bootstrap library so that I can check the classes there to use in my code.
Janina Pohorecki
@janepohorecka
Jan 26 2017 15:12
Why is it when I try to make my navigation bar fixed all the contents of the navigation bar move to the left hand corner?? https://janepohorecka.github.io/Test-Northwest/
Moisés Man
@moigithub
Jan 26 2017 15:12
Faizi
@FaiziA
Jan 26 2017 15:16
@moigithub Thanks for your help. So I can just visit the site and go to the particular section I need help for, right? Thanks again :)
:+1:
Janina Pohorecki
@janepohorecka
Jan 26 2017 15:18
Can someone please help me? I have a problem I have not been able to fix :( Why is it when I try to make my navigation bar fixed all the contents of the navigation bar move to the left hand corner?? https://janepohorecka.github.io/Test-Northwest/
json
@jcharnley
Jan 26 2017 15:42
Hi guys im about to start the tribute page
anyone in the same postion ?
Faizi
@FaiziA
Jan 26 2017 15:54
@jcharnley Just completed 30 mins ago.
PipsChips
@PipsChips
Jan 26 2017 15:56
Hi! Can someone pls check my 'Random Quote Machine' and tell me if it works properly... by that I mean - does it generate new quotes every time a button is clicked!?
http://codepen.io/PipsChips/pen/pRWRKd
Franco Javier Danussi
@francodanussi
Jan 26 2017 15:57
Hi @PipsChips it's not working properly
Faizi
@FaiziA
Jan 26 2017 15:57
@PipsChips It generated a quote first time but didnt work when i tried clicking button again.
Franco Javier Danussi
@francodanussi
Jan 26 2017 15:58

can someone tell me what's the problem with this?

my button has onclick="tweet()" and then in JS I wrote

function tweet(){
openURL('https://twitter.com/intent/tweet?hashtags=quotes&related=&text=' + encodeURIComponent('"' + quote + '" ' + "J.L.B"));
}

PipsChips
@PipsChips
Jan 26 2017 16:01
@FaiziA
Yeah, same for me... any idea how to fix it?
Faizi
@FaiziA
Jan 26 2017 16:04
@PipsChips Sorry but I am just a newbie so don't have any idea how to fix it but I am sure you will get help from others here soon.
Hello911
@Hello911
Jan 26 2017 16:08
var array = [1, 12, 21, 2];

// Only change code below this line.

array.sort(function(a,b){
           return b-a ;
           });
Why b-a will sorta the number from biggest from smallest, and a-b, from the smallest to biggest? I read the link on compare function. But still don't quite understand what a and b refer to in the array?
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:11
@PipsChips The request is getting cached, you'll have to use $.ajaxSetup({cache: false}); to override it
@francodanussi Where is the quote variable defined in this function?
function tweet(){
openURL('' + encodeURIComponent('"' + quote + '" ' + "J.L.B"));
}
PipsChips
@PipsChips
Jan 26 2017 16:17
@TylerMoeller
Thank you!
Does it matter where I put $.ajaxSetup({cache: false}); inside my JS code?
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:20
@PipsChips Yes, it does matter where you use it, as it will affect every ajax call you make on your page until you call it again. For your app, since you're only making one ajax call, it doesn't matter as much, just keep it mind for the future. For more info: https://api.jquery.com/jquery.ajaxsetup/
PipsChips
@PipsChips
Jan 26 2017 16:25
@TylerMoeller
Ok, thnx. Just one more Q; would it be more appropriate/sophisticated if I used '$.ajax()' method, instead of '$.getJSON()'?
I assumed problem is smth with the cache (googled it), but I tought - '$.ajaxSetup' can only be used with/within '$.ajax()' method...
emamadordev
@emamadordev
Jan 26 2017 16:28
@Hello911 a and b refers to the elements in the array that it compares in your case it compares 1 and 12 first. check it out: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
@Hello911 check this video out. it explains the sort method and shows examples: https://www.youtube.com/watch?v=qH_MHuX-jzQ
@TylerMoeller hey tyler! i see you're doing well. keep up the good work!
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:36
@PipsChips $.getJSON is a shorthand $.ajax. The ajaxSetup documentation implies it's better to use $.ajax and explicitly call out the defaults you want. If you go to: https://quotesondesign.com/api-v4-0/, they have both a $.getJSON and $.ajax example. The $.ajax example uses cache: false, I'm not sure why they didn't disable caching in the getJSON example.
@emamador Hello!
emamadordev
@emamadordev
Jan 26 2017 16:38
@TylerMoeller :smile:
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:38

@Hello911 This might also help visualize what a and b refer to:

var array = [1, 12, 21, 2];
array.sort(function(a,b){
  console.log('a:', a);
  console.log('b:', b);
  console.log('b-a:', b-a)
});

Use console.log() as much as needed :)

PipsChips
@PipsChips
Jan 26 2017 16:38
@TylerMoeller
Thnx, again!
CamperBot
@camperbot
Jan 26 2017 16:38
pipschips sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1410 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
JMNofziger
@JMNofziger
Jan 26 2017 16:52
I'm finishing up my random quote generator project and in having trouble getting my message to be populated into the attribute of my link that then generates the quote as the tweet text. Any ideas on what I'm missing here?
lastix
@lastix
Jan 26 2017 16:54
Hi guys! How to make my background stretch whole viewport? It worked when size is big enough. But Codepen.io messes up my background, it shows white half of the screen.
I know overflow: hidden locks the viewport. But i wan't the size to be flexibel and always take full height.
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:56
@JMNofziger If you want to use the twitter widget for your quote machine, take a look at web intents: https://dev.twitter.com/web/tweet-button/web-intent
The approach you are using is intended for sharing links
Hello911
@Hello911
Jan 26 2017 16:57
@TylerMoeller I just did console.log(a,b)
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:58
@lastix Use min-height: 100%; instead of height: 100%
Hello911
@Hello911
Jan 26 2017 16:58
I don't want to make things too complicated.
So I just memorize that if function(a,b) return negative result, a will come first.
and postive b will come first.
lastix
@lastix
Jan 26 2017 16:59
@TylerMoeller thanks!
CamperBot
@camperbot
Jan 26 2017 16:59
lastix sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1412 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 26 2017 16:59
@Hello911 Glad you got it figured out :)
@lastix np :+1:
Icah Banton
@remdata
Jan 26 2017 17:01
I am trying to change the entire background image of a html page ( not just the document.body ). How would I do that in JavaScript?
Hello911
@Hello911
Jan 26 2017 17:02
@TylerMoeller btw, I sas taht you got your front end certificate did you get to do any FCC nonprofit projet?
Tyler Moeller
@TylerMoeller
Jan 26 2017 17:03
@Hello911 I would still have to get the backend certification to do FCC nonprofit projects.
Takes a lot of time :)
json
@jcharnley
Jan 26 2017 17:04
So i'm just starting this tribute page challenge
so I need two wells correct>?
Hello911
@Hello911
Jan 26 2017 17:05
@TylerMoeller Yeah its hard.
Tyler Moeller
@TylerMoeller
Jan 26 2017 17:06
@jcharnley You can implement it with your own design if you like. In the example, they use a jumbotron: http://getbootstrap.com/components/#jumbotron
Vasile Botnaru
@VasileBotnaru
Jan 26 2017 17:06
@TylerMoeller what's a jumbotron?
json
@jcharnley
Jan 26 2017 17:07
ah Yes i saw the jumbotron
Tyler Moeller
@TylerMoeller
Jan 26 2017 17:07
@VasileBotnaru It's a really big TV you see in sports stadiums :) In Bootstrap, it's a big gray box for displaying content: http://getbootstrap.com/components/#jumbotron
Vasile Botnaru
@VasileBotnaru
Jan 26 2017 17:09
@TylerMoeller ok thx, but what's its purpose?
CamperBot
@camperbot
Jan 26 2017 17:09
vasilebotnaru sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1413 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 26 2017 17:10
@VasileBotnaru It's for showing content to a user in a way that makes it stand out.
I guess they also call it a "Hero Unit"
Like "Hero Images" are the main image you see when visiting lots of web pages these days.
Vasile Botnaru
@VasileBotnaru
Jan 26 2017 17:19
@TylerMoeller Got it, thank you for your time
CamperBot
@camperbot
Jan 26 2017 17:19
vasilebotnaru sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: vasilebotnaru already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Jan 26 2017 17:21
@janepohorecka Is there any reason you are trying to use position: fixed with display: flex?
I don't think those two are meant to work with each other.
is it ok?
mohzo
@mohzo
Jan 26 2017 17:26
@kirbyedy ,@moises Man thanks
CamperBot
@camperbot
Jan 26 2017 17:26
mohzo sends brownie points to @kirbyedy and @moises :sparkles: :thumbsup: :sparkles:
:star2: 1715 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
:warning: could not find receiver for moises
Larisa Escobar
@larisaescobar
Jan 26 2017 17:26
@VasileBotnaru Cool :)
mohzo
@mohzo
Jan 26 2017 17:27
@moigithub thanks
CamperBot
@camperbot
Jan 26 2017 17:27
mohzo sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 2616 | @moigithub |http://www.freecodecamp.com/moigithub
Muhammad Hasham
@MohammadHasham
Jan 26 2017 17:48
has anyone used prototypes ever in real life? in javascript?
kyadondo Timothy
@chadwalt
Jan 26 2017 17:51
has anyone used easyui before
shiqiwang123
@shiqiwang123
Jan 26 2017 19:04
anyone having trouble with scrollspy in codepen
i tried everything and it just wont work
Icah Banton
@remdata
Jan 26 2017 19:17
Hello. Help. I am stuck on this "switch" statement can't seem to get it working. Dose anyone see what I am doing wrong? : switch(intTemp) {
case (intTemp < 10):
select = 1;
break;
case (intTemp < 20):
select = 2;
break;
case (intTemp < 30):
select = 3;
break;
case (intTemp < 40):
select = 4;
break;
case (intTemp < 50):
select = 5;
break;
        default: 
          select = 0;
          break;
      };
Muhammad Hasham
@MohammadHasham
Jan 26 2017 19:18
i need some advice regarding choosing career as a web developer or a pentester? can anyone help me out?
official4code
@official4code
Jan 26 2017 19:19
Thanks @osterbergmarcus for your help with Checkpoint: Golf Code
CamperBot
@camperbot
Jan 26 2017 19:19
:warning: official4code already gave osterbergmarcus points
official4code sends brownie points to @osterbergmarcus :sparkles: :thumbsup: :sparkles:
Ghulam Shabir
@ghulamshabir
Jan 26 2017 20:54
hello everyone, please review my wikipedia viewer project http://codepen.io/ghulamshabir/full/GrvLrE/
Brittni Willett
@Willow606
Jan 26 2017 20:57
hey anyone around available to help me with the Pomodoro Clock? I can't seem to get it to count down...
http://codepen.io/Willow91/pen/BpwrRo/ is what I have. It's line 57 of the JavaScript that's tripping me up
line 58 now
Franco Javier Danussi
@francodanussi
Jan 26 2017 21:03
Hi there

Can anyone review this code. I don't understand why I'm not fetching the API

https://codepen.io/francodanussi/pen/YNraEo

lastix
@lastix
Jan 26 2017 21:08
Same here @francodanussi , not fetching API on codepen. Could you try running it through clicking on html file instead running through codepen? What's the result?
Franco Javier Danussi
@francodanussi
Jan 26 2017 21:09
what do you mean? I wrote the functions in the JS tab, not in the html
@lastix
lastix
@lastix
Jan 26 2017 21:11
I mean just putting all the files inside a regular folder and then double clicking it so it opens in the browser.
add links to stylesheets and jquery and your javascript file.
Franco Javier Danussi
@francodanussi
Jan 26 2017 21:11
Ok, I'm going to check how that should be done.
thanks for the suggestion @lastix
lastix
@lastix
Jan 26 2017 21:13
@francodanussi no problem, i'm curious too. Since my own weather app runs perfectly fine but does weird on codepen somehow. Might be codepen related.
Franco Javier Danussi
@francodanussi
Jan 26 2017 21:13
@lastix. Gonna try that and then I let you know.
Marcin_L
@lotosiauke
Jan 26 2017 21:14
I love the feeling when I'm already writing a request for help and than I realise what i did wrong. Wonderful :D
Tyler Moeller
@TylerMoeller
Jan 26 2017 21:18
@shiqiwang123 Make sure you have jQuery and Bootstrap.js loaded - jQuery must load before bootstrap.js
@remdata you will need to switch on true when doing a comparison like that
Reggie
@Reggie01
Jan 26 2017 21:20
@Willow606 You are getting close to fixing your problem. Hint: double check your ticker function call inside of your start function call is doing what you expect it to do.
Tyler Moeller
@TylerMoeller
Jan 26 2017 21:22
@ghulamshabir pages[i].thumbnail.source is not returned for all searches. Try searching for JavaScript, for example. You will need to check if the property exists before attempting to write it to the page.
lastix
@lastix
Jan 26 2017 21:25
Guys is there anything i'm doing wrong on my ajax request..?
Tyler Moeller
@TylerMoeller
Jan 26 2017 21:27
@lastix You're trying to call APIs over HTTP when your codepen is loaded over HTTPS. Change the URL in your browser's address bar to: http://codepen.io/attilay/pen/apLjbE
lastix
@lastix
Jan 26 2017 21:30
@TylerMoeller Thanks! I finally learned that it's important to actually read everything even when you don't need it anymore for now. Like... everything breaks when developing >...<
Tyler Moeller
@TylerMoeller
Jan 26 2017 21:32
Lol, @lastix A big learning process for sure
Tyler Moeller
@TylerMoeller
Jan 26 2017 21:40
Also, @ghulamshabir This CSS is incorrect, I get a very wide form on small screens:
 @media (min-width: 530px) {
   form {
     width: 1200px;
   }
  }
Brittni Willett
@Willow606
Jan 26 2017 21:41
ty @Reggie01
Karthik Nallasivan
@furball514
Jan 26 2017 21:59
Help guys is there an easy way or shortcut to do the tic tac toe game im stucj its too damn hard!
Marcin_L
@lotosiauke
Jan 26 2017 22:16

http://codepen.io/Latosiauke/pen/QdvybR

Anyone has any idea why script isn't getting quotes to variables on the first click?

tomasertola
@tomasertola
Jan 26 2017 22:17
Need help with some problem with the font-size!
Ammad Khokar
@Ammadk24
Jan 26 2017 22:17
Need some help on the twitch.tv challenge, having trouble appending offline channels to list
http://codepen.io/Ammadk/pen/YNrvqE?editors=1111
Marcin_L
@lotosiauke
Jan 26 2017 22:18
It seems my page doesnt work in here. Need to go to codepen directly (also no idea why)
vanillaslime
@vanillaslime
Jan 26 2017 22:26
I'm on this "Build a Tribute Page" but I sorta don't get it. User Story? It mentions Fulfille the below user stories but there really isn't like anything user stories i could click....
Ammad Khokar
@Ammadk24
Jan 26 2017 22:36
@vanillaslime User story is just a requirement that must be fulfilled in the final product, something the "user" can experience

User Story: I can view a tribute page with an image and text

your final product must have both an image and text viewable by the user

vanillaslime
@vanillaslime
Jan 26 2017 22:41
@Ammadk24 so then what is the User Story thing suppose to be about? I mean I think I could set it up like the example... but is this suppose to be open ended and just do w.e long as it feels the requirements?
Tyler Moeller
@TylerMoeller
Jan 26 2017 22:47

@lotosiauke quoteText and quoteAuthor are not defined outside of your getJSON function. Do this to get your text:

 $.getJSON(url, function(data){
   quoteText = data.quoteText;
   quoteAuthor = data.quoteAuthor;
   $(".quote-box").text("\""+quoteText+"\"");
   $(".author-box").text("~ "+quoteAuthor);   
 });

Also, your page doesn't work in here, because of HTTPS/HTTP security restrictions. APIs can't be called over HTTP when the web page is loaded over HTTPS.

Chris Wingler
@chriswingler
Jan 26 2017 22:54
why is it that when i run code in codepen's console it works, but it won't work in the editor?
wetgoldfish
@wetgoldfish
Jan 26 2017 22:56
Hi room, sorry if this is the wrong place to ask, I have just added SSL https to my web app but when I setup IIS 8.0 HTTP redirect to HTTPS is just get 404's
Chris Wingler
@chriswingler
Jan 26 2017 22:56
does codepen have problems with click events?
Ammad Khokar
@Ammadk24
Jan 26 2017 22:58
@vanillaslime Correct, the purpose of the projects is to help you learn reverse engineering skills as well as add to your html skillset. If you can re-create the example page from scratch, you can do anything with those conceptual skills, including styling in your own way
Tyler Moeller
@TylerMoeller
Jan 26 2017 22:58
@chriswingler Click events work fine in codepen. Share your pen and I can take a closer look
vanillaslime
@vanillaslime
Jan 26 2017 22:59
@Ammadk24 okies ty :)
Chris Wingler
@chriswingler
Jan 26 2017 22:59
Tyler Moeller
@TylerMoeller
Jan 26 2017 23:03
@chriswingler I think click is reserved, so you'll have to rename your function to something like getQuote()
Chris Wingler
@chriswingler
Jan 26 2017 23:05
thanks @TylerMoeller that fixed it!
Tyler Moeller
@TylerMoeller
Jan 26 2017 23:06
click() is already a defined method: http://www.w3schools.com/jsref/met_html_click.asp
aRtoo
@artoodeeto
Jan 26 2017 23:26
hi guys. im doing bootstrap and im practicing a dropdown menu but the dropdown wont work. have you guys any experience about this?? heres the codepen. http://codepen.io/artoo/pen/VPMVaq
Emily Ann
@emilyaringoen
Jan 26 2017 23:27
Hey, I was getting closer to finishing my weather app, but I broke something in my code and now I am not getting data from the API's that I used. Here is my codepen--would you mind taking a look and helping figure out where I went wrong? https://codepen.io/eringoen/pen/gLBjLK
aRtoo
@artoodeeto
Jan 26 2017 23:27
hi guys. im doing bootstrap and im practicing a dropdown menu but the dropdown wont work. have you guys any experience about this?? heres the codepen. http://codepen.io/artoo/pen/VPMVaq
Coy Sanders
@coymeetsworld
Jan 26 2017 23:29
if you go to console (not codepen console) you'll see this error:
"jquery.min.js:4 Mixed Content: The page at 'https://codepen.io/eringoen/pen/gLBjLK' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://ip-api.com/json/'. This request has been blocked; the content must be served over HTTPS."
@emilyaringoen the issue is your link is over https, but your api calls are http. That wont work they will need to be the same. Try http on codepen
Emily Ann
@emilyaringoen
Jan 26 2017 23:31
@coymeetsworld how do I try http as opposed to https?
@emilyaringoen don't change your api calls, openweathermap on https wont work unless you pay for it, you only have http
everything should be http, your URL to codepen and everything in your code, then it should be good
Emily Ann
@emilyaringoen
Jan 26 2017 23:34
@coymeetsworld how do I make the URL to codepen http?
Coy Sanders
@coymeetsworld
Jan 26 2017 23:35
showed you above
instead of https, you use http
Emily Ann
@emilyaringoen
Jan 26 2017 23:35
@coymeetsworld thanks. sorry, I guess my brain is moving slow today.
Coy Sanders
@coymeetsworld
Jan 26 2017 23:35
its ok, does that work?
Emily Ann
@emilyaringoen
Jan 26 2017 23:36
@coymeetsworld that worked.
Coy Sanders
@coymeetsworld
Jan 26 2017 23:36
cool cool
Emily Ann
@emilyaringoen
Jan 26 2017 23:36
I didn't realize I had ever changed that.
Coy Sanders
@coymeetsworld
Jan 26 2017 23:40
with most browsers you'll see the URL box green or has a lock right?