Sapinn

Opa galera. Fiz um preview de imagens através de um input e ele está funcionado bem agora como eu faço para fazer uma mesmo preview em inputs diferentes. Quando coloco mais de um input e seleciona arquivos ele sempre mostra no primeiro input. Meu codigo: CSS: *{ padding: 0; margin: 0; box-sizing: border-box; font-family: "Rubik",sans-serif; } body{ background-color: #f5f8ff; } .container{ background-color: #ffffff; width: 60%; min-width: 450px; position: relative; margin: 50px auto; padding: 50px 20px; border-radius: 7px; box-shadow: 0 20px 35px rgba(0,0,0,0.05); } input[type="file"]{ display: none; } label{ display: block; position: relative; background-color: #025bee; color: #ffffff; font-size: 18px; text-align: center; width: 300px; padding: 18px 0; margin: auto; border-radius: 5px; cursor: pointer; } .container p{ text-align: center; margin: 20px 0 30px 0; } #images{ width: 80%; position: relative; margin: auto; display: flex; justify-content: space-evenly; gap: 20px; flex-wrap: wrap; } figure{ width: 45%; } img{ width: 100%; } figcaption{ text-align: center; font-size: 2.4vmin; margin-top: 0.5vmin; } HTML: <div class="container"> <input type="file" id="file-input" accept=".png, .jpeg, .jpg, .pdf" onchange="preview(this)" multiple> <label for="file-input"> <i class="fas fa-upload"></i> Escolha seus arquivos </label> <p id="num-of-files">Nenhum arquivo escolhido</p> <div id="images"></div> </div> <div class="container"> <input type="file" id="file-input" title="2" accept=".png, .jpeg, .jpg, .pdf" onchange="preview(this)" multiple> <label for="file-input"> <i class="fas fa-upload"></i> Escolha seus arquivos </label> <p id="num-of-files">Nenhum arquivo escolhido</p> <div id="images"></div> </div> JAVASCRIPT: let fileInput = document.getElementById("file-input"); let inputFile = document.querySelectorAll("#file-input"); let imageContainer = document.getElementById("images"); let numOfFiles = document.getElementById("num-of-files"); function preview(input){ imageContainer.innerHTML = ""; numOfFiles.textContent = `${fileInput.files.length} Arquivos selecionados`; for(i of fileInput.files){ let reader = new FileReader(); let figure = document.createElement("figure"); let figCap = document.createElement("figcaption"); figCap.innerText = i.name; figure.appendChild(figCap); reader.onload=()=>{ let img = document.createElement("img"); if(figCap.innerText.split('.').pop() == 'pdf'){ img.setAttribute("src","pdf.png"); }else{ img.setAttribute("src",reader.result); } figure.insertBefore(img,figCap); } imageContainer.appendChild(figure); reader.readAsDataURL(i); } }

Fala galera!! Eu estou usando uma dependência no PHP para gerar um qrcode a chillerlan e ela funciona perfeitamente, agora como eu posso fazer para adicionar uma logo que fique centralizada no meu qrcode ?? Eu li a documentação mas não consegui fazer Meu codigo atual está assim: <?php require 'vendor/autoload.php'; use chillerlan\QRCode\QRCode; use chillerlan\QRCode\QROptions; $url = "https://www.youtube.com/?gl=BR&hl=pt"; $options = new QROptions([ 'logoSpaceHeight' => 10, 'logoSpaceWidth' => 10, 'scale' => 5, 'version' => 7, "eccLevel" => QRCode::ECC_L, ]); echo '<img src="'.(new QRCode($options))->render($url).'" />';

Muito obrigado, você me salvou novamente!!!

Muito obrigado pela resposta. Exatos 2 segundos depois que eu postei percebi que deveria fazer assim.

Salve! Não consigo verificar se o checkbox foi marcado, isso não faz o menor sentido porquê aparentemente eu fiz tudo certo. HTML: <div class="mt-4 mb-3 row "> <label class="label_checkbox">Adicionar customização <input type="checkbox" id="checkbox" name="custom_shirt"> <span class="checkmark"></span> </label> </div> JAVASCRIPT: let checkedCustomize = document.getElementById("checkbox"); if(checkedCustomize.checked){ alert("Checkbox marcado"); }else{ console.log("checkbox não marcado"); }

É a primeira vez que vejo esse erro e estou tendo problemas para resolvê-lo. Tenho no meu controller uma página de erro com o código: <?php namespace Source\App\Error; use Source\Core\Controller; class Error extends Controller { public function __construct() { parent::__construct(__DIR__ . "/../../themes/" . CONF_VIEW_ERROR . "/"); } /** * ERROR * @param array $data */ public function errors(?array $data): void { $error = new \stdClass(); json_encode($error); switch ($data['errcode']) { case "problemas": $error->code = "OPS"; $error->title = "Estamos enfrentando problemas!"; $error->message = "Parece que nosso serviço não está diponível no momento. Já estamos vendo isso mas caso precise, envie um e-mail :)"; $error->linkTitle = "ENVIAR E-MAIL"; $error->link = "mailto:" . CONF_MAIL_SUPPORT; break; case "manutencao": $error->code = "OPS"; $error->title = "Desculpe. Estamos em manutenção!"; $error->message = "Voltamos logo! Por hora estamos trabalhando para melhorar nosso conteúdo para você controlar melhor as suas contas :P"; $error->linkTitle = null; $error->link = null; break; default: $error->code = $data['errcode']; $error->title = "Ooops. Conteúdo indispinível :/"; $error->message = "Sentimos muito, mas o conteúdo que você tentou acessar não existe, está indisponível no momento ou foi removido :/"; $error->linkTitle = "Continue navegando!"; $error->link = url_back(); break; } $head = $this->seo->render( "{$error->code} | {$error->title}", $error->message, url("/ops/{$error->code}"), theme("/assets/images/share.jpg", CONF_VIEW_ERROR), false ); echo $this->view->render("error", [ "head" => $head, "error" => $error ]); } } Estou usando o Composer para fazer minhas rotas de erro e elas se parecem com isso: /** * ERROR ROUTES */ $route->namespace("Source\App\Error"); $route->group("/ops"); $route->get("/{errcode}", "Error:errors"); /** * ROUTE */ $route->dispatch(); /** * ERROR REDIRECT */ if ($route->error()) { $route->redirect("/ops/{$route->error()}"); } E minha visão na página fkbError é assim: layout("_theme"); ?> <article class="not_found"> <div class="container content"> <header class="not_found_header"> <p class="error">•<?= $error->code; ?>•</p> <h1><?= $error->title; ?></h1> <p><?= $error->message; ?></p> <?php if ($error->link): ?> <a class="not_found_btn gradient gradient-green gradient-hover transition radius" title="<?= $error->linkTitle; ?>" href="<?= $error->link; ?>"><?= $error->linkTitle; ?></a> <?php endif; ?> </header> </div> </article> E o código parece estar certo mas o erro persiste, o que devo fazer?

Opa galera tudo beleza? Estou com um erro que está me deixando louco eu tenho o seguinte codigo: public function findByCode(string $code, string $columns = "*"): ?Sales { $find = $this->find("code = :code", "code={$code}", $columns); return $find->fetch(true); } Quando o tentou usar ele fazendo algo como: $sales = (new Sales())->findByCode(client()->code); Ele não funciona e me retorna o seguinte erro: Uncaught TypeError: Return value of Source\Models\Sales::findByCode() must be an instance of Source\Models\Sales or null, array returned in Alguém sabe como resolver isso???

Obrigado pela resposta amigo. O problema mesmo era que eu estava renderizando de forma errada, eu estava fazendo algo como: echo $this->view->render("widgets/dash/home", [ "head" => $head, "sales" => $sales->fetch(true) ]); Esse fetch true na variável sales é desnecessário já que no método usa ele. Então eu o removi e o problema foi resolvido.

Salva galera. Estou tentando usar o dropzone.js em um projeto mas estou tendo grandes dificuldades. Ele funciona aparentemente bem, mas não estou conseguindo enviar os arquivos para a pasta. Eu queria colocar mais de um dropzone na mesma pagina para arquivos diferentes como posso fazer isso? Outra coisa eu queria colocar todas as url de varios arquivos na mesma coluna em um formato json, isso possivel? Se sim como eu faria para chamar esses arquivos de volta e mostrar para o usuario??

Você tem um campo data no php? Se sim, não seria mais facil colocar no campo data no banco de dados do tipo TIMESTAMP? Assim ele colocaria automaticamente a data e hora, acho que isso possa resolver os problema.

Olá amigos tudo bem? Estou com um erro de loop de redirecionamento quando tento colocar uma rota de erro. Na minha página index onde eu coloco todas as minhas rotas eu tehno a seguinte rota para erro /** * ERROR ROUTES */ $route->namespace("Source\App\Error"); $route->group("/ops"); $route->get("/{errcode}", "Error:errors"); /** * ROUTE */ $route->dispatch(); /** * ERROR REDIRECT */ if ($route->error()) { $route->redirect("/ops/{$route->error()}"); } Se eu remover esse ultimo if a pagina não da erro mas também não carrega meu metodo. Eu estou usando o composer e estou usando a dependecia do CoffeCode para rotas. Alguém sabe como resolver???

Bom... Um amigo meu tinha me pedido pra fazer isso. Eu consegui fazer a solução o problema está quando ele pedi pra caso tenha 90 seja adicionado como o maior da lista

Galera estou precisando de ajuda aqui em um código. Preciso criar um campo que recebe um número e retorne o maior numero consecutivo que tem naquele número, por exemplo, se for digitado o número 785141109567825 a saída seria 5678, o maior número em uma sequencia consecutiva, além disso, foi pedido que o numero zero fosse adicionado como maior, por exemplo, no número 84890 nesse caso a saída deve imprimir 90. Alguém sabe como fazer??

Opa galera, tudo blz? Recentemente comecei a estudar reactjs e para praticar estou fazendo o clone da Netiflix. Mas estou com um erro ao tentar chamar as imagens da API do TMDB o erro é: TypeError: Cannot read properties of undefined (reading 'results') Já tentei refazer o código varias vezes mas não consegui resolver o problema. Vou postar o resto do código aqui App.js: import React, {useEffect, useState} from 'react'; import Tmdb from './Tmdb'; import MovieRow from './components/MovieRow'; const App = () =>{ const [movieList, setMovieList] = useState([]); useEffect(()=>{ const loaddAll = async () =>{ let list = await Tmdb.getHomeList(); setMovieList(list) } loaddAll(); }, []); return( <div className="page"> <section className="lists"> {movieList.map((item, key)=>( <MovieRow key={key} title={item.title} items={item.items}/> ))} </section> </div> ); } export default App; Consumir a api: Tmdb.js: const API_KEY = '******************************'; const API_BASE = 'https://api.themoviedb.org/3'; const basicFetch = async (endpoint) =>{ const req = await fetch(`${API_BASE}${endpoint}`) const json = await req.json(); return json; } export default { getHomeList: async () =>{ return [ { slug: 'originals', title: 'Originais da Netflix', items: await basicFetch(`/discover/tv?with_networks=213&language=pt-BR&api_key=${API_KEY}`) }, { slug: 'trending', title: 'Recomendados para você', item: await basicFetch(`/trending/all/week?language=pt-BR&api_key=${API_KEY}`) }, { slug: 'toprated', title: 'Em alta', item: await basicFetch(`/movie/top_rated?language=pt-BR&api_key=${API_KEY}`) }, { slug: 'action', title: 'Ação', item: await basicFetch(`/discover/movie?width_genres=28&language-pt-BR&api_key=${API_KEY}`) }, { slug: 'comedy', title: 'Comédia', item: await basicFetch(`/discover/movie?width_genres=35&language-pt-BR&api_key=${API_KEY}`) }, { slug: 'horror', title: 'Terror', item: await basicFetch(`/discover/movie?width_genres=27&language-pt-BR&api_key=${API_KEY}`) }, { slug: 'romance', title: 'Romance', item: await basicFetch(`/discover/movie?width_genres=10749&language-pt-BR&api_key=${API_KEY}`) }, { slug: 'documentary', title: 'Documentários', item: await basicFetch(`/discover/movie?width_genres=99&language-pt-BR&api_key=${API_KEY}`) }, ] } } Componente para mostrar os filmes: MovieRow.js: import React from "react"; import './MovieRow.css'; export default ({title, items}) =>{ return ( <div> <h2>{title}</h2> <div className="moviewRow--listarea"> {items.results.length > 0 && items.results.map((key, item)=>( <img src={`https://image.tmdb.org/t/p/w300${item.poster_path}`} /> ))} </div> </div> ); } Se alguém pudesse me ajudar eu ficaria muito grato.

Opa galera tudo beleza? Então meu banco está me retomando um erro quando tento inserir nele que é "Dados truncados na coluna valor_produto" essa coluna era do tipo Double quando eu mudei para ela para TEXT funcionou os dados foram inseridos mas eu preciso que ela seja do tipo double. Alguém sabe como resolver????

Recentemente, o seguinte erro estava aparecendo em meu site 'max_user_connections', depois de muitas pesquisas descobri que o problema era devido a uma conexão persistente de banco de dados, então o removi do meu código e funcionou. Outro problema surgiu agora, meu lastInsertId () está retornando 0. Quando eu uso a conexão persistente, ele funciona se eu removê-lo, ele falha. Eu nem sei mais o que fazer. Vou deixar as partes mais importantes do meu código aqui: Conexão: public function __construct() { $dsn = 'mysql:host='.$this->host.';dbname='.$this->bank; try { $this->dbh = new PDO($dsn,$this->user,$this->password); $this->dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); } catch (PDOException $e) { print "Error!: " . $e->getMessage() . "<br/>"; die(); } } public function lastId Inserted(){ return $this->dbh->lastInsertId(); } Pesquisando pelo último Id: if($this->saleModel->store($data)): $sale_id = $this->db->lastId Inserted(); $data['sale_id'] = $sale_id; $this->sellModel->sellProduct($data); $total = $stock->quant_product - $data['quant_sale']; $this->ProductModel->decreaseSales($data['product_id'],$total); Url::redirect('sales/sellProducts/'.$sale_id.''); endif;

