Yeezy Supply SiteKey - recaptcha

Does anybody at all know the public site-key for YeezySupply.com? I am creating a captcha harvester. I need it so i can implement it into something like this:
<html>
<head>
<title>reCAPTCHA demo: Simple page</title>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>
<body>
<form action="?" method="POST">
<div class="g-recaptcha" data-sitekey="your_site_key"></div>
<br/>
<input type="submit" value="Submit">
</form>
</body>
</html>

Related

Spring Boot not loading static files (CSS and JS)

So I have started a spring boot project. The HTML loads fine, however, thyme-leaf seems to have trouble loading static files. The two files are in packages such as static.css and static.js. I get an ERR_ABORTED:404 error for loading both files and can not figure out why.
I have already tried changing the path (as suggested in other similar questions) to something like #{css/styles.css} instead of #{/css/styles.css} but that did not work.
Does anyone know if I'm missing something here?
Below is the HTML file:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" th:href="#{/css/styles.css}">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="bg-img">
<div class="content">
<header>Login Form</header>
<form action="#">
<div class="field">
<span class="fa fa-user"></span>
<input type="text" required placeholder="Email or Phone">
</div>
<div class="field space">
<span class="fa fa-lock"></span>
<input type="password" class="pass-key" required placeholder="Password">
<span class="show">SHOW</span>
</div>
<div class="pass">
Forgot Password?
</div>
<div class="field">
<input type="submit" value="LOGIN">
</div>
</form>
<div class="login">Or login with</div>
<div class="links">
<div class="facebook">
<i class="fab fa-facebook-f"><span>Facebook</span></i>
</div>
<div class="instagram">
<i class="fab fa-instagram"><span>Instagram</span></i>
</div>
</div>
<div class="signup">Don't have account?
Signup Now
</div>
</div>
</div>
<script type="text/javascript" th:src="#{/js/loginscript.js}"></script>
</body>
where is your css folder?
css, js should be in static folder
src
main
java
resources
static
css
i18n
img
js
templates
Add this in your head tag:
<link rel="stylesheet" href="../static/css/styles.css" type="text/css" th:href="#{/styles.css}">
Note: Above code will only work if styles.css present in below path:
|--resources
|--static
|--css
|--styles.css
This is here for anyone who finds this, it turns out for the th:href property, I had to give the full path as th:href="#{../static/css/styles.css}". Thanks to everyone who answered!

Socket.io __dirname is not defined when trying to load on localhost

