These are chat archives for FreeCodeCamp/HelpFrontEnd

1st
Apr 2016
Pawan
@pawan92
Apr 01 2016 00:11
http://codepen.io/pawan92/pen/zqzWYB
can anyone point me to somewhere i can better understand the wiki api? the one that was provided i have no clue what im supposed to be doing with that?
Jason Boxman
@jboxman
Apr 01 2016 00:20
Because UI isn't my forte, I have to ask: What's the design technique to build the UI of the Simon game? CSS 3 shapes? Canvas? Some other approach?
nsloc22
@nsloc22
Apr 01 2016 00:30
@jboxman canvas sucks in my opinion go with css
Jason Boxman
@jboxman
Apr 01 2016 00:30
Okay
Any resources you can suggest I look at?
I'd certainly rather use the DOM, it makes events easier from what I read
Sephem
@Sephem
Apr 01 2016 00:32
how do I make the text responsive?
nsloc22
@nsloc22
Apr 01 2016 00:32
@jboxman you can read anything on canvas and see how tedious it is
Coy Sanders
@coymeetsworld
Apr 01 2016 00:33
use on click function in jQuery @Sephem
make sure you import jQuery in codepen if you haven't already
nsloc22
@nsloc22
Apr 01 2016 00:35
@jboxman go through http://www.w3schools.com/ materials for basics, read official documentation for more
Meet Mangukiya
@meetmangukiya
Apr 01 2016 00:43
why doesnt this work?
var time = new date();
document.write(time.getTime());
RyanEnright
@RyanEnright
Apr 01 2016 00:58
I got this to work with an image but can't figure out the correct syntax for these bootstrap Icons. How do I go about pushing a <i class="wi wi-day-sunny icons"></i> to imgIcon?http://codepen.io/RyanlEnright/pen/bprWBY
Michael Martin
@michaelamartin
Apr 01 2016 01:24
Hi there! I'm trying to get the JS to work for my Random Quote Generator Zipline, and I can't figure out why it won't pull quotes from the API I'm using. Can anyone take a look? Thanks!
http://codepen.io/mmartin712/pen/YqrwGR?editors=1010
Stephen James
@sjames1958gm
Apr 01 2016 01:24
@michaelamartin Did you include Jquery using the setting?
Theresa
@decgal
Apr 01 2016 01:28
Any idea how to make the twitter button include my quote? http://codepen.io/decgal/pen/dMzzbq?editors=1010
Michael Martin
@michaelamartin
Apr 01 2016 01:39
@sjames1958gm D'oh! That was it. Thank you!
CamperBot
@camperbot
Apr 01 2016 01:39
michaelamartin sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 391 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Apr 01 2016 01:40
I looked in the devtools console and saw $ is not defined and knew that jquery was not defined.
Matt Leonard
@matty22
Apr 01 2016 01:41
Trying to get the "computer" to flash the colors 1 at a time for Simon, but they're all flashing at the same time. Any reason why my setTimeoutisn't pausing the loop before flashing the next color?
function flashCell1() {
  $("#cell-1").removeClass("cell1Flash");
}

function flashCell2() {
  $("#cell-2").removeClass("cell2Flash");
}

function flashCell3() {
  $("#cell-3").removeClass("cell3Flash");
}

function flashCell4() {
  $("#cell-4").removeClass("cell4Flash");
}

function computerTurn() {
      playerRound++;
      var randomMove = Math.floor(Math.random() * 4) + 1;
      computerMoves.push(randomMove);
      console.log(computerMoves);
      for (var i = 0; i < computerMoves.length; i++) {
        if (computerMoves[i] === 1) {
          $("#cell-1").addClass("cell1Flash");
          window.setTimeout(flashCell1, 500);
        } else if (computerMoves[i] === 2) {
          $("#cell-2").addClass("cell2Flash");
          window.setTimeout(flashCell2, 500);
        } else if (computerMoves[i] === 3) {
          $("#cell-3").addClass("cell3Flash");
          window.setTimeout(flashCell3, 500);
        } else if (computerMoves[i] === 4) {
            $("#cell-4").addClass("cell4Flash");
            window.setTimeout(flashCell4, 500);
        }
      }
      playerMoves = [];
}
Perhaps I should try setInterval?
So much better
Paul Borawski
@iAmNawa
Apr 01 2016 01:46
@DanStockham nice! everyone is always posting that but i can actually play yours
Dan Stockham
@DanStockham
Apr 01 2016 01:46
@iAmNawa Thanks
CamperBot
@camperbot
Apr 01 2016 01:46
danstockham sends brownie points to @iamnawa :sparkles: :thumbsup: :sparkles:
:star: 286 | @iamnawa | http://www.freecodecamp.com/iamnawa
Dan Stockham
@DanStockham
Apr 01 2016 01:48
It's crappy and the code is barely readable but it's done.
Brian van Vlymen
@arduino731
Apr 01 2016 02:01
is web developer best to use wordpress as portfolio
??
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:06
I am so close to finishing simon
I hope
but it's playing sounds really fast
I really wanted to finish tonight and submit for the certificate
any any any help would be greatly appreciated
Khademul Islam Mahin
@Mahin2k
Apr 01 2016 02:09
can someone help me?
i don't know how to change the twitters tweet text
Dan Stockham
@DanStockham
Apr 01 2016 02:10
Eck
function rot13(str) { // LBH QVQ VG!
  var intValue = 0;
  var decipher = "";


  for(var i = 0; i < str.length; i++) {
    intValue = str.charCodeAt(i);
    console.log(intValue);
    if(intValue >= 77 && /\W\s/g.test(str[i]) === false ) {
      intValue -= 13;
      decipher += String.fromCharCode(intValue);

    } else {
      intValue += 13;
      decipher += String.fromCharCode(intValue);
    }
  }
  return decipher;
}

// Change the inputs below to test
rot13("SERR PBQR PNZC");
Khademul Islam Mahin
@Mahin2k
Apr 01 2016 02:10
Dan Stockham
@DanStockham
Apr 01 2016 02:10
Work you, work.
Stephen James
@sjames1958gm
Apr 01 2016 02:13
@DanStockham Eck?
Dan Stockham
@DanStockham
Apr 01 2016 02:13
@sjames1958gm As in, it's ticking me off.
Stephen James
@sjames1958gm
Apr 01 2016 02:16
@sjames1958gm I assume M is charcode 77? I appears your are going to intValue += 13 on spaces. And maybe punctuation, don't see where those are passed unchanged
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:16
so, no? anyone? my absolute last front end challenge and i'm struggling.
to just finish it
Dan Stockham
@DanStockham
Apr 01 2016 02:17
@gordondavidescu Simon game?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:21
yes
all of a sudden, hitting the new game button isn't working quite right
it should start a new game and play the first sound
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:27
really
ok, now new works again
but it very quickly plays the sequence of colors
again
and the delay function i discovered stopped working
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:33
ok look at just this bit of code
playSimonSequence = function(sequence) {
computerTurn = true;
  for (i = 0; i <= sequence.length; i++)

playSimonColor(sequence[i]);


  computerTurn = false;
}
when it executes, it quickly plays the colors
the speed with which this plays is the only thing standing between me and getting a certificate
albeit none of the user stories say that the game has to be easy to play :)
I just need some sort of delay after each color play
and setinterval doesn't work
or its friend, set other thing i can't recall
Ken Haduch
@khaduch
Apr 01 2016 02:36
@gordondavidescu - one way that you could do it is to make a setInterval function and the callback could be the function that sequences through each of the colors when the interrupt happens. You just have to maintain the state of where you are in the playback, and then clear the timer when you are finished with the playback list.
@gordondavidescu - you might have done a similar thing in the Pomodoro clock project?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:39
Hmm.
my brain hurts :(
I don't remember doing that in my awesome pomodoro
check out what i have now. it works until you get to a certain length
and then it does it fast
try it
it works well with one and two and then it hits three and bam, fast
Jayson Ash
@ScriptGeek
Apr 01 2016 02:45
@gordondavidescu I noticed when I tried it that at the beginning it repeated a color in the sequence, but when it replays it only makes the sound once when it should make 2 separate sounds.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:47
I'm not getting that
I have found an entirely new error that I think i just figured out tho
Ken Haduch
@khaduch
Apr 01 2016 02:47
@gordondavidescu - it doesn't seem to be very smooth to play, to me - things happen too quickly, I had a hard time telling when I was trying to play and when the computer was playing.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:51
that's what i am trying to fix
literally that is the thing I need help fixing
Mary
@mapruter
Apr 01 2016 02:52
anyone have a second to look at something? for some reason, i lost my social icons on the page i'm working on
Jayson Ash
@ScriptGeek
Apr 01 2016 02:55
@mapruter where do you have the .jpg files?
Mary
@mapruter
Apr 01 2016 02:55
they're not on their yet. but i use to be able to see the outline with the alt text
like i can for the portfolio images that i haven't uplaoded yet
and now they're gone from the page completely
Gordon Davidescu
@gordondavidescu
Apr 01 2016 02:57
setTimeout(function(){
playSimonColor(sequence[i]);    
},1000);
when I do THIS, it completely breaks
it stops knowing what the value of sequence[i] is
ops
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:00
that's great
Eric Murta
@murtinha
Apr 01 2016 03:00
function unite(arr1, arr2, arr3) {

 Array.prototype.slice.call(arguments).reduce(function(a,b){
   for(j=0;j<b.length;j++){   
   if(a.indexOf(b[j])==-1){
     a.push(b[j]);
   }
     }

 });


  return arr1;
}

unite([1, 3, 2], [5, 2, 1, 4], [2, 1]);
Guys, my indexOf() is wrong, its saying cannot read property "indexof" of undefined... Thats Sorte Uniion Challenge
can anybody help?
Ken Haduch
@khaduch
Apr 01 2016 03:02
@gordondavidescu - I'm having a hard time figuring out what your code is doing - especially that timeout and Loop function - looks like you are defining functions and calling them from within the function? I don't know how that works? The JS Lint that you can run warns "Don't make functions within a loop." Maybe it's working, but probably not a good practice?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:02
i removed loop
i mean, wait
i removed the timeout
I am trying to slow it down so it doesn't play all the colours at once
like, why is "wait one second before continuing" not a thing in javascript
Ken Haduch
@khaduch
Apr 01 2016 03:06
@gordondavidescu - I haven't gotten this far to have this challenge started, so I don't know how complex it will get... I'm thinking that there is a way to do this with setInterval and how you might control that? I don't know if I could cook up an example to demonstrate it, especially at this late hour. Let me see - maybe it will be my first attempt to do some part of the Simon challenge...
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:07
heh
it's funny that this is the one thing preventing me from getting a certificate
Ken Haduch
@khaduch
Apr 01 2016 03:09
@gordondavidescu - well, it's not an obvious thing about how to do this?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:12
every thing, and i mean everything, and I mean ALL things say use setinterval
problem : IT DOES NOT WORK
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:13
@murtinha you need to return a; after the for loop, otherwise the next iteration of the reduce does not have an a value.
Eric Murta
@murtinha
Apr 01 2016 03:13
@MattYamamoto thanks man!
CamperBot
@camperbot
Apr 01 2016 03:13
murtinha sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 945 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:14
@gordondavidescu I'm usually better about scrolling up to read the history, but I'm just here for a second... are you having trouble with i not being what you want it to be in your setTimeout in a loop?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:15
i'm having trouble with when i use setTimeout, it breaks the new button entirely
it makes it so that it will not play back the computer's sequence at all
when I don't use settimeout, of course, it plays back very quickly
Eric Murta
@murtinha
Apr 01 2016 03:16
@MattYamamoto how do I make it compare the latest a with the other array than? I think its just comparing the first two arrays...
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:16
all I want is to play it back slowly
Bruce Young
@mutantspore
Apr 01 2016 03:18
@gordondavidescu I haven’t done it but I think the trick is to loop through the sequence and increase the settimeout based on the loop ..
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:18
@murtinha yeah, reduce is a little tricky. In your code a is the accumulater, and b is the current array. So when you push stuff to a you need to return a, which is now the accumulated result, to the next iteration of the reduce function. That's a terrible explanation, but check out MDN as I feel like they do a decent job of explaining it via example there.
@gordondavidescu yup, agreed... I haven't looked at your code in detail, but what @mutantspore is saying is probably correct.
@gordondavidescu every setTimeout I see in your code has a fixed value... so they will all essentially run at once.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:20
but that's not the issue
wait, what?
Eric Murta
@murtinha
Apr 01 2016 03:20
@MattYamamoto I got what you're saying, I'd be abble to easily do it using for for but I like to know about other functions... but it seems that its not comparing the accumlated array with the second or third or forth next array...]
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:21
@murtinha seems to work for me if I just return a; after the for loop.
Eric Murta
@murtinha
Apr 01 2016 03:22
@MattYamamoto it doesnt recognize it... I need to return arr1 for it to display something
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:22
this is the problem area as far as i know
playSimonSequence = function(sequence) {
computerTurn = true;
  for (i = 0; i <= sequence.length; i++)

playSimonColor(sequence[i]);

  computerTurn = false;
}
if i wrap playSimonColor in a timeOut, it entirely stops working
the new button won't start a new game
etc
Eric Murta
@murtinha
Apr 01 2016 03:23
@MattYamamoto it solved the indexof error though, but.. let me show you
Mary
@mapruter
Apr 01 2016 03:23
@ScriptGeek ok i placed some placeholder images and i still don't see it
Eric Murta
@murtinha
Apr 01 2016 03:23
function unite(arr1, arr2, arr3) {
  var array=Array.prototype.slice.call(arguments);
 array.reduce(function(a,b){
   for(j=0;j<b.length;j++){   
   if(a.indexOf(b[j])==-1){
     a.push(b[j]);
   }

     return a;

     }

 });

  return arr1;

}

unite([1, 3, 2], [5, 2, 1, 4], [2, 1]);
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:23
@murtinha oh yeah...sorry... one more thing to fix.. you want to return the results of the reduce function. so don't return arr1, but rather return Array.prototype.slice.call(......
@murtinha so get rid of the line return arr1 and then put return in front of array.reduce......
Jayson Ash
@ScriptGeek
Apr 01 2016 03:24
@mapruter I noticed there's a problem with the select tag in the form... if I remove the options from the select tag, your placeholders appear
Ken Haduch
@khaduch
Apr 01 2016 03:24
@gordondavidescu - this is a really rough idea of what I was thinking of. https://jsfiddle.net/khaduch/9z1hh8mc/2/ - hit the 'Run' button, and it sequences through a list of colors. It doesn't "flash" the color if the same color comes up twice in a row... probably have to figure out a way to do that.
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:25
@murtinha as you have it your function unite() will always just reutrn arr1, you want to return the result of reduce, which is not in arr1, but in the return of reduce.
Eric Murta
@murtinha
Apr 01 2016 03:25

