These are chat archives for FreeCodeCamp/HelpFrontEnd

18th
Jul 2016
Bailey
@coder7215
Jul 18 2016 00:00
@bsandusky thanks! I will try that.
CamperBot
@camperbot
Jul 18 2016 00:00
coder7215 sends brownie points to @bsandusky :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @bsandusky |http://www.freecodecamp.com/bsandusky
Xavier Velez
@JonSnow08
Jul 18 2016 00:02
anybody around that can help with wikipedia viewer
crickets lmfao
Maria Campbell
@interglobalmedia
Jul 18 2016 00:08
Hi guys: I have a question. I have been uploading projects from github and have been successful, but now when I go and click on the link in the Map, I am returned to the FCC project page and not the project itself. I want to be able to upload my project from Github. I have not been using Code Pen. Is that possible? It does show me as having finished the project with a check. On the other hand, is this the way it is supposed to work? And insight to this issue would be very much appreciated. Thanks!
Xavier Velez
@JonSnow08
Jul 18 2016 00:08
@interglobalmedia i think it will show as checked if you enter any URL and hit completed
Adam
@wesleyal
Jul 18 2016 00:11
Hi all, I'm working on the portfolio challenge, and I am unable to get the bottom div to expand the full width of the screen. I gave the div its own container and made it .container-fluid, but it still appears as .container in the viewport. Any ideas? http://codepen.io/wesleyal/pen/LZxMgr?editors=1100
Xavier Velez
@JonSnow08
Jul 18 2016 00:12
@wesleyal ill take a look
one sec
@wesleyal which div? the copyright?
Adam
@wesleyal
Jul 18 2016 00:13
yes, and the "finalsection". I put them in the same container since they are both suppose to be full width.
I tried adding CSS to each row such as: auto width, margin-left: 0, etc but to no avail
Xavier Velez
@JonSnow08
Jul 18 2016 00:19
hrmmm
I dont see any obvious mistakes
I'm no pro, i thought maybe I'd see an unclosed div or something but this is baffling me as well
Adam
@wesleyal
Jul 18 2016 00:22
Ok. Well I'll carry on. I plan to really make my own portfolio, but I wanted to see if I could reverse-engineer the example.
This message was deleted
@JonSnow08 Thanks!
CamperBot
@camperbot
Jul 18 2016 00:22
wesleyal sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 279 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Xavier Velez
@JonSnow08
Jul 18 2016 00:23
no problem man sorry I couldnt help more
Andy Becker
@athomasbeck
Jul 18 2016 00:24
@JonSnow08 I'm working on that right now, im stuck with this error when I request the JSON. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
@JonSnow08 any ideas?
Xavier Velez
@JonSnow08
Jul 18 2016 00:26
@athomasbeck let me take a look
@athomasbeck whats the link to your codepen
Xavier Velez
@JonSnow08
Jul 18 2016 00:31
@athomasbeck you're way further than I am
honestly i kinda suck with using APIs
Andy Becker
@athomasbeck
Jul 18 2016 00:32
@JonSnow08 oh, haha thats allright i figured it wouldnt hurt to ask
@JonSnow08 I'm struggling with api's too, i think i have the basic concepts down but I'm constantly getting random new errors
Xavier Velez
@JonSnow08
Jul 18 2016 00:33
@athomasbeck yeah it's rough for me, I even stepped back and took codeacademy's course on jQuery which helped some
but I'm still pretty lost on a lot of things
Antonio Hernandez
@tzunun
Jul 18 2016 00:34
@athomasbeck var endPoint = "https://en.wikipedia.org/w/api.php"; ar searchUrl = endPoint + "/w/api.php?action=query&format=json&prop=revisions&titles=" + searchTerm + "&rvprop=content";
what happens if you remove /w/api.php from one of those two?
Andy Becker
@athomasbeck
Jul 18 2016 00:36
@tzunun oh yeah, i didnt even notice that
@tzunun nah, still the same error
Antonio Hernandez
@tzunun
Jul 18 2016 00:38
@athomasbeck ok, let me see if I can help.
@athomasbeck I'm getting an object as a response
Andy Becker
@athomasbeck
Jul 18 2016 00:40
@tzunun huh, thats strange. Im still getting that same error
Greg Duncan
@GregatGit
Jul 18 2016 00:52
@athomasbeck you need to have '&callback=?` at the end of your api string for this one
and it is console.log - not consol.log
vínαч puppαl
@vinaypuppal
Jul 18 2016 00:57

@wesleyal Hi, you did not close your .container div properly which is causing that problem. on line 23 you have extra closing div, and use <br /> for line breaks not <br></brk>, on line 71 u did not close input tag see below

<input type="text" class="form-control" id="nameInput" </div>

fix all these then your finalsection will be of full width.

Jacob Stewart
@JacobStewart1
Jul 18 2016 01:12
https://codepen.io/JacobStewart1/pen/bZLVkX hey my website has a bunch of space on the right and i cant figure out how to center everthing can someone help me
Rada
@Radascript
Jul 18 2016 01:14
@JacobStewart1 first thing that stands out is that you are using "float: center" which doesn't exist
Jacob Stewart
@JacobStewart1
Jul 18 2016 01:15
oh
Jinme Mirabal
@mirabalj
Jul 18 2016 01:16
Hi everyone, I finish the challenge Recipe Box in React. Can you try this? and give me your feedback. Thanks in advance. http://codepen.io/mirabalj/full/akExKa/
Rada
@Radascript
Jul 18 2016 01:17
@JacobStewart1 your code is a bit messy with very nested html. I recommend you use the tools FCC was teaching at bootstrap to creat a basic grid for your website, and sketch a quick mock up however is easier for you - maybe on a piece of paper. You are going to have a lot of trouble editing your portfolio otherwise.
Jacob Stewart
@JacobStewart1
Jul 18 2016 01:18
ok thanks @Radascript
CamperBot
@camperbot
Jul 18 2016 01:18
jacobstewart1 sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
:cookie: 357 | @radascript |http://www.freecodecamp.com/radascript
Rada
@Radascript
Jul 18 2016 01:19
@mirabalj your onion pie recipe isn't very helpful :P
Jinme Mirabal
@mirabalj
Jul 18 2016 01:22
@Radascript Jajaja, true! :smile:
goyalruchi90
@goyalruchi90
Jul 18 2016 01:25
help Convert HTML Entities
CamperBot
@camperbot
Jul 18 2016 01:25

:point_right: algorithm convert html entities [wiki]

Algorithm Convert HTML Entities

:triangular_flag_on_post: Remember to use Read-Search-Ask if you get stuck. Try to pair program :busts_in_silhouette: and write your own code :pencil:

:checkered_flag: Problem Explanation:

  • You have to create a program that will convert HTML entities from string to their corresponding HTML entities. There are only a few so you can use different methods.

:pencil: read more about algorithm convert html entities on the FCC Wiki

goyalruchi90
@goyalruchi90
Jul 18 2016 01:42
help make a person
CamperBot
@camperbot
Jul 18 2016 01:42

:point_right: algorithm make a person [wiki]

Algorithm Make a Person

:triangular_flag_on_post: Remember to use Read-Search-Ask if you get stuck. Try to pair program :busts_in_silhouette: and write your own code :pencil:

:checkered_flag: Problem Explanation:

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

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

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

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

Relevant Links

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

Ken Haduch
@khaduch
Jul 18 2016 01:44

@sorinr

@khaduch yes i know its just an exercise to learn how to deal with apis. if navigator.geolocation.getCurrentPosition reports a wrong position in your case, don't blame me :)

No blame - just that anything that we do will only be so accurate... get something that works to meet the goals of the project and finish!

