These are chat archives for FreeCodeCamp/HelpFrontEnd

28th
Jan 2018
Lee
@LeeConnelly12
Jan 28 2018 00:11
I want to pass a parameter to a function in a click event without an anonymous function, possible?
// This works
$('.switch').click(switchOn)

// This does not work
$('.switch').click(switchOn(e))
Dan Lafferty
@DanLaff
Jan 28 2018 00:19
@LeeConnelly12 I'm not sure if this is what you're asking:
$('.switch').click(switchOn)

function switchOn(e) {
  console.log(e);  // e.target.textContent will get the text inside of your .switch element, for example
}
Lee
@LeeConnelly12
Jan 28 2018 00:36
@DanLaff That's exactly it, thank you friend.
CamperBot
@camperbot
Jan 28 2018 00:36
leeconnelly12 sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
Jacob Fines
@jfines
Jan 28 2018 03:06

Hope I'm in the right place .. I'm starting to work on my protfolio project. I'm a bit familiar with git and bitbucke / gitjub and I decided to develop locally, push to repository online then pull to my fqdn " jfines.com ". Somewhere in there I'll dump the code in codepen so it can be reviewed here and get credit for my challenge.

My question is about which files need to be included in my local project how they should be linked and where to include cdn links for jquery and bootstrap. I pasted my dir structure / files and content of files here: https://pastebin.com/dDpQJedV

Can anyone help me sort this out? I need to end up with my portfolio at my protfolio ur and keep a backup of the code so I really feel this is the most efficient approach.

wow - typos - must be tired
Tom
@moT01
Jan 28 2018 03:12
@jfines is it working locally? heres the repo for my wiki project - pretty simple https://github.com/moT01/FCC-Wikipedia-Viewer
scripts go at the bottom before </body>
at least the one you made
the other ones might be fine at the top
Jacob Fines
@jfines
Jan 28 2018 03:15
@moT01 I thought they can go in separate files though?
I'm struggling to undrestand if I need a local javascript file or if that code is just gonna end up in my html file anyway
Tom
@moT01
Jan 28 2018 03:16
the javascript can go directly in the html in script tags - most people put it in a separate file
<script src="">
they work the same
Jacob Fines
@jfines
Jan 28 2018 03:17
I think I prefer to keep it neater by putting everything in separate files tho
I I put my js in an external file then do I want to put my CDN link for jquery in there? Put both CDN links there?
Tom
@moT01
Jan 28 2018 03:17
if you are using them
Jacob Fines
@jfines
Jan 28 2018 03:18
how would I determine if I need a local js file? Only if I'm gonna write vanilla js?
I'm lost
I know just enough to screw myself
Tom
@moT01
Jan 28 2018 03:19
if you plan on using javascript - you will want a javascript file
take a look at the link i sent
Jacob Fines
@jfines
Jan 28 2018 03:19
link?
Tom
@moT01
Jan 28 2018 03:20
yea - the link
i put a url up there
to one of my projects
if you click the index.html file
you can see how i linked my stuff
css file at the top
jquery and my own js file at the bottom
Jacob Fines
@jfines
Jan 28 2018 03:21
It looks like you downloaded the jquery lib instead of linking to it. I thought about doing that.
Tom
@moT01
Jan 28 2018 03:22
i did - probly didnt need to
i think i was thinking that if i didnt have internet access or something i could still use it and look at my projects
Jacob Fines
@jfines
Jan 28 2018 03:23
right on
Are you using bootstrap in that at all?
Tom
@moT01
Jan 28 2018 03:24
no
Jacob Fines
@jfines
Jan 28 2018 03:24
hmm
Tom
@moT01
Jan 28 2018 03:24
but you can link it the same as the css i have in there
Jacob Fines
@jfines
Jan 28 2018 03:25
I don't think including the link to jquery in my js file is a good idea. That would spread out included files all over the place instead of in one single place (the html file)
Tom
@moT01
Jan 28 2018 03:26
not sure what your saying there
link jquery in the html , and your own js in the html as well - separately
Jacob Fines
@jfines
Jan 28 2018 03:27
I'm glad you asked that. I thought about it and I realize what's has to happen / is going on now
Tom
@moT01
Jan 28 2018 03:29
you could cut all the code from my wiki.js file and paste it in the <script> </script> tags in the html and it would be the same thing
Jacob Fines
@jfines
Jan 28 2018 03:29
I was confused about where to include vairous files and thought I might need to include the jquery library in my local js file. That may be possible but I'm not sure Its' practical.
Tom
@moT01
Jan 28 2018 03:29
i suppose you could, but no - just keep them separate
Jacob Fines
@jfines
Jan 28 2018 03:30
I think I got it now. I appreciate the dialogue. That's what helped
Ashwin
@ashwins93
Jan 28 2018 05:20
hey all
I know this is a frontend room but i'm asking anyway. Does anyone have experience in doing backend in Java? I'm a node.js guy but I am asked to develop a rest api in java (official reasons)
Charles Williams
@cfunkles
Jan 28 2018 05:32
hey Gitter World! Would somebody be willing to help me out with the Record Collection algorithm? I can't see the error causing the last test to fail?
Charles Williams
@cfunkles
Jan 28 2018 05:43
nevermind, figured it out
TJ Hardin
@AndroidNinjaX
Jan 28 2018 09:40
Hey anyone in here to help out for a sec?
stephenburks
@stephenburks
Jan 28 2018 09:55
No guarantee but I will try - still working on this stuff myself. What's up?
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:03
sweet. It is a quite a bit of code, so ill try to walk through it to my issue.
stephenburks
@stephenburks
Jan 28 2018 10:03
Cool sounds good
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:03
stephenburks
@stephenburks
Jan 28 2018 10:04
Okay
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:04
@AndroidNinjaX
So when I click on a square, it puts my X or O down, exactly what it is suppose to do. Then the computer goes. currently I have minMax disabled.
So I tell the computer to generate a random number, and get my 'row' and 'column' associated with that. I return an object that ends up being var stuffObj = {row : r, column : c};.

