-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
82 lines (77 loc) · 3.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>changing letters</title>
</head>
<body>
<div class="container">
<div class="conteudo">
<div class="area-logo">
<h1>changing letters</h1>
</div>
<div class="area-principal">
<textarea name="text" id="text" cols="30" rows="10"></textarea>
<div class="area-efeitos-g">
<h2>efeitos</h2>
<div class="area-efeitos-p">
<button onclick="escolherEfeito('AAA')" class="efeito" id="e1" value="AAA">AAA</button>
<button onclick="escolherEfeito('aaa')" class="efeito" id="e2" value="aaa">aaa</button>
<button onclick="escolherEfeito('Aaa')" class="efeito" id="e3" value="Aaa">Aaa</button>
<button onclick="escolherEfeito('aAA')" class="efeito" id="e3" value="aAA">aAA</button>
<button onclick="escolherEfeito('a_b')" class="efeito" id="e3" value="a_b">a b</button>
<button onclick="escolherEfeito('abb')" class="efeito" id="e4" value="abb">abb</button>
</div>
</div>
<div class="area-botoes">
<button onclick="aplicarEfeito()">aplicar</button>
<button onclick="copiarTexto()">copiar</button>
</div>
</div>
</div>
</div>
<script>
var efeito = "AAA";
var efeitosButton = document.getElementsByClassName("efeito")
let copiarTexto = () =>{
const text = document.querySelector("#text");
text.select();
document.execCommand('copy');
}
let aplicarEfeito = () =>{
const text = document.querySelector("#text");
if(text!=' '){
text.select();
var urle = `http://127.0.0.1:8000/efeitos?efeito=${efeito}&text=${text.value}`
$.ajax({
url:urle,
method:'post',
async:true,
success:function(resposta){
if(resposta['status']==0){
}else{
text.value=resposta['text'];
}
},
})
}else{
alert('Informe o texto')
}
}
function escolherEfeito(valor){
efeito = valor;
for(let i=0;i<efeitosButton.length;i++){
if(efeitosButton[i].value==valor){
efeitosButton[i].style.border = "solid 2.5px rgb(9, 156, 107)";
}else{
efeitosButton[i].style.border = "none";
}
}
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</body>
</html>