anyone know any web teach AI in javascript, plz share with me
how do i center my text from top to bottom in a <p></p> in a responsive div?
check this out Ethan
stackoverflow.com/questions/2743989/how-to-vertically-center-divs
@Ethanlchandler
stackoverflow.com/questions/2743989/how-to-vertically-center-divs
@Ethanlchandler
@buiphuking this may be useful: How to Build You Own Ai Assistant Using Api.ai :sparkles:
@StayGoldDylan bootstrap is very useful... :+1: Introduction to Bootstrap, Features of BootStrap Framework for Responsive Design
This message was deleted
Hi all. I have a general question. Would it be worth the effort learning AngularJS 1 as opposed to AngularJS 2? I started with 2 and find going through tutorials for ver.1 really confusing.
@wrblack i think it would depend on you goal for learning angular. specifically, what do you want to do with the knowledge?
@ndburrus ultimately it's just to get basic experience of SPAs.
@wrblack what is SPAs? service package applications? oh, ok... if your interest is developing them, and there are no restrictions, then i would go with whichever you want (probably the newer version). if you goal is to understand existing apps, and they need to stay in a certain version - then i would inform the decision accordingly... if you want to convert previous version apps to a/the current version - then maybe both are needed...
@ndburrus Single Page Application
thanks @mbarmawi, sorry about that Norvin.
wrblack sends brownie points to @mbarmawi :sparkles: :thumbsup: :sparkles:
:cookie: 295 | @mbarmawi |http://www.freecodecamp.com/mbarmawi
hi guys, tic tac toe
if i pick X play win, pick O, it go wrong,
http://codepen.io/buiphuking/pen/JKoEZG
help me guys
if i pick X play win, pick O, it go wrong,
http://codepen.io/buiphuking/pen/JKoEZG
help me guys
@wrblack angularjs 2 is the new version have all of good things ,code written by typescript and from now all the tutorial you will found will be on angularjs 2 with typescript so keep this in mind so my advice to to keep going with the new version as always
@mbarmawi thanks! I really prefer angularjs 2. Learning typescript has been a blast and I find documentation is a little better.
wrblack sends brownie points to @mbarmawi :sparkles: :thumbsup: :sparkles:
:warning: wrblack already gave mbarmawi points
Hey all. I'm working on https://www.freecodecamp.com/challenges/stand-in-line and I cannot for the life of me figure out what the third of the four criteria is asking for. This is overall a very confusing challenge, since it's so vaguely worded and unclear as to what it's asking for. Can anyone help?
@BeingDS you add item to the back of the array and remove an item from the front
the item that gets removed from the arr is returned
Hi every body,
after finishing responsive design whith bootstrap, I am working on Build a Personal Portfolio Webpage, but the problem it needs more Knowledge than what I learned in Previous lessens, can every body explain me ?
after finishing responsive design whith bootstrap, I am working on Build a Personal Portfolio Webpage, but the problem it needs more Knowledge than what I learned in Previous lessens, can every body explain me ?
@BeingDS Sometimes the way a challenge is written can be quite bewildering and other times so simple - but once you get your head around what they are asking you'll be fine
@FouadRachedi the portfolio is very challenging and developes one of the keys skills you need - figuring things out that are out of your depth. It is very challenging but while you are working on it you can continue with the other challenges - here is a good template to get it started http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp - I highly recomend going through all of w3schools bootstrap materials and put what you can in your portfolio
anyone ever code AI???????? i need some advice guys ???????????
Does anybody finished coding the portfolio? i need some help
@Anakin771 where are you stuck?
@GregatGit I want to add a picture of my project, how should I get it?
@Anakin771 where can you get pictures or where can you store pictures?
@GregatGit i usually find on google but i don't have a picture storage from what i know...
@Anakin771 check out dropbox - amazon - MS - google - and all the others to see if you can get some free cloud storeage http://www.makeuseof.com/tag/dropbox-free-unblockable-image-storage-blog/
How do you make an element in a div that uses flex inline?
@GregatGit i got the storage now, what's next?
On CodePen the link tag doesn't seem to work. I am working on my tribute page.
@DanStockham what are you trying to achieve?
@jonaguiar You need to add target="_blank" to the link
@jdtdesigns I want my fontawesome element to act as a toggle for an accordion element. I figured it out though. Thanks
danstockham sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 505 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
I made the weather app a few weeks ago and it was working fine, but now for some reason it's not doing anything. Has anyone had any problems with the open weather API at all?
@tbc13315 chrome has deprecated navigator in http
only way to work with openweather is to use an ip locator for chrome and navigator for other browsers
Thanks for the info!
;)
Hi guys. For the Inventory Update bonfire, how do you sort the items alphabetically?
@Anakin771 - also check out http://postimg.org/ for a site to post pictures.
@leanhduy1998 use will use .sort()
@jdtdesigns it will sort the front of the array, the numbers. I'm looking for the way to sort the back of the array
*sort using the front of the array
Hi JD, so I was looking more into this and I thought I could just put an "S" to make the API call "HTTPS" thinking it would solve the issue, but alas, it did not.
So do you have any tips? Thanks again!
@tbc13315 like i said, you can't use https with openweather unless you pay for premium
so you will need to use an ip locator api for chrome
you can't mix the two together (https for codepen, http for openweather) or it will throw an error
@leanhduy1998 haven't worked with the advanced algorithms in awhile. let me look it over for a minute
Ohhhhh ok. I'll check that out! I'm still a noob, so I guess I just have to do more research on https and http to understand it better. Thanks again!
it works! thanks @GregatGit and @khaduch !
anakin771 sends brownie points to @gregatgit and @khaduch :sparkles: :thumbsup: :sparkles:
:cookie: 603 | @gregatgit |http://www.freecodecamp.com/gregatgit
:star2: 1344 | @khaduch |http://www.freecodecamp.com/khaduch
@jdtdesigns so I saw this code on the internet, and it seems to work, but I don't understand how.
function Comparator(a, b) {
if (a[1] < b[1]) return -1;
if (a[1] > b[1]) return 1;
return 0;
}
if (a[1] < b[1]) return -1;
if (a[1] > b[1]) return 1;
return 0;
}
myArray = myArray.sort(Comparator);
@leanhduy1998 it looks like they are just using an array...
@ndburrus I see. But what's with the -1,0,1?
@leanhduy1998 there are 3 conditions that determine the output... the -1,0, and 1 are the possible output values...
I see. Thanks @ndburrus
leanhduy1998 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:cookie: 577 | @ndburrus |http://www.freecodecamp.com/ndburrus
@jdtdesigns thanks
leanhduy1998 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 506 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@leanhduy1998 you're welcome! :+1:
hey guys i made my first webpage ever for the 'build a tribute page' challenge and im feeling accomplished, anyone want to take a look?
@JKilk send you codepen! =D
okay! here's my codepen https://codepen.io/JKilk/full/bewGgJ/
@JKilk good job men! i really like it!
can i give you some advice?
Good evening, Campers. I'm trying to limit a scrolling action so that it doesn't scroll over the menu at the top of the page. Can someone point me in the right direction, please? (Is this a z-index issue?)
Thanks in advance. Here's my CodePen: http://codepen.io/andreas2249/pen/rLMOPw/
Very nice, @JKilk. I especially like the choice of / colors coordination. :)
how can we check a function is actived
@andreas2249 i dont undertand what you want... can you be more explicit ? its not your bad hah im not good at english
@buiphuking i don't know what you mean by actived... function always are waiting for you to call them :P
Thank you for your prompt reply @lcassettai. I want to keep the menu at top of the page visible at all times. Right now, when someone scrolls my page or clicks a link, the content covers up the menu.
andreas2249 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 334 | @lcassettai |http://www.freecodecamp.com/lcassettai
@buiphuking, can you be more specific, please?
Are you wondering if your code is "seeing" the function?
@lcassettai
http://codepen.io/buiphuking/pen/JKoEZG?editors=0011
if($(this).html() == ''){
$(this).append(player);
checkWin(player);
if($('#myModal3').is(':visible'))
{
return;
}
if($('#' + computerMove).html() == ''){
$('#' + computerMove).append(computer);
}else{
return false;
}
//if(checkWin(computer)) return false;
}else{
return false;
}i pick X, if i win, O stop picking
@andreas2249 you mean like that? (send pic)
@lcassettai check my link above plz
Yes, @lcassettai. I'm looking for some kind of "margin" or something so that all of the content can never get higher than the bottom of the logo and menu (plus some extra margin). Thanks. :)
andreas2249 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave lcassettai points
@andreas2249 np! add navbar-default o navbar-inverted if you want what i send in the pic
<nav class="navbar navbar-fixed-top navbar-default">
@buiphuking i take a look !
@lcassettai, that's brilliant! Thank you for your time and consideration. Best wishes. :) :+1:
andreas2249 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave lcassettai points
@leanhduy1998 I figured it out :)
@andreas2249 =D no problem!
I have a set of divs with multiple links in them. I would like to make it so the entire div is clickable and triggers the first link. I tried
$('.collection-item').click(function() {
window.location = $(this).find('a').first().attr('href');
return false;
});It works, but the other links within the div are no longer clickable. Any suggestions?
@leanhduy1998 the 1, 0, or -1 was probably referring to the sort function correct?
although, I don't know why they would use 0
@buiphuking in your html you have a buttom that call function called first() , but in your js you don't have the function first
<button id="X" onclick="first()" type="button" data-toggle="modal" data-target="#myModal2" data-dismiss="modal" class="btn btn-info">X</button>
<button id="O" onclick="first()" type="button" data-toggle="modal" data-target="#myModal2" data-dismiss="modal" class="btn btn-info">O</button>
@adzam5 can you send your pen?
@jdtdesigns can you tell me?
@lcassettai
delete onclick, i don't need it anymore
delete onclick, i don't need it anymore
oops, I missed the latest comment
@jdtdesigns I tried it, but it still didn't work
@leanhduy1998 you can use a nested .map() to iterate through the arrays and compare the values
arr2.map(function(comparison) {
arr1.map(function(output) {
if ( comparison[1] == output[1] ) console.log(comparison[1]);
});
});
try that
then work with it to figure out a solution ;)
@lcassettai The project is mainly written in PHP. Give me a minute to copy what I am talking about into a pen
@lcassettai, one thing I noticed about your solution is that
navbar-default adds the white color to the background. I'd like use your solution -- but not have it add the background color. Any suggestions to override that effect? Thanks in advance. :)
andreas2249 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave lcassettai points
difference between return and return false ?????????????????
@jdtdesigns oh, I think you misunderstood my question. I got everything works out great, but this bonfire requires everything in alphabetic order.
@andreas2249 you want to add another color?
@leanhduy1998 .sort() will compare each value in an array to the next, starting from the first one.
so you can run it on the arr1 to compare each word to the next word
@lcassettai, actually, no color. I'd like it so that the text is floating there on top of the image as it's shown in this example. In other words, have the text scroll up -- but not cover what's there now.
arr1.sort(function(a, b) {
// if the string in a is greater than the string in b, return true, else return false
});
// if the string in a is greater than the string in b, return true, else return false
});
@leanhduy1998
little pseudo code
@lcassettai, I did try to overwrite some of the
navbar-default class with this -- but it didn't work:.navbar-default {
background-color:teal;
}
@jdtdesigns I tried using sort, but it returns sth like this: [a,b,c,d,a]. It sorts out everything next to each other, but if there's an "a" at the end, it doesn't do so.
@adzam5 you mean something like this ? https://jsfiddle.net/lcassettai/zvybcgdy/
Oops. Not "teal"
but background-color: none;
@andreas2249 try with transparent?
@jdtdesigns this is my code: https://codepen.io/leanhduy1998/pen/BKMRog?editors=0012
remember you are sorting through arrays inside an array
@leanhduy1998
@lcassettai Yes! Only each div will have more than 1 link. I want clicking on the div to be able to trigger the first link in the div. I was just putting together a pen.
@leanhduy1998 change the end to this return arr1.sort(Comparator);
and you're good i think :P
Haha, didn't know there was a
transparent type of method... Tried it. Not quite working: http://codepen.io/andreas2249/pen/rLMOPw/
Can you think of a more "generic," non-Bootstrap way of writing some CSS that will protect that area from having text scroll over the logo and menu?
@jdtdesigns you see, the result order have sth like this: ... hair pin, microphone, half-eaten apple ... . It's not in order, even though the rest of them are in order.
@leanhduy1998 I see the problem. The compare function isn't written right.
(I'm not looking for someone to write the code for me... But I don't know how to ask the question the right way that will lead me to learn about a solution. :) )
// Needs to be this
function Comparator(a, b) {
if (a[1] > b[1]) return true;
return false;
}
@leanhduy1998
@jdtdesigns the problem is still there :(
hmm
@leanhduy1998 You're returning an array inside the last two arrays
something is off in your code above
[ [ 88, 'Bowling Ball' ],
[ 2, 'Dirty Sock' ],
[ 3, 'Hair Pin' ],
[ 5, 'Microphone' ],
[ [ 3, 'Half-Eaten Apple' ] ], // double nested
[ [ 7, 'Toothpaste' ] ] ] // double nested
ohh I see
fixing that would fix the problem
yes
thanks @jdtdesigns
leanhduy1998 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 508 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
welcome ;)
@andreas2249 but if you don't use a background your menu will be always above the content of the page but it will mix with the text (pic)
can anyone give me a few ideas about my twitch TV feed project?
Here's my pen. The trouble I'm having is that it's a double .get call depending on whether the person is streaming or not. And when I return al lthe data I can't get the output to line up nicely. I want the logo, then the name then the stream condition to be all in one row.
this has been bending my mind for months. I'm so frustrated I can't figure it out but this is the best i've done so far.
@AdventureBear i can give you a solution that you can use
if you're willing to change your code ;)
@lcassettai, yes, agree. And that's what I'm trying to solve. So I think your idea of using a transparent background might be the right idea. But when I added it to the CSS section, as follows, the background become transparent (most of it did) -- but now the text covers that area again.
This is what I added:
.navbar-default {
background-color: transparent;
}Does adding this mess up up the rest of the navbar-default class?
can i post my tribute page here? i'm not sure how to fix the video issue
@jdtdesigns I'm certainly willing to change...I'd prefer to be given a hint so i can learn.
@andreas2249 try with this and play with the properties, int the background the (0.3) its the opacity you can make 1 to 100% o 0 to 0%
.navbar{
z-index:999 !important;
top:0px;
left:0px;
position:fixed;
background:rgba(256,265,256,0.3);
border-bottom:1px solid;
box-shadow: -2px 7px 19px -3px rgba(0,0,0,0.75);
}
but if you mean writing it in angular or react I'd like to figure it out in straight HTML first, then rewrite in another view.
@andreas2249 and @jdtdesigns say he have a solution maybe he undertand more what you need
@jdtdesigns I'm headed to bed, but if you can help with a hint or three, please share or PM. I appreciate any tips. thank you
adventurebear sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 509 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@rhawkthrone nice work! i really like it!
@lcassettai, wow! That is a GORGEOUS effect! Thanks for that. I'm keeping that. The only thing I'd like to solve is that when text scrolls up, that it will appear not to go any higher than the bottom of the shadow of that navigation bar at the top of the screen.
They way it is now (very much improved :) ), the main content still shows thru the logo and nav menu when scrolling. Thanks!
andreas2249 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave lcassettai points
@lcassettai thank you!
rhawkthrone sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 335 | @lcassettai |http://www.freecodecamp.com/lcassettai
Here's now it looks now: http://codepen.io/andreas2249/pen/rLMOPw/
Anyone with a tip for me?
@AdventureBear http://jsbin.com/vigame/edit?css,js,output
@jdtdesigns thanks, but my data doesn't seem to get returned like that. When I try to output the logo outside of the inner get request I get a 404 error and a broken image link
adventurebear sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: adventurebear already gave jdtdesigns points
I'm on my mobile phone now so can't go in and reproduce for you
Is the logo available in the first json request? It is such a confusing feed to me for some reason
@AdventureBear The main purpose of my code was to show you how to put the elements in a 'row' and align them correctly
it sounds like you're setting some stuff before the data is received
@andreas2249 lcassettai-navbar haha awww love that ! i fork your project and add a cool style with js you can see here http://codepen.io/lucho_casse/pen/YWGwdP
@AdventureBear Here's my twitch app. I commented where i get the logo url from. https://codepen.io/jdtadlock/pen/MyoyLW?editors=0010
Oh, definitely, @lcassettai. I give credit where credit is due. I appreciate all of your effort very much. :)
I like this new change the way that pops up. Very nice. Here's what is still happening:
@lcassettai, I guess you could say that I'm looking for any scrolling to go "behind" the menu. I think your z-index idea helped steer this in the right direction...
@andreas2249 if you're menu bar is fixed, just give it a high z-index
@jdtdesigns got it, thank you. I'll take a look at your code!
adventurebear sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: adventurebear already gave jdtdesigns points
@andreas2249 yep but that will always happen if you don't make the background color solid, in this case i use opacity you can take of opacity and play with the colors but if you don't put a background solid you will have that problem. Your menu is above but visualy will mix with the text behind!
Thank you @jdtdesigns. @lcassettai came up with this which gave it a
z-index of 999:.lcassettai-navbar{
z-index:999; !important;
top:0px;
left:0px;
position:fixed;
background:rgba(256,265,256,0.3);
border-bottom:1px solid;
box-shadow: -2px 7px 19px -3px rgba(0,0,0,0.75);
}andreas2249 sends brownie points to @jdtdesigns and @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 336 | @lcassettai |http://www.freecodecamp.com/lcassettai
:cookie: 510 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@lcassettai and @jdtdesigns, it's quite possible that I'm asking for something that can't be done -- and only because I don't know better yet... :)
@andreas2249 You have a semi-colon after 999 which shouldn't be there ;)
@andreas2249 Can you post your pen again? I'll check it out.
@jdtdesigns, here's the one with @lcassetai's first brilliant suggestion:
@andreas2249 or maybe i don't understand very well your issue hah
@jdtdesigns, and there's this one that opens up a cool "trap door" effect when scrolling text is getting closer:
@lcassettai, don't say that, please. Your suggestions are just brilliant!
@jdtdesigns I think my issue has been the. /streams. Vs the /channel urls. I thought the were dependent on each other but not really. Just 2 different ones. Very elegant code.
@AdventureBear thank you :)
jdtdesigns sends brownie points to @adventurebear :sparkles: :thumbsup: :sparkles:
:cookie: 441 | @adventurebear |http://www.freecodecamp.com/adventurebear
@andreas2249 hah
@andreas2249 what are you trying to achieve?
@jdtdesigns, when text scrolls up, I'd like to go "behind" or "underneath" the logo and nav items to prevent this effect: example of content showing in menu bar...
(That's a funny pic, @lcassettai. I appreciate your patience with me.)
@andreas2249 I would just give the navbar a solid background at the point where you fade it in.
Sounds good to me, @jdtdesigns. I'm still a newbie at this. How do I sense that or detect that in code? Would that become part of the javascript @lcassettai added there in this pen? http://codepen.io/lucho_casse/pen/YWGwdP?editors=1010
I just moved the HTML into the inner channel request and it seems to work now. Not saved as I'm on my phone but at least I can sleep. Night all. Thanks again this is a fantastic resource
.lcassettai-navbar{
transition:1s;
z-index:999; // Don't need important
top:0px;
left:0px;
position:fixed;
background: #fff; // Don't need important
border-bottom:1px solid rgba(0,0,0,03);
box-shadow: -2px 5px 19px -3px rgba(0,0,0,0.75);
}
@andreas2249
WOW! That is slick, @jdtdesigns !
@jdtdesigns and @lcassettai, thank you again for your considerable time and patience with my issue. I really appreciate it. :)
andreas2249 sends brownie points to @jdtdesigns and @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave lcassettai points
:warning: andreas2249 already gave jdtdesigns points
@andreas2249 no problem! =D I expect to see the final result!
Good night people! im going to sleep here is 2:35 am haha have a great morning
Good night, @lcassettai
Hi there. I'm using https://erikflowers.github.io/weather-icons/ on my weather app. I can't get the yahoo mappings to work on codepen. What I need is to get an icon of the form
http://codepen.io/ronaldrodguez/pen/MeyGVq
<i class="wi wi-yahoo-##> to display. Here's the link with the app so far. Any help much appreciated.http://codepen.io/ronaldrodguez/pen/MeyGVq
I think I have my simone js down - if anyone can see any problems that would be cool - I have alot of work to do on the html/css - the array down the bottom is for test and you win in12 moves http://codepen.io/gregoverhere/pen/WxxZxy
I tried adding underline animations on my heading link which I would later use as an anchor link but it doesn't work.
http://codepen.io/anugrah/pen/bewEwp
http://codepen.io/anugrah/pen/bewEwp
Never mind, I got it.
Dang , I suck at coding. Still trying to figure out how im gonna get lat / long to feed to my weather API.
Keep at it, I made a stupid mistake in HTML
Keep looking it over.
just fyi searching codepen gives many examples of weather apps.
i definitely will thanks .
Guys how should i make the Build a Personal Portfolio like the example if i never learned this? span never learned, javascript too
You don't need JavaScript. and I just googled and learnt as I go along.
I think that's the whole point of the exercise.
@IulianCrudu It's a very hard challenge. Just start doing what you can. You can keep doing the the Free code Camp ciriculumn and challenges as well. If you cant build a great portfolio, build a simple one and make it better as you go along.
But will i learn what i need for a great portfolio in the future on fcc?
You'll everything pretty much.
*learn
so sections,spans etc are on the fcc map?
@IulianCrudu you'll have to learn how to find resources across the net - here is a good one for this challenge http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp
no one place will have it all
Can you help me with my bottom function. It takes a value from till and takes that off change needed.. I commented it up.. Its crashing my browser at the minute though... I think I need somethin with---- chgArr.push(i)--- But possibly some other changes aswell..
function checkCashRegister(price, cash, cid) {
var val;
var cost=arguments[0];
var money=arguments[1];
var till= arguments[2];
var count=0;
var arr=[];
var change= money-cost;
if(change<0){
change=Math.abs(change);}//this makes change positive if its negative value
else change=change;
for(i=0; i<till.length;i++){
count+=till[i][1];}
if(change>count){
return "Insufficient Funds";
// Make a count that totals till values. If change is more than till then say so
} else{
var chgCount=0;
var chgArr=[];
for(i=till.length-1;i<till.length;i--){ //go through till from highest to lowest
while(change>chgCount){//while change is more than 0
chgCount+=till[i][1]; //add number to change from till
chgArr.push(till[i]);//put that in an array
change-=till[i][1];//Take that number off change.
}return chgArr;
}
}
}
checkCashRegister(2000.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);the last else is the problem
@GregatGit maybe i can use that link to make my portfolio but i won't understand what am i doing
IS this an infi loop ?
for(i=till.length-1;i<till.length;i--)
This message was deleted
I am starting the TwitchTV challenge. I can present data, but if i click on the link, I just get part of the twitch page. If I right click and select open in new tab, the page works. Any obvious errors here?
http://codepen.io/tony_tosp/full/yJaeWj/
By the way, the FCC example page does the same thing
http://codepen.io/tony_tosp/full/yJaeWj/
By the way, the FCC example page does the same thing
How long is till? If till is finite, then results should be finite.
Can anyone send me this solved challenge code....Target a Specific Child of an Element Using jQuery
@endencia thankyou
microcyberz sends brownie points to @endencia :sparkles: :thumbsup: :sparkles:
:cookie: 10 | @endencia |http://www.freecodecamp.com/endencia
is anyone able to please help me with a <UL> problem for my tribute page ?
please *
Hi Everybody, I’m having difficulties with the Pomodoro Project.
Problem 1: My variable „sessionLength“ is initially set to 25 (line 4) and then should be changed by the functions „minSession“ (line 42) and „plusSession“ (line 54) and then affect the variable „time“ in line 65. But somehow it stays at the initial value of 25.
Problem 2: Also, if I pause the countdown and then restart it again it gets faster each time I do that.
Where is my mistake?
Here is my code: http://codepen.io/Holic101/pen/mEPazO
I need help badly .. please review my code.. This is about local weather app, the api call is returning back 404 error but when i paste the api url in the address bar, it is giving me json result. please tell me where am going wrong
function loadDoc(url, cfunc){
var xhttp;
xhttp = new XMLHttpRequest();
xhttp.onreadychanged=function(){
if(xhttp.status==200 && xhttp.reasyState==4){
cfunc(xhttp);
}
};
xhttp.open("GET",url,true);
xhttp.send();
}
function location(xhttp){
document.getElementById("out").innerHTML=xhttp.responseText;
}
loadDoc('ip-api.com/json', location);
Just finishing up my "Random Quote Generator" trying to get the twitter button to work. I was using the developer documents as a guide. But, obviously, I'm not doing it correctly. It seems like you don't need to add more javascript since it plugs into the html.
Here is the code:
http://codepen.io/flindip/pen/mEEjXa
@Holic101 You need your clearInterval(clock). Why did you comment it? Otherwise, when you press the clock again, a new interval is initiated, thus you'll have time-- twice every second....
Hey guys, quick question
im trying to poll an API with jquery with .getJSON(API, function data) . And in there I want to assign the data to a global variable
but I cant and I dont know why
@manu-4216 thank you, I changed that and now this problem is solved, but I found another bug: when I reduce the sessionTime counter down to the lowest possible number (5 at the moment) and then try to add time again, this time is added as a string. So I get 0555:00 for example. Could you help me with that too?
:cookie: 328 | @manu-4216 |http://www.freecodecamp.com/manu-4216
holic101 sends brownie points to @manu-4216 :sparkles: :thumbsup: :sparkles:
@Holic101 For the other problem (the timer starting always at 25), you should set time = sessionLength * 60; right after updating the value (plus or minus)
@manu-4216 right, because I’m making it a string with the added „0“. thank you!!
holic101 sends brownie points to @manu-4216 :sparkles: :thumbsup: :sparkles:
:warning: holic101 already gave manu-4216 points
@Holic101 Yeah, you should in fact call that 'checkTime' only when you're setting the html, like so: .innerHTML = checkTime(...)
@manu-4216 I solved it with: sessionLength = parseInt(checkTime(sessionLength)); But I like your solution better
Yeah. checkTime is more like a formatTime function, that you should call only when displaying.
@Martialis39 Give us a link to your code
@Martialis39 Declare the variable outside the getJSON call - then change its value in the getJSON call
Is anyone familiar to implement a twitter button for the Random Quote Generator?
@flindip I do
@flindip the href for the button link needs to begin "https://twitter.com/intent/tweet"
Hi everyone!
Can someone tell why this isn't working with width less than 700px? (max-width)
It aplies just the css that is for 700px at least. (min-width)
I'm using Chrome for testing.
```<link rel="stylesheet" type="text/css" media="(max-width: 700px)" href="styles-400.css">
<link rel="stylesheet" media="(min-width: 700px)" href="styles-700.css">```
Alright, I am working on the "Random Quote Generator." I think I found a method to make it work that is pretty simple using widgets and web intent: Still trying to make it work.
Here are the methods I'm using:
https://dev.twitter.com/web/tweet-button/web-intent
https://dev.twitter.com/web/tweet-button/javascript-create
Here is my code:
http://codepen.io/flindip/pen/mEEjXa
given the example of the widget I'm not sure if I need to anchor the twitter button.
Hi everyone,
I have some problems in understanding the challenge Build a Personal Portfoflio Webpage but I don't understand the rule #2 and I see other personal portfolio webpage that are using languages that are not explayned in what I learn until now.
Can anyone give me the code of this https://www.freecodecamp.com/challenges/record-collection
@stblack rule 2 is just to fulfill the user stories it lists below
you don't have to make it anything fancy to start out with. What I did was make a simple portfolio page that fulfilled the user stories and looked decent, and then came back once I had learned more and made it look better.
@stblack hi. i am also at this point right now, am ending this challenge. I thing other users might have been either "advanced" with more knowledge or they came back later and change it, after they have learned something new
@TDandelion exactly. My original page didn't look much different than my tribute page but now it's got all kinds of neat things added.
@microcyberz can you post what you've got so far?
@buckshot307 nice. I am thinking right now either to go on on the next challenge or "pimp" my portfolio page. All user stories are completed, it is quite decent outcome, but I am disovering so many new things, i would like to test them all... But I guess i will not come quite far if i keep doing changes, right?
@TDandelion Yeah I would go on! By the time you complete the course you will have learned so much more and may even completely redo your portfolio. I have the one I did originally, but it never quite looked the way I wanted so I've restarted and made a more simple looking one. It will be more complex though because I know more CSS and jquery now.
@buckshot307 ok, thanks for advice!! will go on than
tdandelion sends brownie points to @buckshot307 :sparkles: :thumbsup: :sparkles:
:cookie: 325 | @buckshot307 |http://www.freecodecamp.com/buckshot307
I'm looking for good resources/tutorials for webpack
guys i need some help plzz... how can i make my cards display in a 2x2 layout? http://codepen.io/Ferdyboy81/pen/PzzqGE?editors=1100
Thanks @buckshot307 and @TDandelion
stblack sends brownie points to @buckshot307 and @tdandelion :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for tdandelion
:cookie: 326 | @buckshot307 |http://www.freecodecamp.com/buckshot307
Can someone help me implement the twitter button with the "Random quote Machine"?
@flindip
href="https://twitter.com/intent/tweet?text=Hello%20world" is the basic link to compose a tweet. That's a good place to start. Not sure how far along you are.
@hiltydiggs the approach I'm taking is using a widget:
https://dev.twitter.com/web/tweet-button/javascript-create
https://dev.twitter.com/web/tweet-button/web-intent
Here is the code:http://codepen.io/flindip/pen/mEEjXa
I'm just trying to figure out if I need to anchor the button. I'm not sure If its necessary or not
Doesn't look like it according to the documentation.
@hiltydiggs Yeah but its not really functioning. Seems like it should be easy to implement. I thought by the instructions
Yeah I see. I'm playing around with it now.
@Ferdyboy81
You can use:
min-height: 200px;
min-width: 150px;
display: inline-block;
But I really encourage you to research on display: block, inline, and inline-block
@flindip still nothing
@flindip fyi you're missing the
break; after case 1:.
@flindip, nice page there. Haven't seen Stuart Smalley in years. :)
does anyone use yeoman to generate boilerplates for html, react, angular? yeoman seems like a lifesaver, is it similar to rails generate ?
@hiltydiggs @andreas2249 thanks. Just trying to get that twitter button finished
flindip sends brownie points to @hiltydiggs and @andreas2249 :sparkles: :thumbsup: :sparkles:
:cookie: 529 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
:warning: could not find receiver for andreas2249
@hiltydiggs Hmm, I may go look into a different channel then. Thanks for trying though
flindip sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: flindip already gave hiltydiggs points
This message was deleted
@flindip what's the issue?
@flindip yeah sorry. Still reading stackoverflows on it.
@jdtdesigns the approach I'm taking is using a widget:
https://dev.twitter.com/web/tweet-button/javascript-create
https://dev.twitter.com/web/tweet-button/web-intent
Here is the code:http://codepen.io/flindip/pen/mEEjXa
https://dev.twitter.com/web/tweet-button/javascript-create
https://dev.twitter.com/web/tweet-button/web-intent
Here is the code:http://codepen.io/flindip/pen/mEEjXa
@flindip why not do what they recommend now and use the twitter intent url?
Hi there, coders. I'm trying to make this "Show the Local Weather" app, but I encountered problems right at the beginning. Basically, what I'm trying to do is use $.getJSON method to retrieve data from this Open Weather API, but it's not working. Plain insertion of API calls found there as getJSON url parameter, even with http:// beforehand, doesn't seem to do the trick. I even tried to insert page address as url and API call as data, to no avail. Anyone has any ideas? Thanks in advance!
@mikser73 post your codepen
@flindip https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text= and just concat the quote on the end you're done
@flindip one more thing, even though it's not working right now, it looks like the tweet text is only set once on page load so when a new quote is called for
twttr.widgets.load() will update the tweet text according to documentation. It would have to called each time a new quote is requested.
@mikser73 possibly
https://?
@jdtdesigns I see, let me give it a shot
@jdtdesigns Here it is. I didn't get very far :) http://codepen.io/mikser73/pen/WxxVYE
anyone can tell me why divs with class button in div class math-calculations doesnt work ?
http://codepen.io/uRTLy/pen/gMwwyw
http://codepen.io/uRTLy/pen/gMwwyw
@hiltydiggs Tried it, doesn't work :(
@mikser73 IYou need a key from openweather to use their api
you have to sign up to get the key
also, js goes in the js tab, and the only html that goes in the html tab is the stuff between the <body> tags
I copied it from atom
codepen adds the <html><head><body> all for you
@mikser73
@jdtdesigns OMG, thanks! I'll give it a try. As for those tags, it is just a habit I picked up while coding in Dreamweaver - writing everything in one place :)
mikser73 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 511 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@jdtdesigns I implemented it with an anchor. But I'm trying to get it to display the randomQuote(val)element...
Do I have to write a function for it?
href=https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text="randomQuote(val)"><button type="button" class="btn btn-primary" id="btn2">Tweet</button></a>
@flindip I wrote a few functions for mine to percent encode and trim. Not the best code, but maybe an example to look at: random quote pen.
hello, can my tribute page be on any topic i want?
@AdilJawad yes
Thanks @hiltydiggs
adiljawad sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 530 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@AdilJawad np!
:smile:
Hello everyone.
@RoniqueRicketts hello!
I am working on my TwitchTV app but I am stuck. I need help
$(document).ready(function() {
var channel = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
var api = 'https://api.twitch.tv/kraken/streams/';
$.getJSON(api, function() {
for (var i = 0; i < channel.length; i++) {
$.getJSON(api + channel[i],function(data){
//console.log(data.stream);
if (data.stream===null){
console.log(channel[i]+' is currently Offline');
}
else{
console.log(channel[i]+' is Online');
}
});
}
});
});
I don't know what to do my tribute page on
any suggestions?
@RoniqueRicketts you're calling
$.getJSON twice. As you have it, it should iterate through channel and call $.getJSONfor each.
This message was deleted
@hiltydiggs so $.getJSON(url).forEach()
@RoniqueRicketts
$(document).ready(function() {
var channel = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
var api = 'https://api.twitch.tv/kraken/streams/';
for (var i = 0; i < channel.length; i++) {
$.getJSON(api + channel[i],function(data){
//console.log(data.stream);
if (data.stream===null){
console.log(channel[i]+' is currently Offline');
}
else{
console.log(channel[i]+' is Online');
}
});
}
});Something like that
@RoniqueRicketts not sure if I removed the correct end brackets.
please help me i am confused when we write within double and single quotes "'something'"
<div ng-include="'about.html'">
@hiltydiggs that didn't work. How does the forEach() works in this scenario?
@hiltydiggs yeah, its a different approach from my page. You went with arrays. I went with Switch. Maybe I can reverse engineer some things. Thanks
:warning: flindip already gave hiltydiggs points
flindip sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
@RoniqueRicketts
forEach() is just another way to iterate throught the channel var. channel.forEach(function(){$.getJSON...})
ok will try that thanks
I tried for it but didn't know how the $getJSON() comes into play
please help me
@Raj00786 looks correct
@hiltydiggs but why
<div ng-include="about.html"> not works
using only double quotes
@RoniqueRicketts you have an asynchronous problem. The current step of channel needs to be stored in a variable.
$(document).ready(function() {
var channel = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
var api = 'https://api.twitch.tv/kraken/streams/';
for (var i = 0; i < channel.length; i++) {
var current = channel[i];
$.getJSON(api + current,function(data){
if (data.stream===null) {
console.log(current +' is currently Offline');
}
else {
console.log(current ' is Online');
}
});
};
});
oh cool thanks
@RoniqueRicketts still not quite right. Still working on it.
I figure its not.
@hiltydiggs the current code you have only outputs the Last channel's name.
@RoniqueRicketts
$(document).ready(function() {
var channel = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
var api = 'https://api.twitch.tv/kraken/streams/';
for (var i = 0; i < channel.length; i++) {
var currentStreamer = channel[i];
var eachURL = 'https://api.twitch.tv/kraken/streams/' + currentStreamer + '?callback=?';
(function(i, eachURL, currentStreamer) {
$.getJSON(eachURL, function(response) {
if (response.status === 422) {
console.log('Error!');
} else if (response.stream !== null) {
console.log(currentStreamer + ' is online');
} else if (response.stream === null) {
console.log(currentStreamer + ' is offline');
}
});
})(i, eachURL, currentStreamer);
}
});
thanks much thats makes sense. So first asign the channels to a variable then concat it onto the api and from there I just search each api for the information that I want?
I have a div which contains multiple links. I would like to make it so clicking anywhere in the div triggers the first link. I have tried
$('.collection-item').click(function() {
window.location = $(this).find('a').first().attr('href');
return false;
});But the other links in the div are no longer clickable. Any suggestions?
@adzam5 not sure but I think you'd have to add the event argument and add
event.stopPropagation(); to all of the other links.
@adzam5 event.stopPropagation
@adzam5
$('.collection-item a').click(function(event){event.stopPropagation();});
@RoniqueRicketts yeah. You can replace each
console.log() with a function that handles each situation and appends it to the page.
@hiltydiggs Works perfect! Thank you
:cookie: 531 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
adzam5 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
@adzam5 nice! np.
MikeBeers @MikeBeers 10:34
I am looking for help on pushing an onclick element to an array inside an object. If I take the array out of the object I can add to the array no problem. Just wonding if I can get a little help figuring this out.
<div id="green" class="quarter green" onmousedown="display.gDown(this)" onmouseup="display.gUp(this)" onclick="game.player(this)">object
var game = {
player: function(obj) {
var playerArr = [];
alert("obj " + obj.id);
playerArr.push(obj.id);
alert("player " + playerArr);
},MikeBeers @MikeBeers 10:40
here is the PEN
https://codepen.io/MikeBeers/pen/MeejWE?editors=0010
@MikeBeers taking a look...
How can I build Build a Personal Portfolio Webpage.? We have not taught all the things included in that yet.
@hiltydiggs i think I found out why. I was setting array back to empty every time I clicked a color
@MikeBeers is the problem that it clears the array each time? Yes exactly.
Anyone around who has FTPd their React app to the web?
@microcyberz what do you feel like you're missing?
@matty22 I haven't, but what are you FTP'ing to? What FTP client?
@microcyberz We haven't built all the projects yet that you would display on there, but you just build the layout and design and can use temporary images as placeholders for the projects. As you complete projects you will add them to your portfolio
@hiltydiggs ya I know how to get that part going. I just wanted to get the main function to work so I can complete the project
hi everybody! I have just finished my portfolio page. Can you give me some feedback, please?
Um, what should I put in to link for my randomQuote call in the href text input for my twitter button?
Here is the code:
http://codepen.io/flindip/pen/mEEjXa
It seems every example is using Jquery to do it. A lot are using arrays which I didn't use.
@TDandelion looks good. one thing you may or may not want to do is add target="_blank" to your links to github etc. that way they open up. codepen doesn't allow them to open as is.
@flindip I'd really focus more on html/css before moving to js. Your page is literally unreadable. Just some advice from someone who deals with this issue a lot. ;)
Hello Room :) I am trying to add some links on my codepen portfolio page to other pens and, in the future, other websites I am working on. I am wondering if anyone can offer any guidance as to how I add a link to another pen while displaying the pen as an image in my portfolio, seemingly identical to my profile page on codepen. Anyone want to work with me on this?
@TDandelion can you please help me with my question above? You seem to have accomplished what I want to do
<a href="http://anotherpen.com" target="_blank">
<img src="http://image.link" alt="">
</a>
@DanielMW34
@jdtdesigns understood you said earlier to concave quote in the href where the text is. How do I get the JS call to do that?
@mattboland thanks for your feedback. I will ad this to my links, although If I do the right-mouse click and open in another tab, than it seems to work..
tdandelion sends brownie points to @mattboland :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @mattboland |http://www.freecodecamp.com/mattboland
@jdtdesigns thank you. I will experiment with this. The image link though, where does it come from? Do I have to take a screen shot of the page and then use that as the image?
danielmw34 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 512 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@DanielMW34 i guess you have to use <a href> funktion
@TDandelion cool, yeah, not necessary but it was just one thing i thought of when i looked
@kksrini89 Hi..thanks for trying...But I figured it out myself...appendchild of div works only once.we need to clone the div to append it to other divs.
@hiltydiggs I figured it out...kind of. I just
npm start the project so that webpack runs. Then I open the app in localhost. Then I right click, inspect source, and grabbed the code from the Dev tools. Created new folder with that code, and FTP'd that with Filezilla. Worked, my React app is up on the web, but there must be a better way.
Also how can anyone tell if I used Sass or not? I have to FTP CSS, not Sass, so there isn't any evidence that I even used Sass or is there and I'm just not aware?
@DanielMW34 hmm... I think I don´t understand you exactkly what kind of guidance do you need. But hey, if you say it seems like I have accomplished it, than we just have to identify the issue, i will be glad to help
document.getElementById('get-quote').addEventListener('click', showQuote);
var showQuote = function() {
var quote = data.quote, // Refers to the quote in your quotes list
tweetLink = document.getElementById('tweet'); // Refers to the tweet link
tweetLink.setAttribute('href', 'https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text=' + quote);
};
@flindip
You will also need to make sure the link has the target="_blank" attribute set
@jdtdesigns thats just the straight JS. No Jquery?
yes
@jdtdesigns thank you very much
flindip sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 513 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
welcome ;)
@jdtdesigns target="_blank" is positioned in the anchor correct?
yes
<a href="url" target="_blank">Tweet</a>
@jdtdesigns just curious the getElementbyId(get-Quote)do I have to nest that into the button id?
@flindip it can be any id you choose
it's just referring to the id you gave your button that will get a new quote
@jdtdesigns I gotcha
Hey! Could anyone join me on Google Hangouts and help me make my portfolio page mobile-friendly? :blush:
Hey guys i'm working on the wikipedia viewer project and i'm kinda lost in how to use the wiki API... How am I supposed to get a url to a page from something searched? I found a way to get the URL to appear in the API response but I can't use it because the url appears under a page id that changes depending on what I search...
I've been stuck on this for days :(
here's all I have so far http://codepen.io/mcorby17/pen/vKGPmQ?editors=1011
I can't get any response from the API call either :( :( :(
what am i doing wrong??????
Why can't I even print the JSON to the console?
I think it must be the API call somehow... I put in a simple http://ip-api.com/json call and was able to print that but can't print https://en.wikipedia.org/w/api.php?action=query&format=json&prop=info&inprop=url&titles=hitler even though it comes up in my browser
boy this is great talking to myself
why does the image in col-xs-4 comes out of the defined area.
IS there any way no matter how large be it will be contained in the col-xs-4
hello ? anyone
@mcorby17 Why are you searching for a value with onclick? Shouldn't you be searching for a string?
hell is anybody in there , Nod if u can hear me !!
@sumitsrbh nod
@KoniKodes what is your codepen?
@KoniKodes http://codepen.io/srbh101/full/yJJpgP/
who ho it looks completly diffrent than in my editor
@KoniKodes it's messed up
@sumitsrbh try setting your background to 100%, with a max-width. The row stretches out to 100% of the body.
Guys, when i make the page bigger for my pen, everything gets messed up
https://codepen.io/AdilJawad/pen/PzGWNd
https://codepen.io/AdilJawad/pen/PzGWNd
@sumitsrbh Also, in the setting you are calling the same bootstrap twice. I may confuse it...
Fixed it!
@AdilJawad you can chain your classes : <div class="jumbotron row col-md-2"> Why is your row 2 columns out of 12? You haven't set your jumbotron background color yet.
@KoniKodes corrected the setting, no effect !!
@sumitsrbh Let me look again.
@jdtdesigns are you still there?
@KoniKodes it's 8 and 4
@sumitsrbh How large is your original image?
@KoniKodes 1280X960
ok. is there any way to auto adjust it ?
according to col-4 size
@sumitsrbh You only want to cover 1/3 of the page. So maybe make your image 427x320. It's better to have your original reset.
@sumitsrbh or try "img responsive" and see if that works.
@KoniKodes i got it dear better use img-responsive class and cut the hassle. thnx dear for ur time. bcz i hv become comfortably numb
sumitsrbh sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 306 | @konikodes |http://www.freecodecamp.com/konikodes
Making progress on my twitch streamer app. Thanks for last night's help @jdtdesigns and a couple thers. Here is the current progress. My issue at the moment is why my bootstrap rows are now wrapping around each column element. As a result I cant get the formatting to look right with backgrounds coded as per the example app.
adventurebear sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 514 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Still some other things to do and refactor but it feels great to make progress!
@sumitsrbh It happens to all of us at three times :-)
Alright, I'm trying to implement the twitter button for my "Random Quote Generator". One of the campers helped me earlier and with giving me a pathway. I dissected it and put in the corresponding parameters that were for my code. I still can't quite get to work.
can someone take a look at it?
http://codepen.io/flindip/pen/mEEjXa?editors=1010
can someone take a look at it?
http://codepen.io/flindip/pen/mEEjXa?editors=1010
@KoniKodes ha ha. now i gonna change my track to "knocking on heaven's door gun's and roses " . Oh i love it.
@sumitsrbh I know that feeling :-)
I guess I could also try the JS widget approach but I couldn't quite get that to work either
@flindip Aside from the buttons being too dark to read - I thought I was getting a quote, but I tweeted instead - It worked for me, pulling up different quotes. It is a little larger than my viewport but, what is the problem you are having?
@KoniKodes so the twitter button is working for you? Its just giving me a box with #quotes on the twitter page
@KoniKodes Pretty much I'm just doing the tasks and then I'm going to rework the project down the road.
@flindip Oh you are right, it didn't pull the quote in, just showed me my avatar and quote# inside the box. Let me look again.
@KoniKodes just to tell you. I didn't use Jquery. I didn't use arrays. Its a switch function so I'm using straight javascript
@KoniKodes also I put in comments for the JS code to give you what the values are. Val is basically data.quote etc
@KoniKodes thanks for looking btw
flindip sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 307 | @konikodes |http://www.freecodecamp.com/konikodes
@flindip That's ok. You will need to open your window on button 2, and go to "https://twitter.com/intent/tweet?text=" +randomQuote + "
@KoniKodes where should I implement that?
@KoniKodes you mean href?
@KoniKodes Mine is called randomQuote. Yours would be "mirror" Make a function when you call button2
"mirror is the element which displays button1 I believe
I keep hitting me.. @flindip no href inside the function but the page for tweet. Ok then, you need the name of the variable for the quote .
@KoniKodes the data for quote is named val
random quote.. struggling with retrieving quotes :smile:
@flindip Good. Then make the btn2 onclick function call to the twitter/intent/tweet with val.
@oxide94Git What is your codepen?
@KoniKodes I gotcha just add an onClick to the button then?
button2 that is
@flindip yes, like you did with button 1
itz quite dirty now :smile:
can anyone help me with positioning for my pen
i want the form element and magnify in center of container
having trouble doing this
@oxide94Git "Request Failed: error, error". You have cross-security issue. Your codepen is at https, but you are calling to http. It should be http.
@oxide94Git You need to add a callback function to your request
@KoniKodes @thomlom olala magic. solved .. thanks :)
oxide94git sends brownie points to @konikodes and @thomlom :sparkles: :thumbsup: :sparkles:
:cookie: 389 | @thomlom |http://www.freecodecamp.com/thomlom
:cookie: 308 | @konikodes |http://www.freecodecamp.com/konikodes
@KoniKodes Still not functioning. Do you want to see the code again?
@KoniKodes by the way your site is cute
@flindip yes please @oxide94Git Great! Thank you for the brownies
konikodes sends brownie points to @flindip and @oxide94git :sparkles: :thumbsup: :sparkles:
:cookie: 279 | @flindip |http://www.freecodecamp.com/flindip
:cookie: 280 | @oxide94git |http://www.freecodecamp.com/oxide94git
@max77p You should use the bootstrap's grid system (col-md-5, ...)
hey guys
I'm doing a project and i wanted to know how can I put placeholder images for my portfolio
?
@thomlom ahh ok...also one more question...whenever i click the magnify glass the "click icon to search" text moves a bit
@radogalloway you would probably need to find an img
i like www.placehold.it
how do i make sure its not moving
@KoniKodes your site is cute.. :+1: so neat.
they give you placeholder images of any size @radogalloway
@radogalloway https://placehold.it/
okay thanks a lot guys
@oxide94Git Thank you. A little better each time I learn something new.
konikodes sends brownie points to @oxide94git :sparkles: :thumbsup: :sparkles:
:warning: konikodes already gave oxide94git points
@flindip sent you a private chat. hope it helps...
@KoniKodes ok, thanks
flindip sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:warning: flindip already gave konikodes points
having a hard time getting the positioning right for my pen
can anyone help?
hey @max77p
Any suggestions for my bootstrap question? Row closing doc tag showing up in the wrong place. Link above
what are you trying to fix in it .. ?
@KoniKodes I used .val() to get the user input from the input box
Or should I collect all the data in an abject rather than build the HTML as i go?
just the positioning of the search button and the form ?
or more .. ?
@designviacode hey the search button, form and one thing i noticed when i click the search button the "click icon to search" text moves a bit when the form field shows
i don't want it moving at all, but staying central right below the form field
@designviacode i am not sure if i am using the container/grid right in mine though
@max77p so you wish to do the following :
- align all text in center
- align the search form - center
- the search button and input both should be visible by default
Hello ! I have a little problem with arrays. Can someone help me ? My code and problem explanations are just here: https://jsfiddle.net/stq5hvth/ Thanks a lot !
is that correct
@designviacode yes sir
alright then lets fix all of those ..
@designviacode if you can walk me through the positioning that would be wonderful...i think i confused myself with using grid or not to use grid and to use container or not to use container lol
for text alignment
set the css property text-align on body element
set the css property text-align on body element
@designviacode oh right, that works, but i also get the results of the search getting centered...for the results i would like to have it left most
Is it not possible to use getJSON for the wikipedia api?
do I have to use ajax?
@mcorby17 i found that using .ajax was a lot easier
i tried with getJSON..while possible..was little trickier
@max77p ok I suppose i'll try that
@designviacode would i even need a container for this?
this project is so frustrating
@mcorby17 its not bad actually...just play with the .ajax read up on similar problems
for me i found getting the damn search was the easiest part
aligning everything on the page has been stupid frustrating lol
even though positioning is probably the easiest part
@max77p
using a container is just fine ..
but the things you should fix are :
using a container is just fine ..
but the things you should fix are :
- provide either an id or class to the header section (the one with the form and headings and classname=container)
- now set text-align property on that class or id : for.eg : #header {text-align: center;}
this will prevent the search results from any alignment changes
@designviacode what do you mean header section?
like where it says "wikipedia viewer"?
i've forked your pen ..
check it here ..
check it here ..
@designviacode one thing i want to know is when you click the magnify icon the text below moves a bit as the form field comes into view
why is that
in the example pen they provided that doesnt happen
@max77p btw is .magnify a bootstrap class?
@mcorby17 no just a class i made
how can i click on a button to navigate to particular segment in that page
but the glyphicon is bootstrap icon
@max77p huh I didn't see it in your css
@mcorby17 yea i deleted the css for it for now, wasn't working what i was trying to do
@sumitsrbh use ids .. and specify the href property of the anchor tag as the id
for.eg:
<div id="page-1">
Section 1
<a href="#page-2">Goto Section 2</a>
</div>
<div id="page-2">Section 2</div>
@designviacode any idea why the text is moving when the form box comes to view?
This message was deleted
I've been trying and trying to get this carousel to work...any ideas why it might not be functioning? http://codepen.io/dennisharger64/pen/MejeMJ/?editors=1000
I need some help with JS; I have to retrieve the photos from a public album on a facebook page, but using facebook's graph API I should expose the access token in the code. Is there a way to do this without using an access token or without the api?
@jlouiss Did you set the key into a separate variable and then call that key in api?
@KoniKodes wouldn't it be exposed anyways?
can anyone help me?
@jlouiss yes, someone else offered a solution once, let me check.
@KoniKodes thank you
jlouiss sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @konikodes |http://www.freecodecamp.com/konikodes
Hey can anyone help me out with something?
@jlouiss From another camper re: api key :: Can't be helped on codepen, but you should never put your apikey in public (codepen is public). It's like a password. People write programs that scan the internet for apikeys, so it's not good to have them there. In this case, I guess it's not a big deal, but it's good to start thinking about this. If you want, you could generate a new one, and think about a simple way to encode it (like multiply it by 2 or anything easy), and then you could declare the variable with an encrypted key and your pen could decode it.
@jlouiss with php forms I tend to hide it in the init file, but I don't know if that is possible in js.
@max77p what is the problem?
@KoniKodes thanks
jlouiss sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:warning: jlouiss already gave konikodes points
@KoniKodes http://codepen.io/max77p/pen/ezNrvY
for whatever reason, when you click the magnifying glass icon, and the form field appears, the text below "click icon to search" is moving down
i want to keep it steady in one spot..what is causing this? and how do i fix it?
@max77p I see that. Give me a minute..
:point_up: June 18, 2016 5:35 PM
Even though nobody was able to help, I'll tell you that the solution was making sure that the jquery and bootstrap libraries were loaded not just on the CSS tab of the pen settings, but also the JS tab http://puu.sh/pxBm1/46a31262b3.png
I need some advice about my portfolio
http://darksmurf.github.io
What project should I remove under "Portfolio"
http://darksmurf.github.io
What project should I remove under "Portfolio"
@max77p I'm trying to understand your logic. It seems to me that you are asking me to click on the magnifying glass to search, and then click on the X (which is usually recognized as Close the box) to submit the request. My search brought up ten on the far left. Perhaps you could have your search box set up with the magnifying glass attached, and the magnifying glass is the submit button?
@Darksmurf I would say wikipedia or weather. They both sort of prove the same thing, that you can use an API
nice site btw
:) ok thanks @dhcodes
darksmurf sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1060 | @dhcodes |http://www.freecodecamp.com/dhcodes
@Darksmurf Why do you need to remove any of them? Perhaps with a thumbnail you could showcase all of them.
@KoniKodes the search itself works perfectly...i am just wondering why the text below which says "click icon to search" moves a bit when user clicks the magnifying glass
@KoniKodes I did thumbnails at one point, but I didn't like that.
what is making it move basically
and how do i stop it from moving and stay fixed
@max77p Ok. Let me look again.
@max77p I think it's because the input form is taller than the icon
@max77p What size is each one? The magnifying glass seems smaller than the search box, and so the new search box needs more room. Try making them both the same size (4 em)
@Darksmurf That makes sense.
@dhcodes Good to see you again :-)
@dhcodes shouldn't it be taller than icon?
@KoniKodes not sure i understand, shouldn't it be smaller than search box?
@max77p Not if you want it to stay static
@KoniKodes trying to understand deeper level to this, why would the icon being smaller cause it to move?
@KoniKodes you too
@max77p The space for the smaller box will be over-ridden by the larger div and push the next line down. Keep the containers the same size
@max77p the divs properties apply to anything in it. So the default padding will make the div change if they are different heights
@max77p Yes, what @dhcodes said.
@dennisharger64 Yes, somtimes we forget that we need the js version of bootstrap.
@KoniKodes so breaking this down, sorry little slow right now lol.....my form is at height:2em
so i should make the magnify height 2 em as well?
@max77p Yes, exactly. That way they won't change size when switched.
@KoniKodes i did this, but the text below still moves though?
@max77p Really? Let me look again.
@KoniKodes so another user in the help section as well, mentioned that if i put a height on the entire form element it keeps the same height regardless of what is added or removed in the jquery
so i just put a 1em height for the entire form class and the text doesnt move
is that understanding correct? because height will change depending on what is added or removed dynamically in jquery?
Can anyone tell me how I would access the 'fullurl' in this wikipedia api call? https://en.wikipedia.org/w/api.php?action=query&prop=info&pageids=18630637&inprop=url
@max77p It didn't move too much, more like recognizing a change is happening. The list is now centered too. You want to keep it responsive, so perhaps a percentage... 1em is not going to be enough for the whole form. You don't need to create a new codepen each time, unless you are tracking your versions - you can simply save it.
@mcorby17 I'm sorry, I'm still trapped on weather
@KoniKodes ok cool thanks!
max77p sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @konikodes |http://www.freecodecamp.com/konikodes
@dhcodes you too sir, thanks for your help
max77p sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1061 | @dhcodes |http://www.freecodecamp.com/dhcodes
@max77p You'll get it there.
@KoniKodes what does your weather app look like?
@mcorby17 you mean what url should you use?
for the api call?
@mcorby17
where searchQuery is your input from the user
@mcorby17 json.query.pages[0].fullurl
@jdtdesigns but what about the number after 'pages'? Don't I have to include that?
it's different for every query so I don't get how i'm supposed to be able to get the url for different searches
^
ohh yeah my bad
but pages isn't an array is it?
you can access objects with index values as well
ohh okay thank you!! @jdtdesigns
mcorby17 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 515 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
So that solves one of my problems
now I need to figure out why I can't make the api call with getJSON
@mcorby17 post your codepen
I hard-coded getJSON for now
@mcorby17 You need this at the end of your api
&callback=?
@mcorby17 just add '&callback=?' as a param
Hi, could anyone help me with re-sizing images with CSS/Bootstrap? I want to match the image size with the text in the adjacent column of the grid. http://codepen.io/tonnamb/pen/bewBEY?editors=1100
@GregatGit @jdtdesigns thank you so much guys!! Could I also ask, why do I need &callback?
mcorby17 sends brownie points to @gregatgit and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: mcorby17 already gave jdtdesigns points
:cookie: 605 | @gregatgit |http://www.freecodecamp.com/gregatgit
I'm hoping @jdtdesigns knows - cause I want to know to.
@mcorby17 That is the param to tell the api to return jsonp. Codepen doesn't allow json to be returned when the No Access header is on the api resource.
jsonp is a more insecure form of json
@tonnamb before you do anything you have to add jquery.js and bootstrap.js to the javascript in settings
@jdtdesigns so is it more of a codepen-only type thing?
Like if I was coding this using my own text editor or something would I still need to use the callback?
@GregatGit Thank you!
tonnamb sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 606 | @gregatgit |http://www.freecodecamp.com/gregatgit
@mcorby17 It's codepen and a few others. They do it for security reasons. If you were devving locally, you wouldn't need to do it.
@GregatGit Wow things work wonder!!
@GregatGit Face palms
Myself..
@tonnamb i got a lot of help from this - http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp
@GregatGit Thanks!
tonnamb sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:warning: tonnamb already gave gregatgit points
@tonnamb greg is the go to man when you in trouble around here
@max77p yep I can see that haha
Hey guys, is it important to use proper tags when doing stuff? Like headers and footers and what not? Is that good practice or does it not really matter? Like why should I or shouldn't I care about that?
@ddschmitz absolutely, always follow good practice
But why?
even if we don't need to have something when using codepen, do it anyway
because when you are employed or working on real world projects its important to do all that in order
I thought it also helped with like website readers for blind people?
hey, I'm wondering how Quincy Larson got the line just above his footer on this tribute page: https://codepen.io/FreeCodeCamp/pen/NNvBQW
Good afternoon, Campers. I'm trying to find out how to add some margin to a Bootstrap .well class. My anchor tags for 'Portfolio" and 'About' links have padding so that there's some white space between those sections and the menu at the top of the page.
I'm struggling to add the same amount of padding / white space to the 'Contact' page div which has a Bootstrap .well class. Can someone please have a look at my CodePen and offer a starting point to resolve this? Thanks in advance. :) http://s.codepen.io/andreas2249/debug/PzGNZm#
Wrong link to Pen. Sorry: http://codepen.io/andreas2249/pen/PzGNZm/
Anyone available to help me out?
@AdilJawad, it might be part of Bootstrap's
.jumbotron class. If you remove line 2 and refresh, that line spans the width of the viewport. How it's done might be "buried" in Bootstrap.
hello everyone i have a question, i have accordion menu in here, but well, it seems like i cant really find myself with styling it, does anyone have any example on nicely styled menu of this kind?
http://imgur.com/89K30pm
http://imgur.com/89K30pm
@ddschmitz Aria
@andreas2249 I like the design you have started there. Well done.
Thank you kindly, @hiltydiggs :)
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 532 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Any idea how to get some space above that
.well@hiltydiggs ? Stumped here.
@andreas2249 between the wells and the "Portfolio" heading?