These are chat archives for FreeCodeCamp/HelpFrontEnd

21st
Nov 2016
Alex Kubecka
@AlexKubecka
Nov 21 2016 00:21
Does anyone else think it jumps from teaching basic html and Jquery to making you build your own webpage? It did not teach us most of this...
jKard1210
@jKard1210
Nov 21 2016 00:23
Could somebody take a look at the start to my Wikipedia project and tell me why the API call isn't working?http://codepen.io/James1999/pen/WoRqGp
Erick Delfin
@Nifled
Nov 21 2016 00:25
I need help with bootstrap. I have a navbar with a logo on the left with some links with Home, About, etc etc. When I'm on mobile screen and the menu collapses with the hamburger icon, the Home link appears on the same line as the logo
but i want all of them on their own line
Jay Kumar
@jaykch
Nov 21 2016 00:38
@jKard1210 Change format to jasonp or add &callback=? at the end
Matt K
@MattKim22
Nov 21 2016 00:48
I'm trying to make a carousel using bootstrap. I copied and pasted code directly from multiple websites and it doesn't work at all. Can someone private message me please?
Joseph
@fendermaniac
Nov 21 2016 00:50
Hello, I also need some help with bootstrap. I'm testing out the dropdown functionality, but can't seem to get the dropdown itself to work. http://codepen.io/fendermaniac/pen/ENWxQr
I'm pretty sure it is syntactically correct, I'm wondering if it's a quirk in codepen
Joseph
@fendermaniac
Nov 21 2016 00:55
Nevermind, I had bootstrap.js loading before jQuery :)
Ryan Marten
@RyanMarten
Nov 21 2016 01:15
ryanmarten.com
give feedback if you can please
JD Tadlock
@jdtdesigns
Nov 21 2016 01:18
@TheTessaMurphy jQuery ajax returns a promise which you can use to run code after the request has received the data. You can also chain a resolved promise using .then(). So if you had a bunch of different code that needed to run in a certain order, with promises it's as easy chaining .then().then().then().then(). Look them up. They're another must have for modern programmers/devs. ;)
Tessa
@TheTessaMurphy
Nov 21 2016 01:22
@jdtdesigns Aha, this is the solution to the problem of the nest JSON calls.
jKard1210
@jKard1210
Nov 21 2016 01:25
@jaykch @jaykch Neither of these fixed the issue
Jay Kumar
@jaykch
Nov 21 2016 01:26
@jKard1210 it's because you are doing an api call from codepen, google i, it will come up
@jKard1210 there is a workaround |I don't remember
Tessa
@TheTessaMurphy
Nov 21 2016 01:27
@jdtdesigns So it's not an if then, it's a do this then do that. At the risk of being REALLY repetitive, thanks again.
CamperBot
@camperbot
Nov 21 2016 01:27
:cookie: 777 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
thetessamurphy sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
JD Tadlock
@jdtdesigns
Nov 21 2016 01:42
@jKard1210 You're using jQuery. Instead of a vanilla ajax call, use jQuery. You're also placing <html> and <script> into the html panel. Codepen automatically places the <html><head><body>. You just put the stuff in between. All css/js includes are done through Settings.
To add jQuery for example, you go to Settings->JS->Quick add->jQuery.
Here's an example of how to go about it. ;) http://codepen.io/jdtadlock/pen/zoZxKO?editors=0010
jKard1210
@jKard1210
Nov 21 2016 01:43
@jaykch I wasn't able to find a solution that worked, but I switch to using jQuery, and that worked fine
@jdtdesigns Thank you! Do you have any idea why vaniall ajax calls don't work in CodePen?
CamperBot
@camperbot
Nov 21 2016 01:43
jkard1210 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 778 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Nov 21 2016 01:44
@jKard1210 They work from what i can remember. ;)
Might be an issue with your code
jKard1210
@jKard1210
Nov 21 2016 01:45
@jdtdesigns Probably, lol
@RyanMarten That Ye button is wavy
taithethai
@taithethai
Nov 21 2016 01:47
So do a lot of people fall off at making their own portfolio?
aRtoo
@artoodeeto
Nov 21 2016 01:48
hi guys just wanted to ask if you were to make a reponsive website whic one would you use media queries or bootstrap??
Sam MacHose
@Mac33d
Nov 21 2016 01:53
I got another question for you guys. I was wondering how i would go about adding text over an image. http://codepen.io/Mac33d/pen/ObWKgv
Jay Kumar
@jaykch
Nov 21 2016 01:57
@Mac33d make a div with appropriate height and width, then put a background image in css for that div
put text inside the div in html, dont use the img tag
JD Tadlock
@jdtdesigns
Nov 21 2016 01:57
@jKard1210 Here's the vanilla way to use jsonp ;) http://codepen.io/jdtadlock/pen/zoZxKO?editors=0010
Sam MacHose
@Mac33d
Nov 21 2016 01:57
@jaykch thanks
CamperBot
@camperbot
Nov 21 2016 01:57
mac33d sends brownie points to @jaykch :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @jaykch |http://www.freecodecamp.com/jaykch
Nefer Lopez
@thatguynef
Nov 21 2016 02:57
i'm putting together a beta program to connect front-end students with tutors. If interested: https://vrmp.typeform.com/to/Mj6VbS
sega1219
@sega1219
Nov 21 2016 03:26
How would you add a caption to an image?
a.sanchez
@0100000101010011
Nov 21 2016 03:39
sega1219
@sega1219
Nov 21 2016 03:55
@0100000101010011 thank you
CamperBot
@camperbot
Nov 21 2016 03:55
sega1219 sends brownie points to @0100000101010011 :sparkles: :thumbsup: :sparkles:
:cookie: 15 | @0100000101010011 |http://www.freecodecamp.com/0100000101010011
sega1219
@sega1219
Nov 21 2016 03:55
how would you center something in a row?
Darth Skywalker
@adityaparab
Nov 21 2016 04:03
@sega1219 : text-align:center;
Ryan Marten
@RyanMarten
Nov 21 2016 04:04
@jdtdesigns thanks man
CamperBot
@camperbot
Nov 21 2016 04:04
ryanmarten sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 779 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Ryan Marten
@RyanMarten
Nov 21 2016 04:04
my favorite part is it being called "wavy"
Sérgio Gadelha Cavalcante Filho
@serdelha
Nov 21 2016 04:18
Hi guys! Where did you learn about design?
It's hard to me.
zachfoster
@zachfoster
Nov 21 2016 04:19
me to but it gets easier with time
Sérgio Gadelha Cavalcante Filho
@serdelha
Nov 21 2016 04:20
You only do and the design flows?
JD Tadlock
@jdtdesigns
Nov 21 2016 04:22
@serdelha It comes with research and repetition. It took me around 5 years to get to a professional designer level. That came with working full time at the same time, but it was still a long journey.
Coding is the same concept. It takes massive repetition to learn this stuff. Whatever you hear or see about "learn this in 6 weeks or 6 months" is bs. CSS alone can take years to master.
Sérgio Gadelha Cavalcante Filho
@serdelha
Nov 21 2016 04:30
D:
Ricky Januari
@rickyjanuari
Nov 21 2016 05:22
Screen Shot 2016-11-21 at 12.06.46 PM.png
Is there anything you've ever tried to make a bubble like this?

