get help in general - we have more specialized help rooms here: https://gitter.im/FreeCodeCamp/home
Hello World!
@lan3jur Cool beans man, I live in the UK now but I'm from Aalst (aka Oilsjt ajoin). good luck with the challenges :)
@cristian-berrios Greetings! Welcome to FCC!
@piecedigital thanks! Joined 2 days ago but just joined /help and /letspair, hoping I can help others and maybe doing some pairing :)
anyone have experience animating with jquery + velocity? Need some help.
@Rybar not but it sounds interesting
I am wondering why adding a jquery statement at the top of my JS file halts the page loading??
where is the script called in the HTML file compared to jQuery?
ummm...
it's an event handler, here...
I'm trying to convert this from jvaascript to jquery
so far the ONLY change I've made is to add the initial jquery statement:
$("#temperature").on("click", switchunits);
in the top of the JS file. Next I was going to comment out the inline JS in the HTML.
but as soon as I added the line above, it won't load. It may not be a big deal, I just didn't expect it to break the page...
but as soon as I added the line above, it won't load. It may not be a big deal, I just didn't expect it to break the page...
Does Codepen include jquery for you?
yes, you have to select it, but I did and it's there
what if you surround that in a
$(document).ready( function() {
});
lemme try.
it may be trying to reference the object with id temperature before it is loaded
you mean the entire JS file or just the jquery?
OH
hmm
YES! that worked!
you guys are smart
woot!
so much to learn...the learning curve is huge!
key point here: be careful with jQuery. Stuff might not exist yet
so why isn't that hte case with plain JS?
i couldn't figure out why there wasn't a similar statement for the JS
good question
OK, well now my page is loading but the link doesn't work anymore, lol.
@AdventureBear, couple of things: first, `$("#temperature").on("click", switchUnits());
$("#temperature").on("click", switchUnits());
check your dev console for javascript errors when things suddenly stop working, gives good clues. ;)
OK, great suggestion!
add that line to the end of the JS and it works as expected, now that units is defined. http://codepen.io/Rybar/pen/vEmwVY
that's slick btw.
If you had a little more access to the HTML, you should put the reference to the JS script at the bottom of the file
thanks, I used a tutorial, but having a lot of fun playing with it. It keeps me entertained as I go.
Didn't know you could post Codepen direct to the chat
I htink that's new
That's really cool
@jmcshane I'm not sure what you mean? I just took the JS out of the HTML to put it into jquery. I don't know what's best I'm just trying to get comfortable manipulating stuff.
btw here is the original one that won't break while i play with this one
@AdventureBear He's talking about where the script loads in the DOM, not really applicable to a codepen. @jmcshane by default codepen loads your custom js last.
ah
ah, ic
are you guys seeing a place local to you?
Nope, Chalco
there is a little canada about 20 miles from me
haow far is that from you?
Mine is about 15km out
i was going to ask if you lived north of st paul
mine's about 3 miles away from me "Lincoln Place". little township I've never heard of. I had to look it up!
yeah, 15 km is probably about right
And also in the jQuery the temperature is definitely way out
the jQuery version*
Oh I guess it is close.
Sarpy county... little southeast of me
mine's a little northeast
Can you feed it a specific zipcode?
no that's one of the modifications the tutorial suggested trying out .
that's part of why I want to convert it to jquery, so that's something I can do easier.
well jquery is really just dom manipulation, "Get and Do"... the do() is typically vanilla JS.
i guess I feel more comfortable "getting" things using jquery?
I only know as much as I've learned through FCC and the challenges here.
So looking at this codepen, there's a lot of DOM changes in the JS...worth practicing to convert that to Jquery?
@AdventureBear I felt the same way, but I just found this resource http://youmightnotneedjquery.com/ I'm still working through it, but it looks interesting
I understand, but you'll definitely need to step outside your comfort zone here, there isn't going to be any converting to jQuery once you've started dealign with ajax calls/JSON requests for dynamic data
now I"m really confused!
ah, lots of info all at once
sorry, that can happen in a chat like this
just yesterday someone pasted a "youmightneedjqueryif" link
haha, whoops
for the API call specifically
oi
lol
sorry. What I'm saying is, Once you've converted the bits that manipulate what you see on screen, you're still left with all the code that does the dirty work of getting the weather data
i gues sgetting comfortable with what it can make easier and what's just excess?
yes, getting comfortable with jquery is a good thing. I may be putting the cart before the horse a bit
or at least confusing the cart with the horse
haah
yep I can see that
OK, so should I tackle this in jquery?
function getLocationAndWeather()
@Rybar yeah I can see your point too. So would that JS code still go between the document. ready call ? I thought a function could hang out anywhere and then it's just called when needed. But I may be confusing old C programming
maybe start with the function loadBackground, that seems like a good one to start with
the location and weather one seems like the last one i would do
OK, great, that's exactly what I need, just a push toward the next thing to try.
:)
good luck!
:) when did they add in-line codepen to gitter? That's Super-cool.
cool!
it's bloody amazing
a little seizure inducing but cool!
Nice animation :)
thanks. :D
should this go inside the docuemnt ready tags since i"ll be doing it in jquery
function loadBackground
I just discovered this: http://workshop.chromeexperiments.com/examples/gui/#1--Basic-Usage which is in use on ALOT of codepens, going to go back to a couple of my fun ones and add sliders and fiddleknobs
that's the box on the right to adjust things?
yes
LPT: always copy the code to clipboard before submitting to Coderbyte :/
so you can easily attach sliders and checkboxes to variables in your code
@cristian-berrios :( that's always a bummer.. we had that happen during pairing twice
during the live session
:(
well, I'm still on easy, I could remember the whole function, but it would be a big one in longer programs
ok guys, nearly 1am here. goodnight!
data.photos
Object {page: 1, pages: 4, perpage: 250, total: "771", photo: Array[250]}
goodnight!
Anyone know why I can only see 1 page of results, even though it says there are four pages?
data.photos.page = 1
according to the flickr api bounding box queries will only return 250 photos
to prevent too much load on the databse
I guess
that makes sense...were did you find that? I looked here
on that same page
boundin box being lat/long?
ctrl + f bbox
you could try lat, long and radius?
I see. But I'm using lat, long, sort, accuracy & relevance
I thought about trying radius
what's happening is that I return a random photo by checking data.photos.total
but it looks like if there are more than 1 page of results and say the random number is 400 (should be on page 2), then I get a undefined error and a gray background
I shall sleep on it and try again tomorro1
Thanks for your help, @BenClist
hmm, not sure then. A quick fix would be to limit the random to 250
so if random > 250 random = 250
right that makes me sad though. :( all those amazing photos just left off.
I'd need a little logic to limit it to 250 OR total if total < 250
NM
I just use a different varaible
data.photos.photo.length
instead of
data.photos.total
there you go :)
:)
OH, and I found this: "lat (Optional)
A valid latitude, in decimal format, for doing radial geo queries.
Geo queries require some sort of limiting agent in order to prevent the database from crying. This is basically like the check against "parameterless searches" for queries without a geo component."
so even though it's not a bbox, it's the same limitation
sweet.
Well I didn't do what I wanted but I made forward progress in my coding prowess. That sometimes gray background was really bugging me.
you guys helped me figure it out by suggesting the console whenever something doesn't work!
Yay
Great to see the progress, having little projects like this to work on is definitely the best way to learn
thanks @BenClist ! super satisfying.
good night
night @AdventureBear
@wdgreg haha coolness!! How’s life over there? I live quite close to Oilsjt :)
@lan3jur Hah it's nice here but I miss the fries and the mexicanos and the durums. I gain quite a bit of weight every time I go back to visit :)
<!DOCTYPE html>
<head>
<script src="/assets/jquery.js"></script>
<style>
</style>
</head>
<body>
<div class="prompt"></div>
<script>
var prompts = [
'Type your name',
'Type an adjective',
'Type a noun'
];
// alert(prompts.length);
// alert(prompts[0]);
// jQuery to insert an array-indexed item into the empty HTML div
$('.prompt').html(prompts[0]);
</script>
</body>
@wdgreg haha .. Are you living there for your job?
Ah @zersiax ! I passed that challenge with no issues
@zersiax which challenge is this again?
@zersiax try removing the comments and see what happens?
project five, section 1 checkpoint 6 :) @lan3jur the comments are required by the checkpoint :)
ah yes.. forgot :)
I moved here with my girlfriend. Working part time from home now (freelance writing) but hoping to transition into something that pays better :)
try adding a tab before //jQuery and removing the tab before </script>?
Just guessing here..
it will be something very small ...something like the functions being in the wrong order, or a different kind of quote ...it's finicky that way
but it must be a detail like that
@wdgreg cool!! What are you writing for / about?
Well the only thing that you may recognize is express.be but I quit there a few months ago to focus on studying, apart from that I do translations and copy writing for a bunch of websites
This message was deleted
Ah sweet!! Might come in handy for me some day ;-)
oh wait that is for the next checkpoint nevermind
@zersiax try cleaning your indentations ..
They seem to be strict about that
like with javascript: function () {} fails but function() {} passes
i might have found it ...just a sec
@wdgreg do you also translate from Swedish to English? :)
Ha! no, french, dutch, spanish and german to english but no swedish :)
oh i didn't know youre swedish @wdgreg ?
No I'm flemish, but I do admit i look a typical swede
Well, back to coding.. laters :)
happy coding :)
nope, I was wrong :) Ithought maybe copying from Firefox into notePad++ left some nbsp's in there, js and PHP interpreters trip on that ...but that wasn't it. and cleaning up the indents wasn't it either
ah ok I wonder where lan got swedish?
@zersiax so that code isn't doing anything? no errors in the console?
If I really try I understand one or two swedish words out of 10 since I know Dutch but ...its tough :)
here is my code which looks just like yours except for indents and different comments
<!DOCTYPE html>
<head>
<script src="/assets/jquery.js"></script>
<style>
</style>
</head>
<body>
<div class="prompt"></div>
<script>
var prompts = [
'Type your name',
'Type an adjective',
'Type a noun'
];
// insert prompt into html
$('.prompt').html(prompts[0]);
//alert(prompts.length);
//alert(prompts[0]);
</script>
</body>
Heh yeah, danish is much easier to understand I find
just something about the pronounciation
oh wow, i've heard the opposite, but I live in Sweden so I'm probably just getting one side of the story
they joke that even Danish people say they can't understand each other
I have a crush on a Swedish girl ;-)
Well I'm just basing it on my having watched a bunch of scandinavian movies and tv shows and I tend to understand danish considerably better :)
just saying :P
Danish sound muffled to me, like if you have marbles in your mouth.
this really is bizarre , pasting in your code works fine
shrug ...my code was syntactically sound so I'll just continue on now I guess :)
darn! yes just press on.. You understand it that's most important!
ok ...moving back to main. I don't get notifies about things so if you need me ping me on there or in a PM because I likely won't be monitoring here all that much :)
yep good luck...sorry coudn't figure it out
was that in dash or in code school?
Oh dash. I had some problems with it being overly strict/not taking valid responses. usually I could fenangle it by switching browsers or adjusting spacing. Was silly.
+1 for 'fenangle'
If anyone needs to learn AJAX, teamtreehouse.com has a really good class on it.
Yesssss Fenangle :)
Hello
olleH
I am stuck on this coderbyte problem for a minute now
... more than a minute, like a day
any help is appreciated
'''
//Coderbyte Problem 4 Easy- Letter Challenge
// still need to fix
// 1- finding ampersands in regular expression
// I can hack it with an if statement, but that's sloppy
// 2- special characters are shifting too,
// I want to exit that iteration of the for loop
// and add the special character in question to the new
// array
// 3- refactoring obviously
function main(){
// start
console.log("Enter string");
var str = prompt(" ");
// final output
console.log(LetterChanges(str));}
function LetterChanges(str){
var strArray = str.split("");
var strNewArray = [];
for(var i = 0; i < strArray.length; i++) {
if (strArray[i].match(/[^\w]+/g) === true){
strNewArray.push(strArray[i]);
break;
} else if (strArray[i] === " ") {
strNewArray.push(" ");
continue;
} else {
var character = strArray[i].charCodeAt(0);
character += 1;
character.toString();
character1 = String.fromCharCode(character);
strNewArray.push(character1);
}
}
return strNewArray.join("");}
main();
'''
'''
//Coderbyte Problem 4 Easy- Letter Challenge
// still need to fix
// 1- finding ampersands in regular expression
// I can hack it with an if statement, but that's sloppy
// 2- special characters are shifting too,
// I want to exit that iteration of the for loop
// and add the special character in question to the new
// array
// 3- refactoring obviously
function main(){
// start
console.log("Enter string");
var str = prompt(" ");
// final output
console.log(LetterChanges(str));}
function LetterChanges(str){
var strArray = str.split("");
var strNewArray = [];
for(var i = 0; i < strArray.length; i++) {
if (strArray[i].match(/[^\w]+/g) === true){
strNewArray.push(strArray[i]);
break;
} else if (strArray[i] === " ") {
strNewArray.push(" ");
continue;
} else {
var character = strArray[i].charCodeAt(0);
character += 1;
character.toString();
character1 = String.fromCharCode(character);
strNewArray.push(character1);
}
}
return strNewArray.join(""); }
main();
'''
jeez my formatting is off sorry guys
First thing I can see is that you're calling your main function outside of the letterchanges function
and .match doesn't return false or true, it returns an array with the matches
what you're looking for is
/regex/.test(stringToTest)
ummm I think thats it
can you give me an example?
/a/.test('a'); // true
/a/.test('b'); // false
/a/.test('b'); // false
Also, your control flow is a bit off. you don't need the break; in your if statement nor the continue
These are all good suggestions
if your first if statement evaluates as true, it will execute that code and skip the else if and else
you can use break and continue for breaking out of loops though
aaa thats right
but can you tell me what the code is supposed to do though? not sure what the question is :)
is this the one to capitalize vowels?
ooo sorry i didn't explain
it does this:
Using the JavaScript language, have the function LetterChanges(str) take the str parameter being passed and modify it using the following algorithm:
Replace every letter in the string with the letter following it in the
alphabet (ie. c becomes d, z becomes a). Then capitalize every vowel in this new string (a, e, i, o, u) and finally return this modified string.
Using the JavaScript language, have the function LetterChanges(str) take the str parameter being passed and modify it using the following algorithm:
Replace every letter in the string with the letter following it in the
alphabet (ie. c becomes d, z becomes a). Then capitalize every vowel in this new string (a, e, i, o, u) and finally return this modified string.
Ah yes
its the 4th challenge in coderbyte
so the shifting is working
but, it is shifting everything including the punctuation
I am trying to find a .match or a filter or something to skip the punctuation and just push it into the new array
but ... its not working haha
What I'd recommend is to start over from scratch but this time start with this:
```
str = str.split('').map(function(char){
// your code here
}
```
str = str.split('').map(function(char){
// your code here
}
oops forgot the final backticks ;)
aaa can you explain the .map function?
Sure, so str.split('') will give you an array of all the characters, right
yup
got that part
and map then calls a function on each of those characters
how is it different than the .filter function
so for example:
[1,2,3].map(function(num){
return num + 5;
});this will return [6,7,8]
so it creates a new array based on the output of the function
?
yes
ok that makes sense, so I wont need to create a second array before the for loop
So you can use if statements inside that function to check whether each character is a letter or a number or a space or whatever and then process it as required
aaaa that cleans up things a bit
Yes, you can do it your way too, but this will save you some headaches because it's much easier to look at
i agree with your way however, mine was a rough hack
is there a short hand way for a regex for only punctuation?
But either way, the thing with the character codes is still going to feel hacky :) but i think you'll be able to solve it this way
Hmm, I don't think so (but I'm not sure) but you can test for 'not a letter'
how so? that seems to be the most straight forward way to do it
I appreciate the help so far! I am going to take your suggestions and re do the code
just to provide variety to the conversation, I actually used
String.charCodeAt(0) to shift
Its always good to have a second pair of eyes on things
instead of regex
The character codes? yeah it is the most straightforward way, but it just looks so weird incrementing character codes with seemingly random numbers that's all :)
i am used to solving encoding problems with ASCII and UTF-8 encodings when using web APIs so it wasn't too hard for me
How so, @shchoi22 ? you tested whether the charcode of characters fall in a certain interval?
yep
yea same here @shchoi22 , thought i did
'''
var character = strArray[i].charCodeAt(0);
character += 1;
character.toString();
character1 = String.fromCharCode(character);
strNewArray.push(character1)
'''
'''
var character = strArray[i].charCodeAt(0);
character += 1;
character.toString();
character1 = String.fromCharCode(character);
strNewArray.push(character1)
'''
though*
remember charCodeAt() is case sensitive
@shchoi22 Well that works too. i prefer regex though :)
@shchoi22 how did you get past the issues with not shifting the punctuation though?
i believe the charcode for lowercase a-z is from 96 to 120ish
so testing that and having separate if for z to shift back to a is all you need
so anything that is not 96 to 120 was not shifted then
yes
aaa man thanks for the idea
this makes things soooooooo much simpler
My ideas was to use regex to filter out all punctuation, and what ever was left to run thru algo in an if else statement
but I do suggest practicing regex when you can. im sure @wdgreg knows this but you'll use regex far more than character codes.
any good resources for it?
regex is kicking my ass man
the problem is with that is you need to get the punctuation back after you shift which is a hard task on its own
yea thats exactly the part that I am stuck on haha
the shift part was straight forward
i think FCC's source for regex is a bit light but the practice session should cover 80~90% of what you face out in the world
aaa, is that where you picked it up?
Yeah the FCC regex source is decent. it doesn't mention backreferences or lookaheads but you can get by without those for now (but learn them later though)
i read a book :smile:
it was required for my job
aaa man, thanks @phlacin
or www.regex101.com is also another one to test with, but not as intuitive, i feel
will check out both of them
the first one seem more intuitive, you are right @phlacin
yea this is exactly what I needed. Thanks @phlacin
@tesla809 awesome. There's a RegEx joke:
Some people, when confronted with a problem, think "I know, I'll use regular expressions." Now they have two problems.
LOL
HAHA, I'm am laughing out loud now because that is exactly what I was thinking just a few minutes ago @phlacin
the problem is now more about learning regex than the problem itself
yeah, but if you just keep using it...or trying your best...you'll eventually memorize the major parts that you find yourself using all the time
Yeah, regex looks crazy at first but it quickly becomes almost second nature
Is regex used a lot in the real world?
regex is starting to grow on me
question, how do i refactor this?
Yes, it's used all the time
And not just in JS, but in pretty much every other programming language too and on the command line and in certain text editors
'''
if (/(\W)/g.test(strArray[i]) === true || /([0-9])/g.test(strArray[i]) === true){
// some code
}
'''
if (/(\W)/g.test(strArray[i]) === true || /([0-9])/g.test(strArray[i]) === true){
// some code
}
'''
"""
if (/(\W)/g.test(strArray[i]) === true || /([0-9])/g.test(strArray[i]) === true){
// some code
}
"""
if (/(\W)/g.test(strArray[i]) === true || /([0-9])/g.test(strArray[i]) === true){
// some code
}
"""
jeez why doesn't the markdown work for me
' ' '
var markdown = "markdown";
' ' '
var markdown = "markdown";
' ' '
... nope whats the deal
@tesla809 You don't need the round parentheses there, those are for capturing groups (like for example when you're matching several regexes in a string)
@tesla809 , use the backtick (`) which shares a key with ~ on most keyboards
You need to use backticks ` instead of apostrophes
ooo haha thanks @admhlt
It's an underdog key. Very rarely used :)
if (/(\W)/g.test(strArray[i]) === true || /([0-9])/g.test(strArray[i]) === true){
// some code
}
yea I have actually never noticed it until now, haha
@wdgreg what do you mean?
If you change
/(\W)/g into /\W/g nothing will change
also, you don't need the
g flag in this case either, you're only matching a single character after all
*testing, not matching
aaa i will try it out. thanks @wdgreg
can I combine the two or statements into one regex expression
I have been trying, but it is messing up the \W part
Using () is for capturing groups, which is very useful, but not for testing a regex against a string. it's used extensively for matching and replacing though
You could use /[a-zA-Z]/ for matching any kind of letter, very easy to see what it means
eh testing! I keep saying matching :)
and
/[\W0-9]/.test(str) === true is equivalent to what you wrote
or /[\W\d]/
I think I used
/[^a-z]/ in my solution for this challenge, but I kept a boolean for uppercase
Let me try that out
It seems like a more straight forward way to write the code.
/[a-z]/i is a bit shorter if you're only interesting in matching the alphabet
www.regex101.com should be in your bookmarks if you are using regex
@wdgreg Thanks.
it seems array addition must be the biggest challenge of the easy coderbytes
makes me even more dang determined now
Yeah that's definitely the hardest one. most of the medium challenges are much easier
still haven't figured it out myself :)
I am on it now until i finish wish me luck
my coding skills are improving rapidly doing these
Great :) good luck!
Don't mind me. I just want to test how to post a line of code
<button class="flash">Exit</button>sure, npok if I have no regular text and key in three back tics it automatically shift key boards to enter code
blah blah blah shift enter
code here
ok enough I got it ;-)
You can also press Ctrl + / to switch to compose mode. Then you wouldn't need to worry about Shift + Enter.
@yaskyj great I added to my shortcuts Thxs
so I'd like to see this rotate in place when hitting the white button. any css transition gurus in the room?
won't work inline; not enough space and no resize code yet
in older to rotate, isn’t suppose to be position: relative?
nah, it rotates, just not around it's "center".
I want the div "contents" to rotate around its center. The inline version doesn't work because the window is too small; open it in a new window/tab to see