These are chat archives for FreeCodeCamp/HelpFrontEnd

26th
Feb 2016
ch33s3cr4ck3r
@ch33s3cr4ck3r
Feb 26 2016 00:02
i know i can set the image with a manual height, but that wont be responsive on everyones webpage
i want it so that when someone gets on to see the site the photo is the size of the screen, like the demo, and then u keep moving through. i could set the background image for the body but that would go down and spread to long
max77p
@max77p
Feb 26 2016 00:13
@ch33s3cr4ck3r paste code, its hard to even visualize your problem without seeing the code
bitgrower
@bitgrower
Feb 26 2016 00:16

@bitgrower i think you need to go into your pen settings and enable jQuery under the javascript tab

already enabled @Pezz18 -- bootstrap, too ...

... I know I've seen this error mentioned before, too ...
No 'Access-Control-Allow-Origin' header is present on the requested resource

@robynsmith ---

will definitely look at the resources mentioned, @Satchmo37 ... thanks!

CamperBot
@camperbot
Feb 26 2016 00:16
sorry bitgrower, you can't send brownie points to yourself! :sparkles: :sparkles:
:star: 284 | @pezz18 | http://www.freecodecamp.com/pezz18
:star: 298 | @robynsmith | http://www.freecodecamp.com/robynsmith
:star: 297 | @satchmo37 | http://www.freecodecamp.com/satchmo37
bitgrower
@bitgrower
Feb 26 2016 00:21
@robynsmith - I didn't even get as far as getting that error message ... where did you see that/how did you get it ?
Nate
@nightCapLounge
Feb 26 2016 00:26
Is anyone able to identify why my collapsible navbar will not expand? http://codepen.io/nightCapLounge/pen/zrbRJG?editors=1100
Terrell Vest
@MirPresT
Feb 26 2016 00:28
@nightCapLounge what do you mean?
Nate
@nightCapLounge
Feb 26 2016 00:30
Once collapsed, the navbar does not expand from the button
Bruce Young
@mutantspore
Feb 26 2016 00:31
@nightCapLounge bootstrap.js has to loaded last
it depends on jquery
Tyler Moeller
@TylerMoeller
Feb 26 2016 00:31
@nightCapLounge Sometimes you have to put everything in the "Stuff for <head>" section of the codepen settings:
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet prefetch" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
Remove the <head> section from your html and put it in settings
Terrell Vest
@MirPresT
Feb 26 2016 00:33
@nightCapLounge I guess I don't get what you are trying to do. When I view your page on codepen the nav bar is just fixed at the top...
Nate
@nightCapLounge
Feb 26 2016 00:35
Bootstrap allows you to shrink the screen to a very small size and subsequently collapses the navbar into a button that reveals the nav upon request
I tried moving everything to the settings, which doesn't appear to have worked
Bruce Young
@mutantspore
Feb 26 2016 00:36
@nightCapLounge just move the bootstrap.js you hav ein theh setting to the bottom by grabbing it
Nate
@nightCapLounge
Feb 26 2016 00:40
@mutantspore So this is strange, but that one works and when I implement it into my own project it does not. What exactly did you do? Just reorder the head?
Bruce Young
@mutantspore
Feb 26 2016 00:42
all i did was move bootstrap.js to the bottom of the list in teh JS cog settings .. nothing in the head as you have all you need in the css and js settings
bootstrap.js is dependant on jquery so it must be loaded after it
Jared Abel
@jaredabel
Feb 26 2016 00:46
when you copy/paste code from one thing to another and it doesn't work :/
in my camper news i used $('.output').append(html);
but when i try to use the same thing in my wiki, it doesn't work
Bruce Young
@mutantspore
Feb 26 2016 00:47
@nightCapLounge here it is again from your latest efforts
http://codepen.io/MutantSpore/pen/WweaNV?editors=1100
i removed most of teh stuff you have in the head as you have the same stuff in the settings
Robert Valmassoi
@valmassoi
Feb 26 2016 00:48
Can someone review my successful code for 'Friendly Date Range' (there is no wiki for it)? Not sure if I went the best route

function friendly(arr) {
  var mo = ['January ', 'February ', 'March ', 'April ', 'May ', 'June ', 'July ', 'August ', 'September ', 'October ', 'November ', 'December '];//space after
  var dateOne= arr[0].split("-");
  var dateTwo= arr[1].split("-");
  var yrOne=dateOne[0];
  var yrTwo=dateTwo[0];
  var moOne=parseInt(dateOne[1], 10);//base ten: 07 becomes 7
  var moTwo=parseInt(dateTwo[1], 10);
  var dayOne=parseInt(dateOne[2], 10);
  var dayTwo=parseInt(dateTwo[2], 10);
  var strOne="";
  var strTwo="";
  var days = ['1st', '2nd', '3rd'];

  // ----- YEAR -----  //

  if(moTwo<=moOne && yrTwo-1==yrOne && yrOne==2016){//removes years 
    if(moTwo==moOne && dayTwo>dayOne){
    }else{
    yrOne = "";
    yrTwo = "";}
  }
  else if(yrTwo==yrOne && yrOne==2016){//removes years 
    yrOne = "";
    yrTwo = "";

  }
  else if(moTwo==moOne && yrTwo-1==yrOne){//removes year Two
    if(dayTwo<dayOne){
      yrOne = ", "+ yrOne;
      yrTwo = "";
    }
    if(dayTwo==dayOne){
      yrOne = ", "+ yrOne;
      yrTwo = ", "+ yrTwo;
    }
  }  
    else if(yrTwo==yrOne){//removes years 
    yrOne = ", " + yrOne;
    yrTwo = "";
  }
  else{//adds , space before year
    yrOne = ", " + yrOne;
    yrTwo = ", " + yrTwo;
  }


    // ----- MONTH -----  //


  moOne = mo[moOne-1];//converts to spelled out
  moTwo = mo[moTwo-1];

  if (moOne == moTwo && yrOne==yrTwo){//removes month two
    moTwo = "";
  }


    // ----- DAY -----  //

  if(dayOne<4){//1st 2nd 3rd 4th nth
    dayOne=days[dayOne-1];
  }else{
    dayOne+="th";
  }
  if(dayTwo<4){
    dayTwo=days[dayTwo-1];
  }else{
    dayTwo+="th";
  }

  // ---- COMBINE ---- //

  strOne = moOne + dayOne + yrOne;
  strTwo = moTwo + dayTwo + yrTwo;
 if (arr[0]==arr[1]){
   return [strOne];
 }else{  
  return [strOne, strTwo];
 }
}