http://codepen.io/rickyjanuari/pen/JbWYYe

is it true that I make like this?

JD Tadlock
@jdtdesigns
Nov 21 2016 05:27
@rickyjanuari What's the issue?
S Ramakrishnan
@sramakrishnan247
Nov 21 2016 05:27
Hi guys,
I just made my tribute page and now I am about to start the portfolio page
How can I load my files from my desktop to codepen
I feel code pen complicated and the sublime text in my desktop to be more user friendly
Also, do I need to use bootstrap to build the portfolio page?
Any suggestions?
JD Tadlock
@jdtdesigns
Nov 21 2016 05:32
@sramakrishnan247 If you're referring to images, you can use photobucket.com to host them and then include them on codepen. Otherwise, codepen's interface is pretty user friendly. All html in between <body></body> goes into the html panel. Css goes in the css panel and you get the idea. Any libraries/frameworks for css/js are added through Settings->CSS or Settings->JS. ;)
S Ramakrishnan
@sramakrishnan247
Nov 21 2016 05:33
and what about bootstrap?
@jdtdesigns
JD Tadlock
@jdtdesigns
Nov 21 2016 05:34
You don't have to use bootstrap.
S Ramakrishnan
@sramakrishnan247
Nov 21 2016 05:36
okay thanks
zachfoster
@zachfoster
Nov 21 2016 05:51
how do I make it so my text and images don't move
sorry if thats a dumb question
grantknaver
@grantknaver
Nov 21 2016 05:54
If anyone can take a look at my code for some reason I cant get any of my nested functions to fire - any help would be appreciated. Here is my code...http://codepen.io/GrantKnaver/pen/gLgQdg?editors=0010
Ricky Januari
@rickyjanuari
Nov 21 2016 05:54
@jdtdesigns i want responisve
c0d0er
@c0d0er
Nov 21 2016 05:57
this is my tic tac toe, could anybody find the way to win with this game? http://codepen.io/c0d0er/pen/QGNNXz?editors=0110
zachfoster
@zachfoster
Nov 21 2016 05:59
looks good to me @c0d0er
Tried like 5 games
all ended in a tie
Sérgio Gadelha Cavalcante Filho
@serdelha
Nov 21 2016 05:59
me too @c0d0er
grantknaver
@grantknaver
Nov 21 2016 06:00
any ideas guys
the Direction function is the big issue
zachfoster
@zachfoster
Nov 21 2016 06:02
wish I could help @grantknaver
c0d0er
@c0d0er
Nov 21 2016 06:02
@zachfoster @serdelha thanks, maybe try more, really want to any way to win this tic tac toe
CamperBot
@camperbot
Nov 21 2016 06:02
c0d0er sends brownie points to @zachfoster and @serdelha :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for zachfoster
:cookie: 119 | @serdelha |http://www.freecodecamp.com/serdelha
Michael Karpinski
@karpimpski
Nov 21 2016 06:02
I'm having trouble trying to access an API
I'm getting a CORS issue each time and I'm not sure how to solve it. every solution involves back end
and this is a pure front-end project
$.get( apiUrl, function( data ) {
    alert( "Success." );
  });
I'm just trying to perform a simple request on an XML API
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://www.dictionaryapi.com/api/v1/references/collegiate/xml/hello?key=[KEY]. (Reason: CORS header 'Access-Control-Allow-Origin' missing).
zachfoster
@zachfoster
Nov 21 2016 06:07
It's unbeatable @c0d0er I tried learning the moves that it makes and countering them but i cant beat it
https://codepen.io/zfoster22/pen/jVBbXz whatya think my first webpage! pretty impressive huh
Michael Karpinski
@karpimpski
Nov 21 2016 06:08
@c0d0er I beat it
zachfoster
@zachfoster
Nov 21 2016 06:09
really? @karpimpski
Michael Karpinski
@karpimpski
Nov 21 2016 06:09
just make an L with your Xs. you have to get lucky. I made mine a lot like that: http://codepen.io/karpimpski/pen/vKjrPV
does anybody know how to solve my CORS issue? I can't find anything related to pure front-end in stack overflow
走你飛艇
@gofighting123
Nov 21 2016 06:11
@karpimpski proxy it @@
@karpimpski https://goo.gl/jMGcYy ??
grantknaver
@grantknaver
Nov 21 2016 06:13
@zachfoster its all good
well if anyone has any ideas. I would appreciate the
Michael Karpinski
@karpimpski
Nov 21 2016 06:15
@gofighting123 works like a charm, thanks so much!
CamperBot
@camperbot
Nov 21 2016 06:15
karpimpski sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:cookie: 312 | @gofighting123 |http://www.freecodecamp.com/gofighting123
走你飛艇
@gofighting123
Nov 21 2016 06:15
@karpimpski NP :smile:
zachfoster
@zachfoster
Nov 21 2016 06:20
does anyone know how Id make it so my code pen doesnt move the images around when it's in a smaller window?
Ryan Ledford
@rledford
Nov 21 2016 06:21
@zachfoster col-xs-# may work for you
if you're using bootstrap grid system
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 06:22
I am so lost on the portfolio
Ryan Ledford
@rledford
Nov 21 2016 06:23
@SouthernGameDesign how so?
where to start?
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 06:24
lol everything almost is i keep looking at other peoples to try and grasp it. everyone has the same code in a sense for the html but where did you all learn that code? @rledford
like how to add a navigation bar
Ryan Ledford
@rledford
Nov 21 2016 06:29
@SouthernGameDesign speaking from my own experience. Already knowing basic html, I learned some things from the FCC front end projects. when I started on the portfolio, I spent a lot of time learning bootstrap 3 and making little pages that implemented different features. then i put them all together.
zachfoster
@zachfoster
Nov 21 2016 06:30
yeah I really cant figure out the bootstrapping I watched a video and learned a ton about html today but I dont understand bootstrap whatsoever
Ryan Ledford
@rledford
Nov 21 2016 06:30
go to bootstraps website and read/follow their examples. they are very helpful. navbar examples http://getbootstrap.com/components/#navbar
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 06:31
@rledford do you work a job where you code alot?
Ryan Ledford
@rledford
Nov 21 2016 06:31
@zachfoster basically all you're doing is using bootstrap to organize and style your web page. you can make a portfolio page without it using your own custom styling / css but bootstrap makes it a lot easier.
@SouthernGameDesign my occupation does not require me to code at all. I code everyday on my own. I write applications in Java, C#, and Python to do some data processing at my job instead of doing it manually but it's not required. I have written some software that is used throughout the company once they found out I could code.
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 06:33
@rledford ah ok
zachfoster
@zachfoster
Nov 21 2016 06:33
Im just trying to finish up my first project but I guess the main thing I'm missing is how exactly you use the "col-xs-#" thing to make it so everything stays in place
Ryan Ledford
@rledford
Nov 21 2016 06:36

@zachfoster you will need to use bootstrap and read the docs on their grid system. Basically though

<div class='row'>
     <div class='col-xs-6'>content</div>
     <div class='col-xs-6'>content</div>
</div>
<div class='row'>
     <div class='col-xs-4'>content</div>
     <div class='col-xs-8'>content</div>
</div>