@AndroidNinjaX
Thats good, but sometimes it does not pass that object to the variable its suppose to in the move function. var selection = callAI();. If you look in the console. it throws this.

**AI function called** pen.js:291 Zone is: #4 pen.js:319 r is: 1 and c is: 0 pen.js:320 id is: #r1c0 pen.js:363 Here is what I am going to return pen.js:364 {row: 1, column: 0} pen.js:501 selection is this: pen.js:502 undefined pen.js:504 Uncaught TypeError: Cannot read property 'row' of undefined at move (pen.js:504) at HTMLDivElement.<anonymous> (pen.js:544) at HTMLDivElement.dispatch (jquery.min.js:3) at HTMLDivElement.q.handle (jquery.min.js:3)
^ looks terrible lol
I figured it would format that.

so I do callAI(), which should return an object stuffObj. Sometimes it does, and sometimes it dosnt. It is never consistent.
stephenburks
@stephenburks
Jan 28 2018 10:06
Okay well truthfully this is a little ahead of me but I am going to look at it for a few minutes and see if maybe I can find something glaringly obvious. Sorry, definitely not a pro but if I can help I will. Just don't want you to get your hopes up lol.
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:07
In the console it list stuffObj is displayed fine, but in someimtes selection just showes undefined
and hey its cool, thanks for even attempting, I am in the same boat
stephenburks
@stephenburks
Jan 28 2018 10:09
Okay so first, I noticed that I got an issue once I played a few moves. I get an error stating that there is an infinite loop somewhere - did you already look at that?
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:11
I recently got that, hold on I know what I did and made the issue.
OK if you refresh that should go away. I think I accidentally did that a min ago.
stephenburks
@stephenburks
Jan 28 2018 10:13
Cool I will try really quick
Okay now when I play the computer is only returning a "move" on my second move. So I can play as X and make the whole board X's except for 1 block. Does that make sense?
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:15
Ya, that should not happen. The computer should have took a turn after you.
Line 363, 364, 501, 502
stephenburks
@stephenburks
Jan 28 2018 10:16
Right, now it is inconsistent because I tried to play with o's and it made the first move but didn't make a second move. Let me check that out too
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:16
haha im glad its not just me
stephenburks
@stephenburks
Jan 28 2018 10:17
No I mean I am seeing the same issues - it is probably a simple debugging issue that I am not really experienced enough to notice. I mean the game works but it is inconsistent so it has to be some argument or function bug that isn't obvious.
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:18
Ok at least im not crazy. I think thats the worst part is that it is inconsistent.
Sometimes it works, and sometimes it just flips you the bird
stephenburks
@stephenburks
Jan 28 2018 10:23
Okay well I hate to be this guy but I don't think I even know quite what to be looking for in the issue. Not trying to be the guy that is like "Hey idk what your problem is but you definitely have one" but I am not really sure where to start to check. I would assume that hopefully someone a bit more experienced can come through and see the problem immediately. Sorry :/ but at least I can say you aren't crazy. Seems like you are close though, when it does work it is super clean and easy so I am sure you will work it out soon.
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:26
Its ok, thank you very much for just taking a look into it. I will probably figure it out in another rewrite again.
@stephenburks thanks
CamperBot
@camperbot
Jan 28 2018 10:26
androidninjax sends brownie points to @stephenburks :sparkles: :thumbsup: :sparkles:
:cookie: 234 | @stephenburks |http://www.freecodecamp.org/stephenburks
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:26
make sure you get the points
stephenburks
@stephenburks
Jan 28 2018 10:26
Lol thanks! New to the whole chat thing so I appreciate it
Aditya
@ezioda004
Jan 28 2018 10:27
@AndroidNinjaX Are you certain your minimax function works?
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:27
Nope, that's why I am not using it right now. Currently I am just generating a random number to throw the computer character are
Aditya
@ezioda004
Jan 28 2018 10:28
Whats that function called?
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:28
line 271 it ask if the difficulty is 'easy', and I have it set at that right now, to avoid my miniMax
the miniMax function is just 'miniMax', 'callAI' is the other function that I am having issues with right now. It just decides to not return the object it is suppose to for some reason, and its not consistent.
Aditya
@ezioda004
Jan 28 2018 10:38
@AndroidNinjaX Ok first thing, why do you have a case for 0? Why not just make it so that you get random number b/w 1 and 9
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:39
ya... I was going to and I forgot how at the time I wrote that, so it was an extremely lazy way of getting around a problem that I didn't want to look up at the time.
Aditya
@ezioda004
Jan 28 2018 10:40
Math.floor(Math.random()*9+1)
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:45
thanks. I fixed that
I really should have just looked it up when I hit that part, but didn't feel like it.
sorry for slow responses also, I am at work as well
Aditya
@ezioda004
Jan 28 2018 10:57
@AndroidNinjaX Ok so sometimes it says Cannot read property 'row' of undefined after clicking and it stops working
TJ Hardin
@AndroidNinjaX
Jan 28 2018 10:59
Ya and the weirdest thing is that it sometimes works fine, and others it does not
TJ Hardin
@AndroidNinjaX
Jan 28 2018 11:17
unfortunately gotta get. Thanks for taking a look at it though.
@ezioda004 thanks
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:06
hi , can I have question please ?
Fernando
@lestairon
Jan 28 2018 12:06
Sure
Marianissimus
@Marianissimus
Jan 28 2018 12:06
sure: is there life in outer space? @ahmed-issa-mohd
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:08
how I can add this marker on Google map ?
image.png
this does not work !
Marianissimus
@Marianissimus
Jan 28 2018 12:10
the github documentation says the project is deprecated: scottdejonge/map-icons#60 and https://github.com/scottdejonge/map-icons
maybe that is or not the problem, anyway you should know about this
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:11
This means I can not add an span on map ?
Lee
@LeeConnelly12
Jan 28 2018 12:12
@ahmed-issa-mohd Can i see how you've declared your map?
@ahmed-issa-mohd You're map should be declared like this
var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            center: {lat: 52.2126813, lng: -2.164928319708499}
        });
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:14
image.png
Lee
@LeeConnelly12
Jan 28 2018 12:14
@ahmed-issa-mohd In your map canvas you have a small typo i think
@ahmed-issa-mohd document.getelementById('MAPCANVA')
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:16
for custom marker as this
Lee
@LeeConnelly12
Jan 28 2018 12:18
@ahmed-issa-mohd Yeah custom icon for marker is simple,
var marker = new google.maps.Marker({
                position: new google.maps.LatLng(
                    52.2126813, 
                   -2.164928319708499 ,
                map: map,
                icon: "http://via.placeholder.com/64x64"
            });
just set the icon property in the google maps marker
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:19
okay
Lee
@LeeConnelly12
Jan 28 2018 12:23
@ahmed-issa-mohd Have you fixed the typo for your map canvas? your div id is map-canvas but in your code it's document.getElementById('map-canva'). Also the id is wrong when you're setting map as well.
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:26
image.png
The marker does not appears
Lee
@LeeConnelly12
Jan 28 2018 12:30
@ahmed-issa-mohd Because you need to set the icon property
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:31
how ?
set to why ?
Lee
@LeeConnelly12
Jan 28 2018 12:37
@ahmed-issa-mohd This works, just tested,
function initMap() {
    var myCenter = new google.maps.LatLng(51.508742, -0.120850);
    var mapCanvas = document.getElementById('map');
    var mapOptions = { center: myCenter, zoom: 5 };
    var map = new google.maps.Map(mapCanvas, mapOptions);
    var marker = new google.maps.Marker({
        map: map,
        position: myCenter,
        icon: 'http://via.placeholder.com/64x64'
    });
}
initMap();
@ahmed-issa-mohd Nevermind, it works without setting the marker
linkin-park
@linkin-park
Jan 28 2018 12:38
Lee
@LeeConnelly12
Jan 28 2018 12:40
@linkin-park Yeah you're right, the js could probably be improved.
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:40
image.png
Lee
@LeeConnelly12
Jan 28 2018 12:41
@ahmed-issa-mohd In your script tag your callback is myMap, but your function name is InitMap
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:41
okay
thank you it work
I am trying to add the span element as marker
Muhammad Osman A.J.
@moajday
Jan 28 2018 12:45
How important is '?' ternary operator?
Lee
@LeeConnelly12
Jan 28 2018 12:46
@ajbozdar I would say it is very helpful and definitely worth mastering.
Muhammad Osman A.J.
@moajday
Jan 28 2018 12:46
@LeeConnelly12 How often do you use it?
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 12:47
@LeeConnelly12 http://map-icons.com/
Muhammad Osman A.J.
@moajday
Jan 28 2018 12:47
Kindly teach me how ternary operator operates in following program? @LeeConnelly12
Lee
@LeeConnelly12
Jan 28 2018 12:47
@ajbozdar Ill actually show an example of me using it right now.
switchOnOff = function () {
            $switch.children().animate({
                left: (turnedOn ?
                    (turnedOn = false, "-=30") :
                    (turnedOn = true, "+=30"))
            }, 'fast');

            $count.text(turnedOn ? '--' : '');
        }
Muhammad Osman A.J.
@moajday
Jan 28 2018 12:47
let age = prompt('age?', 18);

let message = (age < 3) ? 'Hi, baby!' :
  (age < 18) ? 'Hello!' :
  (age < 100) ? 'Greetings!' :
  'What an unusual age!';

alert( message );
Oh. :)
Could you please explain it line by line? This 'question mark' is slightly difficult to udnerstand. I think it only shortens the code, and I should leave it for the time being.
Matej Bošnjak
@mbosnjak01
Jan 28 2018 12:49
this is short if statement
Muhammad Osman A.J.
@moajday
Jan 28 2018 12:50
indeed @mbosnjak01
Lee
@LeeConnelly12
Jan 28 2018 12:50
@ajbozdar
let message = 
    // If age is less than 3
    (age < 3) ? 'Hi, baby!' :
            // Else if age is less than 18
        (age < 18) ? 'Hello!' :
            // Else if age is less than 100
        (age < 100) ? 'Greetings!' :
    // Else
  'What an unusual age!';
