These are chat archives for FreeCodeCamp/HelpFrontEnd

6th
Apr 2016
EternityElephant
@EternityElephant
Apr 06 2016 00:16
guess theres no one really here then
ehekatlOf
@ehekatlOf
Apr 06 2016 00:22
@EternityElephant try adding in a block to update your HTML
see if that fixes it
with #changeTempButton
Mike Olo
@michaelolo24
Apr 06 2016 00:24
@EternityElephant
EternityElephant
@EternityElephant
Apr 06 2016 00:24
im not sure what you mean by a block
Mike Olo
@michaelolo24
Apr 06 2016 00:24
@EternityElephant , it's because your variable in your clickfunction
isn't being passed
as a global variable
it's local within the click function, so anything set within it, won't be passed to your main code
ehekatlOf
@ehekatlOf
Apr 06 2016 00:26
there's also nothing actually updating the HTML on click
Mike Olo
@michaelolo24
Apr 06 2016 00:28
yea, you should change your isCelsius = false, although I think the way you have it set now should work too
Dustin
@dustininkster
Apr 06 2016 00:29
I'm working on the Tribute Page project, and having some difficulty. Specifically the src for an <img>. Where should I save the image? I've tried saving it locally on my HD then putting the local path, but with no success.
ehekatlOf
@ehekatlOf
Apr 06 2016 00:31
@dustininkster use tumblr
they let you hotlink out the A
EternityElephant
@EternityElephant
Apr 06 2016 00:31
so...
that was a lot of information i just got lol
ehekatlOf
@ehekatlOf
Apr 06 2016 00:32
basically, just do whatever you're doing on your initial run of the load for the temperature block
except on click, do it again and have it update the HTML
with new conditions
Dustin
@dustininkster
Apr 06 2016 00:33
@ehekatlOf Gotcha. But just to make sure I understand: The path will typically be located in a folder on the web server that's serving the page, right?
EternityElephant
@EternityElephant
Apr 06 2016 00:33
ok this is one of the thing ive been having trouble with is calling functions in jquery
in c# i would have no trouble just calling a function with different arguments
ehekatlOf
@ehekatlOf
Apr 06 2016 00:36
I have no idea how tumblr does their file management
haha
sorry!
nsloc22
@nsloc22
Apr 06 2016 00:38
@henrywashere you are missing bunch of semicolons in your css but this is the culprit
.whoamiheader {font-family: candara;
               font-weight: 900px;
               text-shadow: 2px 3px 3px #000000}


} <---------------extra closing brace

#Portfolio {background-image: url('http://i228.photobucket.com/albums/ee87/Konane117/snowy-ski-mountains-wallpaper-3_zpsz5asv8xe.jpg');
            background-attachment: fixed;
            background-size: cover;
            height: 1000px;}
