Tag: JavaScript

Calcular subtotal e total com javascript

Olá, gostaria de saber como faço para a quantidade de items na linha tabela seja multiplicado pelo valor unitário da mesma linha formando um sub-total para ser totalizado no final. No meu código, até então só consegui calcular o valor total apenas somando sem passar pelas unidades a serem multiplicadas pelo valor unitário.

var atualizaCarrinho = function(){     var carrinhos = $  ('.carrinho');     carrinhos.each(function(){         var carrinhoAtual = $  (this);         var valorItem = carrinhoAtual.find('.item-total:visible');         var valorTotal = carrinhoAtual.find('.valorTotal');         var qtdTotal = carrinhoAtual.find('.qtdProdutos');         var resultado = 0;          valorItem.each(function(){             var tdAtual = $  (this);             var pegaValor = parseFloat(tdAtual.text());             resultado = parseFloat(resultado + pegaValor);         });          valorTotal.text(resultado);         qtdTotal.text(valorItem.length);     }); }; atualizaCarrinho();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="carrinho"> 		<h2>Carrinho entrega em Santa Catarina</h2> 		<table border=1> 			<thead> 				<tr> 					<td>Nome</td> 					<td>Quantidade</td> 					<td>Valor Unitário</td> 					<td>SubTotal</td> 				</tr> 			</thead> 			<tbody> 				<tr> 					<td>Tablet miPad 18</td> 					<td class="qtd_item">6</td> 					<td>499.0</td> 					<td class="item-total">499.0</td> 				</tr> 				<tr> 					<td>Tablet miPad 19</td> 					<td class="qtd_item">1</td> 					<td>599.0</td> 					<td class="item-total">599.0</td> 				</tr> 			</tbody> 		</table> 		<div><strong>Valor total: </strong> R$   <span class="valorTotal">0</span></div> 		<div><strong>Quantidade de Produtos: </strong> <span class="qtdProdutos">0</span></div> 	</div>

No entiendo el siguiente bucle for, javascript

Hola buenas recién acabe un ejercicio para verificar si un numero es primo o no pero no acabo de entender del todo la solución ya que este bucle no comprendo bien su significado. Adjunto todo el código y lo que no comprendo es la parte que esta en el else. Saludos.

<!DOCTYPE html> <html>     <head>         <title></title>         <meta charset="UTF-8">         <style type="text/css">         </style>     </head>     <body>         <script>             var numero = parseInt(prompt('Introduzca el numero que desea analizar si es primo o no: '));             function test_Primo(numero) {                 if (numero==1){                     return  false;                 } else if(numero == 2){                     return  true;                 }                 else{                     for (var x=2; x<numero; x++){                         if(numero%x == 0) {                             return  false;                         }                     }                     return  true;                   }             }             if(test_Primo(numero)==true) {                 alert('El numero ' + numero + ' es primo');             }               if(test_Primo(numero)==false) {                 alert('El numero ' + numero + ' no es primo');             }          </script>     </body> </html>

How to move (rename) a file with the URL using JavaScript

I am using SharePoint Office 365. I have tried to extrapolate how to do this from many other sources but I am stuck. I have the URL of a file (happens to be a OneNote Notebook) and I want to move the file to a new name.

This is my last iteration of my code. We already have the context in code above this segment

var onenote_file = target_person_folder + '/RenameMe';     var File = context.get_web().getFileByServerRelativeUrl(onenote_file);                     context.load(File);                     console.log(File);                     var onenote_file_target_name = target_person_folder + '/' + first_name + ' ' + last_name;                     console.log(onenote_file_target_name);                     SP.File.moveTo(context, onenote_file,onenote_file_target_name, 1);                     context.executeQueryAsync(                         function (sender, args) {                             console('We renamed the file. YAY! ')                         },                         function (sender, args) {                             console('BOO!, We did not move the file. .')                         });

I think I am close but I would appreciate the help getting the rest of the way there.

Thanks!

DJango API with JavaScript Frontend

Friends:

I am building a DJango Web Application (My first in DJango) where the backend is REST API and the front end is HTML/JS.

Basically, I have 2 questions.

  1. Can I keep both front end programs (in www folder) and the DJango API programs in the same server?

  2. I’m making the API calls from JS files through http: requests. Is this the correct approach?

Appreciate the help here.

Thanks Amsa

Sharepoint javascript object model, access denied error

I’m using JavaScript object model to retrieve data from a list located a root site.

