These are chat archives for FreeCodeCamp/HelpFrontEnd

24th
Nov 2017
it is responsive or not ?
Ken Haduch
@khaduch
Nov 24 2017 03:21
@1532j0004kg - I wanted to take a look but the debug view expired by the time I got to it - I don't think that they last very long if you aren't a pro user...
AleeeRaza
@AleeeRaza
Nov 24 2017 04:11
Hello, I am a newbie and just started freecodecamp yesterday but i am stuck at a point and unable to clear that challenge. I am unable to find my mistake in the code

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.smaller-image{
width: 100px;
}
</style>

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class: "smaller-image" img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Is there anyone who can help me?
Sorin Ruse
@sorinr
Nov 24 2017 04:26
@AleeeRaza <img class: "smaller-image" -> class="smaller-image" not class:
AleeeRaza
@AleeeRaza
Nov 24 2017 04:30
@sorinr Thank you very much
I dont know but i reloaded it and it worked, using same code
Anyways, thank you very much for your response
Highly appreciated :)
CamperBot
@camperbot
Nov 24 2017 04:30
aleeeraza sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1365 | @sorinr |http://www.freecodecamp.org/sorinr
Sorin Ruse
@sorinr
Nov 24 2017 04:31
@AleeeRaza welcome
Daniel Azmitia
@danazm
Nov 24 2017 05:52
sigh, does anyone know how to fix this? I seem to have written some code that bugs out the page. but if I kill the page, make a new tab and go back to the algorithm challenge, it looks like it's trying to execute the code as soon as the page loads and it freezes up again. can't get on that page now without it crashing. :worried:
Ghost
@ghost~56bd2077e610378809c105cd
Nov 24 2017 06:08
open a private browsing tab
and then open the page thats endless looping
@danazm
Danny McVey
@dannymcvey
Nov 24 2017 07:10
Trying to sharpen my HTML/CSS skills--if anybody needs help let me know.
chetanmahore
@chetanmahore
Nov 24 2017 07:11
sup dudes
anyone completed frontend curriculum and got a job
Long Nguyen
@longnt80
Nov 24 2017 09:00
@chetanmahore I did
texirv0203
@texirv0203
Nov 24 2017 09:39
hi,
  • I have a css issue.
  • when searchDateArea.length > 15 its working fine
  • but when searchDateArea.length < 8 its failing.
  • when its less than 8...I am seeing extra white block.
  • is there any way to fix for all screen.
  • providing whole code below

if ( $(window).width() > 739) { 
                //alert("I am here");
                $('.k-playerJumpingr-content').css({"height": "auto"});
                $('.k-playerJumpingr-content').css({"max-height": searchDateArea.length*70+"px"});
                $('.k-playerJumpingr-layout .k-playerJumpingr-times').eq(1).css({"height": "auto"});
                $('.k-playerJumpingr-layout .k-playerJumpingr-times').eq(1).css({"max-height": (searchDateArea.length*70)+"px"});
            }
            else {
                $('.k-playerJumpingr-content').css({"height": "auto"});
                $('.k-playerJumpingr-content').css({"max-height": searchDateArea.length*45+"px"});
                $('.k-playerJumpingr-layout .k-playerJumpingr-times').eq(1).css({"height": "auto"});
                $('.k-playerJumpingr-layout .k-playerJumpingr-times').eq(1).css({"max-height": (searchDateArea.length*45)+"px"});
            }
abraham anak agung
@padunk
Nov 24 2017 11:13
@texirv0203 try this media-query
tyjanii
@tyjanii
Nov 24 2017 11:56
hello guys, im working on a website for a mechanic shop for practise. please share your thoughts :) https://codepen.io/tyjanii/pen/MOrdyg?editors=1100
Kris Baillargeon
@krisb1220
Nov 24 2017 12:49

@tyjanii
Hey, nice start! I don't wanna nitpick your code too much because I know how that gets, but I will say just keep on doing these projects and learn a little bit every step of the way.