I'm trying to build a basic chat function for a site and am following along with this tutorial...
(https://www.youtube.com/watch?v=tHbCkikFfDE&list=WL&index=4)... but socket.io doesn't seem to be loading on the page. I used the most recent CDN. I have a feeling my file path is off but I'm not quite sure how to repair it. I'm new, be gentle.
<html>
<head>
<title>IO Chat</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.slim.js" integrity="sha256-DrT5NfxfbHvMHux31Lkhxg42LY6of8TaYyK50jnxRnM=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
<style>
body {
margin-top: 30px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="well">
<h3>Online Users</h3>
<ul id="users" class="list-group"></ul>
</div>
</div>
<div class="col-md-8">
<div class="chat" id="chat"></div>
<form id="messageForm">
<div class="form-group">
<label>Enter Message</label>
<textarea class="form-control" id="message">
</textarea>
<br />
<input type="submit" class="btn btn-primary" value="Send Message" />
</div>
</form>
</div>
</div>
</div>
<script>
$(function(){
var socket = io.connect();
var $messageForm = $('#messageForm');
var $message = $('#message');
var $chat = $('#chat');
$messageForm.submit(function(e){
e.preventDefault();
socket.emit('send message', $message.val());
$message.val('');
});
socket.on('new message', function(data){
$chat.append('<div class="well">'+data.msg+'</div>')
})
})
</script>
</body>
</html>

Drop-down list's design is crashed with too many elements

I have downloaded a JQuery-plugin for a searchable drop down list. Here is the source
I fill the list using D3.js. It works well for few elements, but when I want to load all elements (around 1200) the design is crashed and the list is displayed in the top so that I can't see the items and there is no scroll-bar.
Here how it looks like when I load the whole elements:
Here we can see from the developer tool in the browser that the data is loaded correctly:
The console shows these violations:
Here is my D3.js code:
d3.csv("Data/Symbols.csv").get(function (error, Symbolsdata) {
if (error) throw error;
d3.select("#my-select").selectAll(".option")
.data(d3.map(Symbolsdata, function (d) { return d.CurrSymbol; }).keys())
.enter().append("option")
.text(function (d) { return d; })
.attr("value", function (d) { return d; });
});
Html script:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Crypto Trading Project</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/sol.css">
</head>
<body>
<header>
<div class="collapse bg-light" id="navbarHeader">
<div class="container">
<div class="row">
<div class="col-sm-6 py-4">
<select id="my-select" name="Cryptos" multiple="multiple"></select>
</div>
<div class="col-sm-6 py-4">
From <input type="text" class="mt10px input" id="J-demo-04" value=""> To <input type="text" class="mt10px input" id="J-demo-05" value="">
<button type="button" id="applyFilterButton" class="btn btn-dark">Apply</button>
</div>
<div class="col-sm-3 py-4">
</div>
</div>
</div>
</div>
<div class="navbar navbar-dark bg-dark box-shadow">
<div class="container d-flex justify-content-between">
Cryptos VA
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader" aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</div>
</header>
<main role="main">
</main>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/date-time-picker.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/sol.js"></script>
<script type="text/javascript" src="js/d3.js"></script>
<script type="text/javascript" src="js/loadsol.js"></script>
<script type="text/javascript">
$(function() {
// initialize sol
$('#my-select').searchableOptionList({
showSelectAll: true
});
//dateTimePicker
$('#J-demo-04').dateTimePicker({
limitMax: $('#J-demo-05')
});
$('#J-demo-05').dateTimePicker({
limitMin: $('#J-demo-04')
});
});
</script>
</body>
</html>
How can I have it work?
I could finally figure it out. The idea is simply to fix the height of the active container and add a scroll bar. So I add in the sol.css file to the .sol-container.sol-active .sol-selection-container class these two css attributes:
height: 300px;
overflow-y: auto;

How to do Ajax Post request in phonegap

I am using phonegap and jquery mobile to build a web app, django on the server side. First, i start out from index.html page,and inject a login form from server into index.html and change page to the jquery mobile page containing the sign in form. But the problem is that the form is getting submitted but not in ajax, but if i test it in web browser,it works. I have already white listed the domain name in config.xml file.
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
<title>Hello World</title>
</head>
<body>
<div data-role="page">
<div class="app" style="display:none;">
<h1>PhoneGap</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<div data-role="header">
<h1>DOCTORSLOG</h1>
</div>
<div data-role="content">
</div>
</div>
<script type="text/javascript" src="phonegap.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
$(function(){
$.ajax({
url: 'http://doctorslog.net/mobile/login-test/',
success: function(data){
//append the response(sign-in.html) to the body
$('body').append(data);
}
});
});
</script>
</body>
</html>
sign-in.html
<div data-role="page" data-fullscreen="true" id="login">
<div data-role="header" data-theme="b">
<h1 id="title">DOCTORSLOG</h1>
</div>
<div data-role="content">
<form id="sign_in_form" method="post" action="http://doctorslog.net/mobile/login/">{% csrf_token %}
<div data-role="fieldcontain">
<label for="id_username" style="font-size: 1.3em;line-height: 350%;">Username</label>
<input id="id_username" style="font-size: 1.8em;font-weight: bold;font-family: Tahoma,Verdana,serif;" type="text" maxlength="30" name="username" autocomplete="off">
</div>
<div data-role="fieldcontain">
<label for="id_password" style="font-size: 1.3em;line-height: 350%;">Password</label>
<input id="id_password" style="font-size: 1.8em;font-weight: bold;font-family: Tahoma,Verdana,serif;" type="password" name="password">
</div>
<div style="width: 100%;text-align: center;font-size: 1.6em;">
<input id="sign-in-btn" type="submit" data-inline="true" value="Sign me in" />
</div>
<input type="hidden" name="next" value="{% firstof next '/home/' %}"/>
<input id="hiddenID" type="hidden" name="regID" value=""/>
</form>
</div>
<script>
$(function(){
//change active page to this page and since it is a jquery mobile page with data-role=page,i expect automatic ajax submission on clicking submit button
$(':mobile-pagecontainer').pagecontainer('change','#login');
$('#sign_in_form').trigger('create');
});
</script>
</div>
The question is, if i can make Ajax GET request,why can not i make POST request. Any help is appreciated. Thanks.
Ok, i have solved this issue by disabling jquery mobile default form hijacking by setting data-ajax="false" on the form tag and submitting the form by $.ajax . Nothing like $.mobile.allowCrossDomainPages worked. And i also have set Access-Control-Allow-Origin response headers on the server side , really did not know if this is required.
Here is the script to submitform -
$(function(){
$('#sign_in_form').submit(function(e){
e.preventDefault();
$.mobile.loading('show');
var url = $(this).attr('action');
var data = $(this).serializeArray();
$.ajax({
beforeSend:function(jqXHR,settings){
jqXHR.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
},
url:url,
type:'POST',
data:data,
crossDomain:false,
success: function(data){
$.mobile.loading('hide');
$('body').append(data);
}
});
});
});

Validate a form loaded from ajax

so here's my problem.
i have a html page with a simple form and some javascript (jquery) code to validate it, ok then.
this page would looks like this: test.html
<html>
<head>
<title></title>
<script src="jquery-1.7.min.js" type="text/javascript"></script>
<script type="text/javascript">
function validate(){
$('form').submit(function () {
var txt = $('#SYSTEM_NAME').val();
if (txt == '') $('#loading').append('field is empty');
return false;
})
}
window.onload = validate
<form action="SomeAction" id="form0" method="post">
<fieldset>
<legend>Information</legend>
<div class="editor-field">
<input id="SYSTEM_NAME" name="SYSTEM_NAME" type="text" value="" />
</div>
<input type="submit" value="Insert" id="saveCreation" />
<div id="loading"></div>
</fieldset>
</form>
</body>
</html>
In this page above, if you try to insert without any information on the field 'SYSTEM_NAME', it would dysplay a message. Everything is fine here my form is validated.
But when i load this page from another one using ajax(jquery), what occurs is, after loaded it the validation that i made on 'test.html' doenst work.
Example:
<html>
<head>
<title></title>
<script src="jquery-1.7.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('#go').click(function(){
$('#here').load('test.html')
});
</script>
</head>
<body>
<input type='button' id='go' value='go' />
<div id='here'></div>
</body>
</html>
Now if i click on 'Insert' the validation doest work anymore.
How can i solve this problem ? can i interact with loaded page and javascript code together ?
Hope you guys have understood my problem. Thanks and sorry for enlish mistakes.
forgive me if this is too much of a change, but i thought i might suggest another method for you. what about using jquery validate to help you with the validation? here is an example with the ajax-response validating as you want. below is the parent document... (notice that i am including jquery validate in the head. just ignore the 'get_test' i am using to load the partial.)
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#go').click(function() {
$('#here').load('get_test');
});
});
</script>
</head>
<body>
<input type='button' id='go' value='go' />
<div id='here'></div>
</body>
</html>
and the partial i am loading below... (notice that the text input has a class of 'required' - this is how jquery validate works. you will also see a validate method.)
<script type="text/javascript">
$("#form0").validate();
</script>
<form action="SomeAction" id="form0" method="post">
<fieldset>
<legend>Information</legend>
<div class="editor-field">
<input id="SYSTEM_NAME" name="SYSTEM_NAME" type="text" value="" class="required" />
</div>
<input type="submit" value="Insert" id="saveCreation" />
<div id="loading"></div>
</fieldset>
</form>

Resources