Search the Community

I'm having some trouble accessing a prop from within the History page I'm making using React. In App.js I'm passing user as a prop. <Route exact path="/history" render={(props) => ( <History user={user}/> )} /> user is returned during componentDidMount: componentDidMount() { const user = AuthService.getCurrentUser(); if (user) { this.setState({ user: user }); The interesting fact is that I have another component before History : <HeaderBar user={user}/> And within the HeadBar component, it's able to access the user prop without any problems. However, in History, when I log this.props.user in the constructor, I'm constantly getting undefined. I made sure I have super(props) in the constructor so I'm at a lost right now. What could I be missing that's preventing me from passing the user prop? So right now in History I have: class History extends React.Component { constructor(props) { super(props); console.log(this.props.user) If I add a button within render that logs this exact item, it logs it perfectly. The problem is that I need to use this user information to fetch whatever is going to be rendered on the page.

On iOS 12, using Siri shortcuts and Scriptable, to my understanding, it’s now possible to execute JavaScript code anywhere in iOS. To do so create a script in Scriptable, add it to a shortcut in Shortcuts and you should be able to execute it from the share menu and Siri voice command. Arbitrary code execution is something iOS tried to avoid for a long time and now it’s here intentionally. Do you think it will be able to be misused? Or will it be good?

After spending time in a javascript framework, I realized I've gone through many phases in web development. I wanted to share these steps to see if others can relate or differ, and also figure out what the next step to this puzzle is. 1) Learn HTML and CSS 2) Learn that GUI wizards are trash 3) Learn JavaScript and Jquery 4) Learn JavaScript with TypeScript Framework and pretend you didn't do the other stuff before this

Hi guys, I am trying to find a tool or browser add on that will show me all of the javascript that is run when I load a web page (obfuscated or not) and then tell me exactly what it is doing. Specifically I am trying to find a tool that will assist me in identifying javascript snippets that are creating tracking pixels (1x1 images) and also be able to identify where these javascript snippets are being downloaded from or where the images they create are being downloaded from. Any info you guys might be able to provide is greatly appreciated, thank you in advance!

Hi. I'm trying to create a "video site template" for people who want to upload videos to their friends, or audience, but not use a 3rd party website. I've managed to make a system that is pretty simple to use, and works pretty well too, but I can't embed the video on apps like Discord, Twitter, or Facebook. I actually have no idea how those apps do their embedding thing, or if it's possible for me to create my own interface for them. Can someone who is more knowledgeable help me out? I'll show off what I got so far. It's at http://jackomail.com/videos/videotest/ If giving that link is frowned upon at all please let me know and I will remove it. For those wondering I've been into programming for around 10 years, and I'm trying to do this project because I'm getting a little sick of how YouTube does things. I want a place where I can manage my own uploads, and handle my own DMCAs if need be. I also want other people to start doing this so someday maybe I can stop using YouTube to watch things too.

Hey guys. So... im in a bit of a pickle so to say. I work in a big brand computer company in the Balkan's and safe to say i have had enough of working with people (the MOST draining job anyone can work is with people), and now im seriously thinking of going into web development. I have fiddled around with HTML and CSS and i have found that its fun for me. Im giving a final push to go through one more year of working with people so i can get together enough money to go to a one year university in my country that specializes in coding, graphics design, web and so on to change my profession (they have a great program and i know people that have been involved in the academy that now have high paying jobs ). Now im thinking about web design vs development... I enjoy designing web designs and writing the starting code for it, and hence my question. Is it better to go into what i enjoy or go into development which ive heard is a lot harder but pays better... Any vet's with experience wanna weigh in ?

I need help to make the original javascript from youareanidiot.org going to work, I hope someone can help me with this.

