These are chat archives for FreeCodeCamp/HelpFrontEnd

2nd
Dec 2017
Kaz Baig
@kbaig
Dec 02 2017 00:00
you have to specify the index of the character
Linus Phan
@linusphan
Dec 02 2017 00:00
if I don't include anything it defaults to 0 correct?
Kaz Baig
@kbaig
Dec 02 2017 00:01
oh u rite
Linus Phan
@linusphan
Dec 02 2017 00:01
so for the first case, it would be like "S".charCodeAt();
but it doesn't seem to change it
Kaz Baig
@kbaig
Dec 02 2017 00:01
ignore me
lol
juni
@junipberry
Dec 02 2017 00:01
yea, I should do that. I was just set on using the .map method ..guess I dont have to do that. thank you @kbaig
CamperBot
@camperbot
Dec 02 2017 00:01
junipberry sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 473 | @kbaig |http://www.freecodecamp.org/kbaig
Linus Phan
@linusphan
Dec 02 2017 00:02
@kbaig lol no worries. Thanks for your response!
Kaz Baig
@kbaig
Dec 02 2017 00:03
@linusphan wait how are you checking for the change
are you not seeing it in the console.log(arr)
Linus Phan
@linusphan
Dec 02 2017 00:03
I see the change actually
but it's not being assigned
Kaz Baig
@kbaig
Dec 02 2017 00:04
assigned to what
Linus Phan
@linusphan
Dec 02 2017 00:04

function rot13(str) { // LBH QVQ VG!
  var arr = str.split(" ");
  for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j].charCodeAt());
    }
  }
  console.log(arr);
  return str;
}

// Change the inputs below to test
rot13("SERR PBQR PNZC");
That's my current code right now
Kaz Baig
@kbaig
Dec 02 2017 00:04
if console.log(arr) is showing a changed array, the assignment in the for loops is working
Linus Phan
@linusphan
Dec 02 2017 00:04
arr[i][j].charCodeAt()
is not being assigned to
arr[i][j]
Kaz Baig
@kbaig
Dec 02 2017 00:05
but you just said the array is different after the loop, no?
Linus Phan
@linusphan
Dec 02 2017 00:06
Yeah. It's different when I take out the assignment and tried to see if it even changed, which it does

function rot13(str) { // LBH QVQ VG!
  var arr = str.split(" ");
  for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < arr[i].length; j++) {
      arr[i][j] = arr[i][j].charCodeAt();
      console.log(arr[i][j]);
    }
  }
  console.log(arr);
  return str;
}