there are rules for using rows and columns. check them out

走你飛艇
@gofighting123
Nov 21 2016 06:37
zachfoster
@zachfoster
Nov 21 2016 06:38
Thank You didn't even realize it was based off that grid system
David Michelet
@Peioa
Nov 21 2016 06:43
how do i make a website appear on my portfolio ? Do I need to take a pic or could I make an href ?
studentytj
@studentytj
Nov 21 2016 06:44
<img src="http://pic1.win4000.com/wallpaper/4/53c73b5962a4f.jpg" class="img-responsive">why can't it work?
Darth Skywalker
@adityaparab
Nov 21 2016 06:45
@Peioa Both. Take a pic, create an achor to your website, Inside that anchor, put your image.
@studentytj : Simply using image this way, won't take you to the website. You need combination of anchor.href and image.
David Michelet
@Peioa
Nov 21 2016 06:48
@adityaparab I thought there would be a way where I can only put an anchor, so when my portfolio get updated it goes automatically on my portfolio page ?
studentytj
@studentytj
Nov 21 2016 06:48
@adityaparab <a href="#"><img src="http://pic1.win4000.com/wallpaper/4/53c73b5962a4f.jpg" class="img-responsive"></a> In this way?
David Michelet
@Peioa
Nov 21 2016 06:52
Darth Skywalker
@adityaparab
Nov 21 2016 06:54

@Peioa That could be done. However, you'll have to explain this a bit more

@adityaparab I thought there would be a way where I can only put an anchor, so when my portfolio get updated it goes automatically on my portfolio page ?

Darth Skywalker
@adityaparab
Nov 21 2016 06:55

@Peioa

why my text isn't responsive ?

Take a look at

http://v4-alpha.getbootstrap.com/content/typography/#responsive-typography

studentytj
@studentytj
Nov 21 2016 06:58
@adityaparab i've made a joke,i didn't import bootsrap.now it has been fixed.I'm so sorry... but even without anchor,it still can work.
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 07:01
Is there a way to use an image from my computer that is not online as my background?
kirbyedy
@kirbyedy
Nov 21 2016 07:07
@SouthernGameDesign yes if you upload it on some host
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 07:07
ok
kirbyedy
@kirbyedy
Nov 21 2016 07:08
SouthernGameDesign
@SouthernGameDesign
Nov 21 2016 07:08
@kirbyedy thank you
CamperBot
@camperbot
Nov 21 2016 07:08
southerngamedesign sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1561 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Nov 21 2016 07:08
I personally use dropbox
Stephen
@stephepush
Nov 21 2016 07:09
is there a way to switch from a bootstrap slider to a gallery ?
David Michelet
@Peioa
Nov 21 2016 07:28
What do you guys think so far ???
https://codepen.io/Peioa/full/WoRerv/
c0d0er
@c0d0er
Nov 21 2016 07:49
@karpimpski how do you beat it?
c0d0er
@c0d0er
Nov 21 2016 07:55

@karpimpski how could you make an L with Xs? could you please show me the numbers you use to make this L?

just make an L with your Xs. you have to get lucky. I made mine a lot like that: http://codepen.io/karpimpski/pen/vKjrPV

@karpimpski @zachfoster thanks
CamperBot
@camperbot
Nov 21 2016 07:56
c0d0er sends brownie points to @karpimpski and @zachfoster :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for zachfoster
:cookie: 394 | @karpimpski |http://www.freecodecamp.com/karpimpski
JackVizl
@JackVizl
Nov 21 2016 08:42

function addTogether() {



  if((typeof arguments[0]!=="number")||(typeof arguments[1]!=="number")){

      return undefined;

      }else if(arguments.length<2){




       //what do i do here?



        }

  else{
    return arguments[0]+arguments[1];
  }
someone help pls
Clyde Lobo
@oppiniated
Nov 21 2016 10:41
@JackVizl what challenge is this?
Ryan Ledford
@rledford
Nov 21 2016 11:30
@JackVizl you should check the number of arguments before doing a type check since you're assuming that there are two args available.
@JackVizl it wont really change the outcome of the logic since no argument would not return number for the type but still. try not to access an array where the index will be out of range.
heroiczero
@heroiczero
Nov 21 2016 11:39
@JackVizl you need to add the number and then return a function
RakeshNerkar
@Rakesh18754
Nov 21 2016 11:54
I want to convert object into an array data below is the example
var obj = {
    "rules": [
        {
            "interval": "Week 1",
            "count": 0
        },
        {
            "interval": "Week 2",
            "count": 0
        }
    ],
    "assets": [
        {
            "interval": "Week 1",
            "count": 1
        },
        {
            "interval": "Week 2",
            "count": 0
        }
    ]
}

var data = [
        {"name":"rules","interval":"Week 1","count":0},
        {"name":"rules","interval":"Week 2","count":0},
        {"name":"assets","interval":"Week 1","count":1},
        {"name":"assets","interval":"Week 2","count":0},
    ]
can any one provide some help or hint as i am new to JS.
Ryan Ledford
@rledford
Nov 21 2016 12:07
@Rakesh18754 you can call Object.keys(obj) which will return rules and assets, in your case, and then iterate over the inner objects by using the obj[key] and build your data accordingly
Cicero Silva
@cerosilva
Nov 21 2016 12:07
Hi guys, i've set up a carousel but when the page comes up.. it shows two slides simultaneously one on top of the other. once it moves then the slides show up fine.. any way i can sort this out?
heroiczero
@heroiczero
Nov 21 2016 12:10
@cerosilva probably make a delay if you want to slide individually
Cicero Silva
@cerosilva
Nov 21 2016 12:12
it works fine except for when the page is loading.. would it be a code issue or a internet issue?
heroiczero
@heroiczero
Nov 21 2016 12:14
@cerosilva i do not really know if its code or internet, but I do know you can put delays on Jquery animation.
Cicero Silva
@cerosilva
Nov 21 2016 12:17
@heroiczero ya, that is true.. but don't think thats the prob.. just thought of something, it might be the image file... will make some changes again. (fingers crossed).
@heroiczero thanks for the help though
CamperBot
@camperbot
Nov 21 2016 12:17
cerosilva sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:cookie: 412 | @heroiczero |http://www.freecodecamp.com/heroiczero
heroiczero
@heroiczero
Nov 21 2016 12:17
@cerosilva hope it works :)
Raphael
@RaphyWaffy
Nov 21 2016 12:46
Hello guys, just wondering, i'm on the tic tac toe project. Up to this point its been a struggle but with this one, i don't think i can get it done without following a guide directly in regards to the AI , is this standard? Almost feels like i'm cheating.
Ryan Ledford
@rledford
Nov 21 2016 12:50
@RaphyWaffy you don't really have to give the AI logic on winning, it can just take a turn and select a random available cell.
Clyde Lobo
@oppiniated
Nov 21 2016 12:59
@RaphyWaffy You can follow a guide, The key here is how much can you learn from the guide and use those techniques in some other project
Raphael
@RaphyWaffy
Nov 21 2016 13:06
@rledford never actually thought about that, still feel like i should try and get the max out of this project
@oppiniated Yeah okok, iI guess as long as i fully understand how and why it works i'm still learning from it.
Thanks guys <3
CamperBot
@camperbot
Nov 21 2016 13:06
:cookie: 369 | @oppiniated |http://www.freecodecamp.com/oppiniated
raphywaffy sends brownie points to @rledford and @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 400 | @rledford |http://www.freecodecamp.com/rledford
tcar
@tcar
Nov 21 2016 13:32
can anyone help me with my portfolio? i dont understand why .animation works only for first click. here is my codepen http://codepen.io/Tcar/pen/gLmmQz
Louis Gualtero
@louis97
Nov 21 2016 14:19
hello, I do not get the information from both APIs to be shown. I have been stuck on this one for a while... I would really appreciate if anyone can check my code or help me find my error(S).
https://codepen.io/louisgualtero97/pen/NbdLvO?editors=1010
Sorin Ruse
@sorinr
Nov 21 2016 14:21
@louis97 if you are using ip location run the pen over http not https
Sorin Ruse
@sorinr
Nov 21 2016 14:29
@louis97 make var kTemp = data.main.temp;and it will work
Cicero Silva
@cerosilva
Nov 21 2016 14:30
@heroiczero Hey got it rectified.. was my bad... left the class as active for both the slides... ... Phew!!! lot of trouble but the satiscation is worth it.. :-)
Sorin Ruse
@sorinr
Nov 21 2016 14:34
@RaphyWaffy search for minimax algorithm and try to implement it if you want an advanced AI
RakeshNerkar
@Rakesh18754
Nov 21 2016 14:44