Cara tentei rodar seu script na minha máquina mas não deu certo

Estou precisando colocar em um site um propriedade que toda vez que clicar em uma imagem apareça uma janela modal com um slide show em que você pode passar as imagens. Por exemplo se tiver a foto de um celular quando eu clicar nela aparecera um slide show, onde você pode ir passando e vendo outras imagens do celular. Eu já tentei fazer mais sempre dá erro quando eu coloco várias imagens e tento chamar uma por uma. Não sei se eu preciso chamar cada slide ou se existe uma forma simples de se fazer isso. Vou postar aqui um código que eu fiz: CSS: * { box-sizing:border-box; font-family: Arial; } .slideshow-container { max-width: 800px; position: relative; margin: auto; } .mySlides { display: none; } .prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: #4285f4; font-weight: bold; font-size: 28px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; } .next { right: 0; border-radius: 3px 0 0 3px; } .prev:hover, .next:hover { background-color: rgba(0,0,0,0.8); } .dot { cursor: pointer; height: 15px; width: 15px; margin: 10px 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease; } .active, .dot:hover { background-color: #4285f4; } .fade { -webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s; } .img_slide{ width: 100%; height: 500px; } /* ----------------MODAL--------------------------------- */ .modal-container{ width: 100vw; height: 100vh; background: rgba(0, 0, 0, .8); position: fixed; top: 0px; left: 0px; z-index: 2000; display: none; justify-content: center; align-items: center; font-family: Arial, Helvetica, sans-serif; } .modal-container.mostrar{ display: flex; } @keyframes modal{ from{ opacity: 0; transform: translate3d(0, -60px, 0); } to{ opacity: 1; transform: translate3d(0, 0, 0); } } .mostrar .modal-content{ animation: modal .3s; } .fechar{ position: absolute; top: 8px; right: 3px; width: 30px; height: 30px; font-weight: bold; color: #4285f4; font-size: 25px; font-family: Arial, Helvetica, sans-serif; cursor: pointer; background: transparent; border: none; } @media (max-width: 600px) { .img_slide{ width: 100%; height: 300px; } } JAVASCRIPT: var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("dot"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; } function iniciaModal(modalID){ const modal = document.getElementById(modalID); if(modal){ modal.classList.add('mostrar'); modal.addEventListener('click',(e)=>{ if(e.target.id == modalID || e.target.className == 'fechar'){ modal.classList.remove('mostrar'); } }); } } const botaoChama = document.querySelector('#botaoChama'); botaoChama.addEventListener('click',()=>{ iniciaModal('modal'); }); const botaoChama2 = document.querySelector('#botaoChama2'); botaoChama2.addEventListener('click',()=>{ iniciaModal('modal2'); }); HTML: <div id="modal" class="modal-container"> <button class="fechar">X</button> <div class="slideshow-container"> <div class="mySlides fade"> <img src = "https://wallpapercave.com/wp/wp3473585.jpg" class="img_slide"> </div> <div class="mySlides fade"> <img src = "https://i.pinimg.com/originals/cd/7b/5c/cd7b5c8d4687b5c98a445127926a56e2.jpg" class="img_slide"> </div> <div class="mySlides fade"> <img src =" https://wallpapercave.com/wp/wp2043649.png " class="img_slide"> </div> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> <div style="text-align:center"> <span class="dot" onclick="currentSlide(1)"></span> <span class="dot" onclick="currentSlide(2)"></span> <span class="dot" onclick="currentSlide(3)"></span> </div> </div> </div> <div id="modal2" class="modal-container"> <button class="fechar">X</button> <div class="slideshow-container"> <div class="mySlides fade"> <img src="https://wallpapercave.com/wp/wp9688141.jpg" class="img_slide"> </div> <div class="mySlides fade"> <img src="https://wallpapercave.com/wp/wp8480719.jpg" class="img_slide"> </div> <div class="mySlides fade"> <img src="https://wallpapercave.com/wp/wp9683280.jpg" class="img_slide"> </div> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> <div style="text-align:center"> <span class="dot" onclick="currentSlide(4)"></span> <span class="dot" onclick="currentSlide(5)"></span> <span class="dot" onclick="currentSlide(6)"></span> </div> </div> </div> <button id="botaoChama">Modal</button> <button id="botaoChama2">Modal 2</button>