friendly(["2017-03-01", "2017-05-05"]) ;
i just kept using if statements, I bet i could combine a few but is there a different way I was missing?
bitgrower
@bitgrower
Feb 26 2016 00:52
you can also use arrays ... :)
Nate
@nightCapLounge
Feb 26 2016 00:59
@mutantspore Hmmmm I followed suit and it still doesn't appear to work inside my project space. This is strange -- it works fine in the links that you sent me
Perhaps I am doing something else wrong
Bruce Young
@mutantspore
Feb 26 2016 01:00
i’m just forking yours..
Nate
@nightCapLounge
Feb 26 2016 01:00
Yeah that's the strange part
Amir Ghafouri
@amirghafouri
Feb 26 2016 01:00
how come none of my projects work on my iphone6? Like even the basic functionalities...
Jared Abel
@jaredabel
Feb 26 2016 01:02
@amirghafouri I don't think codepen is very mobile friendly, if that is what you are using
Tyler Moeller
@TylerMoeller
Feb 26 2016 01:04
@robynsmith @bitgrower Looks like you can prepend http://crossorigin.me to the URL to get past the CORS issue. See this example: http://codepen.io/TylerMoeller/pen/WweKqJ?editors=1010
Jared Abel
@jaredabel
Feb 26 2016 01:15
could anyone take a quick glance at my pen
http://codepen.io/jaredabel00/pen/QyMOeJ?editors=1011
and see why my javascript isn't appending my html. It is something that i used in the last challenge but I can't seem to get it to work again
Bruce Young
@mutantspore
Feb 26 2016 01:19
@jaredabel at a guess the use of a form with a submit button is causing your pag eto reload. you need to change that or stop it’s default behavior
Jared Abel
@jaredabel
Feb 26 2016 01:20
what are my options?
$("#search").on('submit',function(e) { e.preventDefault();
that’s the small bit i added/changed
Jared Abel
@jaredabel
Feb 26 2016 01:25
wow, thanks @mutantspore
CamperBot
@camperbot
Feb 26 2016 01:25
jaredabel sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1175 | @mutantspore | http://www.freecodecamp.com/mutantspore
Keshav Narula
@NarulaKeshav
Feb 26 2016 01:30
Hey guys, I'm working on Pomodoro clock and I'm having a little problem. I'm using setInterval() to update the time, but when the tab becomes inactive, the setInterval() stops until I click that tab again. Can someone help me with this issue and how I can solve this?
bitgrower
@bitgrower
Feb 26 2016 02:13

@robynsmith @bitgrower Looks like you can prepend http://crossorigin.me to the URL to get past the CORS issue. See this example: http://codepen.io/TylerMoeller/pen/WweKqJ?editors=1010

Well, that's awesome, @TylerMoeller -- it truly is ... and I forked it and it works for me ... but I can't get challenge preceding displaying the cat pictures, where just the json is output ... which is kinda what I really want ... because I want to be able to see the raw data ...

(actually, 2 challenges before displaying the cat photos ... because the one right before formats the json ... I'm happy to have unformatted json ... to start ... )

thanks @TylerMoeller
CamperBot
@camperbot
Feb 26 2016 02:13
bitgrower sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star: 374 | @tylermoeller | http://www.freecodecamp.com/tylermoeller
genesisjoec
@genesisjoec
Feb 26 2016 02:16
What are these REM parameters?
 box-shadow: -2.1875rem 0.6875rem 0 -0.6875rem #fff, 2.0625rem 0.9375rem 0 -0.9375rem #fff, 0 0 0 0.375rem #fff, -2.1875rem 0.6875rem 0 -0.3125rem #fff, 2.0625rem 0.9375rem 0 -0.5625rem #fff;
Brock Callahan
@brockc
Feb 26 2016 02:16
I'm having some trouble getting the hang of the MediaWiki API with jQuery
genesisjoec
@genesisjoec
Feb 26 2016 02:16
This person is using angular
Nevermind.
Robert Valmassoi
@valmassoi
Feb 26 2016 02:25
@NarulaKeshav im wondering about this too. anyone know? is it a codepen issue?
thybean
@thybean
Feb 26 2016 02:38
Can anyone tell me why there is white space below the nav bar I built?
Bruce Young
@mutantspore
Feb 26 2016 02:42
@thybean you have a big margin-top in your .block class
needs to be 55px
thybean
@thybean
Feb 26 2016 02:44
@mutantspore How can I lower that block of info without making that white space appear
Bruce Young
@mutantspore
Feb 26 2016 02:48
you could put a div in above it to “push" it down
above the block div
thybean
@thybean
Feb 26 2016 02:50
I used position: relative and top: 250px, and it gave me the same effect as margin, without the white space. Is there anything bad about this method?
Bruce Young
@mutantspore
Feb 26 2016 02:52
no sounds ok
Gordon Davidescu
@gordondavidescu
Feb 26 2016 03:45
hey all
I'm doing pretty well so far... you can choose to be x or o
and you can click one of the top row
and it inputs x or o
but the check player win function doesn't seem to be working
it doesn't seem to be even getting called :O
Philip Warkentien II
@warkentien2
Feb 26 2016 05:09
Anybody else getting an "f-word" filled Wikipedia JSON after query?
Bruce Young
@mutantspore
Feb 26 2016 05:17
@warkentien2 lol no..what was your search?
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:29
I'm stuck at
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
in JSON requests for Quote Generator.
Read up certain things on Stack Overflow, how did you get around it?
Bruce Young
@mutantspore
Feb 26 2016 05:30
@mysticPrince what’s the quote api you are using?
pen?
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:30
very limited. what did you use?
Bruce Young
@mutantspore
Feb 26 2016 05:30
one on mashape
@mysticPrince do you have open of this
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:31
didn't get you :(
Bruce Young
@mutantspore
Feb 26 2016 05:32
are you working on codePen? can we see it?
what about mashape?
Bruce Young
@mutantspore
Feb 26 2016 05:33
it’s a place full of various API’s.. some cost but many are free
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:34
okay, so ther;s a quote api too?
Bruce Young
@mutantspore
Feb 26 2016 05:34
yes
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:34
ok...can you see what's wrong with my code?
?
sean9
@sean9
Feb 26 2016 05:37
hey yall
Bruce Young
@mutantspore
Feb 26 2016 05:37
i’ve looked at this thing a couple of times before and as there are no real docs I couldn’t make it work. Someone did finally but I think there is an issue with the object returned.
sean9
@sean9
Feb 26 2016 05:38
im trying to get the name of my location
and i do not know how
Bruce Young
@mutantspore
Feb 26 2016 05:38
@mysticPrince yes I used that one
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:38
no issues with that one?
Bruce Young
@mutantspore
Feb 26 2016 05:38
worked for me. though you need a key
Arindam Sarkar
@mysticPrince
Feb 26 2016 05:39
okay, will get one :)
Thanks @mutantspore
CamperBot
@camperbot
Feb 26 2016 05:39
mysticprince sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1176 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Feb 26 2016 05:44
@sean9
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:47
Does codepen have issues with requesting APIs? I'm using jQuery getJSON, but it turns up an error with codepen prepending its url to the API url.
Bruce Young
@mutantspore
Feb 26 2016 05:48
@sean9 look at the structure of teh weather json object and you can work out the rest of teh info using dot notation
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:48
The API request starts at api.openweathermap.org
Bruce Young
@mutantspore
Feb 26 2016 05:48
@eagarcia8 from what you have posted… you forgot the http:// on the OWM url
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:49
Yep, my variable doesn't have that, let me try again.
Bruce Young
@mutantspore
Feb 26 2016 05:49
it’s a url.. it must have it otherwise it will look for a local file
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:50
Excellent! thanks @mutantspore
CamperBot
@camperbot
Feb 26 2016 05:50
eagarcia8 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1177 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Feb 26 2016 05:50
autocomplete on web browsers has made people soft ! ;) lol
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:51
autocomplete?
Bruce Young
@mutantspore
Feb 26 2016 05:52
well no one these days types http:// into a web browser because the browser does it for them… to make it easy.
in the long long ago … you had to :)
Eduardo Garcia
@eagarcia8
Feb 26 2016 05:52
Oh, I copied that from the API documents. I type youtube.com and not just y =)
In fact I grew up with http:// but I guess I don't give it a second thought nowadays except when writing anchors.
Laith
@lbustani
Feb 26 2016 06:30
Good Evening. I am running into trouble with the diff-two-arrays challenge and can’t figure out what is wrong with my code/logic. I am getting a error of a potential infinite loop at line 21, but I don’t see why.

function diff(arr1, arr2) {
  var newArr = [];

  //We need to identify the longer array and use it in the for
  var bigArr = arr1;
  var smallArr = arr2;
  var smallInd = '';

  //If array 2 is bigger than array 1, we will need to change the big/small Arr variables.
  if(arr2.length > arr1.length) {
    bigArr = arr2;
    smallArr = arr1;
  }

  function matches(value){
     if(smallInd != -1) {
       return true;
    }
  }

  for(i=0;i<bigArr.length;i++){

    smallInd = smallArr.indexOf(bigArr[i]);
    arr1.filter(matches);
    arr2.filter(matches);

  }

  return arr1.concat(arr2);

}

diff([1, 2, 3, 5], [1, 2, 3, 4, 5]);
sean9
@sean9
Feb 26 2016 06:53
thanks @mutantspore
CamperBot
@camperbot
Feb 26 2016 06:53
sean9 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1178 | @mutantspore | http://www.freecodecamp.com/mutantspore
Boris
@boris-in-london
Feb 26 2016 07:16
@lbustani I'm not getting any errors from your code, here is the result i got [1, 2, 3, 5, 1, 2, 3, 4, 5].
Gary Morris
@fattox
Feb 26 2016 10:22
anyone here who could maybe answer a question about image centering in Bootstrap?
Tom
@ch4tml
Feb 26 2016 10:34
@fattox shoot
cla63
@cla63
Feb 26 2016 10:35
@roryavant8 "Is it bad to use negative margins?" I don't think is bad, but if is not necessary is better avoid it for have a better control on the layout
i'm new to Bootstrap, trying to find a way to center those 3 icons, but when i expand the window full on my PC, they misalign to the left it seems
any idea how to make them always absolutely centered?
Tom
@ch4tml
Feb 26 2016 10:40
@fattox It seems to be working fine! One second, I'll convert to CodePen (for my sake!)
Gary Morris
@fattox
Feb 26 2016 10:41
yeah it works, until i go fullscreen, about 80% of my fullscreen size is when it starts to shift left
Shaun Yap
@shaunyap
Feb 26 2016 10:41
@fattox looks fine on my end even fullscreen (on a mac here)
Gary Morris
@fattox
Feb 26 2016 10:41
hmm
Bartosz
@CataciD
Feb 26 2016 10:41
when centering make a wrapper with 50% left margin
and inside set the margin to -xpx where x is half of the objects width
so set the box with the icons to be 300px
Gary Morris
@fattox
Feb 26 2016 10:42
@shaunyap even here? http://codepen.io/Fattox/full/OMwJwE/ that's my portfolio page i'm working on
Bartosz
@CataciD
Feb 26 2016 10:42
and left margin -150px
Tom
@ch4tml
Feb 26 2016 10:42
@fattox works fine on your codepen
Gary Morris
@fattox
Feb 26 2016 10:42
oh wait sorry, i left a 4th image in there while testing
@fattox horiztonal centering use margin: 0 auto;
Gary Morris
@fattox
Feb 26 2016 10:43
@ch4tml can you check again? now there's 3 images on my codepen
Tom
@ch4tml
Feb 26 2016 10:44
@fattox i see the problem
Gary Morris
@fattox
Feb 26 2016 10:44
ah so do i, i didnt put the center back in while testing, i was waiting for a response in here and started fiddling with it facepalm
Tom
@ch4tml
Feb 26 2016 10:44
@fattox :)
Gary Morris
@fattox
Feb 26 2016 10:44
ok, removed the offset and put the text-center back in with the row
NOW you can see it on my codepen :D
also thanks @CataciD i will try that later
CamperBot
@camperbot
Feb 26 2016 10:45
fattox sends brownie points to @catacid :sparkles: :thumbsup: :sparkles:
:star: 339 | @catacid | http://www.freecodecamp.com/catacid
Gary Morris
@fattox
Feb 26 2016 10:45
@shaunyap thanks
and of course thanks to @ch4tml
CamperBot
@camperbot
Feb 26 2016 10:45
fattox sends brownie points to @ch4tml :sparkles: :thumbsup: :sparkles:
:star: 422 | @ch4tml | http://www.freecodecamp.com/ch4tml
Gary Morris
@fattox
Feb 26 2016 10:46
do you see the problem now i put the code back to how it was? @ch4tml
Tom
@ch4tml
Feb 26 2016 10:46
@fattox Hmm, in a case like this I would take a different approach (others might disagree!). I would so the following
  • the row that contains the three images, I would give it a smaller size, and then using the transform element to position it centrally in the screen
  • I would make this row display: inline-block with text-align: centre