I want to convert object into an array below is the example

var obj = {
    "rules": [
        {
            "interval": "Week 1",
            "count": 0
        },
        {
            "interval": "Week 2",
            "count": 0
        }
    ],
    "assets": [
        {
            "interval": "Week 1",
            "count": 1
        },
        {
            "interval": "Week 2",
            "count": 0
        }
    ]
}

var data = [
        {"name":"rules","interval":"Week 1","count":0},
        {"name":"rules","interval":"Week 2","count":0},
        {"name":"assets","interval":"Week 1","count":1},
        {"name":"assets","interval":"Week 2","count":0},
    ]

i tried this Object.keys(obj) which will return rules and assets but how do i get the inner array?

Brandon
@bd1887
Nov 21 2016 14:58
@bd1887
Hi everyone. I was hoping someone could help me with some JS involving event listeners.
I'm trying to add an event listener to listen for a mouse down and allow you to scroll by dragging left and right.
http://codepen.io/bd1887/pen/KNWaWv
Василий
@Zver64
Nov 21 2016 15:50

Hi guys! I'm stuck with twitter share button in Random Quote Machine task... The button doesn't share the quote...Who knows what i'm doing wrong?

Here is my pen: https://codepen.io/Zver64/pen/PzBEbO

Nefer Lopez
@thatguynef
Nov 21 2016 15:51
is anyone interested in live 1:1 help / tutoring from expert developers? https://vrmp.typeform.com/to/bMSWks
J Player
@Heyjp
Nov 21 2016 16:35

hey @Zver64

Because you are using the twitter script for the button it wont let you add the text. I recommend you create your own button instead.

Sean
@ofperfection
Nov 21 2016 17:02
//Shouldn't clicking the button ID element change the contents of the demo ID element to read "click"
document.getElementByID('button').onclick = function(){
  document.getElementByID('demo').innerHTML = "click";

};
edenbarhum
@edenbarhum
Nov 21 2016 17:05
hello i need help in the twichtv json api They changed there api and i cant find it any where
J Player
@Heyjp
Nov 21 2016 17:06
edenbarhum
@edenbarhum
Nov 21 2016 17:08
yes
doesnt work
J Player
@Heyjp
Nov 21 2016 17:08
ok you need to authenticate with them now
https://dev.twitch.tv/docs/authentication/
Sean
@ofperfection
Nov 21 2016 17:14
//Shouldn't clicking the button ID element change the contents of the demo ID element to read "click"
document.getElementByID('button').onclick = function(){
  document.getElementByID('demo').innerHTML = "click";

};
Will someone tell me why clicking button isn't changing the inner html
am i like shadowbanned
can nobody see this?
Василий
@Zver64
Nov 21 2016 17:25
@Heyjp Thank you! But can i change the existing script somehow? I honestly don't get how to make the button work without their script...
CamperBot
@camperbot
Nov 21 2016 17:25
zver64 sends brownie points to @heyjp :sparkles: :thumbsup: :sparkles:
:cookie: 411 | @heyjp |http://www.freecodecamp.com/heyjp
Ken Haduch
@khaduch
Nov 21 2016 17:32
@seandoe - you have an error in your JSON test object - where you are setting up "City3", just before that, you are missing a quote at the end of the "city": property. That's at least one issue.
J Player
@Heyjp
Nov 21 2016 17:33
@Zver64 Honestly I'm not sure how to edit their widget, or if its even possible. Maybe someone else here can chime in. But you already have the url https://twitter.com/intent/tweet?text='' - just assign that to a button href with jquery, like you were doing.
Ken Haduch
@khaduch
Nov 21 2016 17:34
@seandoe - and your attempt to call document.getElementByID has a misspelling of the method name - it should be document.getElementById
J Player
@Heyjp
Nov 21 2016 17:34
@Zver64 you can also use http://fontawesome.io/icon/twitter/ to help with the styling of the button.
Sorry I can't be more help.
Ken Haduch
@khaduch
Nov 21 2016 17:35
@seandoe - after those two fixes, I think that it is loading and working with the click.
Purcea Robert
@RobertPurcea
Nov 21 2016 17:36
how can i eliminate the space between the project divs?
i tried several ways
i don't know I can't do it
that little space between the borders
in the centre almost
J Player
@Heyjp
Nov 21 2016 17:43
managed to get it to go with

#parttwo div {
 margin: 0px -2px;
}
Purcea Robert
@RobertPurcea
Nov 21 2016 17:46
@Heyjp Yes that works in this specific case
but what if i resize the screen
i doubt it will work
J Player
@Heyjp
Nov 21 2016 17:46
alright well now we have a new problem :D
Purcea Robert
@RobertPurcea
Nov 21 2016 17:46
:))
M Adeel Ahsan
@madeelahsan
Nov 21 2016 17:49
hey guys i need simple text slider http://prntscr.com/da2b0w
please help me out
J Player
@Heyjp
Nov 21 2016 17:51
@Robertb4 have you tried using flexbox?
Purcea Robert
@RobertPurcea
Nov 21 2016 17:53
i don't know how to use that yet
but i tried with float now and it seems it solves the problem
J Player
@Heyjp
Nov 21 2016 17:53

#parttwo {
   display: flex;
   justify-content: center;
  align-items: center
}

