@ldocherty1 you can change the button type to 'button' (rather than having type='submit')
@SkyC0der
hey sky
Screen Shot 2017-08-11 at 8.22.55 PM
whats the effect did they use
like when we click on the element the icons on the right are selected too
@gauravmagan I'm not sure what effect they used, but if you right-click the elements and select "inspect", you will be able to study the code more closely.
Hello @junipberry
hey guys why my media query is not working properly on second image? https://codepen.io/sabin20/pen/EvPgMd
@sabin20 what isn't working?
@longnt80 I think @sabin20 already got help. They posted their question in all the rooms at the same time
Maybe on the forums too
@SkyC0der oh ok
yeah, I noticed
@longnt80 the text caption
@sabin20 the second image is taller than the other two
@longnt80 even I tried different margin, it doesnot seem to work
@sabin20 best way is to resize all images to the same size
or use images as css background with
or use images as css background with
background-size: cover
@longnt80 thanks
sabin20 sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 495 | @longnt80 |http://www.freecodecamp.com/longnt80
@sabin20 np
hello masters!! need help. i have a problem on algorithm entitled pig latin.
how can i stop the loop when it hit another consonant?? i tried return and i cant make it work.heres my code:
how can i stop the loop when it hit another consonant?? i tried return and i cant make it work.heres my code:
function translatePigLatin(str) {
var vowelsArr = 'aeiou'; //way
//var constArr = 'BCDFGHJKLMNPQRSTVWXYZ'.toLowerCase(); //ay
var uno = [];
var dos = [];
str = str.split('');
if (vowelsArr.indexOf(str[0]) === -1) {
for (var i = 0; i < str.length; i++) {
if (vowelsArr.indexOf(str[i]) === -1) {
dos.push(str[i]);
} else if (vowelsArr.indexOf(str[i]) > -1) {
uno.push(str[i]);
uno = uno.join('');
dos = dos.join('');
return uno + dos;
}
}
} else {
return str.join('') + 'way';
}
}
//translatePigLatin("consonant");
//translatePigLatin("california"); //should return "aliforniacay".
//translatePigLatin("paragraphs"); //should return "aragraphspay".
translatePigLatin('glove'); //should return "oveglay".
//translatePigLatin("algorithm"); //should return "algorithmway".
//translatePigLatin("eight"); //should return "eightway".
@artoodeeto - you're missing the last part of the word - once you find a vowel you are formulating the return, but you might (and probably do) have the remainder of the word to grab.
you could probably use some additional function like slice or splice or even substring to get the remainder of the word after the index value that you are currently at.
and you aren't appending the 'ay' for that case.
anyone able to help with a bootstrap 4 issue?
@BGarbs we can try, ask away :thumbsup:
how am I able to vertically and horizontally center a div on my page with bootstrap 4 classes?
@kirah1314 I'm sure it's been asked 1M times but alas, I'm the +1
@BGarbs Do you have a codepen? Want to see what your html structure looks like
@cysonya sure thing....
@cysonya https://codepen.io/BGarbs/pen/qXXRyP
@cysonya would also appreciate the help getting the "author" portion aligned "end" or right
@BGarbs sorry, I don't know that one but I found it on Stackoverflow if you want to see it
@kirah1314 I saw one answer on there as well. But maybe you found a different one. Feel free to share link. I'm grateful
@BGarbs did you want to use bootstrap to align the 'author' to the right? Otherwise you could use
float: right;
@gothamknight truthfully, I'd like to know in you guy's opinion what's the best way to accomplish center/center positioning for the "quote generator" div and getting that "-Author" to the right?
I know there are always multiple ways to do something but I'm trying to find the best way
@BGarbs I normally use
flexbox to vertically/horizontally center something
which takes about 10 lines of CSS
@kirah1314 right...that's what I'm trying to accomplish. How ought I do that? set the whole body to display:flex then code everything accordinly. Or use class="d-flex..." in each element as I've been doing?
@BGarbs I have an example if you want to see it https://codepen.io/kirah1314/pen/oBdPpd
Actually, I might have an idea. one minute
@BGarbs my opinion isn't really valid - I'm still a beginner. I haven't used bootstrap in a while (still need to learn flexbox) so tend to use margin: auto and float: right.
@gothamknight this was really helpful for me in learning flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/
@gothamknight all good. Here's a great tool to learn the functionality of flexbox
@kirah1314 lol thinking along the same lines! nice
@BGarbs nice! I would avoid making the whole
body flex though
@kirah1314 yeah. ok
I may have to try re-writing from scratch and make sure each element is lining up as I want it to as I code top to bottom
@kirah1314 I feel like i've been tweaking for so long it may be too messy
@gothamknight you leave us to go play flexboxfroggy?
lol
Alright, well thanks for the help anyway guys! I gotta hit the sack for tonight
@BGarbs haha tinkering is a great way to learn :)
@kirah1314 you bet
@BGarbs @kirah1314 thanks for the resources guys. Nah bro, I'm going over a lecture haha
gothamknight sends brownie points to @bgarbs and @kirah1314 :sparkles: :thumbsup: :sparkles:
:cookie: 167 | @bgarbs |http://www.freecodecamp.com/bgarbs
:cookie: 997 | @kirah1314 |http://www.freecodecamp.com/kirah1314
@BGarbs Give your body a height, like 100vh, put your card in a column, then put the column in a row, and put all of that in a container. Give your container the classes:
h-100 d-flex justify-content-center align-items-center
A fork to show what I mean: https://s.codepen.io/anon/pen/oeeZGJ?editors=1100
You could also apply those classes to the row (without d-flex) if you give the container a height instead and it will be vertically + horizontally centered based on the container height
hello guys
one question
a big one
@lfvpCO fire away! :)
I am new coding.. and I want to know how often coders copy and paste codes like css transitions and js codes..
?
that depends, copy and paste codes from and to where?
I mean, if I get a job in a company. is the a good practice ?
well, im checking for example a css maker.. this web produce code for animation and things like that
it's always good to reuse and/or modularize codes if that's what you're asking but sometimes we have to copy/paste
I starting with project and I add these css code and my web looks great..
cool
coz I think in JS is different
right, so it really depends on the context. Even if it's JS, we may still copy/paste stuff like
import React from 'react'
Or even copy pasting variable names to use elsewhere so you can be sure there's no typos
but functionality can be reused by using JS functions
I think the spirit of the question was to ask if copy-pasting solutions from stack overflow, or generated css from one of the many "style generator" sites out there, is acceptable in a workplace environment
I would say it is but don't try to pass it off as your own @lfvpCO
i mean.. this is while Im studying these codes properly.. now I mixing html css ans js with some animation and it is cool.. just in 2 week ans think i have got more progress checking these example and testing them
but I wanna understand the codes..
What the best way to compare two arrays?
I'm pushing to two different arrays for buttons pushed and random buttons. Is there a good way to make sure they are the same? https://codepen.io/lalov1/full/MvgvxY/
@lalov1 One way is to sort the two arrays and then use
.toString() on them to compare the strings. You might also want to look back at your solution to the Diff Two Arrays challenge.
Wouldn't it be possible to how two completely different looking sites with just two media queries and completely different styles applied in CSS
@SkyC0der if a variable - which is never going to be modified - is only ever going to be used by one function, it is better to declare that variable inside the function that uses it right?
@gothamknight Yeah, that's a good practice as far as I know
@SkyC0der cool
@taiJones00 yeah, you can do a lot with CSS - no HTML needed :)
awesome thanks @SkyC0der
taijones00 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2373 | @skyc0der |http://www.freecodecamp.com/skyc0der
You're welcome :sparkles:
https://codepen.io/taiJones00/pen/ZyEajO So I could keep this design for desktop and change to a more mobile friendly one of mobile? I like the design and don't want to trash it @SkyC0der
@taiJones00 Yes, you could do that, but that isn't done very often to my knowledge. Bootstrap makes it so you don't need to write two different versions of your CSS with media queries.
That's what all the
xs, sm, md, etc... grid sizes are for
I don't know it just looks so scrunched up on mobile
yeah, there shouldn't be padding/margins on the sides on mobile screen size
it would look a little nicer if those sections touched the edge of the screen
You could remove the offsets for
xs and just use col-xs-12
whoa what
okay stay online we've got to try this
so should i do col-xs-12 or col-sm-12
Try modifying
xs first and see if that's what you like
For example, that first one would be:
<div class = "col-xs-12 col-sm-10 col-md-10 col-sm-offset-1 col-md-offset-1 blue about">
oh
my
god
this doesn't look terrible
I think it looks a little nicer, yeah
okay so do I need both sm and xs
because I just put all three options becase I didn't know
If you want the blue sections touching the edge of the screens on tablet sized devices, do it for
sm too
otherwise, just xs
so like a media query? Like col-12 until otherwise which is this case is when I hit medium which is col-10?
That HTML I put above means 100% wide on mobile screens and 83% wide everywhere else
col-sm-10 = 83% wide (10 columns out of 12 maximum), 10/12 = .83
i'll see what looks best
same with col-md-10
sky's the best
Just resize your browser and see what you like
It's a great looking portfolio, nice and clean layout - good work so far
thank you very much BUT THERE IS ONE PROBLEM
the cards are all full width on mobile
BUT
the navbar isn't
you see there's no col-?? with that one so I don't know why it's like that
I'm not sure I understand
the navbar is the only one I can't get to go the full with of the page
@SkyC0der I’m going to work to get you a badge for all of the help you provide in this channel.
@jimtryon A badge? :)
Yes, a badge .:)
I do need a better profile picture
<----- this is getting old for me lol
the pencil looks clever
How long have you had that profile picture?
Lots of people think it's a pencil :) it's actually a frosty mug of lemonade :)
[ ]>
ohhhh
I was thinking it’s a frosty mug of beer but same thing
It is beer too - depends on the time of day
Maybe had it for a month or two now
Better question, how long have you been helping out on FCC?
Maybe really active for around 4 months?
I wrote my first line of code back in late January when my friends told me about this place.
It seems like you have been around longer
Of course, I haven’t been around that long, though I started FCC about a year or two ago when I heard it
@SkyC0der what are you currently learning/going to learn next?
and are you already employed @SkyC0der?
I'm going to have to take a break for school I think @gothamknight and then reassess
@jimtryon No, two more years of school left.
You are on the school track.
Is that for a four year degree or just two?
Then we'll see where the code takes me, it has been fun, so maybe I'll try a computer science course
Four year degree
Nice, have you had the opportunity to intern somewhere?
No, I study linguistics at school. Not many intern opportunities
Probably going to end up as a barrista if I don't get better at coding lol
End up as a developer at a starbucks :)
haha, that could be cool
I hear they have a big data science department
hey a little help here
how do i get thfont to be a little brighter ..?
@SkyC0der true. How many papers do you take each semester in your 4 year degree? Are you doing a minor?
@prakashyadav008 Instead of opacity - try using rgba for your background color so it doesn't affect the text.
@gothamknight Almost have my minor in physics, but that would take a 5th year.
So, no minor
@SkyC0der so how many papers each semester? Is linguistics by itself a 4 year degree?
Papers = essays to write? I'll have one large paper to write before I graduate in my last year
i need it to be a little transparent @SkyC0der
@prakashyadav008 That's what
rgba does, it make the color transparent.
For example:
.section2 {
line-height: 100%;
background-color: rgba(0, 0, 0, 0.5);
color: #eee;
text-align: center;
position: absolute;
width: 100%;
top: 40%;
}
you could use it for the font-color too
different transparencies for background and font
@SkyC0der I guess the terminology is different. At the uni i go to, it is normal to take 3 (final year) or 4 (other years) papers each semester, for your standard degree. So this semester I am taking 3 papers - 2 biochem papers and a genetics paper.....
@gothamknight What is a paper? Like a research paper?
@SkyC0der a course..
@SkyC0der I've never had to explain it to anyone haha.
lol
subjects...
All of our classes are either 3 or 5 credits
courses/classes/subjects
15 credits is full time
yeah that's it haha
We do 12 - 16 credits / semester. 3-4 "papers" :)
finally got the answer haha.
@SkyC0der so why does Linguistics take 4 years?
It really only takes 2 years, but to get a degree, we need another 2 years of general education + electives courses.
Philosophy, psychology, math, chemistry, etc..
@SkyC0der so all those physics, biology and chemistry (?) classes you took make up your electives?
Yes
I have to take a performing arts class my senior year :dancer: :dancers: :)
that must be hell
It's a little annoying, yes
There are lots of options - one is just a music performance class, so we go to random concerts once a week and write an essay about our experience
@SkyC0der those must be the easiest credits one could get
@gothamknight Yeah, we'll see :)
guys,how to learn js...
Easy start following FreeCodeCamp
with the help of fcc , can able to do projects
Did that rgba background color make sense @prakashyadav008 ?
hi Sky Can u give some suggestions to learning js..
Keep working through the Free Code Camp challenge map like you're doing @1532j0004kg. There's also the forums, medium, and youtube in addition to the links in the challenges
Is this looking presentable https://codepen.io/taiJones00/full/ZyEajO/
ok broieee...Tq
I want to work on the other projects but I want to portfolio to look nice
@1532j0004kg Where did you learn the word broieee?
@taiJones00 Nice work :)
Presentable?
@SkyC0der Y bro,,,
@taiJones00 I think so, good job
thanks bud @SkyC0der
taijones00 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2374 | @skyc0der |http://www.freecodecamp.com/skyc0der
I like To use the word "broiee"
I was just curious
haha ok broieee..
what a boi
I don't know, curious where Dinesh learned it
@taiJones00 Nice port folio bro....
hey @SkyC0der is there any reason why one of my locally developed page being slower than the other webpage which is atleast 4 times bigger than the slow webpage?
@sabin20 It could be lots of reasons - external resources, javascript performance, it's hard to tell
thanks brah @1532j0004kg
taijones00 sends brownie points to @1532j0004kg :sparkles: :thumbsup: :sparkles:
:cookie: 238 | @1532j0004kg |http://www.freecodecamp.com/1532j0004kg
@sabin20 Maybe you could put them on Github and try Google PageSpeed Insights https://developers.google.com/speed/pagespeed/insights/
@SkyC0der no javascript is used, I have used only one image in my slower page, which has been compressed and is from the source as the other one
Are the images loaded locally or from different remote servers?
If any of your resources are from other servers on the internet, it could be those servers slowing down your page, but I'm just guessing without knowing more about the pages
remote server, but I tried locally and even without the image, but the page is slow
the image server for both is same and I had used the same image with same server link, still it is slower than the other one
oh man. Its annoyingly slow even without a image
@sabin20 must be your local web server, if you're using one
FreeCodeCamp stratford-Upon-Avon
@prakashyadav008 , works great. Got correct location and temperature. Nice work with the use of html, css classes and javascript. The google api location is spot on.
can any body help to solve the 'Chunky Monkey' algorithm problem?
here is my code:
function chunkArrayInGroups(arr, size) {
// Break it up.
var myArr = [];
var a = arr.length / size;
for(var i = 0; i < a; i++){
myArr = arr.slice(arr[a], size);
console.log(myArr);
}
}
chunkArrayInGroups(["a", "b", "c", "d"], 2);I'm sure i do something idiotic logic. can you tell me where am i doing wrong , plz? and how can i get those outputs
@a2-zubair - check the documentation for Array.slice. It takes one or two index values in the array where it takes the "slice" - so you need to be accessing with two index values, in order to take chunks of the array. Just think about how to get the pairs of index values that you want to use for each slice - that's the trick once you have the proper use of
Array.slice()
@a2-zubair - I see that you also posted in the HelpJavaScript room - you should get help from the people over there... you also have other issues with this code, but the first thing is to get the proper slicing. Then figure out how to generate the output array and use a return because
console.log is basically a diagnostic tool, it will not return any useful values to the caller of the function.
does anyone know when componentwillunmount kicks off exactly?
@Pagnito right before the component gets removed from the pagd
Page*
so it gets called before willmount?
@Pagnito willmount gets called before the component is mounted - so before it appears on the page, but after it was cpnstructed
Constructed*
So that would before willunmount
And willmount is also before didmount
but isnt unmount happens before the new mount happens?
@Pagnito yes, if the component gets unmounted and then mounted again - but that doesnt happen very often. If it just renders with different state or props, there will be no mounting happeninv
If as example the props change and the component has to redraw, componentWillReceiveProps would be called
Also, whenever the component is going to redraw from either state or props, componentWillUpdate would be called
Hi guys I have a weird question about using the jQuery each and nesting that function within another function and calling the data in the argument
i'll explain
I have two functions like this:
/* -----------------
* Return ajax data
* ----------------- */
function appendYouTubeData(data, query) {
// append results & HTML wrapper
$(innerWrapper).append(
'<h2 class="text-center">Results for: ' + query + '</h2>' +
'<div id="results" class="row flex-wrap video-row w-95 m-auto"></div>'
);
// Iterate over each video & append HTML
appendEachVideo(data);
} /* ------ end appendYouTubeData() ------ */
/* ----------------
* Helper Functions
* ---------------- */
function appendEachVideo(videos) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, item.id.videoId);
$('#results').append(output);
});
}
but in the appendEachVideo I want to do this
function appendEachVideo(videos, id) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, id);
$('#results').append(output);
});
}
but then when I goto call the function with
id in another section of my code, it returns undefined
it's hard to explain but if someone is interested, i can show you in a codepen example ?
@JackEdwardLyons Yes, codepen is better
heres the pen
but i need to change teh code to show you
its when you click a category -- im trying to refactor
line
76 @korzo
what i want is to re use the each function with the getOutput function taking an argument instead of the dot notation that exists already
all the code at line
186 should be refactored
@korzo
@JackEdwardLyons as far as I understand, id in getOutput is id of youtube video. Then you will append the same video everytime
no
i know that
what i mean is...
this function needs to take in a parameter instead of the dot notation
function appendEachVideo(videos) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, item.id.videoId); //
$('#results').append(output);
});
}
instead, i want to pass in something like this
function appendEachVideo(videos, videoId) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, videoId);
$('#results').append(output);
});
}
but then when i try to call that function in another place, it returns underfined
for example, this breaks because its undefined
function search() {
// Clear Results
$(innerWrapper, resultsWrapper, buttonsWrapper).html('');
// Get Form Input
q = $('#query').val();
// Run Get request on API
$.get(
"https://www.googleapis.com/youtube/v3/search", {
part: 'snippet, id',
q: q,
channelId: 'UCLhwHoIKtoWBccOFPDmEFpQ',
maxResults: 6,
type: 'video',
key: 'AIzaSyDKJYxyWUDZhykA8DUVOorUbmC7J7QAAUg' },
function(data) {
appendYouTubeData(data, q, item.id.videoId);
speedUpYouTubeLoad(); // add thumbnail instead of full iframe load.
}
);
} /* ------ end search() ------ */
/* -----------------
* Return ajax data
* ----------------- */
function appendYouTubeData(data, query, videoId) {
// append results & HTML wrapper
$(innerWrapper).append(
'<h2 class="text-center">Results for: ' + query + '</h2>' +
'<div id="results" class="row flex-wrap video-row w-95 m-auto"></div>'
);
// Iterate over each video & append HTML
appendEachVideo(data, videoId);
} /* ------ end appendYouTubeData() ------ */
/* ----------------
* Helper Functions
* ---------------- */
function appendEachVideo(videos, videoId) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, videoId);
$('#results').append(output);
});
}
@korzo
@JackEdwardLyons what is item at this line?
appendYouTubeData(data, q, item.id.videoId);
thats what i am trying to resolve -- what i want to do is have
item.id.videoId as a variable or something to pass it in
but currently it refers to the each loop
it is a reference in place for the each loop
refers to
videoId in the appendEachVideo function
man its so hard to explain...
@JackEdwardLyons Oh, ok, so you want to pass the reference to the property, where videoId is stored?
yeah so i can make different api calls
one for the category on line
197
and
line
68
two different API calls
but most of the code is the same
except the endpoint
@JackEdwardLyons What about passing function instead of reference to return data in proper format?
like a callback function? i tried that but failed, but maybe i wasnt doing it right?
@korzo
@JackEdwardLyons something like
appendYouTubeData(data, q, function(item) {return item.id.videoId});
like this maybe?
function search() {
// Clear Results
$(innerWrapper, resultsWrapper, buttonsWrapper).html('');
// Get Form Input
q = $('#query').val();
// Run Get request on API
$.get(
"https://www.googleapis.com/youtube/v3/search", {
part: 'snippet, id',
q: q,
channelId: 'UCLhwHoIKtoWBccOFPDmEFpQ',
maxResults: 6,
type: 'video',
key: 'AIzaSyDKJYxyWUDZhykA8DUVOorUbmC7J7QAAUg' },
function(data) {
appendYouTubeData(data, q,
$.each(data.items, function(i, item) {
var output = getOutput(item, item.id.videoId);
$('#results').append(output);
})
);
speedUpYouTubeLoad(); // add thumbnail instead of full iframe load.
}
);
it says
callback is not a function @korzo
@JackEdwardLyons something like
appendYouTubeData(data, q, function(item) {return item.id.videoId});var output = getOutput(item, videoId(item));
but dont i still need to reference
callbacklike this >>function appendYouTubeData(data, query, callback) {
which breaks
?
@korzo
@JackEdwardLyons why callback? you pass function as argument. take a look at previous message.
doesn't that argumentneed a reference in the initial creation of the function?
ah, i can do this @korzo
function search() {
// Clear Results
$(innerWrapper, resultsWrapper, buttonsWrapper).html('');
// Get Form Input
q = $('#query').val();
// Run Get request on API
$.get(
"https://www.googleapis.com/youtube/v3/search", {
part: 'snippet, id',
q: q,
channelId: 'UCLhwHoIKtoWBccOFPDmEFpQ',
maxResults: 6,
type: 'video',
key: 'AIzaSyDKJYxyWUDZhykA8DUVOorUbmC7J7QAAUg' },
function(data) {
appendYouTubeData(data, q, function() {
$.each(data.items, function(i, item) {
var output = getOutput(item, item.id.videoId);
$('#results').append(output);
});
});
speedUpYouTubeLoad(); // add thumbnail instead of full iframe load.
}
);
} /* ------ end search() ------ */
/* -----------------
* Return ajax data
* ----------------- */
function appendYouTubeData(data, query, callback) {
// append results & HTML wrapper
$(innerWrapper).append(
'<h2 class="text-center">Results for: ' + query + '</h2>' +
'<div id="results" class="row flex-wrap video-row w-95 m-auto"></div>'
);
callback();
// Iterate over each video & append HTML
// appendEachVideo(data);
appendNextButton(data);
} /* ------ end fTubeData() ------ */
@JackEdwardLyons
function search() {
// Clear Results
$(innerWrapper, resultsWrapper, buttonsWrapper).html('');
// Get Form Input
q = $('#query').val();
// Run Get request on API
$.get(
"https://www.googleapis.com/youtube/v3/search", {
part: 'snippet, id',
q: q,
channelId: 'UCLhwHoIKtoWBccOFPDmEFpQ',
maxResults: 6,
type: 'video',
key: 'AIzaSyDKJYxyWUDZhykA8DUVOorUbmC7J7QAAUg' },
function(data) {
appendYouTubeData(data, q, function(item) {return item.id.videoId});
speedUpYouTubeLoad(); // add thumbnail instead of full iframe load.
}
);
} /* ------ end search() ------ */
/* -----------------
* Return ajax data
* ----------------- */
function appendYouTubeData(data, query, videoId) {
// append results & HTML wrapper
$(innerWrapper).append(
'<h2 class="text-center">Results for: ' + query + '</h2>' +
'<div id="results" class="row flex-wrap video-row w-95 m-auto"></div>'
);
// Iterate over each video & append HTML
appendEachVideo(data, videoId);
} /* ------ end appendYouTubeData() ------ */
/* ----------------
* Helper Functions
* ---------------- */
function appendEachVideo(videos, videoId) {
$.each(videos.items, function(i, item) {
var output = getOutput(item, videoId(item));
$('#results').append(output);
});
}
ah isee
@JackEdwardLyons This way you minimize code duplication, because videoId will be oneliner
ok, im not sure if this is working... it is and isnt
thank you @korzo its working
jackedwardlyons sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 368 | @korzo |http://www.freecodecamp.com/korzo
man that was hard to explain :) thank you so much !
@JackEdwardLyons Glad to help
hello masters!! need help. i have a problem on algorithm entitled pig latin.
how can i stop the loop when it hit another consonant?? i tried return and i cant make it work.heres my code:
function translatePigLatin(str) {
var vowelsArr = 'aeiou'; //way
//var constArr = 'BCDFGHJKLMNPQRSTVWXYZ'.toLowerCase(); //ay
var uno = [];
var dos = [];
str = str.split('');
if (vowelsArr.indexOf(str[0]) === -1) {
for (var i = 0; i < str.length; i++) {
if (vowelsArr.indexOf(str[i]) === -1) {
dos.push(str[i]);
} else if (vowelsArr.indexOf(str[i]) !== -1) {
uno.push(str[i]);
uno = uno.join('');
dos = dos.join('');
return uno + dos + 'ay';
}
}
} else {
return str.join('') + 'way';
}
}
//translatePigLatin("consonant");
//translatePigLatin("california"); //should return "aliforniacay".
//translatePigLatin("paragraphs"); //should return "aragraphspay".
translatePigLatin('glove'); //should return "oveglay".do i need to put a counter so i can count how many characters to remove? im not gonna use substr im just going to use splice.
@khaduch thanks
a2-zubair sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3198 | @khaduch |http://www.freecodecamp.com/khaduch
Anyone familiar with google searches that can help me create a search that searches the same category in 2 different locations at once, for instance if I typed sports teams in the search is there a way to search California and New York locations using promises or something similar? Trying to figure out if it's possible to search a few things all at once.
@Ryanwfile if it's a standard JSON request, you could do something like:
var apiUrl = "your google search API url";
var searches = ["sports in California", "sports in New York"];
var requests = searches.map(function(search) {
return fetch(apiUrl + search).then(function(response) {
return response.json();
});
});
Promise.all(requests)
.then(function(data) {
console.log(data); // this has JSON responses for each item in the searches array
})
.catch(function(err) {
console.error(err);
});
But sadly, haven't used google search to help out beyond a standard promise.all template. The same code would work with $.ajax or $.getJSON instead of fetch() if preferred
Does anyone know how I could just scroll within a div and not the entire page
@taiJones00 not 100% sure but you could try setting a width for the div, and in css add overflow: scroll to that div...
oh cool thanks @gothamknight
taijones00 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @gothamknight |http://www.freecodecamp.com/gothamknight
@taiJones00 overflow: scroll causes the scrollbar to appear all the time.
overflow: auto; would be more elegant
How often do you guys use CSS positioning?
@Znadams whenever necessary :) need it for headers and footers if you want them to stay in view, for positioning items relatively that aren't normally, etc..
having a tough time wrapping my head around this concept
I used to use them more when i was a noob, I set up pages better now so they are not needed as often
@Znadams , very rarely, but I use relative position, when working with a parent container and see the need to have some aspects at a specific location within the container.
thanks guys
I would recommend trying to avoid position absolute, unless it is 100% necessary
does anyone know what the plugin for emmett is in vscode, or is it default?
Can someone explain to me what a recursive case is ?
recursive case?
https://codepen.io/taiJones00/pen/xLqemx Why is my random quote machine only returning one quote
cache: false
need to set it up with ajax, and set the cache to false
set it up with ajax? I only learned json from the tutorials
i believe they have an example on the site
which site
quotes o ndesign
do you also know why the text is flowing out of the container and everything isn't being displayed
simple example at bottom
@taiJones00 maybe because you are using json[0]. You would want to generate a random number each time the button is clicked, then use that random number as the index to access the data in json. (
json[randomNumber])
ya that would also work, didn't realize you were calling 40 quotes at once
try to understand that example on that page
Tip: getJSON is just shorthand ajax
:O
works
thanks guyz @eweiss17 @gothamknight
¯_(ツ)_/¯
@taiJones00 no problem bro
why isn't all of the quote being displayed on mobile
That is a different can of worms....
it is on mine though
but for the really long quotes
just put a bigger number on the background