William Cabell
@wbac88
Jul 18 2016 01:46
Hi guys, I'm trying to get photos from a certain place fomr Flickr API using lat and long and this is what I have so far:
$.getJSON("https://crossorigin.me/https://api.flickr.com/services/rest/?&method=flickr.photos.search&api_key=XXXXXXXXXXXX&privacy_filter=1&lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&format=json&per_page=1", function(photo)
Is there something missing? I'm not getting anything back from it?
Rada
@Radascript
Jul 18 2016 01:48
@wbac88 are you doing it on codepen or your own editor? Can you link to codepen? and is your paranthesis closed on the project unlike here?
I might have mis-copied
Rada
@Radascript
Jul 18 2016 02:02
@wbac88 unfortunately I don't have the answer, but when I change https in https://api.flickr to http, it at least sends a request and gets an error rather than not sending a request at all. That's all I got though, sorry.
William Cabell
@wbac88
Jul 18 2016 02:03
@Radascript That's ok! Thank you for taking a look, though, I'll keep trying!
CamperBot
@camperbot
Jul 18 2016 02:03
wbac88 sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
:cookie: 359 | @radascript |http://www.freecodecamp.com/radascript
Rada
@Radascript
Jul 18 2016 02:03
@wbac88 good luck!
William Cabell
@wbac88
Jul 18 2016 02:05
@Radascript How did you get the error? I removed the "s" and I'm still not getting anything?
Ken Haduch
@khaduch
Jul 18 2016 02:07
@wbac88 - I tried to load your page, but it wouldn't load (might be my computer, though...)
William Cabell
@wbac88
Jul 18 2016 02:08
Hmm, ok, thanks. Nothing's showing up in the console for me.
Ken Haduch
@khaduch
Jul 18 2016 02:08
@wbac88 - got it to load - taking a quick look...
@wbac88 - got an error on the flickr access jsonFlickrApi({"stat":"fail","code":95,"message":"SSL is required"}) - so, SSL is required?
William Cabell
@wbac88
Jul 18 2016 02:11
@khaduch How did you get that error? Nothing is showing up for me?
Rada
@Radascript
Jul 18 2016 02:11
Jaren Escueta
@jarenescueta731
Jul 18 2016 02:11
@wbac88 are you using google chrome?
Rada
@Radascript
Jul 18 2016 02:11
@wbac88 are you working with a console on chrome?
William Cabell
@wbac88
Jul 18 2016 02:12
@Radascript @jarenescueta731 Yes, but on my tablet, so that's why
Just using the codepen console
Ken Haduch
@khaduch
Jul 18 2016 02:12
@wbac88 - I opened the page in Firefox. Then looked in the firebug console at the network activity. The flickr access gave that response. So I changed it to https and it gave a different, non-error response.
William Cabell
@wbac88
Jul 18 2016 02:12
I'll have to get onto my PC and try it out
Jaren Escueta
@jarenescueta731
Jul 18 2016 02:12
@wbac88 geolocation api won't work unless https
William Cabell
@wbac88
Jul 18 2016 02:12
Tried the https and it wouldn't work either.
Ken Haduch
@khaduch
Jul 18 2016 02:13
@wbac88 - I got a response like this: jsonFlickrApi({"photos":{"page":1,"pages":29445,"perpage":1,"total":"29445","photo":[{"id":"27715612674" ,"owner":"61228218@N06","secret":"d1d41f91cc","server":"8873","farm":9,"title":"After the rain","ispublic" :1,"isfriend":0,"isfamily":0}]},"stat":"ok"})
@wbac88 - once again, I was on FireFox, which doesn't have the geolocation only on HTTPS issue, at least at this time.
William Cabell
@wbac88
Jul 18 2016 02:15
@khaduch OK, great, thank you, I'll try it in firefox, too to see if I can get that to work.
CamperBot
@camperbot
Jul 18 2016 02:15
wbac88 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1447 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Jul 18 2016 02:17
@wbac88 - yes, but as @jarenescueta731 pointed out - geolocation will not work on Chrome (if you are trying chrome) unless you use https://, but the openweather api (free version) will not return a request via https:// so that makes a problem, and it looks as though flickr needs https:// Just confusing!
Jaren Escueta
@jarenescueta731
Jul 18 2016 02:18
@wbac88 you could use the api in ip-api.com to get latitude and longitude, http://ip-api.com/docs/api:json <-- for use info
William Cabell
@wbac88
Jul 18 2016 02:18
OK, so the problem is that I'm trying to use the long and lat from the openweather API in flickr, but the https is getting in the way?
Jaren Escueta
@jarenescueta731
Jul 18 2016 02:19
This message was deleted
Ken Haduch
@khaduch
Jul 18 2016 02:21
@wbac88 - yes, at least on Chrome. People have been using the http://ip-api.com/json service to get an IP-based address, it uses http:// But I don't know if you can get the https:// for flickr to work in the common browsers. As I said - just confusing that these access methods have to get a little dicey. It sounds like you have a neat idea to search for photos that way, I hope you get it working!
William Cabell
@wbac88
Jul 18 2016 02:23
@khaduch Ha, I didn't realize this was going to be such an issue when I started! Thank you for your help, though!
CamperBot
@camperbot
Jul 18 2016 02:23
wbac88 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: wbac88 already gave khaduch points
AbdelrahmanAli94
@AbdelrahmanAli94
Jul 18 2016 03:14
Hello there
would anyone that making Asp.net projects ?
is that **
Pericles
@periman2
Jul 18 2016 04:46
@wbac88 @khaduch There is a solution for this which I "borrowed" from someone's code !
I don't remember the name to credit him though :/
Naveen L Bhandari
@naveenlb
Jul 18 2016 04:49
error2.jpg
i tried without space too
Pericles
@periman2
Jul 18 2016 04:50
@naveenlb it's without the spaces and ThridLine
with capital L
Naveen L Bhandari
@naveenlb
Jul 18 2016 04:51
@periman2 Thanks man. Awesome
CamperBot
@camperbot
Jul 18 2016 04:51
naveenlb sends brownie points to @periman2 :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @periman2 |http://www.freecodecamp.com/periman2
Pericles
@periman2
Jul 18 2016 04:52
@naveenlb anytime
Avinash
@AvinashXclusiveminds
Jul 18 2016 05:55
hello
friends
i have some query
and i am new in freecodecamp
Sorin Ruse
@sorinr
Jul 18 2016 06:15
@d1sr3 hi. here is the forked pen made functional: http://codepen.io/sorinr/pen/RRQPEV
Patrick K.
@patrickk93
Jul 18 2016 06:24
should one go through all the intermediate/advanced alg challenges before taking on the advanced front end projects
kirbyedy
@kirbyedy
Jul 18 2016 07:09
@patrickk93 it is up to you, you can skip
there are no rules
the only challenges that have to be done are those marked with *
if you want the certificate
buiphuking
@buiphuking
Jul 18 2016 07:11
someone plz share for me a web app to draw a graph before coding, and i can share with my friend and he can adjust through internet ????????????????
d1sr3
@d1sr3
Jul 18 2016 07:19
@sorinr Thanks
CamperBot
@camperbot
Jul 18 2016 07:19
d1sr3 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 490 | @sorinr |http://www.freecodecamp.com/sorinr
Nagireddy Srichakradhar Reddy
@srichakradhar
Jul 18 2016 07:20
uyzzz
I'm working on a quiz for new joiners in our project
https://web.iiit.ac.in/~srichakradhar.reddy/project/pacman-quiz/index.html
Sorin Ruse
@sorinr
Jul 18 2016 07:20
@d1sr3 welcome. if you don't understand what i did just ask
Nagireddy Srichakradhar Reddy
@srichakradhar
Jul 18 2016 07:20
I need to add some mechanism to have blanks instead of MCQs in this
would anyone like to pair up?
also, I'm thinking of swapping the Pacman with Snakes & Ladders
for which I have the game logic here: http://www.codeproject.com/KB/HTML/396639/Snakes_and_Ladders.zip
Sorin Ruse
@sorinr
Jul 18 2016 07:22
@d1sr3 btw. when you changed your pen and made it work just let me know so i can delete the forked one
Robert Garcia
@highestflyingeagle
Jul 18 2016 07:40
Hello, I've just completed my Tribute Page and added the link: http://codepen.io/highestflyingeagle/details/yJvOBv/
The problem I'm having is that it won't let me go to the next step. Can anyone tell me what I'm doing wrong?
d1sr3
@d1sr3
Jul 18 2016 07:41
@sorinr I made it work you might delete the forked one. I think the major change was changing the <form> to <div> it started working then
Sorin Ruse
@sorinr
Jul 18 2016 07:44
@d1sr3 yes. because when i tried to event.preventDefault() to stop submitting the form the $.ajax call was not working(it could not set the headers the right way). it was just a quick fix :)
Casey Heath
@ExhibitArts
Jul 18 2016 08:06
Could someone please tell me the best way with Bootstrap to position a title on my website? - http://linkwithus.byethost3.com/
shweta rajput
@ShwetaRajput
Jul 18 2016 08:10
hello everyone. this is my twitch.tv app: https://codepen.io/shwetarajput012/pen/xOYKON?editors=1010
i want to display the results in the well i created. would someone help me in that?
Sorin Ruse
@sorinr
Jul 18 2016 08:15
@ShwetaRajput from the api calls i would build an object with all the data i need then loop through it and dynamically update my DOM
shweta rajput
@ShwetaRajput
Jul 18 2016 08:17
@sorinr can you ellaborate. what exactly to be done?
Sorin Ruse
@sorinr
Jul 18 2016 08:26
@ShwetaRajput like: make a global var streamers = [] ; then into the if statements you can write stramers.push({"id:": channel, "status": streaming, "logo": logo, ecc }); when you have your streamers ready loop through it and using only a html template display them as you wish. here is my pen for this challenge: http://s.codepen.io/sorinr/debug/EymkWr If u want to see the code change debug with pen
Krishna Sahu
@dvlprkrishna
Jul 18 2016 08:36
hello everyone
Adam Dąbrowski
@a-dabrowski
Jul 18 2016 08:38
hi @Kripsahu :)
Krishna Sahu
@dvlprkrishna
Jul 18 2016 08:41
hi @JesusChryslerSuperstar
i need help here is my problem http://i.imgur.com/9EmvxAd.png
html

<section class="about" id="about">
            <div class="container-fluid">
                <div class="row-fluid">
                    <div class="span12">
                        <h2>About Me.</h2>
                    </div>

                    <div class="col-md-4">
                        <img src="images/Avatar.jpg" width="96px" alt="Krishna Sahu" class="img-responsive">
                        <!-- <h6>↑ thats me.</h6> tooltip -->
                        <!-- social icons -->
                        <div id="socialicons">
                            <a class="icon" href="#" title="Follow Me" target="_blank"><i class="fa fa-twitter"></i></a>
                            <a class="icon" href="#" title="Like us on Facebook" target="_blank"><i class="fa fa-facebook"></i></a>
                            <a class="icon" href="#" title="Follow with Twitter" target="_blank"><i class="fa fa-codepen"></i></a>
                            <a class="icon" href="#" title="Follow with Twitter" target="_blank"><i class="fa fa-github"></i></a>
                        </div>
                    </div>

                    <div class="col-md-8">
                        <p>
                            Hi, I’m Krishna an aspiring web developer.
                        I build useable and beautifull websites using HTML5. <!--, CSS3, Bootstrap, JQuery, Javascript, Magic-->
                        Currently living in between Mumbai and Pune but originally from Mumbai, India.                         
                        Also, i am the founder of <a href="#">SkLabs</a>, we develope mostly android apps and chrome extensions.

                        Follow me <a href="#">@krissahu</a> or write me an <a href="#">email</a>
                        </p>
                    </div>
                </div>
            </div>
        </section>
css

/* About section */

.about img {
    border-style: solid;
    float: right;
    padding-top: 6%;

}

.about p {
    font-size: 22px;
    line-height: 30px;
    margin: 0px 0px 30px;
    padding-top: 3%;
}

/* Social icons */