#parttwo div {
       width: 25%
}
awesome well if you found something that works for you
Purcea Robert
@RobertPurcea
Nov 21 2016 17:53
thanks man
J Player
@Heyjp
Nov 21 2016 17:54
but flexbox is really powerful, heres a cool little website which will show you everything http://flexboxfroggy.com/ - it definitely speeds up certain niggly issues like vertical centering
Muhammad Hasham
@MohammadHasham
Nov 21 2016 17:57
how can i make these green,red,blue and yellow boxes? can anyone guide me?Like given in this pen:
http://codepen.io/vinnyA3/full/avvGbM/
Ken Haduch
@khaduch
Nov 21 2016 17:57
@Robertb4 - check out this article: https://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/ - it looks like there is a problem with using inline-block, and it looks exactly like what you're running into. The author there doesn't give a solution. Here's another article for reference: https://css-tricks.com/fighting-the-space-between-inline-block-elements/ it might have some solution - looks like a few things you can try?
Tyler Moeller
@TylerMoeller
Nov 21 2016 17:58
@MohammadHasham Check out the border-radius property: http://www.w3schools.com/cssref/css3_pr_border-radius.asp
Specifically, look at: border-top-left-radius, border-top-right-radius, etc...
@Robertb4 Hey, just noticed you are hotlinking a weather app image from my personal web server. I blocked that this morning when I noticed how hard codepen was hitting my server :) feel free to use the image, but please upload it to an image hosting site and link to it from there. This is one that a lot of people use: https://postimage.org
dreviun
@dreviun
Nov 21 2016 18:02
hey guys where do i find the link for the font i want ? the href link
Ken Haduch
@khaduch
Nov 21 2016 18:03
@dreviun - do you mean Google fonts? Go to their website and search for the font, they generate code that you can use to paste into your site and it downloads the font code when you run it.
Muhammad Hasham
@MohammadHasham
Nov 21 2016 18:03
http://codepen.io/Mohammad_Hasham/pen/JbWOWw
Why is my green partition not coming on left by default.
i have used borde radius
@khaduch @TylerMoeller
Ken Haduch
@khaduch
Nov 21 2016 18:04
dreviun
@dreviun
Nov 21 2016 18:04
thanks @khaduch
CamperBot
@camperbot
Nov 21 2016 18:04
:star2: 1956 | @khaduch |http://www.freecodecamp.com/khaduch
dreviun sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Nov 21 2016 18:06
@MohammadHasham I'm not sure I understand. There is a very small (5px) border radius on the bottom-left.
Muhammad Hasham
@MohammadHasham
Nov 21 2016 18:06
can i use nested coulmns in bootstrap
@TylerMoeller
like making further coulmns in a div
Tyler Moeller
@TylerMoeller
Nov 21 2016 18:08
@MohammadHasham Yes, there's an example of columns nested in a row with bootstrap in this pen: http://codepen.io/TylerMoeller/pen/qNrbok
dreviun
@dreviun
Nov 21 2016 18:09
@khaduch https://fonts.google.com/specimen/Concert+One is this the link i use on the href?
Ken Haduch
@khaduch
Nov 21 2016 18:15

@dreviun - going through their site, the code that they generate is <link href="https://fonts.googleapis.com/css?family=Concert+One" rel="stylesheet"> or it could also be:

<style>
@import url('https://fonts.googleapis.com/css?family=Concert+One');
</style>

If you are using it in CodePen, you can just copy that URL without the other parts into an external CSS lib in the CSS config panel.

Purcea Robert
@RobertPurcea
Nov 21 2016 18:16
@khaduch thanks a lot the CSS-Tricks website has a lot of solutions to my problem
CamperBot
@camperbot
Nov 21 2016 18:16
robertb4 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1957 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Nov 21 2016 18:16
@Robertb4 - it's a great site - definitely want to put that in your toolbox!
dreviun
@dreviun
Nov 21 2016 18:19
@khaduch how do i make it so its only for h1,-h6?
Brandon
@bd1887
Nov 21 2016 18:21
I've been stuck on a js problem I'm having for hours now trying to find solutions. Can someone please take a look at some code for me?
Ken Haduch
@khaduch
Nov 21 2016 18:22
@dreviun - you can search for this answer in Google and find something like this: http://stackoverflow.com/questions/7539125/css-target-all-h-tags My Google question was "how do you apply a CSS style to all header types"
@bd1887 - we can give it a try
Brandon
@bd1887
Nov 21 2016 18:24
@khaduch Cool Thanks. If you look at the JS in this codepen
http://codepen.io/bd1887/pen/KNWaWv?editors=0110
CamperBot
@camperbot
Nov 21 2016 18:24
bd1887 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1958 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Nov 21 2016 18:25
@bd1887 - it's all commented out?
Brandon
@bd1887
Nov 21 2016 18:25
@khaduch sorry hang on
@khaduch k refresh it?
Ken Haduch
@khaduch
Nov 21 2016 18:26
@bd1887 - ok, so what are you trying to do?
Brandon
@bd1887
Nov 21 2016 18:26
@khaduch I left the scrollbar visible to try to make it more clear what I'm trying to do. That js should allow me to left click and drag the div called 'timer'. But I can only get the whole body to drag.
Ken Haduch
@khaduch
Nov 21 2016 18:27
@bd1887 - you're putting the mousemove on the "window" element? I don't know if that's the right thing to do?
Brandon
@bd1887
Nov 21 2016 18:28
@khaduch I've tried putting the name of the element there
Ken Haduch
@khaduch
Nov 21 2016 18:29
@bd1887 - I just made that change locally - I'm getting some kind of scrolling, but I cannot figure out when it is actually picking up an event?
Brandon
@bd1887
Nov 21 2016 18:29
@khaduch you might be highlighting the text
@khaduch I turned off the visible highlighting but maybe that only makes it more confusing
Ken Haduch
@khaduch
Nov 21 2016 18:33

@bd1887 - I just made this change and it is at least loading the page without error, because getElementsByClassName returns an array, so note that I picked off location [0]

var el = document.getElementsByClassName("timer")[0];//I have tried the classes 'egg' and 'timer'

