:cookie: 119 | @mchor38 |http://www.freecodecamp.com/mchor38
:cookie: 345 | @u-ways |http://www.freecodecamp.com/u-ways
somoking sends brownie points to @khaduch and @mchor38 and @u-ways :sparkles: :thumbsup: :sparkles:
:star2: 1642 | @khaduch |http://www.freecodecamp.com/khaduch
https://api.twitch.tv/kraken/streams/comster404 404 (Not Found)
Hi guys
I was trying to flush all of my results everytime new search being entered but it just doesn't work. Any advice
, please?
``
//Innitiation
html = "";
resList = [];
function FormatRes(title,snippet){
this.title = title;
this.snippet = snippet;
};
getWiki = function(data){
$('#target').empty();
console.log("before: " + resList);
resList.length = 0;
console.log("after: " + resList);
resArray = data.query.search;
for ( var i in resArray){
resList.push( new FormatRes(resArray[i].title, resArray[i].snippet));
html += '<div class="result"><a href="https://en.wikipedia.org/wiki/' + resList[i].title + '" target="blank">' + '<h4>' + resList[i].title + '</h4><br><p>' + resList[i].snippet + '</div>';
$('#target').html(html);
};
};
$(document).ready(function(){
function search() {
$.getJSON("https://crossorigin.me/https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=" + $('#searchBox').val() + "&prop=info&inprop=url&utf8=&format=json", getWiki)
};
// Enter to search
$("#searchBox").keypress(function(e) {
if(e.which == 13 || e.which == 1 ) {
search();
}
});
});
``
html +=
- inside the function first make sure html is empty if not you will just add to what you have.
Hi, guys! you guys know if I'm doing this right? I need to push the odd numbers from 1 through 9 to myArray using a for loop. here's my code:
for (var i = 0; i < 10; i += 2){
if (i % 2 !==0){
ourArray.push(i);
}}
but isn't working :c
donnietrente sends brownie points to @labiej :sparkles: :thumbsup: :sparkles:
:cookie: 443 | @labiej |http://www.freecodecamp.com/labiej
labiej sends brownie points to @leonormes :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @leonormes |http://www.freecodecamp.com/leonormes
predarobert sends brownie points to @labiej :sparkles: :thumbsup: :sparkles:
:cookie: 444 | @labiej |http://www.freecodecamp.com/labiej
imlaing sends brownie points to @flopywood :sparkles: :thumbsup: :sparkles:
:cookie: 319 | @flopywood |http://www.freecodecamp.com/flopywood
imlaing sends brownie points to @flopywood :sparkles: :thumbsup: :sparkles:
:warning: imlaing already gave flopywood points
@123xylem
function alertUWin(){
var box=$("#alertBox");
box.style.display='block';
$("#alertBox").css("display","block").text("You Win!");
};
Can some one advise how to make this function display the following AlertBox
#alertBox{
display:none;
z-index:10;
opacity:0.9;
position:fixed;
top:29%;
left:36%;
width:320px;
height:260px;
}
The box is set to display none.. when function activates i want to change the display to block thereby making it appear
123xylem sends brownie points to @flopywood and @imlaing :sparkles: :thumbsup: :sparkles:
:cookie: 329 | @imlaing |http://www.freecodecamp.com/imlaing
:cookie: 320 | @flopywood |http://www.freecodecamp.com/flopywood
@qq1009479218
Replace
<div class="col-xs-8 col-sm-8">
<input type="text" class="form-control dm-content" placeholder="说点什么吧!" />
</div>
<div class="col-sm-2 col-xs-2">
<button class="btn btn-primary btn-block dm-launch">发射弹幕</button>
</div>
<div class="col-sm-2 col-xs-2">
<button class="btn btn-primary btn-block dm-remove">清除弹幕</button>
</div>
with
<div class="row">
<div class="col-xs-8 col-sm-8 col-md-offset-2">
<input type="text" class="form-control dm-content" placeholder="说点什么吧!" />
</div>
</div>
<div class="row">
<div class="col-sm-2 col-xs-2 col-md-offset-4">
<button class="btn btn-primary btn-block dm-launch">发射弹幕</button>
</div>
<div class="col-sm-2 col-xs-2">
<button class="btn btn-primary btn-block dm-remove">清除弹幕</button>
</div>
</div>
@IMLaing
#alertBox{
display:none;
z-index:10;
opacity:0.9;
position:fixed;
top:29%;
left:36%;
width:320px;
height:260px;
background-color:grey;
color:black;
border:2px solid black;
border-radius:4px;
}
.alertBoxShow{
display:block;
}
This is the class i add
function alertUWin(){
$("#alertBox").toggleClass("alertBoxShow").text("You Win!");
};
this is how I add it.. Its not working though?
123xylem sends brownie points to @imlaing :sparkles: :thumbsup: :sparkles:
:warning: 123xylem already gave imlaing points
<div id="alertBox">
<button id="Ok" onclick="end()">OK!</button>
</div>
ahmed-ayman sends brownie points to @dhcodes and @imlaing :sparkles: :thumbsup: :sparkles:
:cookie: 330 | @imlaing |http://www.freecodecamp.com/imlaing
:star2: 1396 | @dhcodes |http://www.freecodecamp.com/dhcodes
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Mohammad Hasham - Web Developer</title>
</head>
<body>
<nav class = "navbar navbar-default">
<div class = "container" style="color:blue;">
<a class = "navbar-brand" href="#">Portfolio</a>
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href="#"> Home </a></li>
<li><a href="#">Skills</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact </a></li>
</ul>
</div>
</nav>
</body>
</html>
$('.showResults').append('<div class="wikiInfo"><a href=" '+ response[3][i] +' "><h2>'+response[1][i]+'</h2><p>' + response[2][i] + '</p></a></div>');
<link rel="stylesheet" type="text/css" href="style.css">
mohammadhasham sends brownie points to @imlaing :sparkles: :thumbsup: :sparkles:
:cookie: 331 | @imlaing |http://www.freecodecamp.com/imlaing
iframes
responsive using bootstrap, here is a link to my code pen
<body>
<div class = "container">
<div class = "home">
<nav class = "navbar navbar">
<a class = "navbar-brand" href="#">Portfolio</a>
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href="#"> Home </a></li>
<li><a href="#">Skills</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact </a></li>
</ul>
</div>
</nav>
</div>
</body>
.home
{
background-image: url("home_bck.jpg");
background-size:cover;
}
<div class = "container">
<div class = "home">
<nav class = "navbar navbar">
<a class = "navbar-brand" href="#">Portfolio</a>
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href="#"> Home </a></li>
<li><a href="#">Skills</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact </a></li>
</ul>
</nav>
</div>
</div>
@IMLaing
<div class = "container">
<div class = "home">
<nav class = "navbar navbar">
<a class = "navbar-brand" href="#">Portfolio</a>
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href="#"> Home </a></li>
<li><a href="#">Skills</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact </a></li>
</ul>
</nav>
</div>
</div>
klausmana sends brownie points to @imlaing :sparkles: :thumbsup: :sparkles:
:cookie: 332 | @imlaing |http://www.freecodecamp.com/imlaing
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
<title>Mohammad Hasham - Web Developer</title>
</head>
<body>
<div class = "container">
<div class = "home">
<nav class = "navbar navbar">
<a class = "navbar-brand" href="#">Portfolio</a>
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href="#"> Home </a></li>
<li><a href="#">Skills</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact </a></li>
</ul>
</nav>
</div>
</div>
</body>
</body>
</html>
Hey guys, How do I set this up in my own page?
But that would be for all the tabs i.e: about me ,contact us etc. is there a way that i can limit it to the home tab only?
mohammadhasham sends brownie points to @imlaing :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave imlaing points
.icon img {
height: 100px;
}
sanjayatgit sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 801 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
sanjayatgit sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: sanjayatgit already gave tylermoeller points
<i class="wi wi-cloudy"></i>
. The main .css file is at: https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.min.css, others are listed here: https://cdnjs.com/libraries/weather-icons
sanjayatgit sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: sanjayatgit already gave tylermoeller points
flopywood sends brownie points to @klausmana :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @klausmana |http://www.freecodecamp.com/klausmana
klausmana sends brownie points to @flopywood :sparkles: :thumbsup: :sparkles:
:cookie: 321 | @flopywood |http://www.freecodecamp.com/flopywood
flopywood sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 802 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
<img class="img-responsive" src="naruto.jpg" >
http://
in front of your API URL: var weatherAPI = "http://api.openweathermap.org.....
gh-pages
branch on that repo so we can inspect it more easily. This will allow you to view the page at: https://BeerDRinker.github.io/Wikipedia-Viewer
andrewdylan sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 803 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
traybanks sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 804 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
flopywood sends brownie points to @babuharry :sparkles: :thumbsup: :sparkles:
:cookie: 78 | @babuharry |http://www.freecodecamp.com/babuharry
function titleCase(str) {
var lowerCaseSplit = str.toLowerCase().split(" ");
var newArrayUppercased = [];
for (i = 0; i < lowerCaseSplit.length; i ++) {
newArrayUppercased = (lowerCaseSplit[0].charAt(0).toUpperCase());
}
return newArrayUppercased;
}
@aszwet1
hey all, how are things going?
I was wondering if someone could take a look at this and see if it will meet the criteria for the portolio project. https://codepen.io/swetz/pen/yaymBa
I know there isn't any real info in there, but I think the project definitely served it's purpose....
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 805 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
function titleCase(str) {
var lowerCaseSplit = str.toLowerCase().split(" ");
var newArrayUppercased = [];
for (i = 0; i < lowerCaseSplit.length; i ++) {
newArrayUppercased = (lowerCaseSplit[0].charAt(0).toUpperCase());
}
console.log(newArrayUppercased);
return newArrayUppercased;
}
<div id="article">
function titleCase(str) {
var lowerCaseString = str.toLocaleLowerCase();
var lowerCaseArray = lowerCaseString.split(' ');
var finalArray = [];
lowerCaseArray.forEach(function (word) {
var tempStr = word[0].toUpperCase();
for (var i = 1; i < word.length; i++) {
str += word[i];
}
finalArray.push(str);
});
return finalArray.join(' ');
}
function titleCase(str) {
var lowerCaseString = str.toLowerCase();
var lowerCaseArray = lowerCaseString.split(' ');
var finalArray = [];
lowerCaseArray.forEach(function(word) {
var str = word[0].toUpperCase();
for (var i = 1; i < word.length; i++) {
str += word[i];
}
finalArray.push(str);
});
return finalArray.join(' ');
}
gbsimon87 sends brownie points to @adithyakreddy :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @adithyakreddy |http://www.freecodecamp.com/adithyakreddy
beerdrinker sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 806 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
mohammadhasham sends brownie points to @adithyakreddy :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @adithyakreddy |http://www.freecodecamp.com/adithyakreddy
aszwet1 sends brownie points to @adithyakreddy :sparkles: :thumbsup: :sparkles:
:cookie: 300 | @adithyakreddy |http://www.freecodecamp.com/adithyakreddy
width:38em;
height:25em;
border:5px solid white;
padding: 10em;
margin:5em;
will these margins effect the responsiveness of my page! actually i have made a rectangle box
width:38em;
height:25em;
border:5px solid white;
padding: 10em;
margin:5em;
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 807 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
mohammadhasham sends brownie points to @adithyakreddy :sparkles: :thumbsup: :sparkles:
:cookie: 301 | @adithyakreddy |http://www.freecodecamp.com/adithyakreddy
konikodes sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 687 | @sorinr |http://www.freecodecamp.com/sorinr
mesmoiron sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1645 | @khaduch |http://www.freecodecamp.com/khaduch
$( document ).ready(function() {
$.ajax ({url : "http://ip-api.com/json"
}).done(function(data) {
Weather(data.lat,data.lon);
}).fail(function(err) {
console.log(err);
});
});
function Weather(latitude , longtitude){
console.log(latitude, longtitude);
var apiKey = "fffc77f90fb489748fe36ae1b79ac8b5";
$.ajax ({
dataType : "json",
url : "http://api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longtitude + "&APPID=" + apiKey,
type : "GET"
}).done(function(json){
console.log(json);
var currentWeather = json.weather[0].description;
var timeGet = new Date();
var time = timeGet.getTime();
var sunrise = json.sys.sunrise;
var sunset = json.sys.sunset;
var ico;
if(currentWeather = "clear sky"){
if(time > sunset || time < sunrise){
var ico = "https://s21.postimg.org/mq89fighf/Clear_Sky_Night.png";
document.getElementById("testimg").setAttribute("src" , ico);
}else{
var ico = "https://s21.postimg.org/z3l3mf65v/Clear_Sky_Day.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
}
if(currentWeather = "few clouds"){
if(time > sunset || time < sunrise){
var ico = "https://s21.postimg.org/aqwr87awj/Few_Clouds_Night.png";
document.getElementById("testimg").setAttribute("src" , ico);
}else{
var ico = "https://s21.postimg.org/lp80qdzhv/Few_Clouds_Day.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
}
if(currentWeather = "scattered clouds"){
var ico = "https://s21.postimg.org/44a3f0t83/Scattered_Clouds.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "broken clouds"){
var ico = "https://s21.postimg.org/44a3f0t83/Scattered_Clouds.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "shower rain"){
var ico = "https://s21.postimg.org/efmg7okxf/Shower_Rain.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "rain"){
var ico = "https://s21.postimg.org/4sixxyrxv/Rain.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "thunderstorm"){
var ico = "https://s21.postimg.org/ofhcnkw6r/Thunderstorm.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "snow"){
var ico = "https://s21.postimg.org/khu2y69df/Snow.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
if(currentWeather = "mist"){
var ico = "https://s21.postimg.org/xtna7dcdv/Mist.png";
document.getElementById("testimg").setAttribute("src" , ico);
}
});
}
if else
klausmana sends brownie points to @drurenia :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @drurenia |http://www.freecodecamp.com/drurenia
else if
s instead of if
s all over the place
You could make everything cleaner by using an array to store your ico links and access them using the currentWeather as the key. By doing so you wouldn't need this whole bunch of ifs. You would access and use them like this:
document.getElementById("testimg").setAttribute("src" , links[currentWeather]);
Hey need help with the twitchtv API. I'm trying to get my data into an underscored list.
$("#online").append("<li>" game + logo + views + url "</li>");
using this gives me an error: unexpected identifier.
here's the codepen
tyl-er sends brownie points to @sorinr and @pawelrus91 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for pawelrus91
:cookie: 688 | @sorinr |http://www.freecodecamp.com/sorinr
var $newdiv1 = $( "<div id='object1'></div>" ),
newdiv2 = document.createElement( "div" ),
existingdiv1 = document.getElementById( "foo" );
$( "body" ).append( $newdiv1, [ newdiv2, existingdiv1 ] );
<script>
$(document).ready(function() {
$("button").addClass("animated bounce");
$(".well").addClass("animated shake");
});
</script>
var iconSrc = 'http://openweathermap.org/img/w/' + data.weather[0].icon + '.png';
marcandre311 sends brownie points to @lpy1994 :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @lpy1994 |http://www.freecodecamp.com/lpy1994
<div id="weather-icon"></div>
and then do: var iconSrc = 'http://openweathermap.org/img/w/' + data.weather[0].icon + '.png';
$("#weather-icon").html('<img src="' + iconSrc + '">')
lpy1994 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 810 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
$("#fahrenheit-btn").on("click", function() {
nickeyvee sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1646 | @khaduch |http://www.freecodecamp.com/khaduch
gitpyexp sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 356 | @jluboff |http://www.freecodecamp.com/jluboff
Hey guys and gals! I have a quick, not-project-related question:
I'm just starting the JavaScript portion of the Front-End track and would like to play around with it outside of FCC. I was wondering if there is an IDE (preferably free) that I could download that works with user input such as "prompt()" and popups like "alert()"? I'm currently using Sublime Text 3 and it doesn't support it/it's not working for me. I've also been using the browser console, but would really like to start using IDEs more.
Thanks in advance!
@NettyBetty That's interesting. Are you building the prompts or alerts into a website? To answer your question though really depends on what you want to do. I use Brackets for front-end and it supports a lot of languages. If you want to be more Java heavy I know a lot of people like NetBeans, IntelliJ, and Android Studio
https://blog.idrsolutions.com/2015/03/the-top-11-free-ide-for-java-coding-development-programming/
Thanks for the suggestions, @coymeetsworld ! I'll be sure to check them out.
@unscodst Right now, I'm just trying to practice what I've been learning. I'm not building websites just yet. :) I'm going to give the IDEs you mentioned a try and thanks for the link!
:star2: 1360 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
nettybetty sends brownie points to @coymeetsworld and @unscodst :sparkles: :thumbsup: :sparkles:
:cookie: 26 | @unscodst |http://www.freecodecamp.com/unscodst
https://github.com/phumberdroz/pizzastore/blob/master/client/modules/Product/Product.js
https://github.com/phumberdroz/pizzastore/blob/master/client/modules/Product/components/CreateWidget/CreateWidget.js
If i add a product it does not fetchCategories any more and does not save them to the state …
If there is no product in state categories are in the state
users[i]
is displayed as "undefined" instead of the actual array element?@Harry97 This is an asynch issue. for loops are fast, so you don't want to call functions or APIs inside of them. Use a forEach with a callback instead.
users.forEach(function(user, i) {
^^ replace your for loop with that and then add a closing parenthesis )
at the end of your function
harry97 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 812 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
@jrandallhansen Your error will always fire because it isn't in a function to capture error messages. Try this instead:
error: function(err) {
alert("Error ", err)
},
To fix your API call, use dataType: "jsonp":
$.ajax({
type: "GET",
url: apiUrl,
async: false,
dataType: "jsonp",
.......