#socialicons {
    text-align: center;
    float: right;
}
#socialicons .icon{
    color: #47c6a9;
    display: inline-block;
    font-size: 20px;
    text-align: center;
    margin: 0 6px 5px;
    float: right;
    padding-top: 120%;
    float: right;
}
#socialicons .icon:hover{
    color: #2d9079;
}
axel8591
@axel8591
Jul 18 2016 08:44
@Kripsahu Hi I see you gave same name for an class and an Id. In your css the Id name needs a #
@Kripsahu and normaly you don't need to add a fluid tag to your row class
Krishna Sahu
@dvlprkrishna
Jul 18 2016 08:46
@axel8591 you mean the icon class that i gave to a tag? thanks for the row tip never knew that
CamperBot
@camperbot
Jul 18 2016 08:46
kripsahu sends brownie points to @axel8591 :sparkles: :thumbsup: :sparkles:
:cookie: 314 | @axel8591 |http://www.freecodecamp.com/axel8591
axel8591
@axel8591
Jul 18 2016 08:47
@Kripsahu mm let's do it and see
Krishna Sahu
@dvlprkrishna
Jul 18 2016 08:49
@axel8591 nope i guess i misinterpreteed
icon as class tag works fine
axel8591
@axel8591
Jul 18 2016 08:52
@Kripsahu cool
Krishna Sahu
@dvlprkrishna
Jul 18 2016 08:54
the actuall code length is pretty large to be posted here :/ i dont like the codepen layout it confuses me let me put it on github i guess
axel8591
@axel8591
Jul 18 2016 08:57
@Kripsahu Same for me.. i don't like such a platform.
pauperwithpotential
@pauperwithpotential
Jul 18 2016 08:58
hey guys, im facing a problem with scrollspy it does not highlight where on the nav bar. i checked sources like w3schools and cant seem to find what's wrong with my code.. http://codepen.io/pauperwithpotential/pen/bZLZwQ
kirbyedy
@kirbyedy
Jul 18 2016 09:06
@pauperwithpotential because you did not load jquery and bootstrap libraries
add them in your codepen settings with quick add, under the javascript section
axel8591
@axel8591
Jul 18 2016 09:08
@kirbyedy cool
pauperwithpotential
@pauperwithpotential
Jul 18 2016 09:09
@kirbyedy ahh i see. didn't know i had to do that but thank you very much! it works now
CamperBot
@camperbot
Jul 18 2016 09:09
pauperwithpotential sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1243 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:11
hello @kirbyedy can help me figure whats wrong in my code?
:point_up: July 18, 2016 2:11 PM
kirbyedy
@kirbyedy
Jul 18 2016 09:11
do you have it on codepen ?
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:11
sadly nope
kirbyedy
@kirbyedy
Jul 18 2016 09:11
uhm difficult for me to debug this way
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:12
hang on i will upload it
Sorin Ruse
@sorinr
Jul 18 2016 09:15
This message was deleted
axel8591
@axel8591
Jul 18 2016 09:16
@Kripsahu Why no html, head and body tags inside your code?
kirbyedy
@kirbyedy
Jul 18 2016 09:17
@axel8591 its just a part of the code I guess
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:17
@kirbyedy @axel8591 @sorinr http://codepen.io/kripsahu/pen/WxrxBN
i hope codepen support imgur
axel8591
@axel8591
Jul 18 2016 09:18
@kirbyedy yap but example he needs to add a meta charset
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:18
@axel8591 i have those tag just i didnt uploaded them before silly me
axel8591
@axel8591
Jul 18 2016 09:19
@Kripsahu no way ^^
kirbyedy
@kirbyedy
Jul 18 2016 09:19
@Kripsahu codepen wont load imgur pictures
try to use other host
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:19
damnit let me upload images else were :/ blogspot let try that
btw my profile pic got displayed in codepen result
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:26
@kirbyedy updated the links
should work now
axel8591
@axel8591
Jul 18 2016 09:26
@Kripsahu cool
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:27
thanks @axel8591
CamperBot
@camperbot
Jul 18 2016 09:27
kripsahu sends brownie points to @axel8591 :sparkles: :thumbsup: :sparkles:
:warning: kripsahu already gave axel8591 points
Sorin Ruse
@sorinr
Jul 18 2016 09:34
@Kripsahu i think u should get rid of padding-top: 120%; from your #socialicons .icon{}
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:36
@sorinr removing that would move the icon to top right side of the image trying to achieve this layout http://i.imgur.com/KSRYHJu.png
i need a way in which i can stack those icon below image
axel8591
@axel8591
Jul 18 2016 09:38
@camperbot omg! tu
Sorin Ruse
@sorinr
Jul 18 2016 09:38
@Kripsahu let me fork it and play with it
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:39
sure :) mean while i will optimize css and find that sneaky error
kirbyedy
@kirbyedy
Jul 18 2016 09:40
@Kripsahu ok I fixed it
you will have to play a bit with paddings, but mainly its fixed
Screen Shot 2016-07-18 at 12.41.19.png
 <div class="col-md-4">
          <!-- <h6>↑ thats me.</h6> tooltip -->
          <!-- social icons -->
          <div class="flexcontainer">
            <img src="http://i.imgur.com/A9OKUJZ.jpg" width="96px" alt="Krishna Sahu" class="img-responsive">
            <div id="socialicons">
              <a class="icon" href="#" title="Follow Me" target="_blank"><i class="fa fa-twitter"></i></a>
              <a class="icon" href="#" title="Like us on Facebook" target="_blank"><i class="fa fa-facebook"></i></a>
              <a class="icon" href="#" title="Follow with Twitter" target="_blank"><i class="fa fa-codepen"></i></a>
              <a class="icon" href="#" title="Follow with Twitter" target="_blank"><i class="fa fa-github"></i></a>
            </div>
          </div>
        </div>
your fixed html
Sorin Ruse
@sorinr
Jul 18 2016 09:43
@Kripsahu @kirbyedy here is my solution: http://codepen.io/sorinr/pen/dXdpYj
kirbyedy
@kirbyedy
Jul 18 2016 09:44
.flexcontainer {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: flex-end;
   align-items: flex-end;
}
#socialicons {
    text-align: center;
    float: right;
}
#socialicons .icon{
    color: #47c6a9;
    display: inline-block;
    font-size: 20px;
    text-align: center;
    margin: 0 6px 5px;
    float: right;
    float: right;
}
#socialicons .icon:hover{
    color: #2d9079;
}
css
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:46

i did

padding-top: 25%;

achieved similar result

but i am going ahead with your version
thanks @sorinr @kirbyedy was stuck here for past 20 so minutes :) thanks again :)

CamperBot
@camperbot
Jul 18 2016 09:46
kripsahu sends brownie points to @sorinr and @kirbyedy :sparkles: :thumbsup: :sparkles:
:cookie: 491 | @sorinr |http://www.freecodecamp.com/sorinr
:star2: 1244 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Sorin Ruse
@sorinr
Jul 18 2016 09:48
@Kripsahu using flex it is a much better solution as @kirbyedy said
Krishna Sahu
@dvlprkrishna
Jul 18 2016 09:50
@sorinr thx searching more about flex :)
CamperBot
@camperbot
Jul 18 2016 09:50
kripsahu sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: kripsahu already gave sorinr points
Krishna Sahu
@dvlprkrishna
Jul 18 2016 10:21
thanks again @kirbyedy :)
CamperBot
@camperbot
Jul 18 2016 10:21
kripsahu sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: kripsahu already gave kirbyedy points
deepakSpatil
@deepakSpatil
Jul 18 2016 10:25

i am having 3 array;

var arr1 = [1,2,3];
var arr2 = [x , x2, x3];
var arr3 = [y , y2, y3];

and i want to create an array of objects

var obj = [{ key : 1, values : {x,y} } ,{ key : 2, values : {x2,y2} }, { key : 3, values : {x3,y3} }]
can any one help me in this or provide some links whr i can find some help??