// Change the inputs below to test
rot13("SERR PBQR PNZC");
when I stick in the assignment right there, and check the console, they appear as letters still
Kaz Baig
@kbaig
Dec 02 2017 00:09
@linusphan oh durr I just realized why
so when you call split at the top, arr becomes ['LBH', 'QVQ', VG!']
then your first loop iterates through each elem in the array
so say 'LBH' is the first array
then your second loop is going through 'LBH'
Linus Phan
@linusphan
Dec 02 2017 00:10
Yeah that's what I was planning
Kaz Baig
@kbaig
Dec 02 2017 00:10
you can't reassign the string[0] a number
like
you can't do 'LBH'[0] = 'L'.charCodeAt()
try splitting elems in arr again
make it a 2d array
try this is in the console:
var str = 'ab';
str[0] = str.charCodeAt();
str;
you will get 'ab'
Linus Phan
@linusphan
Dec 02 2017 00:15
Is this because strings are immutable?
Kaz Baig
@kbaig
Dec 02 2017 00:16
it's like saying replace the wheel of my car with a dog
that doesn't fit there...
Linus Phan
@linusphan
Dec 02 2017 00:17
lool
okay so then I have to find anotehr way to do thsi
Kaz Baig
@kbaig
Dec 02 2017 00:21
Just do something like
var arr = str.split(' ');
for (loop through arr) {
  var subArr = arr[i].split('');
  for (loop through subArr) { ... }
}
@linusphan
alpox
@alpox
Dec 02 2017 00:21
@linusphan You cannot modify an existing string, but you can create new strings out of old ones
@linusphan Also, be aware of concatenation:
var newStr = '';
for(...) {
    newStr += "foo"; // Concat with new string and reassign
}
Linus Phan
@linusphan
Dec 02 2017 00:23
okay I'll try to see if I can come up with a solution with those hints
alpox
@alpox
Dec 02 2017 00:24
@linusphan There are different methods - maybe try the one from @kbaig first and use .join at the end
Kaz Baig
@kbaig
Dec 02 2017 00:27
@alpox u slay
Linus Phan
@linusphan
Dec 02 2017 00:28
@kbaig wouldn't that be multiple variable declarations inside a for loop?
alpox
@alpox
Dec 02 2017 00:29
@linusphan you only declare a variable with var. and you can declare variables in a loop ofc.
Linus Phan
@linusphan
Dec 02 2017 00:30
@alpox oh okay nvm
I thought there would be multiple times the console would be declaring with var, but I see it only happens once
if I can solve this before the library closes, omg I'd be happy xD
please no answers thouguh
alpox
@alpox
Dec 02 2017 00:34
@linusphan the subArr gets created several times, but that doesn't matter - it always only lives in its iteration context
Linus Phan
@linusphan
Dec 02 2017 00:43
O_O
This is taking a long time
lol

 function rot13(str) { // LBH QVQ VG!
  var arr = str.split(" ");
  for (var i = 0; i < arr.length; i++) {
      var newArr = arr[i].split("");
    for (var j = 0; j < newArr.length; j++) {
          newArr[j] = newArr[j].charCodeAt() - 13;
        newArr[j] = String.fromCharCode(newArr[j]);
    }
  }
  return str;
 }

 // Change the inputs below to test
 rot13("SERR PBQR PNZC");
My progress so far
Linus Phan
@linusphan
Dec 02 2017 01:20
do you guys know how I can ignore non-alphabetic characters?
Jessie Cryer
@j-cryer
Dec 02 2017 01:23
@linusphan with regex
Moisés Man
@moigithub
Dec 02 2017 01:23
u could use test regex method
Linus Phan
@linusphan
Dec 02 2017 01:23

   function rot13(str) { // LBH QVQ VG!
    var arr = str.split(" ");
    var finalArr = [];
    for (var i = 0; i < arr.length; i++) {
      var newArr = arr[i].split("");
      console.log(newArr);
      for (var j = 0; j < newArr.length; j++) {
          if (newArr[j].charCodeAt() - 13 >= 65 && newArr[j].charCodeAt() - 13 <= 90) {
            if (newArr[j].charCodeAt() >= 65 && newArr[j].charCodeAt() <= 90) {
              newArr[j] = newArr[j].charCodeAt() - 13;
              newArr[j] = String.fromCharCode(newArr[j]);
            }
          }
          else if (newArr[j].charCodeAt() + 13 >= 65 && newArr[j].charCodeAt() + 13 <= 90) {
            if (newArr[j].charCodeAt() >= 65 && newArr[j].charCodeAt() <= 90) {
              newArr[j] = newArr[j].charCodeAt() + 13;
              newArr[j] = String.fromCharCode(newArr[j]);
            }
          }
      }
      newArr = newArr.join("");
      finalArr.push(newArr);
    }
    finalArr = finalArr.join(" ");
    console.log(finalArr);
    return finalArr;
   }

   // Change the inputs below to test
   rot13("SERR YBIR?");
That's my solution!!!!
LOOOOL
is that pretty ? xD
Linus Phan
@linusphan
Dec 02 2017 01:36
There is probably a much more elegant solution lol
Cristi Ciobanu
@c-ciobanu
Dec 02 2017 01:49
my take on the problem
function rot13(str) {
  // LBH QVQ VG!

  var arr=[];
  var temp;

  for(var i = 0; i<str.length; i++) {
    if ('A'<=str[i] && str[i]<='Z') {
      if((str.charCodeAt(i)-13)<65) temp = String.fromCharCode(str.charCodeAt(i)-13+26);
      else temp = String.fromCharCode(str.charCodeAt(i)-13);
      arr[i] = temp.split("");
    }
    else arr[i] = str[i];
  }

  str=arr.join("");

  return str;
}
Gaurav
@gauravmagan
Dec 02 2017 02:31
@c-ciobanu question we need to run a http server to reuse the html blocks like nav bar
in multiple pages
Gaurav
@gauravmagan
Dec 02 2017 02:37
@j-cryer @kbaig
anyone?
crpdomingues
@crpdomingues
Dec 02 2017 03:11
sorry for the stupid question, but how to paste code like that?
like it appears in fcc
@c-ciobanu
abraham anak agung
@padunk
Dec 02 2017 03:23
@crpdomingues markdown preview in the right side M with down arrow.
Ken Haduch
@khaduch
Dec 02 2017 03:26
@crpdomingues - there is a post in the forum about it, too. https://forum.freecodecamp.org/t/markdown-code-formatting/18391 shows the details of the Markdown code posting format.
kerafyrm02
@kerafyrm02
Dec 02 2017 03:30
Anyone need help?
Not sure exactly what if ('A'<=str[i] && str[i]<='Z') does.
interesting-- never realized that works for single character
You will run into problems if it's not a letter though
crpdomingues
@crpdomingues
Dec 02 2017 03:35
var a = arr.length;
@khaduch @padunk thanks!
CamperBot
@camperbot
Dec 02 2017 03:35
crpdomingues sends brownie points to @khaduch and @padunk :sparkles: :thumbsup: :sparkles:
:star2: 3553 | @khaduch |http://www.freecodecamp.org/khaduch
:cookie: 405 | @padunk |http://www.freecodecamp.org/padunk
Gaurav
@gauravmagan
Dec 02 2017 03:40
Screen Shot 2017-12-01 at 10.40.06 PM.png
Screen Shot 2017-12-01 at 10.40.17 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 03:41
Anyone need help?
Gaurav
@gauravmagan
Dec 02 2017 03:41
<nav class="navbar navbar-fixed-top">
      <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">
            <img src="logo_3.png" class="img-responsive" alt="brand logo">
          </a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
<!--             <li><a class="scrollto" href="#home">Home</a></li>
 -->            <li ><a href="views/about.html">About</a></li>
            <li><a href="views/services.html">Services</a></li>
            <li><a  href="views/contactus.html">ContactUs</a></li>
            <!-- <li><a class="scrollto" href="#clients">Clients</a></li>
            <li><a class="scrollto" href="#pricing">Pricing</a></li>
            <li><a class="scrollto" href="#contact">Contact</a></li> -->
          </ul>
        </div><!-- /.navbar-collapse -->
      </div><!-- /.container-fluid -->
    </nav>
yes
@kerafyrm02
kerafyrm02
@kerafyrm02
Dec 02 2017 03:41
Sure- whaat's your Q
Gaurav
@gauravmagan
Dec 02 2017 03:42
i was trying to create a contact page and the navbar is dissappearing when i click on the tab
and showing as it shown in screenshot which i have shared it above
kerafyrm02
@kerafyrm02
Dec 02 2017 03:42
Which tab
Gaurav
@gauravmagan
Dec 02 2017 03:42
contact tab
below is the code for the navtabs
kerafyrm02
@kerafyrm02
Dec 02 2017 03:42
can you link me the site
Gaurav
@gauravmagan
Dec 02 2017 03:43
its in my local ill share the screenshots once again
this is the home page
Screen Shot 2017-12-01 at 10.40.06 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 03:43
ok
Gaurav
@gauravmagan
Dec 02 2017 03:43
Screen Shot 2017-12-01 at 10.40.17 PM.png
this is the contact us page
kerafyrm02
@kerafyrm02
Dec 02 2017 03:43
Ok
are you using javascript?
Gaurav
@gauravmagan
Dec 02 2017 03:44
yes
kerafyrm02
@kerafyrm02
Dec 02 2017 03:44
post it plz
or
Gaurav
@gauravmagan
Dec 02 2017 03:44
i dint write the Javascript code to render the html
kerafyrm02
@kerafyrm02
Dec 02 2017 03:44
are you using chrome?
Gaurav
@gauravmagan
Dec 02 2017 03:44
yes
kerafyrm02
@kerafyrm02
Dec 02 2017 03:45
what are you clicking on thats making it go there?
Gaurav
@gauravmagan
Dec 02 2017 03:45
its a href tag to contactus page
in the button in the nav tab
but when it goes to that page its not showing the menu
kerafyrm02
@kerafyrm02
Dec 02 2017 03:46
oh
Gaurav
@gauravmagan
Dec 02 2017 03:46
it should be on top
im using a template got it in the market
kerafyrm02
@kerafyrm02
Dec 02 2017 03:46
so when you click Contact Us link it goes to that page but isn't showing the nav at top?
Gaurav
@gauravmagan
Dec 02 2017 03:46
yep
kerafyrm02
@kerafyrm02
Dec 02 2017 03:46
You bought it?
Gaurav
@gauravmagan
Dec 02 2017 03:46
ye
kerafyrm02
@kerafyrm02
Dec 02 2017 03:47
Eeep
Don't do that-- i can make you one
Ok can you paste whats in url
when you go to contact page
this is the url when i go to the contact page
kerafyrm02
@kerafyrm02
Dec 02 2017 03:48
ok and the html up above is from contact us page?
the html that you pasted
Gaurav
@gauravmagan
Dec 02 2017 03:48
no its in index.html
kerafyrm02
@kerafyrm02
Dec 02 2017 03:49
ok well you have to have it on your contact us page if you want that menu to show
Gaurav
@gauravmagan
Dec 02 2017 03:49
Screen Shot 2017-12-01 at 10.47.15 PM.png
this is contact us html
i tried it but but what about the css
kerafyrm02
@kerafyrm02
Dec 02 2017 03:49
ooo i like those views
show me the other two
Gaurav
@gauravmagan
Dec 02 2017 03:49
its not a better practice
other two?
kerafyrm02
@kerafyrm02
Dec 02 2017 03:50
which backend language are you using
PHP?
Gaurav
@gauravmagan
Dec 02 2017 03:50
i dintuse any
kerafyrm02
@kerafyrm02
Dec 02 2017 03:50
ok
do this
Gaurav
@gauravmagan
Dec 02 2017 03:50
hey im coding
in javascript
kerafyrm02
@kerafyrm02
Dec 02 2017 03:51
yeah best would be to make footer.html header.html
paste the menus into those
Gaurav
@gauravmagan
Dec 02 2017 03:51
ok and ?
kerafyrm02
@kerafyrm02
Dec 02 2017 03:52
then whenever you want to display a page include them
Gaurav
@gauravmagan
Dec 02 2017 03:52
ok
kerafyrm02
@kerafyrm02
Dec 02 2017 03:52
display header.html
contact us page
display footer.html
on one page
Gaurav
@gauravmagan
Dec 02 2017 03:52
cool
kerafyrm02
@kerafyrm02
Dec 02 2017 03:52
then the middle part becomes dynamic and changes page to page
Gaurav
@gauravmagan
Dec 02 2017 03:52
oh
its a good practice
ill try that
kerafyrm02
@kerafyrm02
Dec 02 2017 03:53
yeah considering the languages you're using
php for a backend language would be much easier
Gaurav
@gauravmagan
Dec 02 2017 03:53
why is there a need to use php until i use to store the contact us
kerafyrm02
@kerafyrm02
Dec 02 2017 03:54
It's a server language. It just helps manage which page to display among other things.
But you're fine with what you're doing--
Gaurav
@gauravmagan
Dec 02 2017 03:55
oh should i use the script php
i never used to php hahaha
kerafyrm02
@kerafyrm02
Dec 02 2017 03:55
you make a file with the extension .php
example
<?php

//controls which page to show
$current_page = 'contactus';

require_once('header.php');
require_once($current_page . '.php');
require_once('footer.php');
?>
then you just change the current_page variable.
but i prefer classes
Gaurav
@gauravmagan
Dec 02 2017 03:58
nice
thank you @kerafyrm02
CamperBot
@camperbot
Dec 02 2017 03:59
gauravmagan sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 258 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
kerafyrm02
@kerafyrm02
Dec 02 2017 04:00
<?php

     function __construct(){}

      function print_header(){
           //head 
       }

     function print_footer(){
          //footer
      }
?>
// index.php file

<?php
require_once('designTemplate.php');
$template = new Template();

$template->print_header();
//display page here

$template->print_footer();
Gaurav
@gauravmagan
Dec 02 2017 04:02
is there a way not to do without php
kerafyrm02
@kerafyrm02
Dec 02 2017 04:02
yeah
use jquery
a.html:

<html> 
  <head> 
    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#includedContent").load("b.html"); 
    });
    </script> 
  </head> 

  <body> 
     <div id="includedContent"></div>
  </body> 