@fattox Yes I do, I'll work on it in codepen, I'm experimenting now :)
Gary Morris
@fattox
Feb 26 2016 10:48
@ch4tml thanks buddy, i could make my portfolio much simpler but decided i wanted to learn a bit of framework usage along the way... hard but hopefully worth it later
CamperBot
@camperbot
Feb 26 2016 10:48
fattox sends brownie points to @ch4tml :sparkles: :thumbsup: :sparkles:
:warning: fattox already gave ch4tml points
Tom
@ch4tml
Feb 26 2016 10:54
@fattox Hmm, I'm puzzled. Few more minutes required. Times like this make me question my abilities!
Gary Morris
@fattox
Feb 26 2016 10:57
@ch4tml no problem, i did consider i could use an even number of icons to get around it, but i didn't want to and it seemed like the kind of thing i'd need to know how to fix later, so i've been banging my head against it for about 2 hours or so... haha
Shaun Yap
@shaunyap
Feb 26 2016 10:57
might be a slight tangent
but i've found using a flexbox grid very useful when trying to align things to the middle or center
Gary Morris
@fattox
Feb 26 2016 10:58
interesting, i did Flexbox mentioned the other day while looking at someone elses portfolio page for inspiration, didn't know what it was used for at the time, thanks for that @shaunyap
CamperBot
@camperbot
Feb 26 2016 10:58
fattox sends brownie points to @shaunyap :sparkles: :thumbsup: :sparkles:
:star: 335 | @shaunyap | http://www.freecodecamp.com/shaunyap
Gary Morris
@fattox
Feb 26 2016 10:59
i've got a few good suggestions here so if @ch4tml has no luck i'll look in to them all after my lunch has cooked/burnt
Tom
@ch4tml
Feb 26 2016 11:00
@fattox Afraid I can't do it! It's really annoying me! the div row that houses the icons has a smaller size on the left than the right. And I can't figure out why
@ch4tml There may be some wayward padding on one of your rows. I don't know! Sorry I couldn't be of more help!
Gary Morris
@fattox
Feb 26 2016 11:00
@ch4tml no problem, it's all a learning experience, thanks for trying so hard
CamperBot
@camperbot
Feb 26 2016 11:00
fattox sends brownie points to @ch4tml :sparkles: :thumbsup: :sparkles:
:warning: fattox already gave ch4tml points
Shaun Yap
@shaunyap
Feb 26 2016 11:00
sure, if you need further help i'll be happy to look into it when i get home from work. a bit hard to keep looking over my shoulder while concentrating on writing code.
Gary Morris
@fattox
Feb 26 2016 11:01
@shaunyap yeah i'm usually off Gitter myself, i find it too distracting and end up just watching people chat :D
@ch4tml do you have a tip for a noob like me on how you even checked that the div has different padding per side and stuff like that? browser console or something?
Tom
@ch4tml
Feb 26 2016 11:02
@fattox Sure, which browser do you use?
Gary Morris
@fattox
Feb 26 2016 11:03
firefox, i know about the F12 menu but not sure which tab to look at for things like this... my expertise is pretty much "i know F12 menu exists"
Tom
@ch4tml
Feb 26 2016 11:04
@fattox okay, so press F12. in the top left hand corner there's a little symbol - a box with an arrow pointing at it
That allows you to select DOM elements. In the case of your exmaple, I removed offset-4 and added a col-xs-4 either side of your icons. For col-xs-4 on the left was smaller than the col-xs-4
Gary Morris
@fattox
Feb 26 2016 11:06
ah i get you, ok cool, i will look in to using that to troubleshoot next time, cheers!
Tom
@ch4tml
Feb 26 2016 11:06
@fattox In fact, wait... there's 12 columns in a bootstrap row, right?
Gary Morris
@fattox
Feb 26 2016 11:06
yeah from what i read
so your example would be offset to the left by 1
which is the problem i've been having, using an odd number like 3 which doesn't allow an even number of grids either side of it
Tom
@ch4tml
Feb 26 2016 11:07
@fattox you have three icons, which leaves 9 "cols" to play with. If you offset by 4, you have a col pattern of 4 3 5
Gary Morris
@fattox
Feb 26 2016 11:07
that's why i had to wrap it in another div with a center command
yeah, that's basically the source of my problems, i didn't realise you tried 4/3/4 when i first read what you wrote actually
Tom
@ch4tml
Feb 26 2016 11:08
@fattox In which case, you might have to position them manually using the transform feature
https://developer.mozilla.org/en-US/docs/Web/CSS/transform
Gary Morris
@fattox
Feb 26 2016 11:08
if i used 4 icons, it would be 4/4/4
Tom
@ch4tml
Feb 26 2016 11:08
@fattox Exactly. I'm having a slow day today, can't believe I didn't spot it sooner. Sigh ^^
Gary Morris
@fattox
Feb 26 2016 11:08
alright, i will take a look in to that link, your last link, Flexbox, and the other idea that @CataciD mentioned... phew
Tom
@ch4tml
Feb 26 2016 11:11
@fattox Good luck trying to solve it! :) I'm sure it'll be an easy fix in the end, but getting to that fix is the tough part :-p
Gary Morris
@fattox
Feb 26 2016 11:11
yeah, just a case of time, sweat and tears... catch you later ;)
Tom
@ch4tml
Feb 26 2016 11:12
@fattox check this out in the meantime
http://codepen.io/anon/pen/oxvOVe?editors=1000
Gary Morris
@fattox
Feb 26 2016 11:14
i was just messing around with that inspector thing you mentioned
noticed something odd that might be related
if you mouseover the images in my pen, you'll see that in the col-xs box they're housed in, they are aligned to the left of that... seems to be why they aren't centered maybe
Tom
@ch4tml
Feb 26 2016 11:15
@fattox What I did:
  • Gave your icon div an id. In css gave it a position of absolute and transformed that to be central to the div-top div
  • Made the icon div smaller (width: 400px)
  • I removed "img responsive" from the social media icons
  • I gave your icons a col width of 4
Gary Morris
@fattox
Feb 26 2016 11:15
maybe there's a way to align them to the center of their grid box?
Tom
@ch4tml
Feb 26 2016 11:15
@fattox margin: 0 auto;
Gary Morris
@fattox
Feb 26 2016 11:16
i was more wondering if it's possible to do that within the grid itself, but sure i will try, haha
Tom
@ch4tml
Feb 26 2016 11:16
:) i have to go, happy coding!
Gary Morris
@fattox
Feb 26 2016 11:16
@ch4tml you too, cheers man
Tom
@ch4tml
Feb 26 2016 11:17
@fattox and check http://codepen.io/anon/pen/oxvOVe?editors=1000! It's a more advanced way of positioning, but you'll come to know and use it soon enough!
Gary Morris
@fattox
Feb 26 2016 11:18
yep already got it open and bookmarked :)
also i'll be damned, that alignment within the grid fixed it
wouldn't have figured that without you telling me how to use the inspector!
@ch4tml thanks for everything
CamperBot
@camperbot
Feb 26 2016 11:19
fattox sends brownie points to @ch4tml :sparkles: :thumbsup: :sparkles:
:warning: fattox already gave ch4tml points
Soumitra Varindra Chakravarti
@soumitrachakravarti
Feb 26 2016 11:48

Based on my code below, when I click the #share button, all of generated .quote are being share (eg. if I generated 5 times, 5 twitter popup windows are being opened)

What do I need to do to share only the current .quote?

