These are chat archives for FreeCodeCamp/HelpFrontEnd

3rd
Apr 2016
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:00
so do i round inside the ajax or out?
the two keys i have inside the object.. are only specific inside the ajax cal
so I cant use since those are global to that function
if i place those values F and C and declare a variable outside of it.. it wont display the temp
Juwdohr
@Juwdohr
Apr 03 2016 00:04
What's the url for Twitch TV to go to a user
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:04
@sjames1958gm i would use math.round(temp)
Stephen James
@sjames1958gm
Apr 03 2016 00:05
Math.round((data.main.temp - 32) * 5 / 9) + "° C"
C: Math.round((data.main.temp - 32) * 5 / 9) + "° C"
demipixel
@demipixel
Apr 03 2016 00:06
var chatText = document.getElementById('chatText');
  var chatTextContainer = document.getElementById('chatTextContainer');

  var height = chatTextContainer.offsetHeight;
  var scrolled = chatTextContainer.scrollTop;
  var totalHeight = chatText.offsetHeight;
  var move = false;
  console.log(scrolled, totalHeight, height, totalHeight - height);
  if (scrolled > totalHeight - height - 15 || totalHeight - height - 15 < 0) {
    move = true;
  }
  chatText.innerHTML += str;
  setTimeout(function() {
    if (move) chatTextContainer.scrollTop = totalHeight;
  }, 0);