Matej Bošnjak
@mbosnjak01
Jan 28 2018 12:52
basically .. basic exampple.
if(age < 18) {
true; } else {
false; }
Stephen James
@sjames1958gm
Jan 28 2018 13:30
@ajbozdar Those are ternary operators, you have three of them, similar to if () {} else {}
The difference is that the ternary is an expression which returns a value (assigned to message here)
if statement cannot return a value
Daniel Romero
@Ranacode
Jan 28 2018 13:32
any good plugin on vscode for files that mix php&html?
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 28 2018 13:54
image.png
image.png
Chi
@chiyc
Jan 28 2018 13:57
@ajbozdar Multiple nested ternary operators like in your example are considered by some people to be poor for readability
Tom
@moT01
Jan 28 2018 15:37
//SLIDESHOW
var delay = 7500;
var index = 0;
var leftChevron = document.getElementById('left-chevron');
var rightChevron = document.getElementById('right-chevron');
var slideInterval = setInterval(nextSlide, delay);
var slides = [
  document.getElementById('slide0'),
  document.getElementById('slide1'),
  document.getElementById('slide2'),
  document.getElementById('slide3'),
  document.getElementById('slide4'),
  document.getElementById('slide5'),
  document.getElementById('slide6')
];

leftChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  slides[index].style.opacity = '0';
  index == 0 ? index = 6 : index--;  
  slides[index].style.opacity = '100';
  slideInterval = setInterval(nextSlide, delay);
});

rightChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  nextSlide();
  slideInteral = setInterval(nextSlide, delay);
});

function nextSlide() {
  slides[index].style.opacity = '0';
  index == 6 ? index = 0 : index++;   
  slides[index].style.opacity = '100';
};
having an issue with my interval - its not clearing the interval on my clicks - when i click, it speeds up the time between slides - as if creating a second interval - any thought on what I am missing?
Stephen James
@sjames1958gm
Jan 28 2018 15:44
@moT01 I don't see anything - looks like you are clearing and restarting the timer correctly.
@moT01 Do you have a link to the page?
Tom
@moT01
Jan 28 2018 15:46
@sjames1958gm thanks - i dont, i could make one up quick
CamperBot
@camperbot
Jan 28 2018 15:46
mot01 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8910 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Tom
@moT01
Jan 28 2018 15:49
@sjames1958gm you know what - i think i got it
missing a v in my right.click
sneaky
Stephen James
@sjames1958gm
Jan 28 2018 16:14
@moT01 aaahhh
Muhammad Osman A.J.
@moajday
Jan 28 2018 16:54
@chiyc If it is poor for readability then when to use it, and when not to?
jazzyrosez
@jazzyrosez
Jan 28 2018 16:54
Quick Question: HTML 4 support the <li type=""> great for the different levels of listing. HTML 5 does not support it so What is the workaround?
Chi
@chiyc
Jan 28 2018 16:55
I mean that’s it’s poor readability if you chain many in a row
They’re great for assigning a value to a variable based on a simple if/else
Muhammad Osman A.J.
@moajday
Jan 28 2018 16:56
@sjames1958gm What do you mean by "returns a value"? If-Else also returns values, I think. Are you talking something about return(0) in C language?
Chi
@chiyc
Jan 28 2018 16:58
A regular if/else is a collection of a statements in the braces
Muhammad Osman A.J.
@moajday
Jan 28 2018 16:59
@chiyc You are saying that it is better to use If/else after all, right?
Chi
@chiyc
Jan 28 2018 16:59
With a ternary operator the value following the ? and : are actually returned as a value
The ternary operator is a great replacement for if/else when all you’re doing is assigning a value to a single variable based on one condition
Chi
@chiyc
Jan 28 2018 17:05
′var errorMessage = isError ? “Error!” : “Success!;′ is cleaner than ′var errorMessage; if (isError) { errorMessage = “Error!”; } else { errorMessage = “Success!”; }′
Oops
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:06
OK. And, for multiple condition? I should prefer regular if/else, right? Not only for readability sack but also the nature of 'ternary' operator.
Chi
@chiyc
Jan 28 2018 17:07
Yeah, it’s preferred
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:09
@chiyc ++
Thank you very much for all your help. ++@chiyc
It seems you are not getting points. How to give you points?
Chi
@chiyc
Jan 28 2018 17:09
Hmmm try it again. @chiyc Thanks! On one line
CamperBot
@camperbot
Jan 28 2018 17:09
sorry chiyc, you can't send brownie points to yourself! :sparkles: :sparkles:
Chi
@chiyc
Jan 28 2018 17:10
😆
And you’re welcome! I’m on mobile so I’m having trouble formatting the code, but hopefully it’s clear
Stephen James
@sjames1958gm
Jan 28 2018 17:14
@ajbozdar You cannot do
var x = if (test) {} else {}
but you can
var x = (test) ? a : b
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:15
how to send brownie points?
Yes, it is much clear now. @chiyc .
@camperbot how to give brownie points?
@chiyc +
@chiyc :thumbsup:
hahaha... Why I am so struggling?
Tom
@moT01
Jan 28 2018 17:20
use one of the keywords with someones name
ty/thanks/thank you
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:20
@chiyc ty
CamperBot
@camperbot
Jan 28 2018 17:20
ajbozdar sends brownie points to @chiyc :sparkles: :thumbsup: :sparkles:
:cookie: 360 | @chiyc |http://www.freecodecamp.org/chiyc
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:20
@moT01 ty
@sjames1958gm ty
CamperBot
@camperbot
Jan 28 2018 17:21
ajbozdar sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8911 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 28 2018 17:21
@ajbozdar :+1:
Tom
@moT01
Jan 28 2018 17:21
i got hosed
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:22
@moT01 :laughing:
Tom
@moT01
Jan 28 2018 17:24
james has enough brownies to fill a swimming pool
Muhammad Osman A.J.
@moajday
Jan 28 2018 17:26
@moT01 :sparkles: This is funny. I want some of them now. :smile:
jazzyrosez
@jazzyrosez
Jan 28 2018 17:28
So, Workaround for HTML5 for list levels?
jazzyrosez
@jazzyrosez
Jan 28 2018 17:48
Nevermind, I had figured it out.
Vikas Rathee
@vikas-rathee
Jan 28 2018 17:55
Can anyone help me in creating a "Toggle" button for Local weather app?
Lee
@LeeConnelly12
Jan 28 2018 18:00
@vikas-rathee sure
Vikas Rathee
@vikas-rathee
Jan 28 2018 18:04
How do i create a "Toggle" switch that converts temp from C to F.
Tom
@moT01
Jan 28 2018 18:11
var units = 'f'
div.click
  if(units === 'f') 
    //change html to display C temp
    units = 'c';
  else
    //change html to display F temp
   units = 'f';