$(document).ready(function() {
  $('#share').hide();
  $('#generate').on('click', function() {
    $('#share').show();
    $.ajax({
      jsonp: "jsonp",
      dataType: "jsonp",
      url: 'http://api.forismatic.com/api/1.0/',
      contentType: 'application/jsonp',
      data: {
        lang: "en",
        method: "getQuote",
        format: "jsonp"
      },
      success: function(data) {
        var response = '<p>' + data.quoteText + '</p><small><cite title="Source Title">' + data.quoteAuthor + '</cite></small>';
        $('.quote').html(response);
        $('#share').on('click', function() {
          var win = window.open('https://twitter.com/intent/tweet?hashtags=' + data.quoteAuthor + '&related=ChakravartiS&text=' + data.quoteText , '_blank');
          if (win) {
            win.focus();
          } else {
            alert('Please allow popups');
          }
        });
      }
    });
  });

});
h4r1m4u
@h4r1m4u
Feb 26 2016 11:58
@soumitrachakravarti do you have it in codepen?
Soumitra Varindra Chakravarti
@soumitrachakravarti
Feb 26 2016 12:06
h4r1m4u
@h4r1m4u
Feb 26 2016 12:10
@soumitrachakravarti oh, i see what's happening. by having the click handler for the #share button inside the .ajax() success callback function, you're creating a new click handler every time you generate a quote. what you can do instead - a) remove the click handler, b) turn the #share button into an <a> (if you use <a class="btn btn-info"...>, it'll look like a button). c) inside the ajax success callback, manipulate the href attribute of the #share <a> (each time you generate a quote, update the href with the new link).
Soumitra Varindra Chakravarti
@soumitrachakravarti
Feb 26 2016 12:11
@h4r1m4u Ok. Let me give this is a try
h4r1m4u
@h4r1m4u
Feb 26 2016 12:13
@soumitrachakravarti here's another possibility:
        $( "#share").off( "click" ); // add this in the success callback; it'll remove all the previously created click handlers
        $('#share').on('click', function() {
Dariusz Biskupski
@Visiona
Feb 26 2016 12:13
Hi All, I'm desperately looking for help. I want to fix a div object in specific place on the background image so whenever I change the size of the window, the div stays exatly in the same position to the specific background point
h4r1m4u
@h4r1m4u
Feb 26 2016 12:16
@Visiona you'll most likely want to position the div using relative units (like %) instead of px
Soumitra Varindra Chakravarti
@soumitrachakravarti
Feb 26 2016 12:17

@h4r1m4u I did this

$('#share').off('click');

Thanks.

CamperBot
@camperbot
Feb 26 2016 12:17
soumitrachakravarti sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1487 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Dariusz Biskupski
@Visiona
Feb 26 2016 12:17
@h4r1m4u , yes I tried that, but then the background is moving whenver I change the window sizing
h4r1m4u
@h4r1m4u
Feb 26 2016 12:17
:thumbsup: np
@Visiona and if you set the position of the div in %, it should move together (or rather in relation) to the background
Dariusz Biskupski
@Visiona
Feb 26 2016 12:19
it happens not exactly like that... if I expand the window little bit the point in the background shifts away, but div object stays exactly in the same x and y point of the windows
h4r1m4u
@h4r1m4u
Feb 26 2016 12:21
@Visiona do you have it in codepen?
Dariusz Biskupski
@Visiona
Feb 26 2016 12:25
so, I want this quote to be on that specific brick
how to create this kind of effect
Philip Warkentien II
@warkentien2
Feb 26 2016 13:09
@mutantspore https://en.wikipedia.org/w/api.php?action=query&format=json&prop=extracts%7Cpageimages&list=allpages&meta=&titles=pizza&exintro=&explaintext=
I'm still testing params for my query. I have no idea how to get multiple "correct" entries.
Omran Abazid
@OmranAbazid
Feb 26 2016 13:09
This message was deleted
change you css to this

```html {
overflow: hidden;
background: url( http://s20.postimg.org/ozjmaugtp/web_wall.jpg) no-repeat center center;
}
body{
background:none;
}
.can {
color:white;
margin-right:150px;
margin-top:10px;
text-align: center;
overflow: hidden;
}

button {
margin: 150px auto;
}```

@Visiona
vichus1995
@vichus1995
Feb 26 2016 13:12
hi guys.i'm doing the weather app zipline and was wondering how to find the corresponding weather conditions for each weather id so as to change the background image accordingly.
can anyone help?
Bartosz
@CataciD
Feb 26 2016 13:32
read the api response
and make a condition based on it no ?
afaik there's a key that returns things like "cloudy" "sunny" "windy" etc
find it
Bartosz
@CataciD
Feb 26 2016 13:32
find it, put it into a var and compare
CamperBot
@camperbot
Feb 26 2016 13:32
find it put it into a var and compare
nothing found
Bartosz
@CataciD
Feb 26 2016 13:32
then change bg accordingly
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:32
this build a personel portfolio challange is too much to handle with the lectures given so far..
Bartosz
@CataciD
Feb 26 2016 13:33
@VoignarCS its not mate
its really simple
its basic html
and css
nothing more
you can google everything else
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:33
The example given is not that easy to duplicate :P
Bartosz
@CataciD
Feb 26 2016 13:33
what are you have ing problems with ?
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:33
the portfolio part...
Bartosz
@CataciD
Feb 26 2016 13:33
you're not supposed to DUPLICATE
make your own
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:34
I know
Bartosz
@CataciD
Feb 26 2016 13:34
lol
portfolio as in those boxes?
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:34
But I am trying to make it my version you know
yeah
Bartosz
@CataciD
Feb 26 2016 13:34
those
are literally
bootsrat template
for "thumbnail"
bootstrap
*
google bootstrap thumbnails
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:34
lol so I should just give them a class
Bartosz
@CataciD
Feb 26 2016 13:34
the point of ziplines is to make you look for things you dont know
fcc cant possibly treach you everything
google and wiki are your friends
Kaan Alpar
@KaanAlpar
Feb 26 2016 13:35
okay
Richard
@stormgrass
Feb 26 2016 13:50
Hey everyone, I have a quick Twitch API question
Bartosz
@CataciD
Feb 26 2016 13:53
shoot
Richard
@stormgrass
Feb 26 2016 13:57
Ok. I'm calling the API once with the streams?channel parameter, and all the usernames. I write the names of the active ones into an array, then do an indexOf to see whether they're in there or not. I then build the page by getting all the relevant info on the usernames via api calls to the respective channels. Thing is, when I load the page once, sometimes channels that should be online are shown as offline (even though I can see in my console that their names are added to aforementioned array). Any idea why that may be?
Bartosz
@CataciD
Feb 26 2016 13:57
thats probably because the api hasnt loaded yet
it works on the condition if the "stream" is Null or not
if you're loading 50 api calls
it might be slow
I'm not sure why you're loading all of them
you could make a call for every channel
and when the call completes it generates a window with the name and status
then just add a filter that will add or remove a "hidden" class
thats my approach at least
if you want your wayt you need to make sure ALL the api data was loaded
Richard
@stormgrass
Feb 26 2016 14:03
I think your approach is basically what I'm doing
Bartosz
@CataciD
Feb 26 2016 14:04
i htought you were calling a different thing
cause the API has a call for specific stream to check if its online or call for a list of streams
Richard
@stormgrass
Feb 26 2016 14:05
Well, I'm calling the API for every username once. And I'm doing one API call to check on all of the streams. The ones that appear as live in there I push into an array.
Which will then help me in filtering the channels into on- and offline
Bartosz
@CataciD
Feb 26 2016 14:10
but
why push into an array?
just generate a box
you can filter things by checking class
you generate boxes and check if they're online
if they're online .addClass("online");
then on filter click
check if has class online
Richard
@stormgrass
Feb 26 2016 14:11
Well, I generate the box with my channel calls, and while doing that, I check the array to see whether a channel is online or offline
Bartosz
@CataciD
Feb 26 2016 14:12
so you create a whole new array :P
and need variables or you will store the whole object
in the array
instead of just filtering by word
mate wait till you get to the search for streams
;P
Philip Warkentien II
@warkentien2
Feb 26 2016 14:12

@VoignarCS Just make a simple portfolio page. I left mine as WIP. Planning on returning to it for the last part before getting my Front-end certificate

after all. there's no project to display on the portfolio. so it's kinda pointless

sigursiguros
@sigursiguros
Feb 26 2016 14:12
Hi campers, for some reason my pause button for clearInterval isn't working, any clues? http://codepen.io/Sigursiguros/pen/QyJaLQ?editors=0010
Bartosz
@CataciD
Feb 26 2016 14:13
@sigursiguros interval is shit
interval doesnt work as you think it would
it has a global timer and fucks up when you try to pause it etc
check out setTimeout()
a lot more reliable
Richard
@stormgrass
Feb 26 2016 14:14
@CataciD Well, thanks for your input. I'm going to dive back in again. Cheers
CamperBot
@camperbot
Feb 26 2016 14:14
stormgrass sends brownie points to @catacid :sparkles: :thumbsup: :sparkles:
Bartosz
@CataciD
Feb 26 2016 14:14
if you do setTimeout(function(){setTimeout()})
CamperBot
@camperbot
Feb 26 2016 14:14
:star: 342 | @catacid | http://www.freecodecamp.com/catacid
Philip Warkentien II
@warkentien2
Feb 26 2016 14:15
@vichus1995 and @VoignarCS , @CataciD knows what he's talking about.
Bartosz
@CataciD
Feb 26 2016 14:15
do I ? :D
no i mean i tried it
and interval is just not meant to be used that way
you can make a function
setTimeout starts after delay
Jan Pribošek
@GreatDanton
Feb 26 2016 14:16
@CataciD you couldn't say it better lol, had a lot of troubles with interval
Bartosz
@CataciD
Feb 26 2016 14:16
so you just make a timer that reduces your "clock"
by 1 each setTimeout
and the function with setTimeout also runs itself after that timeout
unless paused=true
its really easy that way
it would've saved me like a days of nerves
if i knew that
sigursiguros
@sigursiguros
Feb 26 2016 14:20
so I do setTimeout(function(){setTimeout()}) and make it one second?
Bartosz
@CataciD
Feb 26 2016 14:21
not literally
make a function
that uses setTimeout
like function(){
make the counter go down by one
setTimeout(popthis function again),1000<- one second
}
like function(){
make the counter go down by one
setTimeout(popthis function again),1000<- one second
}
easy to understand right?
you make a function that decreases the timer by ONE second
and set a delay in that function
to run itself again after 1 second
then before the setTimer you can add a condition
var pause=false;
if(!pause){
setTimetout(thisfunctionagain after 1000 ms)
}
this is the logic
sigursiguros
@sigursiguros
Feb 26 2016 14:25
THanks @CataciD lemme try
CamperBot
@camperbot
Feb 26 2016 14:25
sigursiguros sends brownie points to @catacid :sparkles: :thumbsup: :sparkles:
:star: 345 | @catacid | http://www.freecodecamp.com/catacid
RahulRamesh91
@RahulRamesh91
Feb 26 2016 14:25
So i have a very basic problem..css noob here..i can figure out how to align elements and cant decode whr to use what properties..Even the decision of the values is done by a trial and error basis and i know this is very hackish ..Can i know where i can get good resources some guided tutorials or even books ..I need to improve my css :|
can't figure out*
Bartosz
@CataciD
Feb 26 2016 14:27
literally google
stackoverflow
and trial and error
try to avoid pixels
and doing shit like
margin 4231px
RahulRamesh91
@RahulRamesh91
Feb 26 2016 14:27
use % values?
Bartosz
@CataciD
Feb 26 2016 14:28
yeah %
em
or such
you can use px
if its static
like i want 600px width
DONE
otherwise just % or em
em is good cause it scales things to the screen
not to the window of the browser
also read and try out bootstrap
bootstrap has handy things to have columns ofequal width etc
Philip Warkentien II
@warkentien2
Feb 26 2016 14:29
@RahulRamesh91 https://www.youtube.com/watch?v=kejG8G0dr5U&list=PLqGj3iMvMa4L731ispRfGAabXeRpM4RL6
Great short 7 videos. (I watch them at' 2x speed)
This channel will save your life
RahulRamesh91
@RahulRamesh91
Feb 26 2016 14:34
@CataciD em always takes the value of the parent right ?
Bartosz
@CataciD
Feb 26 2016 14:36
um no
Philip Warkentien II
@warkentien2
Feb 26 2016 14:36
@RahulRamesh91 youtube.com/watch?v=UHf3aQz50jQ same channel answers all your css questions.
Bartosz
@CataciD
Feb 26 2016 14:36
em is screen based
% takes parent
depending on if its absolute or relative or w/e
1em will always be the same in any window on the same size of screen
1em will only change if you change the screen size
so screen>phone will be diff
thats why 1em is used
to make sure things fit on phone
etc
RahulRamesh91
@RahulRamesh91
Feb 26 2016 14:46
@warkentien2 @CataciD Thanks for the help guys :)
CamperBot
@camperbot
Feb 26 2016 14:46
rahulramesh91 sends brownie points to @warkentien2 and @catacid :sparkles: :thumbsup: :sparkles:
:star: 443 | @warkentien2 | http://www.freecodecamp.com/warkentien2
Bartosz
@CataciD
Feb 26 2016 14:46
no probs mate ;P
CamperBot
@camperbot
Feb 26 2016 14:46
:star: 347 | @catacid | http://www.freecodecamp.com/catacid
Philip Warkentien II
@warkentien2
Feb 26 2016 14:54
@CataciD still up for questions?
Jon C
@jqc5169
Feb 26 2016 15:03
can anyone explain exactly the concept of user stories for the tribute page? basic i know but im not understanding the objective of what it is i guess
RahulRamesh91
@RahulRamesh91
Feb 26 2016 15:07
your application should satisfy the user stories
woops sry about tht ...i didnt read the whole thing ..:|
Philip Warkentien II
@warkentien2
Feb 26 2016 15:10
@jqc5169 it's a checklist of what your project must have.
Is the question more specific about the meaning of each item on the checklist?
RahulRamesh91
@RahulRamesh91
Feb 26 2016 15:10
as far as the tribute page is concerned , see the vid ...it shud be clear
he shows a full example of the finished page
Jon C
@jqc5169
Feb 26 2016 15:11
oh nevermind then. i wiki'd user story and it made me more confused then it is. im good then.
thanks guys
RahulRamesh91
@RahulRamesh91
Feb 26 2016 15:11
yea the term may throw u off ;P
sigursiguros
@sigursiguros
Feb 26 2016 15:17
Hi guys, what's wrong with my code, it's not working.
  $("#startNow").click(function() {
    totalSeconds = 60 * document.getElementById("clock").innerHTML;
    while (totalSeconds >= 0) {
      clockIntervalID = setInterval(function() {
        startClock()
      }, 1000);
    totalSeconds -= 1;
    }
    else {clearInterval(clockIntervalID)};
  });
Richard
@stormgrass
Feb 26 2016 15:23
@sigursiguros I think you should have listened to @CataciD when he explained to you how to use setTimeout
sigursiguros
@sigursiguros
Feb 26 2016 15:26
@stormgrass I tried I don't know how to rewrite my code
Richard
@stormgrass
Feb 26 2016 15:28
@sigursiguros well, if you could come up with your current code, you should be able to come up with a rewrite?
sigursiguros
@sigursiguros
Feb 26 2016 15:28
@stormgrass ok so basically i have to redo the whole thing
it's taken me hours
Richard
@stormgrass
Feb 26 2016 15:29
@sigursiguros well, considering that this function, the one that counts down your timer, is the integral part of the whole pomodoro, I'd say yes. Doesn't hurt writing it from scratch.
sigursiguros
@sigursiguros
Feb 26 2016 15:30
ok thanks @stormgrass
CamperBot
@camperbot
Feb 26 2016 15:30
sigursiguros sends brownie points to @stormgrass :sparkles: :thumbsup: :sparkles:
:star: 288 | @stormgrass | http://www.freecodecamp.com/stormgrass
Richard
@stormgrass
Feb 26 2016 15:31
@sigursiguros Sure thing. I know how frustrating the pomodoro is, believe me.
sigursiguros
@sigursiguros
Feb 26 2016 15:31
@stormgrass when I write a function, does it have to run automatically?
Or it can wait until I initiate it with an event handler or click event?
I tried writing a standalone function just now and it seems like it runs automatically
Richard
@stormgrass
Feb 26 2016 15:32
@sigursiguros well, this one needs to wait until you start it up by clicking the start button
sigursiguros
@sigursiguros
Feb 26 2016 15:33
would the code be ("#object").onclick = function(){nameOfFunction};
Richard
@stormgrass
Feb 26 2016 15:33
@sigursiguros you basically write a function that decrements your current amount of seconds. As long as there are seconds, you call that function again (via setTimeout). If you're out of seconds, you stop
sigursiguros
@sigursiguros
Feb 26 2016 15:33
it doesn't seem tow ork
Richard
@stormgrass
Feb 26 2016 15:34
@sigursiguros well, yeah. But what you'll call then is the function that calls the decrement function (which then runs until no seconds are left)
sigursiguros
@sigursiguros
Feb 26 2016 15:34
great thanks
Richard
@stormgrass
Feb 26 2016 15:37
@sigursiguros google decrement function, that should give you an idea of what should be going on inside your clock
sigursiguros
@sigursiguros
Feb 26 2016 15:44
@stormgrass is there something wrong with my code?
  var initiateClock = function() {
    totalSeconds = 60 * document.getElementByID("clock").innerHTML;
    if (totalSeconds >= 0) {
      var s = totalSeconds % 60;
      var m = Math.floor(totalSeconds / 60);
      totalSeconds -= 1;
      var minutes = checkTime(m)
      var seconds = checkTime(s);
      s -= 1;
      $("#clock").text(minutes + ":" + seconds);
      timeInterval = setTimeOut(initateClock, 1000);
    }
  };
my clock is nott counting down, anyone can give me some guidance? http://codepen.io/Sigursiguros/pen/QyJaLQ?editors=0010
Philip Warkentien II
@warkentien2
Feb 26 2016 16:09
@sigursiguros first clean your code. you're mixing
1) pure Javascript document.getElementByID("clock") with the same thing in jQuery $('#clock') choose one of them.
2) your function calls should have (). e.g: initiateClock() in the "#startNow" function.
3) use hifens in HTML variables (id/classes), and camelCase in JavaScript. (just for convention)
4) this doesn't solve your problem. but it way more readable
@sigursiguros you might have to parseInt() your html request. try text() instead of innerHTML(). That way you're parsing a string and not possible html tags.
sigursiguros
@sigursiguros
Feb 26 2016 16:33
@warkentien2 it is not wokring still
kirbyedy
@kirbyedy
Feb 26 2016 16:41
typo here: initateClock
Laith
@lbustani
Feb 26 2016 16:49
@lbustani OK. I now understand why this does not work. The best explanation of how to fix it was provided by http://javascriptissexy.com/understand-javascript-closures-with-ease/. In essence, the matches function references smallInd which is a reference, not a value.
Lanitta
@DivaWeb
Feb 26 2016 16:53
hello all
Michael Betts
@MichaelFlops
Feb 26 2016 16:53
@DivaWeb hi hi hi
Lanitta
@DivaWeb
Feb 26 2016 16:54
please take a look at my tribute page and tell me if it looks like I am headed on the right track or being to detailed.http://codepen.io/DivaWeb/pen/NNKaWQ
@MichaelFlops Helloooooooo from the great beyon lol
Michael Betts
@MichaelFlops
Feb 26 2016 17:13
@DivaWeb I will! Sorry didn’t check till just now, I’ll look at tit
it* lol
@DivaWeb Looks great right off the bat, I would just center the img, and then at the bottom add a link to his wiki!
@DivaWeb now you can center imgs in bootstrap without any extra css, (same with that h2 that you add css to center) byt adding the class text-center to your html. It’s in bootstrap!
kirbyedy
@kirbyedy
Feb 26 2016 17:20
@DivaWeb ther is a small glitch on the year 1981-1983
Michael Betts
@MichaelFlops
Feb 26 2016 17:20
@DivaWeb definitely the right track! Also I just noticed that you added the links to bootstrap mannually….good job! But in Codepen its better to add them using their interface, you click the cog on the css tab and can add any script you want there. Then it cleans up real estate in your html, which is very valuable! If or when you export your codepen project, it’ll automatically add those scripts
kirbyedy
@kirbyedy
Feb 26 2016 17:20
its between 1960 and 1970
Cody Bouscaren
@codybousc
Feb 26 2016 17:46
Hi all, can anyone tell me the best way to remove the spaces between the four boxes here? I'd also like to have them permanently 'stuck' to the top of the footer http://codepen.io/codybousc/pen/vGYEre
Dariusz Biskupski
@Visiona
Feb 26 2016 17:46
Hi All, I am still struggling, with this.. hoping to meet someone now who can help me.. I have a background image of bricks on my website and I want to fix div with text onto specific brick in the image background... would you have any timps how to do it?
kirbyedy
@kirbyedy
Feb 26 2016 17:49
@codybousc because you are using bootstrap that is the default behaviour
basically you will have to override the padding between the boxes
Untitled-1.jpg
Cody Bouscaren
@codybousc
Feb 26 2016 17:51
@kirbyedy i attempted removing the margins and padding between the boxes, but have the same result
.box {
  max-width: 400px;
  width: 100%;
  height: 350px;
  background-color: yellow;
  margin-bottom: 50px;
  margin-left: 0px; 
  margin-right: 0px; 
  padding-left: 0px; 
  padding-right: 0px; 
}
kirbyedy
@kirbyedy
Feb 26 2016 17:54
how about adding a class with padding 0
Cody Bouscaren
@codybousc
Feb 26 2016 17:54
@kirbyedy i appreciate the screen shot!
kirbyedy
@kirbyedy
Feb 26 2016 17:54
add that new class to the columns
Cody Bouscaren
@codybousc
Feb 26 2016 17:54
what exactly did you inspect to get that to show
kirbyedy
@kirbyedy
Feb 26 2016 17:55
your columns
Cody Bouscaren
@codybousc
Feb 26 2016 17:55
@kirbyedy ok, thank you!
CamperBot
@camperbot
Feb 26 2016 17:55
codybousc sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
kirbyedy
@kirbyedy
Feb 26 2016 17:55
for example <div class="col-sm-3 col-xs-3 padding">
CamperBot
@camperbot
Feb 26 2016 17:55
:star: 552 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
Cody Bouscaren
@codybousc
Feb 26 2016 17:55
my css is pretty rough
kirbyedy
@kirbyedy
Feb 26 2016 17:55
.padding {
padding: 0;
}
Philip Warkentien II
@warkentien2
Feb 26 2016 17:56
@DivaWeb your talking about the content? It's more or less irrelevant. The style is not over detailed
robynsmith
@robynsmith
Feb 26 2016 18:01