Eric Murta
@murtinha
Apr 06 2016 00:45
Guys on "Everything be true" challenge, am I supposed to list the predicates?
henrywashere
@henrywashere
Apr 06 2016 00:55
OMG thank you
thanks @nsloc22
CamperBot
@camperbot
Apr 06 2016 00:55
henrywashere sends brownie points to @nsloc22 :sparkles: :thumbsup: :sparkles:
:star: 332 | @nsloc22 | http://www.freecodecamp.com/nsloc22
Stephen James
@sjames1958gm
Apr 06 2016 01:14
@murtinha No just return true or false.
henrywashere
@henrywashere
Apr 06 2016 01:17
@nsloc22 you still there?
Davi Nascimento
@Davinasc
Apr 06 2016 01:18
Hello guys,
someone could help me with the random quote project?
I would to add via ajax, the following date:
```js
$.getJSON("http://quotes.rest/qod.json", function(json) {
            var html = json.contents.quotes[0].quote;
            console.log(html);
});
nsloc22
@nsloc22
Apr 06 2016 01:19
@henrywashere yup
henrywashere
@henrywashere
Apr 06 2016 01:19
i have anothe problem
nsloc22
@nsloc22
Apr 06 2016 01:20
fire away, if I can't someone else will surely help you
henrywashere
@henrywashere
Apr 06 2016 01:21
when you resize(Shrink) ur browser, the hamburger button doesnt align itself properly. instead of being in the center of the navigation bar, its located in the bottom right
http://codepen.io/henrywashere/pen/XdXxRO
Eric Murta
@murtinha
Apr 06 2016 01:22
@sjames1958gm but it wants me to do that based upon the obj property right? its has to make sense, you cant have age:0... but how can I do that? hahaha
nsloc22
@nsloc22
Apr 06 2016 01:24
@henrywashere well it supposed to do that
Stephen James
@sjames1958gm
Apr 06 2016 01:24
@murtinha yes. It wants to know if all of the elements in the array have the "pre" attribute and that the value of that attribute is truthy. 0 is not truthy.
@murtinha i don't think you are supposed to consider the reasonableness of the data.
henrywashere
@henrywashere
Apr 06 2016 01:27
well im looking at this guys portfolio and it doesnt do that
http://codepen.io/jinrawx/pen/QNNZYm
nsloc22
@nsloc22
Apr 06 2016 01:28
@henrywashere ok I get it now
Eric Murta
@murtinha
Apr 06 2016 01:29
@sjames1958gm let me show you my code.. but I'm not checking for hasproperty though, I'm gonna implement that later
function truthCheck(collection, pre) {
  // Is everyone being true?
  var check=0;

  for(i=0;i<collection.length;i++){
  if(collection[i][pre]===true){
    check++;
  }
}

  if(check==collection.length){
    return true;
  }
  else{
    return false;
  }
}

truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex");
Stephen James
@sjames1958gm
Apr 06 2016 01:30
@murtinha you can do this to shorten the code return check===collection.length
@murtinha Also if you take out the === true (which is what an if () is doing anyway you might not need the hasProperty
Eric Murta
@murtinha
Apr 06 2016 01:31
@sjames1958gm I'm gonna give it a look later, thanks man!
CamperBot
@camperbot
Apr 06 2016 01:31
murtinha sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 462 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Eric Murta
@murtinha
Apr 06 2016 01:34
@sjames1958gm that solved it hahahaha!!
Stephen James
@sjames1958gm
Apr 06 2016 01:35
@murtinha Just to show a different way (I have been trying to use some of the array functions)
function truthCheck(collection, pre) {
  return collection.reduce(function(prev, curr) {
    return prev && Boolean(curr[pre]);
  }, true);
}
rigaac
@rigaac
Apr 06 2016 01:38
Where Art Thou algorithm is killing me
nsloc22
@nsloc22
Apr 06 2016 01:41
@henrywashere you have changed the order , should be like this
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#Mynavbar">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand navfont" style="color:white;" href="#">HenryWasHere</a>
Stephen James
@sjames1958gm
Apr 06 2016 01:42
@rigaac What do you have so far
rigaac
@rigaac
Apr 06 2016 01:43
@sjames1958gm how do i paste code here without being annoying
Stephen James
@sjames1958gm
Apr 06 2016 01:43
help format
CamperBot
@camperbot
Apr 06 2016 01:43

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Stephen James
@sjames1958gm
Apr 06 2016 01:44
If you want paste the code in
rigaac
@rigaac
Apr 06 2016 01:44
function whereAreYou(collection, source) {
  var arr = [];

  var srcKeys =[];
  var counter = 0;
  srcKeys = Object.keys(source);


  collection.forEach(function(obj) {
    srcKeys.forEach(function(key) {
      if (obj.hasOwnProperty(key) && obj[key] === source[key]) {
        arr.push(obj);
      }
    });
  });  
  return arr;
}
henrywashere
@henrywashere
Apr 06 2016 01:45
it sort of worked
lemme take a screenshot @nsloc22
Stephen James
@sjames1958gm
Apr 06 2016 01:45
@rigaac Each property and value pair of the source object has to be present in the object from the collection
@rigaac Your code will arr.push onthe first match not after ensuring all matched.
rigaac
@rigaac
Apr 06 2016 01:46
i know i know
i have been stuck for a long time on how to match both
henrywashere
@henrywashere
Apr 06 2016 01:46
now the buttons located on the top right
Stephen James
@sjames1958gm
Apr 06 2016 01:47
@rigaac You can create a var all = true; right before your srcKeys.forEach
then reverse your test and if it fails set all = false. then only push if the srcKeys look exits with all still true
if (!obj.hasOwnProperty(key) || obj[key] !== source[key]) { all = false; }
nsloc22
@nsloc22
Apr 06 2016 01:50
This message was deleted
This message was deleted
henrywashere
@henrywashere
Apr 06 2016 01:52
can you copy and paste the whole code?
nsloc22
@nsloc22
Apr 06 2016 01:54
after it hit brand name this button goes to the top here also http://codepen.io/jinrawx/pen/QNNZYm
henrywashere
@henrywashere
Apr 06 2016 01:55
soooo...what do i have to do??
nsloc22
@nsloc22
Apr 06 2016 01:58
look here http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_navbar_collapse&stacked=h , min width is set I guess so the button never changes vertical position on the navbar
rigaac
@rigaac
Apr 06 2016 01:59
@sjames1958gm thanks i will try that out
CamperBot
@camperbot
Apr 06 2016 01:59
rigaac sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 463 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
ManBearPigg
@ManBearPigg
Apr 06 2016 02:00
Can anyone tell me why background-size: cover is not working? The background-image does not fill my div. If you open the console and inspect the elements you can see what I mean. http://codepen.io/ManBearPigg/pen/qZVJWy
henrywashere
@henrywashere
Apr 06 2016 02:02
so...i have to do something with min-width??
how do i do that?
nsloc22
@nsloc22
Apr 06 2016 02:09

@henrywashere change you code to this

      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#Mynavbar">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand navfont" style="color:white;" href="#">HenryWasHere</a>

go out of editor mode and it works like it supposed to no need to set anything

henrywashere
@henrywashere
Apr 06 2016 02:13
didnt work :(
i left editor mode as well
did you shrink yourbrowser all the way?
huh thats weird...works on my mobile phone
nsloc22
@nsloc22
Apr 06 2016 02:19
in full page view it let only shrink to 400px or so and looks ok
henrywashere
@henrywashere
Apr 06 2016 02:23
eh good enough i suppose
thanks @nsloc22
CamperBot
@camperbot
Apr 06 2016 02:23
henrywashere sends brownie points to @nsloc22 :sparkles: :thumbsup: :sparkles:
:star: 334 | @nsloc22 | http://www.freecodecamp.com/nsloc22
Steven Gallegos
@webdev1990
Apr 06 2016 02:40
how do I make the third side bar, labeled, prohect 3, to keep in line like the rest
Thanks!
*project 3
Lanitta
@DivaWeb
Apr 06 2016 02:42
@webdev1990 if you use bootstrap you will be able to make it work
Jeff
@adzam5
Apr 06 2016 02:43
@webdev1990 Your .bottom-sidebar class has float: left; change it to float: right;
Steven Gallegos
@webdev1990
Apr 06 2016 02:43
float rght
worked like a charm!!!
thank you all so much!
@adzam5 thank you!
CamperBot
@camperbot
Apr 06 2016 02:44
webdev1990 sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 393 | @adzam5 | http://www.freecodecamp.com/adzam5
Jeff
@adzam5
Apr 06 2016 02:44
@webdev1990 No problem!
Steven Gallegos
@webdev1990
Apr 06 2016 02:44
@DivaWeb thank you!!
CamperBot
@camperbot
Apr 06 2016 02:44
webdev1990 sends brownie points to @divaweb :sparkles: :thumbsup: :sparkles:
:star: 293 | @divaweb | http://www.freecodecamp.com/divaweb
Jacob Hanawalt
@JacobHanawalt
Apr 06 2016 02:58
Hey, I need help with the Random Quote Generator project. Specifically, I'm trying to implement the tweet button. I'm using the twitter button available on their website at " https://about.twitter.com/resources/buttons#tweet ", which I assume is kosher. I'm trying to get the button to tweet out whatever quote is currently being displayed, but I don't know how I would target that attribute of the button with jQuery. Any help is appreciated :)
Andrew Charlebois
@andrewchar
Apr 06 2016 03:12
looking for some input on a responsive grid system. what is your preferred grid system to use for projects?
Kiltreiser
@Kiltreiser
Apr 06 2016 03:16
Any idea where I'm going wrong with this code for the Weather App challenge?
if (navigator.geolocation) {

// get and display co-ords
    navigator.geolocation.getCurrentPosition(function(position) {
      $("#location").html("Lat: " + position.coords.latitude.toFixed(2) + "<br>Long: " + position.coords.longitude.toFixed(2));

// use co-ords to query API
      var lat = position.coords.latitude.toFixed(2);
      var lon = position.coords.longitude.toFixed(2);
      var openWeatherUrl = 'api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&units=metric&APPID=786d16b7aeb873ae682b5249530172a2';
      console.log(openWeatherUrl);

// Use JSON to pass data to HTML
      getJSON(openWeatherUrl, function(json) {
      var weatherData = JSON.parse(json)
      getWeather(function(weatherData) {
        $("#weather").html(
          "Weather: " + json[0].weather[0].main + "<br>City: " + json.weather.name
       );
      });
      });
    });
}
Josh
@josh1919
Apr 06 2016 03:18
@Kiltreiser I don't think yo9u need the brackets [0], at least I didn't need to use them
Kiltreiser
@Kiltreiser
Apr 06 2016 03:19
@josh1919 Yeah, I tried with and without but still nothing.
Reginald Davis
@madblkman
Apr 06 2016 03:19
@JacobHanawalt have you been able to figure out the api part of the project? I'm having trouble finding a api that works
Kiltreiser
@Kiltreiser
Apr 06 2016 03:20
@josh1919 I'm thinking it's the getWeather part - should I be calling that from the HTML?
This is my HTML

<div class="container-fluid">
  <div class = "row text-center">
    <h2>FCC Weather App</h2>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message" id = "location">

    </div>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message" id = "weather">

    </div>
  </div>
</div>
Josh
@josh1919
Apr 06 2016 03:21
@Kiltreiser you also didn't put the $. in front of getJSON
and no ; after var weatherData = JSON.parse(json)
Kiltreiser
@Kiltreiser
Apr 06 2016 03:23
Ha, so general sloppiness is a theme here :) Thanks for that, still no dice though.
Steven Gallegos
@webdev1990
Apr 06 2016 03:24
how do i make the contact part of the nav bar go in a sstraight line, it seems to break off the last nav link
when I added a fifth one, the fifth one was left hanging
is it length?
Jeff
@adzam5
Apr 06 2016 03:27
@webdev1990 Add width: 100%; to your ul
Steven Gallegos
@webdev1990
Apr 06 2016 03:29
.mainHeader nav ul{
list-style: none;
margin: 0 auto;
width: 100%;
}
like this?
Jeff
@adzam5
Apr 06 2016 03:29
Yes
Steven Gallegos
@webdev1990
Apr 06 2016 03:30
it didnt seem to work, there might be an error somewhere else, I'll have to look really hard
Kiltreiser
@Kiltreiser
Apr 06 2016 03:30
In my console I'm getting a "$getJSON is not defined" message. How can I remedy that?
Josh
@josh1919
Apr 06 2016 03:31
@Kiltreiser No worries, That one took me a lot longer than I expected it to. You shouldn't have to call it from the HTML.if you just have the inside of the $.getJSON as you do but without the getweather function and just go with instead I think it might work $("#weather").html( "Weather: " + json[0].weather[0].main + "<br>City: " + json.weather.name );
@Kiltreiser and of course figuring out how to use the json data
Jeff
@adzam5
Apr 06 2016 03:34
Clipboard01.jpg
@webdev1990 The only change I made was the width and its working for me
@Kiltreiser Do you have a period after the $ in your getJSON?
Kiltreiser
@Kiltreiser
Apr 06 2016 03:35
@adzam5 I do now
Steven Gallegos
@webdev1990
Apr 06 2016 03:35
@adzam5 it did work on my phone! my chrome browser doesnt change though, thanks again! you are a lifesaver!
CamperBot
@camperbot
Apr 06 2016 03:35
webdev1990 sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:warning: webdev1990 already gave adzam5 points
Jeff
@adzam5
Apr 06 2016 03:36
@webdev1990 Try clearing the cache in Chrome
Kiltreiser
@Kiltreiser
Apr 06 2016 03:37
This is my Javascript now:
if (navigator.geolocation) {

// get and display co-ords
    navigator.geolocation.getCurrentPosition(function(position) {
      $("#location").html("Lat: " + position.coords.latitude.toFixed(2) + "<br>Long: " + position.coords.longitude.toFixed(2));

// use co-ords to query API
      var lat = position.coords.latitude.toFixed(2);
      var lon = position.coords.longitude.toFixed(2);
      var openWeatherUrl = 'api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&units=metric&APPID=786d16b7aeb873ae682b5249530172a2';

// Use JSON to pass data to HTML
      $.getJSON(openWeatherUrl, function(json) {
        //var weatherData = JSON.parse(json);
        //$.getWeather(function(weatherData) {
          $("#weather").html(
          "Weather: " + json.weather.main + "<br>City: " + json.weather.name
       );
      //});
    });
  });
}
Steven Gallegos
@webdev1990
Apr 06 2016 03:39
@adzam5 hmm i cleared the cache, and still the same, it worked on firefox though!
Jeff
@adzam5
Apr 06 2016 03:40
@Kiltreiser Try adding http:// to the beginning of the URL
@webdev1990 Interesting. I made the change in Vivaldi which is built on Chrome
Kiltreiser
@Kiltreiser
Apr 06 2016 03:41
Now getting this error after adding https:// - "https://api.openweathermap.org/data/2.5/weather?lat=24.18&lon=120.62&units=metric&APPID=786d16b7aeb873ae682b5249530172a2 Failed to load resource: net::ERR_CONNECTION_REFUSED"
That URL worked earlier today...
Steven Gallegos
@webdev1990
Apr 06 2016 03:42
@adzam5 hmm, that is interesting,maybe i will log out and just wait a day
Jeff
@adzam5
Apr 06 2016 03:42
@Kiltreiser just http:// no "s"
Kiltreiser
@Kiltreiser
Apr 06 2016 03:42
If I don't add the "s" I get another error saying that it has to be https...
Jeff
@adzam5
Apr 06 2016 03:43
@Kiltreiser That's strange. I didn't use https when I did the weather app
Kiltreiser
@Kiltreiser
Apr 06 2016 03:44
'https://s.codepen.io/boomerang/907ffbf2f60e8a94c446e12ce40b718f1459914020011/index.html?editors=1010' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=24.18&lon=120.62&units=metric&APPID=786d16b7aeb873ae682b5249530172a2'. This request has been blocked; the content must be served over HTTPS.
Josh
@josh1919
Apr 06 2016 03:44
can anyone tell me why my wikipedia viewer ajax call isn't working? I keep getting a "canceled" status on my request and there is some issue with the header. Any ideas?
'''
CamperBot
@camperbot
Apr 06 2016 03:44
:bulb: to format code use backticks! ``` more info
Josh
@josh1919
Apr 06 2016 03:44
```
function searchQuery() {

  var myQuery = $('#queryText').val();
  var wikiUrl = 'https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=' + myQuery + '&callback=wikiCallback';

  $.ajax({
    url: wikiUrl,
    dataType: "jsonp",
    jsonp: "callback",
    success: function(response) {
      console.log(response);

    }
  })
}
I don't get anything on my console log
Kiltreiser
@Kiltreiser
Apr 06 2016 03:45
@adzam5 Strangely, if I don't use the "s" then it doesn't even display the co-ordinates from the start of the script.
Jeff
@adzam5
Apr 06 2016 03:47
@Kiltreiser Can you post a link to your CodePen?
Co-ords are working again, but still getting the error message about needing to be https
Jeff
@adzam5
Apr 06 2016 03:52

@Kiltreiser It's working for me. You aren't extracting the json data correctly. I changed it to

$("#weather").html(
          "Weather: " + json.weather[0].description + "<br>City: " + json.name

and it's giving me a description and my city

@Kiltreiser To get the temp you would use json.main.temp
Kiltreiser
@Kiltreiser
Apr 06 2016 03:54
@adzam5 This is nuts, still won't work for me!
Josh
@josh1919
Apr 06 2016 03:55
@Kiltreiser , @adzam5 changes worked for me
Kiltreiser
@Kiltreiser
Apr 06 2016 03:55
I checked what you did, altered mine to make it the same. Nothing. COpied and pasted your code instead. Still nothing!
Maybe an issue with OS/Browser I guess - I'm using Chrome on ChromeOS
@josh1919 @adzam5 Thanks
CamperBot
@camperbot
Apr 06 2016 03:56
kiltreiser sends brownie points to @josh1919 and @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 215 | @josh1919 | http://www.freecodecamp.com/josh1919
Josh
@josh1919
Apr 06 2016 03:56
when all else fails restart the computer and grab a coffee
CamperBot
@camperbot
Apr 06 2016 03:56
:star: 394 | @adzam5 | http://www.freecodecamp.com/adzam5
Kiltreiser
@Kiltreiser
Apr 06 2016 03:57
@adzam5 @josh1919 Still not working but I have to get to work. Will try again on WIndows when I get home tonight
Jeff
@adzam5
Apr 06 2016 03:58
@Kiltreiser That's really weird. I'll be here tomorrow if you still need help
Kiltreiser
@Kiltreiser
Apr 06 2016 03:58
All the help so far is greatly appreciated. At least now I'm fairly sure the remaining problems must be to do with my laptop :D
Josh
@josh1919
Apr 06 2016 03:59
@adzam5 any chance you could look at my wikipedia viewer issue and figure out why my ajax request isn't getting anything?

```function searchQuery() {

var myQuery = $('#queryText').val();
var wikiUrl = 'https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=' + myQuery + '&callback=wikiCallback';

$.ajax({
url: wikiUrl,
dataType: "jsonp",
jsonp: "callback",
success: function(response) {
console.log(response);

}

})
}