@MattYamamoto its still not displaying the other arrays inside the arguments hahaha
for example
unite([1, 3, 2], [5, 2, 1, 4], [2, 1,6,7,8]);

its returning:[1,3,2,5,4]

Mary
@mapruter
Apr 01 2016 03:25
@ScriptGeek sweet. i see it now. it's missing a > tag (i knew it was going to be something teeny i missed.
@ScriptGeek thanks for your help
CamperBot
@camperbot
Apr 01 2016 03:26
mapruter sends brownie points to @scriptgeek :sparkles: :thumbsup: :sparkles:
Ken Haduch
@khaduch
Apr 01 2016 03:26
@gordondavidescu - it uses setInterval, but I don't have the weight of all of your other code to deal with, so it is a really stripped-down prototype.
CamperBot
@camperbot
Apr 01 2016 03:26
:star: 319 | @scriptgeek | http://www.freecodecamp.com/scriptgeek
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:26
@murtinha let's see your current code?
Eric Murta
@murtinha
Apr 01 2016 03:26
I mean, [1,3,2,5] its stopping at the first index of the second array there
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:27
that's really nice @khaduch
Eric Murta
@murtinha
Apr 01 2016 03:27
function unite(arr1, arr2, arr3) {
  var array=Array.prototype.slice.call(arguments);
 array=array.reduce(function(a,b){
   for(j=0;j<b.length;j++){   
   if(a.indexOf(b[j])==-1){
     a.push(b[j]);
   }

     return a;

     }

 });

  return array;

}