Hello everyone,

I’m having an issue with the random quote project. I’m trying to get a quote from an API but it seems to fail…and I’m not sure what I’m doing wrong. Here’s the link:

http://codepen.io/robsmith/pen/XdrPeJ

kirbyedy
@kirbyedy
Feb 26 2016 18:02
@robynsmith this is the response from your console: XMLHttpRequest cannot load http://api.forismatic.com/api/1.0/?method=getQuote&format=json&lang=en. No 'Access-Control-Allow-Origin' header is present on the requested resource.
hakimnasir
@hakimnasir
Feb 26 2016 18:02
This message was deleted
classact1
@classact1
Feb 26 2016 18:08
Hey guys. I'm having trouble with Local Weather project. I can't save longtitude and latitude from navigator. I don't understand how it works. Here is my code.
http://codepen.io/classact1/pen/ZQgdXq?editors=0010
robynsmith
@robynsmith
Feb 26 2016 18:09
@kirbyedy How did you get that error?
Matthew Boland
@mattboland
Feb 26 2016 18:09
This message was deleted
kirbyedy
@kirbyedy
Feb 26 2016 18:10
in the console
Matthew Boland
@mattboland
Feb 26 2016 18:11
can someone help me understand the theory behind api's a little better? I am creating a json formatted response for each entry to the search bar on my wiki page but now i don't know what to do with that information to get it to print links to the DOM.http://codepen.io/MattBoland/pen/WrVJGP?editors=1011
kirbyedy
@kirbyedy
Feb 26 2016 18:12
$(document).ready(function() {
  $(".btn").click(function() {
    $.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=myJsonMethod&?callback=?");
  });
});
function myJsonMethod(response){
  console.log (response);
}
I google this up, try something like this
kirbyedy
@kirbyedy
Feb 26 2016 18:24
@radheyIndia there is a horizontal scroll bar, which gives me a conclusion that you have some kind of padding on your page
Radhika Chaudhary
@radheyIndia
Feb 26 2016 18:25
its been corrected @kirbyedy :0
:)
kirbyedy
@kirbyedy
Feb 26 2016 18:26
:thumbsup:
mand0
@mand0
Feb 26 2016 18:27
@classact1 your pen isn't loading for me
i just see Loading..........
classact1
@classact1
Feb 26 2016 18:28
hmm
mand0
@mand0
Feb 26 2016 18:29
ok that's better
aswathm78
@aswathm78
Feb 26 2016 18:36
@radheyIndia its working but mouse pointer is not showing on the buttons
mand0
@mand0
Feb 26 2016 18:37
@classact1 try like this
function GeoData(position) {
  latitude = position.coords.latitude;
  longtitude = position.coords.longtitude; 
}
function fail(test) {
  document.getElementById("data").innerHTML = "test";
}