//This should allow you to scroll by left clicking and dragging.
el.addEventListener('mousemove', function(e){

I'm still a little confused about how it is behaving, though...
It seems that if I click on the egg and drag the mouse, it will scroll left and right, but it still seems a little bit wonky?

Brandon
@bd1887
Nov 21 2016 18:36
@khaduch haha I see what you mean. It's still not dragging the div inside the timer, but at least I think you're onto something with var el being an array.
Ken Haduch
@khaduch
Nov 21 2016 18:37
@bd1887 yeah, and if I turn off the overflow-x then it doesn't seem to scroll at all?
Purcea Robert
@RobertPurcea
Nov 21 2016 18:38
@TylerMoeller you can unvlock the image or whatever I added another one
unblock
Brandon
@bd1887
Nov 21 2016 18:38
@khaduch because it cuts off the div at the overflow which doesn't allow scrolling. Basically what I did is make a really long div that extends past the parent which and hid the overflow so that it appears to wrap around the parent
Ken Haduch
@khaduch
Nov 21 2016 18:40
@bd1887 - well, I have to run along for now - I hope you get something working, looks like a neat idea. I googled for some other possible help, and found this: http://stackoverflow.com/questions/16670931/hide-scroll-bar-but-still-being-able-to-scroll but I haven't got the time to try and digest it right now...
Brandon
@bd1887
Nov 21 2016 18:40
@khaduch Thanks for your help.
CamperBot
@camperbot
Nov 21 2016 18:40
bd1887 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: bd1887 already gave khaduch points
Simon Cordova
@gbsimon87
Nov 21 2016 18:49
I was wondering if anyone could lead me in the right direction...
I've got a number of images on a webpage that I'd like to fade into view with a second delay between them...Here's what I've tried, but I can't figure out the second delay
function showImages() {
        $(".heading").fadeIn(1000);
        $(".content").fadeIn(1000);
        $(".tagline").fadeIn(1000);
        $(".logo").fadeIn(1000);
        $(".cta").fadeIn(1000);
    }

    var perSecond = setInterval(showImages(), 1000);
Łukasz Sobek
@lukaszsobek
Nov 21 2016 18:55
guys, I'm trying to get this working but can't get my head around where the mistake is
<script>
$("document").ready(function() {
  $.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&key=457653&format=xml&lang=en",function(val) {
    $("#qcontent").html(JSON.stringify(val.quoteText));
            });

});
</script>
what it should do is load the div with the content of <quoteText> gotten from the url after loading the page
Simon Cordova
@gbsimon87
Nov 21 2016 18:57
@luka, you could avoid using stringify if you replace format=xml to format=json
@lukaszsobek
you could then...
$("#qcontent").text(<p>val.quoteText</p>);
with the quotation marks sorry
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:01
@gbsimon87 Elements need to be hidden before they can fade in:
function showImages() {
  $(".heading, .content, .tagline, .logo, .cta").hide().fadeIn(1000);
}
var perSecond = setInterval(showImages, 1000);
Though, I'm not sure if that's what you are saying you want to do... This makes them "pulse fade" into view every second.
Simon Cordova
@gbsimon87
Nov 21 2016 19:04
@TylerMoeller, yeah, close to what I'm looking for...
Basically I want the first img class to fadeIn, then wait 1 second, second class to fadeIn, wait one second, third class fadeIn, and so forth...
Łukasz Sobek
@lukaszsobek
Nov 21 2016 19:05
@gbsimon87 thanks for the stringify simpler code - can't get it to work though, it's not showing anything :/
CamperBot
@camperbot
Nov 21 2016 19:05
lukaszsobek sends brownie points to @gbsimon87 :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @gbsimon87 |http://www.freecodecamp.com/gbsimon87
Simon Cordova
@gbsimon87
Nov 21 2016 19:06
@lukaszsobek send your codepen
@TylerMoeller any idea how I can modify my function?
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:07
@gbsimon87 Yeah, just a second
Simon Cordova
@gbsimon87
Nov 21 2016 19:07
@TylerMoeller cheers buddy take your time I appreciate it
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:07
function showImages() {
  $(".heading, .content, .tagline, .logo, .cta").hide();
  $(".heading").fadeIn(1000).promise().done(function() {
    $(".content").fadeIn(1000).promise().done(function() {
      $(".tagline").fadeIn(1000).promise().done(function() {
        $(".logo").fadeIn(1000).promise().done(function() {
          $(".cta").fadeIn(1000);
        });
      });
    });
  });
}

showImages();
You need to use promises. Putting them in a queue would look prettier though
@gbsimon87 I think that's what you were trying to do?
WhiteCaneGamer
@WhiteCaneGamer
Nov 21 2016 19:09
This code seams not to be passing the lat and lon to the second getJSON request and I don't know why, any help would be appreciated.
$(document).ready(function(){
  var lat;
  var lon;
  var owmApi = "http://api.openweathermap.org/data/2.5/weather?";
  var APPID = "a1dd5a9de1082d9586119a691e627840";
  var url = owmApi + "&lat=" + lat + "&lon=" + lon + "&APPID=" + APPID;

  $.getJSON("http://ip-api.com/json", function(data){
    lat = data.lat;
    lon = data.lon;
  });
  $.getJSON(url, function(data){
    console.log(data.name);
  });
});
Simon Cordova
@gbsimon87
Nov 21 2016 19:09
@TylerMoeller thanks again, this is exactly what I was looking for...
I'm going to research the promises, I've never came across it before
CamperBot
@camperbot
Nov 21 2016 19:09
gbsimon87 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 949 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Simon Cordova
@gbsimon87
Nov 21 2016 19:10
@lukaszsobek I'll take a look at your code now
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:10
@gbsimon87 No problem, you could also use .delay():
function showImages() {
  $(".heading, .content, .tagline, .logo, .cta").hide();
  $(".heading").fadeIn(1000).delay(1000, function() {
    $(".content").fadeIn(1000).delay(1000, function() {
      $(".tagline").fadeIn(1000).delay(1000, function() {
        $(".logo").fadeIn(1000).delay(1000, function() {
          $(".cta").fadeIn(1000);
        });
      });
    });
  });
}

