API tools faq
paste
itpro2005

pastebin3

itpro2005
Jul 10th, 2025 (edited)
464
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.67 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.   <meta charset="UTF-8" />
  5.   <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  6.   <title>IndexedDB Pastebin</title>
  7.   <link href="https://cdn.jsdelivr.net/npm/[email protected]/themes/prism-tomorrow.css" rel="stylesheet"/>
  8.   <style>
  9.     body { font-family: sans-serif; background: #1e1e1e; color: #f5f5f5; margin: 0; padding: 1rem; }
  10.     .container { max-width: 800px; margin: auto; background: #2d2d2d; padding: 1rem; border-radius: 8px; }
  11.     textarea, select, button, input[type="file"] {
  12.       width: 100%; margin-top: 1rem; padding: 0.5rem; font-size: 1rem;
  13.       background: #1e1e1e; color: #f5f5f5; border: 1px solid #444; border-radius: 4px;
  14.     }
  15.     pre { padding: 1rem; border-radius: 8px; overflow-x: auto; background: #1e1e1e; }
  16.     .meta { margin-top: 1rem; font-size: 0.85rem; color: #aaa; }
  17.     .hidden { display: none; }
  18.   </style>
  19. </head>
  20. <body>
  21.   <div class="container" id="create-section">
  22.     <h2>Create a New Paste</h2>
  23.     <textarea id="pasteText" rows="10" placeholder="Paste your text or code here..."></textarea>
  24.     <select id="language">
  25.       <option value="plaintext">Plain Text</option>
  26.       <option value="javascript">JavaScript</option>
  27.       <option value="python">Python</option>
  28.       <option value="bash">Bash</option>
  29.       <option value="json">JSON</option>
  30.       <option value="html">HTML</option>
  31.     </select>
  32.     <button onclick="createPaste()">Create Paste</button>
  33.     <button onclick="exportPastes()">Export Pastes</button>
  34.     <input type="file" id="importFile" accept=".json" onchange="importPastes()">
  35.   </div>
  36.  
  37.   <div class="container hidden" id="view-section">
  38.     <div style="display: flex; justify-content: space-between; align-items: center;">
  39.       <h2>View Paste</h2>
  40.       <button onclick="copyLink()">Copy Link</button>
  41.     </div>
  42.     <pre><code id="pasteOutput" class="language-plaintext"></code></pre>
  43.     <div class="meta" id="metaInfo"></div>
  44.   </div>
  45.  
  46.   <!-- Prism for syntax highlighting -->
  47.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/prism.js"></script>
  48.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/components/prism-python.min.js"></script>
  49.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/components/prism-javascript.min.js"></script>
  50.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/components/prism-json.min.js"></script>
  51.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/components/prism-bash.min.js"></script>
  52.   <script src="https://cdn.jsdelivr.net/npm/[email protected]/components/prism-markup.min.js"></script>
  53.  
  54.   <script>
  55.     const DB_NAME = 'pastebin';
  56.     const STORE_NAME = 'pastes';
  57.     let db;
  58.  
  59.     function openDatabase() {
  60.       return new Promise((resolve, reject) => {
  61.         const request = indexedDB.open(DB_NAME, 1);
  62.         request.onerror = () => reject("Failed to open DB");
  63.  
  64.         request.onsuccess = () => {
  65.           db = request.result;
  66.           resolve();
  67.         };
  68.  
  69.         request.onupgradeneeded = (e) => {
  70.           const db = e.target.result;
  71.           db.createObjectStore(STORE_NAME, { keyPath: "id" });
  72.         };
  73.       });
  74.     }
  75.  
  76.     function savePaste(paste) {
  77.       return new Promise((resolve, reject) => {
  78.         const tx = db.transaction(STORE_NAME, "readwrite");
  79.         const store = tx.objectStore(STORE_NAME);
  80.         const request = store.add(paste);
  81.  
  82.         request.onsuccess = () => resolve();
  83.         request.onerror = () => reject("Failed to save paste");
  84.       });
  85.     }
  86.  
  87.     function getPaste(id) {
  88.       return new Promise((resolve, reject) => {
  89.         const tx = db.transaction(STORE_NAME, "readonly");
  90.         const store = tx.objectStore(STORE_NAME);
  91.         const request = store.get(id);
  92.  
  93.         request.onsuccess = () => resolve(request.result);
  94.         request.onerror = () => reject("Failed to fetch paste");
  95.       });
  96.     }
  97.  
  98.     async function createPaste() {
  99.       const text = document.getElementById("pasteText").value;
  100.       const language = document.getElementById("language").value;
  101.       const id = Math.random().toString(36).substr(2, 8);
  102.       const createdAt = new Date().toISOString();
  103.  
  104.       const paste = { id, text, language, createdAt };
  105.       await savePaste(paste);
  106.       window.location.hash = id;
  107.       location.reload();
  108.     }
  109.  
  110.     async function showPaste(id) {
  111.       const paste = await getPaste(id);
  112.       if (!paste) {
  113.         alert("Paste not found");
  114.         return;
  115.       }
  116.  
  117.       document.getElementById("create-section").classList.add("hidden");
  118.       document.getElementById("view-section").classList.remove("hidden");
  119.  
  120.       const codeBlock = document.getElementById("pasteOutput");
  121.       codeBlock.className = "language-" + paste.language;
  122.       codeBlock.textContent = paste.text;
  123.       Prism.highlightElement(codeBlock);
  124.  
  125.       document.getElementById("metaInfo").textContent =
  126.         "Created at: " + new Date(paste.createdAt).toLocaleString();
  127.     }
  128.  
  129.     function copyLink() {
  130.       navigator.clipboard.writeText(window.location.href);
  131.       alert("Link copied to clipboard!");
  132.     }
  133.  
  134.     async function exportPastes() {
  135.       const tx = db.transaction(STORE_NAME, "readonly");
  136.       const store = tx.objectStore(STORE_NAME);
  137.       const request = store.getAll();
  138.  
  139.       request.onsuccess = () => {
  140.         const data = JSON.stringify(request.result, null, 2);
  141.         const blob = new Blob([data], { type: "application/json" });
  142.         const url = URL.createObjectURL(blob);
  143.  
  144.         const a = document.createElement("a");
  145.         a.href = url;
  146.         a.download = "pastes-export.json";
  147.         a.click();
  148.         URL.revokeObjectURL(url);
  149.       };
  150.  
  151.       request.onerror = () => alert("Failed to export pastes");
  152.     }
  153.  
  154.     async function importPastes() {
  155.       const fileInput = document.getElementById("importFile");
  156.       const file = fileInput.files[0];
  157.       if (!file) return;
  158.  
  159.       const text = await file.text();
  160.       let data;
  161.       try {
  162.         data = JSON.parse(text);
  163.       } catch (e) {
  164.         alert("Invalid JSON file");
  165.         return;
  166.       }
  167.  
  168.       const tx = db.transaction(STORE_NAME, "readwrite");
  169.       const store = tx.objectStore(STORE_NAME);
  170.  
  171.       for (const paste of data) {
  172.         try {
  173.           store.put(paste); // Upsert
  174.         } catch (e) {
  175.           console.error("Failed to import paste:", paste.id, e);
  176.         }
  177.       }
  178.  
  179.       alert("Import completed! Reload the page to view imported pastes.");
  180.     }
  181.  
  182.     (async () => {
  183.       await openDatabase();
  184.       const hash = window.location.hash.replace("#", "");
  185.       if (hash) {
  186.         await showPaste(hash);
  187.       }
  188.     })();
  189.   </script>
  190. </body>
  191. </html>
  192.  
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!