unite([1, 3, 2], [5, 2, 1, 4], [2, 1]);
returning:[1,3,2,5]
RyanEnright
@RyanEnright
Apr 01 2016 03:27
How could I add top margin to the container without the background image being affected?
http://codepen.io/RyanlEnright/pen/bprWBY
Eric Murta
@murtinha
Apr 01 2016 03:31
@MattYamamoto anything?
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:31
@murtinha hmm...tricky to spot.. took me a second. You have the return a inside the for loop... put it outside
Jeff
@adzam5
Apr 01 2016 03:32
@RyanEnright Add position: relative; and top: 100px; or whatever value you choose to your container class
Eric Murta
@murtinha
Apr 01 2016 03:32
@MattYamamoto wooow thanks a lot man!
CamperBot
@camperbot
Apr 01 2016 03:32
murtinha sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:warning: murtinha already gave mattyamamoto points
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:32
~~~
var timePause = 500;
for (i = 0; i <= sequence.length; i++)
{
setTimeout(function() {
playSimonColor(sequence[i]);
},timePause);
timePause = timePause + 50;
}
var timePause = 500;
  for (i = 0; i <= sequence.length; i++)
{
      setTimeout(function() {
      playSimonColor(sequence[i]);
      },timePause);
      timePause = timePause + 50;
}
this
as soon as I do this, it stops working
I take off the set timeout, and it works, just very very fast
I resolve this problem, I have a certificate and I can go to flipping bed
and I can start applying to jobs and move the hell away from this tiny apartment filled with cockroaches
one tiny tiny bug is preventing that
I just do NOT get it
RyanEnright
@RyanEnright
Apr 01 2016 03:35
@adzam5 Thanks
CamperBot
@camperbot
Apr 01 2016 03:35
ryanenright sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:35
I change it to setInterval, does not work
CamperBot
@camperbot
Apr 01 2016 03:35
:star: 374 | @adzam5 | http://www.freecodecamp.com/adzam5
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:35
I take it away, it works at lightning speed
Paul Borawski
@iAmNawa
Apr 01 2016 03:35
@gordondavidescu
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:35
I peeked at someone else's code, they have settimeout, it works for them
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:35
@gordondavidescu I think the problem lies in your playSimonColor() function. you have a background color change that is not in a setTimeout... so that will run immediately....but I'm still looking.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:35
you are nawa
Paul Borawski
@iAmNawa
Apr 01 2016 03:36
when you make a loop it’s for (var i
you’re missing var
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:36
oh?
Paul Borawski
@iAmNawa
Apr 01 2016 03:36
you have to declare i before you can use it
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:37
i added var, the new button still doesn't work as long as the settimeout or setinterval is there
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:37
@iAmNawa @gordondavidescu you don't have to, but then it becomes a global var... and that's not normally a good thing.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:37
right
and it didn't make the new button start working with settimeout
Paul Borawski
@iAmNawa
Apr 01 2016 03:38
why are you declaring a variable of half a second? just use the number when you need it
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:38
I was tinkering with making it slow down?
but no, that didn't really help
you're right
RyanEnright
@RyanEnright
Apr 01 2016 03:41
Would appreciate some feedback on my weather app. Everything seems to be checking out on my end.
https://s.codepen.io/RyanlEnright/debug/bprWBY#
Ken Haduch
@khaduch
Apr 01 2016 03:44

@gordondavidescu - I forget something that I read about doing this type of thing, where no matter what you put in the function call, such as the value of i, each separate function for the set timeout sees the final value of i. For example, this code:

var timePause = 500;
var testVar = 1;

for ( var i = 0; i < 10; i++) {
    setTimeout(function() {
      console.log("i = " + i);
    testVar++;
    console.log('testVar = ' + testVar);
  }, timePause);
  timePause += 250;
}

prints an incrementing value for testVar, but the value for i is 10 each time the function triggers. I forget the technical reason for that.

Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:44
interesting
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:45
@khaduch that's why he's calling another fucntion, that will keep the value of i
Ken Haduch
@khaduch
Apr 01 2016 03:46
@gordondavidescu - there was a way to fix that, but I have to go back to that book and see if I can quickly find it. And @MattYamamoto - it doesn't work that way... I think that the inner function only "sees" the value of i at the time it runs, and at that time it's 10 (in my example.)
Gordon Davidescu
@gordondavidescu
Apr 01 2016 03:47
ok i have to take a break
evidently i don't deserve a certificate tonight
good night all
Matt Yamamoto
@MattYamamoto
Apr 01 2016 03:48
@khaduch no, your example is using an anonymous function whose code references i... you are correct, that will not work. However, if you call another function inside of the anonymous function you will close over i and that inner funciton will maintain the correct value.
@gordondavidescu wait one sec
@gordondavidescu The issue is that you need to be using two setTimeout calls. Now, what we're currently seeing is not what I'd expect... which is why this is so strange, but at least make this change to see what the effects are.... one sec and I'll explain further.
@gordondavidescu
if (color == 1) {
    S01_audio.play();
    // first need to dealy for button press
    setTimeout(function() {
         document.getElementById("s01").style.backgroundColor = "#67e154";
         // then need to delay for the duration that the button should be lighted
         setTimeout(function() {
               document.getElementById("s01").style.backgroundColor = "#136f05";
            }, moreDelay * i);
    , delay * i}  //and delay should be increasing for each iteration
  };
something like that...except you'll need to tinker with the delays so that when i=0 you get an expected result
duckberry
@duckberry
Apr 01 2016 04:04
how come my paragraphs keep stacking on one another even though I assigned them into the same row with two col-md-6 ?
Davi Nascimento
@Davinasc
Apr 01 2016 04:24
hello
someone online?
kirbyedy
@kirbyedy
Apr 01 2016 04:28
maybe :)
Paul Borawski
@iAmNawa
Apr 01 2016 04:29
@Davinasc yes
Davi Nascimento
@Davinasc
Apr 01 2016 04:30
hehe
how i place a snippet of my code?
@iAmNawa @kirbyedy
Paul Borawski
@iAmNawa
Apr 01 2016 04:32
copy it but first type ```
kirbyedy
@kirbyedy
Apr 01 2016 04:32
wiki format
CamperBot
@camperbot
Apr 01 2016 04:32

: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

Paul Borawski
@iAmNawa
Apr 01 2016 04:32
<p>snippet here</p>
type inbetween and then press command enter to post
Davi Nascimento
@Davinasc
Apr 01 2016 04:33
'''function lookUp(firstName, prop){
// Only change code below this line
for(var i = 0; i < contacts.length; i++) {
if(firstName === contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
return contacts[i][prop];
}
}
for(i = 0; i < contacts.length; i++) {
if(firstName !== contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
return "No such contact";
}
}
for(i = 0; i<contacts.length; i++) {
if (contacts[i].hasOwnProperty(prop)) {
return 0;
} else {
return "No such property";
}
}
return 0;
// Only change code above this line
}
CamperBot
@camperbot
Apr 01 2016 04:33
:bulb: to format code use backticks! ``` more info
Davi Nascimento
@Davinasc
Apr 01 2016 04:33
.-.
```function lookUp(firstName, prop){
// Only change code below this line
for(var i = 0; i < contacts.length; i++) {
if(firstName === contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
return contacts[i][prop];
}
}
for(i = 0; i < contacts.length; i++) {
if(firstName !== contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
return "No such contact";
}
}
for(i = 0; i<contacts.length; i++) {
if (contacts[i].hasOwnProperty(prop)) {
return 0;
} else {
return "No such property";
}
}
return 0;
// Only change code above this line
}
sorry
function lookUp(firstName, prop){
// Only change code below this line
  for(var i = 0; i < contacts.length; i++) {
      if(firstName === contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
      return contacts[i][prop];
      }
  }
  for(i = 0; i < contacts.length; i++) {
    if(firstName !== contacts[i].firstName && contacts[i].hasOwnProperty(prop)) {
      return "No such contact";
    }
  }
  for(i = 0; i<contacts.length; i++) {
    if (contacts[i].hasOwnProperty(prop)) {
      return 0;
    } else {
      return "No such property";
    }
  }
  return 0;
// Only change code above this line
}
you guys can look at my code and say it 's to improve ?
Davi Nascimento
@Davinasc
Apr 01 2016 04:38
im in lesson 223 - Basic Javascript - Profile Lookup
I could go with this code , but I think it was messy
@iAmNawa @kirbyedy
Ken Haduch
@khaduch
Apr 01 2016 04:44
@Davinasc - you can do it all with only one for loop. The basic idea is that for every contact in the array, you check to see if the firstName matches. And if it does, you check to see if the property exists - return it if it does, return "No such property" if not. Then after you get all the way through the loop, if you haven't found a contact (which means you would have returned with either the property value or the "No such property") then you return "No such contact". You have to make sure that you can look at all contacts before you decide (and return) that you have "No such contact."
Davi Nascimento
@Davinasc
Apr 01 2016 04:46
function lookUp(firstName, prop){
// Only change code below this line
  for(var i in contacts) {
    if(contacts[i].firstName === firstName) {
      if(!contacts[i][prop]) {
        return "No such property";
      } else {
        return contacts[i][prop];
      }      
    }
  }
  return "No such contact";
// Only change code above this line
}
thank u @khaduch
CamperBot
@camperbot
Apr 01 2016 04:46
davinasc sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star: 830 | @khaduch | http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Apr 01 2016 04:51
@Davinasc - you're welcome...
ottomahn
@ottomahn
Apr 01 2016 05:08
help Make a person
CamperBot
@camperbot
Apr 01 2016 05:08

:point_right: algorithm make a person [wiki]

Explanation:

When I started the program I figured I just had to create the six functions mentioned in the details. However, it was not that simple. Creating them as a function was not the right way, I had to create them in a different way to make them a key.

There is also a tricky part as you need six keys no more or less, so at first I had the variable that store the original name as a key too which was wrong.

As for the usage of array, that is optional, you could also create new variable to hold the separated string if you wish but an array is easier to deal with as strings are immutable.

Read the instructions carefully, it is always a good hint in itself to run the code and check what the test results were so you know what to expect but do not fixate yourself on that. Once you understand what you need to do, this problem is very easy and straightforward.

:pencil: read more about algorithm make a person on the FCC Wiki

Luis Amador
@MrLuisAmador
Apr 01 2016 05:48
HI
Can I used my exit portfolio?
Jeremy Benson
@jb840w
Apr 01 2016 05:57
hey all, I have a few things left to do in my twitch project but I am struggling trying to get my images to hug the edges of their container, any thoughts? http://codepen.io/jb840w/full/qZPBrR/
Luis Amador
@MrLuisAmador
Apr 01 2016 05:59
@jb840w what images
the left anf right
Jeremy Benson
@jb840w
Apr 01 2016 05:59
the icon for the streamer and the game icon
yes
Luis Amador
@MrLuisAmador
Apr 01 2016 06:01
You have padding of 15px on both sides
write a class to remove them but then you will have to make your images have a border radius on the proper side
Jeremy Benson
@jb840w
Apr 01 2016 06:02
thanks @MrLuisAmador , I'll take a look at that
CamperBot
@camperbot
Apr 01 2016 06:02
jb840w sends brownie points to @mrluisamador :sparkles: :thumbsup: :sparkles:
:star: 132 | @mrluisamador | http://www.freecodecamp.com/mrluisamador
Luis Amador
@MrLuisAmador
Apr 01 2016 06:02
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
that's what you have now
what a class that will over ride it
padding-left: 0;
padding-right: 0;
then add a class with this
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
@jb840w don't forget to do the same for the right side image
Luis Amador
@MrLuisAmador
Apr 01 2016 06:08
.right-image {
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
}
.left-image {
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
.no-padding {
padding-left: 0;
padding-right: 0;
}
Jeremy Benson
@jb840w
Apr 01 2016 06:13
It's looking so much better , thanks again
Luis Amador
@MrLuisAmador
Apr 01 2016 06:13
You're welcome!
Feel free to reach out to me at any time
Jeremy Benson
@jb840w
Apr 01 2016 06:20
will do @MrLuisAmador
Mauricio
@maudevelop
Apr 01 2016 06:21
hey! im having a little bit of trouble with im guessing a var scope problem
function getWeatherGeo(lat, long) {
    'use strict';
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&APPID=" + APPID + "&units=" + unit, function (json) {
         result = (JSON.parse(JSON.stringify(json)));
        //result contains json parsed array fine here
});
    //result becomes undefined here (???)
    console.log(result);
    return result;
}
the var result is fine inside the function (json) but once it gets out of that, it becomes undefined.. any reason why?
kirbyedy
@kirbyedy
Apr 01 2016 06:26
@maudevelop is this your whole code?
or you have a link to your pen
Mauricio
@maudevelop
Apr 01 2016 06:28
no, actually my code was working alright but then i had the idea of making getWeatherGeo, getWeatherCity, getWeatherZipcode to have different methods of getting the weather
as soon as i did that im facing this problem where outside the function(json) the var somehow becomes undefined
before, all the variables were declared at the function(json) so there was no problem
Greg Duncan
@GregatGit
Apr 01 2016 06:44
@maudevelop It's very hard to debug in gitter - if you put your pen up (or other webpage) other campers can play with your code to get it working
kirbyedy
@kirbyedy
Apr 01 2016 06:46
+1 on @GregatGit
Greg Duncan
@GregatGit
Apr 01 2016 06:47
@maudevelop I would make it var result = not just
result =
you don't want to create a global varible unless you have to
You would first declare it below the line 'use strict'
Mauricio
@maudevelop
Apr 01 2016 06:52
I was thinking of manipulating the weather array (result) to HTML after that function, but apparently i found out that when JSON GET is success, it calls a function but for some reason every value you set at that function, it gets reset back when it exits out of that
So i'm not sure if it's javascript functionality like that but i just set a jsoncallback success function to set all the HTML
and get done with the json array
it's working now that way, but still confused why JS does that haha
like even setting a global variable to another setting, it would reset back when it gets out of scope of the json success function
Jeremy Benson
@jb840w
Apr 01 2016 07:37
I'm almost done with my Twitch project but I would like to get the streamer icons even when they are offline. I've looked through the API and it seems like that data is only available when the streamer is online. Any thoughts?
Bruce Young
@mutantspore
Apr 01 2016 07:46
@jb840w look at channel also. It will take 2 api calls. one for Streamer as you have and then call channels if they are offline
Robert Uivarosi
@URobert
Apr 01 2016 07:46
@gordondavidescu yw
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 07:50
anyone have advice on the zipline show local weather? even after doing the API challenges i still have no idea what any of that means.. any outside resources i could use or study to help me with the zipline?
its not simple to create..never used an api or json and the code seems like its hard
im surprised at the jump between a portfolio/tribute page to show the local weather
Jeremy Benson
@jb840w
Apr 01 2016 07:53
thanks @mutantspore , I'll pull that up right now
CamperBot
@camperbot
Apr 01 2016 07:53
jb840w sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1347 | @mutantspore | http://www.freecodecamp.com/mutantspore
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 07:54
anyone?
resources to help me understand weather api or how to use them or understand the code..
what about you @jb840w . how did you approach doing the weather app?
Jeremy Benson
@jb840w
Apr 01 2016 07:57
I understand @Dueldrawer8 , I had never heard of an api before starting FreeCodeCamp. I chose the weather underground API, read through the documentation and asked questions here and in the HelpJavaScript room. It took a few days but now I understand
Also I learned a little bit more about the javascript console in Firefox. That has been a huge tool in helping me understand when my API calls are working. I was typing "console.log(blahblahblah) for everything just to make sure it getting to the weather underground servers
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 08:02
im looking at openweathermap
it doesnt really have a documentation.. all i see is Call current weather from one location and maybe the best way is geographical location
even then it just shows api calls and api responds.. nothign about how to code it
Jeremy Benson
@jb840w
Apr 01 2016 08:05
@Dueldrawer8 openweathermap was down the day I tried which is why I went over to weather underground. They had code examples that helped me understand. Also, I learned about something called ajax which was also very useful.
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 08:08
@jb840w thank you ill look at it and read up what you suggested and see what i come up with
CamperBot
@camperbot
Apr 01 2016 08:08
dueldrawer8 sends brownie points to @jb840w :sparkles: :thumbsup: :sparkles:
:star: 279 | @jb840w | http://www.freecodecamp.com/jb840w
Jeremy Benson
@jb840w
Apr 01 2016 08:09
no problem, it's easy to get frustrated but the people here have been absolutely amazing. Happy coding
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 08:10
although on freecodecamp it says API's are a way for two devices to communicate between each other and here a quick search says an AJAX is the same thing..exchanging data between a server
yes, they are :)
Jeremy Benson
@jb840w
Apr 01 2016 08:13
exactly, as far as I can tell they are two different ways to get the same thing. I have used both in my code depending on the need
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 08:15
So are AJAX and JSON pretty much the same thing but different? Meaning I could use one or the other? Although the preference seems to be JSON
hmm..maybe not lol
Coy Sanders
@coymeetsworld
Apr 01 2016 08:56
people can use either/or @Dueldrawer8, they both do similar things just have different syntax
Markus Kiili
@Masd925
Apr 01 2016 09:03
@Dueldrawer8 AJAX is a protocol for web applications for communicating with a server. JSON is one possible form of data on such communication. It uses syntax similar to JS object literal syntax to store objects on text.
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 09:25
Don't know why this code is not working. The function would not return wiki api data
var search = $("#search").val();
$(function() {
$.getJSON("http://en.wikipedia.org/w/api.php?action=query&format=json&prop=info&generator=search&gsrsearch='+search&callback", function(data) {
console.log(data);
 }
 );
});
Stephen James
@sjames1958gm
Apr 01 2016 09:56
@Itsdenty "http://en.wikipedia.org/w/api.php?action=query&format=json&prop=info&generator=search&gsrsearch="+ search + "&callback" - in order to get your search var into the URL string
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 10:16
Thanks at sjames
@sjames1958gm
走你飛艇
@gofighting123
Apr 01 2016 10:19
@sjames1958gm hi , you are always online :smile:
Stephen James
@sjames1958gm
Apr 01 2016 10:27
@gofighting123 Same for you :)
@gofighting123 What time is it where you are.
khalsa777
@khalsa777
Apr 01 2016 10:29
facing a problem while making wikipedia viewer zipline project, the ajax request is not getting executed succesfully plz look in the js code for a moment:http://codepen.io/khalsa777/pen/zqdQzb
@Itsdenty facing same problem... probably same...
Ali
@yxorP
Apr 01 2016 10:31
Hey people, I'm started a Skype group dedicated to FCC a week ago and we have over 30 members who are active everyday. We also have a Slack team area which you will be invited too after you enter the Skype group. If you would like to join please add me on Skype @ "Kindredbay".
Stephen James
@sjames1958gm
Apr 01 2016 10:33
@khalsa777 This is cross site scripting issue, using the devtools you can see in the console. You have to use a mechanism call JSONP which gets around this.
add '&callback=?' (without the quotes to your request URL)
https://en.wikipedia.org/w/api.php?action=query&list=search&srwhat=text&format=json&callback=?&srsearch='+$('#squery').val()
khalsa777
@khalsa777
Apr 01 2016 10:36
@sjames1958gm thanks man u rock.. what did the callback do
why do we have to use it? any details?
走你飛艇
@gofighting123
Apr 01 2016 10:39
@sjames1958gm 6:30pm Asia, Taiwan.
Stephen James
@sjames1958gm
Apr 01 2016 10:40
@khalsa777 Part of the discussion is here https://en.wikipedia.org/wiki/JSONP - the addition of that parameter tells JQuery to modify the message sent to the far end to avoid the check for the originating domain equaling the remote domain.
走你飛艇
@gofighting123
Apr 01 2016 10:41
@sjames1958gm i am watching people playing dark soul on twitch :smile:
Stephen James
@sjames1958gm
Apr 01 2016 10:41
@gofighting123 lol
khalsa777
@khalsa777
Apr 01 2016 10:42
@sjames1958gm :thumbsup: thanks
CamperBot
@camperbot
Apr 01 2016 10:42
khalsa777 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 392 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
khalsa777
@khalsa777
Apr 01 2016 11:18
so far my wikipedia viewer fetches and displays results, but the data fetched from wikipedia doesnt contain any link so that I can click on the search result.. plz see code @http://codepen.io/khalsa777/pen/zqdQzb
any suggestion
走你飛艇
@gofighting123
Apr 01 2016 11:20
@khalsa777 type: 'get',
khalsa777
@khalsa777
Apr 01 2016 11:23
type: get also gives same results, without their individual links to click on
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:23
The wiki api is too complex, not even sure of the parameters to be returned
Or those to be queried
Just not getting anything returned
khalsa777
@khalsa777
Apr 01 2016 11:24
@Itsdenty u need to use &callback besides others to fetch json
走你飛艇
@gofighting123
Apr 01 2016 11:24
@khalsa777 i got response from ur code with just query "wiki"
/**/jQuery222007431514402067696_1459509616023({"batchcomplete":"","continue":{"sroffset":10,"continue"
:"-||"},"query":{"searchinfo":{"totalhits":92929},"search":[{"ns":0,"title":"Wiki","snippet":"For other
 uses, see <span class=\"searchmatch\">Wiki</span> (disambiguation). &quot;<span class=\"searchmatch
\">Wiki</span>Node&quot; redirects here. For the <span class=\"searchmatch\">Wiki</span>Node of Wikipedia
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:25
Is it necessary I use Ajax?
Can't .getJSON work?
khalsa777
@khalsa777
Apr 01 2016 11:25
@Itsdenty no .getjson also works
走你飛艇
@gofighting123
Apr 01 2016 11:25
@Itsdenty jquery 1.2 support jsonp , it works too
JScapin
@JScapin
Apr 01 2016 11:27
@ehekatlOf are you here?
khalsa777
@khalsa777
Apr 01 2016 11:28
@gofighting123 the code works. but the 2nd user story says to be able to click on result list
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:29
I expect this code to return the Api data so I can loop through to filter out what I need but it returns nothing. My console log referenced $ undefined.
var search = $("#search").val();
$(function() {

$.getJSON("http://en.wikipedia.org/w/api.php?action=query&format=json&prop=info&generator=search&gsrsearch=" + search + "&callback", function(data) {
  console.log(data);
 }
 );
});
 }
 );
});
走你飛艇
@gofighting123
Apr 01 2016 11:29
@khalsa777 add a href and get the ajax response page id with it .
JScapin
@JScapin
Apr 01 2016 11:29
hello everybody ! do you know how could i link this icons with an url to codepen?
khalsa777
@khalsa777
Apr 01 2016 11:30
@gofighting123 but theres no page id there
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:31
Ignore the extra brackets, that was an error I made while pasting the code
走你飛艇
@gofighting123
Apr 01 2016 11:31
@khalsa777 yes, i noticed that :alien:
Hemang Kumar
@hemangsk
Apr 01 2016 11:33
@Itsdenty
var url = 'https://en.wikipedia.org/w/api.php?action=query&list=search&srwhat=text&format=json&callback=?&srsearch='+$('#squery').val() ;
  console.log(url);
  $.getJSON(url, function(response){
    console.log(response);
});
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:35
Thanks @hemangsk, I will study this modification and use it for my project.
CamperBot
@camperbot
Apr 01 2016 11:35
itsdenty sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 338 | @hemangsk | http://www.freecodecamp.com/hemangsk
Hemang Kumar
@hemangsk
Apr 01 2016 11:36
:+1: :+1:
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 01 2016 11:36
But that means I need to change my input Id to squery right?
khalsa777
@khalsa777
Apr 01 2016 11:39
some one plz see, the data sent by wikipedia has no pageid in it. how to add links to click in search results http://codepen.io/khalsa777/pen/zqdQzb
khalsa777
@khalsa777
Apr 01 2016 11:43
@gofighting123 ya if there was pageid then things work..probably my url is wrong or what
Ken Haduch
@khaduch
Apr 01 2016 11:46
@JScapin - Hello there - if you just go to the CSS config tab, add an external resources and type "weather-icons", you should see a URI pop up that you can use. I think that gets you those icons.
JScapin
@JScapin
Apr 01 2016 11:49
@khaduch yeah so easy in fact but can I ask you to try this url and tell me if an icon well apeard
?
@khaduch thanks a lot of course for your brownies ^^)
CamperBot
@camperbot
Apr 01 2016 11:49
jscapin sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star: 831 | @khaduch | http://www.freecodecamp.com/khaduch
JScapin
@JScapin
Apr 01 2016 11:52
@khaduch it works :)
thank you
Ken Haduch
@khaduch
Apr 01 2016 11:52
@JScapin - you're welcome... have a great day there, and good luck!
JScapin
@JScapin
Apr 01 2016 11:53
Have a nice day too ;) !!
genuinegirl
@genuinegirl
Apr 01 2016 12:25
i am facing problems in this challenge =Line up Form Elements Responsively with Bootstrap @khaduch
Chris Morris
@chrism81
Apr 01 2016 12:26
I had difficulty with all of the algorithm scripting assignments and all of the front end development assignments/projects. I got them done by using info in the solutions and forking other projects from Code Pen. I don't feel comfortable signing off on the Academic Honesty Pledge because I took code from other places without attributing it. What's the acceptable way to use code that someone else wrote?
JScapin
@JScapin
Apr 01 2016 12:27
Can someone can explain me when I have to include functions in $(document).ready(function(){} and when i have to write my functions out of this :/
Stephen James
@sjames1958gm
Apr 01 2016 12:32
@JScapin $(document).ready(function(){} is only about when a function is called. You can write your functions outside of this and still call them within in this.
@sjames1958gm You can even have function app() { do my app code here } $(document).ready(app());
JScapin
@JScapin
Apr 01 2016 12:37
@sjames1958gm thank you I put this question because iwould like to set a variable created in a document.ready function outside of this and it didn't work
CamperBot
@camperbot
Apr 01 2016 12:37
jscapin sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 393 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
JScapin
@JScapin
Apr 01 2016 12:39
@sjames1958gm i find i have to declare variable outside like yhis they became globals
Stephen James
@sjames1958gm
Apr 01 2016 12:40
@JScapin They do become globals. What I do, to avoid name conflicts is to put all my globals in an object and reference them from that. myglobals = { };
@sjames1958gm myglobals = { queryurl: "http://blah.blah.com/, users : {"tom", "dick", "harry"}}; then reference myglobals.queryurl
Liz
@erbastian
Apr 01 2016 13:14
has anybody been able to do the wikipedia search app using CORS and not jsonp?
Sultan Shakir
@sultanshakir
Apr 01 2016 13:15
@JScapin you include functions inside document.ready when you need to run them only after the DOM hierarchy is fully constructed. You can write them outside of the ready function if you don't have a requirement of the DOM hierarchy to be fully constructed. As far as variables are concerned, you can't access them outside of the ready function if they are not attached to an object created outside of the ready function. This is because the ready function creates what is called a closure around the functions it contains.
Zayin S.Vernon
@zlone27
Apr 01 2016 13:19
Feedback for my Tribute Page - http://codepen.io/Zlone/full/KzXwBW/
Ken Haduch
@khaduch
Apr 01 2016 13:26
@genuinegirl - hello, I was busy on another problem with another camper - I have limited time now, but is there something that you need help with?
genuinegirl
@genuinegirl
Apr 01 2016 13:27
hi@khaduchthis challenge =Line up Form Elements Responsively with Bootstrap
Stephen James
@sjames1958gm
Apr 01 2016 13:27
@zlone27 Very nice page
Ken Haduch
@khaduch
Apr 01 2016 13:28
@genuinegirl - ok, what are you having trouble with - can you post some code?
Zayin S.Vernon
@zlone27
Apr 01 2016 13:28
@sjames1958gm Thank you very much ! Any other feedback ?
CamperBot
@camperbot
Apr 01 2016 13:28
zlone27 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 394 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Apr 01 2016 13:28
@zlone27 No, I really liked it, I liked the titles of the sections, I liked the formatting.
Sultan Shakir
@sultanshakir
Apr 01 2016 13:28
genuinegirl
@genuinegirl
Apr 01 2016 13:29

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
h2 {
font-family: Lobster, Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

</style>

<div class="container-fluid">
<div class="row">
<div class="col-xs-8">
<h2 class="text-primary text-center">CatPhotoApp</h2>
</div>
<div class="col-xs-4">
<a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
</div>
</div>
<img src="http://bit.ly/fcc-running-cats" class="img-responsive">
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
<p>Things cats <span class="text-danger">love:</span></p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<div class="row">
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
</div>
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
</div>
</div>
<div class="row">
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Loving</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Lazy</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Crazy</label>
</div>
</div>
<input type="text" class="form-control" placeholder="cat photo URL" required>
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
</form>
</div>

i dont understand what to do @khaduch
Zayin S.Vernon
@zlone27
Apr 01 2016 13:30
@sjames1958gm Again Thank You !
CamperBot
@camperbot
Apr 01 2016 13:30
zlone27 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: zlone27 already gave sjames1958gm points
Ken Haduch
@khaduch
Apr 01 2016 13:31
@genuinegirl - they give you explicit instructions on what to do: Nest both your form's text input and submit button within a div with the class row. Nest your form's text input within a div with the class of col-xs-7. Nest your form's submit button in a div with the class col-xs-5.
@genuinegirl - so you have those two elements at the bottom of the code section the <input type="text".... and the <button type="submit"....
You juave have to next them within a div, so that means to add an opening <div class="row"> and a closing </div> at the end, after the </button> closing tag. Then for each of those inner elements, you surround each of them with another div that has the class "col-xs-7" for the first, and "col-xs-5" for the second. There are examples of that in the few lines of code just above those last two form elements.
genuinegirl
@genuinegirl
Apr 01 2016 13:37
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
<div class="row">
<div class="col-xs-7">
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
<div class="col-xs-5">
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
</div> like this @khaduch
Dylan
@dhcodes
Apr 01 2016 13:40
@genuinegirl you have many submit buttons. You only need one. also, you don't seem to have a text-input for your form
Ken Haduch
@khaduch
Apr 01 2016 13:41
@genuinegirl - on the right track. You don't have the text input, maybe you copied and pasted too many times? But all you have to do is get the input back in there and you should have it!
genuinegirl
@genuinegirl
Apr 01 2016 13:42
what is the input @khaduch
@dhcodes what is the input
Stephen James
@sjames1958gm
Apr 01 2016 13:47
@genuinegirl <input >
Dylan
@dhcodes
Apr 01 2016 13:50
@genuinegirl if you click reset code, it will bring you back to code with an input
you want to put a <div class="row"> outside the input and submit button and then put each in a div of their own based on the instructions
Ken Haduch
@khaduch
Apr 01 2016 13:52
@genuinegirl - you just have to get the code back from the post that you made, the part that is <input type="text" class="form-control" placeholder="cat photo URL" required> In the instructions, that is the "form's text input" that they are referring to.
put that in place of the button code that you posted in the div with the class "col-xs-7", as the instructions indicated.
genuinegirl
@genuinegirl
Apr 01 2016 13:57
<div class="row">
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
</div>
<input type="text" class="form-control" placeholder="cat photo URL" required>
</div>
<div class="col-xs-7">
<input type="text" class="form-control" placeholder="cat photo URL" required>
</div>
<div class="col-xs-5">
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
</div> LIKE THIS
@khaduch
??
Ken Haduch
@khaduch
Apr 01 2016 14:02
@genuinegirl - almost there - just remove (in the code that you have now) the first "submit" and "text" elements, and leave the ones that you nested inside the divs with the col-xs-* classes. And move that closing </div> tag for the row div down to the bottom... in other words, the </div> that is on line 3 of the code you just posted, down to the bottom. And make sure that your div tags are all properly nested... so that you have something like this:
<div class="row">
<div class="col-xs-7">
  (text element)
</div>
<div class="col-xs-5">
(submit button)
</div>
</div>
so you are just nesting the elements that were already there with the divs and the appropriate classes.
genuinegirl
@genuinegirl
Apr 01 2016 14:08
<div class="row">
<div class="col-xs-7">
<input type="text" class="form-control" placeholder="cat photo URL" required>
</div>
<div class="col-xs-5">
<button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
</div>
</div>
i did this and the closing tag is a mistake
codercooooder
@codercooooder
Apr 01 2016 14:16
hey i have a css transform question , any of you skilled at css transform?
Ken Haduch
@khaduch
Apr 01 2016 14:16

@genuinegirl - if you count the opening and closing tags in what you've posted here, that looks correct. Make sure that in the overall code for the page that there isn't an extra closing </div> . If I paste my code from my exercise, the end looks like this:

    <div class="row">
      <div class="col-xs-7">
    <input type="text" class="form-control" placeholder="cat photo URL" required>
      </div>
      <div class="col-xs-5">
    <button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button>
      </div>
    </div>
  </form>
</div>

Just make sure that you don't have extras in there.

codercooooder
@codercooooder
Apr 01 2016 14:17
here is my codepen, I think the problem will be clear if you look at its title: http://codepen.io/ihatecoding/pen/mPBWWo?editors=1100
genuinegirl
@genuinegirl
Apr 01 2016 14:21
thanks @khaduch
CamperBot
@camperbot
Apr 01 2016 14:21
genuinegirl sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star: 834 | @khaduch | http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Apr 01 2016 14:22
@genuinegirl - got it working? Great! That's the standard way of using the Bootstrap grid to divide sections of the page into columns. Make sure that you have that down, it's very useful when you get to projects! You're welcome and good luck!
Jean Louis Salbego
@jlouiss
Apr 01 2016 14:33
need help here: http://codepen.io/JLouisS/pen/XdeMVz
why do the icon disappear when i click on a new cell?
if i use a string it stays
David Weedmark
@DavidWeedmark
Apr 01 2016 14:39
@jlouiss no idea! I might suggest going the document.getElementById( ).innerHTML route. At least you know they'll stick in place
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:39
I'm at my wit's end
Seemingly no matter WHAT I do, the playback by the computer of the sequence happens almost instantaneously.
batilc1
@batilc1
Apr 01 2016 14:41
what have you been trying to do @gordondavidescu
?
I find it hard reading your code
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:41
make it so that it does NOT play all the colours of the sequence instantaneously
that's bad.
it shouldn't be hard to read
that means I'm crap at writing code
awesome.
this is the thing that's supposed to get me a better job (hopefully in portland) and I'm mucking it up.
Jean Louis Salbego
@jlouiss
Apr 01 2016 14:42
@gordondavidescu click on "tidy" in codepen to tidy your code
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:42
I have a family that is basically relying on me not mucking it up to cross-contintentally move us.
done
batilc1
@batilc1
Apr 01 2016 14:43
@gordondavidescu take it easy, readable code takes a lot of experience
its not just about writing with good syntax and naming, it about architecture
dont worry for that now, just tell me what you been trying to do
I see for example, there's a pause method in your code. Thats not how you want javascript to work
1st thing you should do is to refactor that logic
you have setTimeout and setInterval methods at your disposal
Are you confident with what they are and how you use them?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:44
I have been desperately trying to use settimeout
quite
this has been an ongoing struggle mind you
brb
batilc1
@batilc1
Apr 01 2016 14:45
No problem, most people including me has got stuck with this issue in sometime of our JS lives
because JS works in event loops, it lives in an asynchronous world. This is essentially what makes JS so much more powerful than other programming languages. Coming back to topic
David Weedmark
@DavidWeedmark
Apr 01 2016 14:47
@gordondavidescu have you tried setTimeout(function() ? http://www.sitepoint.com/jquery-settimeout-function-examples/
jcedborger
@jcedborger
Apr 01 2016 14:47
Anyone got a minute to have a quick look at a app I'm building with Jquery & Ajax?
Trying to sort li items by data-date attr. Can't get it to work though
batilc1
@batilc1
Apr 01 2016 14:47
what setTimeout does is that: It schedules the code inside of it to be executed at a later time, then, the code that is outside and downwards the setTimeout is run
so think about this codepiece @gordondavidescu
for(var i = 0; i < 100; i++)
      setTimeout(function() { console.log('hello')}, 500)
If you dont know how it works, you would think that this code prints out a hello once every 500 ms
But it does not!
The computer, physically runs this loop in, say ~1 microseconds
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:50
@DavidWeedmark I am actively using it
batilc1
@batilc1
Apr 01 2016 14:51
so at exactly 1 April 17:50:43 you schedule 100 console.log operations to be executed just after 500 ms
so in practice, you get 100 console.log's at the same time after 500ms has passed since this for loop had executed
David Weedmark
@DavidWeedmark
Apr 01 2016 14:52
@gordondavidescu so you are, sorry. stupid windows search function. going back to my Mac
batilc1
@batilc1
Apr 01 2016 14:52
inorder to achieve a console.log per 500ms
you have to use setInterval, which executes the code inside of it every 500ms
OR, using a little more complex logic
you must schedule the next console.log inside the setTimeout
such as
David Weedmark
@DavidWeedmark
Apr 01 2016 14:54
@gordondavidescu from what I can see it looks like you're not compensating for the delay correctly. if red and blue are both set at delay times i (game counter) they will both go off instantaneously. if you want red and then blue, it should be delay times i for one, then delay times i and then times 2 for the next one
batilc1
@batilc1
Apr 01 2016 14:55
count = 1;
setTimeout(function() {
     console.log('500ms has passed');
     if (count < 10) {
          count++;
          setTimeout(function() {
                 console.log(500 * count + 'ms has passed!');
          }, 500);
     }
}, 500);
@gordondavidescu
Gordon Davidescu
@gordondavidescu
Apr 01 2016 14:57
I see. but now I am upping the amount of the delay based on another factor, and it is still not working
I have spent literally six hours on THIS.
this ONE thing.
and now it's 11 AM EST, and I have probably about 5 hours of "work" work to get done in the next three.
and @batilc1 I appreciate your code but I am struggling to apply it to my actual issue right now.
batilc1
@batilc1
Apr 01 2016 15:00
@gordondavidescu you have a serious refactoring on your hands dude
You MUST stop using pause method
I'd suggest writing from scratch looking at your code and re-designing the execution flow
running while(true) would make your page unusable, preventing any interaction
that is not JS-way to achieve things.
c/p my code piece that will give you a scheduled running flow every 500ms, than build your algorithm editing that. Other than that, there is no quick fix to your problem, because you have based all your logic on a while(true) loop
David Weedmark
@DavidWeedmark
Apr 01 2016 15:04
@gordondavidescu what can I say? it worked when I changed your values. best of luck to you
batilc1
@batilc1
Apr 01 2016 15:13
@gordondavidescu I don't think you must finish this project to get the job you are looking for. What you want to do is learn the correct way of doing the things you want. Approach this project like a teacher trying to teach you async scheduling. Try to like the problem this project is throwing at you, instead of excessively stressing over it. You like writing code, you like learning, right? Sometimes it is way easier starting from scratch with your new knowledge, than trying to tame&refactor your previous code
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:14
well put
i only had the pause there as a desperate measure, and it didn't even work
I do love learning.
Robert Crawford
@RobertCC18
Apr 01 2016 15:16
I need help with the tic tac toe game project, I have asked for help on other projects and have gotten no responce and have had to rough it. I have no clue where to start with the tic tac toe game and any help would be apprieciated
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:18
I love the tic tac toe game.
I strongly recommend "pseudocoding" it first
and start by drawing the board, so to speak. that's where I started.
batilc1
@batilc1
Apr 01 2016 15:19
of course it wouldnt work, that kind of things are left in C++ world :) In JS you have a very very very powerful async code execution scheme. setTimeout and setInterval's are just the primitives of it. In the future, you will be using advanced async libraries like async. Maybe I am wrong, your code may be managable after all, I dont know. But if you do understand how setTimeout works, it must not be that hard adjusting the piece of code i provided you to your current code. You will be using that kind of scheduling for sure in the end. Just copy/paste it and look how you can put your own functions inside of the setTimeouts
Nicolas Medina Sanchez
@nicoms91
Apr 01 2016 15:19
Hey guys! I need some help here....Anyone know why I am not able to start/stop my timer countdown with this code?
batilc1
@batilc1
Apr 01 2016 15:19
@gordondavidescu
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:20
I hear.
Robert Crawford
@RobertCC18
Apr 01 2016 15:20
@gordondavidescu so use html to create board or use java?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:20
I would use HTML
It's all about the divs
and of course you have to use CSS to draw the lines
Robert Crawford
@RobertCC18
Apr 01 2016 15:21
ok, then what about the backend?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:21
get the board drawn first.
then you can start by figuring out how to make the board clickable.
and of course a 'new game' button to start it off
Robert Crawford
@RobertCC18
Apr 01 2016 15:22
ok, thanks @gordondavidescu will do, but i will be back soon
CamperBot
@camperbot
Apr 01 2016 15:22
robertcc18 sends brownie points to @gordondavidescu :sparkles: :thumbsup: :sparkles:
:star: 394 | @gordondavidescu | http://www.freecodecamp.com/gordondavidescu
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:24
you're very welcome. I will most likely not be here as I have an obscene amount of 'work' to do :)
batilc1
@batilc1
Apr 01 2016 15:25
@RobertCC18 i may have a roadmap for you. As @gordondavidescu told you:
  • start by drawing the board
  • make sure you can click a slot and mark it as X or O
  • make sure you cannot click a filled slot
  • design an algorithm so that after you click a slot and mark it with X or O, another empty slot at random is automatically marked by computer with O or X
  • use a timeout to delay the computer response
  • design an algorithm to check the board and be able to say if there's a winner row
  • make X or O selectable at page loading
  • make sure when you load the page, you and computer take turns to fill the slots, if there's a winner row at some point, clear the board and start again
  • make computer take smart decisions. this one is the hard part. But this is not in the user stories. At this point, you have fulfilled the project and you can research the perfect tic tac toe player on the net to optimize your computer AI
Robert Crawford
@RobertCC18
Apr 01 2016 15:27
@gordondavidescu that's too bad, i understand about lage amounts of work(I am a UNIX server admin) code camp is just 1 piece in a very large puzzle
codercooooder
@codercooooder
Apr 01 2016 15:28
Can any of you figure out what is going on with my css transition, and why my text boxes are first jumping to the origin on hover instead of going directly to the final location?http://codepen.io/ihatecoding/pen/mPBWWo?editors=1100
I think it might have to do with the matrices?
(in the html)
batilc1
@batilc1
Apr 01 2016 15:32
this is definitely something going on with your transformation matrices
@codercooooder what are those transformations are for?
when I disable the transition-duration, the letters do not return back to their original position after hovering out
codercooooder
@codercooooder
Apr 01 2016 15:35
@batilc1 my stuff
@batilc1 i want them to smoothly animate, not to just switch. When I do what I think you suggest, they simply jump.
batilc1
@batilc1
Apr 01 2016 15:37
they do not come back to their original position as well
so there's a problem with your hover trigger
codercooooder
@codercooooder
Apr 01 2016 15:38
@batilc1 could you fork and edit my codepen and show me the correct version.
batilc1
@batilc1
Apr 01 2016 15:38
is there a reason you are using SVG's?
codercooooder
@codercooooder
Apr 01 2016 15:39
@batilc1 please I have a complicated svg, this is only part of it, the only part that doesn't work.
@batilc1 can you fix it, i don't want to explain why, i am looking for a fix. This should be possible.
batilc1
@batilc1
Apr 01 2016 15:40
im looking at it
do you really need the matrices?
codercooooder
@codercooooder
Apr 01 2016 15:40
@batilc1 I appreciate your help, but I find all this typing stressful. I hate typing (and coding)
@batilc1 I don't know
@batilc1 i want editable text boxes that go from those locations and end up in those other locations with smooth animted transitions
if you can do it without those matrices, go for it. @batilc1
batilc1
@batilc1
Apr 01 2016 15:43
it is ok to use JS right @codercooooder
codercooooder
@codercooooder
Apr 01 2016 15:43
nononon
just pure css ahhhh
keep it simple batlic
@batilc1
@batilc1 if you can't do it fine, but don't drag me around .
@batilc1 you are asking me why, trying to do it with js, I just want the css solution. :) thanks though. i know you are trying to help.
CamperBot
@camperbot
Apr 01 2016 15:44
codercooooder sends brownie points to @batilc1 :sparkles: :thumbsup: :sparkles:
:star: 219 | @batilc1 | http://www.freecodecamp.com/batilc1
codercooooder
@codercooooder
Apr 01 2016 15:45
@batilc1 this is obviously something that css should be able to handle. I want to learn to do this in CSS, not just for this, but to learn.
batilc1
@batilc1
Apr 01 2016 15:48
OK doing it in css then
@codercooooder you are being vague asking a question thats why im asking you the details :)
codercooooder
@codercooooder
Apr 01 2016 15:48
@batilc1 sorry for that.
rodascesar
@cesarrodas
Apr 01 2016 15:49
I have seen this question before, but how can i get rid of the h1 one padding on my tic tac toe?
its shifting my div down
codercooooder
@codercooooder
Apr 01 2016 15:51
@batilc1 sorry i often have problems communicating these things, I get super stressed when trying to get help on these things.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:52
and I'm back for a tic... @batilc1 I copied and pasted your code, it only went up to 1000 ms... shouldn't it have gone further?
PlayingWithCows
@PlayingWithCows
Apr 01 2016 15:52
Hello :) I'm doing the wikipedia viewer and I have massive problems sending the request to the API. It says "Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access."
My pen: http://codepen.io/PlayingWithCows/pen/KzXNPv
I tried several things, including "setRequestHeader" in the "beforeSend" parameter in the $.ajax function, but without result. I'm not sure how to actually do it
codercooooder
@codercooooder
Apr 01 2016 15:53
@batilc1 you rock
batilc1
@batilc1
Apr 01 2016 15:53
a fast poc for your case
it needs good alignment, i wouldnt want to work more on :)
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:54
now all you have to do is really make your case by forking my code and making it work ;)
batilc1
@batilc1
Apr 01 2016 15:54
@gordondavidescu you are right I made a mistake
let me fix it for you
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:55
:clap:
codercooooder
@codercooooder
Apr 01 2016 15:55
@batilc1 sure, im a little concerned about using a different coordinate system, but I'll try it out ..
batilc1
@batilc1
Apr 01 2016 15:55
@gordondavidescu do you use es6 ?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:55
you'll notice i deleted pause entirely
I think so?
batilc1
@batilc1
Apr 01 2016 15:55
could you provide the link again?
codercooooder
@codercooooder
Apr 01 2016 15:55
haha @batilc1 does poc mean "piece of code"
batilc1
@batilc1
Apr 01 2016 15:56
@codercooooder I did poc out of the box, so im sure it wouldnt fit in your code :) but i think you can adjust/edit/refactor in anyway. poc means proof of concept :)
@gordondavidescu you are using es5. ok
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:57
we can change that right
poc means something very different depending on where you are in the united states
:fire:
codercooooder
@codercooooder
Apr 01 2016 15:58
@batilc1 is your native language english?
@batilc1 I am asking if "poc" is an acronym that means "piece of code" . I don't know the acronym.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:58
he said it's proof of concept
codercooooder
@codercooooder
Apr 01 2016 15:58
@gordondavidescu he did
@batilc1 lol i only read the start of your message.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 15:59
@codercooooder where are you geographically
codercooooder
@codercooooder
Apr 01 2016 15:59
@gordondavidescu private info
Jeff
@adzam5
Apr 01 2016 15:59
@PlayingWithCows Change the datatype to jsonp
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:00
I don't mean like where exactly -- like I'm in NY and when someone says "POC" they mean something very sensitive
especially since all of the shootings that have happened in the last few years :(
@codercooooder is your icon an anchor
Yaroslav
@YVeselovskyi
Apr 01 2016 16:02
@cesarrodas did you fix you problem?)
PlayingWithCows
@PlayingWithCows
Apr 01 2016 16:02
@adzam5 ._. thanks I did not imagine such a simple solution.. I'm speechless, haha
CamperBot
@camperbot
Apr 01 2016 16:02
playingwithcows sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
rodascesar
@cesarrodas
Apr 01 2016 16:03
@YVeselovskyi nope not yet
CamperBot
@camperbot
Apr 01 2016 16:03
:star: 375 | @adzam5 | http://www.freecodecamp.com/adzam5
batilc1
@batilc1
Apr 01 2016 16:03
@gordondavidescu I edited what I have provided to you
Yaroslav
@YVeselovskyi
Apr 01 2016 16:03
@cesarrodas I don't even know what's the problem
batilc1
@batilc1
Apr 01 2016 16:03
@gordondavidescu here's a simple example that works (I verified)
var count = 0;
var printer = function() {
    if (count > 10) return; 
    if (count == 10) 
        return console.log('This is the last execution at ' + count * 1000 + 'ms...');

    console.log('Executing ' + count * 1000 + 'ms...');
    count++;

    setTimeout(function(){
        printer();
    }, 1000);
}

printer();
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:03
you know the funny thing is, this whole thing with all of the computer moves playing instantaneously, that doesn't change the fact that all of the user stories are fulfilled with my game as is. just that you have to have super sharp seeing to make it work, lol
let me try
my div is pushed down when adding x or o. I tried padding, margin, line-height.
codercooooder
@codercooooder
Apr 01 2016 16:04
@gordondavidescu my location is irrelevant, I'd prefer not to share any identifying information with strangers potentially capable of hacking.
@gordondavidescu zero, nada, ok
@gordondavidescu my icon is a avi automatically generated by github
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:06
ok @codercooooder was just more curious if you too were familiar with political meanings of 'poc' than anything else
codercooooder
@codercooooder
Apr 01 2016 16:06
@gordondavidescu i am not
@gordondavidescu i only know that pos means "piece of sh*"
and it reminded me of that...
@gordondavidescu it made me laugh
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:07
when I worked at starbucks they called the registers the POS
batilc1
@batilc1
Apr 01 2016 16:07
@gordondavidescu You can switch to ES6 pretty easily, just set Babel as a pre-processor in codepen settings. In real browser you should include babel in your html headers
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:07
and I laughed quite a lot.
codercooooder
@codercooooder
Apr 01 2016 16:07
@gordondavidescu what does poc mean in relation to the shootings?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:08
because a lot of poc -- people of colour -- have been shot by police when they were unarmed
that's how it has been used politically
@batilc1 if I called the function from the function, wouldn't it play the colors more times than necessary tho?
batilc1
@batilc1
Apr 01 2016 16:11
how come?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:12
well like in your example, it does it as many times as the counter allows
check it :
if (color == 1) {
    S01_audio.play();
    // first need to dealy for button press
    setTimeout(function() {
         document.getElementById("s01").style.backgroundColor = "#67e154";
         // then need to delay for the duration that the button should be lighted
         setTimeout(function() {
               document.getElementById("s01").style.backgroundColor = "#136f05";
            }, moreDelay * i);
    }, delay * i);  //and delay should be increasing for each iteration
  };
so i'm not crystal clear on how the calling the function from there would help :(
Yaroslav
@YVeselovskyi
Apr 01 2016 16:15
@cesarrodas first of all make width auto for your .back
走你飛艇
@gofighting123
Apr 01 2016 16:17
@gordondavidescu why don't you use css transition?
batilc1
@batilc1
Apr 01 2016 16:18
@gordondavidescu I don't exactly get what problem you are getting, but of course you should be tinkering with the count a lot, a simple 0 to 10 will not work for this project
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:18
@gofighting123 what do you mean
rodascesar
@cesarrodas
Apr 01 2016 16:18
@YVeselovskyi it doesn't fix the problem because the blocks are going to be empty at first.
batilc1
@batilc1
Apr 01 2016 16:18
you should call sound.play() and light the button at the sametime, while giving a timeout to the light off
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:19
Interesting.
batilc1
@batilc1
Apr 01 2016 16:19
this whole process needs another timeout method
rodascesar
@cesarrodas
Apr 01 2016 16:19
@YVeselovskyi I know there is a way i just can't remember it.
batilc1
@batilc1
Apr 01 2016 16:19
probably, you will need two nested loops inside each other
In my simon project, I have used Promise API which helped A LOT.
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:20
I saw someone refer to that
batilc1
@batilc1
Apr 01 2016 16:20
Promise's help serialize your async code just like you wanted to have your pause working
let me give you an example, may be you would like to learn that as well. It gets really easy using Promises
I will write your Pause method using promises
Yaroslav
@YVeselovskyi
Apr 01 2016 16:21
@cesarrodas if you will fix, send me the solution
走你飛艇
@gofighting123
Apr 01 2016 16:21
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:23
I just looked at your simon. I may just faint.
@batilc1
makes mine look like a five year old drew it
batilc1
@batilc1
Apr 01 2016 16:23
var pause = function(time) {
    return new Promise(function(resolve) {
        setTimeout(function() {
            resolve();
        }, time);
    })
}


pause(5000)
    .then(function() {
        console.log('I am delayed 5 seconds!');
        return pause(2000);
    })
    .then(function() {
        console.log('I am delayed 2 seconds!');
    });
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:23
source : my son is five.
interesting.
batilc1
@batilc1
Apr 01 2016 16:24
@gordondavidescu lol thank you! I have really put a lot of effor on that one trying to make it 3D.
CamperBot
@camperbot
Apr 01 2016 16:24
batilc1 sends brownie points to @gordondavidescu :sparkles: :thumbsup: :sparkles:
:star: 395 | @gordondavidescu | http://www.freecodecamp.com/gordondavidescu
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:24
I haven't even gotten the buttons to go on the device itself, heh
batilc1
@batilc1
Apr 01 2016 16:25
:D
it takes time to expertise
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:28
uhm. weird. I was curious and added pause to my code. now for some reason it always chooses the same color to flash. and it only flashes it once.
UGH
no, it works and plays different colors... at the same time... again.
走你飛艇
@gofighting123
Apr 01 2016 16:29
@gordondavidescu jquery https://api.jquery.com/delay/
@gordondavidescu codepen ?
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:36
@gofighting123 could .delay be used in my case tho?
走你飛艇
@gofighting123
Apr 01 2016 16:37
@gordondavidescu sure, why not
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:40
playSimonSequence = function(sequence) {
  computerTurn = true;

  for (var i = 0; i <= sequence.length-1; i++) {

    playSimonColor(sequence[i]).delay(500);
    ;
  }
  computerTurn = false;
}
presumably not that, because that didn't work
incidentally for some reason when I used set timeout in that function, it completely borks it and makes sequence[i] an empty bit of information
走你飛艇
@gofighting123
Apr 01 2016 16:42
@gordondavidescu $().delay() ...
@gordondavidescu it's must be a JQ selector callback object
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:44

so

```
$(playSimonColor(sequence[i])).delay(500);

really
```
$(playSimonColor(sequence[i])).delay(500);
that?
h4r1m4u
@h4r1m4u
Apr 01 2016 16:45
@gordondavidescu you could try
  for (var i = 0; i <= sequence.length-1; i++) {
    setTimeout(function() {
        playSimonColor(sequence[i]));
    }, 500 * i);
  }
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:45
@h4r1m4u fork my code, and do that, and watch the weirdness that happens
it is so so SO messed up
wait, I haven't been using the * i bit
for some reason when I have done this, it has always totally cleared out the data in sequence
let's see...
走你飛艇
@gofighting123
Apr 01 2016 16:46

@gordondavidescu

  if (color == 2) {
    S02_audio.play();
    $("s02").delay(delay * i).css({backgroundColor:'#e55d22'});
    $("s02").delay(moreDelay * i).css({backgroundColor:'#d42e1c'});
  };

try this ?

Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:47
dang. that's pretty.
走你飛艇
@gofighting123
Apr 01 2016 16:47
@gordondavidescu i felt that's a little wired...
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:49
anybody up for answering a jQuery question
Stephen James
@sjames1958gm
Apr 01 2016 16:50
A JQuery query>
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:50
@gofighting123 probably is
good one @sjames1958gm
走你飛艇
@gofighting123
Apr 01 2016 16:50
@gordondavidescu .....
@sjames1958gm .....
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:50
you seem like you're the jquery master
right now

@h4r1m4u I pasted this:

```

Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:50
hehe it is quite the jQuery jquery
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:50
  for (var i = 0; i <= sequence.length-1; i++) {

     setTimeout(function() {
        playSimonColor(sequence[i]));
    }, 500 * i);

  }
