These are chat archives for FreeCodeCamp/HelpFrontEnd

28th
Sep 2016
RKZoltan
@RKZoltan
Sep 28 2016 00:19
@vinaypuppal thanks
CamperBot
@camperbot
Sep 28 2016 00:19
rkzoltan sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 586 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
RKZoltan
@RKZoltan
Sep 28 2016 00:23
hello?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:23
its me...
LOL
RKZoltan
@RKZoltan
Sep 28 2016 00:23
could you explain to me the point of a <div> element? ive read this http://www.w3schools.com/tags/tag_div.asp
but still dont understand
ive just done the first project without using them
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:24
div just goes for general content
RKZoltan
@RKZoltan
Sep 28 2016 00:25
what do you mean?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:25
any content inside of a div is displayed as a block
if you apply styles for the div, affects all the content inside of it
RKZoltan
@RKZoltan
Sep 28 2016 00:26
oh so its used to change a lot of things at once?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:26
a div element get used to separate content for the rest
yes
RKZoltan
@RKZoltan
Sep 28 2016 00:26
is that the whole point? to edit a lot of content at once?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:27
not so, but you can
RKZoltan
@RKZoltan
Sep 28 2016 00:27
so then what is the "point"
?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:27
a div element is used to separate content from other content
RKZoltan
@RKZoltan
Sep 28 2016 00:28
whats the point of seperating it if you dont need to? thats what i dont understand
btw thanks @ChinuxParibus
CamperBot
@camperbot
Sep 28 2016 00:28
rkzoltan sends brownie points to @chinuxparibus :sparkles: :thumbsup: :sparkles:
:cookie: 307 | @chinuxparibus |http://www.freecodecamp.com/chinuxparibus
Arturs Vasiljevs
@vasiljevs
Sep 28 2016 00:28
How do you send brownie points?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:28
well, lo, let's say that you want to make a division from your content
RKZoltan
@RKZoltan
Sep 28 2016 00:28
just say thanks and click on someones name
to tag them
try me
Arturs Vasiljevs
@vasiljevs
Sep 28 2016 00:29
@RKZoltan thanks
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:29
just say thanks and tag the person with @
CamperBot
@camperbot
Sep 28 2016 00:29
vasiljevs sends brownie points to @rkzoltan :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @rkzoltan |http://www.freecodecamp.com/rkzoltan
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:29
:yum:
RKZoltan
@RKZoltan
Sep 28 2016 00:29
ty
Arturs Vasiljevs
@vasiljevs
Sep 28 2016 00:29
brownie exchange pls @RKZoltan :D
RKZoltan
@RKZoltan
Sep 28 2016 00:29
not fair
Arturs Vasiljevs
@vasiljevs
Sep 28 2016 00:29
ayy lizard detected
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:30
As i said, @RKZoltan you need two columns (one goes from text and the other goes for a vertical navigation bar)
you need to separate the content
RKZoltan
@RKZoltan
Sep 28 2016 00:31
but its already seperate

<style>
.blue-text {
color: blue;
font-size: 60px;
}
.red-text {
color: red;
font-size: 35px;
}
.thick-red-border {
color: red;
border-width: 10px;
border-style: solid;
border radius: 50%;
}
</style>

<h1 class="blue-text text-center">Bill Gates</h1>

<h2 class="red-text text-center">The Founder of Microsoft</h2>

<center><img class="thick-red-border" src="http://media.new.mensxp.com/media/content/2016/Sep/image-2-1473505464.jpg" alt="Bill Gates" align="middle"></center>

<ol>
<li>1955: William Henry Gates III is born to attorney William Henry Gates II and Mary Gates, a schoolteacher, University of Washington regent and chairwoman of United Way International. He is raised in Seattle.</li>
<li>1967: Gates is enrolled in the Lakeside School, an exclusive private school in Seattle, where he befriends Paul Allen. The two students share an interest in computers and programming. The school notices his knack for technology and asks him to create a computerized schedule of classes.Gates’ 2005 keynote speech at Lakeside School.</li>
<li>1973: Gates enters Harvard as a pre-law major, but soon shifts focus. He quickly runs through the university’s most rigorous mathematics and graduate level computer science courses.</li>
<li>1975: From his dorm room, Gates calls MITS, the maker of the world’s first personal computer. He offers to develop software for the MITS Altair. MITS eventually accepts and buys his language for $3,000 plus royalties. Gates takes his first leave of absence from school to start working on the software venture he refers to as Micro-Soft. </li>
<li>1976: Gates and Allen register the trademark “Microsoft.” Gates writes an open letter to computer hobbyists, condemning the early adopters for sharing, rather than paying for, software. Gates’ “Open Letter.”</li>
<li>1977: Gates takes a second leave of absence from Harvard and sets up Microsoft in Albuquerque, N.M., where MITS is headquartered.</li>
<li>1978: Microsoft’s year-end sales exceed $1 million. Gates gains a reputation for being tough, but focused. </li>
<li>1979: Microsoft headquarters are relocated to Bellevue, Wash., a suburb of Gates’ hometown, Seattle.</li>
<li>1981: Microsoft incorporates and buys the rights to the operating system “DOS” from Seattle Computer Products. The system is modified and renamed MS-DOS, and the company licenses it to IBM for the company’s new personal computer.</li>
<li>1983: Allen leaves Microsoft after developing Hodgkin’s disease. Microsoft announces Windows as an extension of its MS-DOS operating system.</li>
<li>1986: Microsoft headquarters move again, this time to nearby Redmond, Wash. Shortly after, the company goes public.</li>
<li>1987: At age 31, Gates becomes the youngest billionaire ever. He meets his future wife, Melinda French, at a Microsoft event in New York.</li>
<li>1989: Gates founds Corbis, an archive of art and photography from public and private collections. Corbis later becomes one of the largest collections of visual information in the world.</li>
<li>1990: The Federal Trade Commission begins an investigation into possible collusion between IBM and Microsoft.The FTC charges that IBM and Microsoft collaborated to divvy up the market for operating systems in an anticompetitive way, with IBM’s OS/2 capturing the high-end of the market and Microsoft’s Windows covering the low-end of the market.</li>
<li>1994: Gates weds French; the couple goes on to have three children. The Gateses consolidate their charitable giving under the William H. Gates Foundation, named for Gates’ father, who agrees to manage the foundation. It is later absorbed into the Bill & Melinda Gates Foundation.</li>
<li>1995: In July, at age 39 and with a fortune of $12.9 billion, Gates becomes the world’s richest man. Later that summer, Microsoft introduces Internet Explorer to the world, as part of Windows 95. The Road Ahead, Gates’ book about his vision for the digital future, holds the No. 1 spot on The New York Times best-seller list f

see
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:31
in one section you can say: <div class="vertical-bar">Navigation elements</div> and the other say: <div class="main-content">content</div>
by default, all on your page is inline, not separated at all...
I see
RKZoltan
@RKZoltan
Sep 28 2016 00:33
so its like using a list instead of it all flowing together unseperated like with <p>
it seperates it?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:34
p is different
but yeah, it separates it
RKZoltan
@RKZoltan
Sep 28 2016 00:34
alright that sort of makes sense
christocarr
@christocarr
Sep 28 2016 00:36
Does anyone know if I should include a css reset if I'm using bootstrap?
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:37
@RKZoltan there are 3 kinds of elements on HTML: inline elements, block elements and inline-block elements
the inline elements goes for everything that includes text content such as <p>, <span> or h1
vínαч puppαl
@vinaypuppal
Sep 28 2016 00:39
@christocarr no need as bootstrap already includes normalize.css for you see here http://getbootstrap.com/dist/css/bootstrap.css
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:39
the block element goes for everything that includes mor complex content such as div ul or section
the inline-block element goes for everything that includes specific styles for media elements or nested things like: img or li, or even an a element
christocarr
@christocarr
Sep 28 2016 00:40
@vinaypuppal :+1:
RKZoltan
@RKZoltan
Sep 28 2016 00:41
ty
btw
Repent for the kingdom of heaven is at hand. Believe the gospel of Jesus Christ.
vínαч puppαl
@vinaypuppal
Sep 28 2016 00:42
This message was deleted
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:42
Amen @christocarr God Bless you :)
RKZoltan
@RKZoltan
Sep 28 2016 00:45

