summaryrefslogtreecommitdiffstats
path: root/g4f/gui/client/static
diff options
context:
space:
mode:
authorkqlio67 <kqlio67@users.noreply.github.com>2024-10-29 08:48:04 +0100
committerkqlio67 <kqlio67@users.noreply.github.com>2024-10-29 08:48:04 +0100
commitd7d1db835ed6670d51823e32c855151813e12fce (patch)
tree228725193aa025568fba91cd9d8f52f2f73ab86c /g4f/gui/client/static
parentdocs(docs/interference-api.md): update image generation model in usage guide (diff)
downloadgpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar.gz
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar.bz2
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar.lz
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar.xz
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.tar.zst
gpt4free-d7d1db835ed6670d51823e32c855151813e12fce.zip
Diffstat (limited to 'g4f/gui/client/static')
-rw-r--r--g4f/gui/client/static/css/style.css87
-rw-r--r--g4f/gui/client/static/js/chat.v1.js110
2 files changed, 1 insertions, 196 deletions
diff --git a/g4f/gui/client/static/css/style.css b/g4f/gui/client/static/css/style.css
index 72f3ec4f..441e2042 100644
--- a/g4f/gui/client/static/css/style.css
+++ b/g4f/gui/client/static/css/style.css
@@ -474,6 +474,7 @@ body {
.stop_generating, .toolbar .regenerate {
position: absolute;
+ z-index: 1000000;
top: 0;
right: 0;
}
@@ -1117,92 +1118,6 @@ a:-webkit-any-link {
display: none;
}
-.album-image {
- width: 100px;
- height: auto;
- margin: 5px;
- display: inline-block;
-}
-
-.modal {
- display: none;
- position: fixed;
- z-index: 1;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- overflow: hidden;
- background-color: rgba(0,0,0,0.9);
-}
-
-.modal-content {
- margin: auto;
- display: block;
- max-width: 80%;
- max-height: 80%;
- transition: transform 0.2s;
-}
-
-.close {
- position: absolute;
- top: 15px;
- right: 35px;
- color: #f1f1f1;
- font-size: 40px;
- font-weight: bold;
- transition: 0.3s;
-}
-
-.close:hover,
-.close:focus {
- color: #bbb;
- text-decoration: none;
- cursor: pointer;
-}
-
-
-.image-counter {
- color: #fff;
- font-size: 18px;
- margin: auto 10px;
- user-select: none;
-}
-
-.nav-button {
- background-color: #555;
- color: #fff;
- border: none;
- padding: 10px;
- font-size: 20px;
- cursor: pointer;
-}
-
-.nav-button:hover {
- background-color: #777;
-}
-
-.nav-button {
- position: relative;
-}
-
-.nav-button.left {
- left: 0;
-}
-
-.nav-button.right {
- right: 0;
-}
-
-.navigation-controls {
- position: absolute;
- bottom: 20px;
- left: 50%;
- transform: translateX(-50%);
- display: flex;
- gap: 10px;
-}
-
.blink {
animation: blinker 1s step-start infinite;
}
diff --git a/g4f/gui/client/static/js/chat.v1.js b/g4f/gui/client/static/js/chat.v1.js
index 9bf07046..42ddb129 100644
--- a/g4f/gui/client/static/js/chat.v1.js
+++ b/g4f/gui/client/static/js/chat.v1.js
@@ -936,127 +936,17 @@ function open_settings() {
}
}
-async function loadImages() {
- try {
- const response = await fetch('/images');
- const images = await response.json();
- console.log(images);
- displayImages(images);
- } catch (error) {
- console.error('Error fetching images:', error);
- }
-}
-
-function displayImages(images) {
- const album = document.querySelector('.images');
- album.innerHTML = '';
- images.forEach(image => {
- const imgElement = document.createElement('img');
- imgElement.src = image;
- imgElement.alt = 'Generated Image';
- imgElement.classList.add('album-image');
- album.appendChild(imgElement);
- });
-}
-
-document.addEventListener('DOMContentLoaded', () => {
- loadImages();
-});
-
function open_album() {
- const album = document.querySelector('.images');
if (album.classList.contains("hidden")) {
sidebar.classList.remove("shown");
settings.classList.add("hidden");
album.classList.remove("hidden");
history.pushState({}, null, "/images/");
- loadImages();
} else {
album.classList.add("hidden");
}
}
-let currentScale = 1;
-let currentImageIndex = 0;
-let imagesList = [];
-
-function displayImages(images) {
- imagesList = images;
- const album = document.querySelector('.images');
- album.innerHTML = '';
- images.forEach((image, index) => {
- const imgElement = document.createElement('img');
- imgElement.src = image;
- imgElement.alt = 'Generated Image';
- imgElement.classList.add('album-image');
- imgElement.style.cursor = 'pointer';
- imgElement.addEventListener('click', () => openImageModal(index));
- album.appendChild(imgElement);
- });
-}
-
-function openImageModal(index) {
- currentImageIndex = index;
- const modal = document.getElementById('imageModal');
- const modalImg = document.getElementById('img01');
- const imageCounter = document.getElementById('imageCounter');
- modal.style.display = 'block';
- modalImg.src = imagesList[index];
- currentScale = 1;
- modalImg.style.transform = `scale(${currentScale})`;
- imageCounter.textContent = `${index + 1} / ${imagesList.length}`;
-}
-
-const modal = document.getElementById('imageModal');
-const span = document.getElementsByClassName('close')[0];
-const prevImageButton = document.getElementById('prevImage');
-const nextImageButton = document.getElementById('nextImage');
-
-span.onclick = function() {
- modal.style.display = 'none';
-}
-
-window.onclick = function(event) {
- if (event.target == modal) {
- modal.style.display = 'none';
- }
-}
-
-document.getElementById('img01').addEventListener('wheel', function(event) {
- event.preventDefault();
- if (event.deltaY < 0) {
- currentScale += 0.1;
- } else if (currentScale > 0.1) {
- currentScale -= 0.1;
- }
- document.getElementById('img01').style.transform = `scale(${currentScale})`;
-});
-
-prevImageButton.onclick = function() {
- if (currentImageIndex > 0) {
- currentImageIndex--;
- openImageModal(currentImageIndex);
- }
-}
-
-nextImageButton.onclick = function() {
- if (currentImageIndex < imagesList.length - 1) {
- currentImageIndex++;
- openImageModal(currentImageIndex);
- }
-}
-
-document.addEventListener('keydown', function(event) {
- if (modal.style.display === 'block') {
- if (event.key === 'ArrowLeft') {
- prevImageButton.click();
- } else if (event.key === 'ArrowRight') {
- nextImageButton.click();
- }
- }
-});
-
-
const register_settings_storage = async () => {
optionElements.forEach((element) => {
if (element.type == "textarea") {