It won't scroll
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:06
@sjames1958gm okay, so when i do that.. my temperature in the html dissapears
Stephen James
@sjames1958gm
Apr 03 2016 00:07
@Dueldrawer8 You need Big M Math.round (you have math.round)
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:07
ahh.. dang it lol.. so i had math.round on what you just showed me just the wrong function haha
Stephen James
@sjames1958gm
Apr 03 2016 00:08
@Jarvis-327 I used https://www.twitch.tv/ + "user"
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:08
@sjames1958gm thanks.. i was wondering why it wouldnt work when it should have
CamperBot
@camperbot
Apr 03 2016 00:08
dueldrawer8 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 411 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
demipixel
@demipixel
Apr 03 2016 00:11
;_;
Stephen James
@sjames1958gm
Apr 03 2016 00:12
@demipixel the new info is off the bottom of the screen?
demipixel
@demipixel
Apr 03 2016 00:13
It won't auto scroll
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:14
@sjames1958gm so i have the .onclick method to act on the ('p) tag... the p tag extends all the way across the page so that whenever i click on the same line as the p tag it changes rather than just on the temperature it changes
@sjames1958gm i don't remember what i need to do to change that.. is that css? or html?
i used the (this) keyword.. so that should refer to the specific temp value
Stephen James
@sjames1958gm
Apr 03 2016 00:17
You will probably have to another element inside of the <p> that covers only the temp and put the click handler on that
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:17
maybe a <span> tag?
Stephen James
@sjames1958gm
Apr 03 2016 00:17
yeah
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:17
cool.. thanks
@sjames1958gm i dont have anything in my p tag
@sjames1958gm i cant span my data-nextTemp value inside of <p class>
Stephen James
@sjames1958gm
Apr 03 2016 00:21
Since you are using bootstrap - you can make your <p> a narrow column in the middle
 <div class="row">
    <div class="col-md-4 col-md-offset-4">
  <p class="text-center data-nextTemp"></p>
    </div>
  </div>
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:22
nvm it works.. if i put

``

<div class="container">
<h1 class="text-center" id="location">Weather App</h1>

<h3 class="text-center cityState" ></h3>
<p class="text-center data-nextTemp"><span></span></p>
</div>
``

Stephen James
@sjames1958gm
Apr 03 2016 00:22
Interesting
Glad you got it
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:22

``<div class="container">
<h1 class="text-center" id="location">Weather App</h1>

<h3 class="text-center cityState" ></h3>
<p class="text-center data-nextTemp"><span></span></p>
</div>
``

dang it.. how do i put code into the black box
Stephen James
@sjames1958gm
Apr 03 2016 00:23
Three ```
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:23
i just changed all the jquery selects from $('p') to $('span')
i understand why it works since i'm selecting only the text inside the span which refers to the temp value..which makes sense correct?
now comes the hard part.. trying to get the background to change whenever the forecast changes
sounds like a bunch of if statements or switch statements
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:30
@sjames1958gm when you look at my weather app does it display your current location?
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:35
@sjames1958gm yep looks good to me
@Dueldrawer8 Sorry meant to direct that at you lol
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:37
@DanJFletcher thanks man! not done but getting there.
CamperBot
@camperbot
Apr 03 2016 00:37
dueldrawer8 sends brownie points to @danjfletcher :sparkles: :thumbsup: :sparkles:
:star: 375 | @danjfletcher | http://www.freecodecamp.com/danjfletcher
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:39
No problem, keep it up!
apklip
@apklip
Apr 03 2016 00:43
FInished my wiki viewer, thanks for the help guys!
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:43
@DanJFletcher are you pursuing a degree online?
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:44
Yeah at University of the People. I use Free Code Camp for fun and just to strengthen some of my skills
Alex Coder
@jkid314159
Apr 03 2016 00:45
HelloWorld!
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:46
@DanJFletcher interesting..have to check it out
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:47
@Dueldrawer8 It's pretty awesome. Been there for 1 year now and so far so good. Here's the link: http://www.uopeople.edu/
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:48
@DanJFletcher its equivalent to a 2-4 year degree at a regular university?
i have only 2 semesters left at my college.. but its in econ and math.. i want to go back for a comp sci degree
Alex Coder
@jkid314159
Apr 03 2016 00:49
I want to mouseover and shake image
A. J. Bozdar
@moajday
Apr 03 2016 00:49
why projects render differently outside FCC and codepen environment? most of the times, CSS is gone.
Alex Coder
@jkid314159
Apr 03 2016 00:49
$("img").mouseover(function(){
.effect(""shake", {times:4}, 1000");
});
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:50
Yeah it is. Only problem though right now, is that you can't transfer any prior credits over - which sucks if you already have a lot. I know a lot of students here that already had their Associates and had to start from scratch. Hard to beat a tuition-free school though lol
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:50
@DanJFletcher yeah for sure.. ill take a look at the curriculum
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:51
@bozdar If the CSS from your codepen projects are missing in other environments; is it because you're not linking your files properly?
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:56
@DanJFletcher so i would have to take all the basic courses all over again?
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:57
Yeah - unfortunately.
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 00:58
@DanJFletcher i wonder how they find internships for its students.. interesting.. dunno if i could do that and my current uni lol
Dan Fletcher
@DanJFletcher
Apr 03 2016 00:59
@jkid314159 check the dot operator on your call to the effect function. What are you calling effect on?
They just launched a new internship program that looks pretty cool, but I haven't really looked into it. Honestly I just look for work constantly on my own, and work on skills outside of what I learn in school to make myself job ready. The degree is just to make me a stronger developer for long term benefits.
I already work as a computing curriculum consultant at Khan Academy, and I'm a programmer at a web development company too
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 01:01
yes.. although i think a web dev could get by and usually there are alot of successfull web devs without a comp sci degree.. just adding it to your arsenal only makes you stronger
very nice
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:01
yeah exactly
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 01:03
@DanJFletcher so if i was to apply.. i obvousily have HS diploma..
Alex Coder
@jkid314159
Apr 03 2016 01:04
@DanJFletcher $("img").mouseover(function(){
$(this).addClass("animated fadeOut");
});
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 01:04
guess iw ould have to get a photocopy notorized
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:04
@Dueldrawer8 Yeah that's correct
@jkid314159 I'm a little rusty on my jQuery Let me take a look at the api
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:14
@jkid314159 Are you trying to select a class or id?
Elbert Cortez
@trip16661
Apr 03 2016 01:16
can anyone help me why im not getting back the json array in the page? when clicking submit
Alex Coder
@jkid314159
Apr 03 2016 01:17
@DanJFletcher select img tag
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:18
@jkid314159 OK
Juwdohr
@Juwdohr
Apr 03 2016 01:19
havn't gotten the search bar to work nor the filter, just trying to get some input on what i do have?
http://codepen.io/Jarvis-327/full/BKWvYw/
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:22
@jkid314159 Hmm... You're code works for me. What context are you trying to do this? Is it in codepen?
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:23
Do you guys know of any youtube channels that give quick little tips for web design (ux/ui or coding)?
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:23
@alkapwn3d Yep sure do - Dev Tips is my favourite for that sort of thing
@alkapwn3d Here's his channel: https://www.youtube.com/user/DevTipsForDesigners
I also suggest listening to Developer Tea - it's a podcast: http://developertea.com/ Really nice stuff
A. J. Bozdar
@moajday
Apr 03 2016 01:26
@DanJFletcher what about CSS within HTML file? To test, copy the example tribute page to your text editor on your computer then run it. You'll get, what I am wondering for.
Alex Coder
@jkid314159
Apr 03 2016 01:29
@DanJFletcher yes
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:30
@bozdar Oh I see what you're saying. You can't just copy and paste from codepen, because codepen hides needed parts of your HTML like the <!DOCTYPE html> and your <head> tags. For the styling to render properly you need to create a complete HTML document, and import bootstrap properly - that's where the styles are coming from
@jkid314159 Oh ok - did you add animate.css to your project?
The animated and shake classes come from animate.css Without that in your project those classes don't do anything
A. J. Bozdar
@moajday
Apr 03 2016 01:33
@DanJFletcher that's it. I lost in wonder world for nothing.
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:33
@bozdar lol no worries - it's all part of learning :)
Alex Coder
@jkid314159
Apr 03 2016 01:34
@DanJFletcher that was sweet - just added and works really nice - b-e-a-u-t-i-f-u-l
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:34
@jkid314159 Nice!
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:45
I'm feeling unmotivated. Can someone explain to me the usefulness of JavaScript?
James Bond
@Dman89
Apr 03 2016 01:46
http://codepen.io/livinglegendparagon/pen/wGrYzo?editors=0010
can you tell me why my temp number wont appear
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:46
@MonkeyMaster64 lol It can be used for anything :)
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:46
twice in the past 2 days i've talked to potential clinets on the phone and we've gone over their needs and expectations and we agree on the price. when I send them the bill for the downpayment I get no response. WTF is going on! what am I doing wrong? $1000 for a business site btw. is that too much? i asked them their budget range and thats what they told me so i went with it
James Bond
@Dman89
Apr 03 2016 01:47

@MonkeyMaster64 what do you want to do, it matters.

to a butcher, it may not be useful

@alkapwn3d what are your skills
are you worth that
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:47
I dunno. I'm 15 and I'm trying to make a shipping website for practice
James Bond
@Dman89
Apr 03 2016 01:47
@alkapwn3d you have to charge what you are worth
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:47
I want to know how JS can be useful for that
@Dman89 \
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:48
@MonkeyMaster64 Well a shipping website is going to require a back-end which JavaScript can be used to program using NodeJS
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:48
Interesting
you mind expounding on that?
@DanJFletcher
James Bond
@Dman89
Apr 03 2016 01:49
@MonkeyMaster64
php is more what you need,
javascript does front end, php is for the processing of the html pages
you want a combination
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:49
It's hard to say, I mean I don't what your requirements are
James Bond
@Dman89
Apr 03 2016 01:49
html css php, than javascript, IMO
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:49
It's just some basic stuff
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:49
But JavaScript can be used to replace PHP - you don't need it at all.
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:49
@DanJFletcher LevelUpTuts is good one too.
James Bond
@Dman89
Apr 03 2016 01:49
@DanJFletcher all of it
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:49
All I need is it to be mobile-friendly and have pretty animations right now
James Bond
@Dman89
Apr 03 2016 01:49
?
thats html, with java
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:50
You can use JavaScript across the whole stack that way you only need to learn one language
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:50
I do want it to be able to send like help requests to an email address and stuff though
James Bond
@Dman89
Apr 03 2016 01:50
@DanJFletcher save me time, thanks
CamperBot
@camperbot
Apr 03 2016 01:50
dman89 sends brownie points to @danjfletcher :sparkles: :thumbsup: :sparkles:
:star: 376 | @danjfletcher | http://www.freecodecamp.com/danjfletcher
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:50
like for signing up
James Bond
@Dman89
Apr 03 2016 01:50
@MonkeyMaster64 html and javascript buddy
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:50
yeah
James Bond
@Dman89
Apr 03 2016 01:50
@MonkeyMaster64 everything website based javascript
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:50
I'm decent at HTML
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:50
@Dman89 welcome :)
James Bond
@Dman89
Apr 03 2016 01:51
@DanJFletcher do you know why my temp number wont display?
http://codepen.io/livinglegendparagon/pen/wGrYzo?editors=0010
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:51
ok
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:51
well how do I figure out what I'm worth. I dont just build websites. I have experience in business and marketing . I think that adds more value than if i was just a coder
no?
James Bond
@Dman89
Apr 03 2016 01:51
@MonkeyMaster64 html is about closing tags mostly, css styles, javascript adds function after the page is loaded
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:51
kk
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:52
@MonkeyMaster64 You'll want to be proficient at javascript on the front end first. To make things like login pages and user accounts, you need to program a server with routes and your own api and a database to store user data
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:52
What kinda functionality could I add?
James Bond
@Dman89
Apr 03 2016 01:52
@alkapwn3d exactly, show me some work. maybe your not getting that across
@MonkeyMaster64 depends what you want, your mind is the limit really
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:52
Hmmmm
James Bond
@Dman89
Apr 03 2016 01:52
@alkapwn3d by not getting that across i am talking about, when you communicate to them what your skills are
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:53
OK. Right now this is just for fun so I guess when I'll just take my time
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:53
doing that tutorial to see the kinda stuff I might need to have
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:53
thats the site for my real estae investing company
estate*
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:54
@Dman89 First guess after a real quick glance is that you have a readonly attribute attached to your display
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:54
not super amazing but i think its ok
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:54
That looks fucking awesome
like, wow
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:54
@MonkeyMaster64 Yeah exactly man - take your time with it. Building a shipping site is a pretty big undertaking. What seems simple at first is usually a lot more complicated
James Bond
@Dman89
Apr 03 2016 01:54
@alkapwn3d do you offer follow up? how long do you give them support?
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:54
I also took a few art cources in college
James Bond
@Dman89
Apr 03 2016 01:55
@a;
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:55
It's just for the users to be able to sign up and see what the website is about
not the kinda shipping that you're thinking about where you need to manage orders and stuff
although that would be cool to add in the future
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:56
@alkapwn3d Beautiful man. Seriously
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:56
I offered 20/hr after the project was done. but I told them I'd do my industry and competetor research and work closely with them so they got exactly what they need from the beginning
MonkeyMaster64
@MonkeyMaster64
Apr 03 2016 01:56
I think I've received some motivation just from whining
James Bond
@Dman89
Apr 03 2016 01:56
@alkapwn3d
it comes down to communication
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:56
thx :P I got inspired i guess
yeh your right
I quit real estate this week to code full time. I cant stop smiling lol
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:57
@MonkeyMaster64 Yeah, but even simple as it may be - unless you're comfortable with front-end development and have some of the basics of web development down really well, going into a full-stack site like that is a lot. Not saying don't do it - it would be a good experience. But it's probably more than you think
Dominic Lobban
@alkapwn3d
Apr 03 2016 01:57
i never gave a sht about houses anyway
Dan Fletcher
@DanJFletcher
Apr 03 2016 01:57
@MonkeyMaster64 lol nice
James Bond
@Dman89
Apr 03 2016 01:59

@alkapwn3d
6 month follow up for basic support
100% satisfaction guarantee
design, code, business all in one place

Save time and money by doing it right the first time

Dan Fletcher
@DanJFletcher
Apr 03 2016 01:59
@MonkeyMaster64 If you are determined to do it, and you don't already know PHP or SQL I'd recommend looking into the MEAN stack (MongoDB, ExpressJS, AngularJS, and NodeJS)
@MonkeyMaster64 You don't have to use Angular though, you can easily swap out the front-end framework for what ever you'd like. The point is to keep the whole stack JavaScript
MongoDB uses regular JSON data, NodeJS is a JS runtime environment for your server side code, Express is just a framework to help you build a NodeJS app faster. All of it is JavaScript
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:02
@DanJFletcher i love node and express
makes building websites so much easier from the introduction i had to it
Dominic Lobban
@alkapwn3d
Apr 03 2016 02:02
@Dman89 Ill add that to my pitch
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:03
havent tried the tutorials on here but somewhere else and its nice and quick
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:03
@Dueldrawer8 Yeah it's awesome! I wish my work used Node
James Bond
@Dman89
Apr 03 2016 02:03
@DanJFletcher it will display my input but not a temp number
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:03
@DanJFletcher alot easier than starting from scratch
dipped a little into mangodb but got complicated for me at mongoose.. felt like i got out of touch of building things and the front end so i stopped
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:08
@Dueldrawer8 Yea it can be a lot to take in if you're not already familiar with working with DB's much especially. It was my first so it took me a while - and I'm still learning
That's kind of why I'm here, is to get better at the back-end
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:09
@DanJFletcher indeed..its a lot harder than front end but not to bad.. makes front end work easier IMO
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:09
@Dman89 what do you mean by temp number? Like you want it to say 0 when it first loads? Or what?
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:09
question.. is it requited i have $(document).load or whatever it is uptop?
James Bond
@Dman89
Apr 03 2016 02:10
@DanJFletcher it is showing the whole input line, i just want to show it before I hit +/-*
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:10
my app works fine without it
James Bond
@Dman89
Apr 03 2016 02:10
@DanJFletcher like a calculator does
not showing all the symbols
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:11
@Dueldrawer8 $(document).ready(function() {}); yeah you should
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:11
@DanJFletcher and what does that do again?
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:11
It'll save you a lot of headaches
@Dman89 OK I see what you mean
@Dman89 Well personally I would rethink the problem a bit before I went any further so that you have more control of what you want your calculator to do.
Like, I would have an expression object that would essentially just be an array of values like digits, and operators
The expression should be separate from the display completely
JD Tadlock
@jdtdesigns
Apr 03 2016 02:15
@Dman89 On operator press, eval the string in the input and output total
if the equation throws error, just return
James Bond
@Dman89
Apr 03 2016 02:16
ok i get it, but what do you mean error?
JD Tadlock
@jdtdesigns
Apr 03 2016 02:17
I'm sure you've seen the error eval throws if the calculation is unequatable right?
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:17
The display really should just be a state. So for example, what if I entered 1+1= Then after receiving a 2 as my output I pressed = again? A real calculator would display 3.
JD Tadlock
@jdtdesigns
Apr 03 2016 02:18
calc will throw something like 'Unexpected Identifier'
James Bond
@Dman89
Apr 03 2016 02:18
@jdtdesigns no but i can look it up, thanks.
@DanJFletcher
ur right
CamperBot
@camperbot
Apr 03 2016 02:18
:warning: dman89 already gave danjfletcher points
dman89 sends brownie points to @jdtdesigns and @danjfletcher :sparkles: :thumbsup: :sparkles:
:star: 386 | @jdtdesigns | http://www.freecodecamp.com/jdtdesigns
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:30
@DanJFletcher is there anyway i can check to see if its night or day in the openweather api?
James Bond
@Dman89
Apr 03 2016 02:30
@Dueldrawer8 its in the icon
@Dueldrawer8 if the icon has a d or n after it
@Dueldrawer8 make a statment that changes based on logo
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:31
@Dman89 lol yep!
Exactly
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 02:31
@Dman89 ah didnt see that.. very observant
@Dman89 thanks
CamperBot
@camperbot
Apr 03 2016 02:31
dueldrawer8 sends brownie points to @dman89 :sparkles: :thumbsup: :sparkles:
:star: 348 | @dman89 | http://www.freecodecamp.com/dman89
James Bond
@Dman89
Apr 03 2016 02:31
@Dueldrawer8 any time

@jdtdesigns @DanJFletcher already said thank you, but thank you again.

reset the code to make it work thanks to you guys

http://codepen.io/livinglegendparagon/pen/wGrYzo?editors=0010

Dan Fletcher
@DanJFletcher
Apr 03 2016 02:35
@Dman89 nice! Glad you got it to work :)
Dan Stockham
@DanStockham
Apr 03 2016 02:41
I feel like I'm getting close to chaining operations http://codepen.io/DanStockham/pen/grGBeL?editors=0010
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:46
how DO I change the color of the whole body except one button
and the button text
not necessarily the button itself
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:48
@tienanh2007 I would just style the body, then add a style to the button. It should cascade, and the styles on the button should have higher specificity then the styles on the body
David Weedmark
@DavidWeedmark
Apr 03 2016 02:49
@tienanh2007 you can give the button a class and put that class at the end of your CSS, or mark it !important, or give it an ID, which overrides classes
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:49
@tienanh2007 It's tough to say without some context of what you're doing. Do you have any code?
David Weedmark
@DavidWeedmark
Apr 03 2016 02:50
@DanJFletcher you're doing UoPeople?
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:52
@DanStockham Nice, I think you're on the right track. That math object is an interesting idea - be careful you don't mix it up with the global Math though
@DavidWeedmark Yeah I am!
David Weedmark
@DavidWeedmark
Apr 03 2016 02:54
@DanJFletcher think you msgd the wrong person for the Math obj. but cool. I enrolled a while back and waiting for the next round of admissions
ah. quick edit!
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:54
@DavidWeedmark Yeah I did lol. Awesome! I guess I'll see you there soon then :)
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:55
@DanJFletcher @DavidWeedmark ok my quote generator change the color of the quote and the button and everything when pressed. but I still want thing to be color white like the button text or a footer im gonna put at the end.
David Weedmark
@DavidWeedmark
Apr 03 2016 02:55
@tienanh2007 which part do you want to be white?
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:55
@DavidWeedmark the button text, the "new quote"
if you could see it :))
Stephen James
@sjames1958gm
Apr 03 2016 02:56
Finished the calculator project
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:57
This message was deleted
@tienanh2007
#newquote {
  color: white;
}
David Weedmark
@DavidWeedmark
Apr 03 2016 02:57
@tienanh2007
#newquote {
  color: #fff;
}
oops. or what @DanJFletcher said. it's the same thing
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:58
@DavidWeedmark @DanJFletcher wow that was amazingly simple. I thought the javascript code gonna override that. Thank you
CamperBot
@camperbot
Apr 03 2016 02:58
tienanh2007 sends brownie points to @davidweedmark and @danjfletcher :sparkles: :thumbsup: :sparkles:
:star: 377 | @danjfletcher | http://www.freecodecamp.com/danjfletcher
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:58
@DavidWeedmark lol either way :)
CamperBot
@camperbot
Apr 03 2016 02:58
:star: 446 | @davidweedmark | http://www.freecodecamp.com/davidweedmark
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:58
Also how do I change the color of the tweet
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:58
@tienanh2007 You're welcome
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 02:59
it blue by default but I want it to be white
David Weedmark
@DavidWeedmark
Apr 03 2016 02:59
@tienanh2007
Dan Fletcher
@DanJFletcher
Apr 03 2016 02:59
@tienanh2007 Same idea. You just have to select it
David Weedmark
@DavidWeedmark
Apr 03 2016 02:59
a {
  color: yellow;
}
that will change any clickable links, so if you add others, those will be the color you select as well
or you can give the twitter link a class of its own like class="twitter" and then use .twitter in CSS
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 03:00
damn should of think more about it. Thank you @DanJFletcher @DavidWeedmark
CamperBot
@camperbot
Apr 03 2016 03:00
tienanh2007 sends brownie points to @danjfletcher and @davidweedmark :sparkles: :thumbsup: :sparkles:
:warning: tienanh2007 already gave danjfletcher points
:warning: tienanh2007 already gave davidweedmark points
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:01
@tienanh2007 The element has an id so you can just use that as your selector... or as @DavidWeedmark shows you can select all anchor elements and change it that way
@tienanh2007 You can also remove .quote-box from your selectors. In this case you don't need your selector to be that specific. Like this:
.quote-text{
  text-align: center;
  width: 500px;
  font-size: 30px;
  margin: 0 auto;
}

#newquote {
  display: block;
  float: right;
  color: white;
}
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 03:06
Oh then when do you actually need it then ?
also the color of the source itself also dissapear for somereason
oh nvm
I figgure it out
走你飛艇
@gofighting123
Apr 03 2016 03:07
@tienanh2007 use flexbox....http://learnlayout.com/
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:08
Well for the id selector you don't. But for .quote-text as an example, you might have more then one class in your code and it may be nested in more than one element. So by adding .quote-box you are being more specific to the exact .quote-text class that you are trying to style.
Tien Anh Nguyen
@tienanh2007
Apr 03 2016 03:09
ok I understand
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:11

So just to show you what I mean in code:

<div class="quote-box">
  <div class="quote-text">
</div>

<div class="other-box">
  <div class="quote-text">
</div>

That's the kind of situation you would want to use a selector like .quote-box .quote-text

Unless you wanted ALL .quote-text classes to be styled the same
Dominic Lobban
@alkapwn3d
Apr 03 2016 03:19
does anyone use a system for naming classes?
or do youi just wing it
Pawan
@pawan92
Apr 03 2016 03:21
it helps to name classes on what you are grouping things under. like in above example you can see "quote-box" which i assume will hold the quote generated so its easier for you and another person reading the code
@alkapwn3d
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:21
@alkapwn3d Depends how big the project is. If it starts off small, I just wing it, but if I know it's going to be a big project, I put some serious thought into my class names. It's about finding a balance between something that is not crazy long to type, but is informative enough that if other people where to use your class it would make sense what it's for
I also look to what good frameworks have done in the past and try to follow their practices - like @pawan92 mentioned about how things are grouped. You can see that in bootstrap like btn-primary or btn-danger. You start with the most abstract part of the name - in this case btn then you get into more details such as danger
Juwdohr
@Juwdohr
Apr 03 2016 03:23
Good morning all.
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:25
So for another example: if you had a dog class and a cat class, it would make sense to have an animal class because there are traits that both dogs and cats have in common like having 4 legs. So a line in my HTML might look like this:
<div class="animal animal-dog"></div>
could someone tell me what i am missing in terms of code within the link above
This message was deleted
Juwdohr
@Juwdohr
Apr 03 2016 03:27
@chipotle298 What are you trying to do above?
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:27
I could go deeper too; maybe I have a dog that doesn't bark or a cat that doesn't meow. I could name those classes animal-dog-noBark and animal-cat-noMeow... but then I might see a common pattern between those two, and instead refactor that to: animal-noSound instead.
MIke
@chipotle298
Apr 03 2016 03:28
soo compare plunker
to code pen
whats in code pen thats not in plunker
that makes the code in codepen work
Juwdohr
@Juwdohr
Apr 03 2016 03:29
So first your facebook imate isn't comeing up. where are you trying to pull it from?
scroll to where
Codegiant
Juwdohr
@Juwdohr
Apr 03 2016 03:30
Also @chipotle298 your CSS in plunker needs to be in your header sections. otherwise it's in your body of your page/.
MIke
@chipotle298
Apr 03 2016 03:30
answered
Dan Fletcher
@DanJFletcher
Apr 03 2016 03:31
@alkapwn3d Here's an article that will probably answer that question better than I can: http://www.sitepoint.com/title-css-simple-approach-css-class-naming/
It's definitely an important subject to think about
MIke
@chipotle298
Apr 03 2016 03:32
@Juwdohr like this?
<head>

.social {
width:330px;
height:75px;
float:right;
text-align:left;
padding:10px 0;
border-bottom:dotted 1px #6d6d6d;
}
.social .socialIcon{
padding-top:0;
}
.social .socialText{
border:0;
}

</head>
Juwdohr
@Juwdohr
Apr 03 2016 03:33
This is what shows up in codepen.io when you are looking at it.
<!DOCTYPE html><html class=''>
<head><script src='//s.codepen.io/assets/editor/live/console_runner-ba402f0a8d1d2ce5a72889b81a71a979.js'></script><script src='//s.codepen.io/assets/editor/live/events_runner-d004902542b6f6191b16aa6145ed1d9c.js'></script><script src='//s.codepen.io/assets/editor/live/css_live_reload_init-bad5f8d322020126e7b4287d497c7efe.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="canonical" href="http://codepen.io/manczyk2/pen/YqrJdq" />


<style class="cp-pen-styles">.social {
  width:330px;
  height:75px;
  float:right;
  text-align:left;
  padding:10px 0;
  border-bottom:dotted 1px #6d6d6d;
}
.social .socialIcon{
  padding-top:0;
}
.social .socialText{
  border:0;
}</style></head><body>
<div class="social">
    <div class="socialIcon"><img src="images/facebook.png" alt="Facebook" /></div>
    <div class="socialText">Find me on Facebook</div>
</div>

</body></html>
MIke
@chipotle298
Apr 03 2016 03:34
how did you get that?
Juwdohr
@Juwdohr
Apr 03 2016 03:34
So @chipotle298 the style tag is in the head tag and your css goes there.
I am a computer programmer I know where to find information.
MIke
@chipotle298
Apr 03 2016 03:34
did you type that in for my benefit
ahaahahah
im assuming
Juwdohr
@Juwdohr
Apr 03 2016 03:34
I did get it for you. From your pen.
MIke
@chipotle298
Apr 03 2016 03:35
ok i thought there was like a button in code pen to give me the code that the site itself had in the backround of the code i pasted in
(i know im really bad at this)
Juwdohr
@Juwdohr
Apr 03 2016 03:36
There is a lot that codepen doesn't explain how they do it. also in the begining of freecodecamp they teach you where to put the either the css or the css file within the html document
Dominic Lobban
@alkapwn3d
Apr 03 2016 03:37
im looking for a way to have my background image fade and change into another image. anyone have a link to a guide?
Juwdohr
@Juwdohr
Apr 03 2016 03:37
also images/facebook.png is a local src. So no one else will see it.
Dominic Lobban
@alkapwn3d
Apr 03 2016 03:38
@DanJFletcher yeh I saw that
article i mean
MIke
@chipotle298
Apr 03 2016 03:40
I am a computer programmer I know where to find information. @Juwdohr so you didnt get that snap shot from code pen did you?
Juwdohr
@Juwdohr
Apr 03 2016 03:41
I don't give out my personal secrets.
MIke
@chipotle298
Apr 03 2016 03:41
like there isnt like a button i can click on that tells me what they automatically use in terms of code before and copy and past my code
ok
Matt Leonard
@matty22
Apr 03 2016 03:41
Anyone know off the top of their heads how to get webkit to stop injecting a fuzzy blue border around button:enabled elements?
I've tried -webkit-appearance: none;
Paul Borawski
@iAmNawa
Apr 03 2016 03:45
@matty22 fuzzy blue border?
Dylan
@dhcodes
Apr 03 2016 03:49
@matty22 maybe button:active {
border: none;
}
Paul Borawski
@iAmNawa
Apr 03 2016 04:10
@dhcodes in this house everybody!
Matt Leonard
@matty22
Apr 03 2016 04:14
@dhcodes Yeah, outline: none; worked for me. thanks!
CamperBot
@camperbot
Apr 03 2016 04:14
matty22 sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star: 550 | @dhcodes | http://www.freecodecamp.com/dhcodes
Elbert Cortez
@trip16661
Apr 03 2016 04:29
can i get some help here? D:
the api is not sending a different json every ime i click it
and i don't know why since im changing the key every time i click
nvm i wasn't
it was outside
ahahaha im so dumb
i just found out the answer when i was fomulating the question xDD
James Bond
@Dman89
Apr 03 2016 04:41
niice
@trip16661 good job
Matt Leonard
@matty22
Apr 03 2016 04:44
Anyone have any clue why a button might work just fine in desktop, but not in mobile?
James Bond
@Dman89
Apr 03 2016 04:48
@matty22 send the link i wanna look
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:48
@matty22 Yes
it happened to me...
Matt Leonard
@matty22
Apr 03 2016 04:48
I've just been ftp-ing files, so that could be the issue, but it's here...
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:48
are you using col--
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:49
col- -
Matt Leonard
@matty22
Apr 03 2016 04:49
with an extra dash?
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:49
*
yeah its like col-md-2
Matt Leonard
@matty22
Apr 03 2016 04:49
Yes, I'm using bootstrap
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:50
like this <div class="col-md-2">
James Bond
@Dman89
Apr 03 2016 04:50
send me the with editior
i cant see ur code
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:50
or something about you have to expeirment with what col works on both platforms
Matt Leonard
@matty22
Apr 03 2016 04:50
nvm I figured it out. was doing something like this:
<div class="row col-md-4">Button Here</div>
James Bond
@Dman89
Apr 03 2016 04:51

@matty22 non related

Your row is with your col, it is suppose to be row wrap col

example

div row
div col
/div
/div

ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:51
alright but why isnt this working???
<img src="http://postimg.org/image/8u61qt3gh/">
Matt Leonard
@matty22
Apr 03 2016 04:52
Yeah, I'm about to claim front end certificate and going back and cleaning up stuff I did way back when. Finding lots of weird bugs I overlooked on these early projects.
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:52
Ik and now that wont work it should work right?
James Bond
@Dman89
Apr 03 2016 04:52
not a link?
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:52
it is try it
James Bond
@Dman89
Apr 03 2016 04:52
err img
Matt Leonard
@matty22
Apr 03 2016 04:52
@ZctrapCoding What is that?
James Bond
@Dman89
Apr 03 2016 04:53
oh
cause it doesnt end it .jpg
or .png
etx
etc
Matt Leonard
@matty22
Apr 03 2016 04:53
What doesn't?
James Bond
@Dman89
Apr 03 2016 04:53
its a webpage
@ZctrapCoding

@matty22 he was asking about his img tag

did u see what i said about your rows

and does it make sense
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:54
@Dman89 im pretty sure it isnt because when you go on it its just the pic
Matt Leonard
@matty22
Apr 03 2016 04:54
Yeah. This was one of my first projects months ago when I was first learning bootstrap. Didn't notice all the cols and rows smashed together. Gotta get those sorted out.
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:54
oh nvm i found the correct one
xD we found it at the same time
James Bond
@Dman89
Apr 03 2016 04:55
@ZctrapCoding yeah, it was a webpage at first, now it is a pic link. make sure your img href ends in a img extension.
ZctrapCoding
@ZctrapCoding
Apr 03 2016 04:56
yeah
thx @Dman89
CamperBot
@camperbot
Apr 03 2016 04:56
zctrapcoding sends brownie points to @dman89 :sparkles: :thumbsup: :sparkles:
James Bond
@Dman89
Apr 03 2016 04:56
@ZctrapCoding anytime, glad i could help
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:07
@Dman89 would you mind helping me out? may take a while.. im on weather api project and trying to create a function or object to lookup whether its day or night, and if its clear to render a certain background image to a page
James Bond
@Dman89
Apr 03 2016 05:07
ok
whats wrong?
send me the link at the same time please
@Dueldrawer8 ??
you need else if statements
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:12

if you look at the bottom i have a declared array with an object in it.. i'm going to create multiple objects that depend on two things as you can see in my changeBackGroundImg. My overall goal is to change the background-image depending on 1) if its night or day, and 2) what the forecast is ie(clear,sunny, etc)

I know i am going to have to move the changeBackGroundImg into my AJAX so it can locate those data variables.. i just don't know to implement that variable in the ajax call

another problem is figuring out how to transfer a background image url to show in the html
changebackgroundimg is not a function so i cant call it.. im going to have a bunch of different cases so i am using objects with functions in them.
James Bond
@Dman89
Apr 03 2016 05:20
icon = data.weather[0].icon
is gonna be needed
for this
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:20
its there
success: function(data) {
            var weatherCond = data.weather[0].main;
            var weatherDayNight = data.weather[0].icon[2];
            var weatherID = data.weather[0].id;
James Bond
@Dman89
Apr 03 2016 05:21
remove the 2
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:21
second variable to get "n" if its night and "d" if its day
James Bond
@Dman89
Apr 03 2016 05:21
idk if u can grab it like that
it will give u
a file
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:22
theres to many cases the other way
James Bond
@Dman89
Apr 03 2016 05:22
10d.png
or 10n.png
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:22
correct
James Bond
@Dman89
Apr 03 2016 05:22
u need to go based off of the file name, is one way
or the way i did it
so for example
wait
i guess u might be able to do something else hold on
ok
u could search the icon for n or a d
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:25
yes
James Bond
@Dman89
Apr 03 2016 05:25
or you can make if else statments
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:25
was aiming for that
i could use a switch statement instead of if/else statements correct? I assume its going to be a lot of if/else statement
wish i could see your code and see
James Bond
@Dman89
Apr 03 2016 05:26
ok
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:27
you see my if statement right?
var changeBackGroundImg = [{
        ClearNight: function() {
          // checks to see if weather is clear and icon is night
          if (weatherCond == 'Clear' && weatherDayNight == "n") {
              $('body').css('background-image', 'url("https://web-assets.domo.com/blog/wp-content/uploads/2012/12/nighttimesky.jpeg")' );
          }
        }
     }];
      });
is that how i would add that background image to my body?
James Bond
@Dman89
Apr 03 2016 05:28

there is an easier way to do this using a the search function, just search the icon string for d or n

or

make an if else statement that covers different temps + day/night

document.body.style.background = "red url('http://www.wallpapermania.eu/download/2013-07/5416/sunny-days-at-the-seaside-hd-wallpaper_2560x1920.jpg') center/cover no-repeat";
that could work too
yours
but thats another way
else if (icon === "50d") {
    displayImg = '<img src=' + smallImgDay[8] + '></img>';
    $(".smallImgDisplay").html(displayImg);
  }
@Dueldrawer8 hope that helps
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:33
ah i see
kinda
grouping all the night and day codes together
in an array
James Bond
@Dman89
Apr 03 2016 05:34
u could add a background setting to that too
but i have mine change to temp
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:38
wow thats alot
has to be an eaiser way
lol
James Bond
@Dman89
Apr 03 2016 05:38
yeah
search
.search for an n or d
and go base off of that
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:39
well i already did that..
var weatherDayNight = data.weather[0].icon[2]
if you console.log it
it returns either 'd' or 'n' within the weather icon JSON
hence my if statement weatherDayNight == 'n'
man.. this is going to be a lot of work isnt it? how long did it take you to complete it?
this is my second day..
James Bond
@Dman89
Apr 03 2016 05:44
not long at all
talk a deep breath
does icon[2] really pull something up for you
because it doesnt for me
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:45
it does yes
James Bond
@Dman89
Apr 03 2016 05:45
ok hold on
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:45
here ill fix it for you so you can look at it
James Bond
@Dman89
Apr 03 2016 05:46
ok it does
i tested mine
ok ill write your code hold on biddy
buddy
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:46
cool, nah you dont have to.. i need to learn on my own anyway :)
James Bond
@Dman89
Apr 03 2016 05:46
oits only one code is that ok?
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:47
sure
James Bond
@Dman89
Apr 03 2016 05:49
if (data.weather[0].icon[2].search("n") != -1) {
  $(".abc").append(data.weather[0].icon[2])
}
!= -1
means that if the icon search comes back with a n in it
run code
.abc is a class i made to test it
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:50
looks good, but I am trying to add a new background image not the icon. But I think some of your code may have given me some ideas
James Bond
@Dman89
Apr 03 2016 05:51
if (data.weather[0].icon[2].search("n") != -1) {  background code here}
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:51
if that jquery or vanilla javascript
the background "code here"
James Bond
@Dman89
Apr 03 2016 05:52
if (data.weather[0].icon[2].search("n") != -1) { background: night }
else if (data.weather[0].icon[2].search("d") != -1) { background: day }
that is nothing but my text being rendered as code
Randy Goldsmith
@Dueldrawer8
Apr 03 2016 05:53
@Dman89 thanks
CamperBot
@camperbot
Apr 03 2016 05:53
dueldrawer8 sends brownie points to @dman89 :sparkles: :thumbsup: :sparkles:
:star: 350 | @dman89 | http://www.freecodecamp.com/dman89
James Bond
@Dman89
Apr 03 2016 05:54
if (data.weather[0].icon[2].search("n") != -1) { document.body.style.background = "green url('https://upload.wikimedia.org/wikipedia/commons/5/5d/A_Beautiful_Day_on_Keats.JPG') center/cover no-repeat";

 } else if (data.weather[0].icon[2].search("d") != -1) { document.body.style.background = "blue url('https://cyrience.files.wordpress.com/2014/10/cyrience_cold_spring__ny_surprise_lake_wedding-02.jpg') center/cover no-repeat"; }
any time
Dominic Barretto
@Dominicbarretto
Apr 03 2016 05:55
Hi guys ! where do i get the portfolio templates?
James Bond
@Dman89
Apr 03 2016 05:55
what do you mean, we make them from reverse engineering
using bootstrap
@Dominicbarretto what can we help u with?
Dominic Barretto
@Dominicbarretto
Apr 03 2016 05:56
how exactly i can start with the portfolio webpage?
James Bond
@Dman89
Apr 03 2016 05:57
depends, where are u at now?
do you have a codepen.io
have you done any of the lessons?
Dominic Barretto
@Dominicbarretto
Apr 03 2016 05:58
yes. I m doing the "Build a Personal Portfolio Webpage"
i dont know how to start!
James Bond
@Dman89
Apr 03 2016 05:59
This message was deleted
This message was deleted
This message was deleted
draw how u want it to look
list the items
write the html
add content
style with css
Dominic Barretto
@Dominicbarretto
Apr 03 2016 06:00
k thanks @Dman89 .will do that
CamperBot
@camperbot
Apr 03 2016 06:00
dominicbarretto sends brownie points to @dman89 :sparkles: :thumbsup: :sparkles:
:star: 351 | @dman89 | http://www.freecodecamp.com/dman89
James Bond
@Dman89
Apr 03 2016 06:01
@Dominicbarretto Glad i could help, was that what you were looking for?
kirbyedy
@kirbyedy
Apr 03 2016 06:17
@Dominicbarretto couple of free courses if you want: https://www.udemy.com/courses/search/?q=html&src=ukw&lang=en&price=price-free
I am not related to udemy in any way, just watched couple of those and it did help me
Jeffrey Dinh
@dinhjeffrey
Apr 03 2016 06:28
@Dominicbarretto look for bootstrap templates. Easiest way to start off, looks professional, and mobile optimized
Noah Fleitz
@burningPluto
Apr 03 2016 06:38
Anyone have any clue why my .css file wont connect to my github res but it works locally
Jeffrey Dinh
@dinhjeffrey
Apr 03 2016 06:42
is the path correct?
Noah Fleitz
@burningPluto
Apr 03 2016 06:43
Yeah i even changed it so it was in the same file. It hasn't changed in my repo even though it said i have synced it so that might be it
it just wont sync idk why lol ohh well its almost 3am goodnight guys
khalsa777
@khalsa777
Apr 03 2016 06:51
This message was deleted
can some1 plz spot issue, the api data here at twitch streamer os not getting loaded plz check http://codepen.io/khalsa777/pen/GZMQPW
走你飛艇
@gofighting123
Apr 03 2016 07:03
This message was deleted
maybe it's not so important :accept:
khalsa777
@khalsa777
Apr 03 2016 07:05
@gofighting123 can you this once !
走你飛艇
@gofighting123
Apr 03 2016 07:05
@khalsa777 i could but at weekend i need to read other stuffs :alien:
khalsa777
@khalsa777
Apr 03 2016 07:06
@gofighting123 ohh
走你飛艇
@gofighting123
Apr 03 2016 07:07
@khalsa777 i think you can find it on the FCC wiki bot...
Jenni
@silverrain64
Apr 03 2016 07:08
This message was deleted
This message was deleted
This message was deleted
khalsa777
@khalsa777
Apr 03 2016 07:11
@gofighting123 wiki bot?
走你飛艇
@gofighting123
Apr 03 2016 07:11
help twitch
CamperBot
@camperbot
Apr 03 2016 07:11

:point_right: front end project use the twitchtv json api [wiki]

If you're trying to tackle this challenge with jQuery's $.getJSON() method, chances are you'll get an error message concerning Cross-Origin Resource Sharing (CORS).

The easiest way to resolve this is to use jQuery's JSONP capabilities. From the Twitch API's readme page:

All API methods support JSON-P by providing a callback parameter with the request.

Also the jQuery documentation states:

If the URL includes the string "callback=?" (or similar, as defined by the server-side API), the request is treated as JSONP instead.

Here's an example call to fetch Free Code Camp's Twitch channel data:

$.getJSON('https://api.twitch.tv/kraken/streams/freecodecamp?callback=?', function(data) {
  console.log(data);
});

JSONP is considered insecure according to Wikipedia, but should be sufficient for our purposes. For a detailed discussion on Twitch's CORS restriction, please read justintv/Twitch-API#133 on the Twitch-API repository.
:pencil: read more about front end project use the twitchtv json api on the FCC Wiki

走你飛艇
@gofighting123
Apr 03 2016 07:11
:alien:
@khalsa777 do you get it ?
khalsa777
@khalsa777
Apr 03 2016 07:15
@gofighting123 is used that
走你飛艇
@gofighting123
Apr 03 2016 07:15
@khalsa777 nvm... good to know :alien:
khalsa777
@khalsa777
Apr 03 2016 07:19
@gofighting123 hmm
走你飛艇
@gofighting123
Apr 03 2016 07:20
@khalsa777 where are you from :smile:
khalsa777
@khalsa777
Apr 03 2016 07:21
Punjab
走你飛艇
@gofighting123
Apr 03 2016 07:21
@khalsa777 oh my...
khalsa777
@khalsa777
Apr 03 2016 07:31
@gofighting123 what happended? any issue resolved!!!
@gofighting123 i mean my issue got resolved..
Parminder Singh
@Trion129
Apr 03 2016 07:31
help wikipedia CORS
CamperBot
@camperbot
Apr 03 2016 07:31
no wiki entry for: wikipedia cors
Parminder Singh
@Trion129
Apr 03 2016 07:32
:P Lol this bot is so limited
走你飛艇
@gofighting123
Apr 03 2016 07:32
@khalsa777 that's good :clap:
Parminder Singh
@Trion129
Apr 03 2016 07:32
How do I apply CORS to wikipedia?
走你飛艇
@gofighting123
Apr 03 2016 07:33
help wiki
CamperBot
@camperbot
Apr 03 2016 07:33

:point_right: how to contribute to the wiki [wiki]

How To Contribute To The Wiki

This is a step-by-step guide, aimed at people new to Git, which covers how to use GitHub Desktop as well as the Git command line

As such there might be 2 sets of directions: GitHub Desktop first, then command line version

GitHub Desktop is a GUI interface, but there are benefits to learning the command line way too (speed, shortcuts, more powerful commands, and being able to talk to people who are old school). It might be beneficial to you to try the Command Line way after you get more comfortable with GitHub

Table Of Contents

:pencil: read more about how to contribute to the wiki on the FCC Wiki

走你飛艇
@gofighting123
Apr 03 2016 07:33
help wikiviewer
CamperBot
@camperbot
Apr 03 2016 07:33
no wiki entry for: wikiviewer
走你飛艇
@gofighting123
Apr 03 2016 07:34
help entry
CamperBot
@camperbot
Apr 03 2016 07:34
no wiki entry for: entry
走你飛艇
@gofighting123
Apr 03 2016 07:35
@camperbot I-o-V-e U+U :alien:
Parminder Singh
@Trion129
Apr 03 2016 07:35
help Cross-Origin Resource Sharing
CamperBot
@camperbot
Apr 03 2016 07:35
no wiki entry for: cross-origin resource sharing
Bruce Young
@mutantspore
Apr 03 2016 07:36
@Trion129 if you are using getJSON add &callback=? to your URL
走你飛艇
@gofighting123
Apr 03 2016 07:36
@Trion129 https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/camperbot it's better finding help command :smile:
Parminder Singh
@Trion129
Apr 03 2016 07:37
at the end or anywhere? I am getting error 403
走你飛艇
@gofighting123
Apr 03 2016 07:38
echo Hail Hydra !!
CamperBot
@camperbot
Apr 03 2016 07:38
@gofighting123 said: echo Hail Hydra !!
Bruce Young
@mutantspore
Apr 03 2016 08:06
@Trion129 can we see your pen ?
Parminder Singh
@Trion129
Apr 03 2016 08:09
It is working now :smile: Thanks @mutantspore
I will post when it will be completely done
CamperBot
@camperbot
Apr 03 2016 08:09
trion129 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1348 | @mutantspore | http://www.freecodecamp.com/mutantspore
走你飛艇
@gofighting123
Apr 03 2016 08:16
@mutantspore could you explain reactJS worth to learn and why? so many people crazy about it. it's modulize the view(MVC) and then ? reduce the re do of frontend works . i am hesitate and worry about that ... bcz every day there are always something new upcoming...
James Bond
@Dman89
Apr 03 2016 08:17
hey
can someone look at my code
cant figure out why my code btns wont workl
走你飛艇
@gofighting123
Apr 03 2016 08:19
@Dman89 no $(function(){}) ?
James Bond
@Dman89
Apr 03 2016 08:19
@gofighting123 i dont know i need it, can u elaborate (explain more)
走你飛艇
@gofighting123
Apr 03 2016 08:20
...
James Bond
@Dman89
Apr 03 2016 08:20
its late here
i know tis simple
走你飛艇
@gofighting123
Apr 03 2016 08:21
@Dman89 ok, i saw the $(function part...my mistake
James Bond
@Dman89
Apr 03 2016 08:21
@gofighting123 its ok
@gofighting123 thank you for looking, do you see anything more?
CamperBot
@camperbot
Apr 03 2016 08:22
dman89 sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:star: 296 | @gofighting123 | http://www.freecodecamp.com/gofighting123
走你飛艇
@gofighting123
Apr 03 2016 08:26
@Dman89 why you set secs -= 1; in the timerTiming function ? i dont get it..
@Dman89 does it matter with what ??
@Dman89 and you use new Audio is't good...bcz it's memory waste...
@Dman89 just play it's ok , doesn't need to make a new one
James Bond
@Dman89
Apr 03 2016 08:29
@gofighting123 it is counting down,
remove the new from the code or more?
Sameer Shamsudeen
@sameershamsudheen
Apr 03 2016 08:29
hello anyone please help me to understand border-image-slice: 13 30 7 1; property in css, is this property important? how common the usage of this, i read this https://css-tricks.com/understanding-border-image/ but i cant understand that, any other helpful reference sites would be helpful thanks in advance.
走你飛艇
@gofighting123
Apr 03 2016 08:30
@Dman89 bcz u r using setInterval , so it will new Audio every time.. make it global it's fine
@Dman89 .............i saw the bug...................
James Bond
@Dman89
Apr 03 2016 08:35
@gofighting123 whats that, thank you btw
CamperBot
@camperbot
Apr 03 2016 08:35
dman89 sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:warning: dman89 already gave gofighting123 points
走你飛艇
@gofighting123
Apr 03 2016 08:36
@Dman89 $( document ).ready() , u wrote $("document") , that does matter ?
James Bond
@Dman89
Apr 03 2016 08:37
@gofighting123 thank you, it didnt but i changed it.
my code now works thanks to you and a couple others.
CamperBot
@camperbot
Apr 03 2016 08:37
dman89 sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:warning: dman89 already gave gofighting123 points
走你飛艇
@gofighting123
Apr 03 2016 08:38
@Dman89 it works now !?
@Dman89 i saw it...works...
James Bond
@Dman89
Apr 03 2016 08:38
yeah reload it
how come my css doesnt follow though?
走你飛艇
@gofighting123
Apr 03 2016 08:38
@Dman89 :alien:
James Bond
@Dman89
Apr 03 2016 08:40
nvm found it
走你飛艇
@gofighting123
Apr 03 2016 08:40
@Dman89 humm :clap:
@sameershamsudheen border-image-slice as the words says...it's cut some part of image...rarely use...if it's important? depends on how you use it...if u slice the image and then random it to make another big map of picture, that's pretty amazing thing...so....you know..
Sameer Shamsudeen
@sameershamsudheen
Apr 03 2016 08:47
@gofighting123 Thank You
CamperBot
@camperbot
Apr 03 2016 08:47
sameershamsudheen sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:star: 297 | @gofighting123 | http://www.freecodecamp.com/gofighting123
走你飛艇
@gofighting123
Apr 03 2016 08:48
@sameershamsudheen it's mix writing style , maybe slice the image top,right,bottom,left, just check it on the manual , no one cares beside you use it offten :smile:
@sameershamsudheen np
James Bond
@Dman89
Apr 03 2016 08:52
@gofighting123 can you show me an example of this slice u speak of?
走你飛艇
@gofighting123
Apr 03 2016 08:52
@Dman89 ................
James Bond
@Dman89
Apr 03 2016 08:53
@gofighting123 if you dont have one its ok
i clicked his link nvm
lol
khalsa777
@khalsa777
Apr 03 2016 09:10
how to modify a variable outside the scope of $.getJSON function ????
走你飛艇
@gofighting123
Apr 03 2016 09:12
@khalsa777 return it or make it global... ?
khalsa777
@khalsa777
Apr 03 2016 09:13
@gofighting123 i mean modify a variable from within $.getJSON callback function
走你飛艇
@gofighting123
Apr 03 2016 09:15
@khalsa777 getJSON return JSON Object..u got it? . and u need to get what u want variable..with dot notation with it, and what exactly you want to know?
khalsa777
@khalsa777
Apr 03 2016 09:18

@gofighting123 ```
$.getJSON(url,function(resp){

      data={
        logo:(resp.logo!=null)? resp.logo : "http://dummyimage.com/50x50/ecf0e7/5c5457.jpg&text=0x3F",
        url:resp.url,
        status:"offline"


      };
    });

``` data object is declared outside, and it is not getting modified

data object is not getting modified as shown from within this function of $.getJSON
走你飛艇
@gofighting123
Apr 03 2016 09:30

@khalsa777 http://stackoverflow.com/questions/4200641/how-to-return-a-value-from-a-function-that-calls-getjson

in your case , i just append the result as html as i want without return it as object..

Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 09:32
Still stuck on this Wikipedia viewer, here is my third approach, getting no response whatsoever. Don't even know how to debug it
 $(document).ready(function(){
   $("#searchterm").keyup(function(e) {
        var q = $("#searchterm").val();
        $.getJSON("http://en.wikipedia.org/w/api.php?callback=?",
        {
          srsearch: q,
          action: "query",
          list: "search",
          format: "json"
        },
        function(data) {
          $("#results").empty();
          $("#results").append("Results for <b>" + q + "</b>");
          $.each(data.query.search, function(i,item){
   $("#results").append("<div><a href='http://en.wikipedia.org/wiki/" + encodeURIComponent(item.title) + "'>" + item.title + "</a>" + item.snippet + "</div>");
  });
   });
  });
  });
Bruce Young
@mutantspore
Apr 03 2016 09:36
@Itsdenty pen?
do you have jQuery added in?
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 09:41
@mutantspore I did here.http://codepen.io/itsdenty/pen/oxepBQ
Bruce Young
@mutantspore
Apr 03 2016 09:44
@Itsdenty ok well easy fix.. you don’t actually have anywhere for this to be shown on the web page
add in <p id="results"> </p> to your HTML
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 09:45
Okay, thanks @mutantspore I will do just that
CamperBot
@camperbot
Apr 03 2016 09:45
itsdenty sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1349 | @mutantspore | http://www.freecodecamp.com/mutantspore
走你飛艇
@gofighting123
Apr 03 2016 09:45
..............
Bruce Young
@mutantspore
Apr 03 2016 09:45
@Itsdenty wel that’s the min you need perhaps you’ll use a better html construct but that will get you going for now
走你飛艇
@gofighting123
Apr 03 2016 09:48
:yum:
走你飛艇
@gofighting123
Apr 03 2016 10:00
@sjames1958gm good morning....and good nite :yum:
走你飛艇
@gofighting123
Apr 03 2016 10:07
Stephen James
@sjames1958gm
Apr 03 2016 10:22
@gofighting123 Good evening
走你飛艇
@gofighting123
Apr 03 2016 10:23
@sjames1958gm AM5:23
Sun, 2016/4/3/ (GMT-5)
Stephen James
@sjames1958gm
Apr 03 2016 10:27
yep
走你飛艇
@gofighting123
Apr 03 2016 10:29
@sjames1958gm :satisfied:
khalsa777
@khalsa777
Apr 03 2016 10:46
@gofighting123 thankx
plz check and review the work http://codepen.io/khalsa777/full/GZMQPW/
Bruce Young
@mutantspore
Apr 03 2016 10:50
@khalsa777 Hi
I get TypeError: undefined is not an object (evaluating 'khap.val’) in the console. Also how do I tell if they are online or not?
@khalsa777 and this when I click on a name
Refused to display 'https://www.twitch.tv/ogamingsc2' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN’.
khalsa777
@khalsa777
Apr 03 2016 10:53
@mutantspore khap.val is returning 0 or 1 ... wirhout problem.. 1 implies online and so is prepended else appended
Bruce Young
@mutantspore
Apr 03 2016 10:53
@khalsa777 to fix that last one add target=“_blank” to your <a> URL … codepen needs it
@khalsa777 well it gives 8 errors in the console for me
the developer console
khalsa777
@khalsa777
Apr 03 2016 10:55
@mutantspore if khap.val were undefined then the online channels wouldn't have shown at top as they do
Bruce Young
@mutantspore
Apr 03 2016 10:56
ok well I’m just telling you what codepen thinks.. do you not see it?
khalsa777
@khalsa777
Apr 03 2016 10:56
@mutantspore well here at codepen console its not showing the issue
走你飛艇
@gofighting123
Apr 03 2016 10:56
@khalsa777 js oo style...it's fine..
Bruce Young
@mutantspore
Apr 03 2016 10:57
@khalsa777 use the actual browser developer console. codepen console is just for you to “send things to"
anyway.. your project ...
走你飛艇
@gofighting123
Apr 03 2016 10:59
@khalsa777 var khap = chalo.init(response, el); // without new ?
khalsa777
@khalsa777
Apr 03 2016 11:00
@gofighting123 yap its just normal function call, chalo is not a constructor
走你飛艇
@gofighting123
Apr 03 2016 11:00
@khalsa777 nope, js every function is object....and u wrote it like an object prototype..
@khalsa777 (evaluating 'khap.val’) undefined as @mutantspore said...
genuinegirl
@genuinegirl
Apr 03 2016 11:02
i need help with this challenge Create a Bootstrap Headline @camperbot
khalsa777
@khalsa777
Apr 03 2016 11:02
@gofighting123 will check khap.val when i get to chrome..
走你飛艇
@gofighting123
Apr 03 2016 11:03
@khalsa777 you wrote it like java :alien:
khalsa777
@khalsa777
Apr 03 2016 11:05
@gofighting123 nvr wrote a single java code so far
走你飛艇
@gofighting123
Apr 03 2016 11:07
@khalsa777 make your variable more readable...
khalsa777
@khalsa777
Apr 03 2016 11:07
@gofighting123 yap i know
:worried:
走你飛艇
@gofighting123
Apr 03 2016 11:11
@khalsa777 not bad coding ability...i think
@khalsa777 different from others using function programming but object prototype style.
@khalsa777 keep going :clap: Hail Hydra :alien:
khalsa777
@khalsa777
Apr 03 2016 11:14
@gofighting123 you are too flattery... :smile:
走你飛艇
@gofighting123
Apr 03 2016 11:14
@khalsa777 nope , it's truth.. if it's your coding style. not bad .
@khalsa777 it's kindof prototyping...
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 11:18
Finally through with my wiki viewer app http://codepen.io/itsdenty/full/oxepBQ/ might later come back to it to make it much better, but for now I will let it pass. On to that twitch project, but something tells me it's going to be much more tougher
走你飛艇
@gofighting123
Apr 03 2016 11:20
dinner time :yum:
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:39
I'm currently working on a API version of my Random Quote Generator(I already did an Array based version). In addition to the user stories I'm trying to add a "Previous Quote" button but I can't seem to get the logic right. The point of the button should be self-explanatory but the idea is for the user to be able to recall the previous quote after the user got a new quote. Any help on the matter would be greatly appreciated.
Stephen James
@sjames1958gm
Apr 03 2016 11:43
@CodeNeophyte Open up the devtools console - there are errors there that should help you.
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:44
i haven't used the devtools on codepen yet. how do you get to those?
Stephen James
@sjames1958gm
Apr 03 2016 11:45
devtools are part of your browser - which browser are you using.
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:46
ok. gotcha, the chrome devtools
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 11:46
Press f12 does the job if on chrome
Stephen James
@sjames1958gm
Apr 03 2016 11:46
yes
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:46
I been working through that
Abd-afeez Abd-hamid Adedamola
@Itsdenty
Apr 03 2016 11:46
Pressing
Stephen James
@sjames1958gm
Apr 03 2016 11:46
I usually have them open just enough to see errors in the console
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:46
but no success yet. I can see that the quoterArr is still empty
I've been coding it in sublime text first then passing it to codepen
Stephen James
@sjames1958gm
Apr 03 2016 11:48
Looks to me that your quoteArr is setup correctly
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:49
not sure exactly where my problem is but I think I could lie between not pushing correctly the quotes and author into the array and recalling it
Stephen James
@sjames1958gm
Apr 03 2016 11:49
This is in the chrome devtools console.
VM150833 pen.js:45 Uncaught ReferenceError: twitterBtn is not defined
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:51
its defined on line 38
not sure why devtools is not seeing it on your side
Stephen James
@sjames1958gm
Apr 03 2016 11:52
And that definition is available to all places that you use it (I am seeing this when I press the previous quote button)
CodeNeophyte
@CodeNeophyte
Apr 03 2016 11:59
weird....this thing is working now.
Stephen James
@sjames1958gm
Apr 03 2016 11:59
Only works once for me
nvm it seems to be working
But the tweet shows the wrong quote if you click it after pressing previous quote
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:02
so if you click new quote twice, it should bring back the first quote
of the two
Stephen James
@sjames1958gm
Apr 03 2016 12:03
Doesn't new quote just get a new random quote each time>
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:04
and it should only bring back one quote, which it seems to be doing.
yes, it should
Stephen James
@sjames1958gm
Apr 03 2016 12:05
So previous quote button should be disabled if there is no previous quote? When you first land on the page?
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:05
it wasn't working for me a few mins ago, not sure why it works now. but HA!
maybe. I haven't thought about that
let me refresh the page and see that it does
Stephen James
@sjames1958gm
Apr 03 2016 12:06
Try clicking tweet after you click previous
Panagiotis
@bohemian83
Apr 03 2016 12:07
Hey folks...I got a problem with the getDay function and unix time...
I am using the Dark Sky Forecast API
Stephen James
@sjames1958gm
Apr 03 2016 12:08
@bohemian83 What is your problem
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:08
@sjames1958gm I just did. it's sticking with the "new quote" regardless
Stephen James
@sjames1958gm
Apr 03 2016 12:08
@CodeNeophyte Yes. Maybe something related to that error.
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:09
@sjames1958gm thanks a lot for the help. Def two heads think better than one...quote of the day. ha
CamperBot
@camperbot
Apr 03 2016 12:09
codeneophyte sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 413 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Panagiotis
@bohemian83
Apr 03 2016 12:10
which also gives daily forecasts for the next week, every day was a unix timestamp...when I use those timestamps in my function I get some very weird results...like for timestamps that are different days (checked at a different site) I get the some day.
Stephen James
@sjames1958gm
Apr 03 2016 12:10
@CodeNeophyte Can I give you a piece of advice?
have a look
Stephen James
@sjames1958gm
Apr 03 2016 12:14
When I run it I get nothing back from the api
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:14
@sjames1958gm yes please
@sjames1958gm was tha for me or bohemian?
Stephen James
@sjames1958gm
Apr 03 2016 12:15
@CodeNeophyte bohemian
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:16
@sjames1958gm I found the problem. I had defined the variable twitterBtn inside the first function, so thats why the "oldQuote" function couldn't see it
Stephen James
@sjames1958gm
Apr 03 2016 12:16
@CodeNeophyte Code formatting is important esp. if you are asking others to look at your code. Maybe it is because you are pasting from sublime text.
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:16
now it should work fine
Stephen James
@sjames1958gm
Apr 03 2016 12:16
@CodeNeophyte Check!
@bohemian83 When I run it I get nothing back from the api
@gofighting123 Breakfast time
走你飛艇
@gofighting123
Apr 03 2016 12:18
....
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:18
@sjames1958gm agreed. I had not cleaned my code as I just pasted it. But i should be more careful as formatting goes a long ways
Panagiotis
@bohemian83
Apr 03 2016 12:18
Yeah, I know...I need to use a chrome extension to allow cross origin content sharing for it to work
CodeNeophyte
@CodeNeophyte
Apr 03 2016 12:20
@sjames1958gm not sure if you are tracking but codeine is coming up with their own homegrown console and devtools. Thats why I asked earlier
@sjames1958gm double thanks for sticking with with me. truly appreciate the help
CamperBot
@camperbot
Apr 03 2016 12:21
codeneophyte sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: codeneophyte already gave sjames1958gm points
Stephen James
@sjames1958gm
Apr 03 2016 12:26
@CodeNeophyte glad to help
genuinegirl
@genuinegirl
Apr 03 2016 12:41
i need help with============Add ID Attributes to Bootstrap Elements
Stephen James
@sjames1958gm
Apr 03 2016 12:41
@genuinegirl Where are you stuck?
@genuinegirl Is this one of the coding challenges, rather than a project?
genuinegirl
@genuinegirl
Apr 03 2016 12:41
i just dont get it all
coding challenges
Stephen James
@sjames1958gm
Apr 03 2016 12:43
They are wanting you to find the div that represents each of the two wells and give them the appropriate id property
genuinegirl
@genuinegirl
Apr 03 2016 12:43
could you paste the code please
i tried but i am getting wrong
Stephen James
@sjames1958gm
Apr 03 2016 12:44
@genuinegirl Can you post yours then I can see where you are missing it.
genuinegirl
@genuinegirl
Apr 03 2016 12:45
    <button class="btn btn-default target" id="right-well"></button>
走你飛艇
@gofighting123
Apr 03 2016 12:46
.................
Stephen James
@sjames1958gm
Apr 03 2016 12:46
@genuinegirl The button is not the well, but inside the well.
nsloc22
@nsloc22
Apr 03 2016 12:46
@genuinegirl I think that you don't understand english or are trolling
走你飛艇
@gofighting123
Apr 03 2016 12:47
@nsloc22 haha trolling....
genuinegirl
@genuinegirl
Apr 03 2016 12:48
i got it thansks @sjames1958gm
走你飛艇
@gofighting123
Apr 03 2016 12:49
@nsloc22 feel like playing LOL and someone is trolling :laughing:
nsloc22
@nsloc22
Apr 03 2016 12:50
could happen here
走你飛艇
@gofighting123
Apr 03 2016 12:51
@nsloc22 really....it's public place....
走你飛艇
@gofighting123
Apr 03 2016 12:59
i forgot a song , by a female singer , about 2~3 years , the last few part is "you are my sunshine" lyrics ...someone has any idea :yum:
走你飛艇
@gofighting123
Apr 03 2016 13:08
ok, it's kety perry , i founed it :yum:
Stephen James
@sjames1958gm
Apr 03 2016 13:08
Katy Perry
走你飛艇
@gofighting123
Apr 03 2016 13:10
This message was deleted
song name is The One That Got Away :yum:
a little sad...but...Heart-warming
grizzlyadams4725
@grizzlyadams4725
Apr 03 2016 13:26
guys I've been stuck on Random Quote Machine for a while... Did anyone just stick their JSON object inside their code? I was looking for a way to link a JSON API and pull from that, but I'm stuck on finding a way to do that...
Stephen James
@sjames1958gm
Apr 03 2016 13:27
A lot of people just stuck quotes in an array (I tried finding a useful API, but moved on)
grizzlyadams4725
@grizzlyadams4725
Apr 03 2016 13:27
That's what I was about to settle on
Stephen James
@sjames1958gm
Apr 03 2016 13:28
The next two projects will test your API ability so . . .
grizzlyadams4725
@grizzlyadams4725
Apr 03 2016 13:28
It didn't seem satisfying enough :P
that's good
走你飛艇
@gofighting123
Apr 03 2016 13:28
@grizzlyadams4725 https://en.wikipedia.org/wiki/Special:ApiSandbox make your own request :alien:
grizzlyadams4725
@grizzlyadams4725
Apr 03 2016 13:31
@gofighting123 that's pretty cool. Not entirely sure I understand it all the way, but this API thing is the first time I've truely been stumped to being disheartened the whole course
走你飛艇
@gofighting123
Apr 03 2016 13:32
@grizzlyadams4725 or try google "people quote api" ....
@grizzlyadams4725 learn google the things you want is more important...and good to you
@grizzlyadams4725 these service just like free to go service....i mean...it's too many out there..
@grizzlyadams4725 so, how make you different....from others..is the point...
Pawan
@pawan92
Apr 03 2016 13:53
stuck on wiki vierwer :/
Stephen James
@sjames1958gm
Apr 03 2016 13:53
@pawan92 Come to the right place ;)
走你飛艇
@gofighting123
Apr 03 2016 13:53
............
Pawan
@pawan92
Apr 03 2016 13:53
lol
i just seem to figure out if i have the correct api. and how to go about using it. http://codepen.io/pawan92/pen/zqzWYB
Angelos Spyratos
@spyratos
Apr 03 2016 13:58
hey guys can you tell me any suggestions and/or your opinion on my portfolio the way it is up untill now ? http://codepen.io/spyratos/full/YqrLZJ/
Stephen James
@sjames1958gm
Apr 03 2016 13:58
You need to attach a handler to your button
Pawan
@pawan92
Apr 03 2016 13:58
cant seem to*
Angelos Spyratos
@spyratos
Apr 03 2016 14:00
also please any suggestions on how to put the heart icon actually in the center of the navbar ? no matter the screen resolution ?
Stephen James
@sjames1958gm
Apr 03 2016 14:02
$(#"searchbutton").click(function() { getWiki($("inputsearch").val()); }
走你飛艇
@gofighting123
Apr 03 2016 14:04
@spyratos you put so many class to your #about me image....
Pawan
@pawan92
Apr 03 2016 14:08
@sjames1958gm ahh ok
how can i see the data from api so i know what im working with. its not outputting anything to console when i do that console statement
Bogdan3
@Bogdan3
Apr 03 2016 14:14
This message was deleted
走你飛艇
@gofighting123
Apr 03 2016 14:22
@spyratos and you should check the .navbar-brand css...it's flot:left...
Alex
@rollsthomas
Apr 03 2016 14:22
Hi guys. Can you look at my Check for Palindromes" solution?
I think my code is too messy. Especially when it comes to removing the non-letter characters on line 3.

function palindrome(str) {
var clear = str.replace(/\W?\s?_?/g,""); //removes spaces, puntuation, and underscore
var low = clear.toLowerCase();
var sep = low.split('');
var rev = sep.reverse();
var x = rev.join("");
if (low == x){
return true;
} else{
return false;
}
}

palindrome("");

走你飛艇
@gofighting123
Apr 03 2016 14:23
help format
CamperBot
@camperbot
Apr 03 2016 14:23

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Alex
@rollsthomas
Apr 03 2016 14:25

'''js

<function palindrome(str) {
// Good luck!
var clear = str.replace(/\W?\s?_?/g,""); //removes spaces, puntuation, and underscore
var low = clear.toLowerCase();
var sep = low.split('');
var rev = sep.reverse();
var x = rev.join("");
if (low == x){
return true;
} else{
return false;
}
}

palindrome("");>
'''

CamperBot
@camperbot
Apr 03 2016 14:25
:bulb: to format code use backticks! ``` more info
we7d
@we7d
Apr 03 2016 14:26
find palindrome
CamperBot
@camperbot
Apr 03 2016 14:26

find palindrome

:zero: algorithm check for palindromes

Alex
@rollsthomas
Apr 03 2016 14:27
Awesome. Thanks we7d
err... camperbot
Angelos Spyratos
@spyratos
Apr 03 2016 14:28
@gofighting123 what do you mean by saying that my friend ?
Alex
@rollsthomas
Apr 03 2016 14:28
Man that [\W_] for the Regular Expression really cleans up the search.
Angelos Spyratos
@spyratos
Apr 03 2016 14:28
@gofighting123 what do you suggest ?
走你飛艇
@gofighting123
Apr 03 2016 14:36
@spyratos http://codepen.io/gofighting123/pen/NNaoyv use another div and make a heartdiv class to fit your need by inspect the brand-nav class and hover css what bootstrap did.
Liz
@erbastian
Apr 03 2016 14:36
does the twitchtv example they give work ? If I click on actively broadcasting links and it just goes to twitch tv with the spinning wheel that goes on forever. and a ton of javascript console errors.
Michael Karpinski
@karpimpski
Apr 03 2016 14:37
working on the random quote machine and I'm not sure how to make the Twitter button automatically display whatever is in my quote HTML. anybody know how to do this?
Liz
@erbastian
Apr 03 2016 14:38
@karpimpski i think if you look at the api for twitter it tells you how to auto populate... let me go back and look at mine
@karpimpski yeah, go back and check the twitter documentation. it should tell you what additional query string you need to send in to have it autopopulate the quote
Michael Karpinski
@karpimpski
Apr 03 2016 14:39
where's the twitter documentation? you mean the developer section on Twitter?
Liz
@erbastian
Apr 03 2016 14:40
yeah
Michael Karpinski
@karpimpski
Apr 03 2016 14:40
@erbastian thanks! also, while you were doing that i checked out the Twitch project and it doesn't work when I run their example either
CamperBot
@camperbot
Apr 03 2016 14:40
karpimpski sends brownie points to @erbastian :sparkles: :thumbsup: :sparkles:
:star: 281 | @erbastian | http://www.freecodecamp.com/erbastian
Liz
@erbastian
Apr 03 2016 14:41
ok, great. so we're supposed to make an app that doesn't work. perfect. :smile:
im seeing if i can find the right docs for you to look at
Michael Karpinski
@karpimpski
Apr 03 2016 14:42
@erbastian technically supposed to be "functionally" similar, so seems like you can just turn in some HTML and CSS and be done with it
codercooooder
@codercooooder
Apr 03 2016 14:42
is anyone here pretty good with javascript and css?
Michael Karpinski
@karpimpski
Apr 03 2016 14:42
@codercooooder depends on what you want, but I'm pretty familiar with all of it
codercooooder
@codercooooder
Apr 03 2016 14:42
ok so look here then..
@karpimpski here is a circleclip path that i have working, that is fine: http://codepen.io/ihatecoding/pen/GZMzQq
Angelos Spyratos
@spyratos
Apr 03 2016 14:43
@gofighting123 that way the heart floats on left and its not centered... You mean going custom like measuring which % should the padding-left attribute have ? or what ?
Michael Karpinski
@karpimpski
Apr 03 2016 14:44
@codercooooder well that are you trying to make it do? whenever I click rerun it just reloads the page
codercooooder
@codercooooder
Apr 03 2016 14:44
what I want to do is have text animate around it, and I almost have it working. The problem, the function is messing with the other image in the same svg, and I want to leave it alone. Here is the messed up thing. again, I want the pic centered, and the text moving http://codepen.io/ihatecoding/pen/LNzqLK @karpimpski
走你飛艇
@gofighting123
Apr 03 2016 14:44

@spyratos

  position: absolute;
  top: 0px;
  left: 50%;

i check it on the google...for you :alien: add it to the heartdiv css style...and change the font-color to #fff and hover style...see?

Angelos Spyratos
@spyratos
Apr 03 2016 14:45
@gofighting123 oopsi ! soz my friend! i could not understand :P I ll check on it right now thanks a lot !
CamperBot
@camperbot
Apr 03 2016 14:45
spyratos sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
codercooooder
@codercooooder
Apr 03 2016 14:45
@karpimpski can you tell me how to either exclude the image from the js function, or how to have two overlapping svgs, one that the function takes as input , and another which it leaves alone?
CamperBot
@camperbot
Apr 03 2016 14:45
:star: 298 | @gofighting123 | http://www.freecodecamp.com/gofighting123
Michael Karpinski
@karpimpski
Apr 03 2016 14:45
@codercooooder wait, so do you want the image to stay still and have the text go around it or do you want both the image and the text to move?
走你飛艇
@gofighting123
Apr 03 2016 14:46
@spyratos .............
codercooooder
@codercooooder
Apr 03 2016 14:46
@karpimpski just the text moving
@karpimpski i liked the images as it was (and no this is not my real content ok, im not into pink butterflies)
走你飛艇
@gofighting123
Apr 03 2016 14:46
@spyratos you mean....my bad english let you mis-understand my explaination ? :alien:
Michael Karpinski
@karpimpski
Apr 03 2016 14:47
@codercooooder okay, well it seems like the easiest way would be to make sure that they have separate HTML divs and just affect the text div, with its own ID
走你飛艇
@gofighting123
Apr 03 2016 14:47
echo Hail Hydra !
CamperBot
@camperbot
Apr 03 2016 14:47
@gofighting123 said: echo Hail Hydra !
codercooooder
@codercooooder
Apr 03 2016 14:47
but can they overlap?
Angelos Spyratos
@spyratos
Apr 03 2016 14:47
@gofighting123 niaaaah :P :alien: (Ayy Lmao)
Michael Karpinski
@karpimpski
Apr 03 2016 14:47
do you mean the img div and the text div? @codercooooder
codercooooder
@codercooooder
Apr 03 2016 14:48
@karpimpski yeah, do i do relative positioning?
@karpimpski i haven't used it much
Michael Karpinski
@karpimpski
Apr 03 2016 14:48
@codercooooder you should do relative positioning, yeah. just make sure the text is wrapped in its own div with a unique id so that the JavaScript only affects that
Liz
@erbastian
Apr 03 2016 14:49
@karpimpski try this page: https://dev.twitter.com/web/tweet-button
codercooooder
@codercooooder
Apr 03 2016 14:49
ok, let me look up relative positioning
@karpimpski thanks
CamperBot
@camperbot
Apr 03 2016 14:49
codercooooder sends brownie points to @karpimpski :sparkles: :thumbsup: :sparkles:
:star: 274 | @karpimpski | http://www.freecodecamp.com/karpimpski
Michael Karpinski
@karpimpski
Apr 03 2016 14:49
@erbastian awesome, thanks!
CamperBot
@camperbot
Apr 03 2016 14:49
karpimpski sends brownie points to @erbastian :sparkles: :thumbsup: :sparkles:
:warning: karpimpski already gave erbastian points
Sameer Shamsudeen
@sameershamsudheen
Apr 03 2016 14:53
which value measurement is better for margin pxor % or em ?
走你飛艇
@gofighting123
Apr 03 2016 14:54
vh,vw @sameershamsudheen
@sameershamsudheen google css3 vh vw
Stephen James
@sjames1958gm
Apr 03 2016 14:55
@rollsthomas To avoid having to name all those vars rev = low.split('').reverse().join('');
走你飛艇
@gofighting123
Apr 03 2016 14:55
css4 is coming.....soon :alien:
Stephen James
@sjames1958gm
Apr 03 2016 14:56
@rollsthomas Alos if you are returning a boolean return rev === low
codercooooder
@codercooooder
Apr 03 2016 14:57
@karpimpski can you help me I'm almost there, I have the separate divs, can you tell me how to edit the css to get them to overlap?: http://codepen.io/ihatecoding/pen/EKwrRJ
Michael Karpinski
@karpimpski
Apr 03 2016 14:59
@codercooooder I can try to help more later, for now I don't have time to go through your code. but maybe you could change the relative pos to make the image get closer, or just use absolute pos and keep the text moving the way it is
by absolute pos, i mean use that to move the image up to where you want it
codercooooder
@codercooooder
Apr 03 2016 14:59
@karpimpski it is ok if you are busy.
Can someone else tell me how to use relative position to get stuff to overlap?
Pawan
@pawan92
Apr 03 2016 15:07
ok so im getting some random data when i hit the search button. i dont think i have the correct api..can someone tell me if that is the case or its something else? http://codepen.io/pawan92/pen/zqzWYB?editors=1111
Stephen James
@sjames1958gm
Apr 03 2016 15:08
@pawan92 Assuming you typed 'test' in your search box that is not really random data those are probably article titles
Pawan
@pawan92
Apr 03 2016 15:09
@sjames1958gm i didnt type test tho haha. even if i dont type anything and hit search thats what i get
Stephen James
@sjames1958gm
Apr 03 2016 15:09
You have search=test in your URL need to replace test with your value
Michael Karpinski
@karpimpski
Apr 03 2016 15:09
<a class="twitter-share-button" href="https://twitter.com/share" data-size="large" data-url="https://dev.twitter.com/web/tweet-button" data-via="twitterdev" data-related="twitterapi,twitter" data-hashtags="example,demo" data-text="custom share text">
Tweet
</a>
here is the code for my twitter button. it's not styled correctly, and it doesn't even share correctly for the example, which I copied and pasted
can anybody help
link so it's easier to see
走你飛艇
@gofighting123
Apr 03 2016 15:10
help topic
CamperBot
@camperbot
Apr 03 2016 15:10

:point_right: topic [wiki]

This is an example. You should replace topic with the thing you want to find info on.
For example:

wiki css    # find a wiki page on css
find js     # find all pages related to css

:pencil: read more about topic on the FCC Wiki

Michael Karpinski
@karpimpski
Apr 03 2016 15:11
help twitter
CamperBot
@camperbot
Apr 03 2016 15:11
no wiki entry for: twitter
Michael Karpinski
@karpimpski
Apr 03 2016 15:11
help tweet
CamperBot
@camperbot
Apr 03 2016 15:11
no wiki entry for: tweet
Stephen James
@sjames1958gm
Apr 03 2016 15:12
I opened the devtools console - you may not be able to use that link in codepen
Pawan
@pawan92
Apr 03 2016 15:12
@sjames1958gm so need a different format of that api?
Stephen James
@sjames1958gm
Apr 03 2016 15:14
@pawan92 You just need to make the search string a variable --- "search=" + valfrominput + "
Dardan Demiri
@dardandemiri
Apr 03 2016 15:19
I Programmers
Hi
*
:P
走你飛艇
@gofighting123
Apr 03 2016 15:19
....
Pawan
@pawan92
Apr 03 2016 15:19
@sjames1958gm im getting undefined hmm
Michael Karpinski
@karpimpski
Apr 03 2016 15:19
@gofighting123 that works, thank you! now how do I auto-populate it with the HTML that is currently on my page?
CamperBot
@camperbot
Apr 03 2016 15:19
karpimpski sends brownie points to @gofighting123 :sparkles: :thumbsup: :sparkles:
:star: 299 | @gofighting123 | http://www.freecodecamp.com/gofighting123
Dardan Demiri
@dardandemiri
Apr 03 2016 15:20
Does anyone has an idea how to know the full list of the Weather Main value
"weather":[{"id":804,"main":"clouds",
"weather":[{"id":805,"main":"sun",
etc ?
走你飛艇
@gofighting123
Apr 03 2016 15:20
@karpimpski you mean modify author's code to yours?
Dardan Demiri
@dardandemiri
Apr 03 2016 15:21
I am interested to know it because I will rename my Icons to the name the api returns.
So for example if it is clouds.
the icon will be an image with sun and clouds.
clouds.png
Michael Karpinski
@karpimpski
Apr 03 2016 15:21
no, I've already modified it to make it look how I want. now I just want the Tweet to automatically contain whatever is in my quote @gofighting123
走你飛艇
@gofighting123
Apr 03 2016 15:21
@karpimpski use jq change the attr , and ?
Stephen James
@sjames1958gm
Apr 03 2016 15:22
@pawan92 Dump out your URL that you create and see if it looks correct, if not work backwards to where undefined might be coming
走你飛艇
@gofighting123
Apr 03 2016 15:23
@karpimpski $(".twitter-share-button").attr("href", quot);
Stephen James
@sjames1958gm
Apr 03 2016 15:23
@adzam5 Good Link! Thanks
走你飛艇
@gofighting123
Apr 03 2016 15:24
@karpimpski it works?
Michael Karpinski
@karpimpski
Apr 03 2016 15:24
@gofighting123 where do I put that snippet? anywhere in my JS code?
走你飛艇
@gofighting123
Apr 03 2016 15:24
@karpimpski after you get the quote, and then do it...
Michael Karpinski
@karpimpski
Apr 03 2016 15:26
@gofighting123 I'm having trouble because I named things differently. I don't know where he's getting data.quoteText and data.quoteAuthor from
I know where it comes from in his code, but I don't know how to rename it to fit mine
走你飛艇
@gofighting123
Apr 03 2016 15:26
@karpimpski ....
@karpimpski that's just ....variable...and jquery.... :alien:
@karpimpski show me the code :alien:
走你飛艇
@gofighting123
Apr 03 2016 15:29
@karpimpski u need to get know JQ first....
Michael Karpinski
@karpimpski
Apr 03 2016 15:29
@gofighting123 I know JQuery
Pawan
@pawan92
Apr 03 2016 15:30
@sjames1958gm thanks let me try that
Dardan Demiri
@dardandemiri
Apr 03 2016 15:30
@adzam5 Thank you for that URL
CamperBot
@camperbot
Apr 03 2016 15:30
dardandemiri sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 378 | @adzam5 | http://www.freecodecamp.com/adzam5
走你飛艇
@gofighting123
Apr 03 2016 15:32
@karpimpski u have
<a class="twitter-share-button" href="https://twitter.com/intent/tweet" data-size="large" target="_blank">
and give it a id then change the snippet to
$("#id").attr("href", quot);
see ?
wait...
$(".twitter-share-button").attr("href", quot);
it 's right code...
Michael Karpinski
@karpimpski
Apr 03 2016 15:34
yeah, i already had the class in my <a> tag and used that in mine
走你飛艇
@gofighting123
Apr 03 2016 15:34
@karpimpski so u read the page JS part ?
@karpimpski
$(document).ready(function() {
  $.getJSON(url, getQuote, 'jsonp');

});
$("#quote").click(function() {
  $.getJSON(url, getQuote, 'jsonp');
});
Michael Karpinski
@karpimpski
Apr 03 2016 15:35
yeah, I copied his function for adding the text to the Twitter link, I'm just trying to name all of my properties properly
走你飛艇
@gofighting123
Apr 03 2016 15:35
these trigger the getQuote function object.
@karpimpski don't just copy and paste....that won't help
Michael Karpinski
@karpimpski
Apr 03 2016 15:36
@gofighting123 I honestly am just completely lost. I get all the concepts, I just already have a lot of code and I'm not sure about how to rename everything and get it to all work together without starting over again from scratch
走你飛艇
@gofighting123
Apr 03 2016 15:37
@karpimpski to re struct your own code it's hard i know...
Jeff
@adzam5
Apr 03 2016 15:42
@karpimpski This code works if you move it into your button click funciton.
var quot = 'https://twitter.com/intent/tweet?text=' + quote[quoteNumber] + ' Author ' + source[quoteNumber] + '';
$(".twitter-share-button").attr("href", quot);
走你飛艇
@gofighting123
Apr 03 2016 15:43
@adzam5 u just fix it for him.....that's too kind....
Michael Karpinski
@karpimpski
Apr 03 2016 15:45
@adzam5 I must be really dumb. I put it in my button click function, but when I click the Tweet button is still returns blank
走你飛艇
@gofighting123
Apr 03 2016 15:45
.............
Michael Karpinski
@karpimpski
Apr 03 2016 15:45
@adzam5 well now it puts in "undefined Author unefined"
Jeff
@adzam5
Apr 03 2016 15:46
@karpimpski Did you modify the url in var quot like I did above?
Michael Karpinski
@karpimpski
Apr 03 2016 15:47
@adzam5 I just copied it to see if it works. should I modify anything in it?
走你飛艇
@gofighting123
Apr 03 2016 15:47
@karpimpski you have no jq.ready part....
Jeff
@adzam5
Apr 03 2016 15:48
@karpimpski If you copied the code I pasted, no it doesn't need to be modified.
@karpimpski Can you post a new link so I can see your code?
Michael Karpinski
@karpimpski
Apr 03 2016 15:49
@adzam5 I copied it to the bottom, but it uses the quote before the current quote. here's the new link:
Jeff
@adzam5
Apr 03 2016 15:50
@karpimpski It's working for me with the current quote
Michael Karpinski
@karpimpski
Apr 03 2016 15:50
@adzam5 nevermind, it's working now. could you explain how that works? for example, how the HTML link knows to use the JS link and that .attr is?
what*
@adzam5 does the JS change my link, using the class identifier, to include the new variable quot, using the attr method?
Jeff
@adzam5
Apr 03 2016 15:52
@karpimpski Exactly
Michael Karpinski
@karpimpski
Apr 03 2016 15:52
@adzam5 great! I understand it now, thanks so much!
CamperBot
@camperbot
Apr 03 2016 15:52
karpimpski sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 379 | @adzam5 | http://www.freecodecamp.com/adzam5
Jeff
@adzam5
Apr 03 2016 15:52
no problem
codercooooder
@codercooooder
Apr 03 2016 15:55
anyone here a vertical centering master?
@karpimpski i almost did it: http://codepen.io/ihatecoding/pen/ONxdag
Arjun Narayanan
@anarayanan86
Apr 03 2016 15:55
hey i just needed a clarification for the random quote machine assignment
are we supposed to pull quotes from a website like wikiquotes
codercooooder
@codercooooder
Apr 03 2016 15:56
@karpimpski the last issue is vertical centering.. I tried using tough "bleeper" but it failed:http://mystrd.at/tough-fucker-the-ultimate-css2-vertical-centering-monster/
Arjun Narayanan
@anarayanan86
Apr 03 2016 15:56
or are they manually entered into the code
Michael Karpinski
@karpimpski
Apr 03 2016 15:56
@anarayanan86 you can use whatever quotes
@codercooooder not sure about vertical centering, I just do it using my eye usually
I never really needed it too much so far, so I haven't looked into it
codercooooder
@codercooooder
Apr 03 2016 15:56
@karpimpski really?? so lazy!!
hahah
can anyone vertically center the moving text on the other div?
Michael Karpinski
@karpimpski
Apr 03 2016 15:57
@codercooooder you may be able to use JS to get the size of the screen and divide it by 2, might want to try googling that
codercooooder
@codercooooder
Apr 03 2016 15:57
i want to avoid js if possible
Coira Ellison
@Coira
Apr 03 2016 15:57
have you looked into flex-box?
Michael Karpinski
@karpimpski
Apr 03 2016 15:57
@codercooooder there may be something with CSS like that, or maybe you can use something like margin auto with top and bottom margins
codercooooder
@codercooooder
Apr 03 2016 15:57
@Coira i've been tring to avoid it but this might be the time to give in
走你飛艇
@gofighting123
Apr 03 2016 15:58
i should use more time on reading but chat...
Coira Ellison
@Coira
Apr 03 2016 15:58
it'd be something like this in css if you used it
.outerdiv {
display: flex;
justify-content: center;
align-items: center; (i forget whether to use justify-content or align-items)
}
then whatever you want centered you'd put inside the outerdiv
oh, and flex-direction: column;
codercooooder
@codercooooder
Apr 03 2016 16:01
lol @karpimpski the top and bottom made the vertical ailgnment ok, then threw horizontal off. hahahah: waaaaaiii? http://codepen.io/ihatecoding/pen/ONxdag
Michael Karpinski
@karpimpski
Apr 03 2016 16:02
@codercooooder I'd recommend going into the flex-box then. you'll have to learn a little bit, but it's a lot simpler
codercooooder
@codercooooder
Apr 03 2016 16:03
@karpimpski really im so close though look!!!
@karpimpski sooooo close
Michael Karpinski
@karpimpski
Apr 03 2016 16:03
@codercooooder yeah you're really getting there, but to get all the way it'd be simpler to use flex-box, or at least try. that way you can learn it too
codercooooder
@codercooooder
Apr 03 2016 16:04
i will learn flex box, but I would like it if this element didn't have it,
@karpimpski im more than getting there. i just need horizontal centering and i'm finito
@karpimpski whole thing is beautifully responsive
Michael Karpinski
@karpimpski
Apr 03 2016 16:05
@codercooooder okay, well try to use the auto margins for top and bottom, then other margins for left and right until you get it to where you want it
codercooooder
@codercooooder
Apr 03 2016 16:06
can you type in the css so i know the syntax
margin-top: auto
like that?
@karpimpski i think i know what you meant
Michael Karpinski
@karpimpski
Apr 03 2016 16:09
i would do something like this:
margin-top: auto;
margin-bottom: auto; (unless margin-top centers it by itself)
margin-left: whatever you want;
margin-right: whatever you want;
that should fix the issue of margin-top messing with your horizontal positioning
Jared Abel
@jaredabel
Apr 03 2016 16:10
can anyone help me with a function for my tic tac toe?
codercooooder
@codercooooder
Apr 03 2016 16:12
you mean on the children divs,right? @karpimpski
Michael Karpinski
@karpimpski
Apr 03 2016 16:13
@codercooooder like I said I don't have time to look at your code right now, but just put that CSS in whatever id you have for your image and text, whichever you're trying to vertically position
codercooooder
@codercooooder
Apr 03 2016 16:13
@karpimpski i fixed it:
@karpimpski it was the svg viewbox that was messed up
Michael Karpinski
@karpimpski
Apr 03 2016 16:14
@codercooooder using the border method, that's what I do! looks great
codercooooder
@codercooooder
Apr 03 2016 16:14
@karpimpski i learned it here.
@karpimpski thank you
CamperBot
@camperbot
Apr 03 2016 16:14
codercooooder sends brownie points to @karpimpski :sparkles: :thumbsup: :sparkles:
:star: 275 | @karpimpski | http://www.freecodecamp.com/karpimpski
Michael Karpinski
@karpimpski
Apr 03 2016 16:15
does anybody know how to change the default Twitter button background color? I tried doing it in my CSS and I tried tagging it as !important, using the id, etc. the background color won't change until I click the New Quote button
codercooooder
@codercooooder
Apr 03 2016 16:15
flexbox free dudes!!!!
Stephen James
@sjames1958gm
Apr 03 2016 16:18
@karpimpski Try taking off the btn-primary class
Michael Karpinski
@karpimpski
Apr 03 2016 16:19
@sjames1958gm where? my twitter button doesn't have a btn-primary class
nevermind, i'm blind
@sjames1958gm works great, thank you!
CamperBot
@camperbot
Apr 03 2016 16:19
karpimpski sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
Stephen James
@sjames1958gm
Apr 03 2016 16:19
@karpimpski :)
CamperBot
@camperbot
Apr 03 2016 16:19
:star: 414 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Michael Karpinski
@karpimpski
Apr 03 2016 16:23
is there a way to fix my Twitter sharing problem? whenever there is a semi-colon in a quote, it stops at the semi-colon
Jeff
@adzam5
Apr 03 2016 16:31
@karpimpski encodeURIComponent(quot)
Michael Karpinski
@karpimpski
Apr 03 2016 16:32
@adzam5 where should I put that?
I put it just below the quot declaration, but that didn't work
Jeff
@adzam5
Apr 03 2016 16:35
@karpimpski This should work
var quot = 'https://twitter.com/intent/tweet?text=' + encodeURIComponent(quote[quoteNumber]) + ' - ' + source[quoteNumber] + '';
Michael Karpinski
@karpimpski
Apr 03 2016 16:37
@adzam5 works like a charm, thanks again! would you mind explaining how it works? I'm assuming it does something similar to a backslash does in HTML
CamperBot
@camperbot
Apr 03 2016 16:37
karpimpski sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:warning: karpimpski already gave adzam5 points
Jeff
@adzam5
Apr 03 2016 16:39
@karpimpski It changes special characters such as quotes, semi-colons, exclamation points, etc to url compliant UTF-8 encoding
Michael Karpinski
@karpimpski
Apr 03 2016 16:45
one last question about my quote machine
I want it to fade like the example project. so what I do is, in my click/keydown functions I toggle the fade as soon as it clicks, then run the function to load a new quote and colors, then toggle fade after I call that. however, it doesn't work as expected. does anybody know how to make it fade out before it loads the new quote?
and also how to make the background color fade in and out?
Michael Karpinski
@karpimpski
Apr 03 2016 16:54
I think a good way to do this would be to delay the JQuery where I replace the text, but I don't know how to do that
Jeff
@adzam5
Apr 03 2016 16:55
@karpimpski Not sure if this is exactly what you are looking for, but...
document.getElementById('button').onclick = function() {
  $( ".container" ).fadeOut(500);
  setTimeout(function() { 
  newQuote();
  $( ".container" ).fadeIn(500);
  }, 500);
}
Michael Karpinski
@karpimpski
Apr 03 2016 16:56
@adzam5 that does the same thing for me. the text loads before it even fades out
I'd prefer for the text to load while it's faded out, then be ready for when it fades in
Jeff
@adzam5
Apr 03 2016 17:00
@karpimpski It shouldn't. .fadeOut(500) makes it take 500ms to fade out. Having newQuote(); within the setTimeout function is putting a 500ms delay on the new quote being triggered
@karpimpski Try removing the "500" from .fadeIn(500) and see if it works better
@karpimpski You can also play around with the numbers. The last "500" in my code above is setting how many ms before newQuote and the fade in are triggered
Michael Karpinski
@karpimpski
Apr 03 2016 17:03
@adzam5 works great! thanks for helping me out so much! do you know how I could apply that fade to the background as well?
CamperBot
@camperbot
Apr 03 2016 17:03
karpimpski sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:star: 380 | @adzam5 | http://www.freecodecamp.com/adzam5
Jeff
@adzam5
Apr 03 2016 17:09
@karpimpski No problem! There may be other ways to do it it but the way I know of for fading the background is a little trickier. You would have to apply your background colors to multiple divs that are layered on top of one another and animate the opacity.

Your code would be something like this:
HTML

<div id="bg-1"></div>
<div id="bg-2"></div>

CSS

#bg-1 {
position: absolute;
width: 100%;
height: 100%
top: 0;
left: 0;
z-index: -1;
}
#bg-2 {
position: absolute;
width: 100%;
height: 100%
top: 0;
left: 0;
z-index: -2;
}

JS

$('#bg-1').animate({opacity: 0}, 1000);
Michael Karpinski
@karpimpski
Apr 03 2016 17:18
@adzam5 thanks for the help again! not gonna do that for now, I might jump back into this project later. for now, what do you think of the finished product?
CamperBot
@camperbot
Apr 03 2016 17:18
karpimpski sends brownie points to @adzam5 :sparkles: :thumbsup: :sparkles:
:warning: karpimpski already gave adzam5 points
Jeff
@adzam5
Apr 03 2016 17:21
@karpimpski Glad I could help! Looks good!
I may have over complicated the fading background. What I suggested would give you a gradient change. To just fade out and in you have the right idea by applying it to the body tag. If you change the 500 to a higher value and apply it to .fadeIn() as well you may get more of the fade effect you are looking for
Paul Borawski
@iAmNawa
Apr 03 2016 17:27
@karpimpski looks good!
Pawan
@pawan92
Apr 03 2016 17:28
ive been trying to figure out why i get undefined data..but cant figure it out..can someone shed some light plz. http://codepen.io/pawan92/pen/zqzWYB?editors=1111
Jeff
@adzam5
Apr 03 2016 17:33
@pawan92 You are declaring input as a variable but never assigning a value to it
Pawan
@pawan92
Apr 03 2016 17:40
@adzam5 why would input need to be defined. sorry not understanding this whole api-jquery stuff :/
Jeff
@adzam5
Apr 03 2016 17:41
@pawan92 Never mind. It will work the way you have it. You are just missing "#" before inputsearch when you call getWiki
Pawan
@pawan92
Apr 03 2016 17:42
@adzam5 ohh it works now. get the right data!! finally progress. got to classify them i guess
thanks
Jeff
@adzam5
Apr 03 2016 17:43
@pawan92 no problem
V Arun Kumar
@arunvkumr
Apr 03 2016 17:51
Hi.. i'm working on wikipedia challenge and this is the link i generated using api sandbox, when i open this in browser i prints the object, but when i try this in codepen it doesn't return anything. i don't understand what i'm doing wrong?
This is the link which i generated.
https://en.wikipedia.org/w/api.php?action=query&format=json&prop=extracts&pageids=&generator=search&exsentences=2&exlimit=10&exintro=1&explaintext=1&gsrsearch=apple
This is my pen.
http://codepen.io/arunkumrv/pen/vGmaaP?editors=0010
codercooooder
@codercooooder
Apr 03 2016 17:52
dudes a quick question, I had a cool thing with two overlapping divs (each had an svg in them). It worked in codepen. When i threw it into my actual page, the top svg /div was suddenly opaque and would no longer show the other one underneath it. Any ideas why this might happen?
nsloc22
@nsloc22
Apr 03 2016 17:54
@arunkumrv set dataType of your ajax request to jsonp
Stephen James
@sjames1958gm
Apr 03 2016 17:55
@arunkumrv If you open the devtools in the console you will see an same origin error. JSONP is a protocol that resolves this problem. Add &callback=? to your URL and see if you make progress Also google JSONP to learn more
nsloc22
@nsloc22
Apr 03 2016 17:55
there should be some hint in this exercise how to do this
so many ppl have problem with this
V Arun Kumar
@arunvkumr
Apr 03 2016 17:56
@sjames1958gm @nsloc22 thanks, will try this.
Stephen James
@sjames1958gm
Apr 03 2016 17:56
@nsloc22 I agree 100% - there should have been more on asynchronous as well
Dominic Lobban
@alkapwn3d
Apr 03 2016 18:11
how do I get an image to kind of fade in when it loads
instead of loading from top to bottom
V Arun Kumar
@arunvkumr
Apr 03 2016 18:14
@sjames1958gm @nsloc22 i just added &callback=?and it worked should i still set dataType to jsonp?
nsloc22
@nsloc22
Apr 03 2016 18:20
@arunkumrv
I was using .ajax
$.ajax({
  dataType: "jsonp",
  url: url,
  data: data,
  success: success
});
and didn't add callback and it worked for me
César
@ICesarI
Apr 03 2016 18:25
@nsloc22 but you need the callback if you want to see the response returned by the server.
nsloc22
@nsloc22
Apr 03 2016 18:27
I can see response but didn't specify callback in the url
success: function(data) {
//my code
}
might be not correct way of doing this but it works
César
@ICesarI
Apr 03 2016 18:34
@nsloc22, maybe is not necessary that parameter on that server.
nsloc22
@nsloc22
Apr 03 2016 18:35
when it's making the request it's adding jquery callback automatically to the url
César
@ICesarI
Apr 03 2016 18:37
@nsloc22. That's explain it, because I tried removing the parameter and didn't work on mine http://en.wikipedia.org/w/api.php?callback=JSONP_CALLBACK
V Arun Kumar
@arunvkumr
Apr 03 2016 18:40
This is what i have so far..
http://codepen.io/arunkumrv/pen/vGmaaP?editors=1011
one problem what i have is whenever i try to search for a new term it gets appended to the existing elements that makes sense as i'm only using append. is there a way to remove the elements and only display the new elements?
nvm i just found empty() function. which works.
Stephen James
@sjames1958gm
Apr 03 2016 18:44
@arunkumrv you can set the inner HTML attribute to empty string and that will delete all the contents
César
@ICesarI
Apr 03 2016 18:46
Yeah, that's better than append in this situation.
V Arun Kumar
@arunvkumr
Apr 03 2016 18:50
so which is better $("#comp").empty() or $("#comp").html("")?
@ICesarI @sjames1958gm
César
@ICesarI
Apr 03 2016 18:51
@arunkumrv, html method always change the inner HTML, so you don't need to clear that node, just replace the content with the new data.
V Arun Kumar
@arunvkumr
Apr 03 2016 19:21
i have completed wikipedia challenge :grinning:. feedback and suggestions please..
http://s.codepen.io/arunkumrv/debug/vGmaaP
Trevor Burns
@trevjburns
Apr 03 2016 19:27
@arunkumrv very nice! looks great
V Arun Kumar
@arunvkumr
Apr 03 2016 19:30
@trevjburns thanks :grinning:
CamperBot
@camperbot
Apr 03 2016 19:30
arunkumrv sends brownie points to @trevjburns :sparkles: :thumbsup: :sparkles:
:star: 284 | @trevjburns | http://www.freecodecamp.com/trevjburns
Dominic Lobban
@alkapwn3d
Apr 03 2016 19:49
evernote is my new favorite tool. I made a checklist with links to speed up development and a notebook for snippets that I like.
because my memory is dogshit
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:04
I'm working on the wiki viewer and can't seem to figure out how to send a valid request to the api. I keep getting XMLHttpRequest cannot load errors. Right now I'm just trying to send a request to http://en.wikipedia.org/wiki/Special:Random using JavaScript no jQuery.
Stephen James
@sjames1958gm
Apr 03 2016 20:05
@DanJFletcher A lot of people are having trouble with same origin problems.
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:05
@sjames1958gm What do you mean same origin?
Stephen James
@sjames1958gm
Apr 03 2016 20:07
@DanJFletcher The request coming from a different origin (domain)
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:07
I don't think I'm getting that error. This is what I get:
XMLHttpRequest cannot load http://en.wikipedia.org/wiki/Special:Random. Response for preflight is invalid (redirect)
Stephen James
@sjames1958gm
Apr 03 2016 20:07
@DanJFletcher That's not same.
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:08
This is what I've got so far:
function randomWiki() {
  var xmlhttp = new XMLHttpRequest();
  var url = 'http://en.wikipedia.org/wiki/Special:Random';

  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      //var json = JSON.parse(xmlhttp.responseText);
      document.getElementById("view").innerHTML = xmlhttp.response.Text;

      //myFunction(myArr);
    } else {
      console.log(xmlhttp.status);
    }
  };

  xmlhttp.open("GET", url);
  xmlhttp.setRequestHeader('Api-User-Agent', 'dannyjamesfletcher@gmail.com');
  xmlhttp.send();
From the documentation it seems the only thing I should have to do is send a user-agent header with my request for it to be valid. Unless I'm missing something crucial here
Stephen James
@sjames1958gm
Apr 03 2016 20:10
@DanJFletcher Many people are using jquery either $.ajax or $.getJSON
James Bond
@Dman89
Apr 03 2016 20:11
@DanJFletcher save urself time buddy, set random as alink
random api doesnt work as we like
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:11
@sjames1958gm I might try that then - I was hoping to make this a no jQuery project for the sake of a learning experience. But I've been stuck on such a seemingly trivial task for too long...
James Bond
@Dman89
Apr 03 2016 20:12
@DanJFletcher http://en.wikipedia.org/wiki/Special:Random if attached to an anchor is ez, but wont load as a api for some reason
even with right callback and api url
Stephen James
@sjames1958gm
Apr 03 2016 20:12
XMLHttpRequest - is a pretty hard interface without jquery - but for the random one dman89 is right
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:12
@Dman89 That's what I'm also trying to avoid.
hmm... dam
James Bond
@Dman89
Apr 03 2016 20:13

@DanJFletcher I imagine it is possible, I asked reddit, and they all said it isnt.

one guy said with getJSON with padding would work.

i did everything, it wouldnt work

Dan Fletcher
@DanJFletcher
Apr 03 2016 20:14
There has to be a way. It seems so ad hoc to do it the simple way
If I figure it out I'll definitely share :)
Stephen James
@sjames1958gm
Apr 03 2016 20:15
@DanJFletcher If it were me I would focus on the search API
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:16
yeah I'll probably do that for now - just so I can make some progress with this ;)
Stephen James
@sjames1958gm
Apr 03 2016 20:16
@DanJFletcher :+1:
Darrel Adams
@dadams-510
Apr 03 2016 20:17
Hi everyone!
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:19
@sjames1958gm So if I'm to use the search API using XMLHttpRequest what is it that's making it so hard for others? What's missing from the request that's not when using jQuery?
Stephen James
@sjames1958gm
Apr 03 2016 20:21
@DanJFletcher Jquery handles a lot of the details for you - getJSON for example, is a get request and it parses the json response and gives it to you in a single callback.
James Bond
@Dman89
Apr 03 2016 20:22
@DanJFletcher it has to do with the random api not having a callback=? in the url, and also being on a different domain than your codepen site
@DanJFletcher and you cant force the callback=? into the url, i tired lol
getJSON with padding
or
getJSONP
Dan Fletcher
@DanJFletcher
Apr 03 2016 20:24
@sjames1958gm @Dman89 OK thanks, both of you
CamperBot
@camperbot
Apr 03 2016 20:24
danjfletcher sends brownie points to @sjames1958gm and @dman89 :sparkles: :thumbsup: :sparkles:
:star: 354 | @dman89 | http://www.freecodecamp.com/dman89
:star: 417 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Islam Ibakaev
@dagman
Apr 03 2016 20:47
trying to redo quote machine app using React. Do you think the code is right? http://codepen.io/dagman/pen/yOzemP?editors=1010
David Weedmark
@DavidWeedmark
Apr 03 2016 20:58
@dagman I'm still learning react, but from what I can see your code looks great. (I'd remove the console.log now that you've got it running, but that's my only suggestion)
Alexis Santos
@alexislds
Apr 03 2016 21:11
Guys i need help can some one help me?
Darrel Adams
@dadams-510
Apr 03 2016 21:11
Hi @alexislds what do you need help with?
Alexis Santos
@alexislds
Apr 03 2016 21:12
Im trying to replace the color of Jumbotron , but it dont change man.... i am trying changing the .jumbotron or adding a class to the div and it dont change the background color =/
@dadams-510 help man plz D:
Jeff
@adzam5
Apr 03 2016 21:14