```
I'm screwing this up. Let me try again.
function searchQuery() {

  var myQuery = $('#queryText').val();
  var wikiUrl = 'https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=' + myQuery + '&callback=wikiCallback';

  $.ajax({
    url: wikiUrl,
    dataType: "jsonp",
    jsonp: "callback",
    success: function(response) {
      console.log(response);

    }
  })
}
Jeff
@adzam5
Apr 06 2016 04:04
@josh1919 It looks like it's something with your input. It works for me if I replace $('#queryText').val() with a word
@josh1919 Or, how are you calling the function?
Josh
@josh1919
Apr 06 2016 04:05
Im using a form
<form onSubmit="searchQuery()">
  Enter search query:
  <input type="text" name="search" id="queryText">
  <input type="submit" value="submit">
</form>
Jeff
@adzam5
Apr 06 2016 04:09
@josh1919 Try changing your submit to a button, removing the onSubmit, and adding
$('#myButton').click(function() {
    searchQuery();
}
Josh
@josh1919
Apr 06 2016 04:16
It clicks through and if I put a console.log inside the function it will work as long as it isnt inside the success part of the $.ajax @adzam5
Jeff
@adzam5
Apr 06 2016 04:19
@josh1919 Interesting. It doesn't work for me if I move the console.log outside of the success.
@josh1919 What if you remove jsonp: "callback"
Sam
@Samwise12
Apr 06 2016 04:21
For the pomodoro Clock, how do you create and fill the circle like in the example?
Josh
@josh1919
Apr 06 2016 04:23
it doesn't work either, the only clue I have is in dev tools that I get status text of cancelled.
@adzam5
Codepen of Wikiviewer
Jeff
@adzam5
Apr 06 2016 04:25
@josh1919 I removed onSubmit="searchQuery()" from your form and it's working
Josh
@josh1919
Apr 06 2016 04:26
I just saw that too, but I'm not getting anything back from my wikipedia request
Jeff
@adzam5
Apr 06 2016 04:29
@josh1919 If you remove the form completely it should work
Josh
@josh1919
Apr 06 2016 04:30
thanks @adzam5 ! I was so close yet so far. I couldn't have done it without you. Now I can go get ready for bed.
CamperBot
@camperbot
Apr 06 2016 04:30
josh1919 sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 395 | @adzam5 | http://www.freecodecamp.com/adzam5
Jeff
@adzam5
Apr 06 2016 04:31
@josh1919 Glad I was able to help!
Josh
@josh1919
Apr 06 2016 04:32
Thanks again, @adzam5 , I really appreciate it
CamperBot
@camperbot
Apr 06 2016 04:32
josh1919 sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:warning: josh1919 already gave adzam5 points
kwal0203
@kwal0203
Apr 06 2016 04:59
Hey guys, I'm doing the Wikipedia Viewer. On the example the boxes are all clickable (and link to the specific page on wikipedia). I can get the text to be links but I dont know how to make the whole div a link. Hope that makes sense any help appreciated
Maulik Darji
@maulikdarji
Apr 06 2016 05:12
@kwal0203 You can nest your <div> element in <a> to turn it into a link
i.e.
<a href="#"><div class="click">...</div></a>
Sam
@Samwise12
Apr 06 2016 05:25
How do I get a circle filling up like in the pomodoro clock?
kwal0203
@kwal0203
Apr 06 2016 05:32
@maulikdarji thanks i will try that
CamperBot
@camperbot
Apr 06 2016 05:32
kwal0203 sends brownie points to @maulikdarji :sparkles: :thumbsup: :sparkles:
:star: 588 | @maulikdarji | http://www.freecodecamp.com/maulikdarji
Bruce Young
@mutantspore
Apr 06 2016 05:40
@Samwise12 see PM
kwal0203
@kwal0203
Apr 06 2016 05:40
@maulikdarji Thanks mate, that worked
CamperBot
@camperbot
Apr 06 2016 05:40
kwal0203 sends brownie points to @maulikdarji :sparkles: :thumbsup: :sparkles:
:warning: kwal0203 already gave maulikdarji points
Savio Jomton
@enigma0160
Apr 06 2016 07:12
Can any one help me with the openweathermap api, cw is always undefined.
function getWeather(){
  $.ajax({
url: "http://api.openweathermap.org/data/2.5/weather?",
data:{appid:"4a6581d47d7b15a15ff9d9c2988a2020",lat:lat,lon:lon},
    Accept:"application/json",
    success: function(data){
      console.log(JSON.parse(data));
      cw=JSON.parse(data);
    }
  })
}
kirbyedy
@kirbyedy
Apr 06 2016 07:17
@enigma0160 is this all you have ?
kirbyedy
@kirbyedy
Apr 06 2016 07:44
@enigma0160 it should look something like this
function getWeather(city, callback) {
  var url = 'http://api.openweathermap.org/data/2.5/weather';
  $.ajax({
    dataType: "jsonp",
    url: url,
    jsonCallback: 'jsonp',
    data: { q: city },
    cache: false,
    success: function (data) {
        data.city = city;
        callback(data);
    }
  });
}
I personally did not use the .ajax call, but the .get
Chad Kreutzer
@ChadKreutzer
Apr 06 2016 07:46
@enigma0160 like @kirbyedy, I used the .get also, putting the get weather function inside the location function made the lat and long visible to it.
kirbyedy
@kirbyedy
Apr 06 2016 08:00
@enigma0160 I think I fixed it:
$.ajax({       
        url: "http://api.openweathermap.org/data/2.5/weather?lat=" + lati + "&lon=" + longi +"&APPID=4a6581d47d7b15a15ff9d9c2988a2020", 
        datatype: "json",
        type: "GET",
        async: "true",
        success: function(json){
          //alert(json.city.name);
          console.log(lati);
          console.log(longi);
          console.log(json);
        },
        error: function(resp){
          alert("an error has occurred");
        }
      });
Kiltreiser
@Kiltreiser
Apr 06 2016 08:38
I'm stuck on the same challenge, trying the .get method. SOme folks were helping earlier. They said my code worked on their machines but it doesn't work for me! Here's my http://codepen.io/Kiltreiser/pen/NNabpv
Any pointers?
I keep getting this error message in the console - "jquery.min.js:4 Mixed Content: The page at 'https://s.codepen.io/boomerang/03c3ec3ebe8bb4eefba99edd7a4af5001459931919067/index.html' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=50.07&lon=8.64&units=metric&APPID=786d16b7aeb873ae682b5249530172a2'. This request has been blocked; the content must be served over HTTPS."
I've tried using http://, https:// and nothing before the api URL but none of these work
Uğur
@UgurKurt
Apr 06 2016 08:43
guys do you know any web site that i can find small logos ?
like 40x40
Bruce Young
@mutantspore
Apr 06 2016 08:45
make sure you are using http:// for your actual codepen url and http:// for the weather api address. @Kiltreiser
Kiltreiser
@Kiltreiser
Apr 06 2016 08:46
But I don't use the codepen URL anywhere. I have no idea why it appears in the error
Bruce Young
@mutantspore
Apr 06 2016 08:46
you do when you use it in the actual browser to see it
Kiltreiser
@Kiltreiser
Apr 06 2016 08:47
@mutantspore In your linked codepen with my code I still just see the co-ords. Is there some browser setting I should be changing?
Or an extension I should disable?
Bruce Young
@mutantspore
Apr 06 2016 08:48
what are you using.. browser/OS ?
Kiltreiser
@Kiltreiser
Apr 06 2016 08:49
Aah! It's okay - it was httpsEverywhere that was causing the problem. Disabled that and it works now.
@mutantspore Thanks for the help
CamperBot
@camperbot
Apr 06 2016 08:49
kiltreiser sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1365 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Apr 06 2016 08:49
:)
Zoher Ali
@Zoher-ali
Apr 06 2016 10:07
hey can any1 help me with random quote machine
Zoher Ali
@Zoher-ali
Apr 06 2016 10:07
where should i store all quotes?
Uğur
@UgurKurt
Apr 06 2016 10:07
how can i make that div centered ?
jumbotron div i mean
any help ?
Nazim
@nazimkazim
Apr 06 2016 10:10
@Zoher-ali I stored them in a list
Zoher Ali
@Zoher-ali
Apr 06 2016 10:11
@nazimkazim list means <ol> or that list data structure?
kirbyedy
@kirbyedy
Apr 06 2016 10:12
@UgurKurt this does not look right
<div class="row">
  <div class="col-md-2"></div>
  <div class="jumbotron  col-md-8">
  </div>  
</div>
Nazim
@nazimkazim
Apr 06 2016 10:16
@Zoher-ali
list in Javascript
Stephen James
@sjames1958gm
Apr 06 2016 10:20
@Zoher-ali I think array is the more accurate term for javascript
Zoher Ali
@Zoher-ali
Apr 06 2016 10:21
@sjames1958gm i was thinking of the same :smile:
Stephen James
@sjames1958gm
Apr 06 2016 10:24
@Zoher-ali You can have an array of objects [{ quote: "blah blah", author: "me"}]
Zoher Ali
@Zoher-ali
Apr 06 2016 11:13
<script>
   var quotes = [

       {
           quote : "A warm smile is universal language of kindness",
           author : "William Arthur Ward"
       }
       ];
       var q =  quotes[0].quote;
       document.getElementById("space").innerHTML = q;
</script>
<div id="space">

</div>
why its not working ??? :worried:
Stephen James
@sjames1958gm
Apr 06 2016 11:15
@Zoher-ali Try moving your <script></script> after you <div></div>
Zoher Ali
@Zoher-ali
Apr 06 2016 11:17
@sjames1958gm huhh :smile: thnx its done
CamperBot
@camperbot
Apr 06 2016 11:17
zoher-ali sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 467 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Zoher Ali
@Zoher-ali
Apr 06 2016 11:17
but why ? doesn't it compile all in once?
Stephen James
@sjames1958gm
Apr 06 2016 11:17
@Zoher-ali Why that worked? Is that the DOM contents (<div></div>) loaded first.
@Zoher-ali No
@Zoher-ali If you are using jquery, then you will need to wrap your js that accesses the DOM (html) with $(document).ready(function() { --code here-- });
Zoher Ali
@Zoher-ali
Apr 06 2016 11:19
this is happening first time with me @sjames1958gm as i always write script before html body
@sjames1958gm i m not using jquery :shipit:
kirbyedy
@kirbyedy
Apr 06 2016 11:26
I read somewhere that is not a good practice having customs scripts before the html, because if it hangs, your whole page will block
if its at the end, at least your page will load
Zoher Ali
@Zoher-ali
Apr 06 2016 11:29
@kirbyedy ohhk coool :+1:
Savio Jomton
@enigma0160
Apr 06 2016 11:30
@kirbyedy It appears that the problem was with navigation.position function being async. So after that i put the position function at the beginning of my get weather() function, but that didnt work either. Finally i found the problem, i was parsing the response from the openweathermap using JSON.parse() and giving it to a variable, removing the JSON.parse() and just assigning the data to the variable fixed the issue. Is this usual for data from openweathermap? Thanks for helping! @kirbyedy
CamperBot
@camperbot
Apr 06 2016 11:30
enigma0160 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 806 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
Maria Campbell
@interglobalmedia
Apr 06 2016 11:30
Best practice except in the case of using Angular is to include your scripts at the bottom of the page right before your closing body tag. That should silve your issue @Zoher-ali .
brenjamin
@brenjamin
Apr 06 2016 12:03
@nsloc22
That was it, thanks!
CamperBot
@camperbot
Apr 06 2016 12:03
brenjamin sends brownie points to @nsloc22 :sparkles: :thumbsup: :sparkles:
:star: 335 | @nsloc22 | http://www.freecodecamp.com/nsloc22
Leonard G.
@524119574
Apr 06 2016 12:23
’‘’
code
‘’‘
kirbyedy
@kirbyedy
Apr 06 2016 12:23
`
3x
Kevin Mulligan
@kmulligan
Apr 06 2016 12:23
the ` key is to the left of the 1 key and is also on the same key as ~
put 3 ` in a row on a line, then hit return, paste your code, then put 3 ` on a line. The ` have to be on separate lines from the code
explain formatting
CamperBot
@camperbot
Apr 06 2016 12:24
no wiki entry for: formatting
Kevin Mulligan
@kmulligan
Apr 06 2016 12:24
explain formating
CamperBot
@camperbot
Apr 06 2016 12:24
no wiki entry for: formating
Leonard G.
@524119574
Apr 06 2016 12:25
function compareNumbers(a, b) {
  return a - b;
}
array.sort(compareNumbers)
How dose the sort method use the return value of the compareNumbers?
get it.
thanks.
@kmulligan
code question remains.
wiki format
wiki format
CamperBot
@camperbot
Apr 06 2016 12:26

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Leonard G.
@524119574
Apr 06 2016 12:29
If compareFunction(a, b) is less than 0, sort a to a lower index than b, i.e. a comes first.
If compareFunction(a, b) returns 0, leave a and b unchanged with respect to each other, but sorted with respect to all different elements. Note: the ECMAscript standard does not guarantee this behaviour, and thus not all browsers (e.g. Mozilla versions dating back to at least 2003) respect this.
If compareFunction(a, b) is greater than 0, sort b to a lower index than a.
compareFunction(a, b) must always return the same value when given a specific pair of elements a and b as its two arguments. If inconsistent results are returned then the sort order is undefined.
get this.
@sjames1958gm thanks
CamperBot
@camperbot
Apr 06 2016 12:29
524119574 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 468 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Coryphaeus
@cvdeby
Apr 06 2016 13:51
How could I get parent object without creating new global variable? I tried this structure below, but it doesn't work.
var parentObject = {
  prop1: "Value",
  prop2: {
    prop3: parentObject["prop1"]
  }
}
console.log(parentObject.prop2.prop3);
Abdul Awali
@awalthefirst
Apr 06 2016 14:05
@cvdeby
var parentObject = {
  ...
  prop2: {
     prop3:  parentObject["prop1"] // this won't work 
 ...
//why? because 'parentObject'  has not been fully created yet
Dardan Demiri
@dardandemiri
Apr 06 2016 14:14
Can someone tell me what's wrong here
It's not returning any results
Hit Rerun, because the jQuyery was not Enabled...
But the problem is still there
No results are coming from wiki
Coira Ellison
@Coira
Apr 06 2016 14:18
@dardandemiri don't put stuff in <head> in html section, use the pen settings to add bootstrap etc and anything you want to link
if you check your console you can see you're getting a lot of 404s
Dardan Demiri
@dardandemiri
Apr 06 2016 14:21
@Coira Okey I removed those, but they where there because I was coding outside Codepen
in my laptop with Sublime
Coira Ellison
@Coira
Apr 06 2016 14:22
sure, it's always a bit of a pain when moving stuff to codepen
Christian-Peter
@cpheimbach
Apr 06 2016 14:22
Hi guys, I'd love to know your opinion about the validate US phone numbers challenge
Is that something you would solve by going really in detail with a sophisticated RegExp or rather build several regExp test functions?
Dardan Demiri
@dardandemiri
Apr 06 2016 14:23
yes :(
Stephen James
@sjames1958gm
Apr 06 2016 14:23
@cpheimbach I built 4 regex
Dardan Demiri
@dardandemiri
Apr 06 2016 14:23
Here the updated version in Codepen
Christian-Peter
@cpheimbach
Apr 06 2016 14:24
I discussed it with an experienced developer friend of mine and in business he would do break it down so he can also give more detialed error message in case of user error and explain. A regExp only works or doesn't
@sjames1958gm thank you sir.
CamperBot
@camperbot
Apr 06 2016 14:24
cpheimbach sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
Dardan Demiri
@dardandemiri
Apr 06 2016 14:24
Can someone help me solve what's the problem here ?
Christian-Peter
@cpheimbach
Apr 06 2016 14:24
@dardandemiri sure I will have a look
will I come across the problem easily or do you want to describe how I can replicate it?
CamperBot
@camperbot
Apr 06 2016 14:24
:star: 472 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Dardan Demiri
@dardandemiri
Apr 06 2016 14:25
I am interested to Understand the best way how it should be and HOW I can do that
Coira Ellison
@Coira
Apr 06 2016 14:26
@dardandemiri ok, i put a search in for richard feynman and console.log'ed the output, and you get an object back with lots of stuff, but embedded in there somewhere is your search results
Stephen James
@sjames1958gm
Apr 06 2016 14:27
@dardandemiri There is no field pages in jsonData.query.pages - add console.log(JSON.stringify(jsonData)) and you can analyze the response
Coira Ellison
@Coira
Apr 06 2016 14:28
Capture.PNG
Dardan Demiri
@dardandemiri
Apr 06 2016 14:29
Yes I see the results
so the query is working
but I am accessing it wrong
?
Coira Ellison
@Coira
Apr 06 2016 14:29
yup :)
Dardan Demiri
@dardandemiri
Apr 06 2016 14:31
hmm
I tried like this: jsonData.pages.title
Uncaught TypeError: Cannot read property 'title' of undefined
Coira Ellison
@Coira
Apr 06 2016 14:33
jsondata.query.pages
which gives you an object you'll need to iterate through
Dardan Demiri
@dardandemiri
Apr 06 2016 14:35
can you explain it more
please
BenjaminDowns
@BenjaminDowns
Apr 06 2016 14:36

I can't identify the issue with my Simon game in Firefox. It works perfectly in Chrome, but the 'flashMessage' function seems to fail every time in Firefox? Anyone want to take a look and see if they can identify the problem?

http://codepen.io/BenjaminDowns/pen/YqwZdK

Coira Ellison
@Coira
Apr 06 2016 14:36
@dardandemiri do you remember how to get an object's key from one of the challenges in fcc?
Dardan Demiri
@dardandemiri
Apr 06 2016 14:37
To be honest right now I am so drained I don't know if I have remembered anything at all
Coira Ellison
@Coira
Apr 06 2016 14:38
let me see if i can find it, perhaps it'll jog your memory
go take a break for a few minutes :p
Dardan Demiri
@dardandemiri
Apr 06 2016 14:39
hahaha thank you
A big glass of WATER is missing on my stomach
Coira Ellison
@Coira
Apr 06 2016 14:39
:)
Lanitta
@DivaWeb
Apr 06 2016 14:42
has anyone done the ceasar cipher yet? And I am a little confused about the process they want. Do they want us to use the functions they gave to research or do I need to make an index?
Stephen James
@sjames1958gm
Apr 06 2016 14:49
@DivaWeb I think you will need to use those functions to get the values so you can add or subtract 13
Coira Ellison
@Coira
Apr 06 2016 14:49
@dardandemiri ok damned if i can find it, maybe you don't cover it? if you console.log(jsonData.query.pages) you'll see an object filled with objects, which are your search results
you need a way to view each result in turn, either with for (var key in results) {console.log(jsonData.query.pages[key]) } or Object.keys
Lanitta
@DivaWeb
Apr 06 2016 14:51
@sjames1958gm ok so that was my logical thought as well but no where can I find info about looping these and when I do I get told they are not functions
@sjames1958gm the only thing I can get it to do is one letter at a time and I have to tell it what letter I want done
Stephen James
@sjames1958gm
Apr 06 2016 14:52
@DivaWeb You can loop from i =0; i < str.length and examine each char
Lanitta
@DivaWeb
Apr 06 2016 14:53
@sjames1958gm yeah I have tried that and a few others lol
Stephen James
@sjames1958gm
Apr 06 2016 14:54
@DivaWeb Just make sure if the character is not A-Z that you put it in the output.
Dardan Demiri
@dardandemiri
Apr 06 2016 14:55
@Coira thank you, I will try to find a way
Lanitta
@DivaWeb
Apr 06 2016 14:55
@sjames1958gm so I have broke up the letters into their own because .charCodeAt() will only process one letter at a time
Coira Ellison
@Coira
Apr 06 2016 14:56
@dardandemiri np, you're pretty close i think. i'd use the for syntax personally
Lanitta
@DivaWeb
Apr 06 2016 14:58
@sjames1958gm and it returns the .split function with no problem. Then I try to loop it through .charCodeAt() and I get told it is not a function, but if I ask it to str.charCodeAt(2) it will give me the number for that letter from the ascii chart
Stephen James
@sjames1958gm
Apr 06 2016 15:09
@DivaWeb You can loop over the string without turning into an array var c = str.charCodeAt(i);
Lanitta
@DivaWeb
Apr 06 2016 15:12
@sjames1958gm so you think I should stop trying to turn it into a an array?
Stephen James
@sjames1958gm
Apr 06 2016 15:12
@DivaWeb Now that I think about it an array is easier to work with.
if it is a string you have to do things like slice, etc.
Lanitta
@DivaWeb
Apr 06 2016 15:13
@sjames1958gm I used .split to turn it into an array
and when I do the for loop and try to use something like var c = str.charCodeAt() it tells me that it is not a function
Stephen James
@sjames1958gm
Apr 06 2016 15:15
You need a parameters if it is an array you can do arr[i].charCodeAt(0). (assumes i is loop variable :))
Lanitta
@DivaWeb
Apr 06 2016 15:17
lets say that .split does not turn items into an array but makes them individual letters so they are no longer a string
@sjames1958gm it still only gives me the first letter and nothing else
Stephen James
@sjames1958gm
Apr 06 2016 15:19
can you post all your code?
Lanitta
@DivaWeb
Apr 06 2016 15:20