Adam Lichter
@spot1000
Jul 18 2016 10:44
@deepakSpatil this might help a little bit http://stackoverflow.com/questions/4215737/convert-array-to-object
basically you just need to iterate over the array and make it so that arr1 becomes the keys, and arr 2,3 become an array of values? I'm assuing that's what you want
Ajay Tanwar
@ajayt365
Jul 18 2016 11:13
hey , i had a query in random quote machine . i placed "quote left" icon above the div "quote-text" but when i applied border property to "quote-text", the icon seems to be a part of that div . i don't know why? can anybody help me with this ? here is my codepen link https://codepen.io/ajayt365/pen/KrXoPp
Sorin Ruse
@sorinr
Jul 18 2016 11:19
@ajayt365 as i told u. its not part of that div. press F12 for dev tools and select <div class="quote-text"> to see its boundaries
kirbyedy
@kirbyedy
Jul 18 2016 11:22
Screen Shot 2016-07-18 at 14.22.11.png
so what is the question again ? :)
Sorin Ruse
@sorinr
Jul 18 2016 11:24
@kirbyedy good question :)
Ajay Tanwar
@ajayt365
Jul 18 2016 11:27
but in my window it looks like that . @kirbyedy which extension did u use to take this screenshot. i will send it here.
kirbyedy
@kirbyedy
Jul 18 2016 11:28
its the chrome dev tools
Ajay Tanwar
@ajayt365
Jul 18 2016 11:31
please reload it once . i think codepen didn't save that when i sent it first time because there is no border as well. and @kirbyedy i was asking how did u take screenshot of that ? i opened devtools but couldn't take screenshot of that.
kirbyedy
@kirbyedy
Jul 18 2016 11:36
command+shift+4 on a mac
Ajay Tanwar
@ajayt365
Jul 18 2016 11:36
did u see ? is the border visible ?
kirbyedy
@kirbyedy
Jul 18 2016 11:37
yes
Ajay Tanwar
@ajayt365
Jul 18 2016 11:38
quote left seems to be part of that . isn't it ?
@sorinr please look now.
kirbyedy
@kirbyedy
Jul 18 2016 11:40
but what is the question ?
I mean problem
Screen Shot 2016-07-18 at 14.39.40.png
Sorin Ruse
@sorinr
Jul 18 2016 11:42
@ajayt365 it seems like that because you have the float:left on it. if you cut that you will see its outside
Ajay Tanwar
@ajayt365
Jul 18 2016 11:42
is " quote left a part of the div="quote-text"? because in my html i didn't write that inside <div="quote-text"> then how it's part of it , when i see it through devtools?
but i want it to be extreme left . that's why i did float:left @sorinr
@sorinr so what float:left does is that the div doesn't know that quote-left is there ? am i right ?
Sorin Ruse
@sorinr
Jul 18 2016 11:47
@ajayt365 i know that. to just cut it was an example that will show you its not into that div
Ajay Tanwar
@ajayt365
Jul 18 2016 11:49
i don't understand the mechanics of float here . please help @sorinr . what is happening here ?
Sorin Ruse
@sorinr
Jul 18 2016 11:51
@ajayt365 get rid of float left style and add this to ur css: i.fa-quote-left{ position: absolute; top:2px; left:2px; }
Ajay Tanwar
@ajayt365
Jul 18 2016 11:58
@sorinr it's working thanks. but i face problems in when to use which property and where ? how do u deal with that ?
CamperBot
@camperbot
Jul 18 2016 11:58
ajayt365 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 493 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 18 2016 11:59
@ajayt365 just learned it in time. and i'm still learning
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 12:02
guys
i decide to write about elon musk in Build a Tribute Page
so iam here
what is next step
Sorin Ruse
@sorinr
Jul 18 2016 12:07
@ahmedvip2008 just keep coding the way you want to see your final design
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 12:08
i dont know if i am on the right path
Ajay Tanwar
@ajayt365
Jul 18 2016 12:10
@sorinr i was playing with my design and removed the height:30%. i wanted to know why height:auto is not working here for the div? the buttons are overflowing. also when i check the devtools , i don't see a rectangle on my div.buttons . thanks
CamperBot
@camperbot
Jul 18 2016 12:10
ajayt365 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: ajayt365 already gave sorinr points
Sorin Ruse
@sorinr
Jul 18 2016 12:10
@ahmedvip2008 add some more info about elon with a link to an external page where we can read even more. style your text, pictures ecc
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 12:13
style it with what
and can i show the code for who make the same challenge on the site
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 12:22
and i have another question
how i can return to the answers i have mentioned before
faraz
@silentarrowz
Jul 18 2016 12:29
can anyone help me with this - I am having problems styling this cart button on hover - http://codepen.io/silentarrowz/pen/KrQNRB
when I hover over the cart button( the one which says - cart - $800 then only paragraph inside it changes color, but I want the whole div with class .cart to change color instead.
why isnt it happening? where am I going wrong??
Sorin Ruse
@sorinr
Jul 18 2016 12:40
@silentarrowz this way: .cart:hover, .cart:hover span, .cart:hover a { background-color : #1abc9c; color:white; } ?
faraz
@silentarrowz
Jul 18 2016 12:42

@sorinr yeah, it works. what was I doing wrong??
and I dont understand this part --

.cart:hover span

can I put in elements even after hover??

Sorin Ruse
@sorinr
Jul 18 2016 12:45
@silentarrowz just added .cart:hover,
readytocode123
@readytocode123
Jul 18 2016 12:46
thanks and great job sorin! was trying to figure it out too
Sorin Ruse
@sorinr
Jul 18 2016 12:46
@silentarrowz i haven't touch your other code
@readytocode123 welcome
faraz
@silentarrowz
Jul 18 2016 12:47
@sorinr but I dont have any code which has commas like this??
@sorinr what does the comma do in this code . does it act as "and"??
Sorin Ruse
@sorinr
Jul 18 2016 12:48
@silentarrowz think of it like: body,html,div {background-color: blue;}
faraz
@silentarrowz
Jul 18 2016 12:49
aha, got it now. @sorinr
thanks @sorinr
CamperBot
@camperbot
Jul 18 2016 12:49
silentarrowz sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 494 | @sorinr |http://www.freecodecamp.com/sorinr
Jared de Guzman
@JDVariadic
Jul 18 2016 12:49

https://codepen.io/JDVariadic/pen/RRxEdP

Could anyone find the problem to my code? The random quote machine was showing quotes yesterday. I don't know what happened now.

Sorin Ruse
@sorinr
Jul 18 2016 12:50
@silentarrowz welcome
kirbyedy
@kirbyedy
Jul 18 2016 12:51
@JDVariadic try adding https://crossorigin.me/ before the link
its cheating, but it works :D
Jared de Guzman
@JDVariadic
Jul 18 2016 12:52
@kirbyedy Thanks, it works again :D
CamperBot
@camperbot
Jul 18 2016 12:52
jdvariadic sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1245 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 12:54
Can anyone help me: I'm working on wikipedia viewer and my data binding is not working: http://codepen.io/camilavilarinho/pen/rLwqYL?editors=1010
I don't know if it's because of the way i'm requesting the json...anybody knows?
Sorin Ruse
@sorinr
Jul 18 2016 12:56
@camilaavilarinho why do u say its not working ? you get a response from the api call
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 12:57
yes, but is not woking on the html
$scope.data seems to be empty
Sorin Ruse
@sorinr
Jul 18 2016 13:00
@camilaavilarinho if you make console.log($scope.data); you will see that $scope.data is an array
Jared de Guzman
@JDVariadic
Jul 18 2016 13:00
How do you remove quotes from a string that you got from using the JSON.stringify function?
Adetunji Iyaniwura
@Iadetunji
Jul 18 2016 13:02
http://codepen.io/Iadetunji/pen/BzJvvL,am having issues with the search output linking to the wikipedia article
Sorin Ruse
@sorinr
Jul 18 2016 13:03
@Iadetunji have you saved your pen? i got a 404
Adetunji Iyaniwura
@Iadetunji
Jul 18 2016 13:06
@sorinr ,reload the page
Sorin Ruse
@sorinr
Jul 18 2016 13:07
@Iadetunji same
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 13:07
@sorinr when i call console.log($scope.data); worked once, but now i can't get a answer (I'm calling outside $scope.search function)
Jared de Guzman
@JDVariadic
Jul 18 2016 13:12
How do I make a button have a permanent position? Cause when a long quote appears in my random quote machine, the button is moved to the next line. I tried to use position: fixed but it isn't working
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 13:12
@sorinr Inside $scope.search function I can see the array. But the thing is, how can I see the values of the array in the html? how can I use a angular expression to bind the values of $scope.data ?
Dylan
@dhcodes
Jul 18 2016 13:14
@JDVariadic you could try position: absolute; but it would probably not work well on mobile
@JDVariadic alternatively you could try setting a fixed width on your quote div to keep it from changing when the quote is longer
Sorin Ruse
@sorinr
Jul 18 2016 13:15
@camilaavilarinho is it a way in angular to see the reactivity of the data like <pre>{{ $scope.data }} </pre> ?
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 13:17
@sorinr yes, but the binding is not working =/
Sorin Ruse
@sorinr
Jul 18 2016 13:17
@camilaavilarinho i think u should use an ng-repeat or something like this. i have never used angular before but i have done some apps using vue.js
Jared de Guzman
@JDVariadic
Jul 18 2016 13:17
@dhcodes Thanks, it doesn't push it anymore
CamperBot
@camperbot
Jul 18 2016 13:17
jdvariadic sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1221 | @dhcodes |http://www.freecodecamp.com/dhcodes
Dylan
@dhcodes
Jul 18 2016 13:18
cool
Sorin Ruse
@sorinr
Jul 18 2016 13:20
@camilaavilarinho what is the reason for <section class="search-form" ng-controller="wikicontroller"> and <section class="result" ng-controller="wikicontroller"> ?
@camilaavilarinho i think app.controller('wikicontroller', function($scope, $http) its initializing the first ng-controller declaration
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 13:24
@sorinr it's because i have the select separate, so i'm calling the controller in both
@sorinr I'll check this inicialization, thanks
CamperBot
@camperbot
Jul 18 2016 13:25
camilaavilarinho sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 495 | @sorinr |http://www.freecodecamp.com/sorinr
Jared de Guzman
@JDVariadic
Jul 18 2016 13:30
One Question.. how do you use javascript variables as html values for attributes? There's a data-text attribute for the twitter button I have and I want it to automatically type the quote the moment the button is pressed.
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 13:37
how i an style with bootstrap
should i go to back and read all chalnges
Matt K
@mkrump
Jul 18 2016 13:40
@cysonya Thanks. Using a row looks like it fixed the issue.
CamperBot
@camperbot
Jul 18 2016 13:40
mkrump sends brownie points to @cysonya :sparkles: :thumbsup: :sparkles:
:cookie: 327 | @cysonya |http://www.freecodecamp.com/cysonya
Matthew Boland
@mattboland
Jul 18 2016 13:54
@ahmedvip2008 you can do that or you can read the documentation and find what you are looking for http://getbootstrap.com/css/
willcodes
@willcodes
Jul 18 2016 14:11
anyone help me using the open weather api?
$(document).ready(function(){

    var location ="http://ip-api.com/json";
    $.getJSON(location, function(data2) {
        var lat=data2.lat;
        var lon=data2.lon;
    $('#coord').text(lat + ' ' + lon)

    $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" +lat+ "&lon" + lon +"&appid=5dff30ca60b80db9dd8cd357fa28f721", function(data){
        var city = data.id;


    $("#city").text(city);    
    });
});
});
vladmanea99
@vladmanea99
Jul 18 2016 14:14
Hi, I just wanted to ask, I've done the 99 challanges in HTML5 and now I have a challange about bulding a tribute page, I've seen this https://codepen.io/FreeCodeCamp/full/NNvBQW/ but the question is: Can I make a tribute to anything I want?
Martynas
@Marjanus
Jul 18 2016 14:15
@JDVariadic , you an use string concatenation If you are using jQuery, something like that would work: $("button").attr("urlAdress" + variableName) . "urlAdress" can be a string
@vladmanea99 Yes, it is your choice.
vladmanea99
@vladmanea99
Jul 18 2016 14:16
@Marjanus Ok, thank you.
CamperBot
@camperbot
Jul 18 2016 14:16
vladmanea99 sends brownie points to @marjanus :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @marjanus |http://www.freecodecamp.com/marjanus
Pericles
@periman2
Jul 18 2016 14:20
@vladmanea99 yes you can ! and I didn't know that when I did it sadly xD
Juwdohr
@Juwdohr
Jul 18 2016 14:22
Hey, can I get some help my code? It seems to be running an inifinite loop. And I don't seem to be able to figure out where that loop is.
http://codepen.io/juwdohr/pen/XKbbEZ
willcodes
@willcodes
Jul 18 2016 14:22
@khaduch are u around?
Sorin Ruse
@sorinr
Jul 18 2016 14:23
@Marjanus when you use $("element").attr() the format is: $("element").attr('class') if u want to retrive the clases applied to that element or $("element").attr('class', 'btn btn-default') to apply a class atribute
Sorin Ruse
@sorinr
Jul 18 2016 14:29
@vladmanea99 yep
d1sr3
@d1sr3
Jul 18 2016 14:34
This message was deleted
codercooooder
@codercooooder
Jul 18 2016 14:37
hey all is anyone here knowledgeable about image compression/lazy loading/page optimization techniques?
d1sr3
@d1sr3
Jul 18 2016 14:40

Hello how should I access child elements of a <div> with jquery for example :

<div id = "x">
   <div id = "x1">
   </div>
   <div id = "x2">
   </div>
</div>

I thought simply :

$("#x1").on("click", function(){
   ...
});

would work, but it obviously doesn't and secondly how can I make a function for all the children at once I mean something like :