navigator.geolocation.getCurrentPosition(GeoData, fail);
then you can assign html elements to latitude/longitude
classact1
@classact1
Feb 26 2016 18:39
eeee... can you explain what happens here? : ) @mand0
mand0
@mand0
Feb 26 2016 18:40
the GeoData function is what happens on success (i.e. the user allow sharing of location)
the fail function is what happens if the user does not have sharing enabled
put both functions into the getCurrentPosition method. it's easier to read if you separate them out
classact1
@classact1
Feb 26 2016 18:41
and why it doesn't work when I don't have the fail function?
@mand0 and why it doesn't work when I don't have the fail function?
mand0
@mand0
Feb 26 2016 18:42
not sure to be honest. this https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition says that the "error" function is optional
oh wait
nvm
you need to have document.getElementById("data").innerHTML = latitude; within your success function
This message was deleted
function GeoData(position) {
  latitude = position.coords.latitude;
  longtitude = position.coords.longtitude; 
  document.getElementById("data").innerHTML =  latitude;
}
classact1
@classact1
Feb 26 2016 18:45
so i basically have to have all my code inside this function? @mand0
mand0
@mand0
Feb 26 2016 18:46
i just finished my weather app yesterday. that's what i had to do
take a look at mine if you want
hajeansonne
@hajeansonne
Feb 26 2016 18:48
not how I wanted this to look, but I need to move on, maybe I will come back to it when I understand more and clean it up a bit. please let me know if something needs to be fixed. Thanks! http://codepen.io/HayleyComments/full/adxqNx/
classact1
@classact1
Feb 26 2016 18:49
@mand0 naah, man I want to do figure it out myself! : D but thanks a lot!
CamperBot
@camperbot
Feb 26 2016 18:49
classact1 sends brownie points to @mand0 :sparkles: :thumbsup: :sparkles:
:star: 309 | @mand0 | http://www.freecodecamp.com/mand0
mand0
@mand0
Feb 26 2016 18:50
no problem :+1:
Alexander Lamm
@ALamm
Feb 26 2016 19:03
Hello! I'm really struggling with the TwitchTV exercise and I'm hoping somebody can help me out.
Specifically I'm having trouble "accessing" the data after I've made the JSON call. Currently I'm just testing making one JSON call for one twitch stream.
I set up my variable to store the results, and I've tried every iteration I can think of to access the results which are an array within an object but am completely lost.
Can you help? If you look at the console you will see that my console.log(twitchResult) is showing the results of the JSON call but I can't get at the values within it.
Here is my code - and thanks a million:
http://codepen.io/alamm/pen/VawLyG
Hemang Kumar
@hemangsk
Feb 26 2016 19:11
This message was deleted

@ALamm you are receiving an object , which is like

Object{ "prop1":"value1",
"prop2":"val2"
};

right?

Screen Shot 2016-02-27 at 12.44.37 AM.png
You can access the channel property using
obj["_links"]["channel"] or obj._links.channel
Alexander Lamm
@ALamm
Feb 26 2016 19:21
@hemangsk I have an object called "twitchResult", which contains an object called "results" which contains an array. I am pushing an object (channel) into the "results" array.
e.g. twitchResult { results: [ logo:"value1", display_name:"value2", status:"value3", url:"value4"] }
zivce_
@zivce
Feb 26 2016 19:22
hey there guys can somebody help me with twitter share button?
classact1
@classact1
Feb 26 2016 19:25
@zivce-gopro whats your problem?
zivce_
@zivce
Feb 26 2016 19:25
I don't know how to add tweet a quote button
Hemang Kumar
@hemangsk
Feb 26 2016 19:25
@ALamm Okay! m checking the codepen
Alexander Lamm
@ALamm
Feb 26 2016 19:28
@hemangsk Great thanks! You will see in the Javascript part of the Pen (commented out) that I've tried to access the results in a variety of ways. Ready to bash my head through the wall.
CamperBot
@camperbot
Feb 26 2016 19:28
alamm sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 312 | @hemangsk | http://www.freecodecamp.com/hemangsk
Lanitta
@DivaWeb
Feb 26 2016 19:28
hey guys
mand0
@mand0
Feb 26 2016 19:28
@zivce-gopro read twitter's documention on adding buttons
Lanitta
@DivaWeb
Feb 26 2016 19:29
I am trying to figure out why none of my responsive stuff for my img isn't working http://codepen.io/DivaWeb/pen/NNKaWQ?editors=1100
Kristijan
@Kikikralj007
Feb 26 2016 19:29
Lanitta
@DivaWeb
Feb 26 2016 19:32
@Kikikralj007 what is the problem?
Philip Warkentien II
@warkentien2
Feb 26 2016 19:34
@DivaWeb write all your classes in one declaration like this class="media object img-responsive img-rounded center"
Lanitta
@DivaWeb
Feb 26 2016 19:35
@warkentien2 don't I feel dumb lol
@warkentien2 thanks
CamperBot
@camperbot
Feb 26 2016 19:35
divaweb sends brownie points to @warkentien2 :sparkles: :thumbsup: :sparkles:
:star: 447 | @warkentien2 | http://www.freecodecamp.com/warkentien2
Hemang Kumar
@hemangsk
Feb 26 2016 19:41
@ALamm
    function getTwitchers(url, item) {

            $.getJSON(url, function(data) {
                console.log(data);
                var obj = data.stream;
                console.log(obj);
                // Check if the object is not valid using (obj == null) which is shorthand for both null and undefined
                if (obj == null) {
                    if (obj === undefined) {
                        channel.display_name = item;
                        channel.status = "closed";
                        console.log("this is undefined");
                    } else {
                        obj._links.channel = item;
                        channel.status = "offline";
                        console.log("this is null");
                    }
                } else {
                    console.log("inelse");
                    channel.logo = obj.channel.logo;
                    channel.display_name = obj.channel.display_name;
                    channel.status = obj.channel.status;
                    channel.url = obj.channel.url;
                    console.log("valid entry");

                    twitchResult["results"].push(channel);
                }


                //            console.log(twitchResult);     

            });
        }