A um bom tempo atrás eu encontrei um site que dava pra mudar a cor do layout. Então eu resolvi adicionar essa propriedade em um site que estou desenvolvendo, mas não sei bem como fazer isso. Eu criei uma variável no meu arquivo css pra colocar uma cor padrão para o site então eu gostaria que o usuário quando apertasse em um palheta de cores visse como o site ficaria caso ele gostasse ele apertaria em mudar cor e essa nova cor seria a padrão do site. Eu fiz algumas buscas mas não encontrei muita coisa, infelizmente. Se alguém pudesse me ajudar eu ficaria grato. Vlw

Entendi... Eu estou fazendo esse sistema em MVC usando .htacess para as URL com isso eu não consigo acessar os arquivos dentro da pasta app no caso na imagem, todavia, eu consigo colocar ele na pasta public dentro de uma pasta chamada img_user. Para chamar a imagem eu uso uma contante com uma url pré definida, assim: CONST.'/img_user/'.$user->foto E está funcionando, tentei outras formas mas não consegui fazer.

Estou precisando salvar fotos dos usuários de um sistema e não estou conseguindo fazer com OO já assisti video aulas e li algumas matérias mas sempre dá erro. Alguém sabe algum jeito de se fazer?? Eu até tentei mas fica sempre com erro, vou postar aqui talvez tenha algo que eu esteja fazendo errado. class para salvar a foto: private function salvarFoto($foto){ $fotos = $_FILES['foto_admin']; $fotoDir = "imagens/fotos_admins/"; $fotoPath = $fotoDir . basename($foto['foto_admin']['name']); $fotoTmp = $foto['foto_admin']['tmp_name']; if(move_uploaded_file($fotoTmp, $fotoPath)): return $fotoPath; else: return false; endif; } E estou chamando ela assim: $upload = $this->salvarFoto($_FILES); if(gettype($upload) == 'string'): $dados['foto_admin'] = $upload; endif; E o erro é o seguinte: move_uploaded_file(imagens/fotos_admins/sapinn.jpg): failed to open stream: No such file or directory in Não sei o que está errado a pasta imagens/fotos_admins está dentro da minha pasta Controller