$("#x[1-2]").on("click", function(){
   ...
});
Sorin Ruse
@sorinr
Jul 18 2016 14:48
@d1sr3 why not aplly same class to all elements you want and add an event to it? like: $(document).on('click.myclass', '.myclass', function (e) {})
James Riall
@JamesRiall
Jul 18 2016 14:53
can anyone help me with my simon project? I'm having trouble storing the values of player input and checking it against the required input. I made a forum post here: http://forum.freecodecamp.com/t/problem-with-simon-game-pushing-values-more-than-once/21088
d1sr3
@d1sr3
Jul 18 2016 14:55
@sorinr I will need to know which concrete child object has been clicked and aplly a class just for that one object
Sorin Ruse
@sorinr
Jul 18 2016 15:01
@d1sr3 yes but you can $(e.target).closest('div').css();
Elbert Cortez
@trip16661
Jul 18 2016 15:09
@d1sr3
$("#x div").on(bla bla bla
//and if you want to know wich one you used you can get that info with ''this" or
//if u want just one of them 
$("#x :first-child")
Laura Silvey
@LauraSilvey
Jul 18 2016 15:10
I'm currently working on the Twitch.tv viewer project and having trouble accessing the api. I am using this url https://api.twitch.tv/kraken/streams/freecodecamp?callback=? but nothing shows up. Any ideas on what I am doing wrong?
Sorin Ruse
@sorinr
Jul 18 2016 15:11
@LauraSilvey can you post the pen link?
Laura Silvey
@LauraSilvey
Jul 18 2016 15:12
I'm currently working in sublime. Let me start a codepen and I'll be back to ask for help again.
Juwdohr
@Juwdohr
Jul 18 2016 15:14
Hey, can I get some help my code? It seems to be running an inifinite loop. And I don't seem to be able to figure out where that loop is.
http://codepen.io/juwdohr/pen/XKbbEZ
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 15:15
Can anyone review my code, I don't know why is taking so long to show the answer:
http://codepen.io/camilavilarinho/pen/rLwqYL?editors=1010
d1sr3
@d1sr3
Jul 18 2016 15:17
@trip16661 It doesn't work for me
Elbert Cortez
@trip16661
Jul 18 2016 15:19
@d1sr3 if you write $("#x div").on("click", function() {
console.log($(this))
}
you will see your doom element the one that you just click
so with that in mind you can do many things with t hat
for example binding data type to the doom element and accesing it changing css values etc etc
just by $(this).css("background-colo", "black")
or
$(this).data("myData");
if that doesnt work then either you dont have installed jquery or
your whole syntax is wrong
show your code
Sorin Ruse
@sorinr
Jul 18 2016 15:22
@camilaavilarinho i think its a reactivity problem. also for me it takes to long from the moment you press enter and the moment to update. and also the dom is not refreshing on a second search
Camila Vilarinho
@camilaavilarinho
Jul 18 2016 15:26
@sorinr do you know how to solve this?
Sorin Ruse
@sorinr
Jul 18 2016 15:32
@camilaavilarinho is there a way in angular to watch a variable?
Sorin Ruse
@sorinr
Jul 18 2016 15:37
@d1sr3 are u trying to make the divs id="par0----n" linkable to the wikipedia page?
d1sr3
@d1sr3
Jul 18 2016 15:40
@sorinr yes I'll do that too, but as first I want add the class with border to those child objects when I click them
Sorin Ruse
@sorinr
Jul 18 2016 15:43
@d1sr3 then why js if you can add a class like myborderedand trigger it in css like mybordered:active {border bla bla } ?
d1sr3
@d1sr3
Jul 18 2016 15:47
@sorinr I tried it as first, but it didn't seem to work so I started doing it with js
Sorin Ruse
@sorinr
Jul 18 2016 15:48
@d1sr3 ok. i'll fork it again and play with it
d1sr3
@d1sr3
Jul 18 2016 15:48
This message was deleted
CamperBot
@camperbot
Jul 18 2016 15:48
sorry d1sr3, you can't send brownie points to yourself! :sparkles: :sparkles:
d1sr3
@d1sr3
Jul 18 2016 15:49
@sorinr I did it exactly as the hover, but with the :active and it didn't work ... thanks
CamperBot
@camperbot
Jul 18 2016 15:49
d1sr3 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 496 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 18 2016 15:52
@d1sr3 what class do you want to apply .bord?
d1sr3
@d1sr3
Jul 18 2016 15:53
@sorinr yes
text THE LIFE OF ELON MUSK
how i can move it
codercooooder
@codercooooder
Jul 18 2016 16:09
@ahmedvip2008 where do you want to move it?
@ahmedvip2008 you can do things - you can edit your H3 in the css, or you can create a div around the header/h3, and then edit the css for that.
Sorin Ruse
@sorinr
Jul 18 2016 16:10
@d1sr3 here is the solution: http://codepen.io/sorinr/pen/dXdWOy
codercooooder
@codercooooder
Jul 18 2016 16:12
is there anyone around who is knowledgeable about image compression/lazy loading who has some time to explain basic concepts to me?
d1sr3
@d1sr3
Jul 18 2016 16:21
@sorinr thanks
CamperBot
@camperbot
Jul 18 2016 16:21
d1sr3 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: d1sr3 already gave sorinr points
Sorin Ruse
@sorinr
Jul 18 2016 16:23
@d1sr3 its what u wanted?
what do you think about this project
Sorin Ruse
@sorinr
Jul 18 2016 16:25
@ahmedvip2008 good you did it
d1sr3
@d1sr3
Jul 18 2016 16:26
@sorinr yes now I can carry on with the challenge again and hopefully finish it without getting stuck again
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 16:28
@sorinr thanks
but i have question
i cant understand the difference between container and container-fluid
CamperBot
@camperbot
Jul 18 2016 16:28
:cookie: 497 | @sorinr |http://www.freecodecamp.com/sorinr
ahmedvip2008 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Ahmed El-Rayes
@ahmedvip2008
Jul 18 2016 16:31
@d1sr3 thx
CamperBot
@camperbot
Jul 18 2016 16:31
ahmedvip2008 sends brownie points to @d1sr3 :sparkles: :thumbsup: :sparkles:
:cookie: 26 | @d1sr3 |http://www.freecodecamp.com/d1sr3
Sorin Ruse
@sorinr
Jul 18 2016 16:45
@d1sr3 try it now for more features: http://codepen.io/sorinr/pen/dXdWOy
d1sr3
@d1sr3
Jul 18 2016 16:57
@sorinr Oh great thanks
CamperBot
@camperbot
Jul 18 2016 16:57
d1sr3 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 498 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 18 2016 16:59
@d1sr3 just one line of code to save time
d1sr3
@d1sr3
Jul 18 2016 17:02
@sorinr by the way I have just found out how to do it in the way I wanted to :D
Sorin Ruse
@sorinr
Jul 18 2016 17:03
@d1sr3 great. when you finish just send me the link to the pen. can i delete the forked one for now?
d1sr3
@d1sr3
Jul 18 2016 17:04
@sorinr $("#htxt").on("click",'[id^=par]', function(){... if you were interested .. I understood what it exactly works like from your code.. yes
Sorin Ruse
@sorinr
Jul 18 2016 17:05
@d1sr3 yes because of the id^=par
maujeri
@maujeri
Jul 18 2016 17:20
hi
Hüseyin Emecan
@Guvargam
Jul 18 2016 17:20
hi
maujeri
@maujeri
Jul 18 2016 17:20
guys sorry for my bad english but i'm italian
i have a question
Hüseyin Emecan
@Guvargam
Jul 18 2016 17:20
cool
maujeri
@maujeri
Jul 18 2016 17:20
a dumb question*
Hüseyin Emecan
@Guvargam
Jul 18 2016 17:21
ok then give us
maujeri
@maujeri
Jul 18 2016 17:21
in 'Build a tribute page' i have copy the example?
not the code
graphically
Sorin Ruse
@sorinr
Jul 18 2016 17:22
@maujeri no. u can make a tribute page on any subject you like
maujeri
@maujeri
Jul 18 2016 17:22
ahh okay, thanks
but the structure of the page must be similar?
Sorin Ruse
@sorinr
Jul 18 2016 17:28
@maujeri you are free to make any design you want as long as you respect the user stories in the challenge
Ivan
@gonzalezi2
Jul 18 2016 17:30
hey guys I'm working on the random quote machine project and all I've got left is to create the tweet button for the quote. Problem is I can't figure out how to set the href so that it uses the quote in it. Let me know if any of you can help
Patrick Walters
@patwalt
Jul 18 2016 17:33
Hey, everyone
I had a question about using codepen.io
vínαч puppαl
@vinaypuppal
Jul 18 2016 17:33
@gonzalezi2 Hi, i used window.open() with click handler on that tweet button like below
window.open('http://twitter.com/share?text=' + encodeURIComponent(randomQuoteText) + ' ' + 'By ' + encodeURIComponent(randomQuoteTextBy));
  });
Patrick Walters
@patwalt
Jul 18 2016 17:34
I note the 3 sections of HTML, CSS, and JS
Is it redundant to invoke css within the HTML?
Ivan
@gonzalezi2
Jul 18 2016 17:34
@vinaypuppal do you know how to do it using the url method as provided by Twitter?
Patrick Walters
@patwalt
Jul 18 2016 17:35
As in: <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
vínαч puppαl
@vinaypuppal
Jul 18 2016 17:35
@gonzalezi2 which url ??
Sorin Ruse
@sorinr
Jul 18 2016 17:35
@gonzalezi2 or like 'https://twitter.com/intent/tweet?text=' + data.quoteText + ' Author: ' + data.quoteAuthor +' @gonzalezi2 ';
Patrick Walters
@patwalt
Jul 18 2016 17:36
Or is it the case that I do not need to use that line because I already have a CSS section and can assume it will flawlessly integrate it?
Ivan
@gonzalezi2
Jul 18 2016 17:36
yes that's what I meant @sorinr @vinaypuppal
```
dhuddleston
@dhuddleston
Jul 18 2016 17:36
So is it not longer a requirement that the Tic-Tac-Toe AI should be unbeatable?
Ivan
@gonzalezi2
Jul 18 2016 17:36
         document.getElementById("tweet-button").attr("href", "https://twitter.com/intent/tweet?text=" +  response.quoteText + "." + " " + response.quoteAuthor);
This is my code
MikeBeers
@MikeBeers
Jul 18 2016 17:37
Please look at portfolio page
Sorin Ruse
@sorinr
Jul 18 2016 17:37
@gonzalezi2 and its not working?
Ivan
@gonzalezi2
Jul 18 2016 17:37
I'm trying to get the code to change the attribute of the tweet button so that it will change the url and add the quote and author
@sorinr no i can't figure it out. I do have it inside the same function that creates the quote inside the block of text. Should i be creating a separate block of code?
 $.ajax({
      url: 'http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?',
      dataType: 'jsonp',
      success: 
        function parseQuote(response)
        {
            document.getElementById("quote").innerHTML = "<i class=\"fa fa-quote-left\" aria-hidden=\"true\"></i> " + response.quoteText + "<i class=\"fa fa-quote-right\" aria-hidden=\"true\"></i> ";
            document.getElementById("author").innerHTML = "- " + response.quoteAuthor;
        }
      });
          document.getElementById("tweet-button").attr("href", "https://twitter.com/intent/tweet?text=" +  response.quoteText + "." + " " + response.quoteAuthor);
    });
  });
This is everything
dhuddleston
@dhuddleston
Jul 18 2016 17:40
@MikeBeers :thumbsup: Looks good!
Sorin Ruse
@sorinr
Jul 18 2016 17:40
@gonzalezi2 the response its not visible outside of the parseQuote(response)
MikeBeers
@MikeBeers
Jul 18 2016 17:42
:)
Sorin Ruse
@sorinr
Jul 18 2016 17:43
@MikeBeers i would add some smooth scrolling or some other animation when you navigate to the links
Ivan
@gonzalezi2
Jul 18 2016 17:45
Well I also tried to include it inside of parseQuote but similar results. And I get a Uncaught TypeError: Cannot read property 'attr' of null error
vínαч puppαl
@vinaypuppal
Jul 18 2016 17:46
@gonzalezi2 can u share your pen, so we can debug
Patrick Walters
@patwalt
Jul 18 2016 17:48
Thanks, @vinaypuppal! I really appreciate it.
CamperBot
@camperbot
Jul 18 2016 17:48
patwalt sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 420 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Jul 18 2016 17:58
@gonzalezi2 u cant access #tweet-button as it is replaced by iframe by twitter script u loaded, i found this on googling http://stackoverflow.com/questions/10486354/dynamically-change-tweet-button-data-text-contents and working example http://jsfiddle.net/chris27/DQw5b/4/

@gonzalezi2 you can follow above solution or create a custom tweet button u r self and use this as href

@gonzalezi2 or like 'https://twitter.com/intent/tweet?text=' + data.quoteText + ' Author: ' + data.quoteAuthor +' @gonzalezi2 ';

vínαч puppαl
@vinaypuppal
Jul 18 2016 18:03
or this 'http://twitter.com/share?text=' + encodeURIComponent(randomQuoteText) + ' ' + 'By ' + encodeURIComponent(randomQuoteTextBy)@gonzalezi2
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:05
help guys, https://utkarshbhimte.github.io/DevMash-backup/ This is a page I made, the bug is when I fill the form the keyboard slide up and the page scrolls to another section by itself
CamperBot
@camperbot
Jul 18 2016 18:05
no wiki entry for: guys httpsutkarshbhimtegithubiodevmash-backup this is a page i made the bug is when i fill the form the keyboard slide up and the page scrolls to another section by itself
Ivan
@gonzalezi2
Jul 18 2016 18:05
Oh ok I didn't realize twitter loaded an iframe. I'll take a look at those examples. Thanks @vinaypuppal
CamperBot
@camperbot
Jul 18 2016 18:05
gonzalezi2 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Ivan
@gonzalezi2
Jul 18 2016 18:05
if i have any more problems I'll be back
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:05
Guys Help, https://utkarshbhimte.github.io/DevMash-backup/ This is a page I made, the bug is when I fill the form the keyboard slide up and the page scrolls to another section by itself
tatendamar
@tatendamar
Jul 18 2016 18:06
Hello world
CamperBot
@camperbot
Jul 18 2016 18:06

welcome to FreeCodeCamp @tatendamar!

vínαч puppαl
@vinaypuppal
Jul 18 2016 18:12
@Utkarshbhimte i dont know what causing that problem, as there are many experienced programmers online in https://gitter.im/FreeCodeCamp/HelpJavaScript chat room ask it there someone might help u... :smile:
Sorin Ruse
@sorinr
Jul 18 2016 18:15
@Utkarshbhimte i don't see preventing form submission
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:16
that happens if you open this in mobile, when keyboard appears, it scroll itself. That is interupting the User Experience
Sorin Ruse
@sorinr
Jul 18 2016 18:21
@Utkarshbhimte i've seen on the console this warning: Scrollify warning: Section names can't match IDs on the page - this will cause the browser to anchor.
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:26
i dont know what that means @sorinr ?
but I disabled Scrollify, still this is happenening.
Sorin Ruse
@sorinr
Jul 18 2016 18:29
@Utkarshbhimte i have no idea for the moment. as soon as my phone will recharge a little i'll try to see the effect you said
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:29
@sorinr thanks in advance
CamperBot
@camperbot
Jul 18 2016 18:29
utkarshbhimte sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 499 | @sorinr |http://www.freecodecamp.com/sorinr
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:30
It is a important project
Sorin Ruse
@sorinr
Jul 18 2016 18:31
@Utkarshbhimte if i can find a solution i'll let you know. btw on what mobile platforms did you noticed that behavior?
James Rezendes
@JamieRez
Jul 18 2016 18:33

Hi, Im working on a personal project of mine, and I'm having some trouble with jquery. I want the user to be able to click an element, and then a function is called, and the user can't click again until the function is finished. It looks like it should work, but I don't know if I'm going the right way about it. Here's my code

  $('.myEle').click(function(){
    $(this).unbind('click');
    myFunct( var1 , var2 , function(){
      console.log('This shows up');
      $(this).bind('click');
    });
  });

The console logs, but clicking the element again doesn't call the function anymore, as the element still has the click unbinded. What's wrong here?

Sean DiSanti
@badc0ded
Jul 18 2016 18:34
an easier way to do that is with a toggle
rather than binding and unbinding
for example:
an easy way would be just to throw a data variable on the element to use to toggle...
Aleksandar B.
@aleksandar-b
Jul 18 2016 18:38
@JamieRez $(this).bind('click'); wrong context. this will be whatever object calls callback function. Better to cache it
$('.myEle').click(function(){
var that =  $(this);
   that.unbind('click');
    myFunct( var1 , var2 , function(){
      console.log('This shows up');
      that.bind('click');
    });
  });
Sean DiSanti
@badc0ded
Jul 18 2016 18:38
<div class="myEle" data-working="false"></div>
<script>
$('.myEle').click(function(){
  var working = $('.myEle').data('working');
  if (working) {
//do stuff
}
$('.myEle').data('working', !working);
}
</script>
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:44
android,
Peter Kenward
@PeterKenward
Jul 18 2016 18:44
jQuery.getJSON( url [, data ] [, success ] )
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:45
@sorinr
Sorin Ruse
@sorinr
Jul 18 2016 18:45
@Utkarshbhimte on windows phone its working fine. when you enter an input field and the keybord slide up, the screen slide up just to let visible the field you want to edit. i'll try on android too
Peter Kenward
@PeterKenward
Jul 18 2016 18:46
In the code above, 'getJSON' is a method and (url[,data][,success]) are arguments... jQuery is an object. Do I have that correct please?
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:47
Sure thanks @sorinr
CamperBot
@camperbot
Jul 18 2016 18:47
:warning: utkarshbhimte already gave sorinr points
utkarshbhimte sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Peter Kenward
@PeterKenward
Jul 18 2016 18:48
I am unclear as to which circumstances the 'success' argument doesn't need to be called?
(I suppose I find the jQuery api documentation a little confusing)
James Rezendes
@JamieRez
Jul 18 2016 18:52
@samosale @badc0ded Thanks guys! I did kind of mix of both of your ideas, and it works well now. Basically I added a class 'canclick' to the element, and the function only gets called if that class is there. Using addclass and removeclass seemed to do the trick. Have a nice one guys
CamperBot
@camperbot
Jul 18 2016 18:52
jamierez sends brownie points to @samosale and @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 416 | @badc0ded |http://www.freecodecamp.com/badc0ded
:cookie: 664 | @samosale |http://www.freecodecamp.com/samosale
Sean DiSanti
@badc0ded
Jul 18 2016 18:52
no problem, glad to help
Sorin Ruse
@sorinr
Jul 18 2016 18:56
@Utkarshbhimte on the android phone of my wife looks terrible. even the menu its not visible, not saying that i cannot scroll down and see all form but just a few inputs.
Utkarsh Bhimte
@Utkarshbhimte
Jul 18 2016 18:57
can you send screenshot, I actually I broke my android few days ago and I cant even understand properly what the bug is.
@sorinr
any solutions for that @sorinr
Sorin Ruse
@sorinr
Jul 18 2016 19:01
@Utkarshbhimte just a sec. i'll send you the screenshots
@Utkarshbhimte just pm them to you
maujeri
@maujeri
Jul 18 2016 19:15
Hi
Reetika Sharma
@reetikasahil
Jul 18 2016 19:25
i have completed my tribute test
bt its still der>
?
Marc Vesper
@marcvesper
Jul 18 2016 19:27
hi. on the twitch project, but i'm still really bad at layout/ css. can someone tell me why when i shrink screen size, my search box is no longer centred, and what i should be doing about it?
http://codepen.io/marcvesper/pen/grGGOX?editors=1101
vladmanea99
@vladmanea99
Jul 18 2016 19:28
could somebody help me, I've created a class called font1 in which I change the font size by font-size: 50 px; and when I use it in the <p1> it doesn't work, please help me if you can, thanks
James Rezendes
@JamieRez
Jul 18 2016 19:33
What does your css look like?
@vladmanea99
vladmanea99
@vladmanea99
Jul 18 2016 19:35
uhm I work only in HTML side, I don't use the CSS (sorry I'm new in this kind of stuff)
James Rezendes
@JamieRez
Jul 18 2016 19:35
I see

Then you should do

<p1 style='font-size : 50px'>Your Text</p1>

vladmanea99
@vladmanea99
Jul 18 2016 19:36
let me try it
yes, thank you
Sorin Ruse
@sorinr
Jul 18 2016 19:37
@vladmanea99 p1 its not a tag u mean h1 ?
vladmanea99
@vladmanea99
Jul 18 2016 19:37
I mean p1
a paragraph
@JamieRez thank you alot
CamperBot
@camperbot
Jul 18 2016 19:37
vladmanea99 sends brownie points to @jamierez :sparkles: :thumbsup: :sparkles:
:cookie: 352 | @jamierez |http://www.freecodecamp.com/jamierez
Sorin Ruse
@sorinr
Jul 18 2016 19:37
@vladmanea99 then <p>
James Rezendes
@JamieRez
Jul 18 2016 19:38
@vladmanea99 p1 doesnt make a difference. Just use <p>
vladmanea99
@vladmanea99
Jul 18 2016 19:38
I'm new in HTML I've been studying only C++ for 2 years and I wanted to learn HTML too, well <p1> or<p> it's the same
Promise Tochi
@Promhize
Jul 18 2016 19:40
theres nothing like <p1> in html
vladmanea99
@vladmanea99
Jul 18 2016 19:41
ok
Marc Vesper
@marcvesper
Jul 18 2016 19:41
@vladmanea99 You should have for your css: .font1 {font-size: 50 px;} and you have in your html: <p class="font1">texthere</p>? Or inline, <p style="font-size: 50px;"></p>. <p> tag is not a variable class. That is why there is class="" attribute.
@vladmanea99 like there is only <h1> until <h6>, but you cannot do <h7> (i think)
vladmanea99
@vladmanea99
Jul 18 2016 19:44
hmph, thanks for the information uhm th ething is I don't know ,yet, how to use the CSS window and the HTML window in the same time, I onl yknow how to use the HTML window
Promise Tochi
@Promhize
Jul 18 2016 19:44
Hey guys, i'm working on the random quote machine challenge, i have found an api to generate random qoutes, and i'm successfully getting the quotes with ajax, now i need to setup a twitter button that when clicked will load a prefilled tweet text box with the quote in it. I have checked out the twitter api, but i was wondering if anyone could help me with the steps to take to set it up
vladmanea99
@vladmanea99
Jul 18 2016 19:44
like what you said about using CSS and HTML I don't know i tyet
yet*
Sorin Ruse
@sorinr
Jul 18 2016 19:51
@Promhize i have: $('#tweetme').attr('href', tweet); where tweet = 'https://twitter.com/intent/tweet?text=' + data.quoteText + ' Author: ' + data.quoteAuthor +' @Promhize';
Promise Tochi
@Promhize
Jul 18 2016 19:54
@sorinr thanks alot.
CamperBot
@camperbot
Jul 18 2016 19:54
promhize sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 500 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 18 2016 19:55
@Promhize welcome
Promise Tochi
@Promhize
Jul 18 2016 20:00
@marcvesper try something like this
form {
   white-space: nowrap;
}

form * {
   display: inline-block;

}
@marcvesper unless you want to add media queries to deal with mobile devices, using viewport widths below 50, would almost always look ridiculous on smaller screens, so use something like
input.search {
   width: 70%;
   max-width: 30em;
}

.search-button {
   width: 30%;
}
Marc Vesper
@marcvesper
Jul 18 2016 20:05
@Promhize thanks man, i'll test stuff out :)
CamperBot
@camperbot
Jul 18 2016 20:05
marcvesper sends brownie points to @promhize :sparkles: :thumbsup: :sparkles:
:cookie: 17 | @promhize |http://www.freecodecamp.com/promhize
Promise Tochi
@Promhize
Jul 18 2016 20:06
@marcvesper also put a max-width on the search-button icon, this handles larger displays
Dervish427
@Dervish427
Jul 18 2016 20:08

Hello. I am working on the Tribute Page challenge. When I try to center my LIs in my UL, the text can be centered but I am unable to center the bullet points and then justify the text. Any help would be appreciated.

http://codepen.io/wier1dr/pen/RRxpJN.html

Randy Goldsmith
@Dueldrawer8
Jul 18 2016 20:08
i have a question.. when viewing some of the projects i created on my iphone.. why is it that when you scroll down the whole page seems to swing from side to side.. in another words it doesnt seem contained?
ive noticed this with other websites also
Promise Tochi
@Promhize
Jul 18 2016 20:10
@Dueldrawer8 some elements have a width larger than the phone's screen width, most accurately the viewport width
Randy Goldsmith
@Dueldrawer8
Jul 18 2016 20:10
is there a way to fix it?
http://codepen.io/duel_drawer8/pen/wGpmGe
for example looks great no matter what i resize it to..nice and responsive but when i go on my actual phone it looks good but seems to "wobble"
Promise Tochi
@Promhize
Jul 18 2016 20:16
@Dueldrawer8 best way is to find the element or elements that have the large width. You can also try setting
body {
    width: 100vw; or width: 100%;    
    overflow: hidden;
}

 /* this will work on pages without a visible scrollbar, most mobile browsers, display a little scrollbar over the pages content, so it should work on mobile*/
/* also check another mobile phone or browser */
@Dueldrawer8 if you find that you cant scroll after setting, overflow: hidden on the body, try overflow-x: hidden;
Randy Goldsmith
@Dueldrawer8
Jul 18 2016 20:26
@Promhize alright, thanks. I did research a little and i have seen the overflow: hidden solution.. but it seems to be a temporary fix.
CamperBot
@camperbot
Jul 18 2016 20:26
dueldrawer8 sends brownie points to @promhize :sparkles: :thumbsup: :sparkles:
:cookie: 18 | @promhize |http://www.freecodecamp.com/promhize
Randy Goldsmith
@Dueldrawer8
Jul 18 2016 20:28
darn..in IE my bootstrap button is a lot bigger than in chrome/safarie
Promise Tochi
@Promhize
Jul 18 2016 20:31
@Dueldrawer8 yes, it is a temporary fix, and could hide some of your content
I'm not sure why I'm getting an error: "Unexpected end of input" from codepen?
Also not sure why I''m not getting a JSON array in the 'The quote goes here' section on clicking the quote button?
Tyler Moeller
@TylerMoeller
Jul 18 2016 20:44
@PeterKenward Add a closing bracket } at line 19. I didn't notice a JSON Array, just a single quote.
Peter Kenward
@PeterKenward
Jul 18 2016 20:46
The closing bracket helps... now I'm getting the same quote each time I click... (I think)...
At line 9, the url argument is set to get a random quote...
PeterKenward @PeterKenward scratches his head...
Chris Rutherford
@cjrutherford
Jul 18 2016 20:48
Soo.... working on the Calculator app and this is what I have. I don't remember how to go about getting the operation bar to work just yet....
http://codepen.io/christopherrutherford/pen/kXZovo
Tyler Moeller
@TylerMoeller
Jul 18 2016 20:50
@PeterKenward I haven't used that API, but from first glance, the issue is this in your URL: [posts_per_page]=1. Change that to 20, generate a random number, and access a random quote from the 20 returned to display to the page.
Payton Jewell
@paytonjewell
Jul 18 2016 20:51
Hey guys I have a quick question. I'm doing an independent project on Codepen just to play around and see what I can do-- can anyone tell me how to import fonts that I have downloaded onto my computer? It's easy enough to use google fonts because they have the import code right there but I want to use some of the ones I've found around the internet that don't come with import codes
Peter Kenward
@PeterKenward
Jul 18 2016 20:51
I see what you mean. @TylerMoeller
Payton Jewell
@paytonjewell
Jul 18 2016 20:51
I've tried googling it and I'm having trouble figuring it out
codercooooder
@codercooooder
Jul 18 2016 20:52
thanks for your help @iAmNawa and @Kalcode
CamperBot
@camperbot
Jul 18 2016 20:52
codercooooder sends brownie points to @iamnawa and @kalcode :sparkles: :thumbsup: :sparkles:
:cookie: 350 | @kalcode |http://www.freecodecamp.com/kalcode
:cookie: 577 | @iamnawa |http://www.freecodecamp.com/iamnawa
Chris Rutherford
@cjrutherford
Jul 18 2016 20:53
@lettiebear you don't, you just define the fonts in your CSS and if they're installed on the system that's viewing the page, they'll render properly, otherwise the browser will use the fallback fonts you define in CSS. If you truly want to use a specific font, host it, then import it like you would google fonts.
Payton Jewell
@paytonjewell
Jul 18 2016 20:53
@cjrutherford okay awesome thanks!
CamperBot
@camperbot
Jul 18 2016 20:53
lettiebear sends brownie points to @cjrutherford :sparkles: :thumbsup: :sparkles:
:cookie: 296 | @cjrutherford |http://www.freecodecamp.com/cjrutherford
Chris Rutherford
@cjrutherford
Jul 18 2016 20:54
help brownie points
CamperBot
@camperbot
Jul 18 2016 20:54

:point_right: brownie points [wiki]

Brownie Points

The number beside your picture on Free Code Camp tells you how many Brownie Points you have.

A user profile picture next to a with Brownie Points score

There are two ways you can get Brownie Points:

  1. Complete challenges - you get one point per challenge you complete
  2. Help other campers in chat - each time you help another camper and they thank you (by typing "thanks @yourname"), you will get a point

Brownie Points help you look like the kind of person who codes a lot, shares relevant links, and helps people.

They also add to your Streak.

:pencil: read more about brownie points on the FCC Wiki

Tyler Moeller
@TylerMoeller
Jul 18 2016 20:55

@cjrutherford One easy way is to give a class, calc-button, to each button and id that corresponds to the button's value.

<a class="btn btn-primary calc-button" id="7">7</a>

Then do this with jQuery:

$('.calc-button').click(function () {
  $('#opbar').val($('#opbar').val() + $(this).text())
})
Chris Rutherford
@cjrutherford
Jul 18 2016 20:59
@TylerMoeller Hmm, I will have to try that out. So then it goes to a JQuery thingamabob?
Baumo
@Baumo
Jul 18 2016 21:00
Hello Guys, I need some help with the Random Quote Generator. IF I click the button, a random quote appears, but i cannot get a second quote :/ any ideas? http://codepen.io/Baumo/pen/VjQbBj?editors=1100
Tyler Moeller
@TylerMoeller
Jul 18 2016 21:00
@cjrutherford It will add the number to your input bar. You can get the current value of the input bar with: $('#opbar').val()
@Baumo Your URL only asks for 1 quote: [posts_per_page]=1. Change that to a higher number and you'll get a JSON object with more quotes in it. You can then insert a random number in place of the [0] in $(".quote").html(a[0].content);
Baumo
@Baumo
Jul 18 2016 21:04
thanks @TylerMoeller I'll try that
CamperBot
@camperbot
Jul 18 2016 21:04
baumo sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 676 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Chris Rutherford
@cjrutherford
Jul 18 2016 21:04
@TylerMoeller that works! thanks!
CamperBot
@camperbot
Jul 18 2016 21:04
cjrutherford sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 677 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jul 18 2016 21:04
Glad to help!
Evan
@EvanDCP
Jul 18 2016 21:07
hi guys
I'm currently doing the project about building my own portfolio and I need help building it, it's such a difficult task! I've already started it but I need some answers and suggestions...
could anyone take a look or something, work with me for a while?
Peter Kenward
@PeterKenward
Jul 18 2016 21:10
Thanks @TylerMoeller . Your pointer was helpful :)
CamperBot
@camperbot
Jul 18 2016 21:10
peterkenward sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 678 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
faraz
@silentarrowz
Jul 18 2016 21:18
my styling breaks up when I reduce browser size - can anyone tell me why this happens??
Notice the eElectronics and the cart button at the top and see how they kind of mess up when screen size is reduced.
here's the link - http://codepen.io/silentarrowz/pen/KrQNRB
Peter Kenward
@PeterKenward
Jul 18 2016 21:28
This message was deleted
Line 19 is the line.
Xavier Velez
@JonSnow08
Jul 18 2016 21:38
$(document).ready(function(){

  $('#submitButton').click(function(){
    var search = document.getElementById('#search').val();
    var resultObj =  $.get("https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=" + search + '&format=json');
   // $('#search').val("")
    });
  $("#submitButton").click(function(){
    $("search").submit(); 

  });
  console.log(resultObj);
});
getting this error in console
"jQuery.Deferred exception: resultObj is not defined" "ReferenceError: resultObj is not defined
at HTMLDocument.<anonymous> (pen.js:78:17)
at j (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29588)
at k (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29902)" undefined
Chris Rutherford
@cjrutherford
Jul 18 2016 21:46
@TylerMoeller , so I have it working correctly and I've wired up the "=" button so that when it's clicked, it starts to get together all the data, I'm just trying to figure out how to go about actually processing the calculations. I was thinking to determine the actual operation use a switch for each of the types of operations, and then have a default case to parse the digits as integers, but I guess I would also need a "previous" and "current" variable to keep the digits in so that I can pass them to a function that carries out the operation? sound about right?
Xavier Velez
@JonSnow08
Jul 18 2016 21:51
=/ these intermediate front end dev projects have stopped me in my tracks. I get like one done a month lmfao
Chris Rutherford
@cjrutherford
Jul 18 2016 21:52
@JonSnow08 Don't feel bad, they slowed me down a bit too, it's the api calls that you're not used to... :smile: You'll get it :wink:
dhuddleston
@dhuddleston
Jul 18 2016 21:52
@JonSnow08 @cjrutherford I think after you get the first API project down, the rest of them get easier. :)
Tyler Moeller
@TylerMoeller
Jul 18 2016 21:55
@cjrutherford Personally, I used the eval() function in my calculator project. You should be able to do $('#opbar').val(eval($('#opbar').val())) to add/subtract/multiply everything together and put the answer in your opbar. Some people here may have better ideas - eval() has a bad reputation security-wise, but for this project, it seemed fine for my purposes. For example: eval(1+2+3*4) = 15
Payton Jewell
@paytonjewell
Jul 18 2016 22:03
Okay so I'm just dicking around trying to make a website prototype for my dad's company and this is the homepage (no links or anything have been included yet and this is a very very very rough draft) and I tried to make everything mobile responsive but the images of the cars are TINY on mobile :( How do I make them not shrink so much? I can't figure out what I'm doing wrong.
Daniel
@DanielSusser
Jul 18 2016 22:05
Hello! I'm trying to get on with the wikipedia checker project and having some trouble. Anyone able to give me a hand?
greg
@wearenotgroot
Jul 18 2016 22:08
@lettiebear have you tried using media queries or try setting min value for their dimensions?
Payton Jewell
@paytonjewell
Jul 18 2016 22:09
I didn't think to do that, still very much a beginner haha but I will definitely look into that thank you @wearenotgroot
CamperBot
@camperbot
Jul 18 2016 22:09
lettiebear sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1233 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Jul 18 2016 22:10
@DanielSusser what kind of trouble?
Chris Rutherford
@cjrutherford
Jul 18 2016 22:11
@TylerMoeller hmm... I was unaware of the eval method! does it work with the whole string? and order of operations?
Tyler Moeller
@TylerMoeller
Jul 18 2016 22:13
@cjrutherford Yes. 1+2+3*4 would eval to 15. Note the "Don't use eval needlessly!" in that article from @wearenotgroot. I did not take the time to find any alternatives and haven't studied alternatives since that project.
MikeBeers
@MikeBeers
Jul 18 2016 22:13
I am looking for help setting up bootstrap collapse nav. I feel like my code looks good. But the button is not working once page is collapsed. Does something need to be added to codepen
Settings?
Any help would be appreciated
Tyler Moeller
@TylerMoeller
Jul 18 2016 22:14
@MikeBeers Move jQuery above bootstrap.js in your codepen settings and it will work for you.
greg
@wearenotgroot
Jul 18 2016 22:14
@MikeBeers add jquery first before anything else in the js settings
MikeBeers
@MikeBeers
Jul 18 2016 22:16
@TylerMoeller @wearenotgroot thanks
CamperBot
@camperbot
Jul 18 2016 22:16
mikebeers sends brownie points to @tylermoeller and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1235 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
:cookie: 679 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Daniel
@DanielSusser
Jul 18 2016 22:16
@wearenotgroot I'm getting this error when I try to call the API "//print the contents of the input field
"
greg
@wearenotgroot
Jul 18 2016 22:16
@DanielSusser link your pen?
@wearenotgroot I'm just trying to get the api data using ajax but get an error in the console
greg
@wearenotgroot
Jul 18 2016 22:21
@DanielSusser do something like
var t = $('#inputBox').val(); // to get the value from input field
Xavier Velez
@JonSnow08
Jul 18 2016 22:22
if i use a tutorial video for one of the ziplines, is that technically cheating? or will I learn by doing just the same, maybe even better?
Daniel
@DanielSusser
Jul 18 2016 22:22
@wearenotgroot will that make the api call work?
greg
@wearenotgroot
Jul 18 2016 22:23
@DanielSusser and on your ajax use jsonp to bypass the crossorigin issue
dataType:'jsonp',
Chris Rutherford
@cjrutherford
Jul 18 2016 22:23
@TylerMoeller thanks again!
CamperBot
@camperbot
Jul 18 2016 22:23
cjrutherford sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 680 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
greg
@wearenotgroot
Jul 18 2016 22:23
@JonSnow08 no you can use whatever resources you want as long as you write your own code
Daniel
@DanielSusser
Jul 18 2016 22:24
@wearenotgroot thanks, I've tried that but I get this error "Refused to execute script from 'https://en.wikipedia.org/w/api.php?action=query&titles=Main%20Page&prop=rev…allback=&callback=jQuery22406510364460974143_1468880612728&_=1468880612729' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled."
CamperBot
@camperbot
Jul 18 2016 22:24
danielsusser sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1236 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Xavier Velez
@JonSnow08
Jul 18 2016 22:24
@wearenotgroot thanks, so even if it looks similar to what he's doing, i'm still learning by following along by instructions?
CamperBot
@camperbot
Jul 18 2016 22:24
jonsnow08 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1237 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Xavier Velez
@JonSnow08
Jul 18 2016 22:25
I just don't want to take the cheap way out, I'm actually trying to learn lol
greg
@wearenotgroot
Jul 18 2016 22:25
@DanielSusser remove the ?callback on the url
@JonSnow08 it should be fine
greg
@wearenotgroot
Jul 18 2016 22:31
@DanielSusser the url should look like this without the ?callback
url: "https://en.wikipedia.org/w/api.php?action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=json
Daniel
@DanielSusser
Jul 18 2016 22:33
@wearenotgroot thanks Greg, when I do that I still get the MIME error...
CamperBot
@camperbot
Jul 18 2016 22:33
danielsusser sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: danielsusser already gave wearenotgroot points
greg
@wearenotgroot
Jul 18 2016 22:34
@DanielSusser
$('#findArticle').click(function(){
 var $data = "";
  var inputText = $('#inputBox').val(); //use to get input from inputfield(need to be added to the url)
  $.ajax({
   url: "https://en.wikipedia.org/w/api.php?action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=json",
   headers:{'Api-User-Agent': 'Example/1.0'},
   dataType:'jsonp'
 }).done(function(data){console.log(data)});

  $('#article').html("<p>"+$data+"</p>"); //this needs to be inside the callback function on your $.ajax or you can turn off the async
})
MikeBeers
@MikeBeers
Jul 18 2016 22:45
Ok so I got the button to work for my collapsed nav when I use a computer. Why when I try and do it on a phone it does not work?
greg
@wearenotgroot
Jul 18 2016 22:48
@MikeBeers i just check your settings it hasnt change
MikeBeers
@MikeBeers
Jul 18 2016 22:48
I have meta name viewport
Huh?
greg
@wearenotgroot
Jul 18 2016 22:48
@MikeBeers ------>https://code.jquery.com/jquery-2.2.4.min.js should be first
MikeBeers
@MikeBeers
Jul 18 2016 22:48
It's working and I saved it
Cached on your end?????
greg
@wearenotgroot
Jul 18 2016 22:49
@MikeBeers still the same
Daniel
@DanielSusser
Jul 18 2016 22:50
@wearenotgroot cool! What was I getting wrong?
greg
@wearenotgroot
Jul 18 2016 22:51
@DanielSusser it was the ? on the url
Daniel
@DanielSusser
Jul 18 2016 22:56
@wearenotgroot Isn't that always the way... Thanks!
CamperBot
@camperbot
Jul 18 2016 22:56
danielsusser sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: danielsusser already gave wearenotgroot points
greg
@wearenotgroot
Jul 18 2016 22:56
@DanielSusser np
Tyler Moeller
@TylerMoeller
Jul 18 2016 23:09
max77p
@max77p
Jul 18 2016 23:12
anyone have a moment to help me with the twitch app
just a quick question
var twitchArr = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];

for(var i=0; i<twitchArr.length;i++){
$.getJSON('https://api.twitch.tv/kraken/streams/'+ twitchArr[i], function(data) {
  console.log(data);

});
};
instead of doing getjson each time through the for loop, is there way i can get it all at once? or is my way good?
max77p
@max77p
Jul 18 2016 23:24
anyone available?
Andy Becker
@athomasbeck
Jul 18 2016 23:30
@GregatGit beautiful that worked. Thanks, that was driving me crazy
CamperBot
@camperbot
Jul 18 2016 23:30
athomasbeck sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 694 | @gregatgit |http://www.freecodecamp.com/gregatgit
Islam Ibakaev
@dagman
Jul 18 2016 23:39
@max77p Promise.all()
max77p
@max77p
Jul 18 2016 23:39
@dagman ? what is that?
Islam Ibakaev
@dagman
Jul 18 2016 23:39
@max77p google to the rescue
check out my wikiviewer
max77p
@max77p
Jul 18 2016 23:40
@dagman i really prefer to use from what we learned instead of sidetracking
Xavier Velez
@JonSnow08
Jul 18 2016 23:41
btw look up coding tutorials 360 on youtube, the guy is awesome and does some tutorials for ziplines
so if you're stuck check it out
max77p
@max77p
Jul 18 2016 23:41
this seems like a sidetrack and going beyond what we learned lol...i am going to lose track, but thanks for help anyway
Islam Ibakaev
@dagman
Jul 18 2016 23:43
@max77p i am not sure you can do it by just $.getJSON
max77p
@max77p
Jul 18 2016 23:43
@dagman it works, i am just wondering if doing it like this is bad form
Islam Ibakaev
@dagman
Jul 18 2016 23:44
as soon as you learning and don't want sidetracking(as you said) it is quite a good solution
greg
@wearenotgroot
Jul 18 2016 23:45
@max77p it really depends on the api. if it allows you to just send a bunch in one go then.. if not well
max77p
@max77p
Jul 18 2016 23:46
@dagman i will def look at that promise thingy after haha, just don't wanna confuse myself, which i easily do sometimes lol
Islam Ibakaev
@dagman
Jul 18 2016 23:48
@max77p btw you can a bit prettify(if you want) to make it look cleaner
twitchArr.forEach(function(twitch) {
    $.getJSON('https://api.twitch.tv/kraken/streams/'+ twitch, function(data) {
      console.log(data);
    });    
});
max77p
@max77p
Jul 18 2016 23:51
@dagman ahh perfect, thanks!
CamperBot
@camperbot
Jul 18 2016 23:51
max77p sends brownie points to @dagman :sparkles: :thumbsup: :sparkles:
:cookie: 607 | @dagman |http://www.freecodecamp.com/dagman
Jiannine Torres
@jianninetorres
Jul 18 2016 23:52
hi everyone!
Islam Ibakaev
@dagman
Jul 18 2016 23:52
@max77p it still the same just looks nicer and don't require declaring i variable
Jiannine Torres
@jianninetorres
Jul 18 2016 23:53
I'm eager to start the Intermediate Front End projects, but I'm only half way through the Basic Algorithm Scripting challenges. Is it a must that I finish those, or can I jump right in to the projects?
Islam Ibakaev
@dagman
Jul 18 2016 23:53
@max77p if you wanna trigger them in parallel you need to use promises
p.s. i believe they do it in parallel
Gary Siu
@GarySiu
Jul 18 2016 23:56
@jianninetorres The course is self directed. You can do it in any order but ultimately you will need to go back to the challenges if you want to get the certification.
Xavier Velez
@JonSnow08
Jul 18 2016 23:57
@jianninetorres don't be too excited to get to those lmfao I've been working on them for a month
max77p
@max77p
Jul 18 2016 23:57
@dagman in the help chat, another user said you can also get all the streams at once then search through it to find the ones in the array..and said its faster that way
your opinion on that, comparing that method to promises?
Xavier Velez
@JonSnow08
Jul 18 2016 23:57
@jianninetorres honestly don't rush it, you learn much more if you take your time. I'd suggest working through everything at a slower pace
Gary Siu
@GarySiu
Jul 18 2016 23:57
Promises just help to let you know when they’re all finished downloading
Islam Ibakaev
@dagman
Jul 18 2016 23:58
@max77p i don't understood what u said
damn my english...
Jiannine Torres
@jianninetorres
Jul 18 2016 23:58
thanks @GarySiu @JonSnow08, but they can get so tough sometimes
CamperBot
@camperbot
Jul 18 2016 23:58
jianninetorres sends brownie points to @garysiu and @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 137 | @garysiu |http://www.freecodecamp.com/garysiu
:cookie: 282 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Gary Siu
@GarySiu
Jul 18 2016 23:58
Yeah everyone finds promises tough at first
Async in general too
max77p
@max77p
Jul 18 2016 23:59
@dagman someone mentioned that i could just get all streams at once through getjson
@dagman so GET /streams
then search through it to find the ones on my array