@ALamm Modified the "else" block, you can use console.log(twitchResult) to output the Object
Ben
@ReductioAbsurdum
Feb 26 2016 19:43

Is anything written in jquery/ $(document).ready(function(){

)}; considered AJAX? As in, if someone were referring to using ajax what are they referring to?

Philip Warkentien II
@warkentien2
Feb 26 2016 19:45
@DivaWeb there's nothing to feel dumb about. Just keep learning!
Lanitta
@DivaWeb
Feb 26 2016 19:48
@warkentien2 I should have seen that lolololo
Alexander Lamm
@ALamm
Feb 26 2016 19:50
@hemangsk Thanks, but as far as I can tell the modified else statement works the same as the original. Both methods twitchResult.results and twitchResults["results"] both push the results of the channel object into the twitchResult object.
This wasn't the area I was struggling with. Instead, I'm struggling with how to access the values of the modified twichResult object (after the function has run), so that I can do 'stuff' with it. e.g. display the value of the 'status' property onscreen etc...
CamperBot
@camperbot
Feb 26 2016 19:50
alamm sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:warning: alamm already gave hemangsk points
Muse
@nokoli200
Feb 26 2016 20:11
Is anyone else working on the Portfolio challange?
Jeremy
@jer244
Feb 26 2016 20:19
@nokoli200 Hi, I'm just starting the portfolio challenge...
Cody Bouscaren
@codybousc
Feb 26 2016 20:19
Hey all, any suggestions on how to vertically align the 'PROJECTS, OBSERVATORY...' text in the boxes below? http://codepen.io/codybousc/pen/vGYEre
Hemang Kumar
@hemangsk
Feb 26 2016 20:22
@ALamm
    $(document).ready(function() {

        var twitchResult = {
            "results" :[]
        };
        var channel = {
            logo: "",
            display_name: "",
            status: "",
            url: ""
        };
        var finalUrl = "https://api.twitch.tv/kraken/streams/freecodecamp?callback=?"

        getTwitchers(finalUrl, "freecodecamp");

    function updatevalue(){
      console.log(twitchResult.results);
      console.log(twitchResult.results[0].display_name);
    }
        function getTwitchers(url, item) {

            $.getJSON(url, function(data) {
                console.log(data);
                var obj = data.stream;
                console.log(obj);
                // Check if the object is not valid using (obj == null) which is shorthand for both null and undefined
                if (obj == null) {
                    if (obj === undefined) {
                        channel.display_name = item;
                        channel.status = "closed";
                        console.log("this is undefined");
                    } else {
                        obj._links.channel = item;
                        channel.status = "offline";
                        console.log("this is null");
                    }
                } else {
                    console.log("inelse");
                    channel.logo = obj.channel.logo;
                    channel.display_name = obj.channel.display_name;
                    channel.status = obj.channel.status;
                    channel.url = obj.channel.url;
                    console.log("valid entry");
                    twitchResult["results"].push(channel);
          updatevalue();

                }

                //            console.log(twitchResult);     

            });
        }

    });
David Matichuk
@DSMagica
Feb 26 2016 20:25
Doh
Muse
@nokoli200
Feb 26 2016 20:25
@jer244 Do you know how to do the background overlay?
Nicholas
@nick88p
Feb 26 2016 20:27
Hi guys, I want to create a button (html id="unit") that a user can click and the corresponding text should change from Celsius to Fareinheit to Celsius to Fareinheit etc. with each click. The following code is not working: Any ideas? $("#unit").on("click", function(){ $(this).toggle(function(){ $(this).text("Fareinheit", "Celsius"); }); });

  $("#unit").on("click", function(){
    $(this).toggle(function(){
        $(this).text("Fareinheit", "Celsius");
                });
  });
Jeremy
@jer244
Feb 26 2016 20:28
@nokoli200 No. Still trying to figure most of this one out... I've been reading through the HTML and Bootstrap sections of this site http://www.tutorialrepublic.com/. Someone on here pointed me in that direction a couple days ago and it was a huge help with the tribute page.
Muse
@nokoli200
Feb 26 2016 20:30
@jer244 ok I'll check that out. Thanks much!
CamperBot
@camperbot
Feb 26 2016 20:30
nokoli200 sends brownie points to @jer244 :sparkles: :thumbsup: :sparkles:
:star: 131 | @jer244 | http://www.freecodecamp.com/jer244
Jeremy
@jer244
Feb 26 2016 20:30
@nokoli200 You're welcome. Sorry I couldn't be more help.....
ehekatlOf
@ehekatlOf
Feb 26 2016 20:31
hey can I ask you guys to take a look at my wikipedia project?
Muse
@nokoli200
Feb 26 2016 20:32
@jer244 no worries. I feel better that I am not the only one who has to figure out what to do. I freaked out at first like whaaat do they want me to do?! lol but it's all good
DJ
@qualitymanifest
Feb 26 2016 20:34
@ehekatlOf looks pretty good but you're supposed to have a "random wiki" button. and maybe add some padding to your input box so the text isn't slammed all the way to the left side
ehekatlOf
@ehekatlOf
Feb 26 2016 20:36
huh that's weird, it's slammed?
I had text-align: center in the css too
anyways, thanks dude! @qualitymanifest
CamperBot
@camperbot
Feb 26 2016 20:37
ehekatlof sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 1005 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Feb 26 2016 20:39
@ehekatlOf your articles are centered just fine, i'm just talking about the input box:
Selection_127.png
ehekatlOf
@ehekatlOf
Feb 26 2016 20:39
ahhh got it
oh I forgot to center my form
there
also would you guys happen to know if there's a convenient way to make 8 bit looking borders in CSS?
Alexander Lamm
@ALamm
Feb 26 2016 20:45
@hemangsk Thanks for the link - that will be good reading!
The updatevalue() function is the same as just putting the console.log statements inside the getJSON fuction...and I had already seen that I could access the values of the oject inside of the function.
To be more clear: I was hoping to be able to access the object values OUTSIDE of the function instead : )
But it looks like this is might not happen and I will have to do the bulk of the heavy lifting/manipulating of the results within the getJSON function (where the values of the updated twitchResult object are easily accessible.)
Weird thing and an unresolved mystery is that if I type console.log(twitchResult); outside of the function it does show results in the console but not if I use console.log(twitchResult.results[0].display_name)
Slowly learning to articulate my questions better - thanks for bearing with me.
CamperBot
@camperbot
Feb 26 2016 20:45
alamm sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 313 | @hemangsk | http://www.freecodecamp.com/hemangsk
Marek Slabicki
@thaniri
Feb 26 2016 20:49

can anyone help me with some javascript syntax?

windDirection.style.transform="rotate(weatherData.wind.deg)";

I'm trying to rotate an element based on a number from a JSON object. The css being read is transform:rotate(weatherData.wind.deg); as opposed to transform:rotate(aNumber);

Hemang Kumar
@hemangsk
Feb 26 2016 20:52
@ALamm Great ! and good luck! It was a learning experience for me too .. :)
Thanks @ALamm
CamperBot
@camperbot
Feb 26 2016 20:52
hemangsk sends brownie points to @alamm :sparkles: :thumbsup: :sparkles:
:star: 281 | @alamm | http://www.freecodecamp.com/alamm
Hemang Kumar
@hemangsk
Feb 26 2016 20:52
:) :)
Theodore P.
@Ierofantis
Feb 26 2016 21:03
here I have a demo code(pseudocode). Can anyone tell me how to store a variable that reads the url content for parsing It later?
var url = 'http://api.openweathermap.org/data/2.5/weather?q=London,uk&appid=44db6a862fba0b067b1930da0d769e98';

function tade(){
obj = JSON.parse(url);
document.getElementById("demo").innerHTML =obj.coord.lon;
}
This is not a valid url It is an example url!
Maciej Bembenista
@macbem
Feb 26 2016 21:09
@Ierofantis getJSON?
Theodore P.
@Ierofantis
Feb 26 2016 21:09
@noczesc on jquery do you mean?
Maciej Bembenista
@macbem
Feb 26 2016 21:10
yup
Theodore P.
@Ierofantis
Feb 26 2016 21:10
I prefer no to jquery but it seems is the only fast way to do this
Lanitta
@DivaWeb
Feb 26 2016 21:24
please check out before I submit http://codepen.io/DivaWeb/pen/NNKaWQ?editors=1100
Theodore P.
@Ierofantis
Feb 26 2016 21:29
@DivaWeb very nice and responsive
Lanitta
@DivaWeb
Feb 26 2016 21:32
@Ierofantis thank you
CamperBot
@camperbot
Feb 26 2016 21:32
divaweb sends brownie points to @ierofantis :sparkles: :thumbsup: :sparkles:
:star: 246 | @ierofantis | http://www.freecodecamp.com/ierofantis
Theodore P.
@Ierofantis
Feb 26 2016 21:32
@DivaWeb no problem :)
Lanitta
@DivaWeb
Feb 26 2016 21:40
@Jarvis-327 hey pretty cool
Theodore P.
@Ierofantis
Feb 26 2016 21:40
@Jarvis-327 I think Its ok!
Lanitta
@DivaWeb
Feb 26 2016 21:41
@Jarvis-327 that is my next project
Nicholas
@nick88p
Feb 26 2016 21:42
@Jarvis-327 nice job. I like the result.
@DivaWeb Nice job :)
I first heard about Mike when reading Job's Biography.
Never even knew he existed before
Jason Boxman
@jboxman
Feb 26 2016 21:52
@Jarvis-327 Nicely done
maiamigliaro
@maiamigliaro
Feb 26 2016 22:18
Hi! Can I get help with my twitter share button please?
bitgrower
@bitgrower
Feb 26 2016 22:28
@DivaWeb -- Mike Markkula is a pretty interesting guy ... for a long long time he was the #1 shareholder of Apple stock ... he, I believe, was not in favor of Jobs returning, hence his "retiring" the 1997... .
Marek Slabicki
@thaniri
Feb 26 2016 22:43
@maiamigliaro add target="_blank" to the anchor tag
codepen.io wants you to open the link in a new tab