Just a word of advice:

if it has to do with styling the webpage => Use CSS

if it has to do with adding content/richness to the webpage => Use HTML

Sulaiman
@suli-g
Nov 24 2017 14:07
Hi everyone
Shaban
@klmlfl
Nov 24 2017 14:44
Hi.
I'm having a hard time getting this to run.. can someone tell me how I should edit it to get back results?:
<script> $(document).ready(function(){ $("#thought-generator").click(function(){ $.getJSON("https://www.reddit.com/r/showerthoughts/new.json", function(redditResults) { $("#st1").append(redditResults[0]["data"]["children"][0]["data"]["title"]); }); }); }); </script>
Stephen James
@sjames1958gm
Nov 24 2017 14:46
@tyjanii I might give the button some border-radius to round the borders. You have css for submit class but no-one is using that class
Maybe its the text color or the background - for me it is difficult to read the text over the background
@klmlfl the json is not a array, so redditResults[0] this is probably not selecting anything
I think you need redditResults.data.children[0].data.title
@klmlfl For this a site like jsbin is good as you can play with the js to find the data you are looking for
Shaban
@klmlfl
Nov 24 2017 14:52
It is an array.
An array of JSON objects.
Stephen James
@sjames1958gm
Nov 24 2017 14:53
When I go to that URL it is not an array
Shaban
@klmlfl
Nov 24 2017 14:53
Hmm.
The first thing I see is [
Stephen James
@sjames1958gm
Nov 24 2017 14:54
That is interesting the first thing I see is {
{"kind": "Listing", "data": {"modhash": "", "whitelist_status": "all_ads", "children":
Shaban
@klmlfl
Nov 24 2017 14:54
ohhh
Thank you!!
earlier the URL was this:
Stephen James
@sjames1958gm
Nov 24 2017 14:55
Ah, now that is an array
Shaban
@klmlfl
Nov 24 2017 14:56
sweet. I'm one step closer to solving this.
thank you so much for your help.
i was stuck on that for 4 hours
Stephen James
@sjames1958gm
Nov 24 2017 14:56
:+1:
Sulaiman
@suli-g
Nov 24 2017 16:34
What's the main benefit of using React Router over just regular React and window.location?
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 16:43
having a bit of a problem with my code

//Time to see if we can afford a new phone and how many we can buy
//have user input bank balance
var bankAcc;
bankAcc = prompt("Enter whats in your bank account please: ");
console.log(bankAcc);
var phonePrice = 79.99;
console.log(phonePrice);
//whats is the tax rate
const TAX_RATE = 0.08;
//how much for accessories
const ACCESSORY_PRICE = 9.99;
//how much do you plan to spend
const SPENDING_THRESHOLD = prompt("How much do you plan to spend today?: ");
//do we have enough
if (bankAcc >= phonePrice) {
//if so do we want accessories
var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
if (extras==="Yes"||"yes"){
console.log(extras);
//how much before tax
var total_before_tax = phonePrice + ACCESSORY_PRICE;
total_before_tax = total_before_tax.toFixed(2);
//think of the cost
var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
// how much it will leave them with not countiing tax
var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
console.log(purchase);
}

}
trying to get the block of code only to run if the user input is "yes" or "Yes" but it runs even if they enter "no" or "No"

Moisés Man
@moigithub
Nov 24 2017 17:03

@Astewart400
typeof(prompt("xx"))

"string"

Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:04
?
so since its a string it cant check for the exact value I want
Moisés Man
@moigithub
Nov 24 2017 17:04
if u wanna enter NUMBERS values.. u need to transform into numbers.. cuz prompt returns strings
for yes and all its variants transform to upper or lower case.. so it work with Yes yes YES yEs and any variation u can think of
if( extras.toUpperCase() === "YES") ....
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:06
ok
let me try it
Moisés Man
@moigithub
Nov 24 2017 17:08

"11">"2"

false

Number("11") > Number("2")

true

Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:10
so I got it to work but I wasn't trying to compare numbers but to make sure the block only ran if the user typed yes
like if theytyped no the block wont run
what was happening was the block would run anyway
Sulaiman
@suli-g
Nov 24 2017 17:10
instead of if( extras.toUpperCase() === "YES"), you could use if (extras.match(/yes/i)
regular expressions are the shiznit.
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:11
lol I was trying to avoid that
but I y have to because using just the if it wont run the block
Sulaiman
@suli-g
Nov 24 2017 17:14

could you edit your code above and copy and paste it between sets of 3 backticks :
`
code
`

(I put spaces between the backticks so it doesn't look like

this (now you can't see the backticks)
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:14
ok yea

~~~//Time to see if we can afford a new phone and how many we can buy
//have user input bank balance
var bankAcc;
bankAcc = prompt("Enter whats in your bank account please: ");
console.log(bankAcc);
var phonePrice = 79.99;
console.log(phonePrice);
//whats is the tax rate
const TAX_RATE = 0.08;
//how much for accessories
const ACCESSORY_PRICE = 9.99;
//how much do you plan to spend
const SPENDING_THRESHOLD = prompt("How much do you plan to spend today?: ");
//do we have enough
if (bankAcc >= phonePrice) {
//if so do we want accessories
var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
if (extras.toLowerCase() === "YES"){
console.log(extras);
//how much before tax
var total_before_tax = phonePrice + ACCESSORY_PRICE;
total_before_tax = total_before_tax.toFixed(2);
//think of the cost
var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
// how much it will leave them with not countiing tax
var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
console.log(purchase);
}

}
~~~

Sulaiman
@suli-g
Nov 24 2017 17:15
` <- I think you were holding [Shift]
AbrisM
@AbrisM
Nov 24 2017 17:16
What does P Class stand for?
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:16

```//Time to see if we can afford a new phone and how many we can buy
//have user input bank balance
var bankAcc;
bankAcc = prompt("Enter whats in your bank account please: ");
console.log(bankAcc);
var phonePrice = 79.99;
console.log(phonePrice);
//whats is the tax rate
const TAX_RATE = 0.08;
//how much for accessories
const ACCESSORY_PRICE = 9.99;
//how much do you plan to spend
const SPENDING_THRESHOLD = prompt("How much do you plan to spend today?: ");
//do we have enough
if (bankAcc >= phonePrice) {
//if so do we want accessories
var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
if (extras.toLowerCase() === "YES"){
console.log(extras);
//how much before tax
var total_before_tax = phonePrice + ACCESSORY_PRICE;
total_before_tax = total_before_tax.toFixed(2);
//think of the cost
var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
// how much it will leave them with not countiing tax
var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
console.log(purchase);
}

}
```

Sulaiman
@suli-g
Nov 24 2017 17:16
okay - no just move the comment down a line (backticks on their own line) -
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:17
//Time to see if we can afford a new phone and how many we can buy
//have user input bank balance
var bankAcc;
bankAcc = prompt("Enter whats in your bank account please: ");
console.log(bankAcc);
var phonePrice = 79.99;
console.log(phonePrice);
//whats is the tax rate
const TAX_RATE = 0.08;
//how much for accessories
const ACCESSORY_PRICE = 9.99;
//how much do you plan to spend
const SPENDING_THRESHOLD = prompt("How much do you plan to spend today?: ");
//do we have enough
if (bankAcc >= phonePrice) {
  //if so do we want accessories
  var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
  if (extras.toLowerCase() === "YES"){
    console.log(extras);
    //how much before tax
    var total_before_tax = phonePrice + ACCESSORY_PRICE;
    total_before_tax = total_before_tax.toFixed(2);
    //think of the cost
    var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
    // how much it will leave them with not countiing tax
    var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
    console.log(purchase);
  }


}
Sulaiman
@suli-g
Nov 24 2017 17:18

help.png

also, you can edit the message in place by clicking the 3 dots on the right of the screen

Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:20
that's was helpful for future posts lol
AbrisM
@AbrisM
Nov 24 2017 17:22
https://codepen.io/anon/pen/vWrVKE Can someone tell me why this code won't run directly via website?
Moisés Man
@moigithub
Nov 24 2017 17:25
@suli-g @Astewart400 yea u can use regex.. but regex is slower than toUpperCase (which probably u wont notice on that code)
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:26
when I used `
Sulaiman
@suli-g
Nov 24 2017 17:27
Thanks @moigithub I always thought it was the other way around - by the ways, do you have a reference to Complexity comparisons for JS?
CamperBot
@camperbot
Nov 24 2017 17:27
suli-g sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 3717 | @moigithub |http://www.freecodecamp.org/moigithub
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:28
when I used
if (extras.toLowerCase() === "YES")
the code didn't run I will give it another try I'm just stomped at whats preventing it from running so I can fix learn from this

this is whats I used after talking to @suli-g
```var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
extras = extras.toLowerCase();
if (extras.match(/yes/i)){
console.log(extras);
//how much before tax
var total_before_tax = phonePrice + ACCESSORY_PRICE;
total_before_tax = total_before_tax.toFixed(2);
//think of the cost
var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
// how much it will leave them with not countiing tax
var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
console.log(purchase);
}
else{
var not_today = alert("so that will be " + phonePrice + ".");
}

}
```

var extras = prompt("Would you like to buy an accessory? Enter Yes or No: ");
  extras = extras.toLowerCase();
  if (extras.match(/yes/i)){
    console.log(extras);
    //how much before tax
    var total_before_tax = phonePrice + ACCESSORY_PRICE;
    total_before_tax = total_before_tax.toFixed(2);
    //think of the cost
    var make_purchase = alert("So that will be "+ phonePrice + " + " + ACCESSORY_PRICE + " for a total of " + total_before_tax);
    // how much it will leave them with not countiing tax
    var purchase = bankAcc - phonePrice - ACCESSORY_PRICE;
    console.log(purchase);
  }
else{
    var not_today = alert("so that will be " + phonePrice + ".");
  }

}
Moisés Man
@moigithub
Nov 24 2017 17:30
@Astewart400 what toLOWERcase do ??
Sulaiman
@suli-g
Nov 24 2017 17:31
@Astewart400 you made it to lowercase, but you're comparing it to an uppercase string
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:31
ah
lmao idiotic of me
can one of you try running the code because my desired results isn't happening with the
.toUpperCase()
I had removed to regex and used just the if (extras.toUppercase() ==="YES";
Antonious Stewart
@Antonious-Stewart
Nov 24 2017 17:43
haha thanks @moigithub @suli-g for the help I final saw what I was doing wrong
CamperBot
@camperbot
Nov 24 2017 17:43
astewart400 sends brownie points to @moigithub and @suli-g :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @suli-g |http://www.freecodecamp.org/suli-g
:star2: 3718 | @moigithub |http://www.freecodecamp.org/moigithub
AbrisM
@AbrisM
Nov 24 2017 18:18
https://codepen.io/anon/pen/XzYxvv Can someone tell me why the code won't run directly on a website instead of a IDE?
Moisés Man
@moigithub
Nov 24 2017 18:24
codepen internally adds doctype n html tags..
if u wanna do on ur own.. then use others online editors like plnkr, jsfiddle, jsbin,, etc @AbrisM
karlpupe
@karlpupe
Nov 24 2017 20:34
Hi Guys
Ben Line
@Benwebdev
Nov 24 2017 20:35
Hey Karl
karlpupe
@karlpupe
Nov 24 2017 20:41

I'm real newbie to coding and I struggling on some really basic JavaScript. I'm working on using parenthesis (brackets) to add simple numbers together but it's going wrong!

Take a look at this code

var num1 = prompt("Give me a number!");
var num2 = prompt("Give me another number!");
var num3 = prompt("Give me one more number!");
alert("Watch me give you 2 different numbers!")
var totalNum1 = (num1 + num2) * num3;
var totalNum2 = num1 + (num2 * num3);
alert(totalNum1);
alert(totalNum2);

Now if num1 = 1, num2 = 2 and num3 = 3, I would expect totalNum1 = 9 and totalNum2 to equal 7. But I am getting is 36 and 16 and I don't understand what is going on!

I've been coding for about a month and I'm really struggling with this! Thank you in advance for your help!

@Benwebdev hey Ben - thank you for getting back to me! :smile:
Moisés Man
@moigithub
Nov 24 2017 20:47
"1"+"2" = "12" (string concatenation)
"12" * "3" (since its a mulplication.. js "convert" those values to numbers and do the multiplication
karlpupe
@karlpupe
Nov 24 2017 20:49
@moigithub Thank you so much for answering this! That makes perfect sense! How would I do it so it did not concatenate it and actually add them together?
CamperBot
@camperbot
Nov 24 2017 20:49
karlpupe sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 3719 | @moigithub |http://www.freecodecamp.org/moigithub
Moisés Man
@moigithub
Nov 24 2017 20:50
u can use Number(num1) to convert those strings values into "real numbers"
or parseInt/parseFloat functions
karlpupe
@karlpupe
Nov 24 2017 20:53
@moigithub Brilliant! It worked! Thank you so, so much! You're a star!
CamperBot
@camperbot
Nov 24 2017 20:53
karlpupe sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
api offline
Benjmhart
@Benjmhart
Nov 24 2017 21:05
hey gang, does anyone know how I can force an absolutely positioned div to a lower margin (like, say to have it's bottom edge along vertical center)?
Tiago Correia
@tiagocorreiaalmeida
Nov 24 2017 21:07
center horizontal and stay at the bottom?
Benjmhart
@Benjmhart
Nov 24 2017 21:08
off center horizontally, yes, and i have that, but force the bottom edge to the vertical center, it's for the simon project
Tiago Correia
@tiagocorreiaalmeida
Nov 24 2017 21:15
you want the text exactly at middle?
im confused
mstellaluna
@mstellaluna
Nov 24 2017 21:16
FYI:: If anyone is interested in helping out getting Beta ready for Christmas. :point_up: November 24, 2017 4:14 PM
AbrisM
@AbrisM
Nov 24 2017 21:35
Hi all, could someone tell me why this code won't work via HTML (as in, saving it as a html file along with JS and CSS) even though I've included the external files? https://codepen.io/anon/pen/XzYxvv
AbrisM
@AbrisM
Nov 24 2017 21:54
https://plnkr.co/edit/3uiftW6qRdSkUb0egZZo?p=preview Also running it in Plnker gets the same result. A blank non-interactive page with only words on it
For codepen it works, but directly launching it from it's html file is only a blank non-interactive page
Benjmhart
@Benjmhart
Nov 24 2017 22:00
it's cool I got it.
AbrisM
@AbrisM
Nov 24 2017 22:07
@Benjmhart You got it to work in plnkr.co?
Mine just says "Type Anywhere in Page" but the color is blank and the rest of the page is white/unclickable
hansUno2
@hansUno2
Nov 24 2017 22:14
@
Boarworm
@Boarworm
Nov 24 2017 22:18
Hi guys. I want to organize a convenient assembly of the frontend. I need to create landings and small sites. And I want to have some base blocks with HTML markup (or a pug or something else) that will be easily implemented on a new site and modified if necessary. Tell me please what is better to use? Yandex bęm or pug or angular or something else.
micah4232
@micah4232
Nov 24 2017 22:39
here is a js book for all those interested: https://drive.google.com/file/d/0B_u1rzdqYCnzNC1ta1JtY3I5Szg/view enjoi
Adel
@AdelMahjoub
Nov 24 2017 23:17
I prefer this one against the ydkjs
AbrisM
@AbrisM
Nov 24 2017 23:57
hmm more explanations in that one instead of examples