Eu tentei e não consegui. Você acha que é uma má pratica eu salvar as imagens na minha pasta public e depois chama-las ??

Obrigado Omar me salvou de novo, no meu caso só tava faltando o __DIR__ mesmo. Mas agora estou com outro problema não estou conseguindo chamar a imagem

Fala galare, blz? Então, estou desenvolvendo um sistema de vendas e eu gostaria de saber como fazer para devolver o produto ao estoque no caso de cancelamento da venda ou na devolução. Por exemplo: Digamos que eu tenha um estoque com 10 fones de ouvido, 5 teclados e 20 pen drives. Então um cliente comprou 1 fone de ouvido, 1 teclado e 2 pendrive, eu já consigo ajustar o estoque para diminuir ficando: 9 fones de ouvido, 4 teclados, 18 pen drives. Mas digamos que, por alguma razão, o cliente gostaria de devolver o pen drives e o fone de ouvido como eu faria para colocar ambos de volta ao seu respectivo estoque, ou seja ajustar os 9 fones e os 18 pen drive de volta para 10 fones e 20 pen drive??

Entendi... Mas como eu faria pra devolver isso ao banco de dados? Uma solução não seria enviar um formulário com todos os id do produto e a quantidade da venda somar com a quantidade do produto atualmente e atualizar o preço? Então como eu faria para pegar esse produtos do banco de dados ?