Revelation 14:11
And the smoke of their torment ascendeth up for ever and ever: and they have no rest day nor night, who worship the beast and his image, and whosoever receiveth the mark of his name.

If a person receives the Mark of the Beast, which is a microchip implant or an electronic tattoo, or worships the beast, which is the Roman Catholic Church, or the image of the beast, which is the church-state union that will be formed in the United States, when religious laws are enacted or enforced, then they will be tormented forever in a Lake of Fire.

The worshipping of the beast and image of the beast will take place in churches on both Saturday and Sunday. Do not be deceived into thinking that the worship of the beast and image of the beast will take place only on Sunday.
in churches around the world people will worship the beast and image of the beast
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:47
In Vatican City do so... :pensive:
its time to the real Christ's Church arise again...
vínαч puppαl
@vinaypuppal
Sep 28 2016 00:47
@xFozzy this is correct way to access property glove box inside a object var gloveBoxContents = myStorage.car.inside["glove box"];
RKZoltan
@RKZoltan
Sep 28 2016 00:48

1 Corinthians 1:10King James Version (KJV)

10 Now I beseech you, brethren, by the name of our Lord Jesus Christ, that ye all speak the same thing, and that there be no divisions among you; but that ye be perfectly joined together in the same mind and in the same judgment.

Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:48
Amen :D
RKZoltan
@RKZoltan
Sep 28 2016 00:48
IS THE FOLLOWING JUST CSS??
style>
.blue-text {
color: blue;
font-size: 60px;
}
.red-text {
color: red;
font-size: 35px;
}
.thick-red-border {
color: red;
border-width: 10px;
border-style: solid;
border radius: 50%;
}
can this be cut and pasted from html into css and still work???
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:49
yes
but not the tag
don't copy the <style> tag
JD Tadlock
@jdtdesigns
Sep 28 2016 00:49
@RKZoltan just leave off the <style></style>
RKZoltan
@RKZoltan
Sep 28 2016 00:49
ty
@jdtdesigns thanks
CamperBot
@camperbot
Sep 28 2016 00:50
rkzoltan sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 611 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
RKZoltan
@RKZoltan
Sep 28 2016 00:55
what do these do?:
<div class="row">
<div class="col-xs-12">
nevermind. goodnight world.
Jhony Alberto Grillet Medina
@ChinuxParibus
Sep 28 2016 00:56
jejejejejeee
good night
Rachel Reinheimer
@glgirl28
Sep 28 2016 01:06
I can't get my background-image photo to work on codepen. Any suggestions?http://codepen.io/glgirl28/pen/XKNBZX
vínαч puppαl
@vinaypuppal
Sep 28 2016 01:09
@glgirl28 You cant use that google drive image URL as its not public URL, Failed to load resource: the server responded with a status of 403 ()Upload that image to dropbox or flickr and use the URL generated by these services they will work without any issues
Rachel Reinheimer
@glgirl28
Sep 28 2016 01:10
Thank you @vinaypuppal ! Will do!
CamperBot
@camperbot
Sep 28 2016 01:10
glgirl28 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 587 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Igor Amidzic
@igoramidzic
Sep 28 2016 01:40
Anybody know how to fix my menu so when you shrink the page the links won't move down?
Or in other words, fix the links where they are and not move no matter what
http://codepen.io/amidzicigor/pen/ozwzaQ
Monesul Haque
@mones-cse
Sep 28 2016 01:42
hi friends this is my pomodoro clock project still need to add something
but already there is a lot of code in js section.
is there any way i can narrow it down?
any suggestion highly appreciable
http://codepen.io/m1s/pen/EgXgVX?editors=0010
JD Tadlock
@jdtdesigns
Sep 28 2016 01:47
@amidzicigor I changed some html and css. You shouldn't use fixed widths when you're trying to style responsive sites. Flexbox is great for aligning content and creating fluid grids and is now supported in all browsers. ;) http://codepen.io/jdtadlock/pen/qajaLJ?editors=0100
@mones-cse One quick thing is to write your .on() click events like this instead:
$("#resumeBtn").on('click', resume);
Igor Amidzic
@igoramidzic
Sep 28 2016 01:50
@jdtdesigns Thank you very much :)
CamperBot
@camperbot
Sep 28 2016 01:50
amidzicigor sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 612 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 28 2016 01:51
you don't need to open an anonymous function to call a function ;) @mones-cse
JD Tadlock
@jdtdesigns
Sep 28 2016 01:56
@mones-cse Another tip is to use jQuery to gather element groups and setup a function that handles the event when one of the items in the group is clicked instead of setting an event for each item individually.
<!-- You might have some html like this with buttons inside a parent wrapper -->
<div class="buttons">
  <button id="one">Button One</button>
  <button id="two">Button Two</button>
</div>
// You can create a group like this
var buttons = $('.buttons').find('button');

// Then you can create a function to handle the click on any of the buttons
buttons.on('click', handler);

function handler() {
 var btn = $(this); // refers to the current clicked button

  // do somethin with the button
}
Monesul Haque
@mones-cse
Sep 28 2016 01:59
@jdtdesigns thanks for the hint will try to apply the changes :)
CamperBot
@camperbot
Sep 28 2016 01:59
mones-cse sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 613 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Christopher Lavine
@Christopher37
Sep 28 2016 02:21
hey guys i'm stuck on the converting Fahrenheit to Celsius challenge and i am stuck on how to start a solution
Jeremy
@jem243
Sep 28 2016 02:27
Hello. I'm up to the Simon Project challenge and I normally just plug thru and finally figure out my answers. ......... Christopher there is some really great youtube videos that walk you thru some of the challenges I believe the Fahrenheit to Celsius is one... just do a google search and you will find it.
For me... I've spent now a month on this... and I'm stuck.
I need someone who can look at my code a bit. ? Is that possible here? or do I just need to keep plugging away?
Mostly everything seemed to work... but I added another virtual button and my start button and realized my lights and buttons were all tied together.... I think its a variable to reference issue.
cameron nicklaus
@camnicklaus
Sep 28 2016 02:29
@Christopher37 what've you got so far?
elsayedbilal
@elsayedbilal
Sep 28 2016 02:30
hey guys! i finished my first tribute page project but it was a bit bland and boring so i made another one and wanted to share it with you guys. let me know what you think. its nothing special but i just wanted to share it because im just proud that i made it from scratch
Daniel Cleveland
@dpcleveland
Sep 28 2016 02:36
Hey guys. I'm working on the Show The Local Weather project, and I'm stumped. Here's my CodePen: http://codepen.io/dpcleveland/pen/KgapaE I'm really close, but for some reason when I click on the temperature to toggle between F and C, it won't swap. The weird part is that I see the temp show up for a split second in C, but then it goes back to F. Can anyone help?
Florencia
@flopywood
Sep 28 2016 02:38
Hello, everyone! Can anyone help me with the position of one of my elements? Here's my code http://codepen.io/flopy_dv/pen/kkwbBp?editors=1010
JD Tadlock
@jdtdesigns
Sep 28 2016 02:43
@dpcleveland You're setting the click from inside the ajax call. You should create some global vars and set them when the ajax is called, then create a click event separately from the ajax.
Jeremy
@jem243
Sep 28 2016 02:44
Daniel.. I'm not much help, you use more jQuery then javascript. I'm not as familiar with the "cute" jQuery short cuts... the only little thing I see is your RETURN within a IF ELSE code. if your in the IF you won't get to the ELSE... so you don't need that I think... and or you may need one within your ELSE too. I can post a link to my answer if it helps? but your code is way shorter with JQuery then mine is with javascript.
Daniel Cleveland
@dpcleveland
Sep 28 2016 02:46
@jdtdesigns okay totally makes sense. Was kind of thinking that but wasn't sure. Thanks so much! Will get to refactoring :D
CamperBot
@camperbot
Sep 28 2016 02:46
:cookie: 614 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
dpcleveland sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
Daniel Cleveland
@dpcleveland
Sep 28 2016 02:48
@jem243 Thanks! Yeah, I should probably rewrite the whole think in plain JavaScript just to make sure I know how. I don't think I want to look at a solution right now, but I'd definitely like to look after I'm done if you want to share the link
CamperBot
@camperbot
Sep 28 2016 02:48
dpcleveland sends brownie points to @jem243 :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @jem243 |http://www.freecodecamp.com/jem243
Jeremy
@jem243
Sep 28 2016 02:54
I've been watching this room for a few minutes. Up until now I've done all things on my own. But I'm really stuck. I've spent all of september working and reworking SIMON. Key issues I'm having at this point is 1) since I can't use assets (i.e. graphics in pen) without buying a pro version. I have to create or DRAW them. I had the game working except I need to create and add a little timer into the game to create a PAUSE between the computer playing out the repeats. BUT then I went and added a START button, and then the STRICT mode button and at that point I realized my last DOT and my two buttons are colliding. (I think its a reference VAR issue...) but I'm not sure. I reread "Building JAVASCRIPT games by Arjan Eggs" and thought maybe "prototypes" was the way to go. I went and changed my Canvas Code to that and completely crashed everything. So I've reset everything back to normal OBJECTS. So I'm dealing again with just my last DOT and my two BUTTONS coming back with the same color. Which is not what my code says. Here's my CodePEN link if anyone out there has any idea's or suggestions and advanced thankyou for taking the time and looking at it. http://codepen.io/jem243/pen/LRVyyY?editors=0011
Monesul Haque
@mones-cse
Sep 28 2016 02:55