can anyone help me understand codepen's javascript compiler?
http://codepen.io/thaniri/pen/jWJWVm

-

i'm trying to stick this at the bottom of my script, but when i do all the above code breaks

document.getElementById("kelvin").onclick = alert();
and in fact, i dont know why my function getWeather is being called at all
given that on page load I only call getLocation
Nicholas
@nick88p
Feb 26 2016 22:46
@thaniri just out of curiosity. Any reason you aren't doing this with jquery?
robynsmith
@robynsmith
Feb 26 2016 22:46

Hello everyone,

I’m working on the random quote app, and I got it working locally. Now I’m trying to put it up on codepen and it’s breaking.

This is the error I”m getting:

Mixed Content: The page at 'https://s.codepen.io/boomerang/c853ba3d4e2d4d9cc303eec419569a531456526633826/index.html?editors=1010#' was loaded over HTTPS, but requested an insecure script 'http://api.forismatic.com/api/1.0/?jsonp=jQuery21305448036731686443_1456526634221&lang=en&method=getQuote&format=jsonp&_=1456526634224'. This request has been blocked; the content must be served over HTTPS.

This is my codepen:

http://codepen.io/robsmith/pen/XdrPeJ?editors=1010

Marek Slabicki
@thaniri
Feb 26 2016 22:46
its a bit of a challenge to do it in pure javascript
trying to learn the language itself instead of the framework of the language
frameworks change every week, javascript doesnt
Nicholas
@nick88p
Feb 26 2016 22:46
got it :)
Marek Slabicki
@thaniri
Feb 26 2016 22:47
@robynsmith add target="_blank" to the anchor tag
links will open in a new tab
and codepens security policy will stop throwing a fit
Nicholas
@nick88p
Feb 26 2016 22:49
@thaniri document.getElementById("kelvin").onclick = function(){
alert("Hello world!");
I think it requires a function (not being an expert myself).
robynsmith
@robynsmith
Feb 26 2016 22:50
@thaniri - I tried that change. It didn’t work - now what happens is I get the same error, and now the web page opens a duplicate in a new tab.
Marek Slabicki
@thaniri
Feb 26 2016 22:50
good catch, thanks @nick88p
CamperBot
@camperbot
Feb 26 2016 22:50
thaniri sends brownie points to @nick88p :sparkles: :thumbsup: :sparkles:
robynsmith
@robynsmith
Feb 26 2016 22:50
@thaniri Am I doing it wrong?
CamperBot
@camperbot
Feb 26 2016 22:50
:star: 420 | @nick88p | http://www.freecodecamp.com/nick88p
robynsmith
@robynsmith
Feb 26 2016 22:51
<p><a target="_blank" id="getQuote" class="btn btn-lg btn-success" href="#" role="button">New Quote</a></p>
Marek Slabicki
@thaniri
Feb 26 2016 22:51
please dont use alerts
whats going wrong exactly?
everything is working on my end
robynsmith
@robynsmith
Feb 26 2016 22:53
@thaniri Got rid of alerts
@thaniri It creates a random quote when you click the button?
Marek Slabicki
@thaniri
Feb 26 2016 22:53
yes
try ctrll+f5ing your codepen page
Nicholas
@nick88p
Feb 26 2016 22:54
@thaniri np :)
Marek Slabicki
@thaniri
Feb 26 2016 22:54
and then ttrying again
robynsmith
@robynsmith
Feb 26 2016 22:56
Weird. I’m not sure why it works for you @thaniri
IT doesn’t for me. Even after a refresh
Marek Slabicki
@thaniri
Feb 26 2016 22:56
WHAT BROWSER ARE YOU ON|?
caps
get rid of the target="_blank"
you put it in the quote button
not the tweet button
robynsmith
@robynsmith
Feb 26 2016 22:57
@thaniri I figured it out
@thaniri Thank you!
CamperBot
@camperbot
Feb 26 2016 22:57
robynsmith sends brownie points to @thaniri :sparkles: :thumbsup: :sparkles:
:star: 170 | @thaniri | http://www.freecodecamp.com/thaniri
robynsmith
@robynsmith
Feb 26 2016 22:57
@thaniri The issue was an extension I use called “HTTPS everywhere"
It was trying to force my browser to always use HTTPS connections
I disabled it for codeine.io haha
Thanks a lot though. Having you try it on your system helped a lot. I don’t know if I would have ever figured it out
Theodore P.
@Ierofantis
Feb 26 2016 23:07

how can I avoid the silly repetition of jquery code?

http://codepen.io/Ierofantis/pen/KzPLbN

Marek Slabicki
@thaniri
Feb 26 2016 23:14
you shouldn't have to declare lat/lon variables twice within the same function for starters
Nicholas
@nick88p
Feb 26 2016 23:16
@SaintPeter thank you for your help.
CamperBot
@camperbot
Feb 26 2016 23:16
nick88p sends brownie points to @saintpeter :sparkles: :thumbsup: :sparkles:
:star: 2560 | @saintpeter | http://www.freecodecamp.com/saintpeter
lcaptain47
@lcaptain47
Feb 26 2016 23:20
Is there a way to center a well. I don't really know how to do that.
ehekatlOf
@ehekatlOf
Feb 26 2016 23:21
hm I can't get window.location to work in codepen
Andrea
@Funlovn007
Feb 26 2016 23:22
I'm almost done with my tribute page, but I'm still having a hard time centering my timeline. I tried "text-align" but it throws it out of whack. Can anybody help?
http://codepen.io/Funlovn007/pen/wMZYxp
ehekatlOf
@ehekatlOf
Feb 26 2016 23:22
is there another way to bring the user to a URL on a trigger?
Patrick
@pwcsquared
Feb 26 2016 23:23
Hey guys, I'm trying to test json data from an API in codepen but I keep getting the error "No 'Access-Control-Allow-Origin' header is present"
does anyone know a good way around this?
Patrick
@pwcsquared
Feb 26 2016 23:29
Or a more basic question, where do you guys learn to work with APIs? I just got to the intermediate front end projects and suddenly feel very out of my depth
Nicholas
@nick88p
Feb 26 2016 23:35
@pwcsquared did you do the json tutorial?
That's the only introduction I know of.
on FCC
Patrick
@pwcsquared
Feb 26 2016 23:36
@nick88p I did (twice lol), but I'm looking for a more complete resource beyond FCC
imo the json tutorial is kinda weak
Patrick Black
@Mortiferr
Feb 26 2016 23:37
@Funlovn007 How do you want it centered? Typically li and ul elemenets arent centered
They look funky when you do that:::like this
Taysha
@taariya
Feb 26 2016 23:38
can someone please pair program with me on the advanced front-end tic tac toe zipline?
i've tried several solutions and hit a wall each time...I literally don't know what to do
Andrea
@Funlovn007
Feb 26 2016 23:43
blob
Right , but in the example, the look centered.
Sorry forgot to tag you, @Mortiferr
Byron Lagrone
@byronic
Feb 26 2016 23:49
@taariya I just finished doing the UI on that today then got stuck on the AI
Rory Avant
@roryavant8
Feb 26 2016 23:51
Hey guys, let me know what you think of my tribute page.
Nicholas
@nick88p
Feb 26 2016 23:52
@roryavant8 I like it. Nice touch! :)
Actually this might very be the most original one I've seen so far
Andrea
@Funlovn007
Feb 26 2016 23:53
@roryavant8 Awesome job! But don't you need to link to an outside website?
Rory Avant
@roryavant8
Feb 26 2016 23:54
Thank you very much! @nick88p that means more to me than you realize!
CamperBot
@camperbot
Feb 26 2016 23:54
roryavant8 sends brownie points to @nick88p :sparkles: :thumbsup: :sparkles:
:star: 422 | @nick88p | http://www.freecodecamp.com/nick88p
Rory Avant
@roryavant8
Feb 26 2016 23:54
@Funlovn007 Yes, my images are pulled from the website I uploaded them at.
Nicholas
@nick88p
Feb 26 2016 23:55
:)
Marek Slabicki
@thaniri
Feb 26 2016 23:55
Anyone want to criticize my weather app?
http://codepen.io/thaniri/full/jWJWVm/
Andrea
@Funlovn007
Feb 26 2016 23:55
@roryavant8 Great job!
Rory Avant
@roryavant8
Feb 26 2016 23:56
Thank you! @Funlovn007
CamperBot
@camperbot
Feb 26 2016 23:56
roryavant8 sends brownie points to @funlovn007 :sparkles: :thumbsup: :sparkles:
:star: 131 | @funlovn007 | http://www.freecodecamp.com/funlovn007
Olivia Legge
@livmaria7891
Feb 26 2016 23:58
@thaniri I like your design.. just one of the images didn’t open for me. It’s whatever would be under “it’s clear outside” and to the right of “air conditions"