showImages();
Simon Cordova
@gbsimon87
Nov 21 2016 19:13
@TylerMoeller, each class has an anonymous function running as the second parameter, is this the cleanest approach? You mentioned a queue? I suppose in an array?
@lukaszsobek give me a moment ok
WhiteCaneGamer
@WhiteCaneGamer
Nov 21 2016 19:22
anyone?
cirekh
@cirekh
Nov 21 2016 19:25
Hey guys I'm working on the tribute page project right now and am having trouble. My main problem right now is making sure my image and information is in the center of the page, not aligned to the left. Any suggestions?
Łukasz Sobek
@lukaszsobek
Nov 21 2016 19:28
@cirekh you can try looking into "margin: auto"
cirekh
@cirekh
Nov 21 2016 19:30
Thanks I’ll give it a shot!
Thomas
@ImprobabilityDrive
Nov 21 2016 19:36
Hey guys, Im having trouble with come bootstrap css selector heirarchy. Im trying to have the bg img in the jumbotron be half opacity, with the text (child to the jumbotron parent) be at full opacity. any tips?
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:36
@gbsimon87 Yeah, you could use jquery .queue() to add each element to the queue - it would be a bit cleaner, not sure about performance though. I don't have a lot of experience with jQuery's queue.
Simon Cordova
@gbsimon87
Nov 21 2016 19:37
@TylerMoeller cheers again you've been amazing help
Tyler Moeller
@TylerMoeller
Nov 21 2016 19:37
Any time, happy to help
Thomas
@ImprobabilityDrive
Nov 21 2016 19:38
@cirekh Hey! Ive had trouble with making that work myself. If you're going margin: auto, be sure to define the width of the element!
Łukasz Sobek
@lukaszsobek
Nov 21 2016 19:45
ok, fixed my problem it was a lack of callback parameter
Simon Cordova
@gbsimon87
Nov 21 2016 19:47
@ImprobabilityDrive a good tip is to load your page onto the browset then inspect the element you want to change...
on chrome devtools and firefox firebug for example you can change the values right there and see it live...
@lukaszsobek yep, the jsonp
?
Łukasz Sobek
@lukaszsobek
Nov 21 2016 19:56
broke it again :/
ah well - time to get another tutorial on jquery to approach it from a differnt angle
Tyler Moeller
@TylerMoeller
Nov 21 2016 20:01
@WhiteCaneGamer As a hint, try reviewing the FCC materials on scope in JavaScript.
Simon Cordova
@gbsimon87
Nov 21 2016 20:02
@lukaszsobek why did it break again?
Łukasz Sobek
@lukaszsobek
Nov 21 2016 20:05
ok, a good thing it broke, because I understood why the code was not working
basically if you request something from teh web the script doesn't wait
if you want it to wait you have to use a callback function
otherwise your fetched data goes nowhere
so on my example teh data was being fetched, but before the script finished it had already executed the rest of the function XD
Simon Cordova
@gbsimon87
Nov 21 2016 20:08
:+1:
Łukasz Sobek
@lukaszsobek
Nov 21 2016 20:15
apart from having to use data[0] instead of just data
Peter Steele
@PeterHSteele
Nov 21 2016 20:41
hey everyone, would love some help with my twitch streamer if anyone has a second. I've got two getJSON requests, one nested in the other, both inside a "for loop. I want the for loop to affect both of them but it seems like it's done iterating by the time the second getJson is called. Let me know if anyone has hints
WhiteCaneGamer
@WhiteCaneGamer
Nov 21 2016 20:49
@TylerMoeller are you referring to the fact I use (data) in both of my callback functions? or because I don't use the var keyword inside my functions?
c0d0er
@c0d0er
Nov 21 2016 21:00
this is my tic tac toe, could anybody find the way to win with this game? http://codepen.io/c0d0er/pen/QGNNXz?editors=0110
Greg D
@mosaic-greg
Nov 21 2016 21:03
@c0d0er after my third turn the computer wont play
but i can still play :D
c0d0er
@c0d0er
Nov 21 2016 21:04
@mosaic-greg dont understand, the computer stops to play?
@mosaic-greg did you choose x or o?
Greg D
@mosaic-greg
Nov 21 2016 21:05
x
c0d0er
@c0d0er
Nov 21 2016 21:06
i tried now, it works, could you please tell me the details? @mosaic-greg
JD Tadlock
@jdtdesigns
Nov 21 2016 21:06
@c0d0er Like i said before, it's kinda weird with the token selection(x, o) at the bottom. The user joins and doesn't see anything but the board. Also, why the numbers on the boxes? And, because the alert screen(shows 'Draw' or 'You win') is at the bottom, you don't even see it.
Greg D
@mosaic-greg
Nov 21 2016 21:08
i agree it's confusing - the bottom buttons don't look like buttons
c0d0er
@c0d0er
Nov 21 2016 21:08
@mosaic-greg i tried a lot of time with x, even tie or lost, still can play, could you give me the details why the third turn doesnt work?
Greg D
@mosaic-greg
Nov 21 2016 21:09
after i block the computer, it fails to play
c0d0er
@c0d0er
Nov 21 2016 21:11
@jdtdesigns @mosaic-greg thanks! the numbers just for testing, for the final version the numbers will be erased. if i set the x o option and results in the top then it will cause the game board to move up and down, if i choose to move the option and result in front of the board, feel not very easy to test, but thats an option
CamperBot
@camperbot
Nov 21 2016 21:11
c0d0er sends brownie points to @jdtdesigns and @mosaic-greg :sparkles: :thumbsup: :sparkles:
:cookie: 390 | @mosaic-greg |http://www.freecodecamp.com/mosaic-greg
:cookie: 780 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Nov 21 2016 21:12
@c0d0er It's very simple to move the token select up top and not cause the board to move up or down. I showed you a way. ;)
c0d0er
@c0d0er
Nov 21 2016 21:13
@jdtdesigns but you told me even with that way the board still moves if i dont remember wrong
@mosaic-greg i checked even after i played 4 ties in a row, i still can play x with computer, could you please give me some details about the problem?
Jackson Holiday Wheeler
@jhwheeler
Nov 21 2016 21:14
Hi everyone, I'm having a hell of a time with the Random Quote Machine. I've got the html set-up and I think the very bare bones of the jQuery API request, but I really have no idea how to connect the two. I've read and I've searched and now I'm asking. ;) Here's my CodePen, any help is much appreciated! http://codepen.io/Alacritas/pen/PbpRXb
I feel like the JSON API section of FreeCodeCamp was kind of a once-over, I wish there were practical applications and exercises for importing APIs
And that was in just a few minutes lol
Purcea Robert
@RobertPurcea
Nov 21 2016 21:36
@jhwheeler even if you know the information from FCC, it's not enough to complete the projects. You mostly have to search on the internet and learn by yourself
c0d0er
@c0d0er
Nov 21 2016 21:41
@jdtdesigns got your point! thanks! you used the opacity and visibility! if i dont use visibility will it cause any problem?
CamperBot
@camperbot
Nov 21 2016 21:41
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave jdtdesigns points
c0d0er
@c0d0er
Nov 21 2016 21:45
@jdtdesigns i tested, without visibility: hidden, it still works the same, why do you add this?
Mikail Bayram
@mikail1998
Nov 21 2016 21:46
http://codepen.io/mikail1998/pen/bBgbWd the moves computer generates are played at the same time
how can i solve this problem
JD Tadlock
@jdtdesigns
Nov 21 2016 21:54
@c0d0er Without hiding visibility, the buttons will still be clickable
c0d0er
@c0d0er
Nov 21 2016 21:55
@jdtdesigns how? after hidden, i clicked the button, no response
JD Tadlock
@jdtdesigns
Nov 21 2016 22:00
@c0d0er http://jsbin.com/qenuhes/edit?js,console,output I removed visibility: hidden and set a console log when the buttons are clicked.
If you click the x, o even when they're not visible, they'll still fire.
c0d0er
@c0d0er
Nov 21 2016 22:04
@jdtdesigns :+1: thanks!
CamperBot
@camperbot
Nov 21 2016 22:04
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave jdtdesigns points
grantknaver
@grantknaver
Nov 21 2016 22:10
anyone have any ideas on why my nested functions wont activate?
Ellias
@Tron2097
Nov 21 2016 22:14
I'm currently working on my tribute page but for some reason I can't access any font colors or other css properties. any suggestions. thanks
grantknaver
@grantknaver
Nov 21 2016 22:15
The main problem is the nested Direction function
Greg D
@mosaic-greg
Nov 21 2016 22:19
@Tron2097 if you link us to your codepen we can check
Ellias
@Tron2097
Nov 21 2016 22:22
@mosaic-greg nvm I actually just figured it out lol. thanks anyway though. :)
CamperBot
@camperbot
Nov 21 2016 22:22
tron2097 sends brownie points to @mosaic-greg :sparkles: :thumbsup: :sparkles:
:cookie: 391 | @mosaic-greg |http://www.freecodecamp.com/mosaic-greg
Tomas Mattia
@tomasmattia
Nov 21 2016 22:52
hi
i cant make the logic complex
i start with this
function updateRecords(id, prop, value) {
if (id===collection[""]){
and idk how make all the secuence
maybe add && prop===collection[id[""]] to check if tracks exist?
Simon Cordova
@gbsimon87
Nov 21 2016 23:10
blob
Hey guys, I've got an assignment to do and my pseudocode has addclass and removeclass methods all over the place and it has becoming overwhelmingly complicated, can anyone offer some insight?
Simon Cordova
@gbsimon87
Nov 21 2016 23:21
anybody? :(
a.sanchez
@0100000101010011
Nov 21 2016 23:23
@gbsimon87 you have a codepen to share?
Simon Cordova
@gbsimon87
Nov 21 2016 23:24
@0100000101010011 I mainly have my pseudocode in place written down...I'll write a quick codepen to show you roughly where I am
grantknaver
@grantknaver
Nov 21 2016 23:29
@0100000101010011 you got a sec to answer a question
been trying to get some insight for a bit
Simon Cordova
@gbsimon87
Nov 21 2016 23:29
@0100000101010011 I think I may have found a way to do it with CSS media queries
@grantknaver if it's within my scope of knowledge I'll help you out as well
grantknaver
@grantknaver
Nov 21 2016 23:30
I posted it a bit ago Ill repost
Simon Cordova
@gbsimon87
Nov 21 2016 23:31
I think I found it, nested functions?
grantknaver
@grantknaver
Nov 21 2016 23:31
yep
Simon Cordova
@gbsimon87
Nov 21 2016 23:31
let me see..
grantknaver
@grantknaver
Nov 21 2016 23:31
I dont get why they wont activate. I think they should
Simon Cordova
@gbsimon87
Nov 21 2016 23:32
where exactly, which functions?
grantknaver
@grantknaver
Nov 21 2016 23:32
Direction
when I try to console.log it, nothing happens.
a.sanchez
@0100000101010011
Nov 21 2016 23:38
back, had to run for dinner in oven
grantknaver
@grantknaver
Nov 21 2016 23:38
@gbsimon87 media queries would be a great idea
by the way
Stefan
@st3fun1
Nov 21 2016 23:39
Hi everyone. I need some help with something related to AJAX
grantknaver
@grantknaver
Nov 21 2016 23:39
@st3fun1 let me guess does it have anything to do with API's?
a.sanchez
@0100000101010011
Nov 21 2016 23:39
@grantknaver i'll give it a shot
Stefan
@st3fun1
Nov 21 2016 23:40
no
so the problem is the following
grantknaver
@grantknaver
Nov 21 2016 23:40
dang
a.sanchez
@0100000101010011
Nov 21 2016 23:40
@gbsimon87 you ever get a codepen for your code?
Stefan
@st3fun1
Nov 21 2016 23:40
i'm using nodemailer(a npm package) to send emails from my form to my email address
grantknaver
@grantknaver
Nov 21 2016 23:40
@0100000101010011 thanks
CamperBot
@camperbot
Nov 21 2016 23:40
:cookie: 17 | @0100000101010011 |http://www.freecodecamp.com/0100000101010011
grantknaver sends brownie points to @0100000101010011 :sparkles: :thumbsup: :sparkles:
Simon Cordova
@gbsimon87
Nov 21 2016 23:40
@0100000101010011 I'm almost done building it :)
cheers for sticking around
grantknaver
@grantknaver
Nov 21 2016 23:40
Ill repost my Codepen
Stefan
@st3fun1
Nov 21 2016 23:40
but my ajax request is sent multiple times and i don't know what to do
a.sanchez
@0100000101010011
Nov 21 2016 23:41
k
Stefan
@st3fun1
Nov 21 2016 23:41
i got like 300 emails in 20s
grantknaver
@grantknaver
Nov 21 2016 23:41
does anyone prefer bootstrap over flex management for responsive designs?
a.sanchez
@0100000101010011
Nov 21 2016 23:42
flex, keep in mind though, the reason for something like bootstrap is that they have a standardized approach to responsive etc, trade off is, it comes with a bunch of extra stuff you may not need.
this depends on the project too, if you're jumping into one where the devs are already using bootstrap, then you'll probably be using bootstrap
Clint
@Dispitec
Nov 21 2016 23:45
Can someone help me with buttons? I have a button that uses the 2d scale transform on hover to make it larger over .3 seconds, how do you set the transition for when you mouse off the button?
grantknaver
@grantknaver
Nov 21 2016 23:45
OK OK @0100000101010011 so it kind of depends on the project. The one thing I have found is that centering vertically and horizontally seems more efficient with flex.
a.sanchez
@0100000101010011
Nov 21 2016 23:46
@grantknaver in general, it's recommended to avoid nested functions where and when possible, often times it makes it much trickier to troubleshoot
grantknaver
@grantknaver
Nov 21 2016 23:47
Ya I see that.
a.sanchez
@0100000101010011
Nov 21 2016 23:48
if you've been using traditional ways of applying responsive, and even bootstrap until recently with their latest release have been using traditional means, flex is a bit of an adjustment cause it goes about responsive differently, but i like it much better, and it's responsive out of the gate
for the most part
@grantknaver i don't see a function call to your direction function
grantknaver
@grantknaver
Nov 21 2016 23:49
I was trying to pull out the request.responseText to use through out the rest of the code. should I just return the request.responseText and sparse it from there?
a.sanchez
@0100000101010011
Nov 21 2016 23:49
without a call it won't fire
grantknaver
@grantknaver
Nov 21 2016 23:50
so just call it after I lay it out and it should be good to go?
Of course with in the function it is nested in right?
Its the first time I really have nested a good bit so I sketchy on some things.
a.sanchez
@0100000101010011
Nov 21 2016 23:51
no, you'll have to test it and see if that's the case, then if it fires as you're expecting, then you should be good to go
JD Tadlock
@jdtdesigns
Nov 21 2016 23:51
@grantknaver Once you are seasoned in css, you won't use BS. The only time would be on a project that is already using it. It's a bloated mess compared to modern css.
grantknaver
@grantknaver
Nov 21 2016 23:51
@jdtdesigns yep seem like it
a.sanchez
@0100000101010011
Nov 21 2016 23:52
@grantknaver few things in programming/coding are just good to go, be great if that were the case, but there's a lot of quirks etc that folks, especially those starting out, don't consider
what seems like it's just an easy fix, often times takes you down more paths to resolve it
JD Tadlock
@jdtdesigns
Nov 21 2016 23:53
@grantknaver When you get to the calculator, all of those small things @0100000101010011 is talking about will hit you like a landslide. ;)
Simon Cordova
@gbsimon87
Nov 21 2016 23:54
I just realized I've been working incorrectly on my assignment.
Anybody have any good references for when the phone tilts?
a.sanchez
@0100000101010011
Nov 21 2016 23:54
@gbsimon87 you mean your responsive design, when the phone goes from portrait to landscape and vice versa?
Simon Cordova
@gbsimon87
Nov 21 2016 23:55
No, I think they're asking for when the phone tilts, not the orientation
a.sanchez
@0100000101010011
Nov 21 2016 23:55
ah, that may be out of my scope
grantknaver
@grantknaver
Nov 21 2016 23:55
Yep it worked thanks guys. it is fun to talk to ya.
Simon Cordova
@gbsimon87
Nov 21 2016 23:55
blob
grantknaver
@grantknaver
Nov 21 2016 23:55
everything is good to go
a.sanchez
@0100000101010011
Nov 21 2016 23:55
@grantknaver anytime
JD Tadlock
@jdtdesigns
Nov 21 2016 23:56
@gbsimon87 If you're referring to ios or android there are specific options for tilt, portrait and landscape. ;)
Simon Cordova
@gbsimon87
Nov 21 2016 23:57

@jdtdesigns whats up buddy its been a while...

@jdtdesigns @0100000101010011 tbh I'm sort of lost on what they mean...
I've searched endlessly and I'm concluding that tilt must mean orientation.
Now my mark up is a mess...

The only way I can add a class apart from HTML is through JS correct, I can't seem to find how to do it with CSS media queries