and it is throwing up an error
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:51
so I am early in my FCC and trying to pull a random quote using API and jQuery
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:51
i can't figure it out
h4r1m4u
@h4r1m4u
Apr 01 2016 16:51
     setTimeout(function() {
        playSimonColor(sequence[i]);
    }, 500 * i);
extra bracket
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:51
This message was deleted
CamperBot
@camperbot
Apr 01 2016 16:51
:bulb: to format code use backticks! ``` more info
走你飛艇
@gofighting123
Apr 01 2016 16:51
...
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:52
$(document).ready(function() {
  var quoteUrl = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1";

  $("#getQuote").onClick(function(e){
    e.preventDefault();
    $.ajax(
      type: "GET",
      url: quoteUrl,
      success: function(result) {
        $("#quote-text").html(result.content);
    });

  });
});
am I on the right track?>
Stephen James
@sjames1958gm
Apr 01 2016 16:53
@DenverRenGuy Yes - check you devtools console and see if you are getting some permission errors related to ORIGIN
走你飛艇
@gofighting123
Apr 01 2016 16:53
@DenverRenGuy did u check it on the dev tools? see the response?
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:53
@DenverRenGuy I had the same problem with that website
Stephen James
@sjames1958gm
Apr 01 2016 16:53
:+1:
CamperBot
@camperbot
Apr 01 2016 16:53

:point_right: adding snippets in sublime text [wiki]

Adding Snippets To Your Sublime Text Installation

If you are a user of sublime text (I hope you are, it kicks ass. You can get it here), then you may have
already noticed some of the tab completion capabilities. For example, when you are opening an html tag such as <p>, it automatically closes
the tag as soon as you type /. You can get similar functionality for pieces of code you end up re-writing over and over, and it's surprisingly
easy!

Here's an example, which activates after typing div and then tab:

alt text

The Steps

Step 1.

Click Tools > New Snippet... in the navigation bar. This will open a snippet skeletton file which will look like this:

alt text

Step 2.

:pencil: read more about adding snippets in sublime text on the FCC Wiki

走你飛艇
@gofighting123
Apr 01 2016 16:53
0.0
Stephen James
@sjames1958gm
Apr 01 2016 16:53
\O^O/
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:54
refused to execute script from...
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:54
For some reason it won't give random posts using [posts_per_page]=1
One solution is to grab 35 random quotes in an array and sort them randomly
走你飛艇
@gofighting123
Apr 01 2016 16:54
@DenverRenGuy try ajax with jsonp or use getjson
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:54
is this because that website doesn't like what I am doing or am I doing soemthing I shouldn't
ahh
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:55
@h4r1m4u I just put it in and it really really really borks the entire app
check it out
now it doesn't play anything at all
走你飛艇
@gofighting123
Apr 01 2016 16:55
@DenverRenGuy dataType: 'jsonp
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:55
high fives to anyone who can make this silly code work
and help me understand why mine didn't :)
h4r1m4u
@h4r1m4u
Apr 01 2016 16:56
@gordondavidescu i didn't look at the rest of your code. i'm not sure how it's all tied together. for some reason the sequence[i] inside the setTimeout is undefined (are you modifying the sequence right after it's played?). using closures sorts that out:
    (function(i, sequence) {
      setTimeout(function() {     
          playSimonColor(sequence[i]);
      }, 500 * i); 
    })(i, sequence);
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:57
@DenverRenGuy here's what I resorted to:
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=36", function(a) {

      var n = a.length;      
      // get random index from the n available
      idx = Math.floor(Math.random() * (n-1));
      // insert the quote and author
      $('#quote-content').html(a[idx].content);
      $('#quote-title').html('-'+a[idx].title);
Gordon Davidescu
@gordondavidescu
Apr 01 2016 16:57
I am definitely not modifying the sequence right after it's played
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:57
this is within my button click
It's not perfect, but it is certainly quasi-random
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:58
ok, so you are making the .getJSON instead of the .ajax?
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:58
yes
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:58
interesting
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 16:58
i tried .ajax but it kept giving me errors
Jason Wilcox
@DenverRenGuy
Apr 01 2016 16:58
ok, let me try something
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:00
@h4r1m4u it still seems to be playing everything on top of itself
:o:
:gandalf:
true story
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 17:04
is this site relevant for zipline show local weather? http://www.sitepoint.com/ajaxjquery-getjson-simple-example/
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:04
has anyone ever used tumblr's api??
Jason Wilcox
@DenverRenGuy
Apr 01 2016 17:04
thanks @NormanBenbrahim , that cleared up the execution error
CamperBot
@camperbot
Apr 01 2016 17:04
denverrenguy sends brownie points to @normanbenbrahim :sparkles: :thumbsup: :sparkles:
:star: 275 | @normanbenbrahim | http://www.freecodecamp.com/normanbenbrahim
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:05
@DenverRenGuy no problem
i'm actually working on the same project
Jason Wilcox
@DenverRenGuy
Apr 01 2016 17:05
thanks @gofighting123 too
CamperBot
@camperbot
Apr 01 2016 17:05
denverrenguy sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:05
having trouble with tumblr's api though. let me know if you figure it out!
CamperBot
@camperbot
Apr 01 2016 17:05
:star: 280 | @gofighting123 | http://www.freecodecamp.com/gofighting123
Jason Wilcox
@DenverRenGuy
Apr 01 2016 17:05
I will :)
@NormanBenbrahim one other quick question, should I be able to do a simpel console.log() command in the JS window and get the output in the console?
I ask, because if it doesn't work, I am too assume my click event is not firiing, yes
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:08
yeah that should work. and yes correct, if that doesn't work then your click event isnt firing
i usually console.log anything before I make any actual changes to the html document just to make sure it's good
a very primitive way of debugging :P
Jason Wilcox
@DenverRenGuy
Apr 01 2016 17:10
hmm, must be something else, in doesn't output using the console in chrome, but firefox firebug, the call is successfull and I get back data
well thats a start
:)
h4r1m4u
@h4r1m4u
Apr 01 2016 17:11
@NormanBenbrahim i haven't use tumblr's api, but it looks quite straightforward. what are you having an issue with?
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:12
@h4r1m4u I am trying to make it so that a user who clicks on my button posts something to their own tumblr page
do i need an oauth for this?
sorry its a vague question, using APIs are still really new to me
h4r1m4u
@h4r1m4u
Apr 01 2016 17:13
@NormanBenbrahim yeah, it looks like the posting methods require oauth: https://www.tumblr.com/docs/en/api/v2#posting
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:16
if someone other than me clicks the button on my codepen will it link to THEIR tumblr? or will it give an error because the oauth is my own key?
batilc1
@batilc1
Apr 01 2016 17:17
@gordondavidescu hows it going
Sameer Shamsudeen
@sameershamsudheen
Apr 01 2016 17:17
Hello all , which css methods you are using to create responsive websites without any framework?
batilc1
@batilc1
Apr 01 2016 17:17
@media tags
and setting base font-size at that
then you can use % and em based sizes all over
beware though, it'll be slow on mobile
use absolute px values anywhere possible
Sameer Shamsudeen
@sameershamsudheen
Apr 01 2016 17:21
@batilc1 Thank You for your valuable reply.
CamperBot
@camperbot
Apr 01 2016 17:21
sameershamsudheen sends brownie points to @batilc1 :sparkles: :thumbsup: :sparkles:
:star: 220 | @batilc1 | http://www.freecodecamp.com/batilc1
Matt Leonard
@matty22
Apr 01 2016 17:27
Anyone run into the problem with bootstrap where you can't get what you want exactly due to not being able to split columns? Meaning I want one of my columns to be col-md-3.5 but to my knowledge that isn't possible?
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 17:28
@matty22 you're right you can't use 3.5. However, you can offset the column col-md-3 col-md-offset-1
i would just play with offsets and smaller columns until it fits right
batilc1
@batilc1
Apr 01 2016 17:29
@matty22 you should not need 3.5
you can nest grids
for example, you can divide a col-md-3 area to a grid again which has 12 available spots to consume
you should be able to divide any space to 12 indefinitely if im not mistaken
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:36
@batilc1 after implementing suggestions from @h4r1m4u it works well enough to my satisfaction
I submitted it.
and just found out that you need all four certifications to do the nonprofit work
cyounger88
@cyounger88
Apr 01 2016 17:36
Im having trouble putting pictures into my site. anyone give some tips? <div style="height:475px" class="jumbotron">
<div class="container text-center">
<div img src"https://images.unsplash.com/photo-1433360405326-e50f909805b3?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=9ab739b6338ab856496c9cec7578f58f">
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:36
but I am going to start applying to jobs using my new certification.
batilc1
@batilc1
Apr 01 2016 17:37
@gordondavidescu lol thats right. I'm glad you are satisfied with your project!
Paul Borawski
@iAmNawa
Apr 01 2016 17:37
@cyounger88 you have to have a div tage
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:37
and continue studying, though of course it would help if there was more to the back end section than just challenges!? how did you learn it @batilc1 and why is your dungeon crawler so scary looking
Paul Borawski
@iAmNawa
Apr 01 2016 17:37
@cyounger88 and then inside have a img tag
走你飛艇
@gofighting123
Apr 01 2016 17:38
batilc1
@batilc1
Apr 01 2016 17:38
you should go ahead indeed, and try to get a job in the sector, good luck! dont forget to improve all the time :)
im a masters cs student :D i think tahts why
Paul Borawski
@iAmNawa
Apr 01 2016 17:38
<div><img src=“whateverhere></div> @cyounger88
add a quote after the photo too
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:38
@gofighting123 thank you
CamperBot
@camperbot
Apr 01 2016 17:38
gordondavidescu sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
cyounger88
@cyounger88
Apr 01 2016 17:38
Oh thanks ! @iAmNawa
CamperBot
@camperbot
Apr 01 2016 17:38
:star: 281 | @gofighting123 | http://www.freecodecamp.com/gofighting123
Gordon Davidescu
@gordondavidescu
Apr 01 2016 17:40
does anyone have any good leads to learning what the back end stuff requires challenge wise until they add the lessons?
Paul Borawski
@iAmNawa
Apr 01 2016 17:41
lynda.com @gordondavidescu
Or attend a local NodeSchool
@gordondavidescu go to nodeschool.io and scroll down, there are exercises which give you an into to the back end under core exercises
you load them into your console/terminal/bash and do the exercises there
走你飛艇
@gofighting123
Apr 01 2016 17:46
@gordondavidescu http://api.jquery.com/animate/
All animated properties should be animated to a single numeric value, except as noted below; most properties that are non-numeric cannot be animated using basic jQuery functionality (For example, width, height, or left can be animated but background-color cannot be, unless the jQuery.Color plugin is used). Property values are treated as a number of pixels unless otherwise specified. The units em and % can be specified where applicable.
@gordondavidescu need cdn jq color plugin
@gordondavidescu
if (color == 1) {
    S01_audio.play();
    $("#s01").animate({'background-color':'#67e154'},delay * i);    
    $("#s01").animate({'background-color':'#136f05'},moreDelay * i);
  };
Ken Haduch
@khaduch
Apr 01 2016 17:49
@gordondavidescu - I think that you'll find that the value of 'i' is going to have the same value for each instance of execution of the setTimeout function, as I was demonstrating last night. I think that the only way you're going to make this work is to make a global variable (global in the sense that each function that executes can access it.) And increment that within the setTimeout callback functions, but use the value to access your sequence. There is some other concept called an "Immediately-Invoked Function Expression" that I still haven't figure out how to use.
Yaroslav
@YVeselovskyi
Apr 01 2016 17:59
https://jsbin.com/zomituhofe/edit?html,output
why my fb widget is not working?
走你飛艇
@gofighting123
Apr 01 2016 17:59
@gordondavidescu i think it will be a good try to make it like a game object , init as newgame function. i am wondering :alien:
Jeff
@adzam5
Apr 01 2016 18:01
@YVeselovskyi Did you set it up thru the FB developer site?
走你飛艇
@gofighting123
Apr 01 2016 18:01
@gordondavidescu i just realized it's like a simon says game :alien:
yes
from here
h4r1m4u
@h4r1m4u
Apr 01 2016 18:01

@khaduch it's not difficult to use:

  for (var i = 0; i < someArr.length; i++) {   
    (function(i) { 
      setTimeout(function() {     
          console.log(i);
      }, 500 * i); 
    })(i);
  }

notice the (function(i) { })(i); expression that wraps the code inside the forloop. that's the closure that "locks" the value of i and lets you correctly use it inside the setTimeout() function.

Jeff
@adzam5
Apr 01 2016 18:04
@YVeselovskyi My only experience with FB API is posting to your wall from the site I'm working on, but I had to add the site to "My Apps" and get an app id for it to work
走你飛艇
@gofighting123
Apr 01 2016 18:05
i have to sleep , it's 2am now :smile: bye guys
cyounger88
@cyounger88
Apr 01 2016 18:13
having trouble putting internal pictures on my web page. any tips?
Paul Borawski
@iAmNawa
Apr 01 2016 18:15
@cyounger88 i can help
are you trying to add them in html or css?
Boss7616
@Boss7616
Apr 01 2016 18:24

The nav bar that I have built is blocking out the h1 element that is currently there, any way of fixing it

<div class="container-fluid">

<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">

</div>
</nav>

<h1 class="text-center GravitasText">Bozzone Freelance</h1>

Jeff
@adzam5
Apr 01 2016 18:26

@Boss7616 Try adding

body {
    margin-top: 51px;
}

to your CSS

Boss7616
@Boss7616
Apr 01 2016 18:27
awesome thanks @adzam5, also how do you get the nice looking console thing
h4r1m4u
@h4r1m4u
Apr 01 2016 18:28
explain format
CamperBot
@camperbot
Apr 01 2016 18:28

: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

h4r1m4u
@h4r1m4u
Apr 01 2016 18:28
:point_up:
Boss7616
@Boss7616
Apr 01 2016 18:29
sweet deal
Sephem
@Sephem
Apr 01 2016 18:32
hi all I have changed my weather project to be more responsice accross a bunch of devices
any feedback is appreciated
Jeff
@adzam5
Apr 01 2016 18:35
@Sephem Looks good on desktop. On my phone, the weather icon partially covers the text though
Sephem
@Sephem
Apr 01 2016 18:35
@adzam5 what phone do you have?
Jeff
@adzam5
Apr 01 2016 18:35
BlackBerry Z30
Sephem
@Sephem
Apr 01 2016 18:36
hmm okay not sure how to test that. I have tested on iphone 5, 4s, 6s plus, ipad2 and desktop
what size isi the screen on the blackberry z30 @adzam5
Ken Haduch
@khaduch
Apr 01 2016 18:40
@h4r1m4u - I was trying to refresh / relearn about that last night, and just wasn't getting the desired results. I'll have to revisit it later. Thanks for the example
CamperBot
@camperbot
Apr 01 2016 18:40
khaduch sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1753 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Jeff
@adzam5
Apr 01 2016 18:41
@Sephem 720x1280
Sephem
@Sephem
Apr 01 2016 18:41
thansk will look into that
Jeff
@adzam5
Apr 01 2016 18:42
Clipboard01.jpg
@Sephem That is a screenshot with my browser window very narrow. It is similar to what I see on my phone
Theresa
@decgal
Apr 01 2016 18:44
I'm just trying to figure out this twitter button... I can get it to tweet the FIRST quote generated but no subsequent quote: http://codepen.io/decgal/pen/dMzzbq?editors=1010
Sephem
@Sephem
Apr 01 2016 18:44
ahh I see why I cannot replicate. @adzam5 I have a diffrernt icon for my weather and the sie may differ
@adzam5 that is why its good to get others to test
codercooooder
@codercooooder
Apr 01 2016 18:47
guys can you help me figoure out how to implement this answers in css?
(the one that has 11 upvotes)
Michael Kulinski
@mkulinski
Apr 01 2016 18:48
I'm working on the calculator problem. Could someone point me in the right direction for how to chain multiple mathematical operations? I have it working for two numbers, but not anymore than that. http://codepen.io/mkulinski/pen/PNJZYL
Jeff
@adzam5
Apr 01 2016 18:48
@Sephem Yup! I wasn't thinking that I could have different icons either
Sephem
@Sephem
Apr 01 2016 18:49
@adzam5 thanks.
CamperBot
@camperbot
Apr 01 2016 18:49
sephem sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 376 | @adzam5 | http://www.freecodecamp.com/adzam5
Boss7616
@Boss7616
Apr 01 2016 18:52
if I want to reference the p element in a style rule how can I do that?
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 18:53
@Boss7616 you can just say ```p {style: attribute}
** p {style: attribute}
Boss7616
@Boss7616
Apr 01 2016 18:54
@NormanBenbrahim thanks I got it
CamperBot
@camperbot
Apr 01 2016 18:54
boss7616 sends brownie points to @normanbenbrahim :sparkles: :thumbsup: :sparkles:
:star: 277 | @normanbenbrahim | http://www.freecodecamp.com/normanbenbrahim
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 18:56
anyone have advice on weather app?
Micah Bales
@micahbales
Apr 01 2016 19:04
@Dueldrawer8 What about, specifically?
Hi everyone! Could y'all take a look at my start to the pomodoro clock and tell me if you can figure out why the 4 boxes in the middle of the circle move (slightly) when you resize the window? http://codepen.io/micahbales/pen/RaLrJz
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:06
@micahbales Just what resources/tips/tricks you used when you did that project
@micahbales ive been research json, ajax, xml for about 3 hours now and im no closer to starting or knowing how to write my code than i was 3 hours ago
the first thing i need to do i guess is load the api.. then i need to somehow use that api to "locate" anyone who goes to that page. So my first steps in my mind is how to locate someone and print it out to the page
Micah Bales
@micahbales
Apr 01 2016 19:08
@Dueldrawer8 Right. You don't need to print it out, you can just console.log it to make sure that you're getting it.
google "javascript geolocation" to find out how to get the coordinates of the user
it's actually super easy
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:09
But I do want to show it on the page
Micah Bales
@micahbales
Apr 01 2016 19:09
Oh, OK, then by all means do print it
Sephem
@Sephem
Apr 01 2016 19:09
@adzam5 is that any better.
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:10
@micahbales not only that.. i have to decide whether to use json/query/ajax or ajax/xml
then i basically have to learn that new syntax
Micah Bales
@micahbales
Apr 01 2016 19:11
does the API give both options?
I personally used $.ajax and the API's JSON data
you can also use #.getJSON()
excuse me, $.getJSON()
have you read the API documentation from openweathermap.org?
there are links to it in the project page on FCC
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:13
@micahbales yeah.. doesnt really make sense to me
Micah Bales
@micahbales
Apr 01 2016 19:13
those are critical.
Jeff
@adzam5
Apr 01 2016 19:13
@Sephem
Micah Bales
@micahbales
Apr 01 2016 19:13
@Dueldrawer8 what's confusing?
(I know I found it confusing at first, but hard to remember at this point)
you basically need to figure out how to call pieces of data from within the JSON
Jeff
@adzam5
Apr 01 2016 19:14
IMG_20160401_151040.png
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:14
@micahbales if i go here http://openweathermap.org/current#geo.. it gives me examples of the calls.. but not really how to implement the code
Micah Bales
@micahbales
Apr 01 2016 19:14
it's all hierarchical
so the problem isn't that you don't know how to navigate the JSON?
Sephem
@Sephem
Apr 01 2016 19:14
@adzam5 will try again hehe
Jeff
@adzam5
Apr 01 2016 19:14
@Sephem At least its not blocking the text anymore
Micah Bales
@micahbales
Apr 01 2016 19:14
@Dueldrawer8 You'll want to Google "$.ajax" and look at the documentation for that.
Sephem
@Sephem
Apr 01 2016 19:15
@adzam5 yeah just needs a bit more fine tuning
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:15
@micahbales well.. probably that is the problem :)
Micah Bales
@micahbales
Apr 01 2016 19:15
navigate the JSON like a nested array.
for example, "data.thingy.another[0].datayouwant
"
@Dueldrawer8 do you have an API key yet?
you'll need one of those to use the API
there should be an example of how to insert it into your URL
which calls the data
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:16
@micahbales i do not and will get one
i guess im just confused as to what to actually use to get data
Micah Bales
@micahbales
Apr 01 2016 19:17
you're going to create a variable that represents the whole JSON data, right?
I called it "data" (naturally)
then you navigate "data" like a nested array.
let me give you an example
say I want to know the local temperature?
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:18
so i need to make a GET request to weather server?
Micah Bales
@micahbales
Apr 01 2016 19:18
I'm going to use "data.main.temp"
yes.
and you can use either $.ajax or $.getJSON
they do the same thing, the first one offers more flexibility
make sure you're running jQuery in Codepen
(or else it won't work. :) )
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:20
that was my next question.. its using Jquery rather than vanilla javascript or xml?
Sephem
@Sephem
Apr 01 2016 19:20
@adzam5 3rd time lucky?
Micah Bales
@micahbales
Apr 01 2016 19:21
@Dueldrawer8 correct. vanilla JS is insecure, so jQuery is preferred for AJAX calls
(it's also easier)
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:23
@micahbales alright thank you, i have a better idea of how it happens.
CamperBot
@camperbot
Apr 01 2016 19:23
dueldrawer8 sends brownie points to @micahbales :sparkles: :thumbsup: :sparkles:
:star: 366 | @micahbales | http://www.freecodecamp.com/micahbales
Micah Bales
@micahbales
Apr 01 2016 19:23
@Dueldrawer8 Awesome. Feel free to send me a private message if you have more questions.
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:23
still not necessarily how to code it lol.. let alone making the get request
is that in the .ajax docs?
Micah Bales
@micahbales
Apr 01 2016 19:24
@Dueldrawer8 You'll get there. Just focus on solving small problems first.
Jeff
@adzam5
Apr 01 2016 19:24
@Sephem Yup! Looks good now
Micah Bales
@micahbales
Apr 01 2016 19:24
Yes, just look up the MDN article on $.ajax
er, actually will probably be a jQuery article
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:24
yes :)
So first before anything i have to send a get request before i can show it to the page correct?
Stephen James
@sjames1958gm
Apr 01 2016 19:27
@mkulinski anyone ever answer your question
Sephem
@Sephem
Apr 01 2016 19:27
@adzam5 great
Micah Bales
@micahbales
Apr 01 2016 19:30
@Dueldrawer8 right. you do a get request and have a callback function, in which your argument is the JSON data (ex, function(data) { } , where "data" is all of the JSON data)
$.getJSON(URL, function(data) {});
It's within that function that all the magic happens. You call all the information you need - temperature, wind, whatever, and display it
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:32
so no need for the $.get() function over the $.getJSON() function?
Micah Bales
@micahbales
Apr 01 2016 19:34
@Dueldrawer8 I'd use the $.getJSON() function, or you can also use $.ajax. Here's an example:
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:35
@micahbales yes that makes sense
Micah Bales
@micahbales
Apr 01 2016 19:35
$.ajax ({
url : 'http://api.openweathermap.org/data/2.5/weather?lat=' + mLat + '&lon=' + mLon + '&appid=' + apiKey + '&callback=?',
type : "GET",
success: function(data) { }
datatype: jsonp
StasiekK
@StasiekK
Apr 01 2016 19:35
Hi,
is there a tool to integrate few CSS style? and recive all collisions occurrence, or i need to write something myslef?
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:35
@micahbales obvousily have to go back to jQuery
Micah Bales
@micahbales
Apr 01 2016 19:35
@Dueldrawer8 definitely
@Dueldrawer8 I mean, there's a way to do with with regular JS
I haven't done that, and it's not considered secure
you'll get more info on that if you look at the w3schools stuff on ajax
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 19:37
@micahbales thanks again.. ill try to do this sucker
CamperBot
@camperbot
Apr 01 2016 19:37
dueldrawer8 sends brownie points to @micahbales :sparkles: :thumbsup: :sparkles:
:warning: dueldrawer8 already gave micahbales points
Michael Kulinski
@mkulinski
Apr 01 2016 19:38
@sjames1958gm no
Stephen James
@sjames1958gm
Apr 01 2016 19:41
@mkulinski Chaining simply means, in my mind, when you enter another operation it completes the previous one and starts the new one.
So you don't have to press = and then another op. e.g 4 + 8 / 2 = (result 6) - rather than 4 + 8 = (result 12) / 2 = (result 6)
Michael Kulinski
@mkulinski
Apr 01 2016 19:43
@sjames1958gm hmmm okay
blackbuddha88
@blackbuddha88
Apr 01 2016 19:45
hi
Eric Murta
@murtinha
Apr 01 2016 19:45
function spinalCase(str) {
  // "It's such a fine line between stupid, and clever."
  // --David St. Hubbins
  var x=String.fromCharCode(32);
  if((str.IndexOf(x))!=-1){
  str=str.toLowerCase();
  str=str.replace(/\s|[_]/g,"-");
  }
  else{
    var array=[];
    array=str.split("");
    for(i=1;i<array.length;i++){
      if(array[i].toUpperCase()==array[i] && array[i].toLowerCase()!=array[i]){
        array[i]= "-"+ array[i].toLowerCase();
      }
    }
  }
  return str;
}

spinalCase('ThisIsSpinalTap');
Guys basically I want to check if there are any spaces between the words of the string, if yes do something, not do else. But my str.indexOf() is wrong... indexOf() its not a function its saying
blackbuddha88
@blackbuddha88
Apr 01 2016 19:45
im on the challenge for building a random quote machine
Matt Leonard
@matty22
Apr 01 2016 19:46
Simon complete! Need to clean up some of these front end projects before claiming the certificate though.
blackbuddha88
@blackbuddha88
Apr 01 2016 19:46
its 95% done, but there are some issues that bother me, that hopefully someone can help me with
Micah Bales
@micahbales
Apr 01 2016 19:46
@Dueldrawer8 Good luck! :)
blackbuddha88
@blackbuddha88
Apr 01 2016 19:46
1.) how can i get the buttons to stay at the bottom of the container div?
Paul Borawski
@iAmNawa
Apr 01 2016 20:10
@blackbuddha88 change the margin

btns {

margin-top: 10%;
}
put that into your css @blackbuddha88
blackbuddha88
@blackbuddha88
Apr 01 2016 20:13
@iamnawa sorry, but you could you explain further?
@iAmNawa i just tried what you suggested and noticed no difference
@ianawa ah, i left out the hashtag, but the buttons are still moving around on every refresh
Stephen James
@sjames1958gm
Apr 01 2016 20:20
@murtinha Look closely - see the uppercase I - indexOf not IndexOf
Paul Borawski
@iAmNawa
Apr 01 2016 20:20
@blackbuddha88 the buttons seem to be in the right place now when I just looked again
@blackbuddha88 I see what you mean, I would put the div position to absolute so it doesn’t move around
then adjust the buttons where you permanently want them
Eric Murta
@murtinha
Apr 01 2016 20:23

@sjames1958gm ```
function spinalCase(str) {
// "It's such a fine line between stupid, and clever."
// --David St. Hubbins
var array=[];
var regex = /\s+|_+/g;
var x=String.fromCharCode(32);
if((str.indexOf(x))!=-1){
str=str.toLowerCase();
str=str.replace(regex,"-");

}
else{

array=str.split("");
for(i=1;i<array.length;i++){
  if(array[i].toUpperCase()==array[i] && array[i].toLowerCase()!=array[i]){
    array[i]= "-"+ array[i].toLowerCase();

  }

}
str=array.join("");

}

return str;
}

spinalCase('The_Andy_Griffith_S');

```
guys my replace its not replacing the "_" why?

Paul Borawski
@iAmNawa
Apr 01 2016 20:44
@BerkeleyTrue Why are people getting banned?
Eric Murta
@murtinha
Apr 01 2016 20:45
function spinalCase(str) {
  // "It's such a fine line between stupid, and clever."
  // --David St. Hubbins
  var array=[];
   var regex = /\s+|_+/g;
  var x=String.fromCharCode(32);
  if((str.indexOf(x))!=-1){
  str=str.toLowerCase();
  str=str.replace(regex,"-");

  }
  else{

    array=str.split("");
    for(i=1;i<array.length;i++){
      if(array[i].toUpperCase()==array[i] && array[i].toLowerCase()!=array[i]){
        array[i]= "-"+ array[i].toLowerCase();

      }

    }
    str=array.join("");
  }

  return str;
}

spinalCase('The_Andy_Griffith_S');
guys my replace its not replacing the "_" why?
Stephen James
@sjames1958gm
Apr 01 2016 20:45
@murtinha + Matches the preceding expression 1 or more times
Eric Murta
@murtinha
Apr 01 2016 20:51
@sjames1958gm I removed it and nothing happened
Stephen James
@sjames1958gm
Apr 01 2016 20:52
@murtinha I think I was wrong on that one - well obviously since it didn't work :)
@murtinha are you talking about the if part of your code?
Eric Murta
@murtinha
Apr 01 2016 20:53
@sjames1958gm yes, the problem is on the replace function up there
Stephen James
@sjames1958gm
Apr 01 2016 20:53
@murtinha The if part that only happens if there is a space in the string ?
Eric Murta
@murtinha
Apr 01 2016 21:01
@sjames1958gm yeap
Stephen James
@sjames1958gm
Apr 01 2016 21:01
'The_Andy_Griffith_S'
Eric Murta
@murtinha
Apr 01 2016 21:13
@sjames1958gm its not removing "_"
@sjames1958gm I need to check for _ them in the iff haahhaha
Stephen James
@sjames1958gm
Apr 01 2016 21:15
@sjames1958gm That string has no spaces so it doesn't get into the if part of the code
Sephem
@Sephem
Apr 01 2016 21:16

any reading advice regarding ajax and api? I understand

$.getJSON

but not the

$.ajax({
        type: "GET", 
})
CamperBot
@camperbot
Apr 01 2016 21:16
:bulb: to format code use backticks! ``` more info
Sephem
@Sephem
Apr 01 2016 21:16
shortented above just to seperate the two methods I have seen
Stephen James
@sjames1958gm
Apr 01 2016 21:33
@Sephem getJSON does a HTTP get and the takes the returned json string and converts it to an object. $.ajax ({ type: GET}) will do the HTTP get but you would be required to parse the string. $.ajax has many more options allowing finer grained control of the HTTP interaction, including using different HTTP methods, such as POST.
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:34
anyone experience a "too much recursion" error in the console when using jquery to manage a click event?
Stephen James
@sjames1958gm
Apr 01 2016 21:34
No but sounds like you have code that calls it self
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:34
I read a little about this, but I am not sure I understand the event bubbling terminology
$(document).ready(function() {  
   var quoteUrl = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&  filter[posts_per_page]=1&_jsonp=mycallback";

  $("#getQuote").on("click", function(e){
    e.preventDefault();

    $.getJSON(quoteUrl, function(data){
        $('.quote-content').html("Put this in place to test");   
    });
  });
});
Stephen James
@sjames1958gm
Apr 01 2016 21:35
@DenverRenGuy That looks fine ...
Sephem
@Sephem
Apr 01 2016 21:43
thanks @animsaj I have been trawling the internet trying to find out and have learnt more than just that
CamperBot
@camperbot
Apr 01 2016 21:43
sephem sends brownie points to @animsaj :sparkles: :thumbsup: :sparkles:
Sephem
@Sephem
Apr 01 2016 21:43
hehe
CamperBot
@camperbot
Apr 01 2016 21:43
:star: 467 | @animsaj | http://www.freecodecamp.com/animsaj
Sephem
@Sephem
Apr 01 2016 21:43
so which is better to use or should I say the more accepted method?
Stephen James
@sjames1958gm
Apr 01 2016 21:44
@Sephem Use getJSON when you are simply fetching information, when you get to using a full REST API then switch to $.ajax
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:45
@sjames1958gm and does the $.getJSON line look correct. It appears like that is never being executed when the click event happens, if I pull the $('.quote-content line out of the getJSON event then it changes the text fine
Stephen James
@sjames1958gm
Apr 01 2016 21:46
@DenverRenGuy I am not sure what exactly _jsonp=mycallback is doing but if you replace it with _jsonp=? it will hit your code
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:48
wow...
ok, that is wickedly weird
Alex Coder
@jkid314159
Apr 01 2016 21:49
Hello Can I post my Tribute page here for feed back???
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:49
thanks @sjames1958gm , nailed it!
CamperBot
@camperbot
Apr 01 2016 21:49
denverrenguy sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 395 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Jeff
@adzam5
Apr 01 2016 21:52
@jkid314159 Of course
Jason Wilcox
@DenverRenGuy
Apr 01 2016 21:53
whats interessting though, is that if I remove the mycallback and put in ?, it fails the actual API call
Sephem
@Sephem
Apr 01 2016 21:53
so if I understand correctly getJSON() is just a std function that calls the Actual AJAX function. with default settings like get and success, and passes through the url that you provide
Stephen James
@sjames1958gm
Apr 01 2016 21:55
@Sephem Yes. http://api.jquery.com/jquery.getjson/ getJSON is equivalent to
$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});
Sephem
@Sephem
Apr 01 2016 21:55
thanks that makes sense @sjames1958gm
CamperBot
@camperbot
Apr 01 2016 21:55
sephem sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 396 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Sephem
@Sephem
Apr 01 2016 21:55
so that leads me to my second question what is better post or get?
Jasmina Babic
@animsaj
Apr 01 2016 21:57
@Sephem post is if you want to post data to a certain url and get is to get data. they are different
Sephem
@Sephem
Apr 01 2016 22:00
from what I ca tell @animsaj is that they do the same thing, just with different ways.
i.e. Get passes the info in the URL whereas Post sends it in the HTTP message body
but then reading some info I also see this
Unfortunately there is a lot misuse of GET over POST and vice versa. Both HTTP methods can achieve the same goals, but an incorrect choice between them can lead to unexpected and potentially harmful outcomes.
Jack Zhang
@wayx3
Apr 01 2016 22:08
someone help me please.. on check for Palindromes

function palindrome(str) {
// Good luck!
return str == str.split('').reverse().join('');
}

palindrome("eye");

Jasmina Babic
@animsaj
Apr 01 2016 22:09
@wayx3 hint: it will not work if there is a capital letter in str
@Sephem
GET - Requests data from a specified resource
POST - Submits data to be processed to a specified resource
that's difference
Jack Zhang
@wayx3
Apr 01 2016 22:11
@animsaj there's no capital letter
Jasmina Babic
@animsaj
Apr 01 2016 22:12
@wayx3 but can be in tests
Stephen James
@sjames1958gm
Apr 01 2016 22:12
Try with ===
@wayx3 Try with ===
Jack Zhang
@wayx3
Apr 01 2016 22:15

forget it, I can't even do anything from: function palindrome(str) {
// Good luck!
return true;
}

palindrome("eye");

Randy Goldsmith
@Dueldrawer8
Apr 01 2016 22:16
@Sephem when you get to node.js/express you will see the differences more clearly..in fact i prefer it
Yaroslav
@YVeselovskyi
Apr 01 2016 22:21
HELLO :) Who can help me?
Stephen James
@sjames1958gm
Apr 01 2016 22:24
@YVeselovskyi Many people, just ask away
Yaroslav
@YVeselovskyi
Apr 01 2016 22:25
@sjames1958gm With facebook widget :(
Alex Coder
@jkid314159
Apr 01 2016 22:26
@sjames1958gm can i post my Tribute project for comments
Stephen James
@sjames1958gm
Apr 01 2016 22:27
Sure @jkid314159
@DenverRenGuy Did you ever get it working?
@YVeselovskyi It might not be me who helps but someone - got to post some info / question
Alex Coder
@jkid314159
Apr 01 2016 22:29
Comments suggestions on my Tribute projects!!
Jason Wilcox
@DenverRenGuy
Apr 01 2016 22:30
@sjames1958gm negative, but the issue seems to be with the API for that particular site
Stephen James
@sjames1958gm
Apr 01 2016 22:30
Jason Wilcox
@DenverRenGuy
Apr 01 2016 22:30
something they are passing in the data is mucking up the getJSON call
Stephen James
@sjames1958gm
Apr 01 2016 22:31
@jkid314159 Looks good - maybe narrow the view. It becomes hard to read looking from side to side, esp. with the one quote section.
Jason Wilcox
@DenverRenGuy
Apr 01 2016 22:32
...hrmmmm
ok, well hold on here
Alex Coder
@jkid314159
Apr 01 2016 22:32
@sjames1958gm narrow meaning??
Stephen James
@sjames1958gm
Apr 01 2016 22:32
@jkid314159 put some space on either side. Don't go to edges of the page.
Alex Coder
@jkid314159
Apr 01 2016 22:33
I want to add action like mouseover. So, do with javascript, jquery, or bootstrap
Stephen James
@sjames1958gm
Apr 01 2016 22:34
@jkid314159 jquery / javascript - use bootstrap to add some space to the sides
Alex Coder
@jkid314159
Apr 01 2016 22:35
I want to add mouseover shake to image with maybe a link Bootstrap for responsive design not adding action???
Jason Wilcox
@DenverRenGuy
Apr 01 2016 22:37
@sjames1958gm I am so confused, i can't see the difference between my js and yours, but there is clearly a difference, because yours is working lights out
it has to be in the link somewhere, because now the display in console of the JSON object looks as I would expect
Super thanks to @sjames1958gm !
CamperBot
@camperbot
Apr 01 2016 22:40
denverrenguy sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: denverrenguy already gave sjames1958gm points
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:08
hey guys my weather app isn't working :( i'm trying to simply grab the data that the ipinfo call does (city and country) and input it into the open weather map api call but it isn't returning anything: http://codepen.io/elefun/pen/ONxgdr?editors=1011
the console.log is empty. what am i doing wrong??
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:14
@NormanBenbrahim when you find the answer to that let me know.. im on the weather app also and stuck
Stephen James
@sjames1958gm
Apr 01 2016 23:14
@NormanBenbrahim You need to wrap your weather ajax in a function and call that function from the success callback of ip info. After your ajax request (before the data has returned) you try your weather request with out the information you need.
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:18
@sjames1958gm i'm not sure i follow
you mean the whole weather ajax should be wrapped in a function?
Stephen James
@sjames1958gm
Apr 01 2016 23:20
@NormanBenbrahim you have to wait for the ip info to be returned before you can call run you weather $.ajax call. Which means either put the weather ajax call into the callback for ip info, or put the weather $ajax call into a function to be called from the ip info callback. IMO, putting it in a function makes for a little cleaner code.
  $.ajax({
  url: 'http://ipinfo.io',
  async: false,
  dataType: 'json',
  success: function (json) {
    data[0] = json.city;
    data[1] = json.country.toLowerCase();
  }
  });
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:22
@sjames1958gm ok i did that, but it still doesn't work: http://codepen.io/elefun/pen/ONxgdr?editors=0011
Stephen James
@sjames1958gm
Apr 01 2016 23:26
@NormanBenbrahim so so close - sometimes you have to open the devtools to see errors from the browser. After this change I see this
http://s.codepen.io/boomerang/b3f14de19cd30a7056eee14b4d72b99e1459553071624/api.openweathermap.org/data/2.5/weather?q=McKinney,us&APPID=c4700d761091c90ca272b7efbb78a4e3 returns 404 not found
In the devtools. Take a look at that and what is wrong with this url?
@NormanBenbrahim I am not trying to be a jerk or anything, I think it will stick more if you can see it yourself.
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:37
@sjames1958gm sorry i was afk. the url shouldn't start with codepen.io??
why is it doing that?
ohhhhhhhh
i need to make it an http:// url right
Stephen James
@sjames1958gm
Apr 01 2016 23:38
YES!
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:38
hahahahaha dang i feel silly:P
thanks @sjames1958gm
CamperBot
@camperbot
Apr 01 2016 23:39
normanbenbrahim sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 397 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:40
@sjames1958gm so what happens when i don't make it an http:// url is that it automatically grabs the url in my browser and appends it? is that correct?
Stephen James
@sjames1958gm
Apr 01 2016 23:43
@NormanBenbrahim Yes it assumes you are using a relative URL and appends it to the current location.
Norman Benbrahim
@NormanBenbrahim
Apr 01 2016 23:43
got it
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:44
could someone help me.. im confused..on weather ap
Steven Parker
@Philosophist
Apr 01 2016 23:44
QUESTION: Is there a link for a buzzer sound to the Simon game? The project page does not have one.
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:45
basically im trying to retrieve lat and lon values when a user goes onto the page.. that way it finds the city they are in and i watn to display it
im using a geo API..
how do i retreive the lat lon values? in another words..what key value pair shoud be in my code
Stephen James
@sjames1958gm
Apr 01 2016 23:46
@Dueldrawer8 In your code use console.log(JSON.stringify(response)) and it will show you the json structure
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:47
right i can already see the json structure
in the docs
``
{ "status": "success", "country": "United States", "countryCode": "US", "region": "CA", "regionName": "California", "city": "San Francisco", "zip": "94105", "lat": "37.7898", "lon": "-122.3942", "timezone": "America\/Los_Angeles", "isp": "Wikimedia Foundation", "org": "Wikimedia Foundation", "as": "AS14907 Wikimedia US network", "query": "208.80.152.201" }
i have this so far in my code..
im having problems in my callback function
what i know is that i need those lat/long data values to retreive them
Stephen James
@sjames1958gm
Apr 01 2016 23:49
data.lat data.lon should be your coordinate?
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:50
sweet.. think thats what i was looking for although I dont know if its going to work
just want to see if it works first and post it to page first
Stephen James
@sjames1958gm
Apr 01 2016 23:50
You work for wikimedia?
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:51
so i can save those values to a var.. then finally use the weather api to retrive lat/long values
huh? no..
@sjames1958gm thanks
CamperBot
@camperbot
Apr 01 2016 23:52
dueldrawer8 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 398 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Apr 01 2016 23:52
The isp in the data above shows wikimedia foundation.
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:53
@sjames1958gm i just found an ip/api.. actually through someone on here
Stephen James
@sjames1958gm
Apr 01 2016 23:53
ok
Good luck moving forward
Randy Goldsmith
@Dueldrawer8
Apr 01 2016 23:54
ill try
does this look right? i just want to see if the values are printing out right
$.getJSON('http://ip-api.com/json/?callback=?', function(data){ var latitude = data.lat; var long = data.long console.log(latitude + long); });
using codepen and dunno how to debug in it i guess
Ofer Sheffer
@OferSheffer
Apr 01 2016 23:59
Hi I just finished my 2nd Basic Front End project but I still have a couple bugs that could use a bit of help getting over
Stephen James
@sjames1958gm
Apr 01 2016 23:59
There is a button on the bottom that opens the console.