Vikas Rathee
@vikas-rathee
Jan 28 2018 18:33
@moT01 Thanks
CamperBot
@camperbot
Jan 28 2018 18:33
vikas-rathee sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 967 | @mot01 |http://www.freecodecamp.org/mot01
Cristopher Encarnacion
@chris0715
Jan 28 2018 18:44
losing passport session using cors and react-create-app any help?
alessiochiffi
@alessiochiffi
Jan 28 2018 18:53
Hi
can anyone help me to deploy a small react project to github?
Tom
@moT01
Jan 28 2018 19:05
@alessiochiffi you want to just make a repo?
Apollo
@enigmacipher
Jan 28 2018 19:05
hi I just started the bootstrap section in FCC. Can someone please explain what the class "container-fluid" do?
alessiochiffi
@alessiochiffi
Jan 28 2018 19:06
@moT01 Hi Tom, I have the repo. I want to just use github pages and publish it
but I have issue with package.json I guess
what repo
Dan Lafferty
@DanLaff
Jan 28 2018 19:08
@enigmacipher container-fluid always uses the full width of the screen (with 15px of padding on left/right). container has a fixed width that changes based on the screen size
This is the CSS:
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
Apollo
@enigmacipher
Jan 28 2018 19:10
thanks @DanLaff :)
CamperBot
@camperbot
Jan 28 2018 19:10
enigmacipher sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
Dan Lafferty
@DanLaff
Jan 28 2018 19:10
You're welcome :)
Eric Weiss
@eweiss17
Jan 28 2018 19:14
What courses you guys do to get good at react?
Dan Lafferty
@DanLaff
Jan 28 2018 19:18
codecademy has a good one https://www.codecademy.com/learn/react-101
Eric Weiss
@eweiss17
Jan 28 2018 19:19
I'm on part 2 of codecademy right now and it's not completly clicking yet
Dan Lafferty
@DanLaff
Jan 28 2018 19:20
It's an awkward paradigm shift moving from jQuery to React
Kind of like going from not knowing any code to learning to JavaScript - what made JavaScript click for you? Maybe try and emulate that experience with your React training
Eric Weiss
@eweiss17
Jan 28 2018 19:21
i'm planing on just doing tutorials until i know what it is going to tell me to do before it does
Dan Lafferty
@DanLaff
Jan 28 2018 19:22
I wish it was easier, but that's a good methodical approach. Patience and persistence :)
Eric Weiss
@eweiss17
Jan 28 2018 19:22
@DanLaff thanks i'll check out the egghead one after i finish the codecademy
CamperBot
@camperbot
Jan 28 2018 19:22
eweiss17 sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
Eric Weiss
@eweiss17
Jan 28 2018 19:23
When using react, is your html always going to be generated?
Dan Lafferty
@DanLaff
Jan 28 2018 19:24
Yeah, that's the power of react - reusable HTML components
It doesn't have to be that way, but it's designed to all get dynamically generated
I should say "one of the powers" of react :)
Eric Weiss
@eweiss17
Jan 28 2018 19:25
yeah but what if i want most of my page to be static and one section to be dynamic with react
is that practical
Dan Lafferty
@DanLaff
Jan 28 2018 19:26
You can still build it all in React even if parts are static. It's probably more practical to do it all in React, rather than a mix of different technologies
There's also a difference between static HTML and static content. You can dynamically generate static content.
Just to make sure we're talking about the same thing :)
Sweet Coding :)
@SweetCodingInc
Jan 28 2018 19:30
@eweiss17 making only the dynamic part in react/angular and keeping the rest static, is the most practical thing you can ever do
and yes, it is practical
Dan Lafferty
@DanLaff
Jan 28 2018 19:31
Consider a navbar that's the same on every page you visit in a site. That's static content - you would want to make that a component rather than copy/pasting static HTML and not using React
Apollo
@enigmacipher
Jan 28 2018 19:32
@DanLaff Should I switch to the beta version since I'm just starting out? The explanations given in beta are much better.
Dan Lafferty
@DanLaff
Jan 28 2018 19:34
@enigmacipher Bootstrap 4 beta?
They released the final Bootstrap 4 last week (or maybe the week before). I'd definitely use that over Bootstrap 3 if you can.
Apollo
@enigmacipher
Jan 28 2018 19:35
Thanks. Im starting the beta. Any idea when the beta will go live?
Dan Lafferty
@DanLaff
Jan 28 2018 19:37
Apollo
@enigmacipher
Jan 28 2018 19:38
i mean fcc beta
Dan Lafferty
@DanLaff
Jan 28 2018 19:38
Oh... I don't do Free Code Camp, just here to practice coding and offer free opinions :)
Fun debugging people's apps and keeping my js skills sharp
@enigmacipher It seems like they're late, it was expected by end of last year. https://forum.freecodecamp.org/t/frequently-asked-questions-about-the-freecodecamp-beta/134331
Eric Weiss
@eweiss17
Jan 28 2018 19:40
If you see some section you like in the beta go ahead and try them. Problem is they may be buggy.
Apollo
@enigmacipher
Jan 28 2018 19:42
@DanLaff the hero we need ;)
since the beta is in the final stage, maybe it wont be that buggy
Dan Lafferty
@DanLaff
Jan 28 2018 19:42
Lol, win win :)
Ali Bulut
@ali27001
Jan 28 2018 20:35
image.png
what problem ?
Marcin Lasecki
@marlo22
Jan 28 2018 21:08
@ali27001, read again content of the chapter. You should create new instance of object Car, then overwrite default properties inherited from constructor.
For example if you have constructor Burger you create new instance - var myBurger = new Burger(), then myBurger.meat = 2. :)
cguidog
@cguidog
Jan 28 2018 21:45
Hi everybody. I am still working on my weather app (I still have to make it pretty). So far I can show the location and temperature, I also added a bottom change a variable that controls Celsius or Fahrenheit. My question is, after changing this variable, I need to recall the function that shows the temperature so it will display the information with the correct unit; but so far I can not make it work, any ideas? https://codepen.io/cguidog/pen/QQLyVv?editors=1011
Stephen James
@sjames1958gm
Jan 28 2018 21:55
@cguidog You'll need to save the data from the weather API outside the function "global" so you can pass it to showResults
@cguidog Or have a function that pulls the temp from data (not show results) and have show results use the global temp only (not data)
cguidog
@cguidog
Jan 28 2018 22:01
Thank you! @sjames1958gm I'll check it out. I also found a way to go around it, I just don't know if it is not efficient enough. Basically the same function that changes the variable 'unit' from F to C is doing the math, updating the values for the variables 'temp', 'high' and 'low' and then sending those new values to the HMTL.
CamperBot
@camperbot
Jan 28 2018 22:01
cguidog sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8912 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 28 2018 22:01
@cguidog Sounds reasonable
cguidog
@cguidog
Jan 28 2018 22:03
I still need to understand how to make the data available for all the functions. I thought I got it but I still get confused.
alessiochiffi
@alessiochiffi
Jan 28 2018 22:15
Hi everyone
can you give me a feedback?
lfvpCO
@lfvpCO
Jan 28 2018 22:26
hello guys
I coded my tribute page on codepen but I cant see the background color
Stephen James
@sjames1958gm
Jan 28 2018 22:27
@cguidog I your function that gets the data, pull the values out into "globals" then use those in the showResults function
.then(data => {
      temp = Math.round(data.main.temp);
      high = Math.round(data.main.temp_max);
      low = Math.round(data.main.temp_min);
      name = data.name;
      description = data.weather[0].description
     showResults();
  });
Anders Nicolai Magnussen
@nicolaimagnussen
Jan 28 2018 23:25

Hello guys, I am a little bit stuck at a brain puzzle.
I am trying to create a calculator in javascript, but I cant seem how to figure out how to use the last answer for next calcuation, maybe it is late

Anyone can help me?

Here is the code until now.
https://codepen.io/nicolaimagnussen/pen/QQLYXZ

Stephen James
@sjames1958gm
Jan 28 2018 23:37
@nicolaimagnussen numberArray.length < 0 this seems odd, how does an array have negative length?