pbInfo.ro
Probleme
Probleme - clasa a IX-a
Probleme - clasa a X-a
Probleme - clasa a XI-a
Probleme din concursuri
Căutare problemă
Exerciții
Programează cu Blockly
Desenează cu Processing
Exersează SQL
Soluţii
Resurse
Resurse pentru clasa a IX-a
Resurse pentru clasa a X-a
Resurse pentru clasa a XI-a
Articole recomandate
Subiecte bacalaureat
Ajutor
Autentificare
Înregistrare
Autentificare
Utilizator sau email
Parola
Acest site foloseşte cookies. Navigând în continuare, vă exprimaţi acordul asupra folosirii cookie-urilor.
Îti place pbInfo? Atunci acceptă-l cu totul! Dezactivează modulul de blocare a reclamelor!
Search Engine - Processing
Lista scripturi
Script Nou
Ajutor
ID
Autor
Duplicat din
Ultima modificare
#7251
7B-Necsulescu Stefan Matei (Stefan_Matei_Necsulescu)
-
Marti, 19 mai 2026, 15:08
let addressBar; let btnBack, btnForward, btnRefresh, btnGo; let browserFrame; let headerHeight = 50; function setup() { createCanvas(windowWidth, windowHeight); // 1. Navigation Buttons (Back, Forward, Refresh) btnBack = createButton('◀'); styleButton(btnBack); btnBack.position(10, 10); btnBack.mousePressed(() => browserFrame.elt.contentWindow.history.back()); btnForward = createButton('▶'); styleButton(btnForward); btnForward.position(45, 10); btnForward.mousePressed(() => browserFrame.elt.contentWindow.history.forward()); btnRefresh = createButton('↻'); styleButton(btnRefresh); btnRefresh.position(80, 10); btnRefresh.mousePressed(() => browserFrame.elt.contentWindow.location.reload()); // 2. Smart Address / Search Bar addressBar = createInput('p5js.org'); addressBar.position(120, 10); addressBar.size(width - 200, 24); // CSS Styling for a modern look addressBar.style('border-radius', '15px'); addressBar.style('padding', '0 15px'); addressBar.style('border', '1px solid #ccc'); addressBar.style('font-size', '14px'); addressBar.style('outline', 'none'); // Listen for the "Enter" key addressBar.elt.addEventListener('keydown', function(event) { if (event.key === 'Enter') navigate(); }); // 3. Go Button btnGo = createButton('Go'); styleButton(btnGo); btnGo.position(width - 60, 10); btnGo.mousePressed(navigate); // 4. The Browser Iframe browserFrame = createElement('iframe'); browserFrame.position(0, headerHeight); browserFrame.size(width, height - headerHeight); browserFrame.style('border', 'none'); browserFrame.style('background-color', '#fff'); // Load the initial page navigate(); } function draw() { // Draw a sleek background for the top header background(245); stroke(210); line(0, headerHeight, width, headerHeight); } // Logic to determine if input is a URL or a Search function navigate() { let query = addressBar.value().trim(); let finalUrl = ''; // Simple check: If it has a dot and no spaces, it's probably a URL if (query.includes('.') && !query.includes(' ')) { if (!query.startsWith('http')) { finalUrl = 'https://' + query; } else { finalUrl = query; } } else { // It's a search term! // We use Wikipedia's search engine here because Google/Bing actively block iframes. finalUrl = 'https://en.wikipedia.org/wiki/Special:Search?search=' + encodeURIComponent(query); } // Update the iframe and the address bar text browserFrame.attribute('src', finalUrl); addressBar.value(finalUrl); } // Helper function to make buttons look nice function styleButton(btn) { btn.style('background', '#fff'); btn.style('border', '1px solid #ccc'); btn.style('border-radius', '5px'); btn.style('padding', '5px 8px'); btn.style('cursor', 'pointer'); btn.style('font-size', '14px'); } // Handle window resizing dynamically function windowResized() { resizeCanvas(windowWidth, windowHeight); addressBar.size(width - 200, 24); btnGo.position(width - 60, 10); browserFrame.size(width, height - headerHeight); }
Duplicare
Executare
Cod
Cod HTML
<iframe sandbox="allow-scripts" src="/p5js/index.php?id=7251" style="width:408px; height:408px;border:solid 1px gray; overflow: scroll;"></iframe>
Duplicare script
Denumirea noului script
Du-te sus!