Pacific Media Extractor<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@400;700&display=swap\" rel=\"stylesheet\">\n <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\" rel=\"stylesheet\">\n <style>\n :root {\n --primary-color: #3498db;\n --secondary-color: #2980b9;\n --background-color: #f5f5f5;\n --text-color: #333;\n --border-color: #ddd;\n --header-color: #2c3e50;\n --button-color: #2980b9; \n --button-hover-color: #3498db; \n --border-radius: 8px;\n }\n\n body, html {\n margin: 0;\n padding: 0;\n font-family: 'Roboto', sans-serif;\n min-height: 100vh;\n background-color: var(--background-color);\n color: var(--text-color);\n transition: all 0.3s ease;\n }\n\n .container {\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n width: 100vw; \/* Assurez-vous que la largeur du conteneur occupe toute la largeur de la fen\u00eatre *\/\n max-width: 100%; \/* D\u00e9sactive toute limitation de la largeur maximale *\/\n margin: 0 auto; \/* Centrer le conteneur horizontalement *\/\n }\n\n .hero-section {\n background: rgba(52, 152, 219, 0.8);\n padding: 4rem 2rem;\n text-align: center;\n color: white;\n position: relative;\n overflow: hidden;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n #matrix-canvas {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n }\n\n .hero-content {\n position: relative;\n z-index: 2;\n }\n\n .hero-section h1 {\n font-size: 2.5rem;\n margin-bottom: 1rem;\n font-weight: 700;\n }\n\n .hero-section p {\n font-size: 1.1rem;\n max-width: 800px;\n margin: 0 auto 2rem;\n line-height: 1.6;\n }\n\n .input-group {\n display: flex;\n gap: 0.8rem;\n max-width: 800px;\n margin: 0 auto;\n }\n\n #url-input {\n flex: 1;\n padding: 0.8rem;\n font-size: 1rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n background-color: white;\n color: var(--text-color);\n }\n\n #extract-btn, #reset-btn {\n padding: 0.8rem 1.5rem;\n background-color: var(--button-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n font-size: 1rem;\n font-weight: 600;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n }\n\n #extract-btn:hover, #reset-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #filter-container, #download-all-container, #media-container {\n display: none;\n }\n\n #filter-container {\n display: flex;\n justify-content: space-between;\n margin-bottom: 1.5rem;\n flex-wrap: wrap;\n }\n\n #filter-container select {\n padding: 0.5rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n font-size: 1rem;\n background-color: var(--background-color);\n margin-bottom: 0.5rem;\n }\n\n main {\n flex: 1;\n padding: 1.5rem;\n background-color: white;\n display: none;\n }\n\n #media-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 1.5rem;\n }\n\n .media-card {\n background-color: white;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n overflow: hidden;\n transition: transform 0.3s ease, box-shadow 0.3s ease;\n position: relative;\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\n }\n\n .media-card:hover {\n transform: translateY(-10px) scale(1.05);\n box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);\n }\n\n .media-preview-container {\n position: relative;\n width: 100%;\n height: 200px;\n overflow: hidden;\n }\n\n .media-preview {\n width: 100%;\n height: 100%;\n object-fit: cover;\n cursor: pointer;\n }\n\n .media-expand-icon {\n position: absolute;\n top: 10px;\n right: 10px;\n background-color: rgba(255, 255, 255, 0.7);\n border-radius: 50%;\n width: 30px;\n height: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n transition: background-color 0.3s ease;\n }\n\n .media-expand-icon:hover {\n background-color: rgba(255, 255, 255, 0.9);\n }\n\n .media-info {\n padding: 1rem;\n }\n\n .media-info h3 {\n margin-bottom: 0.5rem;\n font-size: 1.1rem;\n color: var(--header-color);\n }\n\n .media-info p {\n margin-bottom: 1rem;\n font-size: 0.9rem;\n }\n\n .media-format {\n font-size: 0.9rem;\n color: var(--header-color);\n font-weight: bold;\n }\n\n .format-select {\n width: 100%;\n padding: 0.5rem;\n margin-bottom: 0.5rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n font-size: 0.9rem;\n background-color: var(--background-color);\n }\n\n .download-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: 0.5rem;\n background-color: var(--button-color);\n color: white;\n text-align: center;\n text-decoration: none;\n border-radius: var (--border-radius);\n font-size: 0.9rem;\n font-weight: 600;\n transition: background-color 0.3s ease;\n }\n\n .download-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #download-all-container {\n margin-top: 2rem;\n text-align: center;\n display: none;\n }\n\n #format-select-all {\n padding: 0.5rem;\n font-size: 1rem;\n margin-right: 0.5rem;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background-color);\n max-width: 100%;\n width: 100%;\n text-align: center;\n }\n\n #download-all-btn {\n padding: 0.5rem 1rem;\n font-size: 1rem;\n background-color: var(--button-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background-color 0.3s ease;\n display: inline-flex;\n align-items: center;\n }\n\n #download-all-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #download-original-btn {\n margin-top: 1rem;\n padding: 0.5rem 1rem;\n font-size: 1rem;\n background-color: var(--secondary-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background-color 0.3s ease, transform 0.3s ease;\n display: inline-flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n position: relative;\n }\n\n #download-original-btn:hover {\n background-color: var(--primary-color);\n transform: scale(1.05);\n }\n\n #download-original-btn::after {\n content: \"Format d'origine\";\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--primary-color);\n color: white;\n padding: 0.3rem 0.6rem;\n font-size: 0.8rem;\n border-radius: 4px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 0.3s ease;\n white-space: nowrap;\n }\n\n #download-original-btn:hover::after {\n opacity: 1;\n }\n\n #loading-container {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.8);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n }\n\n .loading-spinner {\n width: 100px;\n height: 100px;\n border: 5px solid #f3f3f3;\n border-top: 5px solid var(--primary-color);\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n @keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n .modal {\n display: none;\n position: fixed;\n z-index: 1001;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: rgba(0, 0, 0, 0.9);\n }\n\n .modal-content {\n margin: auto;\n display: block;\n max-width: 90%;\n max-height: 90vh;\n height: 90vh;\n }\n\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n\n @media (max-width: 768px) {\n .hero-section {\n padding: 2rem 1rem;\n }\n\n .hero-section h1 {\n font-size: 2rem;\n }\n\n .hero-section p {\n font-size: 1rem;\n }\n\n .input-group {\n flex-direction: column;\n }\n\n #url-input, #extract-btn, #reset-btn {\n width: 100%;\n }\n\n #media-container {\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); \n }\n\n .media-card {\n font-size: 0.9rem;\n }\n\n .media-preview-container {\n height: 150px; \n }\n\n .modal-content {\n width: 95%;\n }\n }\n\n @media (max-width: 480px) {\n .hero-section h1 {\n font-size: 1.8rem;\n }\n\n .hero-section p {\n font-size: 0.9rem;\n }\n\n #media-container {\n grid-template-columns: 1fr; \n }\n\n .media-preview-container {\n height: 150px; \n }\n\n .media-preview {\n max-width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n .media-info h3 {\n font-size: 1rem; \n }\n\n .download-btn {\n font-size: 0.8rem; \n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"hero-section\">\n <canvas id=\"matrix-canvas\"><\/canvas>\n <div class=\"hero-content\">\n <h1>Pacific Media Extractor<\/h1>\n <p>Extraire des m\u00e9dias d'un site web n'a jamais \u00e9t\u00e9 aussi facile. Pacific Media Extractor est un outil en ligne puissant et facile \u00e0 utiliser pour extraire et t\u00e9l\u00e9charger des images, vid\u00e9os, audios, et documents PDF de n'importe quel site web. Parfait pour les concepteurs web, les marketeurs ou les cr\u00e9ateurs de contenu. Avec cet outil, r\u00e9cup\u00e9rez tous les m\u00e9dias d'un site en quelques clics. Entrez simplement l'URL, extrayez les m\u00e9dias et t\u00e9l\u00e9chargez-les dans votre format pr\u00e9f\u00e9r\u00e9. Ce processus rapide et efficace permet de gagner du temps tout en optimisant la gestion de vos ressources visuelles.<\/p>\n <div class=\"input-group\">\n <input type=\"url\" id=\"url-input\" placeholder=\"Entrez l'URL du site web\">\n <button id=\"extract-btn\"><i class=\"fas fa-camera\"><\/i> Extraire les M\u00e9dias<\/button>\n <button id=\"reset-btn\" style=\"display: none;\"><i class=\"fas fa-redo\"><\/i> R\u00e9initialiser<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <main id=\"main-content\">\n <div id=\"filter-container\">\n <select id=\"filter-media-type\">\n <option value=\"all\">Tous les Types<\/option>\n <option value=\"image\">Images<\/option>\n <option value=\"video\">Vid\u00e9os<\/option>\n <option value=\"audio\">Audios<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <select id=\"filter-media-format\">\n <option value=\"all\">Tous les Formats<\/option>\n <option value=\"jpg\">JPG<\/option>\n <option value=\"png\">PNG<\/option>\n <option value=\"webp\">WebP<\/option>\n <option value=\"gif\">GIF (Courtes vid\u00e9os)<\/option>\n <option value=\"mp4\">MP4<\/option>\n <option value=\"webm\">WebM (Vid\u00e9o)<\/option>\n <option value=\"mp3\">MP3<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <\/div>\n <div id=\"media-container\"><\/div>\n <div id=\"download-all-container\">\n <select id=\"format-select-all\">\n <option value=\"original\">Format Original<\/option>\n <option value=\"jpg\">JPG (Image)<\/option>\n <option value=\"png\">PNG (Image)<\/option>\n <option value=\"webp\">WebP (Image)<\/option>\n <option value=\"mp4\">MP4 (Vid\u00e9o)<\/option>\n <option value=\"webm\">WebM (Vid\u00e9o)<\/option>\n <option value=\"mp3\">MP3 (Audio)<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <button id=\"download-all-btn\"><i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger Tous les M\u00e9dias<\/button>\n <button id=\"download-original-btn\"><i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger Tous les M\u00e9dias (Formats d'origine)<\/button>\n <\/div>\n <\/main>\n <\/div>\n\n <div id=\"loading-container\" style=\"display: none;\">\n <div class=\"loading-spinner\"><\/div>\n <\/div>\n\n <div id=\"media-modal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <div class=\"modal-content\" id=\"modal-content\"><\/div>\n <\/div>\n\n \n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/@ffmpeg\/ffmpeg@0.10.1\/dist\/ffmpeg.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jszip\/3.7.1\/jszip.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/FileSaver.js\/2.0.5\/FileSaver.min.js\"><\/script>\n <script>\n const urlInput = document.getElementById('url-input');\n const extractBtn = document.getElementById('extract-btn');\n const resetBtn = document.getElementById('reset-btn');\n const mediaContainer = document.getElementById('media-container');\n const downloadAllContainer = document.getElementById('download-all-container');\n const formatSelectAll = document.getElementById('format-select-all');\n const downloadAllBtn = document.getElementById('download-all-btn');\n const downloadOriginalBtn = document.getElementById('download-original-btn');\n const loadingContainer = document.getElementById('loading-container');\n const mediaModal = document.getElementById('media-modal');\n const modalContent = document.getElementById('modal-content');\n const closeBtn = document.querySelector('.close');\n const filterMediaType = document.getElementById('filter-media-type');\n const filterMediaFormat = document.getElementById('filter-media-format');\n const filterContainer = document.getElementById('filter-container');\n const mainContent = document.getElementById('main-content');\n\n extractBtn.addEventListener('click', extractMedia);\n downloadAllBtn.addEventListener('click', downloadAllMedia);\n downloadOriginalBtn.addEventListener('click', downloadAllMediaInOriginalFormats);\n resetBtn.addEventListener('click', resetPage);\n closeBtn.addEventListener('click', () => {\n mediaModal.style.display = 'none';\n });\n\n filterMediaType.addEventListener('change', filterMedia);\n filterMediaFormat.addEventListener('change', filterMedia);\n\n function resetPage() {\n urlInput.value = '';\n mediaContainer.innerHTML = '';\n downloadAllContainer.style.display = 'none';\n filterContainer.style.display = 'none';\n resetBtn.style.display = 'none';\n mainContent.style.display = 'none';\n }\n\n function resizeCanvas() {\n const canvas = document.getElementById('matrix-canvas');\n const ctx = canvas.getContext('2d');\n canvas.width = canvas.offsetWidth;\n canvas.height = canvas.offsetHeight;\n\n const letters = 'ABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZ';\n const fontSize = 10;\n const columns = canvas.width \/ fontSize;\n\n const drops = [];\n for (let i = 0; i < columns; i++) {\n drops[i] = 1;\n }\n\n function drawMatrix() {\n ctx.fillStyle = 'rgba(52, 152, 219, 0.05)';\n ctx.fillRect(0, 0, canvas.width, canvas.height);\n\n ctx.fillStyle = '#ffffff';\n ctx.font = fontSize + 'px monospace';\n\n for (let i = 0; i < drops.length; i++) {\n const text = letters[Math.floor(Math.random() * letters.length)];\n ctx.fillText(text, i * fontSize, drops[i] * fontSize);\n\n if (drops[i] * fontSize > canvas.height && Math.random() > 0.975) {\n drops[i] = 0;\n }\n\n drops[i]++;\n }\n }\n\n function animate() {\n drawMatrix();\n requestAnimationFrame(animate);\n }\n\n animate();\n }\n\n resizeCanvas();\n window.addEventListener('resize', resizeCanvas);\n\n async function extractMedia() {\n const url = urlInput.value;\n if (!url) return;\n\n showLoading();\n mediaContainer.innerHTML = '';\n downloadAllContainer.style.display = 'none';\n filterContainer.style.display = 'none';\n resetBtn.style.display = 'none';\n mainContent.style.display = 'none';\n\n try {\n const response = await fetch(`https:\/\/api.allorigins.win\/get?url=${encodeURIComponent(url)}`);\n const data = await response.json();\n const html = data.contents;\n\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text\/html');\n \n const images = doc.querySelectorAll('img');\n const videos = doc.querySelectorAll('video');\n const audios = doc.querySelectorAll('audio');\n const pdfLinks = Array.from(doc.querySelectorAll('a')).filter(link => link.href.endsWith('.pdf'));\n\n if (images.length > 0 || videos.length > 0 || audios.length > 0 || pdfLinks.length > 0) {\n for (const img of images) {\n const src = new URL(img.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'image');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const video of videos) {\n const src = new URL(video.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'video');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const audio of audios) {\n const src = new URL(audio.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'audio');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const pdfLink of pdfLinks) {\n const src = pdfLink.href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'pdf');\n mediaContainer.appendChild(mediaCard);\n }\n\n downloadAllContainer.style.display = 'block';\n filterContainer.style.display = 'flex';\n mediaContainer.style.display = 'grid';\n resetBtn.style.display = 'inline-flex';\n mainContent.style.display = 'block';\n filterMedia(); \/\/ Filtre les m\u00e9dias apr\u00e8s extraction\n } else {\n mediaContainer.innerHTML = '<p>Aucun m\u00e9dia trouv\u00e9 sur ce site web.<\/p>';\n mediaContainer.style.display = 'block';\n }\n\n hideLoading();\n } catch (error) {\n console.error('Erreur lors de l\\'extraction des m\u00e9dias:', error);\n mediaContainer.innerHTML = '<p>Erreur lors de l\\'extraction des m\u00e9dias. Veuillez r\u00e9essayer.<\/p>';\n mediaContainer.style.display = 'block';\n hideLoading();\n }\n }\n\n function createMediaCard(src, fileName, type) {\n const card = document.createElement('div');\n card.className = 'media-card';\n card.dataset.type = type;\n card.dataset.format = fileName.split('.').pop().toLowerCase();\n\n let previewContent;\n if (type === 'image') {\n previewContent = `<img decoding=\"async\" class=\"media-preview\" src=\"${src}\" alt=\"${fileName}\">`;\n } else if (type === 'video') {\n previewContent = `<video class=\"media-preview\" src=\"${src}\" controls><\/video>`;\n } else if (type === 'audio') {\n previewContent = `<audio class=\"media-preview\" src=\"${src}\" controls><\/audio>`;\n } else if (type === 'pdf') {\n previewContent = `<iframe class=\"media-preview\" src=\"${src}\" frameborder=\"0\"><\/iframe>`;\n }\n\n card.innerHTML = `\n <div class=\"media-preview-container\">\n ${previewContent}\n <div class=\"media-expand-icon\">\n <i class=\"fas fa-expand\"><\/i>\n <\/div>\n <\/div>\n <div class=\"media-info\">\n <h3>${fileName}<\/h3>\n <p class=\"media-format\">${card.dataset.format.toUpperCase()}<\/p>\n <select class=\"format-select\">\n <option value=\"original\">Format Original<\/option>\n <option value=\"jpg\" ${type !== 'image' ? 'disabled' : ''}>JPG<\/option>\n <option value=\"png\" ${type !== 'image' ? 'disabled' : ''}>PNG<\/option>\n <option value=\"webp\" ${type !== 'image' ? 'disabled' : ''}>WebP<\/option>\n <option value=\"gif\" ${type !== 'video' ? 'disabled' : ''} data-max-duration=\"10\">GIF (Courtes vid\u00e9os)<\/option>\n <option value=\"mp4\" ${type !== 'video' ? 'disabled' : ''}>MP4<\/option>\n <option value=\"webm\" ${type !== 'video' ? 'disabled' : ''}>WebM<\/option>\n <option value=\"mp3\" ${type !== 'audio' ? 'disabled' : ''}>MP3<\/option>\n <option value=\"pdf\" ${type !== 'pdf' ? 'disabled' : ''}>PDF<\/option>\n <\/select>\n <a href=\"#\" class=\"download-btn\" data-src=\"${src}\" data-filename=\"${fileName}\" data-type=\"${type}\">\n <i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger\n <\/a>\n <\/div>\n `;\n\n const downloadBtn = card.querySelector('.download-btn');\n downloadBtn.addEventListener('click', (e) => {\n e.preventDefault();\n const format = card.querySelector('.format-select').value;\n downloadMedia(src, fileName, format, type);\n });\n\n const expandIcon = card.querySelector('.media-expand-icon');\n expandIcon.addEventListener('click', () => {\n openMediaModal(src, type);\n });\n\n return card;\n }\n\n function openMediaModal(src, type) {\n let content;\n if (type === 'image') {\n content = `<img decoding=\"async\" src=\"${src}\" alt=\"Media en pleine \u00e9cran\" style=\"width: 100%; height: auto;\">`;\n } else if (type === 'video') {\n content = `<video src=\"${src}\" controls autoplay style=\"width: 100%; height: auto;\"><\/video>`;\n } else if (type === 'audio') {\n content = `<audio src=\"${src}\" controls autoplay style=\"width: 100%;\"><\/audio>`;\n } else if (type === 'pdf') {\n content = `<iframe src=\"${src}\" frameborder=\"0\" style=\"width: 100%; height: 90vh;\"><\/iframe>`;\n }\n\n modalContent.innerHTML = content;\n mediaModal.style.display = 'block';\n }\n\n async function downloadMedia(src, fileName, format, type) {\n try {\n const proxyUrl = `https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`;\n const response = await fetch(proxyUrl, {\n mode: 'cors',\n });\n\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n\n const blob = await response.blob();\n const newFileName = format === 'original' || (type !== 'image' && format !== 'gif') ? fileName : `${fileName.split('.')[0]}.${format}`;\n\n if (format === 'gif' && type === 'video') {\n const video = document.createElement('video');\n video.src = src;\n video.onloadedmetadata = function() {\n if (video.duration <= 10) {\n convertVideoToGIF(src, newFileName);\n } else {\n alert('La vid\u00e9o est trop longue pour \u00eatre convertie en GIF.');\n }\n };\n } else {\n saveAs(blob, newFileName);\n }\n } catch (error) {\n console.error('Erreur lors du t\u00e9l\u00e9chargement du m\u00e9dia:', error);\n alert('Erreur lors du t\u00e9l\u00e9chargement du m\u00e9dia. Veuillez r\u00e9essayer.');\n }\n }\n\n async function convertVideoToGIF(src, newFileName) {\n const ffmpeg = FFmpeg.createFFmpeg({ log: true });\n await ffmpeg.load();\n const videoData = await fetch(src).then(response => response.arrayBuffer());\n ffmpeg.FS('writeFile', 'input.mp4', new Uint8Array(videoData));\n await ffmpeg.run('-i', 'input.mp4', '-t', '10', '-vf', 'fps=10,scale=320:-1:flags=lanczos', '-c:v', 'gif', 'output.gif');\n const gifData = ffmpeg.FS('readFile', 'output.gif');\n const blob = new Blob([gifData.buffer], { type: 'image\/gif' });\n saveAs(blob, newFileName);\n }\n\n async function downloadAllMedia() {\n const format = formatSelectAll.value;\n const zip = new JSZip();\n const mediaCards = mediaContainer.querySelectorAll('.media-card');\n\n showLoading();\n\n const downloadPromises = [];\n\n for (const mediaCard of mediaCards) {\n const src = mediaCard.querySelector('.download-btn').dataset.src;\n const fileName = mediaCard.querySelector('.download-btn').dataset.filename;\n const type = mediaCard.querySelector('.download-btn').dataset.type;\n const newFileName = format === 'original' || (type !== 'image' && format !== 'gif') ? fileName : `${fileName.split('.')[0]}.${format}`;\n\n const downloadPromise = fetch(`https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`, {\n mode: 'cors',\n })\n .then(response => {\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n return response.blob();\n })\n .then(blob => {\n if (format === 'gif' && type === 'video') {\n const video = document.createElement('video');\n video.src = src;\n video.onloadedmetadata = function() {\n if (video.duration <= 10) {\n \/\/ Conversion en GIF si la vid\u00e9o est assez courte\n convertVideoToGIF(src, newFileName);\n } else {\n alert('Une des vid\u00e9os est trop longue pour \u00eatre convertie en GIF.');\n }\n };\n } else {\n zip.file(newFileName, blob);\n }\n })\n .catch(error => {\n console.error('Erreur lors de l\\'ajout du m\u00e9dia au zip:', error);\n });\n\n downloadPromises.push(downloadPromise);\n }\n\n try {\n await Promise.all(downloadPromises);\n const zipBlob = await zip.generateAsync({ type: 'blob' });\n saveAs(zipBlob, 'medias_extraits.zip');\n } catch (error) {\n console.error('Erreur lors de la g\u00e9n\u00e9ration du fichier ZIP:', error);\n alert('Une erreur est survenue lors de la cr\u00e9ation du fichier ZIP. Veuillez r\u00e9essayer.');\n } finally {\n hideLoading();\n }\n }\n\n async function downloadAllMediaInOriginalFormats() {\n const zip = new JSZip();\n const mediaCards = mediaContainer.querySelectorAll('.media-card');\n\n showLoading();\n\n const downloadPromises = [];\n\n for (const mediaCard of mediaCards) {\n const src = mediaCard.querySelector('.download-btn').dataset.src;\n const fileName = mediaCard.querySelector('.download-btn').dataset.filename;\n\n const downloadPromise = fetch(`https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`, {\n mode: 'cors',\n })\n .then(response => {\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n return response.blob();\n })\n .then(blob => {\n zip.file(fileName, blob);\n })\n .catch(error => {\n console.error('Erreur lors de l\\'ajout du m\u00e9dia au zip:', error);\n });\n\n downloadPromises.push(downloadPromise);\n }\n\n try {\n await Promise.all(downloadPromises);\n const zipBlob = await zip.generateAsync({ type: 'blob' });\n saveAs(zipBlob, 'medias_extraits.zip');\n } catch (error) {\n console.error('Erreur lors de la g\u00e9n\u00e9ration du fichier ZIP:', error);\n alert('Une erreur est survenue lors de la cr\u00e9ation du fichier ZIP. Veuillez r\u00e9essayer.');\n } finally {\n hideLoading();\n }\n }\n\n function filterMedia() {\n const type = filterMediaType.value;\n const format = filterMediaFormat.value;\n\n const cards = mediaContainer.querySelectorAll('.media-card');\n cards.forEach(card => {\n const cardType = card.dataset.type;\n const cardFormat = card.dataset.format;\n\n const typeMatch = type === 'all' || cardType === type;\n const formatMatch = format === 'all' || cardFormat === format;\n\n if (typeMatch && formatMatch) {\n card.style.display = '';\n } else {\n card.style.display = 'none';\n }\n });\n }\n\n function showLoading() {\n loadingContainer.style.display = 'flex';\n }\n\n function hideLoading() {\n loadingContainer.style.display = 'none';\n }\n <\/script>\n<\/body>\n<\/html>\n\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Pacific Media Extractor Pacific Media Extractor Extraire des m\u00e9dias d’un site web n’a jamais \u00e9t\u00e9 aussi facile. Pacific Media Extractor est un outil en ligne puissant et facile \u00e0 utiliser pour extraire et t\u00e9l\u00e9charger des images, vid\u00e9os, audios, et documents PDF de n’importe quel site web. Parfait pour les concepteurs web, les marketeurs ou les […]<\/p>\n","protected":false},"author":1,"featured_media":822,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-820","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-ressources"],"yoast_head":"\n<title>Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor<\/title>\n<meta name=\"description\" content=\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor\" \/>\n<meta property=\"og:description\" content=\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\" \/>\n<meta property=\"og:url\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Extractor\" \/>\n<meta property=\"article:published_time\" content=\"2024-09-03T12:00:30+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-03T12:01:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.png\" \/>\n\t<meta property=\"og:image:width\" content=\"698\" \/>\n\t<meta property=\"og:image:height\" content=\"466\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\",\"name\":\"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor\",\"isPartOf\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"datePublished\":\"2024-09-03T12:00:30+00:00\",\"dateModified\":\"2024-09-03T12:01:34+00:00\",\"author\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\"},\"description\":\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\",\"breadcrumb\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"contentUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"width\":698,\"height\":466},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/pacific-webtools.com\/web-extractor\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Pacific Media Extractor – Extraire M\u00e9dias de Sites Web\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/\",\"name\":\"Web Extractor\",\"description\":\"Extracteur de Code\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/pacific-webtools.com\/web-extractor\"],\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/\"}]}<\/script>\n","yoast_head_json":{"title":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","og_locale":"fr_FR","og_type":"article","og_title":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","og_description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","og_url":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","og_site_name":"Web Extractor","article_published_time":"2024-09-03T12:00:30+00:00","article_modified_time":"2024-09-03T12:01:34+00:00","og_image":[{"width":698,"height":466,"url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.png","type":"image\/png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"admin","Dur\u00e9e de lecture estim\u00e9e":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","url":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","name":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","isPartOf":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website"},"primaryImageOfPage":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage"},"image":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage"},"thumbnailUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","datePublished":"2024-09-03T12:00:30+00:00","dateModified":"2024-09-03T12:01:34+00:00","author":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48"},"description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","breadcrumb":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage","url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","contentUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","width":698,"height":466},{"@type":"BreadcrumbList","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/pacific-webtools.com\/web-extractor\/"},{"@type":"ListItem","position":2,"name":"Pacific Media Extractor – Extraire M\u00e9dias de Sites Web"}]},{"@type":"WebSite","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website","url":"https:\/\/pacific-webtools.com\/web-extractor\/","name":"Web Extractor","description":"Extracteur de Code","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48","name":"admin","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/pacific-webtools.com\/web-extractor"],"url":"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820"}],"collection":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/comments?post=820"}],"version-history":[{"count":4,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820\/revisions"}],"predecessor-version":[{"id":825,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820\/revisions\/825"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media\/822"}],"wp:attachment":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media?parent=820"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/categories?post=820"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/tags?post=820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Pacific Media Extractor<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@400;700&display=swap\" rel=\"stylesheet\">\n <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\" rel=\"stylesheet\">\n <style>\n :root {\n --primary-color: #3498db;\n --secondary-color: #2980b9;\n --background-color: #f5f5f5;\n --text-color: #333;\n --border-color: #ddd;\n --header-color: #2c3e50;\n --button-color: #2980b9; \n --button-hover-color: #3498db; \n --border-radius: 8px;\n }\n\n body, html {\n margin: 0;\n padding: 0;\n font-family: 'Roboto', sans-serif;\n min-height: 100vh;\n background-color: var(--background-color);\n color: var(--text-color);\n transition: all 0.3s ease;\n }\n\n .container {\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n width: 100vw; \/* Assurez-vous que la largeur du conteneur occupe toute la largeur de la fen\u00eatre *\/\n max-width: 100%; \/* D\u00e9sactive toute limitation de la largeur maximale *\/\n margin: 0 auto; \/* Centrer le conteneur horizontalement *\/\n }\n\n .hero-section {\n background: rgba(52, 152, 219, 0.8);\n padding: 4rem 2rem;\n text-align: center;\n color: white;\n position: relative;\n overflow: hidden;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n #matrix-canvas {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n }\n\n .hero-content {\n position: relative;\n z-index: 2;\n }\n\n .hero-section h1 {\n font-size: 2.5rem;\n margin-bottom: 1rem;\n font-weight: 700;\n }\n\n .hero-section p {\n font-size: 1.1rem;\n max-width: 800px;\n margin: 0 auto 2rem;\n line-height: 1.6;\n }\n\n .input-group {\n display: flex;\n gap: 0.8rem;\n max-width: 800px;\n margin: 0 auto;\n }\n\n #url-input {\n flex: 1;\n padding: 0.8rem;\n font-size: 1rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n background-color: white;\n color: var(--text-color);\n }\n\n #extract-btn, #reset-btn {\n padding: 0.8rem 1.5rem;\n background-color: var(--button-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n font-size: 1rem;\n font-weight: 600;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n }\n\n #extract-btn:hover, #reset-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #filter-container, #download-all-container, #media-container {\n display: none;\n }\n\n #filter-container {\n display: flex;\n justify-content: space-between;\n margin-bottom: 1.5rem;\n flex-wrap: wrap;\n }\n\n #filter-container select {\n padding: 0.5rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n font-size: 1rem;\n background-color: var(--background-color);\n margin-bottom: 0.5rem;\n }\n\n main {\n flex: 1;\n padding: 1.5rem;\n background-color: white;\n display: none;\n }\n\n #media-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 1.5rem;\n }\n\n .media-card {\n background-color: white;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n overflow: hidden;\n transition: transform 0.3s ease, box-shadow 0.3s ease;\n position: relative;\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\n }\n\n .media-card:hover {\n transform: translateY(-10px) scale(1.05);\n box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);\n }\n\n .media-preview-container {\n position: relative;\n width: 100%;\n height: 200px;\n overflow: hidden;\n }\n\n .media-preview {\n width: 100%;\n height: 100%;\n object-fit: cover;\n cursor: pointer;\n }\n\n .media-expand-icon {\n position: absolute;\n top: 10px;\n right: 10px;\n background-color: rgba(255, 255, 255, 0.7);\n border-radius: 50%;\n width: 30px;\n height: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n transition: background-color 0.3s ease;\n }\n\n .media-expand-icon:hover {\n background-color: rgba(255, 255, 255, 0.9);\n }\n\n .media-info {\n padding: 1rem;\n }\n\n .media-info h3 {\n margin-bottom: 0.5rem;\n font-size: 1.1rem;\n color: var(--header-color);\n }\n\n .media-info p {\n margin-bottom: 1rem;\n font-size: 0.9rem;\n }\n\n .media-format {\n font-size: 0.9rem;\n color: var(--header-color);\n font-weight: bold;\n }\n\n .format-select {\n width: 100%;\n padding: 0.5rem;\n margin-bottom: 0.5rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n font-size: 0.9rem;\n background-color: var(--background-color);\n }\n\n .download-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: 0.5rem;\n background-color: var(--button-color);\n color: white;\n text-align: center;\n text-decoration: none;\n border-radius: var (--border-radius);\n font-size: 0.9rem;\n font-weight: 600;\n transition: background-color 0.3s ease;\n }\n\n .download-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #download-all-container {\n margin-top: 2rem;\n text-align: center;\n display: none;\n }\n\n #format-select-all {\n padding: 0.5rem;\n font-size: 1rem;\n margin-right: 0.5rem;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background-color);\n max-width: 100%;\n width: 100%;\n text-align: center;\n }\n\n #download-all-btn {\n padding: 0.5rem 1rem;\n font-size: 1rem;\n background-color: var(--button-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background-color 0.3s ease;\n display: inline-flex;\n align-items: center;\n }\n\n #download-all-btn:hover {\n background-color: var(--button-hover-color);\n }\n\n #download-original-btn {\n margin-top: 1rem;\n padding: 0.5rem 1rem;\n font-size: 1rem;\n background-color: var(--secondary-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background-color 0.3s ease, transform 0.3s ease;\n display: inline-flex;\n align-items: center;\n width: 100%;\n max-width: 100%;\n position: relative;\n }\n\n #download-original-btn:hover {\n background-color: var(--primary-color);\n transform: scale(1.05);\n }\n\n #download-original-btn::after {\n content: \"Format d'origine\";\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--primary-color);\n color: white;\n padding: 0.3rem 0.6rem;\n font-size: 0.8rem;\n border-radius: 4px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 0.3s ease;\n white-space: nowrap;\n }\n\n #download-original-btn:hover::after {\n opacity: 1;\n }\n\n #loading-container {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.8);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n }\n\n .loading-spinner {\n width: 100px;\n height: 100px;\n border: 5px solid #f3f3f3;\n border-top: 5px solid var(--primary-color);\n border-radius: 50%;\n animation: spin 1s linear infinite;\n }\n\n @keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n .modal {\n display: none;\n position: fixed;\n z-index: 1001;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: rgba(0, 0, 0, 0.9);\n }\n\n .modal-content {\n margin: auto;\n display: block;\n max-width: 90%;\n max-height: 90vh;\n height: 90vh;\n }\n\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n\n @media (max-width: 768px) {\n .hero-section {\n padding: 2rem 1rem;\n }\n\n .hero-section h1 {\n font-size: 2rem;\n }\n\n .hero-section p {\n font-size: 1rem;\n }\n\n .input-group {\n flex-direction: column;\n }\n\n #url-input, #extract-btn, #reset-btn {\n width: 100%;\n }\n\n #media-container {\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); \n }\n\n .media-card {\n font-size: 0.9rem;\n }\n\n .media-preview-container {\n height: 150px; \n }\n\n .modal-content {\n width: 95%;\n }\n }\n\n @media (max-width: 480px) {\n .hero-section h1 {\n font-size: 1.8rem;\n }\n\n .hero-section p {\n font-size: 0.9rem;\n }\n\n #media-container {\n grid-template-columns: 1fr; \n }\n\n .media-preview-container {\n height: 150px; \n }\n\n .media-preview {\n max-width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n .media-info h3 {\n font-size: 1rem; \n }\n\n .download-btn {\n font-size: 0.8rem; \n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"hero-section\">\n <canvas id=\"matrix-canvas\"><\/canvas>\n <div class=\"hero-content\">\n <h1>Pacific Media Extractor<\/h1>\n <p>Extraire des m\u00e9dias d'un site web n'a jamais \u00e9t\u00e9 aussi facile. Pacific Media Extractor est un outil en ligne puissant et facile \u00e0 utiliser pour extraire et t\u00e9l\u00e9charger des images, vid\u00e9os, audios, et documents PDF de n'importe quel site web. Parfait pour les concepteurs web, les marketeurs ou les cr\u00e9ateurs de contenu. Avec cet outil, r\u00e9cup\u00e9rez tous les m\u00e9dias d'un site en quelques clics. Entrez simplement l'URL, extrayez les m\u00e9dias et t\u00e9l\u00e9chargez-les dans votre format pr\u00e9f\u00e9r\u00e9. Ce processus rapide et efficace permet de gagner du temps tout en optimisant la gestion de vos ressources visuelles.<\/p>\n <div class=\"input-group\">\n <input type=\"url\" id=\"url-input\" placeholder=\"Entrez l'URL du site web\">\n <button id=\"extract-btn\"><i class=\"fas fa-camera\"><\/i> Extraire les M\u00e9dias<\/button>\n <button id=\"reset-btn\" style=\"display: none;\"><i class=\"fas fa-redo\"><\/i> R\u00e9initialiser<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <main id=\"main-content\">\n <div id=\"filter-container\">\n <select id=\"filter-media-type\">\n <option value=\"all\">Tous les Types<\/option>\n <option value=\"image\">Images<\/option>\n <option value=\"video\">Vid\u00e9os<\/option>\n <option value=\"audio\">Audios<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <select id=\"filter-media-format\">\n <option value=\"all\">Tous les Formats<\/option>\n <option value=\"jpg\">JPG<\/option>\n <option value=\"png\">PNG<\/option>\n <option value=\"webp\">WebP<\/option>\n <option value=\"gif\">GIF (Courtes vid\u00e9os)<\/option>\n <option value=\"mp4\">MP4<\/option>\n <option value=\"webm\">WebM (Vid\u00e9o)<\/option>\n <option value=\"mp3\">MP3<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <\/div>\n <div id=\"media-container\"><\/div>\n <div id=\"download-all-container\">\n <select id=\"format-select-all\">\n <option value=\"original\">Format Original<\/option>\n <option value=\"jpg\">JPG (Image)<\/option>\n <option value=\"png\">PNG (Image)<\/option>\n <option value=\"webp\">WebP (Image)<\/option>\n <option value=\"mp4\">MP4 (Vid\u00e9o)<\/option>\n <option value=\"webm\">WebM (Vid\u00e9o)<\/option>\n <option value=\"mp3\">MP3 (Audio)<\/option>\n <option value=\"pdf\">PDF<\/option>\n <\/select>\n <button id=\"download-all-btn\"><i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger Tous les M\u00e9dias<\/button>\n <button id=\"download-original-btn\"><i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger Tous les M\u00e9dias (Formats d'origine)<\/button>\n <\/div>\n <\/main>\n <\/div>\n\n <div id=\"loading-container\" style=\"display: none;\">\n <div class=\"loading-spinner\"><\/div>\n <\/div>\n\n <div id=\"media-modal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <div class=\"modal-content\" id=\"modal-content\"><\/div>\n <\/div>\n\n \n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/@ffmpeg\/ffmpeg@0.10.1\/dist\/ffmpeg.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jszip\/3.7.1\/jszip.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/FileSaver.js\/2.0.5\/FileSaver.min.js\"><\/script>\n <script>\n const urlInput = document.getElementById('url-input');\n const extractBtn = document.getElementById('extract-btn');\n const resetBtn = document.getElementById('reset-btn');\n const mediaContainer = document.getElementById('media-container');\n const downloadAllContainer = document.getElementById('download-all-container');\n const formatSelectAll = document.getElementById('format-select-all');\n const downloadAllBtn = document.getElementById('download-all-btn');\n const downloadOriginalBtn = document.getElementById('download-original-btn');\n const loadingContainer = document.getElementById('loading-container');\n const mediaModal = document.getElementById('media-modal');\n const modalContent = document.getElementById('modal-content');\n const closeBtn = document.querySelector('.close');\n const filterMediaType = document.getElementById('filter-media-type');\n const filterMediaFormat = document.getElementById('filter-media-format');\n const filterContainer = document.getElementById('filter-container');\n const mainContent = document.getElementById('main-content');\n\n extractBtn.addEventListener('click', extractMedia);\n downloadAllBtn.addEventListener('click', downloadAllMedia);\n downloadOriginalBtn.addEventListener('click', downloadAllMediaInOriginalFormats);\n resetBtn.addEventListener('click', resetPage);\n closeBtn.addEventListener('click', () => {\n mediaModal.style.display = 'none';\n });\n\n filterMediaType.addEventListener('change', filterMedia);\n filterMediaFormat.addEventListener('change', filterMedia);\n\n function resetPage() {\n urlInput.value = '';\n mediaContainer.innerHTML = '';\n downloadAllContainer.style.display = 'none';\n filterContainer.style.display = 'none';\n resetBtn.style.display = 'none';\n mainContent.style.display = 'none';\n }\n\n function resizeCanvas() {\n const canvas = document.getElementById('matrix-canvas');\n const ctx = canvas.getContext('2d');\n canvas.width = canvas.offsetWidth;\n canvas.height = canvas.offsetHeight;\n\n const letters = 'ABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZABCDEFGHIJKLMNOPQRSTUVXYZ';\n const fontSize = 10;\n const columns = canvas.width \/ fontSize;\n\n const drops = [];\n for (let i = 0; i < columns; i++) {\n drops[i] = 1;\n }\n\n function drawMatrix() {\n ctx.fillStyle = 'rgba(52, 152, 219, 0.05)';\n ctx.fillRect(0, 0, canvas.width, canvas.height);\n\n ctx.fillStyle = '#ffffff';\n ctx.font = fontSize + 'px monospace';\n\n for (let i = 0; i < drops.length; i++) {\n const text = letters[Math.floor(Math.random() * letters.length)];\n ctx.fillText(text, i * fontSize, drops[i] * fontSize);\n\n if (drops[i] * fontSize > canvas.height && Math.random() > 0.975) {\n drops[i] = 0;\n }\n\n drops[i]++;\n }\n }\n\n function animate() {\n drawMatrix();\n requestAnimationFrame(animate);\n }\n\n animate();\n }\n\n resizeCanvas();\n window.addEventListener('resize', resizeCanvas);\n\n async function extractMedia() {\n const url = urlInput.value;\n if (!url) return;\n\n showLoading();\n mediaContainer.innerHTML = '';\n downloadAllContainer.style.display = 'none';\n filterContainer.style.display = 'none';\n resetBtn.style.display = 'none';\n mainContent.style.display = 'none';\n\n try {\n const response = await fetch(`https:\/\/api.allorigins.win\/get?url=${encodeURIComponent(url)}`);\n const data = await response.json();\n const html = data.contents;\n\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text\/html');\n \n const images = doc.querySelectorAll('img');\n const videos = doc.querySelectorAll('video');\n const audios = doc.querySelectorAll('audio');\n const pdfLinks = Array.from(doc.querySelectorAll('a')).filter(link => link.href.endsWith('.pdf'));\n\n if (images.length > 0 || videos.length > 0 || audios.length > 0 || pdfLinks.length > 0) {\n for (const img of images) {\n const src = new URL(img.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'image');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const video of videos) {\n const src = new URL(video.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'video');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const audio of audios) {\n const src = new URL(audio.src, url).href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'audio');\n mediaContainer.appendChild(mediaCard);\n }\n\n for (const pdfLink of pdfLinks) {\n const src = pdfLink.href;\n const fileName = src.split('\/').pop();\n const mediaCard = createMediaCard(src, fileName, 'pdf');\n mediaContainer.appendChild(mediaCard);\n }\n\n downloadAllContainer.style.display = 'block';\n filterContainer.style.display = 'flex';\n mediaContainer.style.display = 'grid';\n resetBtn.style.display = 'inline-flex';\n mainContent.style.display = 'block';\n filterMedia(); \/\/ Filtre les m\u00e9dias apr\u00e8s extraction\n } else {\n mediaContainer.innerHTML = '<p>Aucun m\u00e9dia trouv\u00e9 sur ce site web.<\/p>';\n mediaContainer.style.display = 'block';\n }\n\n hideLoading();\n } catch (error) {\n console.error('Erreur lors de l\\'extraction des m\u00e9dias:', error);\n mediaContainer.innerHTML = '<p>Erreur lors de l\\'extraction des m\u00e9dias. Veuillez r\u00e9essayer.<\/p>';\n mediaContainer.style.display = 'block';\n hideLoading();\n }\n }\n\n function createMediaCard(src, fileName, type) {\n const card = document.createElement('div');\n card.className = 'media-card';\n card.dataset.type = type;\n card.dataset.format = fileName.split('.').pop().toLowerCase();\n\n let previewContent;\n if (type === 'image') {\n previewContent = `<img decoding=\"async\" class=\"media-preview\" src=\"${src}\" alt=\"${fileName}\">`;\n } else if (type === 'video') {\n previewContent = `<video class=\"media-preview\" src=\"${src}\" controls><\/video>`;\n } else if (type === 'audio') {\n previewContent = `<audio class=\"media-preview\" src=\"${src}\" controls><\/audio>`;\n } else if (type === 'pdf') {\n previewContent = `<iframe class=\"media-preview\" src=\"${src}\" frameborder=\"0\"><\/iframe>`;\n }\n\n card.innerHTML = `\n <div class=\"media-preview-container\">\n ${previewContent}\n <div class=\"media-expand-icon\">\n <i class=\"fas fa-expand\"><\/i>\n <\/div>\n <\/div>\n <div class=\"media-info\">\n <h3>${fileName}<\/h3>\n <p class=\"media-format\">${card.dataset.format.toUpperCase()}<\/p>\n <select class=\"format-select\">\n <option value=\"original\">Format Original<\/option>\n <option value=\"jpg\" ${type !== 'image' ? 'disabled' : ''}>JPG<\/option>\n <option value=\"png\" ${type !== 'image' ? 'disabled' : ''}>PNG<\/option>\n <option value=\"webp\" ${type !== 'image' ? 'disabled' : ''}>WebP<\/option>\n <option value=\"gif\" ${type !== 'video' ? 'disabled' : ''} data-max-duration=\"10\">GIF (Courtes vid\u00e9os)<\/option>\n <option value=\"mp4\" ${type !== 'video' ? 'disabled' : ''}>MP4<\/option>\n <option value=\"webm\" ${type !== 'video' ? 'disabled' : ''}>WebM<\/option>\n <option value=\"mp3\" ${type !== 'audio' ? 'disabled' : ''}>MP3<\/option>\n <option value=\"pdf\" ${type !== 'pdf' ? 'disabled' : ''}>PDF<\/option>\n <\/select>\n <a href=\"#\" class=\"download-btn\" data-src=\"${src}\" data-filename=\"${fileName}\" data-type=\"${type}\">\n <i class=\"fas fa-download\"><\/i> T\u00e9l\u00e9charger\n <\/a>\n <\/div>\n `;\n\n const downloadBtn = card.querySelector('.download-btn');\n downloadBtn.addEventListener('click', (e) => {\n e.preventDefault();\n const format = card.querySelector('.format-select').value;\n downloadMedia(src, fileName, format, type);\n });\n\n const expandIcon = card.querySelector('.media-expand-icon');\n expandIcon.addEventListener('click', () => {\n openMediaModal(src, type);\n });\n\n return card;\n }\n\n function openMediaModal(src, type) {\n let content;\n if (type === 'image') {\n content = `<img decoding=\"async\" src=\"${src}\" alt=\"Media en pleine \u00e9cran\" style=\"width: 100%; height: auto;\">`;\n } else if (type === 'video') {\n content = `<video src=\"${src}\" controls autoplay style=\"width: 100%; height: auto;\"><\/video>`;\n } else if (type === 'audio') {\n content = `<audio src=\"${src}\" controls autoplay style=\"width: 100%;\"><\/audio>`;\n } else if (type === 'pdf') {\n content = `<iframe src=\"${src}\" frameborder=\"0\" style=\"width: 100%; height: 90vh;\"><\/iframe>`;\n }\n\n modalContent.innerHTML = content;\n mediaModal.style.display = 'block';\n }\n\n async function downloadMedia(src, fileName, format, type) {\n try {\n const proxyUrl = `https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`;\n const response = await fetch(proxyUrl, {\n mode: 'cors',\n });\n\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n\n const blob = await response.blob();\n const newFileName = format === 'original' || (type !== 'image' && format !== 'gif') ? fileName : `${fileName.split('.')[0]}.${format}`;\n\n if (format === 'gif' && type === 'video') {\n const video = document.createElement('video');\n video.src = src;\n video.onloadedmetadata = function() {\n if (video.duration <= 10) {\n convertVideoToGIF(src, newFileName);\n } else {\n alert('La vid\u00e9o est trop longue pour \u00eatre convertie en GIF.');\n }\n };\n } else {\n saveAs(blob, newFileName);\n }\n } catch (error) {\n console.error('Erreur lors du t\u00e9l\u00e9chargement du m\u00e9dia:', error);\n alert('Erreur lors du t\u00e9l\u00e9chargement du m\u00e9dia. Veuillez r\u00e9essayer.');\n }\n }\n\n async function convertVideoToGIF(src, newFileName) {\n const ffmpeg = FFmpeg.createFFmpeg({ log: true });\n await ffmpeg.load();\n const videoData = await fetch(src).then(response => response.arrayBuffer());\n ffmpeg.FS('writeFile', 'input.mp4', new Uint8Array(videoData));\n await ffmpeg.run('-i', 'input.mp4', '-t', '10', '-vf', 'fps=10,scale=320:-1:flags=lanczos', '-c:v', 'gif', 'output.gif');\n const gifData = ffmpeg.FS('readFile', 'output.gif');\n const blob = new Blob([gifData.buffer], { type: 'image\/gif' });\n saveAs(blob, newFileName);\n }\n\n async function downloadAllMedia() {\n const format = formatSelectAll.value;\n const zip = new JSZip();\n const mediaCards = mediaContainer.querySelectorAll('.media-card');\n\n showLoading();\n\n const downloadPromises = [];\n\n for (const mediaCard of mediaCards) {\n const src = mediaCard.querySelector('.download-btn').dataset.src;\n const fileName = mediaCard.querySelector('.download-btn').dataset.filename;\n const type = mediaCard.querySelector('.download-btn').dataset.type;\n const newFileName = format === 'original' || (type !== 'image' && format !== 'gif') ? fileName : `${fileName.split('.')[0]}.${format}`;\n\n const downloadPromise = fetch(`https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`, {\n mode: 'cors',\n })\n .then(response => {\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n return response.blob();\n })\n .then(blob => {\n if (format === 'gif' && type === 'video') {\n const video = document.createElement('video');\n video.src = src;\n video.onloadedmetadata = function() {\n if (video.duration <= 10) {\n \/\/ Conversion en GIF si la vid\u00e9o est assez courte\n convertVideoToGIF(src, newFileName);\n } else {\n alert('Une des vid\u00e9os est trop longue pour \u00eatre convertie en GIF.');\n }\n };\n } else {\n zip.file(newFileName, blob);\n }\n })\n .catch(error => {\n console.error('Erreur lors de l\\'ajout du m\u00e9dia au zip:', error);\n });\n\n downloadPromises.push(downloadPromise);\n }\n\n try {\n await Promise.all(downloadPromises);\n const zipBlob = await zip.generateAsync({ type: 'blob' });\n saveAs(zipBlob, 'medias_extraits.zip');\n } catch (error) {\n console.error('Erreur lors de la g\u00e9n\u00e9ration du fichier ZIP:', error);\n alert('Une erreur est survenue lors de la cr\u00e9ation du fichier ZIP. Veuillez r\u00e9essayer.');\n } finally {\n hideLoading();\n }\n }\n\n async function downloadAllMediaInOriginalFormats() {\n const zip = new JSZip();\n const mediaCards = mediaContainer.querySelectorAll('.media-card');\n\n showLoading();\n\n const downloadPromises = [];\n\n for (const mediaCard of mediaCards) {\n const src = mediaCard.querySelector('.download-btn').dataset.src;\n const fileName = mediaCard.querySelector('.download-btn').dataset.filename;\n\n const downloadPromise = fetch(`https:\/\/api.allorigins.win\/raw?url=${encodeURIComponent(src)}`, {\n mode: 'cors',\n })\n .then(response => {\n if (!response.ok) {\n throw new Error(`Erreur HTTP! Statut: ${response.status}`);\n }\n return response.blob();\n })\n .then(blob => {\n zip.file(fileName, blob);\n })\n .catch(error => {\n console.error('Erreur lors de l\\'ajout du m\u00e9dia au zip:', error);\n });\n\n downloadPromises.push(downloadPromise);\n }\n\n try {\n await Promise.all(downloadPromises);\n const zipBlob = await zip.generateAsync({ type: 'blob' });\n saveAs(zipBlob, 'medias_extraits.zip');\n } catch (error) {\n console.error('Erreur lors de la g\u00e9n\u00e9ration du fichier ZIP:', error);\n alert('Une erreur est survenue lors de la cr\u00e9ation du fichier ZIP. Veuillez r\u00e9essayer.');\n } finally {\n hideLoading();\n }\n }\n\n function filterMedia() {\n const type = filterMediaType.value;\n const format = filterMediaFormat.value;\n\n const cards = mediaContainer.querySelectorAll('.media-card');\n cards.forEach(card => {\n const cardType = card.dataset.type;\n const cardFormat = card.dataset.format;\n\n const typeMatch = type === 'all' || cardType === type;\n const formatMatch = format === 'all' || cardFormat === format;\n\n if (typeMatch && formatMatch) {\n card.style.display = '';\n } else {\n card.style.display = 'none';\n }\n });\n }\n\n function showLoading() {\n loadingContainer.style.display = 'flex';\n }\n\n function hideLoading() {\n loadingContainer.style.display = 'none';\n }\n <\/script>\n<\/body>\n<\/html>\n\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Pacific Media Extractor Pacific Media Extractor Extraire des m\u00e9dias d’un site web n’a jamais \u00e9t\u00e9 aussi facile. Pacific Media Extractor est un outil en ligne puissant et facile \u00e0 utiliser pour extraire et t\u00e9l\u00e9charger des images, vid\u00e9os, audios, et documents PDF de n’importe quel site web. Parfait pour les concepteurs web, les marketeurs ou les […]<\/p>\n","protected":false},"author":1,"featured_media":822,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-820","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-ressources"],"yoast_head":"\n<title>Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor<\/title>\n<meta name=\"description\" content=\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor\" \/>\n<meta property=\"og:description\" content=\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\" \/>\n<meta property=\"og:url\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Extractor\" \/>\n<meta property=\"article:published_time\" content=\"2024-09-03T12:00:30+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-03T12:01:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.png\" \/>\n\t<meta property=\"og:image:width\" content=\"698\" \/>\n\t<meta property=\"og:image:height\" content=\"466\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\",\"name\":\"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor\",\"isPartOf\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"datePublished\":\"2024-09-03T12:00:30+00:00\",\"dateModified\":\"2024-09-03T12:01:34+00:00\",\"author\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\"},\"description\":\"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor\",\"breadcrumb\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"contentUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp\",\"width\":698,\"height\":466},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/pacific-webtools.com\/web-extractor\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Pacific Media Extractor – Extraire M\u00e9dias de Sites Web\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/\",\"name\":\"Web Extractor\",\"description\":\"Extracteur de Code\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/pacific-webtools.com\/web-extractor\"],\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/\"}]}<\/script>\n","yoast_head_json":{"title":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","og_locale":"fr_FR","og_type":"article","og_title":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","og_description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","og_url":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","og_site_name":"Web Extractor","article_published_time":"2024-09-03T12:00:30+00:00","article_modified_time":"2024-09-03T12:01:34+00:00","og_image":[{"width":698,"height":466,"url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.png","type":"image\/png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"admin","Dur\u00e9e de lecture estim\u00e9e":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","url":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/","name":"Pacific Media Extractor - Extraire M\u00e9dias de Sites Web - Web Extractor","isPartOf":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website"},"primaryImageOfPage":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage"},"image":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage"},"thumbnailUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","datePublished":"2024-09-03T12:00:30+00:00","dateModified":"2024-09-03T12:01:34+00:00","author":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48"},"description":"Extraire et t\u00e9l\u00e9charger des images (jpg, png, gif, webp), vid\u00e9os (mp4), audios, et PDF de sites web facilement avec Pacific Media Extractor","breadcrumb":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#primaryimage","url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","contentUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-media.webp","width":698,"height":466},{"@type":"BreadcrumbList","@id":"https:\/\/pacific-webtools.com\/web-extractor\/pacific-media-extractor-extraire-medias-de-sites-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/pacific-webtools.com\/web-extractor\/"},{"@type":"ListItem","position":2,"name":"Pacific Media Extractor – Extraire M\u00e9dias de Sites Web"}]},{"@type":"WebSite","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website","url":"https:\/\/pacific-webtools.com\/web-extractor\/","name":"Web Extractor","description":"Extracteur de Code","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48","name":"admin","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/pacific-webtools.com\/web-extractor"],"url":"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820"}],"collection":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/comments?post=820"}],"version-history":[{"count":4,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820\/revisions"}],"predecessor-version":[{"id":825,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/820\/revisions\/825"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media\/822"}],"wp:attachment":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media?parent=820"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/categories?post=820"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/tags?post=820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}