@sjames1958gm function rot13(str) { // LBH QVQ VG!

/var newString = str.split('');/
for(i = 0; i < str.length; i++){

var newString = str.charCodeAt(i);

return newString;

}

this is what I have been playing with and I have been trying to .split and run through the loop and as the complete string
@sjames1958gm hey thanks for your time and effort
CamperBot
@camperbot
Apr 06 2016 15:22
divaweb sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 473 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Apr 06 2016 15:23
@DivaWeb You return is inside the loop you need var newstring and return new string outside and newstring = str.charCodeAt(i) inside
Lanitta
@DivaWeb
Apr 06 2016 15:24
@sjames1958gm I get told I am using it out of scope when I moved it
Stephen James
@sjames1958gm
Apr 06 2016 15:25
function rot13(str) { // LBH QVQ VG!
var newString;
for(i = 0; i < str.length; i++){
newString = str.charCodeAt(i);
}
return newString;
}
That's not going to solve the problem, you actually need more stuff in the loop and it should be newString += result of ROT13
Lanitta
@DivaWeb
Apr 06 2016 15:27
@sjames1958gm yep and I get an little yellow triangle that says used out of scope
Stephen James
@sjames1958gm
Apr 06 2016 15:27
weird
Lanitta
@DivaWeb
Apr 06 2016 15:28
@sjames1958gm maybe I have just played with it too much and it is confused lol
just tried resetting everything and started from scratch and I still get the same thing lolololololol and they wonder why programmers beat theirs heads on walls lololol
@sjames1958gm but I am still only getting one letter and I think it is the last one now because it is giving me a different number which matches the last letter
Stephen James
@sjames1958gm
Apr 06 2016 15:34
newString = str.charCodeAt(i); this only assigns one letter which gets overwritten until end of string - use +=
Lanitta
@DivaWeb
Apr 06 2016 15:38
@sjames1958gm ok so now you got me lol where or how would I implement that. The places I thought the computer doesn't like lol
Stephen James
@sjames1958gm
Apr 06 2016 15:42
@DivaWeb newString is the newString that you are building as you loop through str you will assign newString += <newvalue> (make sure you have var newString = "" at the top.
@DivaWeb three things in the loop - if character is not A-Z then append to newString, else get charcode and either add or subtracr 13 if charcode is > 77 (M)
Andrew Charlebois
@andrewchar
Apr 06 2016 15:44
looking for some input/advice. I am doing research for a responsive grid system. I dont want something big and robust. i think i just want a grid system to build on. i dont need all the extra stuff like what bootstrap provides. can anyone suggest anything?
Coira Ellison
@Coira
Apr 06 2016 15:44
@andrewchar have you looked at flex-box?
Andrew Charlebois
@andrewchar
Apr 06 2016 15:45
@Coira not really no
Coira Ellison
@Coira
Apr 06 2016 15:45
good for layout, don't need extra libraries, fairly easy to use
Theodore P.
@Ierofantis
Apr 06 2016 15:45
does anyone finished tic tac toe?
Andrew Charlebois
@andrewchar
Apr 06 2016 15:46
@Coira ive seen a bit on how its apparently replacing the need, but i wasnt sure how well it was supported
Coira Ellison
@Coira
Apr 06 2016 15:47
i can't say offhand, i've only tried it on chrome and firefox and it works fine with those
Andrew Charlebois
@andrewchar
Apr 06 2016 15:49
@Coira looking at can i use. partially supported ie 11
Coira Ellison
@Coira
Apr 06 2016 15:50
you need to support ie11? i suppose that's gonna be a pain
Andrew Charlebois
@andrewchar
Apr 06 2016 15:53
i dont "need" it. the project is a re-work of my portfolio i have planned to start soon. just looking for an alternative to the big guys (bootstrap, foundation)
Jeff
@adzam5
Apr 06 2016 15:54
@andrewchar https://css-tricks.com/using-flexbox/ They say if you mix "old" syntax with "new" syntax it will work in IE 10+
codercooooder
@codercooooder
Apr 06 2016 16:03
guys, i gave in and started using flexbox. but I have am having trouble with vertical centering of text within the box, anyone care to help? http://codepen.io/ihatecoding/pen/QNOdBY
Andrew Charlebois
@andrewchar
Apr 06 2016 16:04
@adzam5 reading the complete guide to flexbox now lol we dont need to hack anymore ? :O
codercooooder
@codercooooder
Apr 06 2016 16:04
sorry reload if you want to help
the way it was didn't show the problem!!
Andrew Charlebois
@andrewchar
Apr 06 2016 16:07
@adzam5 now im wondering. since the project i am planning is my re-design and complete new portfolio that i will be applying to jobs with. if i should put flex box to practice first
Coira Ellison
@Coira
Apr 06 2016 16:08
Michael Aubrey
@mca62511
Apr 06 2016 16:15
any idea why my favicon isn't showing? http://mca62511.github.io/tic-tac-toe/
Andrew Charlebois
@andrewchar
Apr 06 2016 16:15
@mca62511 i can see one
Michael Aubrey
@mca62511
Apr 06 2016 16:16
it isn't showing up on my Chromebook, I tried hard reloading the page and it didn't help
codercooooder
@codercooooder
Apr 06 2016 16:16
@Coira that is pretty awesome but the way you did it made the boxes different widths - they were uniform before? Can we retain both features - equal width and vertical centering?
Andrew Charlebois
@andrewchar
Apr 06 2016 16:16
@mca62511 im on windows/chrome and it shows up
Michael Aubrey
@mca62511
Apr 06 2016 16:17
@andrewchar The exact same setup has worked for my other projects :/
Coira Ellison
@Coira
Apr 06 2016 16:17
@codercooooder remove the min-width/height stuff and put height: 100px and width:100px (or whatever size you want) for fixed size
Jeff
@adzam5
Apr 06 2016 16:18
@andrewchar Flexbox is a good alternative to bulky frameworks. It's not a bad idea to use it in your portfolio and get to know it.
codercooooder
@codercooooder
Apr 06 2016 16:20
@Coira I don't want them to be fixed, I want them to adjust to the other children. automatically.
Michael Aubrey
@mca62511
Apr 06 2016 16:20
@andrewchar It isn't showing up on Chromebook or on my Android phone, but it is showing on my Windows 10 laptop with Chrome
@andrewchar nevermind, got it. Somehow deleting the cache on my chromebook didn't help, but turning it off and on again did.
Andrew Charlebois
@andrewchar
Apr 06 2016 16:21
@mca62511 weird
Michael Aubrey
@mca62511
Apr 06 2016 16:22
@andrewchar Thanks for the help though
CamperBot
@camperbot
Apr 06 2016 16:22
mca62511 sends brownie points to @andrewchar :sparkles: :thumbsup: :sparkles:
:star: 395 | @andrewchar | http://www.freecodecamp.com/andrewchar
Coira Ellison
@Coira
Apr 06 2016 16:23
@codercooooder i'm not sure what you mean. try taking out the min-height stuff and adding flex: 1 0 80px; back in? i took that out but didn't need to
that line makes the boxes grow or shrink as needed
codercooooder
@codercooooder
Apr 06 2016 16:24
@Coira i guess this is pretty close to what I want: http://codepen.io/ihatecoding/pen/wGPLPm
@Coira thanks for your help
CamperBot
@camperbot
Apr 06 2016 16:24
codercooooder sends brownie points to @coira :sparkles: :thumbsup: :sparkles:
Andrew Charlebois
@andrewchar
Apr 06 2016 16:24
@adzam5 flex does not seem like its really meant to be used as an overall tool for layout. more of a tool to make stuff happen within boxes and such with flex, instead of hacking with display inline and block and such
CamperBot
@camperbot
Apr 06 2016 16:25
:star: 540 | @coira | http://www.freecodecamp.com/coira
Andrew Charlebois
@andrewchar
Apr 06 2016 16:25
i would still need to either use some system for layout or make my own to work on for layout
Coira Ellison
@Coira
Apr 06 2016 16:25
@codercooooder np! i think you were right first time with the flex: etc line
Lanitta
@DivaWeb
Apr 06 2016 16:28
does a string need to be split into individual characters to use .fromCharCode()?
Samuel Cupidon
@Zerazera
Apr 06 2016 16:28
@DivaWeb Nope
Andrew Charlebois
@andrewchar
Apr 06 2016 16:28
i could use something like simple grid http://thisisdallas.github.io/Simple-Grid/ and try my hand at flex box i suppose
Lanitta
@DivaWeb
Apr 06 2016 16:29
@Zerazera everytime I try to use it I get told it is not a function. what would cause that?
Samuel Cupidon
@Zerazera
Apr 06 2016 16:30
@DivaWeb You have to use it like this String.fromCharCode(97)
You may be confusing it with charCodeAt
fromCharCode is a String method. Without the String in front of it it's jibberish to Javascript
Lanitta
@DivaWeb
Apr 06 2016 16:31
@Zerazera well I am trying to pass str.charCodeAt through it
I am working on Ceasar's Cipher
Samuel Cupidon
@Zerazera
Apr 06 2016 16:32
```
String.fromCharCode(str.charCodeAt(0))
Lanitta
@DivaWeb
Apr 06 2016 16:34
@Zerazera I am still being told fromCharCode is not a function
Samuel Cupidon
@Zerazera
Apr 06 2016 16:35
@DivaWeb can you post your code?
codercooooder
@codercooooder
Apr 06 2016 16:36
@Coira I'm almost done, here's my last question. Is there a way to have the divs all expand so that their widths stretch to fit the container. This is pretty close ,but if they stretched and the margins were identical it would be amazing: http://codepen.io/ihatecoding/pen/KzyjRb
I want the widths to be determined by the "full" row widths.
After a row fills, I want everything to stretch. so the margins are identical, and then apply that width to all children. @Coira
Lanitta
@DivaWeb
Apr 06 2016 16:38

function rot13(str) { // LBH QVQ VG!
var newString ="";
var newCode;
for(i = 0; i < str.length; i++){

newString += str.charCodeAt(i);
//newCode = newString.split();

}
return newString.fromCharCode(str.charCodeAt(0));

}

// Change the inputs below to test
rot13("SERR PBQR PNZC");

@Zerazera
Samuel Cupidon
@Zerazera
Apr 06 2016 16:38
return String.fromCharCode(str.charCodeAt(0));
That should fix it
Lanitta
@DivaWeb
Apr 06 2016 16:40
@Zerazera well I don't get the error message now , but it is not doing the translation
Samuel Cupidon
@Zerazera
Apr 06 2016 16:41
@DivaWeb You need to do more in your for loop. So far you've broken down the string into its character coees. WHat's next?
Coira Ellison
@Coira
Apr 06 2016 16:41
@codercooooder so you get a long column of divs?
width: 100% ?
Lanitta
@DivaWeb
Apr 06 2016 16:43
@Zerazera I broke the characters down to numbers I need it to add 13 to the number so it can go through fromCharCode to get correct translation
codercooooder
@codercooooder
Apr 06 2016 16:47
@Coira I found this on stack exchange. I like the way the widths behave, but the code is weird, I'd like to avoid the function stuff if possible. I want to have everything the way you helped to make it but just have the widths stretch like this: http://codepen.io/ihatecoding/pen/KzyjrE
@Coira you see how my version has wide margins on the extreme right and left...this one has uniform margins on both side when you make the screen small and the rows fill.
again, this is my version: http://codepen.io/ihatecoding/pen/KzyjRb
Coira Ellison
@Coira
Apr 06 2016 16:54
@codercooooder if you click the 'view compiled' button in the s/o example you'll see the "pure" css. they've used @media to make the margins change when the window changes sizes
i'm not sure if there's any other way to do it
codercooooder
@codercooooder
Apr 06 2016 16:55
@Coira what are you saying i should do?
Coira Ellison
@Coira
Apr 06 2016 16:56
not sure, i'll mess around with yours for a bit, but have to go in 10 minutes or so
codercooooder
@codercooooder
Apr 06 2016 16:59
@Coira ok only if you feel like you can..is there a flexbox features that allows you to set "equal margins"
Coira Ellison
@Coira
Apr 06 2016 17:03
@codercooooder what about this? http://codepen.io/Coira/pen/zqPVeG?editors=1100
you can take the ul, li {border } stuff out, just to make it easier to see
codercooooder
@codercooooder
Apr 06 2016 17:07
@Coira i think that may do it...let me insert the filler boxes from another fix and see if we can get everything
Nathan
@natertot12
Apr 06 2016 17:12
Coira Ellison
@Coira
Apr 06 2016 17:12
@codercooooder ok good luck! got to run now :)
codercooooder
@codercooooder
Apr 06 2016 17:13
@Coira it is pretty close to what I had initially. I'd prefer the children to be more uniform..
@Coira I'd prefer to have your second version - even though the margins aren't all equal
@Coira I think I'll post to stackoverflow
Michael Aubrey
@mca62511
Apr 06 2016 17:23
for the Tic-Tac-Toe project, does the ai have to be smart at all? Right now mine is just picking random squares
Nathan
@natertot12
Apr 06 2016 17:25
@mca62511 Yeah, thats the hard part lol
codercooooder
@codercooooder
Apr 06 2016 17:25
@Coira no problem - thanks again for your help.
CamperBot
@camperbot
Apr 06 2016 17:25
codercooooder sends brownie points to @coira :sparkles: :thumbsup: :sparkles:
:star: 541 | @coira | http://www.freecodecamp.com/coira
Randy Goldsmith
@Dueldrawer8
Apr 06 2016 17:34
pretty much finished weather app.. any advice or pointers from a users point of view?
Tien Anh Nguyen
@tienanh2007
Apr 06 2016 17:38
what do I add to this api to get the description text of the article
Stephen James
@sjames1958gm
Apr 06 2016 17:45
@natertot12 the user stories day nothing about the computer being good at the game
Jeff
@adzam5
Apr 06 2016 17:53
@Dueldrawer8 Look good! You should add a space after the comma in the city and state though
Randy Goldsmith
@Dueldrawer8
Apr 06 2016 17:56
@adzam5 gotcha. I just feel i should make the words bigger or maybe center my Temperature in the middle or something
Erik Villoria
@kire73
Apr 06 2016 18:31
Hello all, working on random quote machine twitter button. I got the script and button from twitter's website and replaced the data-url and data-text with spaces, but I can't figure out how to get it to populate the random quote I've generated in the tweet user input window
JD Tadlock
@jdtdesigns
Apr 06 2016 18:31
@tienanh2007 &prop=extract
JD Tadlock
@jdtdesigns
Apr 06 2016 18:33
@kire73 &text= at the end with the quote concatenated on to it
abtak mustapha
@mustapha88
Apr 06 2016 18:33
@kire73 i'm working also on that i had lot of probleme with html
Erik Villoria
@kire73
Apr 06 2016 18:35
@jdtdesigns at the end of the JS i got from twitter?
JD Tadlock
@jdtdesigns
Apr 06 2016 18:37
@kire73 It's way easier than that. Just use this url 'https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text=' and concat the quote onto the end.
You'll need to do a check to see if it's more than 140 characters. I just cut the quote at 137 and added '...' to the end if it was too long.
james rea
@jamesrea83
Apr 06 2016 18:46
Hey guys I'm struggling with getJSON. My code works fine for some APIs, but not for others.
$("button").click(function() {
$.getJSON( url, function( data ) {
console.log(data);
});
It's driving me mad!
JD Tadlock
@jdtdesigns
Apr 06 2016 18:48
@JamesRea83 If you're using codepen, you'll need to console.log() and see it throws a header error. If it does, you'll need to get jsonp from the api instead. ;)
james rea
@jamesrea83
Apr 06 2016 18:49
This message was deleted
it's not giving me any error in console. When I enter the api address straight into the browser, I can see the JSON I want
Stephen James
@sjames1958gm
Apr 06 2016 18:53
https://api.forecast.io/forecast/75f7f0fd7d74ed9d7c22bf05397cc06d/50.775,0.286. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access. @JamesRea83
@JamesRea83 I saw this in your console.
Davide
@DavOnGit
Apr 06 2016 18:54
use JSONP
james rea
@jamesrea83
Apr 06 2016 18:55
ok that's useful! Any idea why it's not showing me that error message?
Stephen James
@sjames1958gm
Apr 06 2016 18:55
@JamesRea83 devtools browser console not the codepen console
In chrome it F-12
james rea
@jamesrea83
Apr 06 2016 18:56
aaaaaand that's a lot of red text.
@sjames1958gm @jdtdesigns thanks guys
CamperBot
@camperbot
Apr 06 2016 18:56
jamesrea83 sends brownie points to @sjames1958gm and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:star: 390 | @jdtdesigns | http://www.freecodecamp.com/jdtdesigns
:star: 474 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Apr 06 2016 18:57
@JamesRea83 There is a button near the top of the console section circle with a slash through it to clear the console.
nsloc22
@nsloc22
Apr 06 2016 19:09
doing tic tac toe challange with three.js wish me luck haha http://codepen.io/nsloc22/full/dMZVqy/
usharya
@usharya
Apr 06 2016 19:10
Couple of questions
1) How to get navbar on the left? Like this example: http://johnnycotton.me/
2) How to get that image effect in the same website? The image is constant, but moves away when we scroll. Its different from parallax :/
It seems the guy used jQuery, but can we do it with CSS?
JD Tadlock
@jdtdesigns
Apr 06 2016 19:17
@usharya He used position:fixed for the nav. The background has background-position: fixed on each section.
Jasmina Babic
@animsaj
Apr 06 2016 19:17
@usharya 2)there are 2 versions of same image logo and logowhite, probably done in photo-shop 1) position fixed is used for menu
usharya
@usharya
Apr 06 2016 19:18
Thank you so much :) @animsaj @jdtdesigns
CamperBot
@camperbot
Apr 06 2016 19:18
usharya sends brownie points to @animsaj and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:star: 472 | @animsaj | http://www.freecodecamp.com/animsaj
:star: 391 | @jdtdesigns | http://www.freecodecamp.com/jdtdesigns
usharya
@usharya
Apr 06 2016 19:19
wait, then how will I get the 2nd image on top? when I scroll?
Jasmina Babic
@animsaj
Apr 06 2016 19:21
@usharya see the sorce and demo here: http://callmenick.com/post/simple-parallax-scrolling-effect
Stephen James
@sjames1958gm
Apr 06 2016 19:22
@nsloc22 Good luck :fire:
usharya
@usharya
Apr 06 2016 19:24
@animsaj That was simple. Thank you for clearing my doubts ^_^
CamperBot
@camperbot
Apr 06 2016 19:24
usharya sends brownie points to @animsaj :sparkles: :thumbsup: :sparkles:
:warning: usharya already gave animsaj points
usharya
@usharya
Apr 06 2016 19:26
okay, another question
when should I use padding? and when to use margin?
I can add white space with margin also, so why use padding?
Jasmina Babic
@animsaj
Apr 06 2016 19:29
@usharya if you have button element with red background next to another button element with the same styling and you add margin you'll get space between 2 buttons but text inside them will be stacked to the borders, with no room. if you add padding you'll get some room around text inside the button
Dardan Demiri
@dardandemiri
Apr 06 2016 19:32
Is it possible to get the whole content of an Article in Wikipedia ?
I mean
when selecting one of the results
I am interested to show the result in my page not redirect to wikipedia
Dardan Demiri
@dardandemiri
Apr 06 2016 19:36
?
Did anyone understand me ?
Tien Anh Nguyen
@tienanh2007
Apr 06 2016 19:37
could someone explain to me this use of autocomplete
$("#input").autocomplete({
source: function(request, response) {
$.ajax({
url: "http://en.wikipedia.org/w/api.php",
dataType: "jsonp",
data: {
'action': "opensearch",
'format': "json",
'search': request.term
},
success: function(data) {
response(data[1]);
}
});
}
});
like what are request and respose
JD Tadlock
@jdtdesigns
Apr 06 2016 19:38
@dardandemiri yes
Tien Anh Nguyen
@tienanh2007
Apr 06 2016 19:38
and how does it produce a array for autocompete
Dardan Demiri
@dardandemiri
Apr 06 2016 19:38
@jdtdesigns do you know how ?
usharya
@usharya
Apr 06 2016 19:38
@jdtdesigns I cannot thank you enough for that code link bows
CamperBot
@camperbot
Apr 06 2016 19:38
usharya sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
usharya
@usharya
Apr 06 2016 19:39
@animsaj Ahh, I get it now. Thanks :)
CamperBot
@camperbot
Apr 06 2016 19:39
usharya sends brownie points to @animsaj :sparkles: :thumbsup: :sparkles:
:warning: usharya already gave jdtdesigns points
Dardan Demiri
@dardandemiri
Apr 06 2016 19:39
just how to get the content of an article
CamperBot
@camperbot
Apr 06 2016 19:39
:warning: usharya already gave animsaj points
Jasmina Babic
@animsaj
Apr 06 2016 19:40
@jdtdesigns good example! and if instead of class for the sections id was used and referred in nav-links than it will be even better @usharya
henrywashere
@henrywashere
Apr 06 2016 19:40
jdt you there?
usharya
@usharya
Apr 06 2016 19:41
@animsaj hehe that I can do ;)
JD Tadlock
@jdtdesigns
Apr 06 2016 19:41
@henrywashere yes
usharya
@usharya
Apr 06 2016 19:43
jQuery would be worth learning for front end?
henrywashere
@henrywashere
Apr 06 2016 19:44
need help with this. when you resize your browser, the social media buttons on the top stack and end up touching each other. how do i prevent this from happening?
http://codepen.io/henrywashere/pen/XdXxRO
Dardan Demiri
@dardandemiri
Apr 06 2016 19:44
Yes usharya
@usharya
With jQyery you can do anything you want with Front-End
usharya
@usharya
Apr 06 2016 19:44
I should start learning it them. Thanks @dardandemiri
CamperBot
@camperbot
Apr 06 2016 19:44
usharya sends brownie points to @dardandemiri :sparkles: :thumbsup: :sparkles:
CamperBot
@camperbot
Apr 06 2016 19:45
:star: 280 | @dardandemiri | http://www.freecodecamp.com/dardandemiri
JD Tadlock
@jdtdesigns
Apr 06 2016 19:45
you'll need to concat the search text onto the end though
@henrywashere What I would do is take away the social link text on small screens and just show the icon
then they will fit better on small sizes
usharya
@usharya
Apr 06 2016 19:49
silly question
sometimes I see coders use multiple css classes in a single line, something like this a:hover, a:active { background-color: red; }
why do we take multiple at once?
and what does it do?
henrywashere
@henrywashere
Apr 06 2016 19:50
wait, so you're saying i can make the texts appear in large screens and disappear in smaller screens?
Dardan Demiri
@dardandemiri
Apr 06 2016 19:50
That's done just because when you have the same property for a lot of things you do it like this
@usharya
JD Tadlock
@jdtdesigns
Apr 06 2016 19:51
@usharya Simply selects the hover state of 'a' and the active 'a' all in one call, instead of creating two separate declarations.
@henrywashere Yes
@henrywashere Put the text inside a span
usharya
@usharya
Apr 06 2016 19:51
lets say I do this
body a { background-color: black}
a { background-color: red}
when will it be black, and when will it be red?
henrywashere
@henrywashere
Apr 06 2016 19:52
that sounds really advanced lol
JD Tadlock
@jdtdesigns
Apr 06 2016 19:52
@henrywashere I'll post an example in a sec
henrywashere
@henrywashere
Apr 06 2016 19:52
ok thank you
Andrew
@andrewpalfenier
Apr 06 2016 19:53
@usharya The second declaration will override the first in your CSS as long as they have the same specificity
usharya
@usharya
Apr 06 2016 19:53
ahh @andrewpalfenier Thank you
CamperBot
@camperbot
Apr 06 2016 19:53
usharya sends brownie points to @andrewpalfenier :sparkles: :thumbsup: :sparkles:
api offline
usharya
@usharya
Apr 06 2016 19:55
what js framework to learn for front end?
Andrew
@andrewpalfenier
Apr 06 2016 19:56
@usharya FCC will eventually have tutorials for React.js It's very popular. Another popular framework is Angular.js
henrywashere
@henrywashere
Apr 06 2016 19:58
oh taht is so awesome
JD Tadlock
@jdtdesigns
Apr 06 2016 19:58
;)
usharya
@usharya
Apr 06 2016 19:58
@andrewpalfenier I was reading that angular might get obsolete in the future, if google moves onto something else :/
henrywashere
@henrywashere
Apr 06 2016 19:59
but i have no idea what the CSS stuff does

i span {
display: none;
}

@media screen and (min-width: 600px) {
i span {
display: initial;
}
}

Andrew
@andrewpalfenier
Apr 06 2016 20:00
@usharya Angular 2.0 will be released soon. It apparently has played catch-up with React.js and has a lot of similar features added in this new version
usharya
@usharya
Apr 06 2016 20:00
@jdtdesigns you can also use hidden for the media query?
@andrewpalfenier Learning react will be a safe bet then?
Andrew
@andrewpalfenier
Apr 06 2016 20:01
@usharya I'd say so. Honestly the more frameworks you learn, the more hireable you are as a developer. React is a safe bet for a first framework though, that's the one I plan to learn.
JD Tadlock
@jdtdesigns
Apr 06 2016 20:02
@usharya visibility: hidden will just make it transparent but not remove it from the DOM. So it will still take up space.
usharya
@usharya
Apr 06 2016 20:02
Thanks buddy ^_^
@jdtdesigns any tips for increasing performance of a page?
and how do you SEO?
JD Tadlock
@jdtdesigns
Apr 06 2016 20:03
@usharya Read up on SEO optimization. It comes down to use of semantic html5, good meta use and a few other things.
As far as performance that's dependent on how many dependencies , animations, videos, images and server speed.
Jasmina Babic
@animsaj
Apr 06 2016 20:04
@usharya use https://developers.google.com/speed/pagespeed/ you'll get all the suggestions there
hnry
@hnry
Apr 06 2016 20:05
@usharya angular 1 is kind of obsolete right now btw, there's angular 2
usharya
@usharya
Apr 06 2016 20:06
@animsaj You are still here? haha Thanks bud
CamperBot
@camperbot
Apr 06 2016 20:06
usharya sends brownie points to @animsaj :sparkles: :thumbsup: :sparkles:
:warning: usharya already gave animsaj points
usharya
@usharya
Apr 06 2016 20:10
Going now. Take care guys and thank you for all the help :)
JScapin
@JScapin
Apr 06 2016 20:11
Hello world ! I would like to know if someone here can help me telling me how add beautiffull transition between my function show() and hide() // on my wikipedia project : http://codepen.io/Skap1/full/grxyya/
CamperBot
@camperbot
Apr 06 2016 20:11

welcome to FreeCodeCamp @JScapin!

JScapin
@JScapin
Apr 06 2016 20:13
a little as a class"hvr-shutter-in-horizontal" http://ianlunn.github.io/Hover/
JD Tadlock
@jdtdesigns
Apr 06 2016 20:13
@JScapin You want the easy way or the hard way?
JScapin
@JScapin
Apr 06 2016 20:14
@jdtdesigns both if you have time but you should know i m a medium level
JD Tadlock
@jdtdesigns
Apr 06 2016 20:15
@JScapin
``
$("#searchIcon").click(function(){
   $("#searchIcon").hide();
    $("#input-group").fadeIn('slow').addClass('open');
  });

$("#closeX").click(function(){
  $("#input-group").fadeOut('slow', function() {
    $("#searchIcon").show();
  });
easy way
JScapin
@JScapin
Apr 06 2016 20:16
yess i already think about this method, but it just a slow apparition, not an amazing shuffle :D I know i ask a lot
Dardan Demiri
@dardandemiri
Apr 06 2016 20:17
Why is Codepen not allowing the API to execute !
From Localhost it's working fine
but in code pen NOT !
JD Tadlock
@jdtdesigns
Apr 06 2016 20:17
@dardandemiri console.log(data) and see what you get
Dardan Demiri
@dardandemiri
Apr 06 2016 20:18
where should I put it ?
In the end of the script ?
JScapin
@JScapin
Apr 06 2016 20:18
@dardandemiri it works dor me and I would like to say, your app is beautfull, good good idea the background
Coy Sanders
@coymeetsworld
Apr 06 2016 20:19
yeah app works for me too @dardandemiri
Dardan Demiri
@dardandemiri
Apr 06 2016 20:20
Thank you @JScapin and @coymeetsworld
CamperBot
@camperbot
Apr 06 2016 20:20
dardandemiri sends brownie points to @jscapin and @coymeetsworld :sparkles: :thumbsup: :sparkles:
henrywashere
@henrywashere
Apr 06 2016 20:20
hey jdt, i copied and pasted your CSS code and placed the texts inside a span tag...but its not working.
http://codepen.io/henrywashere/pen/XdXxRO
CamperBot
@camperbot
Apr 06 2016 20:20
:star: 477 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
:star: 275 | @jscapin | http://www.freecodecamp.com/jscapin
Dardan Demiri
@dardandemiri
Apr 06 2016 20:20
I submit it then
:D Thanks a lot
:D
Coy Sanders
@coymeetsworld
Apr 06 2016 20:20
nice work :thumbsup:
JScapin
@JScapin
Apr 06 2016 20:21
I'm going to finich this challenge too :)
Dardan Demiri
@dardandemiri
Apr 06 2016 20:26
Good Luck :P
Stephen James
@sjames1958gm
Apr 06 2016 20:26
@dardandemiri I would add the ability to hit enter in the search box
Dardan Demiri
@dardandemiri
Apr 06 2016 20:27
I have added that
$("#sInput").keyup(function(event){
    if(event.keyCode == 13){
        $(".sbutton").click();
    }
});
but don't know why it's not working on codepen
in Localhost it's working fine
now I am uploading it in my website
JD Tadlock
@jdtdesigns
Apr 06 2016 20:31
@henrywashere That's because you're using Bootstrap. If you want a custom page, don't use BS. Do your own css. Bootstrap is very strict and uses important for almost all it's css which will have to overridden using !important. It is designed to build a page quickly using their css. Otherwise it's much easier just to code on your own. ;)
henrywashere
@henrywashere
Apr 06 2016 20:32
aw that sucks
Dardan Demiri
@dardandemiri
Apr 06 2016 20:33
hmm interesting
henrywashere
@henrywashere
Apr 06 2016 20:33
oh well, thanks @jdtdesigns for the help
CamperBot
@camperbot
Apr 06 2016 20:33
henrywashere sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
Stephen James
@sjames1958gm
Apr 06 2016 20:33
@dardandemiri Worked for me
CamperBot
@camperbot
Apr 06 2016 20:33
:star: 392 | @jdtdesigns | http://www.freecodecamp.com/jdtdesigns
Stephen James
@sjames1958gm
Apr 06 2016 20:33
@dardandemiri CodePen hates you :-1:
Tim Signore
@Timsig
Apr 06 2016 20:47
Hello - has anyone tackled the wikipedia challenge? I can't find how to get round the origin (codepen) not being allowed access to the api when i send the request. Any ideas?
Jonathan Coleman
@jondcoleman
Apr 06 2016 21:01
@Timsig look into jsonp
Tim Signore
@Timsig
Apr 06 2016 21:05
Thanks @jondcoleman , I just did. Practically, you just add &callback=? to your request url and it works. Or am i missing something
CamperBot
@camperbot
Apr 06 2016 21:05
timsig sends brownie points to @jondcoleman :sparkles: :thumbsup: :sparkles:
:star: 619 | @jondcoleman | http://www.freecodecamp.com/jondcoleman
JD Tadlock
@jdtdesigns
Apr 06 2016 21:05
The hard way :P
Jonathan Coleman
@jondcoleman
Apr 06 2016 21:11
@Timsig depends on how you are doing your ajax - you'll need to change some request configuration options potentially
Tim Signore
@Timsig
Apr 06 2016 21:12
OK, thanks. I'll do some reading...
Dardan Demiri
@dardandemiri
Apr 06 2016 21:13
A friend is asking me
can I start from the middle of the cors
course
here in freecodecamp
because he is a really good developer, he doesn't want to go throw all the Basic stuff
?
Any idea ?
Chris Dziewa
@chrisdziewa
Apr 06 2016 21:15
@dardandemiri all he has to do is finish the projects
unless it has changed, they are the links with the asterisks next to the titles
Slusherman
@Slusherman
Apr 06 2016 21:21
stuck on 'smallest common multiple'
function smallestCommons(arr){
  var stop = false;
  var counter = 2;
  var numOne = [];
  var numTwo = [];
  var lowestCommon;
  var testCriteria = false;
  var noRemains = 0;
  var answer;
  var bigNum;
  var smallNum;

  //Use this to check how many numbers the lowest common multiple needs to be divided by
  if(arr[0] > arr[1]){
    bigNum = arr[0];
    smallNum = arr[1];
  } else {
    bigNum = arr[1];
    smallNum = arr[0];
  }

  //Get the lowest common multiple from input
  while(stop === false){
    numOne.push(arr[0]*counter);
    numTwo.push(arr[1]*counter);
    counter++;
    for(var test in numOne){
      for(var number in numTwo){
        if(numTwo[number] === numOne[test]){  
          noRemains = 0;
          for(var i = smallNum; i < bigNum; i++){
            if(numTwo[number]%i === 0){
              noRemains++;
            }
            if(noRemains == (bigNum - smallNum)){
              answer = numTwo[number];
              stop = true;
            }
          }        
        }
      }
    }
}
  return answer;
}

smallestCommons([1,5]);
Stephen James
@sjames1958gm
Apr 06 2016 21:46
@Slusherman That seems much more complex than needed.
Slusherman
@Slusherman
Apr 06 2016 21:48
@sjames1958gm I can keep it simple until I need to check if the lowest common multiple is able to be divided by every number between the two inputs
not sure of how else to do it
Stephen James
@sjames1958gm
Apr 06 2016 21:49
Write a small function that computes the smallest common of two numbers. Then call it on the first two numbers, then take that result and the next number repeat until you run out of numbers
Solve [1,2] then that value and 3, etc
Slusherman
@Slusherman
Apr 06 2016 21:51
for smallestCommons([1,13]); did you need to have //noprotect in your code?
I see what your saying
Stephen James
@sjames1958gm
Apr 06 2016 21:52
@Slusherman no because I did it stepwise
Gianni de Luca
@giannidluca
Apr 06 2016 21:58
hey guys. I can't move my list to the center
i mean only moves the text but no the numbers
Stephen James
@sjames1958gm
Apr 06 2016 21:59
@Slusherman I had one loop in my smallest common function and one loop in my main function that looped through the range of values calling the smallest common function
Islam Ibakaev
@dagman
Apr 06 2016 22:03
@Slusherman
function range(arr) {
 arr = arr.sort();
 var array = [];
 for (var i = arr[arr.length - 1]; i > arr[0]; i--) {
   array.push(i);
 }
 return array;
}

function gcd (x, y) {
  return (x % y === 0) ? y : gcd(y, x%y);
}

function lcm (x, y) {
  return (x * y) / gcd(x, y); 
}

function smallestCommons(arr) {
  var array = range(arr);
  return array.reduce(function(x, y) {
    return lcm(x, y); 
  });
}

smallestCommons([1, 5]);
Slusherman
@Slusherman
Apr 06 2016 22:07
@dagman @sjames1958gm Thanks for the help guys, I'm unstuck! I see now that I need to divide and conquer with the code
CamperBot
@camperbot
Apr 06 2016 22:07
slusherman sends brownie points to @dagman and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 376 | @dagman | http://www.freecodecamp.com/dagman
:star: 478 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Islam Ibakaev
@dagman
Apr 06 2016 22:09
@Slusherman read this https://en.wikipedia.org/wiki/Euclidean_algorithm to understand my decision (if you need to)
Jacob
@Ajacmac
Apr 06 2016 22:12

Doing the tribute page...https://codepen.io/Ajacmac/pen/oxpgvW

I'm having issues with spacing, and I can't figure out how to get that spacing line Quincy has at the bottom. Where should I look for advice on margins/padding? I can't seem to get either to apply at all.

Jacob
@Ajacmac
Apr 06 2016 22:20
...figured it out. "padding: Apx, Bpx, Cpx, Dpx;" doesn't seem to work, but having each side explicitly stated works
EternityElephant
@EternityElephant
Apr 06 2016 22:26
hey if anyone has a second i need help with my Wikipedia search codepen. Whenever i return the value of what is in the searchbox all i get is what is displayed by default http://codepen.io/Lewis17/pen/dMZxvJ?editors=1111
Gianni de Luca
@giannidluca
Apr 06 2016 22:28
hey guys a question. i'm about to start my portfolio
here you can learn how yo create a navabar?
because in previous lessons don't///
Stephen James
@sjames1958gm
Apr 06 2016 22:29
@Slusherman :+1:
EternityElephant
@EternityElephant
Apr 06 2016 22:34
ok i figure it out nevermind
Camoen
@Camoen
Apr 06 2016 22:34

I'm trying to pull from wikipedia API for the Wikipedia viewer zipline. I have tried via $.getJSON with "?callback=?" appended to the url and via Ajax with dataType:jsonP. Both give me the same error:

Refused to execute script from 'https://en.wikipedia.org/w/api.php?format=json&action=query&list=search&srs…64&utf8=?callback=jQuery22205327241824433848_1459979166636&_=1459979166637' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

Am I missing something simple? Through Chrome's console log I can see that the data has been imported inside "api.php", but I'm not sure how to access it in my javascript code!

http://codepen.io/Camoen/pen/ZWagZe

Malcolm
@noinkling
Apr 06 2016 22:35
@Camoen Looks like you're not appending the callback parameter correctly
EternityElephant
@EternityElephant
Apr 06 2016 22:36
Brian
@BrianCodes33
Apr 06 2016 22:37
i need someone who needs me to fix a website for them, but need some help along the way. please text me for help
Malcolm
@noinkling
Apr 06 2016 22:37
@Camoen Right now it looks like ?bunch=of&other=params?callback=? when it should look like ?bunch=of&other=params&callback=?
Stephen James
@sjames1958gm
Apr 06 2016 22:37
@Camoen Put a & before callback=?
Camoen
@Camoen
Apr 06 2016 22:37
I'll try it
@noinkling @sjames1958gm thanks, can't believe it was that simple -_-
CamperBot
@camperbot
Apr 06 2016 22:38
camoen sends brownie points to @noinkling and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 651 | @noinkling | http://www.freecodecamp.com/noinkling
:star: 479 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
prashant
@findname
Apr 06 2016 22:41
someone how can the white space be fixed by green without any shifting the imagehttps://codepen.io/findname/pen/qZPwWX?editors=1100
Jeff
@adzam5
Apr 06 2016 22:47
@findname
body {
  background-color: #93B874;
}
Gianni de Luca
@giannidluca
Apr 06 2016 22:49
@EternityElephant nice
ehekatlOf
@ehekatlOf
Apr 06 2016 22:57
hey guys
can I get honest feedback on my portfolio?
it's my final project for the frontend cert
feeding pretty at a loss on what I want on the first page
but let me know how the other pages look
ehekatlOf
@ehekatlOf
Apr 06 2016 23:03
I was thinking about adding particle.js to the background, but I don't know if that would be too cheesy
Jeff
@adzam5
Apr 06 2016 23:11
@ehekatlOf Looks good! The only thing I don't like is in a narrow window the FCC contact button takes up 2 lines
ehekatlOf
@ehekatlOf
Apr 06 2016 23:25
Oh let me look into that in a bit. Thanks @adzam5
CamperBot
@camperbot
Apr 06 2016 23:25
ehekatlof sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 396 | @adzam5 | http://www.freecodecamp.com/adzam5
Paul Borawski
@iAmNawa
Apr 06 2016 23:29
@ehekatlOf looks good!
The main title could be different though, maybe change it to your actual name
ehekatlOf
@ehekatlOf
Apr 06 2016 23:31
yeah haha
still trying to figure out what I want the first page to look like
thanks @iAmNawa
CamperBot
@camperbot
Apr 06 2016 23:31
ehekatlof sends brownie points to @iamnawa :sparkles: :thumbsup: :sparkles:
:star: 349 | @iamnawa | http://www.freecodecamp.com/iamnawa
random-x
@random-x
Apr 06 2016 23:35
@ehekatlOf looks good to me :) one quick thing: you should really wrap your jquery inside the standard $("document").ready() wrapper to ensure the js works consistently
ehekatlOf
@ehekatlOf
Apr 06 2016 23:36
yeah it's a bad habbit of mine I really should get used to doing normally
like I only do it normally when I'm using jquery UI
because otherwise it tends not to work
random-x
@random-x
Apr 06 2016 23:38
here, be lazy: just use
$(function() {
//code here
});
ehekatlOf
@ehekatlOf
Apr 06 2016 23:38
already added :p
thanks though
random-x
@random-x
Apr 06 2016 23:38
a lot less typing :D
haha.. good man
ehekatlOf
@ehekatlOf
Apr 06 2016 23:38
oh that works too?
nice!
random-x
@random-x
Apr 06 2016 23:38
*or woman
yep.. it's shorthand
Jacob
@Ajacmac
Apr 06 2016 23:52
Should I be able to apply classes to bootstrap row divs?
I'm trying to change the font size for everything in the row and it isn't working, but when I make it local to one column in the row it works.
ehekatlOf
@ehekatlOf
Apr 06 2016 23:56
why don't you just add a class to everything you want the font-size to apply to?