My code is as below:

var clientContext;                     SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function () {                         clientContext = SP.ClientContext.get_current();                     });                      //var clientContext = SP.ClientContext.get_current();                     if (clientContext != undefined && clientContext != null) {                         var context = new SP.ClientContext.get_current();                         this.web<%=SerialNum%> = clientContext.get_site().get_rootWeb();                         var list = this.web<%=SerialNum%>.get_lists().getByTitle('<%=SubCategoryListName%>');                         var query = '<View Scope=\'RecursiveAll\'>' +                         '<Query>' +                             '<Where>' +                                '<Eq>' +                                 '<FieldRef Name=\'' + '<%=SubCategoryListParentCategoryColoumnName%>' + '\' LookupId=\'TRUE\'/>' +                                 '<Value Type=\'Lookup\'>' + chosenoption.value + '</Value>' +                                                     '</Eq>' +                                                 '</Where>' +                                         '</Query>' +                                             '</View>';                         var camlQuery = new SP.CamlQuery();                         camlQuery.set_viewXml(query);                         this.productcollection<%=SerialNum%> = list.getItems(camlQuery);                          context.load(this.productcollection<%=SerialNum%>);                         context.executeQueryAsync(Function.createDelegate(this, processProyects<%=SerialNum%>), Function.createDelegate(this, javascriptSPerror<%=SerialNum%>));

The problem is when I call this code from a page on the root site it works perfectly fine, but when I run it on a page located on a subsite I get the following error:

“Access denied, you don’t have the permission to perform this action”.

Any help is greatly appreciated.

Obtener el ultimo elemento de un array javascript

quiero obtener el ultimo elemento de un array que obtiene datos de una consulta a mysql, ocupo el ultimo elemento para pasarlo a un string y despues pasarle ese dato (que son unas cordenadas) a un fragmento de mapa de google maps, mi pregunta es para saber como hacer lo del array y que recomiendan para lo de google, no tengo mucha experiencia en este de ajax y js, ya probe varias cosas para lo del arreglo, porque encontre que con un array.length me podia funcionar, pero no, o talvez lo estoy haciendo mal. Aqui les dejo mi codigo.

function Cargar() { var xmlhttp = new XMLHttpRequest(); var url = "consulta.php"; xmlhttp.onreadystatechange=function() {  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {  var array = JSON.parse(xmlhttp.responseText);  var i;  var out = "<table border='1'>";        **EL ARRAY QUE QUIERO OBTENER ->** var titulo = array[a].descripcion     var a = array.lenght     document.write(titulo);       out += "</table>";  document.getElementById("resultado").innerHTML = out;  } } xmlhttp.open("GET", url, true); xmlhttp.send();  }

Journey Planner – Javascript

Here is my Javascript solution to the following problem

Given an un-ordered list of flights taken by someone compute the person’s itinerary, given a starting airport.

If none valid itinerary, return none.

If more than one journey is valid, print any valid solution.

Examples

Array: [['SFO', 'HKO'], ['YYZ', 'SFO'], ['YUL', 'YYZ'], ['HKO', 'ORD']] Starting: 'YUL' Return: ['YUL', 'YYZ', 'SFO', 'HKO', 'ORD']. 
Array: [['SFO', 'COM'], ['COM', 'YYZ']]  Starting airport 'COM' Return None 
Array: [['A', 'B'], ['A', 'C'], ['B', 'C'], ['C', 'A']]  Starting: 'A' Return ['A', 'B', 'C', 'A', 'C']

Please can someone comment on readability and efficiency of the code

Thank you

function plan_journey(place, journeys, route, itinerary){     if(journeys.length == 0){         itinerary.push(route + place)      }     let stops = []     for(i=0; i<journeys.length; i++){         if(journeys[i][0] == place){             stops.push(i)         }     }     if(stops == []){         return      }      for(var i=0; i<stops.length; i++){         let slice_index = stops[i]         let remaining_journeys = journeys.slice(0,slice_index).concat(journeys.slice(slice_index + 1))         let new_route = route + place + "-"         let next_place = journeys[stops[i]][1]         plan_journey(next_place, remaining_journeys, new_route, itinerary)      }         return itinerary }  let first_stop = "A" let journeys = [['A', 'B'], ['A', 'C'], ['B', 'C'], ['C', 'A']]  itinerary = plan_journey(first_stop, journeys, "", []) if(itinerary.length != 0){     console.log(itinerary[0]) }else{     console.log("None") }