I am programming a discord bot in nodejs and need the quick.db package. When I try to install, I get this: C:\Users\Илья\Desktop\Jyxo\Bot\node_modules\integer>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild ) else (node "C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild ) gyp ERR! configure error gyp ERR! stack Error: spawn C:\Users\����\.windows-build-tools\python27\python.exe ENOENT gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:231:19) gyp ERR! stack at onErrorNT (internal/child_process.js:406:16) gyp ERR! stack at process._tickCallback (internal/process/next_tick.js:63:19) gyp ERR! System Windows_NT 10.0.17134 gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" gyp ERR! cwd C:\Users\Илья\Desktop\Jyxo\Bot\node_modules\integer gyp ERR! node -v v10.9.0 gyp ERR! node-gyp -v v3.7.0 gyp ERR! not ok npm WARN discord.js@11.4.2 requires a peer of bufferutil@^3.0.3 but none is installed. You must install peer dependencies yourself. npm WARN discord.js@11.4.2 requires a peer of erlpack@discordapp/erlpack but none is installed. You must install peer dependencies yourself. npm WARN discord.js@11.4.2 requires a peer of node-opus@^0.2.7 but none is installed. You must install peer dependencies yourself. npm WARN discord.js@11.4.2 requires a peer of sodium@^2.0.3 but none is installed. You must install peer dependencies yourself. npm WARN discord.js@11.4.2 requires a peer of libsodium-wrappers@^0.7.3 but none is installed. You must install peer dependencies yourself. npm WARN discord.js@11.4.2 requires a peer of uws@^9.14.0 but none is installed. You must install peer dependencies yourself. npm WARN jyxobot@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! integer@1.0.5 install: `node-gyp rebuild` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the integer@1.0.5 install script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Илья\AppData\Roaming\npm-cache\_logs\2018-08-21T16_16_21_231Z-debug.log

Would someone explain to me what is the difference between let and var in this situation as I don't quite understand the exact difference between let and var ? The only statement that I kinda understand is this : var Declares a variable, optionally initializing it to a value. let Declares a block-scoped, local variable, optionally initializing it to a value. From the statement above let does make local variable but in the code below let y = 5; in a local scope is not defined ??? The situation is : if (true) { var x = 5; } console.log(x); // x is 5 ------------------------------ if (true) { let y = 5; } console.log(y); // ReferenceError: y is not defined

I am programming a discord bot in nodejs and need the quick.db package for a message leveling system. When I try to install, I get this: I'm not sure what it wants from me other than something to do with installing python. I'm not very experienced with this so any help would be greatly appreciated!

Hi know this is not the right place to ask this but i need help on this html css project i want to obtain results like this on my website http://tastybistro.com/menus/ with inpage navigation bar adn different sections , any time tutorial link or hint will help me , i tried searching but couldn't find anything in html or css solution . i want a solution in html and css only.

Hello, I have this odd issue On this link you can see it in action https://i.gyazo.com/87720508205b70970c09aa630500ee5a.mp4 You see that the button is dragged to the side on load, this does not happen on my production site. they are "identical". How can I find out what is happening on my local one that's not happening on the prod one? There are no errors or anything, so I'm going in blind on this.

I am learning React.js and am trying to start my own project and had a few questions. How should multiple pages be controlled? What should the folder structure look like? What are some best practices for react development? Do I have to make 2 projects if I want a web app and an apk?

Hey guys, So I am trying to do the following: assign a "default" value to a javascript variable, then change that value, and to then again be able to change the variable, <script> function functie1(x) { var z = "jasonr"; var x = prompt("Which chat do you want to see?", "Shroud"); if (x == "") { window.alert("You canceled."); location.reload(); } else { window.alert("You chose " + x ); document.getElementById( z ).src = "https://www.twitch.tv/" + x + "/chat?popout="; document.getElementById( z ).id = x; }} document.getElementById("clickMe").onclick = functie1; function functie2(y) { var k = "lirik"; var y = prompt("Which chat do you want to see?", "lirik"); if (y == "") { window.alert("You canceled."); location.reload(); } else { window.alert("You chose " + y) document.getElementById( k ).src = "https://www.twitch.tv/" + y + "/chat?popout="; document.getElementById( k ).id = y; }} document.getElementById("clickMe2").onclick = functie2; var y = k; var x = z; </script> this is my script, I am altering Iframe elements with it, what I want to achieveis that I can alter the elements multiple times where I can only do that once at this moment. I think it has something to do with that there is no element left that goes byid = z after it has been altered once, so now I thought I had to change the value of z into x after the function ran, but I cant get it to work. Can someone tell me what's what with the variable scopes or how I can assign the new values to it, I've looked all over but I am not getting wiser at all. Thanks in advance! Bob

I feel like this is a really basic thing but yet I have to ask with limited knowledge on Javascript/Vue I have a form where you can add dynamic fields with Vue.js and it submits just fine, makes a nice array validations goes great and all. But now when something goes wrong, and not specially in that field there is a bit of an issue in my mind with putting the "old" data back by the old() function. Let me first start with showing you what I got. create.blade.php <div class="col-md-6"> <div class="section"> <label for="age">Password</label> <a v-on:click="addPasswordField"> <span class="panel-title glyphicon glyphicon-plus" aria-hidden="true"></span> </a> <a v-on:click="deletePasswordField" v-if="password_fields.length > 0"> <span class="panel-title glyphicon glyphicon-remove" aria-hidden="true"></span> </a> <div class="password row" v-for="(field, index) in password_fields"> <input type="text" class="form-control" :name="'task[passwords][' + index + '][password]'" v-bind:value='field.password'> <input type="text" class="form-control" :name="'task[passwords][' + index + '][description]'" v-bind:value='field.description'> <input type="text" class="form-control" :name="'task[passwords][' + index + '][login]'" v-bind:value='field.login'> </div> </div> </div> App.js var createTask = new Vue({ el: '#createTask', data: { password_fields: [], }, methods: { addPasswordField() { this.password_fields.push({ password: '', description: '', login: '' }) }, deletePasswordField(index) { this.password_fields.splice(index,1) }, }, }); Now for every add it just adds empty fields. Now my goal is when there is old data to pass it to vue, so I can make a method what fills the "password_fields" array with the old data. Perhaps you guys can help me find a clean way.

I've been practicing a lot of html and javascript recently, and I came across this challenge question. I can't for the life of me figure out why it works and I feel like the answer is very simple. Here it is: What is the output of this code: <html> <head> <title>Test</title> </head> <body> <script type="text/javascript"> var arr = [1,2,3,4]; arr[arr[1]]=5; alert(arr); </script> </body> </html> The answer is 1,2,5,4 but I can't figure out why. arr[1] is the second spot in the array, so the output should be 1,5,3,4 but its not. Does anybody know how this works? It's been bugging me for hours. Thanks!

Hello, I am making a website that allows you to watch different Twitch chats at the same time by using the Twitch chat iframe which, at the moment I am trying to alter iframe elements using Javascript but I cant get it to work. <html> <head> <title>Dual Twitch chat overview</title> <link rel="stylesheet" type="text/css" href="clean.css"> </head> <body> <div id="navbar"> <ul> <li style="float:left"><a href="xo.html">Home</a></li> <li><a href="dualchat.html">Dual Chat</a></li> <li><a href="vierchat.html">Quadrupple chat</a></li> <li><a href="achtchat.html">Dual Quadrupple chat</a></li> <li><a href="prayforfns.html">#PrayforFNS</a></li> <li style="float:right"><a href="twitch.com">About</a></li> </ul> </div> <button id="clickMe">Choose</button> <button id="clickMe2">Choose</button> <script> document.getElementById("clickMe").onclick = functie1; function functie1() { var x = prompt("Which chat do you want to see?", "Shroud"); window.alert( x ); document.getElementById("lirik").src = x; document.getElementById("lirik").id = x; } document.getElementById("clickMe2").onclick = functie2; function functie2() { var y = prompt("Which chat do you want to see?", "Shroud"); window.alert( y ); document.getElementById("shroud").src = y; document.getElementById("shroud").id = y; } </script> <div id="chatlinks"> <iframe frameborder="0px" scrolling="yes" id="lirik" src="https://www.twitch.tv/lirik/chat?popout=" id="source" height="100%" width="100%"> </iframe> </div> <div id="chatrechts"> <iframe frameborder="0px" scrolling="yes" id="shroud" src="https://www.twitch.tv/shroud/chat?popout=" id="source" height="100%" width="100%"> </iframe> </div> </body> </html> I get the prompt and afterwards the popup with the variable but the iframes stay the same. Could anyone tell me what's wrong with the code? Thank you in advance! Bobster345589

Hi, I've been learning a lot of javascript recently and I began programming a script that would emulate how your starting stats are rolled in Dungeons and Dragons. I've never actually played d&d, but from what my roommates were telling me, your starting stats are acquired by rolling a 6 sided dice 4 times (or rolling 4 six side dice all at once) and then taking the highest three numbers and adding them up together. I programmed that like this: function diceRoll(min, max) { return Math.floor(Math.random() * (max - min + 1) + min); } var rollSet1 = new Array(); rollSet1[0] = diceRoll(1, 6); rollSet1[1] = diceRoll(1, 6); rollSet1[2] = diceRoll(1, 6); rollSet1[3] = diceRoll(1, 6); This simulated rolling the 4 dice. var set1Smol = (Math.min(...rollSet1)); This set the variable: "set1Smol" equal to the smallest number out of the 4 numbers in the array. var stat1 = (rollSet1[0] + rollSet1[1] + rollSet1[2] + rollSet1[3] - set1Smol); And this set the variable: "stat1" equal to the sum of all 4 numbers in the array - the smallest number in the array. I did this for each of the 7 rollSets and put the "stat(x)" variables into a separate array, and then used the Math.min operator to find the smallest number out of all 7 stats. var totalSetSum = new Array(); totalSetSum[0] = stat1; totalSetSum[1] = stat2; totalSetSum[2] = stat3; totalSetSum[3] = stat4; totalSetSum[4] = stat5; totalSetSum[5] = stat6; totalSetSum[6] = stat7; var lowestStat = (Math.min(...totalSetSum)); Now the one thing I couldn't figure out was how to get rid of the smallest number in the totalSetSum array. Right now I have it just printing all 7 stats and then telling you which one is the smallest, but what I would like to do is create a character stat object with 6 properties that are equal to the 6 highest out of the 7 stats. Does anybody know how I would go about programming that? Any help would be appreciated! Thanks! Here is a link to my github where I have the full javascript program located.

I had a website that was run on weebly, but apparently my plan got canceled, and now it looks like this. www.blackunlimited.tech . I personally hate the "Made on Weebly" shit at the bottom, so I decided I would learn to code my own website. I already have the Adobe package, and I'm using dreamweaver. I know the basics, but I want to learn how to really personalize and theme my site. Thanks in advance.

So I am trying to make a website, here is the code: <!DOCTYPE html> <html> <meta charset="utf-8"> <title class=".title">Photography By Emily</title> <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="css/theme.css" rel="stylesheet"> <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700,400italic,700italic" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css"> <header class="intro"> <div class="intro-body"> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <h1 class="brand-heading">Gallery</h1> <p class="intro-text">By Emily</p> <a href="#about" class="btn btn-circle page-scroll"><i class="fa fa-angle-double-down animated"></i></a></div> </div> </div> </div> </header> <body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top"> <nav class="navbar navbar-custom navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse"> <i class="fa fa-bars"></i> </button> <a class="navbar-brand page-scroll" href="index.html">Emie Ashy Photography</a> </div> <div class="collapse navbar-collapse navbar-right navbar-main-collapse"> <ul class="nav navbar-nav"> <li> <a href="index.html">Home</a> </li> <li> <a href="pictures.html">Pictures</a> </li> <li> <a href="page-sample.html">Samples</a> </li> <li> <a href="contact.html">Contact</a> </li> </ul> </div> </div> </nav> <section id="portfolio"> <div class="gallery"> <div class="container content-section text-center"> <div class="row"> <h2>My Pictures</h2> </div> </div> <ul> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=1" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=2" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=3" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=4" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=5" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=6" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=7" alt=""></li> <li class="col-md-3"><img src="http://unsplash.it/680/380?random=8" alt=""></li> </ul> </div> </section> <footer> <div class="container text-center"> <p class="credits"> Copyright &copy; Your Website 2017 </p> </div> </footer> <script src="js/jquery.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/jquery.easing.min.js"></script> <script src="js/theme.js"></script> </body> </html> But I would like a drop-down so people can pick if they would like a photo in a frame or something else and a add to cart button next to it, but can seem to find out how. Does anyone know how you would do this?

So I'm making an online form in web browser with only 1 text box. I want after refresh it focuses on the textbox and makes keyboard appear. By the way it's on mobile. I'm using usual stuff, HTML5 and Javascript. Any opinion and/or solution for the problem is appreciated.

So this should be simple for you web coders out there. How do I get this code / equivalent to run in the background of the webpage without a new window opening? function strobe_submit() { window.alert("Speed: " + speed_final + " Time: " + time_final); window.open("/strobe.php?time=" + time_final + "&speed=" + speed_final, '_blank'); } SOLUTION: function strobe_submit() { window.alert("Speed: " + speed_final + " Time: " + time_final); // USed for debug var xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET", "/strobe.php?time=" + time_final + "&speed=" + speed_final, true); xmlhttp.send(); } Thanks, Kie.

hello im having trouble with this project In this assignment we will be using AJAX to make requests to a free weather API called OpenWeatherMap. You will need to create a free account with OpenWeatherMap to obtain an API key in order to access their API. Once you create an account and are signed in your API key will be located under the API keys tab. Create a file named ajax.js with the following implementation of a function named ajax. This file defines a function named ajax, which we can reuse within a Web application. and that file i got here //ajax.js function ajax(url, handler) { var req = new XMLHttpRequest(); if (!req) { alert('Browser not supported.'); return; } req.onreadystatechange = function() { var resp; if (this.readyState === XMLHttpRequest.DONE) { if (this.status === 200) { resp = this.responseText; handler(resp); } else { handler('Ajax error, status: ' + this.status); } } }; req.open('GET', url); req.send(); } Next create a file named index.html with the following contents. On the line where the apiKey var is being set, make sure to replace the value "APIKEY" with your actual API key you obtained from OpenWeatherMap. and here is that index : for the api key i replace the key with no string elements just how it looks there not sure if i should put it into quotations. <!DOCTYPE html> <html> <head> <title> <!!!!YAUZA!!!!></title> <link rel="stylesheet" href="style.css" /> </head> <body onload = "showDate()"> <div class = "header"> <h1 id = "headline"> CSE DOM Javascript</h> <p> Miguel </p> <button id = "btn"> Add New Item </button> <ul id = "list"> <li>one</li> <li>two</li> <li>three</li> <li>four</li> </ul> <script src = "javatut1.js"> </script> </div> <div id="container" /> <script src="ajax.js"></script> <script src="parse-response.js"></script> <script> /* global ajax */ /* global parseResponse */ var container = document.getElementById('container'); var url = "http://api.openweathermap.org/data/2.5/weather?q="; var city = "San Bernardino"; var apiKey = 5b9dc5cd; // Replace "APIKEY" with your own API key; otherwise, your HTTP request will not work url += city + "&appid=" + apiKey; ajax(url, function(resp) { resp = parseResponse(resp); container.appendChild(document.createTextNode(resp)); }); </script> </body> </html> Start the Apache Web server with apache2 -k start command. Get your url with echo $C9_HOSTNAME and paste it in a new tab in your web browser. Click on your A10 folder and you should see your Web page displaying a JSON string containing weather data for San Bernardino. The next step is to parse the JSON string into an object so that we can pull out the data that we are interested in. For simplicity, in this exercises we are only going to use the data pertaining to the city, country, temperature, and weather condition. Create a file called parse-response.js with the following content: here is the parese file function parseResponse(responseText) { var response = JSON.parse(responseText); var condition = response.weather[0].main; var city = response.name; var country = response.sys.country; var degK = response.main.temp; //temperature data is in Kelvin var degF = 1.8*(degK - 273) + 32; //Converting Kelvin to Fahrenheit. degF = Math.floor(degF); //removing decimals var weatherBox = document.getElementById("weather"); response = city + ", " + country + " " + degF + "\u{00B0}" +" F " + condition; return response; } I dont know why this next step wants it bold Add the following lines in bold to index.html and save your work. <div id="container" /> <script src="ajax.js"></script> <script src="parse-response.js"></script> <script> /* global ajax */ /* global parseResponse */ var container = document.getElementById('container'); var url = "http://api.openweathermap.org/data/2.5/weather?q="; var city = "San Bernardino"; var apiKey = "APIKEY"; // Replace "APIKEY" with your own API key; otherwise, your HTTP request will not work url += city + "&appid=" + apiKey; ajax(url, function(resp) { resp = parseResponse(resp); container.appendChild(document.createTextNode(resp)); }); </script> Refresh your Web page and you should see the city, country, temperature, and weather condition displayed. Modify index.html to contain a text box for the user to type in a city and a submit button. When the user types a city into the textbox and then clicks the submit button, the page should update with new weather information for that city. The old city weather information should be completely replaced with the new city weather information(I should not see multiple cities being displayed each time I click submit). You'll need to define a function that handles click events generated by the submit button. To intercept the click event, you need to add a onclick attribute to the submit button and set it to the click event handler function. Your event handler function should contain the code that calls the ajax function and should use the city that the user entered instead of "San Bernardino" for the OpenWeatherMap API url.

Hey guys, I was hoping to somehow implement a 10x10 table onto my webpage where you select a cell and then store the X and Y value of the cell clicked but I'm really not sure on how to store the values, or to make the cell interactive (clickable) without having 100 buttons. My end goal is pretty much something like this: http://materdeimath.pbworks.com/f/GraphPaper20x20AxesUnits.bmp Where I can store the X/Y values of the clicked cell, is this possible? If any of you guys have any idea how I would accomplish this I would really appreciate the help, Thanks!

I need to make a game using jQuery, but I'm not sure where to start. I was hoping to get some ideas from here, then try to see if I can implement something. I need to be able to create it within a day or so, so a simple game if possible, lol. Some requirements are that it needs an avatar (or something to identify player) that the player can move, score, enemies with "randomness" to their movement/actions. projectiles and/or animation effects that contribute to function of game, and end screen. Thanks for any ideas you can provide!