</html>
b.html:

<p>This is my include file</p>
copied from stackoverflow
So in your situation... hhere i'll tweak it
index.html

<html> 
  <head> 
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
    <script> 
    $(function(){
      $("#includeHeader").load("header.html"); 
    });
    </script> 
  </head> 

  <body> 
     <div id="includeHeader"></div>
  </body> 
</html>

header.html:
// This is your html file.... It should have this has nav bar
i woudl use the jquery cdn
Gaurav
@gauravmagan
Dec 02 2017 04:07
oh
kerafyrm02
@kerafyrm02
Dec 02 2017 04:08
i added it for you
You just need the nav bar only
since it will have the head at top
Gaurav
@gauravmagan
Dec 02 2017 04:09
is it the code to be in contact us page
kerafyrm02
@kerafyrm02
Dec 02 2017 04:10
this code is your index.html page
it acts as a controller.
Gaurav
@gauravmagan
Dec 02 2017 04:10
got it
kerafyrm02
@kerafyrm02
Dec 02 2017 04:10
you can name it whatever you want
to simply this-
just add this to your contact page
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
    <script> 
    $(document.ready(function(){
      $("#include_navbar").load("navbar.html"); 
    });
    </script>
then add this line in your contact page after <body> tag
<div id="include_navbar"></div>
Gaurav
@gauravmagan
Dec 02 2017 04:13
cool
thats a clear explanation
i got it
kerafyrm02
@kerafyrm02
Dec 02 2017 04:14
then copy your navbar into the file navbar.html
Gaurav
@gauravmagan
Dec 02 2017 04:19
Screen Shot 2017-12-01 at 11.19.25 PM.png
Screen Shot 2017-12-01 at 11.19.43 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:20
did you add the script tags
Gaurav
@gauravmagan
Dec 02 2017 04:20
Screen Shot 2017-12-01 at 11.19.51 PM.png
yes
kerafyrm02
@kerafyrm02
Dec 02 2017 04:20
youre missing
1
for the jquery
you're missing <
and byw
Ryan Williams
@Ryanwfile
Dec 02 2017 04:21
Can someone help me eliminate the white space that appears at the top of this pen when I add an h1 tag to the div class "top" , all of the html is marked at the top of page, thank you very much for any help https://codepen.io/Ryanwfile/pen/wPNBdr
kerafyrm02
@kerafyrm02
Dec 02 2017 04:21
you want to use
```
$(document).ready(function(){

});
Gaurav
@gauravmagan
Dec 02 2017 04:21
i did correct that syntax
Screen Shot 2017-12-01 at 11.21.12 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:22
i can help you ryan give me a min
post code guarav
Gaurav
@gauravmagan
Dec 02 2017 04:23
<html>
<head>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
    <script> 


      $(document).ready$(function(){
      $("#include_navbar").load("navbar.html"); 
    });
    </script>

</head>

<body>
<div id="include_navbar"></div>

</body>

</html>
kerafyrm02
@kerafyrm02
Dec 02 2017 04:23
@Ryanwfile
 .top > h1 {
    margin-top: 0;
}
Ryan Williams
@Ryanwfile
Dec 02 2017 04:23
@kerafyrm02 Thank you very much
CamperBot
@camperbot
Dec 02 2017 04:23
ryanwfile sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 259 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
kerafyrm02
@kerafyrm02
Dec 02 2017 04:24
you have $ after ready guar
$(document).ready(function(){
      $("#include_navbar").load("navbar.html"); 
    });
Gaurav
@gauravmagan
Dec 02 2017 04:24
its the same
Ryan Williams
@Ryanwfile
Dec 02 2017 04:25
@kerafyrm02 That worked perfectly, what would be the best method to center the text vertically?
kerafyrm02
@kerafyrm02
Dec 02 2017 04:25
which text
Ryan Williams
@Ryanwfile
Dec 02 2017 04:25
the text inside the h1 tag
@kerafyrm02 so it appears in the middle of the background image
kerafyrm02
@kerafyrm02
Dec 02 2017 04:26
.top > h1 {
    margin-top: 0;
   display: flex;
   align-items: center;
justify-content: center;
}
oh on image might be differ
Ryan Williams
@Ryanwfile
Dec 02 2017 04:26
@kerafyrm02 Awesome, thank you so much, I was using padding but this will probably be better
CamperBot
@camperbot
Dec 02 2017 04:26
ryanwfile sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
api offline
kerafyrm02
@kerafyrm02
Dec 02 2017 04:27
Which image are you trying to center on
that will just center the text inside the h1
Gaurav
@gauravmagan
Dec 02 2017 04:27
Screen Shot 2017-12-01 at 11.21.12 PM.png
its same
Ryan Williams
@Ryanwfile
Dec 02 2017 04:28
@kerafyrm02 just the one background image with the laptop
kerafyrm02
@kerafyrm02
Dec 02 2017 04:28
add this too guar
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"</script>
Ryan Williams
@Ryanwfile
Dec 02 2017 04:29
@kerafyrm02 padding with 25% seems to work well so far, just not sure if there's a better method
kerafyrm02
@kerafyrm02
Dec 02 2017 04:29
i nvr use % on padding
Gaurav
@gauravmagan
Dec 02 2017 04:30
whats the second script?
kerafyrm02
@kerafyrm02
Dec 02 2017 04:30
i am still confused on what you're trying to do
it's for jquery ui
the other one is for core
Gaurav
@gauravmagan
Dec 02 2017 04:30
its didnt worked
Gaurav
@gauravmagan
Dec 02 2017 04:30
can we know how to debug
kerafyrm02
@kerafyrm02
Dec 02 2017 04:31
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
try that one
and delete the other 2
if it doesnt recognize the $ it's the jquery not loading
ryan which laptop
i dont see laptops :P
Gaurav
@gauravmagan
Dec 02 2017 04:32
its showing
less
kerafyrm02
@kerafyrm02
Dec 02 2017 04:32
it's working now?
Gaurav
@gauravmagan
Dec 02 2017 04:32
the server responding to 404
kerafyrm02
@kerafyrm02
Dec 02 2017 04:33
check network tab and see if jquery is loading
then do hard refresh
mac or win?
win / ctrl + shift + R
Gaurav
@gauravmagan
Dec 02 2017 04:33
Screen Shot 2017-12-01 at 11.32.54 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:33
mac / cmd + shft + R
click network
oh nvm
it's working-- its likely a pathing issue
it's not finding your navbar.html file
modify your path
$("#include_navbar").load("/navbar.html");
try with absolute path /
Gaurav
@gauravmagan
Dec 02 2017 04:35
Screen Shot 2017-12-01 at 11.35.37 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:36
yeah it's not finding your navbar.html... try it with the slash
if it doesn't work with the slash will will have to find which folder your navbar.html file is in
Gaurav
@gauravmagan
Dec 02 2017 04:37
nope
kerafyrm02
@kerafyrm02
Dec 02 2017 04:37
ok which folder is your navbar.html file in
make sure it's in same folder as your main file
Gaurav
@gauravmagan
Dec 02 2017 04:37
Screen Shot 2017-12-01 at 11.37.12 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:37
oh views
$("#include_navbar").load("views/navbar.html");
typically a bad practice not to use absolute path
is better written /views/navbar.html // because it ensures you're at the root of the site
Gaurav
@gauravmagan
Dec 02 2017 04:39
Screen Shot 2017-12-01 at 11.32.54 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:40
yeah try with /views/navbar.html
Gaurav
@gauravmagan
Dec 02 2017 04:40
its showing but no css
kerafyrm02
@kerafyrm02
Dec 02 2017 04:40
ok cool
it's working now?
Gaurav
@gauravmagan
Dec 02 2017 04:40
Screen Shot 2017-12-01 at 11.40.19 PM.png
kerafyrm02
@kerafyrm02
Dec 02 2017 04:41
right on- so just add
<link rel="stylesheet" href="name_of_css_file_here">
to your contact us page
that's why not using backend language makes this so much more difficult
Gaurav
@gauravmagan
Dec 02 2017 04:42
ohh
i tried to add all the css
Screen Shot 2017-12-01 at 11.45.23 PM.png
Gaurav
@gauravmagan
Dec 02 2017 04:48
whats happening html are in place why the css is not applying !!! even after giving the files in the head
can we see that in the console
what files are loading in this page
if so how?
kerafyrm02
@kerafyrm02
Dec 02 2017 04:52
it's because it loading it as a separate file
you have to add it to the contact html file as well
i think --- -i havent really loaded a page this way in a long time
Gaurav
@gauravmagan
Dec 02 2017 04:54
Screen Shot 2017-12-01 at 11.54.17 PM.png
browser control says the css the files and i have added those
it should be applying the css in contact us
Ryan Williams
@Ryanwfile
Dec 02 2017 04:57
@kerafyrm02 The background image for the top div should have a laptop with a notepad as the image
kerafyrm02
@kerafyrm02
Dec 02 2017 05:16
i would have to see the link again
Gaurav
@gauravmagan
Dec 02 2017 05:18
@kerafyrm02
kerafyrm02
@kerafyrm02
Dec 02 2017 05:21
hve to go man-- leaving coffee shpp
Gaurav
@gauravmagan
Dec 02 2017 05:22
where are you ?
california
anyways thank you @kerafyrm02
CamperBot
@camperbot
Dec 02 2017 05:22
gauravmagan sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 261 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
Ryan Williams
@Ryanwfile
Dec 02 2017 05:25
@kerafyrm02 Thanks again for the help
CamperBot
@camperbot
Dec 02 2017 05:25
ryanwfile sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
msygin
@msygin
Dec 02 2017 07:47
Hey, can someone help me. I'm on the tribute page challenege and it seems that code pen has changed its layout. Does anyone know how to us the old style since the tribute page hasnt been updated to code pens change?
Also, I can only create one project, how am I to do the next project if I'm only allowed one?
Henry
@GitHub-Henry
Dec 02 2017 07:51
@msygin styling your tribute page is up to you, you can choose a design of your liking
msygin
@msygin
Dec 02 2017 07:52
hm okay, It just says on a free account I can only have one but thanks
Henry
@GitHub-Henry
Dec 02 2017 07:54
@msygin @msygin i think you mean a free account may have only 1 PROJECT, that's true, pens don't have a limit
msygin
@msygin
Dec 02 2017 07:54
Ah okay, yeah I thought it was projects I was supposed to do. Totally makes sense now thanks @GitHub-Henry
CamperBot
@camperbot
Dec 02 2017 07:54
msygin sends brownie points to @github-henry :sparkles: :thumbsup: :sparkles:
:cookie: 496 | @github-henry |http://www.freecodecamp.org/github-henry
Henry
@GitHub-Henry
Dec 02 2017 07:56
@msygin good luck with your tribute page, :shipit: :dizzy:
Ryan Williams
@Ryanwfile
Dec 02 2017 08:52
Can someone please help me figure out why when I shrink the size of the width of this pen there is a large amount of white space between the top image and the next div. Any help is greatly appreciated.
https://codepen.io/Ryanwfile/pen/wPNBdr
I think it's something as simple as the image height, but not sure the best method to make image responsive to all devices
primuscovenant
@primuscovenant
Dec 02 2017 09:15
@heroiczero thx
CamperBot
@camperbot
Dec 02 2017 09:15
primuscovenant sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2086 | @heroiczero |http://www.freecodecamp.org/heroiczero
Daria Doronina
@Skidle
Dec 02 2017 10:07
@Ryanwfile check this out https://codepen.io/theiwaz/pen/vybjc
Anshul Adlakha
@anshuladlakha
Dec 02 2017 12:00
Suppose if I had to get data from an API and update it in real time, how would that work out in code. I am still learning about APIs so excuse me for my noob question.
Lamex
@MrLamex
Dec 02 2017 12:09

Hello guys. how y'all doin today?
Anyway, i came here to tell you that i'm recruiting for my new project.

What is my new project?
Well, it doesnt have a name yet but the project is based about creating and designing themes to various sites such as:

  1. Facebook
  2. Twitter
  3. Google
  4. Discord
  5. Youtube
    *And much more.

The project will have a group of 10 people (programmers & Designers) that will customize themes for a website.
Sound interesting? contact me via discord @ αѕтяσ#2956 or type here where can i contact you.

PEACE! :thumbsup:

yardr
@yardr
Dec 02 2017 12:35
Hi. Can anyone suggest where I can get jquery slider like that on the screen https://prnt.sc/hi3gn8 ?
dinesh
@1532j0004kg
Dec 02 2017 12:36
sliddown?
W3school!!! @yardr
Ken Haduch
@khaduch
Dec 02 2017 13:22
@yardr - have you just googled for one? There are many jquery plugins, and there might even be one in the jqueryui package?
@yardr - https://jqueryui.com/slider/ - not sure if it's like the one you are looking for, I couldn't tell from the image that you posted. But there is one in the jqueryui packages.
yardr
@yardr
Dec 02 2017 13:25
@khaduch Hi Ken. Thanks for the link. Yes, i've googled recently and found one solution and I'm going to try it
Ken Haduch
@khaduch
Dec 02 2017 13:29
@yardr - well, even though that is a "slider", it doesn't appear to be a photo gallery, if that's what you were really looking for? This one in the jquery registry of plugins looks really slick!
yardr
@yardr
Dec 02 2017 13:32
I think I will try this readymade slider http://bestjquery.com/tutorial/testimonial/demo59/
Ken Haduch
@khaduch
Dec 02 2017 13:36
@yardr - looks good! I hope it works for you... good luck with your project!
yardr
@yardr
Dec 02 2017 13:39
@khaduch Thanks, same to you!
CamperBot
@camperbot
Dec 02 2017 13:39
yardr sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3554 | @khaduch |http://www.freecodecamp.org/khaduch
Bartek Lewandowski
@Jabarlew
Dec 02 2017 14:44
thanks @moT01
CamperBot
@camperbot
Dec 02 2017 14:44
jabarlew sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 924 | @mot01 |http://www.freecodecamp.org/mot01
help me to solve this one
plzzzz
Hafiz Mughees siddiqui
@Mughees605
Dec 02 2017 15:19
@diptinayan you need to create a copy of this object by calling this car function constructor with new keyword and set some new propertes
Tiago Correia
@tiagocorreiaalmeida
Dec 02 2017 15:35
is there any webdesigner around here ?:D
Stephen James
@sjames1958gm
Dec 02 2017 15:48
@diptinayan The instructions show you how to create a car
var myCar = new Car();
and they show you how to add a new property
myCar.turboType = "twin";
Marco Mazzeo
@Doko85
Dec 02 2017 15:54

guys I'm on the Symmetric Difference JS challenge and somehow it seems that running Array.from(args) or Array.prototype.slica.call(args) to switch the array-like object arguments to an array one it's not working. Even cycling through it with a for and pushing args[i] on a new array doesn't work...

It only takes the first array inside args and not all of the passed ones.

Ken Haduch
@khaduch
Dec 02 2017 16:02
@tiagocorreiaalmeida - what's happening today?
Tiago Correia
@tiagocorreiaalmeida
Dec 02 2017 16:03
just me overthinking if mydesign is good enough :D but someone allready told me that's an okay design so ready to move further :D
A_A
@Otto-AA
Dec 02 2017 16:27
@Doko85 What about using arguments? e.g. Array.from(arguments) to get all parameters as an array
G-4-R-Y
@G-4-R-Y
Dec 02 2017 17:38
hey guys, i need some help with my code
its returning 2 times the value i want
for 12, its returning "XIIXII", for example
function convertToRoman(num) {
 var roman = ["I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "L", "C", "D", "M"];
 var decimal = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "50", "100", "500", "1000"];
 var separate = ("" + num).split("");
 var newNum = [];

  for (i = 0; i < separate.length; i++) {
    var decimalNum, romanNum;

    if (separate.length == 1) {
      decimalNum = decimal.indexOf(separate[i]);
      romanNum = roman[decimalNum];
      newNum += romanNum;
    }

    else if (separate.length == 2) {
      // decimals = separate[0];
      // units = separate[1];
      if (separate[0] < 4) {
        for (a = separate[0]; a >= 1; a--) {
          newNum += "X";
        }
      }
      else if (separate[0] == 4) {
        newNum += "XL";
      }
      else if (separate[0] == 5) {
        newNum += "L";
      }
      else if (separate[0] > 5 && separate[0] < 9) {
        newNum += "L";
        for (a = separate[0] - 5; a >= 0; a--) {
          newNum += "X";
        }
      }
      else if (separate[0] == 9) {
        newNum += "XC";
      }
      decimalNum = decimal.indexOf(separate[1]);
      romanNum = roman[decimalNum];
      newNum += romanNum;     
    }
  }


 var result = ("" + newNum);
 console.log(result);
 return result;
}

convertToRoman(12);
Ken Haduch
@khaduch
Dec 02 2017 17:39
@G-4-R-Y - just divide it by 2... :)
Or post a link to your code... oops, there it is! :)
G-4-R-Y
@G-4-R-Y
Dec 02 2017 17:39
hahahahaha xD
Ken Haduch
@khaduch
Dec 02 2017 17:41
@G-4-R-Y - maybe you could try running your code in pythontutor.com and watch how your result is generated?
G-4-R-Y
@G-4-R-Y
Dec 02 2017 17:42
okay, ill give it a try
thanks @khaduch
CamperBot
@camperbot
Dec 02 2017 17:42
g-4-r-y sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3556 | @khaduch |http://www.freecodecamp.org/khaduch
Ken Haduch
@khaduch
Dec 02 2017 17:42
I'm a little suspicious about the way your setting newNum in all of those conditions and then later also appending romanNum to it? But I haven't tried it in detail yet.
@G-4-R-Y - pythontutor is not happy that you have used variables without declaring them... like var i should be used for your loop control variable.
G-4-R-Y
@G-4-R-Y
Dec 02 2017 17:47
@khaduch yeah, im fixing it lol
oooh, its running the loop twice!!
thanks again, @khaduch
CamperBot
@camperbot
Dec 02 2017 17:49
g-4-r-y sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
api offline
G-4-R-Y
@G-4-R-Y
Dec 02 2017 17:49
i don't think i even need a loop
Ken Haduch
@khaduch
Dec 02 2017 17:50
@G-4-R-Y - it's a nice tool. I saw it put the extra X in there, but I wasn't paying attention... - you're welcome for the help. Put that tool in your tool belt! :) It's good for these relatively simple problems. It doesn't do well on anything with bit looping / recursion steps.
Alvaro
@minutazos
Dec 02 2017 17:57
Hi, someone can help me find the reason of a bug that, apparently, doesn't have any reason? :') The bug appears on www.josepcano.com/blog at the menu, the first link has a height larger than the other links of the menu, but the css applied is exactly the samen, and from the dev tools the computed style is exactly the same, anyone could have any idea of why is this happening? ty very much for your attention :)
ps: there is no js affecting the menu, but the js of the bootstrap modal, but it shouldn't affect links
Liam Docherty
@ldocherty1
Dec 02 2017 17:58

When the user clicks on my font awesome icon within the JS how can I change the scroll down speed?

// transition from S1-S2 function
$(document).ready(function() {
    $(".fa.fa-angle-double-down").on('click', function(event) {
        event.preventDefault();
        debugger;
        if (this.parentElement.hash !== "") {
            event.preventDefault();
            // Store hash
            var hash = this.parentElement.hash;
            console.log(`hash = ${hash}`);
            $('html, body').animate({
                scrollTop: $(hash).offset().top
            }, 300, function() {
                window.location.hash = hash;
            });
        } // End if
        console.log(`hash2 = ${hash}`);
    });

I tried changing the value 300 however nothing happened.

Alvaro
@minutazos
Dec 02 2017 17:58
On the other hand, the menu works perfectly fine on other sections of the page (this is because at the /blog section i dont know why, but if I link the bootstrap css from the main site, there is some components loosing)
Liam Docherty
@ldocherty1
Dec 02 2017 17:59
The last time I done JS was in October so I think I need to re do some #FCC courses.
mvroehling
@mvroehling
Dec 02 2017 18:39
Hello! I want to trigger an action when a bootstrap dropdown menu item is selected. I am using jQuery on('click') function to catch the selection. When I select an item the javascript won't trigger. See my code:
<ul class="dropdown-menu" id="pauschale_dropdown">
                                <li><a href="#">a</a></li>
                                <li><a href="#">b</a></li>
           </ul>
<script type="text/javascript">
    $("#pauschale_dropdown li a").on('click', function() {
        console.log("do something");
    });
</script>
Does anybody have a clue what I'm missing here?
Stephen James
@sjames1958gm
Dec 02 2017 18:42
@mvroehling Any errors in the console? I tried it on jsbin at this code worked.
A_A
@Otto-AA
Dec 02 2017 18:42
@mvroehling Do you have jquery included, and is it loaded before your script gets executed?
Maybe try to wrap it in a $(document).ready(function() { ...your code...}); block?
mvroehling
@mvroehling
Dec 02 2017 18:43
@Otto-AA yes, jquery-is loaded at top of the page
@Otto-AA I will try to wrap it
@Otto-AA Thank you! Wrapping it into the document.ready function does the trick. Can you explain me why this works?
CamperBot
@camperbot
Dec 02 2017 18:46
mvroehling sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 399 | @otto-aa |http://www.freecodecamp.org/otto-aa
A_A
@Otto-AA
Dec 02 2017 18:48
@mvroehling I got trained to always wrap it into this so I am not sure... but I think it is because the document didn't finished loading and therefore you tried to add the listener to non-existing elements. And $(document).ready waits for that
Benjmhart
@Benjmhart
Dec 02 2017 19:51
hey gang, I am putting together my first environment to work with node for previewing react projects in an ubuntu VM - is there a good guide anyone can recommend for getting like a webpack set up so I can preview my work on the VM as I develop?
A_A
@Otto-AA
Dec 02 2017 20:01
@Benjmhart The easiest thing to do is to use create-react-app. With that you only have to run few commands and it will install everything you need.
npm install -g create-react-app

create-react-app my-app
cd my-app/
npm start
But obviously you won't learn how to use webpack and stuff this way :)
Adel
@AdelMahjoub
Dec 02 2017 20:20
I'm looking for some feedbacks concerning the layout or design of this site GEO-IP, mainly is it banal, not bad or bof or okey ?
Benjmhart
@Benjmhart
Dec 02 2017 20:30
looks pretty banal - it looks like a simple tool, nothing snazzy for a customer, but something that could be useful for a technician, is that what you want your user to think about it?
Adel
@AdelMahjoub
Dec 02 2017 20:31
@Benjmhart yes, mostly readable
A_A
@Otto-AA
Dec 02 2017 20:31
@AdelMahjoub I like it. Simple but nice :thumbsup:
Some things I'd change but I guess there will always be something I don't like
Adel
@AdelMahjoub
Dec 02 2017 20:31
@Benjmhart @Otto-AA thanks for the feedbacks
CamperBot
@camperbot
Dec 02 2017 20:31
adelmahjoub sends brownie points to @benjmhart and @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 400 | @otto-aa |http://www.freecodecamp.org/otto-aa
:cookie: 335 | @benjmhart |http://www.freecodecamp.org/benjmhart
AbrisM
@AbrisM
Dec 02 2017 21:02
Hi, does anyone know how to get the <h1> element to do a continous scroll for text?
I have this here but i'm not sure how to incorporate it <marquee behavior="scroll" direction="right">Your slide-in text goes here</marquee>
alpox
@alpox
Dec 02 2017 21:05

@AbrisM As the html reference says:

This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.

about <marquee>
AbrisM
@AbrisM
Dec 02 2017 21:05
Is there a replacement for it?
Linus Phan
@linusphan
Dec 02 2017 21:09
anyone here that can point me to good documentation or websites to learn Ajax?
alpox
@alpox
Dec 02 2017 21:30
@AbrisM Yes - you can make overflow: auto in any div/element and it will be scrollable if the content in it grows to big
Thats a css property
You can also make the scrollbar always be there with overflow: scroll
or overflow-y: scroll if you only want the vertical one
Linus Phan
@linusphan
Dec 02 2017 22:07
Hey guys, for the Random Quote generator, I am trying to use this as my API: http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?
But I get an error that says this: No 'Access-Control-Allow-Origin' header is present on the requested resource
does that mean i need to find another API?
Adel
@AdelMahjoub
Dec 02 2017 22:49
@linusphan try this one
@linusphan or this one
@linusphan or this one
Linus Phan
@linusphan
Dec 02 2017 23:01
@AdelMahjoub Thanks =)
CamperBot
@camperbot
Dec 02 2017 23:01
linusphan sends brownie points to @adelmahjoub :sparkles: :thumbsup: :sparkles:
:cookie: 635 | @adelmahjoub |http://www.freecodecamp.org/adelmahjoub
Linus Phan
@linusphan
Dec 02 2017 23:01
Seems to be working now
Adel
@AdelMahjoub
Dec 02 2017 23:04
@linusphan no problem, now build build some cool quote generator :+1:
Linus Phan
@linusphan
Dec 02 2017 23:18
@AdelMahjoub Lol I can't right now..
I'm trying to learn all about JSON and AJAX
Santiago Fernandez
@sf-jd
Dec 02 2017 23:34
sup room
mohammed-rabii
@mohammed-rabii
Dec 02 2017 23:58
hii
please someone give us some exercise for practices js