Como pasar funcion de Javascript a Jquery

Queria pasar esta funcion a jquery para colocar las animaciones a mi acordion, utilizo los parametros para seleccionar el elemento del acordion que quiero que se abra pero me da error, sino sleeciono el elemento del array entonces si sirve pero alo darle click para que se abra un elemento se abren todo, y yo quiero que se abra solo al que le de click, el codigo funciona con javascript nativo el problema es cuando lo quiero pasar a jquery, si no se puede diganme como se pueden usar las animaciones de jquery en javascript nativo lo estado buscando pero no encuentro nada

	var	lista = document.getElementsByClassName('lista'); 	var icon = document.getElementsByClassName('fas');  	var clic = 1;  	function abrirCerrar(num){  		if(clic==1){ 			lista[num].style.height = 'auto'; 		    lista[num].style.opacity = '1'; 		    icon[num].style.transform = 'rotate(180deg)';  			clic = 0; 		}else{ 			lista[num].style.height = '0px'; 			lista[num].style.opacity = '0'; 			icon[num].style.transform = 'rotate(0deg)';  			clic = 1; 		} 	}
	*{ 		margin: 0px; 		padding: 0px; 		font-family: 'Roboto', sans-serif; 	}  		html{ 			scroll-behavior: smooth; 		}  		body{ 			background: #53CDE2; 		}  		a{ 			text-decoration: none; 		}  		ul{ 			list-style: none; 		}          header{         	background: #005792;         	display: flex;         	flex-flow: row nowrap;         	align-items: center;         	justify-content: space-between;         }  		.logo{ 			background: #fff; 		}  		.menu{ 			padding: 20px; 		}  			.menu li{ 				list-style: none; 	        	display: inline-flex; 	        }  		        .menu a{ 		        	color: #EDF9FC; 		        	font-family: 'Roboto', sans-serif; 		        	font-size: 20px; 		        	margin: 0px 20px; 		        	transition: 0.3s; 		        }  		        .menu a:hover{ 		        	opacity: 0.1; 		        }         footer{ 			background: #005792; 			text-align: center; 			width: 100%; 			padding: 20px 0px; 		}  			footer a{ 				color: #EDF9FC; 				font-size: 15px; 			}  			footer a:hover{ 				opacity: 0.5; 			}  /*______________________Inicio________________________*/  		.texto-principal{ 			display: flex; 			justify-content: center; 			align-items: center; 			flex-flow: column nowrap; 			background: url(imagenes/Pueblo_Paleta.png); 			background-position: center; 			background-attachment: contain; 			background-size: cover; 			height: 550px; 			text-align: center; 		} 			.texto-principal h1{ 				color: #EDF9FC; 				font-size: 70px; 				font-family: 'Roboto Condensed', sans-serif; 			}  			.texto-principal h3{ 				color: #EDF9FC; 				font-size: 40px; 				font-family: 'Roboto Condensed', sans-serif; 				opacity: 0.8; 			}  			.texto-principal .fas{ 				cursor: pointer; 				padding: 20px; 				font-size: 80px; 				color: #fff; 				margin: 120px 0px 0px; 			}  		.romemu{ 			width: 90%; 			display: flex; 			flex-flow: row nowrap; 			justify-content: center; 			align-items: center; 			margin: 30px auto; 			background: rgba(209, 244, 250, 0.5); 			border-radius: 2px; 		}  			#roms{ 				background: #D1F4FA; 				width: 600px; 				min-height: 450px; 				padding: 10px; 				margin: 20px; 				position: relative; 				display: flex; 				flex-flow: row wrap; 				justify-content: space-around; 				align-items: center; 				opacity: 0; 				transition: all 0.8s; 			}  			#emuladores{ 				background: #D1F4FA; 				width: 600px; 				min-height: 450px; 				padding: 10px; 				margin: 20px; 				position: relative; 				display: flex; 				flex-flow: row wrap; 				justify-content: space-around; 				align-items: center; 				opacity: 0; 				transition: all 0.8s; 			}  				.titulor, .tituloe{ 					width: 100%; 					background: #005792; 					color: #EDF9FC; 					text-align: center; 					position: absolute; 					top: 0; 					padding: 10px 0; 					font-size: 22px; 				}  				.imgr{ 					width: 65%; 					margin-top: 50px; 					padding: 20px; 					filter: drop-shadow(-12px 12px 5px #222); 					transition: all 0.5s ease; 				}  				.imgr:hover{ 					filter: drop-shadow(-5px 5px 5px #222); 					opacity: 0.85; 				}  				.imge{ 					width: 65%; 					margin-top: 50px; 					padding: 20px; 					filter: drop-shadow(12px 12px 5px #222); 					transition: all 0.5s ease; 				}  				.imge:hover{ 					filter: drop-shadow(5px 5px 5px #222); 					opacity: 0.85; 				}  					.rom, .emulador{ 						width: 20%; 						margin: 60px 5px 5px 5px; 						padding: 5px; 						display: none; 					}  					.irom{ 						width: 70%; 						position: relative; 						top: 25%; 						left: 15%; 						filter: drop-shadow(-13px 13px 5px #222); 						opacity: 0.8; 						transition: 0.5s; 					}  					.irom:hover{ 						filter: drop-shadow(-5px 5px 5px #222); 						opacity: 1; 					}  					.iemu{ 						width: 70%; 						position: relative; 						top: 25%; 						left: 15%; 						filter: drop-shadow(13px 13px 5px #222); 						opacity: 0.8; 						transition: 0.5s; 					}  					.iemu:hover{ 						filter: drop-shadow(5px 5px 5px #222); 						opacity: 1; 					}  /*____________________Roms_y_Emuladores____________________*/          .list{         	background: rgba(209, 244, 250, 0.5);         	width: 90%; 			margin: 20px auto; 			display: flex; 			flex-flow: row wrap; 			justify-content: center; 			align-items: center; 			border-radius: 5px;         }  	        .separador{ 	        	width: 100%; 	        	height: 100%; 	        	margin: 20px; 	        	border-radius: 10px; 	        }  		        .list-label{ 		        	cursor: pointer; 		        }  		        .separador h2{ 		        	color: #EDF9FC; 		        	font-size: 35px; 		        	background: #005792; 		        	margin: 0; 		        	padding: 15px; 		        	border-radius: 5px; 		        	transition: 0.3s; 		        }  		        .separador h2:hover{ 		        	opacity: 0.9; 		        }  		        .separador .fas{ 		        	color: #EDF9FC; 		        	padding: 5px; 		        	transform: rotate(360deg); 		        	transition: 0.5s; 		        }  		        .list-selector{ 		        	display: none; 		        }  			        .lista{ 			        	background: #D1F4FA; 			        	list-style: none; 			        	margin: auto; 			        	padding: 10px;                 opacity: 0;                 height: 0; 			        	overflow: hidden; 			        	text-align: center; 			        	transition: 0.75s; 			        }  				        .list li{ 				        	background: #005792; 				        	margin: 20px 10px; 				        	padding: 10px; 				        	border-radius: 5px; 				        }  					        .list a{ 					        	color: #EDF9FC; 					        	font-size: 22px; 					        	transition: 0.4s; 					        }  					        .list a:hover{ 					        	opacity: 0.3; 					        }  /*__________________________Entradas____________________________*/          .content{         	display: flex;         	flex-flow: row nowrap;         	align-items: center;         	justify-content: space-around;         	margin: 20px;         	padding: 20px;         }  	        .content_left{ 	        	display: flex; 	        	flex-flow: column wrap; 	        	align-items: center; 	        	justify-content: space-around; 	        	width: 75%; 	        	margin: 10px; 	        }  		        .content_left h1{ 		        	position: relative; 		        	text-align: center; 		        	font-size: 40px; 		        	margin: 10px; 		        	color: #EDF9FC; 		        }  		        .content_left hr{ 		        	color: #D1F4FA; 		        	width: 100%; 		        }  		        .content_left .product{ 		        	display: flex; 		        	flex-flow: row nowrap; 		        	align-items: center; 		        	justify-content: center; 		        	margin: 10px; 		        }  			        .product img{ 			        	width: 35%; 			        	margin: 10px; 			        }  			        .product table{ 			        	margin: 10px; 			           	font-size: 22px; 			        	color: #D1F4FA; 			        }  			        .info{ 			        	display: flex; 			        	flex-flow: column nowrap; 			        	align-items: center; 			        	justify-content: space-around; 			        	margin: 10px; 			        	padding: 30px; 			        }  					        #dowrom, #dowemu{ 					        	padding: 20px; 					        	margin: 17px; 					           	border-radius: 5px; 					        }  					        #dowrom{ 					        	background: #005792; 					        	color: #EDF9FC; 					        	font-size: 25px; 					        	transition: 0.3s; 					        }  					        #dowrom:hover{ 					        	background: #D1F4FA; 					        	color: #005792; 					        }  					        #dowemu{ 					        	background: #D1F4FA; 					        	color: #005792; 					        	font-size: 20px; 					        	transition: 0.3s; 					        }  					        #dowemu:hover{ 					        	background: #005792; 					        	color: #D1F4FA; 					        }  			.content_right{ 				display: flex; 	        	flex-flow: column nowrap; 	        	align-items: center; 	        	justify-content: center; 				width: 25%; 				margin: 20px; 			}  			.content h2{ 				font-size: 25px; 				text-align: center; 				color: #D1F4FA; 			}  				.content .sub_product{ 					height: 20%; 					margin: 10px; 					text-align: center; 					color: #005792; 				}  					.sub_product li{ 						padding: 10px; 						background: #D1F4FA; 						margin: 10px; 						border-radius: 10px; 						transition: 0.3s; 					}  					.sub_product li:hover{ 						background: #005792; 					}  					.sub_product li:hover a{ 						color: #D1F4FA; 					}  						.sub_product a{ 							font-size: 17px; 							color: #005792; 							transition: 0.3s; 						}   		@media all and (max-width: 1000px){ 			.romemu{ 				flex-flow: column wrap; 			} 			.roms, .emuladores{ 				width: 90%; 				margin: 15px auto; 			} 			.rom, .emulador{ 				width: 45%; 			} 			.content{ 				flex-flow: column nowrap; 			} 			.content_left{ 				width: 100%; 				margin: 25px; 			} 			.content_right{ 				width: 100%; 				margin: 25px; 			} 			.sub_product{ 				flex-flow: row nowrap; 			} 			.sub_product li{ 				display: inline-flex; 			} 		}
<!DOCTYPE html> <html lang="es"> <head> 	<meta charset="utf-8"> 	<title>PokeRoms - Todas las Roms de Pokemon GB, GBC, GBA, N64, GC, NDS, WII, 3DS.</title> 	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> 	<script src="https://code.jquery.com/jquery-3.3.1.min.js"integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="crossorigin="anonymous"></script> 	<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 	<link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed:700" rel="stylesheet"> 	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"> 	<link rel="stylesheet" type="text/css" href="estilo.css"> 	<script type="text/javascript" src="codigo.js"></script> </head> <body> 	<header> 		<div class="logo"> 			<a href=""></a> 		</div> 		<div class="menu"> 			<nav> 				<ul> 					<li><a href="inicio.html">Inicio</a></li> 					<li><a href="roms.html">Roms</a></li> 					<li><a href="emuladores.html">Emuladores</a></li> 				</ul> 			</nav> 		</div> 	</header> 		<section class="list"> 			<div class="separador" id="gb-roms"> 				<label for="gb" class="list-label"><h2>GameBoy/GB Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="gb" onclick="abrirCerrar(0)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(GB) - Pokemon Azul</strong></a> 						</li> 						<li> 							<a href=""><strong>(GB) - Pokemon Amarrilla</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="gbc-roms"> 				<label for="gbc" class="list-label"><h2>GameBoy Color/GBC Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="gbc" onclick="abrirCerrar(1)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(GBC) - Pokemon Cristal</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokemon Plata</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokemon Oro</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokemon Pinball</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokémon Puzzle Challenge</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokémon Trading Card Game</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBC) - Pokémon Trading Card Game 2</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="gba-roms" > 				<label for="gba" class="list-label"><h2>GameBoy Advance/GBA Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="gba" onclick="abrirCerrar(2)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(GBA) - Pokemon Rojo</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokemon Verde</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokemon Esmeralda</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokemon Zafiro</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokémon Rubi</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokémon Equipo Misterioso: Equipo de Rescate Rojo</strong></a> 						</li> 						<li> 							<a href=""><strong>(GBA) - Pokémon Pinball: Rubi y Zafiro</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="n64-roms"> 				<label for="n64" class="list-label"><h2>Nintendo 64/N64 Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="n64" onclick="abrirCerrar(3)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(N64) - Pokemon Puzzle League</strong></a> 						</li> 						<li> 							<a href=""><strong>(N64) - Pokemon Snap</strong></a> 						</li> 						<li> 							<a href=""><strong>(N64) - Pokemon Stadium</strong></a> 						</li> 						<li> 							<a href=""><strong>(N64) - Pokemon Stadium 2</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="gc-roms"> 				<label for="gc" class="list-label"><h2>Nintendo GameCube/GC Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="gc" onclick="abrirCerrar(4)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(GC) - Pokemon Colosseum</strong></a> 						</li> 						<li> 							<a href=""><strong>(GC) - Pokemon Channel</strong></a> 						</li> 						<li> 							<a href=""><strong>(GC) - Pokemon XD: Tempestad Oscura</strong></a> 						</li> 						<li> 							<a href=""><strong>(GC) - Pokemon Box: Rubi y Zafiro</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="nds-roms"> 				<label for="nds" class="list-label"><h2>Nintendo DS/NDS Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="nds" onclick="abrirCerrar(5)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(NDS) - Pokemon Diamante</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokemon Perla</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokemon Platino</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokemon Oro HeartGold</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Plata SoulSilver</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Mundo Misterioso: Equipo de Rescate Azul</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Mundo Misterioso: Exploradores del Tiempo</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) Pokémon Mundo Misterioso: Exploradores de la Oscuridad</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Mundo Misterioso: Exploradores del Cielo</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Ranger</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Sombras de Almia</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Trazos de Luz</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Dash</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Link!</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Negro</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Blanco</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Negro 2</strong></a> 						</li> 						<li> 							<a href=""><strong>(NDS) - Pokémon Blanco 2</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="wii-roms"> 				<label for="wii" class="list-label"><h2>Nintendo Wii/Wii Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="wii" onclick="abrirCerrar(6)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(Wii) - PokePark Wii: La gran aventura de Pikachu</strong></a> 						</li> 						<li> 							<a href=""><strong>(Wii) - PokePark 2: Un mundo de ilusiones</strong></a> 						</li> 						<li> 							<a href=""><strong>(Wii) - Pokemon Battle Revolution</strong></a> 						</li> 					</ul> 			</div> 			<div class="separador" id="3ds-roms"> 				<label for="3ds" class="list-label"><h2>Nintendo 3DS/3DS Roms <i class="fas fa-angle-down"></i></h2></label> 				<input type="checkbox" name="list" class="list-selector" id="3ds" onclick="abrirCerrar(7)"> 					<ul class="lista"> 						<li> 							<a href=""><strong>(3DS) - Pokemon Omega Ruby</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Omega Zafiro</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon X</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Y</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Sol</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Luna</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Ultra Sol</strong></a> 						</li> 						<li> 							<a href=""><strong>(3DS) - Pokemon Ultra Luna</strong></a> 						</li> 					</ul> 			</div> 		</section> 	<footer> 		<nav class="pie"> 			<a href="">Desarrollado por Felix Lozada</a> 		</nav> 	</footer> </body> </html>

Esta seria la funcion si la paso a jquery

	var	lista = $  ('.lista'); 	var icon = $  ('.fas');  	var clic = 1;  	$  ('.list-selector').click(function abrirCerrar(num){  		if(clic==1){ 			lista[num].slideDown(1000);  			clic = 0; 		}else{ 			lista[num].slideUp(1000);  			clic = 1; 		} 	})  var	lista = $  ('.lista'); var icon = $  ('.fas');  var clic = 1;  $  ('.list-selector').click(function abrirCerrar(num){  	if(clic==1){ 		lista[num].slideDown(1000);  		clic = 0; 	}else{ 		lista[num].slideUp(1000);  		clic = 1; 	} })

Repetitive then/catch method on Javascript

I have this function and looks ugly because there are a lot of “catch” doing the same. Any idea how to make it better?

saveUser: function(){     let user_id = this.$  route.params.user_id;     let payload = this.user;      updateUser(user_id, payload).then(response => {         updateOrCreateAddresses(payload).then(response => {             updateOrCreateBalances(payload).then(response => {                 this.success();             }).catch(error => {                 this.showError(error)             })         }).catch(error => {             this.showError(error)         })     }).catch(error => {         this.showError(error)     }) },

Problem with making camera follow player in Javascript

So I’m testing a few things in Javascript and something I was testing was making the camera follow the player. When I move the player, instead of the dots going away from the player, they follow the player and it looks very strange.

Here is the code: https://codepen.io/anon/pen/wLgEPO?editors=0010

Move the player using the arrow keys.

Thanks.