@dpcleveland
think this way you are going to use $.getJSON only to get data os this will be one function
and changing temperature is another functionality so you can make it another function

right now your changing function inside getjson so when you try to use that click event it converted celsius to fahrenheit but after immediate you get data again from api and rerun the whole thing

Jeremy
@jem243
Sep 28 2016 02:56
Daniel here is my codepen link for weather. https://codepen.io/jem243/pen/oLOVaz
I'm frustrated programming in codepens... As ASSETS are a pain if you don's spring for the PRO plan. I'm at the point in my SIMON... to jump back and program everything in ATOM and then cut and paste things when they work.... But I've been hesitant up to this point that things will work outside of CODEPEN and not within CODEPEN.... so I've always done the projects within the CODEPEN enviorment and had to deal with ASSET linking to various others work out there on the net.
Daniel Cleveland
@dpcleveland
Sep 28 2016 03:00
@mones-cse Gotcha. Yeah that totally makes sense. Will split the input / output functions apart - should have done that from the start. Yeah, now I see that it sets the temp originally, then the click changes it but then it overwrites itself because of the original setting earlier in the function.
@mones-cse Thanks!
CamperBot
@camperbot
Sep 28 2016 03:00
dpcleveland sends brownie points to @mones-cse :sparkles: :thumbsup: :sparkles:
:cookie: 411 | @mones-cse |http://www.freecodecamp.com/mones-cse
Jeremy
@jem243
Sep 28 2016 03:17
I guess I need to post my question in baby steps and/or there is no one out there that can help me on the last SIMON project? My current most puzzling issue is that I have to DRAW everything manually (i.e. make graphics by code, not by importing SPRITE.) So I have 4 colored DOTS and I had everything working just fine (with the exception of a TIMING issue of WAITING between LIGHTING my DOTs.. ) So I decided to work on the START and STRICT MODE buttons... and now my YELLOW Dot turns to the light blue START button and the STRICT MODE button turns also light blue and erases over my START text...
It feels like its a REFERENCE VAR issue? Anyone out there can help? http://codepen.io/jem243/pen/LRVyyY?editors=0011
JD Tadlock
@jdtdesigns
Sep 28 2016 03:21
@dpcleveland Here's a simple way to create a switch using global vars. Using a boolean that toggles false/true is a great way to create many switch cases in your apps. ;) http://jsbin.com/cijato/edit?js,console,output
Jeremy
@jem243
Sep 28 2016 03:21
After two weeks dealing with this issues... I feel like giving up.... I only once asked for help here and Hai Hu was very helpful back then. Since I'm stuck I'll at least stick around the room and help others on the lower projects... :( I feel so alone searching for a MENTOR.
JD Tadlock
@jdtdesigns
Sep 28 2016 03:23
@jem243 I'll check it out. ;)
Calveeen
@Calveeen
Sep 28 2016 03:24
hey is anyone having trouble with codepen
Jeremy
@jem243
Sep 28 2016 03:24
Thank you. Very much in advance.
Calveeen
@Calveeen
Sep 28 2016 03:24
my text isn't centering
Jeremy
@jem243
Sep 28 2016 03:24
I've had to refresh code pen on occation, to solve that issue.
Calveeen
@Calveeen
Sep 28 2016 03:24
yeah i've refreshed many times
blah
it's not moving any texts at all
even using margins
JD Tadlock
@jdtdesigns
Sep 28 2016 03:25
@Calveeen sounds like a css issue
not codepen
Jeremy
@jem243
Sep 28 2016 03:25
sometimes I've left codepen and reloaded. If your referring to the 3 windows above... if your referring to your results yes that might be in your CSS or HTML code.
Calveeen
@Calveeen
Sep 28 2016 03:25
oh i'll check my settings on it
JD Tadlock
@jdtdesigns
Sep 28 2016 03:26
@jem243 The first thing i'm noticing is you're using canvas to create the board and shapes. This can be done much easier just using css.
Jeremy
@jem243
Sep 28 2016 03:26
oh if you use Bootstrap for a project you have to manually add it each and everytime to get the results.
Calveeen
@Calveeen
Sep 28 2016 03:29
ahh yeah i see it
i didnt add bootstrap haha
Jeremy
@jem243
Sep 28 2016 03:29
Hmm... I've thought of that... I'm more of a programmer then a graphic person and I got to thinking that this last week that maybe I need more CSS drawing experience. Normally I would have DRAW pics in GIMP or such and then imported the SPRITES and patterns... but in CODEPEN without a PRO version this isn't possible. I guess I'll start reading more on FANCY CSS options.
JD Tadlock
@jdtdesigns
Sep 28 2016 03:30
@jem243 You don't need images for anything more than photography these days. Css can do pretty much anything else. This is my simon built with only css. http://codepen.io/jdtadlock/full/EyVbOM/
Jeremy
@jem243
Sep 28 2016 03:31
I had even trouble adding the actual SOUND to the ALARM clock. To the point I gave up and just had to add a TEXT as the sound. But with the references to SIMON sounds I plan to go back and add one of the SOUNDS as the Alarm. I'll look at your code now. Thank you JD.
JD Tadlock
@jdtdesigns
Sep 28 2016 03:33
@jem243 You're welcome. ;)
Daniel Cleveland
@dpcleveland
Sep 28 2016 03:46
@jdtdesigns Wow, that's super helpful and seems so simple now that I look at it. Thanks :D
CamperBot
@camperbot
Sep 28 2016 03:46
dpcleveland sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 615 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
luis4flames
@luis4flames
Sep 28 2016 03:49
This message was deleted
JD Tadlock
@jdtdesigns
Sep 28 2016 03:50
@dpcleveland Welcome :D
Evan W
@Dirtier
Sep 28 2016 03:50
Need a font wizard out there to judge this for me
http://codepen.io/Dirtier/pen/zKzArW
luis4flames
@luis4flames
Sep 28 2016 03:52
@Dirtier Your tweet button opens two tabs
Evan W
@Dirtier
Sep 28 2016 03:52
O.o It doesnt for me
luis4flames
@luis4flames
Sep 28 2016 03:53
lol must be firefox
JD Tadlock
@jdtdesigns
Sep 28 2016 03:54
@luis4flames You need to adjust your margins for the box as they are causing the box to overflow outside the body. Also, you need to adjust the margins for the tweet and quote buttons. They are overlapping. Look up offsets in the bootstrap grid to center columns. ;)
@Dirtier Looks nice! The tweet button works fine for me too.
luis4flames
@luis4flames
Sep 28 2016 03:56
@jdtdesigns AHH youre right, thanks!
CamperBot
@camperbot
Sep 28 2016 03:56
luis4flames sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 616 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:01
/*twitch tv*/
var channels = ["freecodecamp", "storbeck", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff","brunofin","comster404","test_channel","cretetion","sheevergaming","TR7K","OgamingSC2","ESL_SC2"];
$(document).ready(function(){

  /*here the for loop for i is kept outside the function to understand reason http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example*/
for(i=0;i<channels.length;i++){

  getData(i);
  }
/*funnction get data*/
function getData(i){
  $.getJSON('https://api.twitch.tv/kraken/streams/'+channels[i]+'?client_id=bfcvgu5jg6gsft824hzc3a7qgay19gb&callback=?', function(data) {
    screenOut(data,i);
});
}
/*function outputs to screen*/
function screenOut(data,i){
  if(data.status == 404){
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = 'http://i.vimeocdn.com/video/499134794_1280x720.jpg' class = 'img-responsive' ><div class = 'status'>NOT_FOUND</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }
  else if(data.stream == null){
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = 'http://i.vimeocdn.com/video/499134794_1280x720.jpg' class = 'img-responsive' ><div class = 'status'>OFF-LINE</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }else{
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = '"+data.stream.channel.video_banner+"' class = 'img-responsive' ><div class = 'status'>LIVE</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }
}
});
why can't I apply mouse hover effect on .holder elements
Evan W
@Dirtier
Sep 28 2016 04:04
@jdtdesigns Thanks :P I'm just not too sure about the fonts. I played with I shit you not 20 different fonts and finally landed on these
CamperBot
@camperbot
Sep 28 2016 04:04
dirtier sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 617 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 28 2016 04:10
@durgakiran can you post your codepen?
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:10
JD Tadlock
@jdtdesigns
Sep 28 2016 04:13
@durgakiran I don't see any css or js regarding hover in your code. You can simply add this to your css:
.holder:hover {
  background-color: blue;
}
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:15
@jdtdesigns i tried using .hover and .on inside jquery to alter the holder html but didinot work
JD Tadlock
@jdtdesigns
Sep 28 2016 04:16
@durgakiran Probably didn't work due to the order in which you set .hover(). You'd need to set the event after the html was created, otherwise it wouldn't exist on the page yet and the event wouldn't work. ;)
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:17
can you tell now why it is not working
JD Tadlock
@jdtdesigns
Sep 28 2016 04:20
@durgakiran It's because the html is not created yet. The data is being received asynchronously so it won't exist on the page instantly. The hover event is called immediately so the html isn't there yet.
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:20
Is there a way i can achieve this through jquery
@jdtdesigns
JD Tadlock
@jdtdesigns
Sep 28 2016 04:25
@durgakiran Change your hover event to this and it should work:
$('.holder').on('mouseenter', function(){
    $(this).find('.status').fadeOut();
});
you had $(this) written as $('this')
which won't work ;)
Wasn't an async issue after all.
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:30
@jdtdesigns did it work for you
JD Tadlock
@jdtdesigns
Sep 28 2016 04:31
@durgakiran You need to change the way you wrote the .on() as well. Remove the object callback and write it like i did above.
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:33
@jdtdesigns just copy pated but still did not work
JD Tadlock
@jdtdesigns
Sep 28 2016 04:33
@durgakiran Your .on() line is placed wrong. You need to move it inside the function
function screenOut(data,i){
  if(data.status == 404){
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = 'http://i.vimeocdn.com/video/499134794_1280x720.jpg' class = 'img-responsive' ><div class = 'status'>NOT_FOUND</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }
  else if(data.stream == null){
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = 'http://i.vimeocdn.com/video/499134794_1280x720.jpg' class = 'img-responsive' ><div class = 'status'>OFF-LINE</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }else{
    $('.data').append("<div class = 'col-lg-3 col-md-3 col-sm-4 col-xs-6 holder'><img src = '"+data.stream.channel.video_banner+"' class = 'img-responsive' ><div class = 'status'>LIVE</div><div class= 'img-text'>"+channels[i]+"</div></div>");
  }
  $('.holder').on('mouseenter', function(){
      $(this).find('.status').fadeOut();
  });
}
Palakurthi Durga Kiran Kumar
@durgakiran
Sep 28 2016 04:36
@jdtdesigns thanks it worked stuck here for almost for 2 hrs
CamperBot
@camperbot
Sep 28 2016 04:36
durgakiran sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 618 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 28 2016 04:38
@durgakiran I know the feeling. :D
Pradnya Joshi
@pradxj07
Sep 28 2016 05:17
@amidzicigor , have you already tried using position: fixed in the css for #menu ?
Santiago Fernandez
@sf-jd
Sep 28 2016 05:45
hay guis
Akshata Mohanty
@akshatamohanty
Sep 28 2016 06:06
I'm working on the Local Weather project. I'm trying to use the OpenWeatherMap API but it's not letting me load data from there saying it's an insecure endpoint :/. Can't use https with OpenWeatherMap since that's a pro version feature. Can't change to a non secure origin since HTML5 Geolocation only works on secure contexts. Any ideas how to work around this other than shifting from OpenWeatherMap?
kirbyedy
@kirbyedy
Sep 28 2016 06:13
@akshatamohanty you can cheat with crossorigin.me or change the api
William Maes
@maeswilliam
Sep 28 2016 06:31
Responsive layout i made with flexbox -> http://williammaes.tk/Projects/Flexbox1/index.html
Akshata Mohanty
@akshatamohanty
Sep 28 2016 06:46
@kirbyedy Thanks! I ended up using this - http://ipinfo.io but the cheat is a nice idea! .. will definitely be useful!
CamperBot
@camperbot
Sep 28 2016 06:46
akshatamohanty sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1416 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Pradnya Joshi
@pradxj07
Sep 28 2016 07:22
@kirbyedy , @akshatamohanty I used jquery.getJSON to access the openweather api and used callback function to get output from the response. - ```jQuery.getJSON("http://api.openweathermap.org/data/2.5/weather?appid=xyz&lat="+loc.latitude+"&lon=" + loc.longitude + "&units=metric",fnSuccess(weather))
.done()
.fail(function(e1) {
showError(e1.statusText + " - " + "Error getting weather. Please try again later.");
console.log(e1);
});
Alex Rapley
@arapl3y
Sep 28 2016 08:02
@maeswilliam cool! (Y)
William Maes
@maeswilliam
Sep 28 2016 08:13
@arapl3y ^^ - your social icons aren't linking on your webiste ;)
Amit Patel
@AmitP88
Sep 28 2016 10:07
hey guys, so I tested my new site https://amitp88.github.io/New-Portfolio/#intro using chrome dev tools and it looks fine on there. However, on my desktop screen at work, the paragraphs were spread way too much, the buttons were on top of the text, and the image was too small. I noted the start of this problem to be at 1024px and up to 1280px (possibly higher).
basically I wanna know if my site looks ok on different laptop/desktop screens, as I might have to tweak the media queries (or add new ones) to those
Ashish Acharya
@anarchyrucks
Sep 28 2016 10:40

Where is the sample API response for Twitchtv JSON API Zipline?

Pradnya Joshi
@pradxj07
Sep 28 2016 10:50
@AmitP88 , the contents on the page look spread out but I did not notice any of the issues you mentioned on my laptop.
christopher-siewert
@christopher-siewert
Sep 28 2016 10:57
hello, i am doing the tic tac toe game, and I am unsure why my results function to analyse the board isn't working. It works fine for win or lose, but not for a tie. Can anyone help with my code? I put the board state in a simple array, 0-8 is board from left to right and top to bottom. win states are the values for 3 in a row. http://codepen.io/christophersiewert/pen/BLkwxR
vínαч puppαl
@vinaypuppal
Sep 28 2016 11:05
@AmitP88 you can use http://quirktools.com/screenfly/ which I suggested you before to test on different screen sizes
shreyas23sk
@shreyas23sk
Sep 28 2016 11:19
any idea why this useless piece of code refuses to work?
https://codepen.io/shreyas23-sk/pen/vXxPXd
i am working on the calculator project
ADIL KARMOUZI
@mradil16
Sep 28 2016 13:17
hi guys , hope you're doing well :)
Lusako Njwaba
@lunjwaba1
Sep 28 2016 13:31
Hey @shreyas23sk it seems like all your buttons keep displaying their values. CE & AC should be able to cancel out the events for buttons 1-9. Right now you applying the same event listener logic for all buttons,hence they'll keep displaying the same thing.....
and $("#evaluate").on("click",function(){ you've selected an id which doesn't exist
Adam Lichter
@spot1000
Sep 28 2016 13:44
hi @mradil16 ! Doing pretty good, just plugging away at the simon game project
Michiel
@MichielHuijse
Sep 28 2016 14:28
Hi I am working on a (suposes to be) responsive website. I want to have a two column on desktop view and 1 collumn view on a tablet or phone. The collumns contain of rectangels which need to have a fixed scale. For the mobile view I want them to be aligned in the center however the column is now aligned left. can someone help me center it? Thanks!
http://codepen.io/michiel-huijse/pen/pEwLmo
JD Tadlock
@jdtdesigns
Sep 28 2016 14:29
This message was deleted
@shreyas23sk Here's a starting point. You didn't have a value set for the input div. I changed the input div to an input. This will allow you to set up some logic for the user to be able to type in numbers/symbols as well as use the buttons. The logic for a standard calculator is pretty easy. You can make it advanced though once you get the idea. ;) https://codepen.io/jdtadlock/pen/JRJvPJ?editors=0010
@MichielHuijse First things first, remove all of this from your html:
<!DOCTYPE html>
<!--[if IE 9]>
<html class="lt-ie10" lang="en" >
<![endif]-->
<html class="no-js" lang="en" >
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Coco Studio</title>

  <!-- normalize.css and modernizr.js help with browser compatibility -->
  <link rel="stylesheet" href="css/foundation.css">
  <link rel="stylesheet" href="foundation-icons/foundation-icons.css">

  <link rel="stylesheet" href="css/main.css">
  <link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet">
</head>

<!-- include before </body> tag -->
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation.min.js"></script>
<script>
  $(document).foundation();
</script>
</body>
</html>
you need to set all of that up in Settings.
JD Tadlock
@jdtdesigns
Sep 28 2016 14:35
It's pretty easy to add all the stuff you need. Just go to Settings->CSS and Settings->JS and use the quick add drop down. It has most of the standard libraries ready to go. For others you can just start typing in the input boxes and it will pop up.
Michiel
@MichielHuijse
Sep 28 2016 14:35
@jdtdesigns yes but when I make the production css file I want it to be in there
JD Tadlock
@jdtdesigns
Sep 28 2016 14:36
@MichielHuijse Codepen will throw errors if you place those tags in the html
Michiel
@MichielHuijse
Sep 28 2016 14:36
@jdtdesigns Ok thanks, this was more or less a copy from a project I am working on in webstorm
CamperBot
@camperbot
Sep 28 2016 14:36
michielhuijse sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 619 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
sfmajors373
@sfmajors373
Sep 28 2016 14:37
Hi! I had asked for help with my Weather App before and someone told me about need for a proxy in order to use the api key the way I was using it. But I still can't get it to work. If anyone has a minute could you look and see if I am missing something else that is making it fail? https://codepen.io/sfmajors/pen/amBrOL
Michiel
@MichielHuijse
Sep 28 2016 14:39
@jdtdesigns so besides that do you know how to make the columns centered on a mobile screen?
JD Tadlock
@jdtdesigns
Sep 28 2016 14:42
@MichielHuijse I'm noticing you're not wrapping your columns in rows. This is required for the columns to work right:
<div class="row">
  <div class="large-6 columns"></div>
  <div class="large-6 columns"></div>
</div>
to center columns you just add the size and centered
large-centered
JD Tadlock
@jdtdesigns
Sep 28 2016 15:11
@sfmajors373 I'm guessing you either copied a lot of code from somewhere else or you're not understanding how html elements and js element calls work. Your getLocation() was not coded correctly to account for chrome. The geolocator will exist on all browsers so using logic that determines if it exists or not will fail. The way you were calling the ajax will also not work. You have to make ajax calls in the order the data needs to be received(location->weather api->show data on html). Lastly you have a ton of stuff that you're calling, but doesn't exist in your code like functions and variables that are declared but never instantiated above. I got it running for you. Hopefully you'll understand it a little more. ;) http://codepen.io/jdtadlock/pen/pEwVdb?editors=0010
also, you can't mix https with http stuff
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:12
I am working on Wikipedia Viewer... I am having trouble starting it... Does anyone know what api address is used to call Wikipedia API? And what would be the JSON format of the call? Your help will be greatly appreciated!
sfmajors373
@sfmajors373
Sep 28 2016 15:13
I am super confused on a lot of this...
@jdtdesigns So, the top api is what chrome requires?
JD Tadlock
@jdtdesigns
Sep 28 2016 15:17
@SanjayAtGit This ajax call will work ;)
// userInput refers to the html input your user is typing into
// you need to get the value before using this ajax call

$.getJSON('http://en.wikipedia.org/w/api.php?action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=extracts&exintro&explaintext&exsentences=1&exlimit=max&format=json&callback=?&gsrsearch=' + userInput, function(data) {
      if ( data.query ) { 
         // We have results
        } else {
          // No results
        }
});
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:17
@jdtdesigns where do you get the address from?
JD Tadlock
@jdtdesigns
Sep 28 2016 15:18
@SanjayAtGit a couple hours of research when i did the wikipedia challenge :P
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:19
That's great! Is it on the wiki site that is given in the FCC challenge at wiki(https://www.mediawiki.org/wiki/API:Main_page)
@jdtdesigns I couldn't find it there!!!
JD Tadlock
@jdtdesigns
Sep 28 2016 15:20
@sfmajors373 Chrome will only allow you to use the navigator if the user runs the site from https. Since most users will load codepen through http, this will fail. So I just use an ip locator for chrome and navigator for others. ;)
@SanjayAtGit It took me awhile to figure it out. I looked at the example and read the api docs.
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:21
Thanks @jdtdesigns
CamperBot
@camperbot
Sep 28 2016 15:21
sanjayatgit sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 620 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:24
@jdtdesigns What would be the JSON format? How do I figure that out?
sfmajors373
@sfmajors373
Sep 28 2016 15:25
@jdtdesigns Ok, I get that now. Thank you very much for your help!!! :)
CamperBot
@camperbot
Sep 28 2016 15:25
sfmajors373 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 621 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 28 2016 15:28
@SanjayAtGit If you mean how to use it, the api url has params you give separated by '&' which you can chain one after the other to get results in the format you want. You just have to look through the params to see what each one does.
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:30
That's great! That's what I wanted to know! Thanks again for you help @jdtdesigns
CamperBot
@camperbot
Sep 28 2016 15:30
sanjayatgit sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: sanjayatgit already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Sep 28 2016 15:30
Codepen requires you return jsonp so that is why you see 'format=json&callback=?' which returns jsonp instead of standard json. @SanjayAtGit
sfmajors373
@sfmajors373
Sep 28 2016 15:30
@jdtdesigns Do you happen to know of any good resources for reading up on ajax and api's and such? Also when it is appropriate to look to switch from JS to JQuery. I feel like I have a few legos, a couple Lincoln logs, and some K'nex and I don't know what to do with any of it.
Sanjay Tailor
@sanjaykt
Sep 28 2016 15:32
That's good to know @jdtdesigns ! Thanks
CamperBot
@camperbot
Sep 28 2016 15:32
sanjayatgit sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: sanjayatgit already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Sep 28 2016 15:32
@sfmajors373 There are literally hundreds of videos on youtube about apis and ajax. I'd start with jQuery. It's one of the few times I will suggest starting with a library instead of vanilla code. jQuery will help you understand the basics of js and also make it much easier to manipulate the DOM.
Wilson Oberholzer
@Wilson-Oberholzer
Sep 28 2016 15:34
@khaduch I made the changes that you suggested and it definitely helped. Everything in the body seems to work great now but my nav-bar unfortunately remains unformatted.
sfmajors373
@sfmajors373
Sep 28 2016 15:34
Awesome. That gives me a place to start trying to disentangle all of this.
John F Kirkpatrick
@jfkirkpatrick
Sep 28 2016 16:08
I am having several issues with the Random Quote Generator Project and would like some help. I decided to include api.forismatic instead of an internal array to quotes. In the javascript, I get "Uncaugt Error: Syntax error, unrecognized expression: http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=parseQuote" I also need help with external css and external js files. Thx John
http://codepen.io/jfkirkpatrick/pen/VKYawZ
Himad Mouhtar
@hmouhtar
Sep 28 2016 16:16
@jfkirkpatrick Hi John! did you try with another API?
RKZoltan
@RKZoltan
Sep 28 2016 16:16
what does <div class="container"> mean?
what does <div class="jumbotron"> mean?
what does <div class="row"> mean?
what does <div class="col-xs-12"> mean?
BTW repent for the kingdom of heaven is at hand. Believe the gospel of Jesus Christ
JD Tadlock
@jdtdesigns
Sep 28 2016 16:22
@jfkirkpatrick You had quite a few errors. First you don't include the html/head/title/body tags in the html on codepen. All of those things are added through Settings which I see you did. Also, you can't link to an external stylesheet from your computer or somewhere else. Your css is placed in the css panel, which I see you did lol. The js had some errors with the api url and the way you formatted the api call. Hope this helps. ;) http://codepen.io/jdtadlock/pen/RGgBpg?editors=0010
@RKZoltan It'd be helpful for you to read the Bootstrap docs. ;)
or look up some videos of Bootstrap on youtube
David Darius
@DavidDarius
Sep 28 2016 16:54
why didnt appear anything when i click on the button ? https://codepen.io/DavidDarius/pen/LRybrN
Tyler Moeller
@TylerMoeller
Sep 28 2016 16:57
@DavidDarius Your rand variable is not returning whole numbers. Change rand = Math.random() * 6; to rand = Math.floor(Math.random() * 6);
John F Kirkpatrick
@jfkirkpatrick
Sep 28 2016 17:04
@hmouhtar No so I may just go back to the internal array Thx for your suggestion
CamperBot
@camperbot
Sep 28 2016 17:04
jfkirkpatrick sends brownie points to @hmouhtar :sparkles: :thumbsup: :sparkles:
:cookie: 337 | @hmouhtar |http://www.freecodecamp.com/hmouhtar
Tyler Moeller
@TylerMoeller
Sep 28 2016 17:05
@DavidDarius In your HTML, create an empty div where you want to see the quote <div id="quote"></div> and in your JS, change all $("body").html(.....) to $("#quote").html(....)
Sorin Ruse
@sorinr
Sep 28 2016 17:10
@DavidDarius salut. i would create a quotes array and using recommendations of @TylerMoeller i would get the quotes[rand] and display it in its own div
John F Kirkpatrick
@jfkirkpatrick
Sep 28 2016 17:14
@jdtdesigns JD thank you for your suggestions and I am looking at them now. Will get back to you. John
CamperBot
@camperbot
Sep 28 2016 17:14
jfkirkpatrick sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 622 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
nabinsademba
@nabinsademba
Sep 28 2016 17:23
hey anyone done with portfolio page??
Istvan Kokuti
@zaturek
Sep 28 2016 17:36
Hi guys! What is the url of the redirecting page we use on codepen? I've forgot that...
Sorin Ruse
@sorinr
Sep 28 2016 17:40
@zaturek do u mean target="_blank" ?
Istvan Kokuti
@zaturek
Sep 28 2016 17:44
@sorinr No. I meant there is an url I could put at the beginning to my url as a redirecting thing
MMDF
@MMDF
Sep 28 2016 17:45
is anyone online that can help me with my layout
Sorin Ruse
@sorinr
Sep 28 2016 17:46
@zaturek do u talk about crossorigin.me ? if not plz be more explicit and give an example where do u need that "redirect"
Istvan Kokuti
@zaturek
Sep 28 2016 17:46
@sorinr YES! Thank you!!! :)
CamperBot
@camperbot
Sep 28 2016 17:46
:cookie: 735 | @sorinr |http://www.freecodecamp.com/sorinr
zaturek sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
MMDF
@MMDF
Sep 28 2016 17:47
can anybody tell me why my cards arent layedinline
in section2
Istvan Kokuti
@zaturek
Sep 28 2016 17:48
And I need some more help, cos the link I've build for wikipedia browser works perfectly if I copy it to the address bar, but my .getJSON doesn't give me back the same and good result. http://codepen.io/zaturek/pen/wzdGrZ?editors=1011
Sorin Ruse
@sorinr
Sep 28 2016 17:52
@zaturek change the order of loading js libs in pen settings like: 1.jquery 2.jqueryui3.bootstrap
Istvan Kokuti
@zaturek
Sep 28 2016 17:54
@sorinr Are you kidding me? :D I have to check it... sec
@sorinr Nothing changed
luis4flames
@luis4flames
Sep 28 2016 17:55
Cant figure out how to put my tweet and new quote button to get place next to eachother and still have it be responsive with screen size, any suggestions?
http://codepen.io/luis4flames/pen/jrNqrR
Istvan Kokuti
@zaturek
Sep 28 2016 17:56
@sorinr this is my result:
@luis4flames First you have to use a "main" div with class="container-fluid"
then you have to put each element in rows.
That means a new div with class="row"

than in the row you can put a div for each button like:

<div id="tweet-btn" class="col-sm-4">
<button></button>
</div>

and you have to fill the rest of course
luis4flames
@luis4flames
Sep 28 2016 18:00
Okay I see, thanks! @zaturek
CamperBot
@camperbot
Sep 28 2016 18:00
luis4flames sends brownie points to @zaturek :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @zaturek |http://www.freecodecamp.com/zaturek
Sorin Ruse
@sorinr
Sep 28 2016 18:05
@zaturek and here is mine wiki
John F Kirkpatrick
@jfkirkpatrick
Sep 28 2016 18:06
@jdtdesigns JD Absolutely, beautiful. Thx for all the assistance. John
CamperBot
@camperbot
Sep 28 2016 18:06
jfkirkpatrick sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: jfkirkpatrick already gave jdtdesigns points
Istvan Kokuti
@zaturek
Sep 28 2016 18:06
@sorinr you've linked my site :)
Sorin Ruse
@sorinr
Sep 28 2016 18:07
@zaturek just forked it and changed in the pen settings the order of loading js scripts. thats all
@zaturek i was not kidding you when saying the order of loading external libs is important.
Tyler Moeller
@TylerMoeller
Sep 28 2016 18:10

@zaturek I'm getting data back in the console just fine with your pen. As @sorinr recommends, change the order of your script loading to stop this warning from showing up in the console: bootstrap.min.js:6 Uncaught Error: Bootstrap's JavaScript requires jQuery, or remove bootstrap.min.js entirely from your pen since you aren't using it in your code.

If you want article content instead of just the titles, replace the title= at the end of your url with &list=search&srsearch=.
https://en.wikipedia.org/w/api.php?action=query&format=json&callback=?&prop=links&pllimit=max&list=search&srsearch="

Sorin Ruse
@sorinr
Sep 28 2016 18:15
@TylerMoeller :+1:
Istvan Kokuti
@zaturek
Sep 28 2016 18:15
@sorinr , @TylerMoeller I don't know why, maybe cos I'm in work and the network settings or something else don't let it happened. But even with your fork, I don't get the right data. Whaterver I'm doing. I deleted the bootstrap from my js settings. But still...
lukearthwalker
@lukearthwalker
Sep 28 2016 18:16
guys why isnt dropdown working on codepen.io? i did all the steps correctly but it isnt working
Tyler Moeller
@TylerMoeller
Sep 28 2016 18:17
@zaturek You can try from a phone perhaps - a different network to verify? Your pen is returning a JSON object for me just fine.
Sorin Ruse
@sorinr
Sep 28 2016 18:17
@zaturek do you get any feedback from js if you just write a console.log("Hello") ?
Istvan Kokuti
@zaturek
Sep 28 2016 18:19
@sorinr I do...
@TylerMoeller I'll try it from home I guess...
@sorinr , @TylerMoeller Thanks guys!
CamperBot
@camperbot
Sep 28 2016 18:20
:cookie: 855 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
:warning: zaturek already gave sorinr points
zaturek sends brownie points to @sorinr and @tylermoeller :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Sep 28 2016 18:23
@zaturek it may be a problem with your work network restrictions. i don't know. imagine we cannot reproduce your environment :)
Istvan Kokuti
@zaturek
Sep 28 2016 18:29
@sorinr yes... exactly :D I'll try it from home
lukearthwalker
@lukearthwalker
Sep 28 2016 18:35
guys on a navbar active <li> how can i change the color under it?
Sorin Ruse
@sorinr
Sep 28 2016 18:37
@lukearthwalker background-color: #your_hex !important to override the bootstrap default.
lukearthwalker
@lukearthwalker
Sep 28 2016 18:38
oh ok so its that easy thanks!
but it doesn't change the color under it only the "top" one
Sorin Ruse
@sorinr
Sep 28 2016 18:39
@lukearthwalker its important to get the right css selector :)
@lukearthwalker ciao. can you post the pen link if you have it on codepen?
there
Sorin Ruse
@sorinr
Sep 28 2016 18:47
@lukearthwalker guarda qui: page
@lukearthwalker this is what u want?
lukearthwalker
@lukearthwalker
Sep 28 2016 18:48
yeah thanks
what the hell is that btw?
Sorin Ruse
@sorinr
Sep 28 2016 18:49
what?
lukearthwalker
@lukearthwalker
Sep 28 2016 18:49
that background stuff navbar-default .navbar-nav>.active>a{
background-color: #99ffff !important; this
Sorin Ruse
@sorinr
Sep 28 2016 18:52
its for identifying your element and class coz by id as you wrote it no chance:) "id=name " probably you wanted id="name" and then just replace all that navbar.... bla bla bla with #name :)
lukearthwalker
@lukearthwalker
Sep 28 2016 19:11
oh ok
Dylan
@dhcodes
Sep 28 2016 19:48
This message was deleted
Daniel
@DanielStoica85
Sep 28 2016 20:05
I was working on my portfolio project challenge and after a certain point, I wasn't able to scroll in my page and I don't understand why...I did not modify anything. Also, the links don't work anymore, something is strange...this is the project: http://codepen.io/DanielStoica/pen/RGgWzB
vínαч puppαl
@vinaypuppal
Sep 28 2016 20:06

@DanielStoica85 on line 3 in HTML panel you have this

<im<nav class = "navbar navbar-default navbar-fixed-top">

remove <im it will work

Daniel
@DanielStoica85
Sep 28 2016 20:08
now the whole page is messed up...wtf?!?
everything was working just fine...
vínαч puppαl
@vinaypuppal
Sep 28 2016 20:09

now the whole page is messed up...wtf?!?

@DanielStoica85 did you remove <im this?? i still see it

Daniel
@DanielStoica85
Sep 28 2016 20:10
I did
vínαч puppαl
@vinaypuppal
Sep 28 2016 20:10
yeah after removing that i will work @DanielStoica85
Daniel
@DanielStoica85
Sep 28 2016 20:11
it does, but now the whole page looks messed up
@vinaypuppal nevermind, I fixed it, thanks!
CamperBot
@camperbot
Sep 28 2016 20:12
:cookie: 588 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
danielstoica85 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
vínαч puppαl
@vinaypuppal
Sep 28 2016 20:12
@DanielStoica85 okay :smile:
Islam Ibakaev
@dagman
Sep 28 2016 20:18
i was thinking about function let call it calculate that takes a string like this 5+5 or 5*5 and returns expected result. And i came to this fucntion. What do you think about it. Can you make it more elegant?
const calculate = (expression) => {
  const re = /[-+/*]/;

  const o = {
    addition: (a, b) => a + b,
    subtraction: (a, b) => a - b,
    multiplication: (a, b) => a * b,
    division: (a, b) => a / b
  };
  let output = expression.split(re).map(n => Number(n));

  switch(true) {
      case expression.includes('+'): {
          return output.reduce(o.addition);
      }
      case expression.includes('-'): {
          return output.reduce(o.subtraction);
      }
      case expression.includes('*'): {
          return output.reduce(o.multiplication);
      }
      case expression.includes('/'): {
          return output.reduce(o.division);
      }
  }
};
calculate("5+5"); //  10
calculate("5-5"); //  0
calculate("5*5");// 25
calculate("5/5");// 1
JD Tadlock
@jdtdesigns
Sep 28 2016 20:58
@dagman
const calculate = (e) => {
  const nums = e.split(/\W/g).map(n => Number(n)), 
        op = e.match(/\W/g);

  return op == '+' ? nums[0] + nums[1] : 
         op == '-' ? nums[0] - nums[1] :
         op == '/' ? nums[0] / nums[1] :
         nums[0] * nums[1];
}
calculate('11*11')
vínαч puppαl
@vinaypuppal
Sep 28 2016 21:05
@jdtdesigns One doubt /\W/g this does not cover calculate('11.1*11') i think
JD Tadlock
@jdtdesigns
Sep 28 2016 21:12
@dagman, @vinaypuppal
const calculate = (e) => {
  const nums = e.split(/[^.\w]/g).map(n => Number(n)), 
        op = e.match(/\W/g);

  return op == '+' ? nums[0] + nums[1] : 
         op == '-' ? nums[0] - nums[1] :
         op == '/' ? nums[0] / nums[1] :
         nums[0] * nums[1];
}
console.log(calculate('11.1*11'))
works with this ;)
vínαч puppαl
@vinaypuppal
Sep 28 2016 21:14
@jdtdesigns :smile: thanks
CamperBot
@camperbot
Sep 28 2016 21:14
vinaypuppal sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 623 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Tyler Moeller
@TylerMoeller
Sep 28 2016 21:21
@jdtdesigns @dagman Not sure what the ultimate goal/requirement is, but neither solution works with negative numbers. Order of operations isn't working either (e.g. 35-5*5=10)
JD Tadlock
@jdtdesigns
Sep 28 2016 21:22
@TylerMoeller It's not meant to be a solution for multiple operators ;)
wnbaorbust
@wnbaorbust
Sep 28 2016 21:24
Thanks @sorinr
CamperBot
@camperbot
Sep 28 2016 21:24
wnbaorbust sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 736 | @sorinr |http://www.freecodecamp.com/sorinr
nabinsademba
@nabinsademba
Sep 28 2016 21:38
guys please check my portfolio http://codepen.io/nabins13/pen/vXmPGJ
Tyler Moeller
@TylerMoeller
Sep 28 2016 21:42
@nabins13 Is this a template? It looks like you have used a lot of code that is the same as this pen: http://codepen.io/jbgolatkar/pen/ZpZVNr?editors=1010
vínαч puppαl
@vinaypuppal
Sep 28 2016 21:42
This message was deleted
nabinsademba
@nabinsademba
Sep 28 2016 21:47
yes i did refered this pen
i liked it though
Tyler Moeller
@TylerMoeller
Sep 28 2016 21:48
@nabins13 Be sure to attribute the original author of the code: https://www.freecodecamp.com/academic-honesty
nabinsademba
@nabinsademba
Sep 28 2016 21:48
m planning to change it after i learn a lil bit more of other things
Tyler Moeller
@TylerMoeller
Sep 28 2016 21:49
Sounds good, I like the design too
nabinsademba
@nabinsademba
Sep 28 2016 21:49
where should i mention him??
Tyler Moeller
@TylerMoeller
Sep 28 2016 21:49
Usually people put it in the footer of the website and perhaps in code comments as well
nabinsademba
@nabinsademba
Sep 28 2016 21:50
okey ill do that
hey @TylerMoeller here it is http://codepen.io/nabins13/pen/vXmPGJ
check this out is this how we mention the author
??
mnghm
@mnghm
Sep 28 2016 22:07
Hey guys, long time no see.. struggling with JS Objects, particularly checking if a property exists or not. Any clues are appreciated
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:09
@nghm use obj.hasOwnProperty(prop) for checking if a prop exists or not in obj object
mnghm
@mnghm
Sep 28 2016 22:10
@vinaypuppal I know, that’s all I have down so far haha
d wilder
@alhazen1
Sep 28 2016 22:13
@nghm got a snippet or codepen?
mnghm
@mnghm
Sep 28 2016 22:14
@alhazen1 right
Screen Shot 2016-09-28 at 23.14.35.png
Islam Ibakaev
@dagman
Sep 28 2016 22:16
@jdtdesigns calculate("5 + 5"); returns 0
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:16
@nghm obj.hasOwnProperty(prop) returns Boolean value i.e either true or false So use if condition to check for that
mnghm
@mnghm
Sep 28 2016 22:18
@vinaypuppal Ok thanks Vinay
CamperBot
@camperbot
Sep 28 2016 22:18
nghm sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 589 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:18
@dagman @jdtdesigns hey it works check here http://jsbin.com/bikitak/5/edit?html,js,console,output
@dagman And is it for calculator Project ??
Islam Ibakaev
@dagman
Sep 28 2016 22:20
@vinaypuppal i am not saying about "5+5" i were saying about "5 + 5"
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:21
@dagman oh okay space, his Regex doesn't look for spaces
d wilder
@alhazen1
Sep 28 2016 22:21
@nghm .hasOwnProperty will return true or false so you need to use that as a test to see if that property exists and act accordingly.
MDN is your best friend in all things javascript
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:23
@dagman if its for calculator Project then you can use JS built in function eval('5 + 5')
mnghm
@mnghm
Sep 28 2016 22:23
@alhazen1 thanks for the help, will have a read!
CamperBot
@camperbot
Sep 28 2016 22:23
nghm sends brownie points to @alhazen1 :sparkles: :thumbsup: :sparkles:
:cookie: 382 | @alhazen1 |http://www.freecodecamp.com/alhazen1
Islam Ibakaev
@dagman
Sep 28 2016 22:23
@vinaypuppal yep i know
Evan W
@Dirtier
Sep 28 2016 22:23
Anyone have any idea why this works in my browser on my computer but not on my phone? http://codepen.io/Dirtier/full/zKzArW/
When I open it in Chrome on my iPhone the button to get a new quote doesn't work
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:26
@Dirtier its working in my Android Chrome Browser.
Evan W
@Dirtier
Sep 28 2016 22:26
The 'Quote Me' button works?
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:26
@Dirtier yes
Evan W
@Dirtier
Sep 28 2016 22:26
Hmm weird
Anyone out there with an iPhone willing to test it? Maybe it's just my phone
@vinaypuppal thanks for looking at it
CamperBot
@camperbot
Sep 28 2016 22:27
dirtier sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 590 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:27
@Dirtier np :smile:
@Dirtier You can debug by connecting your phone to PC/laptop and in PC/laptop chrome browser open chrome://inspect/ and see in console if any errors
d wilder
@alhazen1
Sep 28 2016 22:32
@Dirtier in dev tools I'm seeing this error message Uncaught SyntaxError: Unexpected token =
about this line
const getQuote = 
    (data = { cat: 'famous' }) =>
Tyler Moeller
@TylerMoeller
Sep 28 2016 22:34
@Dirtier The quote button works fine for me on Safari and Chrome. iPhone 6, iOS 10.
@nabins13 You may want to talk to the author, there is just too much similarity in the code IMO and I'm a bit paranoid about this stuff.
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:37
@TylerMoeller @Dirtier may be the problem is with his Browser version as @alhazen1 showed error message about Fat Arrow Functions which are not supported by that browser
He needs to Transpile code to ES5 version if he to support old browsers
Tyler Moeller
@TylerMoeller
Sep 28 2016 22:38
Hmm, arrow functions seem to be pretty well supported except on IE and Opera Mini: http://caniuse.com/#search=arrow%20functions
cameron nicklaus
@camnicklaus
Sep 28 2016 22:38
http://codepen.io/camnicklaus/full/gwmoxp/ I'm about to turn this in...anyone have any quick comments...I gave up trying to align the temp toggle button...and the page is sluggish...maybe because of the large images. when i come back to it, I'll restructure how they load so I can maybe resize them first or??
Tyler Moeller
@TylerMoeller
Sep 28 2016 22:39
But you're right, maybe older iOS....didn't see that
Ken Haduch
@khaduch
Sep 28 2016 22:39
@Dirtier - it seems to be working fine on my iphone, as well. Popping up new quotes with the "Quote Me' button...
@Dirtier - it does pop up two Twitter tabs, both with the same quote, even on desktop...
Evan W
@Dirtier
Sep 28 2016 22:41
@khaduch It only does that for a few people lol I don't know why
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:42
@khaduch i see only one Twitter share tab open when i click Tweet btn @Dirtier :smile:
Evan W
@Dirtier
Sep 28 2016 22:42
Most people I've asked only get 1 tab. I wonder why that button won't work on my iPhone then. That's so weird
Yea I only get one too. I'm using Chrome
vínαч puppαl
@vinaypuppal
Sep 28 2016 22:43
This message was deleted
Evan W
@Dirtier
Sep 28 2016 22:47
Well thanks for taking a look at it guys, @vinaypuppal @khaduch
CamperBot
@camperbot
Sep 28 2016 22:47
dirtier sends brownie points to @vinaypuppal and @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1733 | @khaduch |http://www.freecodecamp.com/khaduch
:warning: dirtier already gave vinaypuppal points
Islam Ibakaev
@dagman
Sep 28 2016 22:47
@jdtdesigns this works for me either i put 10.5 + 2 or 10.5+2
i have borrowed you epic return stuff :smile:
const calc = (exp) => {
  const re = /[-+/*]/;
  const list = exp.match(/\W/g);
  let nums = exp.split(re).map(n => Number(n));

  return list.includes('+') ? nums[0] + nums[1] : 
         list.includes('-') ? nums[0] - nums[1] :
         list.includes('/') ? nums[0] / nums[1] :
                              nums[0] * nums[1];

};
Lydia Larae
@nevaIsDreaming
Sep 28 2016 23:04
Hi everybody. Can someone here help me spot a problem in a line of code I think is not working?
Flashards
@Flashards
Sep 28 2016 23:07
Hey. Can someone explain me why do I need to put "name" in that input and also what autofucus means?
<input type="text" name="full_name" placeholder="FirstName LastName" autofocus="autofocus" value="">
Salomon
@zarruk
Sep 28 2016 23:11
Hello guys, do you still suggest to complete the Twitchtv json api although the problems that it has lately been presenting?
Ken Haduch
@khaduch
Sep 28 2016 23:12
@nevaIsDreaming - what's the code?
Lydia Larae
@nevaIsDreaming
Sep 28 2016 23:14
weatherImg = "<img src = '" + json.current_observation.icon_url + "' ";
Ken Haduch
@khaduch
Sep 28 2016 23:17
@nevaIsDreaming - do you know that the value of json.current_observation.icon_url is valid? Does it have the http:// or https:// included? A fully-formed path, in other words? Or are they giving you a relative path, perhaps just a jpg file, and you have to supply the other part? Any errors showing up in the console? Can you post a URL to your site?
@Dirtier - I have two tabs pop up - Chrome on windows 10, as well as on the iphone, safari browser... it seems to be consistent for me?
Lydia Larae
@nevaIsDreaming
Sep 28 2016 23:19
I believe that it is a fully formed path. I was using something very similar to that line of code in a previous version of the weather app, but I changed things around to try to include the F/C toggle and now the image is broken, but I can't figure out why. I thought it was that line.
Also, no console errors.
Pranay Kumar
@pranaykumar389
Sep 28 2016 23:24

Hello everyone can anyone help me out with my code below. Here i'm making a list with ul and a tag's as :

<div ng-init="menuLists=['Home','About', 'Contact']" ng-init="anchorList=['home.html', 'about.html', 'contact.html']">
<ul>
<li ng-repeat="x in menuists">
<a href="ng-repeat="x in anchorList">
{{ }}
</a>
</li </ul>
</div>

Ken Haduch
@khaduch
Sep 28 2016 23:27
@nevaIsDreaming - I just added the > in your weatherImg variable that you are constructing weatherImg = "<img src = '" + json.current_observation.icon_url + "' >";
Lydia Larae
@nevaIsDreaming
Sep 28 2016 23:28
Ahhh! I knew it had to be something simple like that, but I just couldn't see it. I made the change and it works. Thanks a bunch! @khaduch
CamperBot
@camperbot
Sep 28 2016 23:28
nevaisdreaming sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1734 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Sep 28 2016 23:33
@nevaIsDreaming - great! You're welcome...
Ken Haduch
@khaduch
Sep 28 2016 23:44
This message was deleted
This message was deleted
This message was deleted
.
.
.
.
.
Salomon
@zarruk
Sep 28 2016 23:59
Help pleas. They are telling me to use Twitchtv's sample api response provided at: https://gist.github.com/QuincyLarson/2ff6892f948d0b7118a99264fd9c1ce8. How do I use such sample? do I just copy paste it?
CamperBot
@camperbot
Sep 28 2016 23:59
no wiki entry for: pleas they are telling me to use twitchtvs sample api response provided at httpsgistgithubcomquincylarson2ff6892f948d0b7118a99264fd9c1ce8 how do i use such sample do i just copy paste it