@alexislds

.jumbotron {
  background-color: myColor;
}

Should do it

Alexis Santos
@alexislds
Apr 03 2016 21:14
yea i make the same thing.
it dont work.
i dont know why. Bootstrap block on any way the changes?
Darrel Adams
@dadams-510
Apr 03 2016 21:15
Can you share your code @alexislds
?
Alexis Santos
@alexislds
Apr 03 2016 21:15
yes one second.
Jeff
@adzam5
Apr 03 2016 21:15
@alexislds Try adding !important after the color
David Weedmark
@DavidWeedmark
Apr 03 2016 21:16
I've had problems using bootstrap classes with my own CSS. what I've done for jumbotron is added an id to it and then specified the background color for that id @alexislds @adzam5
Alexis Santos
@alexislds
Apr 03 2016 21:17
ok.... this is weird... on codepin it changes the color of the background.
on the sublimetext dont
o.O
Wtf?
David Weedmark
@DavidWeedmark
Apr 03 2016 21:17
yeah. stuff like that
Jeff
@adzam5
Apr 03 2016 21:17
@alexislds Are you loading bootstrap.css before your custom css?
saralexia
@saralexia
Apr 03 2016 21:18
Hey guys, can anyone help me with a bootstrap issue? I have a row with 3 containers, and they all collapse into each other when I resize my window despite flex-wrap:wrap.
David Weedmark
@DavidWeedmark
Apr 03 2016 21:18
@saralexia link?
saralexia
@saralexia
Apr 03 2016 21:18
can I show you a code snippet? I'm writing it in sublime, not using codepen
David Weedmark
@DavidWeedmark
Apr 03 2016 21:19
why not?
saralexia
@saralexia
Apr 03 2016 21:19
<a name="code"></a>
    <div class="content-section-b container">
        <div class="row row-centered">
            <div class="col-lg-3 col-centered">>
                <div class="container text-center">
                    <img src="https://i2.wp.com/codepen.io/assets/avatars/user-avatar-512x512-e95b68f7d95e0e48bead22e5d64c95d9.png?ssl=1">
                    <h3><a href="http://codepen.io/catbrains/">Codepen</a></h3>
                    <p>Various webdesign projects for FreeCodeCamp</p>
                </div>
            </div>
            <div class="col-lg-3 col-centered">
                <div class="container text-center">
                    <img src="http://gabrielecirulli.github.io/2048/meta/og_image.png">
                    <h3><a href="http://saralexia.github.io/2048/">Github</a></h3>
                    <p>Personalization of the 2048 game</p>
                </div>
            </div>
            <div class="col-lg-3 col-centered">
                <div class="container text-center">
                    <img src="https://d2ujflorbtfzji.cloudfront.net/package-screenshot/3e7bb5e9-bb2b-4a2f-a7ba-d30d095a6650_scaled.jpg">
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <h3><a href="https://github.com/saralexia/space-shooter">Github</a></h3>
                    <p>A Unity spaceshooter tutorial in C#</p>
                </div>
            </div>
Everything looks fine in 100%, but when I resize my window, they all stack together into one
Matthew D.
@m4tty-d
Apr 03 2016 21:21
@saralexia Why are you using a container inside your columns?
saralexia
@saralexia
Apr 03 2016 21:21
I wasn't sure how else to add styling to each separate section. Should I just give them separate names?
Matthew D.
@m4tty-d
Apr 03 2016 21:22
Yes.
Jeff
@adzam5
Apr 03 2016 21:22
@saralexia You might get better results with col-xs-3