From 0acbc2ec28a6fe6283e681a7878621dc0b21885c Mon Sep 17 00:00:00 2001 From: everythingonblack Date: Wed, 9 Apr 2025 19:18:55 +0700 Subject: [PATCH] ok --- package.json | 2 +- src/components/Modal.js | 2 ++ src/components/MusicPlayer.js | 23 +++++++++++++++-------- src/config.js | 2 +- src/pages/CafePage.js | 1 + src/pages/CreateCoupon.js | 2 +- src/pages/Join.module.css | 6 ++++++ src/pages/PlayerPrompt.js | 31 +++++++++++++++++++++++++++++++ 8 files changed, 58 insertions(+), 11 deletions(-) create mode 100644 src/pages/PlayerPrompt.js diff --git a/package.json b/package.json index 3576ac4..86552a3 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "groovebrew-mockup", "version": "0.1.0", "private": true, - "homepage": "https://kedaimaster.com", + "homepage": "https://dev.kedaimaster.com", "dependencies": { "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", diff --git a/src/components/Modal.js b/src/components/Modal.js index 4726522..50d3592 100644 --- a/src/components/Modal.js +++ b/src/components/Modal.js @@ -25,6 +25,7 @@ import GuidePage from "../pages/GuidePage"; import Join from "../pages/Join"; import Loading from "../pages/Loading"; import Message from "../pages/Message"; +import PlayerPrompt from "../pages/PlayerPrompt"; import Login from "../pages/Login"; import ResetPassword from "../pages/ResetPassword"; import { getImageUrl } from "../helpers/itemHelper.js"; @@ -133,6 +134,7 @@ const Modal = ({ user, shop, isOpen, onClose, modalContent, deviceType, setModal {modalContent === "claim-coupon" && } {modalContent === "loading" && } {modalContent === "message" && } + {modalContent === "player-prompt" && } ); diff --git a/src/components/MusicPlayer.js b/src/components/MusicPlayer.js index edb1107..0f2e768 100644 --- a/src/components/MusicPlayer.js +++ b/src/components/MusicPlayer.js @@ -3,7 +3,7 @@ import "./MusicPlayer.css"; import MusicComponent from "./MusicComponent"; import Switch from "react-switch"; -export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLogin, queue }) { +export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLogin, queue, setModal }) { const [currentTime, setCurrentTime] = useState(0); const [trackLength, setTrackLength] = useState(0); const [viewing, setViewing] = useState(false); // State for expansion @@ -83,6 +83,10 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo // }); // }; + const modifyUrl = (url) => { + return url.replace(/w\d+-h\d+/, "w255-h255"); + }; + const fetchColor = async () => { if ( currentSong && @@ -104,7 +108,9 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo // setSubtitleColor("white"); // setSubtitleBG("black"); // } - setBackgroundImage(imageUrl); + const proxiedUrl = `https://dev.api.kedaimaster.com/image?url=${encodeURIComponent(modifyUrl(imageUrl))}`; // Use your proxy to fetch the image + + setBackgroundImage(proxiedUrl); } catch (error) { console.error("Error fetching or processing image:", error); } @@ -279,6 +285,7 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo if (socket != null && token) { socket.emit("songRequest", { token, shopId, track }); setSongName(""); + console.log(track) } }; @@ -401,17 +408,12 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo }, 1000); // 1 second timeout (same as the CSS transition duration) }; - function modifyUrl(url) { - // Use a regular expression to find the part of the URL that starts with '=' - return url.replace(/=(w\d+)-(h\d+)-/, '=w255-h255-'); - } - return (
{/*
+
setModal('player-prompt')}> +
+ Filter jenis musik dengan AI +
+
)}
diff --git a/src/config.js b/src/config.js index 967c5ce..6cf67cc 100644 --- a/src/config.js +++ b/src/config.js @@ -1,5 +1,5 @@ // src/config.js -const API_BASE_URL = 'https://api.kedaimaster.com'; +const API_BASE_URL = 'https://dev.api.kedaimaster.com'; export default API_BASE_URL; diff --git a/src/pages/CafePage.js b/src/pages/CafePage.js index 5f8712a..b44ac8f 100644 --- a/src/pages/CafePage.js +++ b/src/pages/CafePage.js @@ -242,6 +242,7 @@ function CafePage({ shopOwnerId={shopOwnerId} isSpotifyNeedLogin={isSpotifyNeedLogin} queue={queue} + setModal={setModal} /> { let encodedCouponCode = encodeURIComponent(encryptedCouponCode); // Construct the URL with the encoded coupon code as a query parameter - const urlWithCoupon = `https://coupon.kedaimaster.com/coupon?c=${encodedCouponCode}`; + const urlWithCoupon = `https://dev.coupon.kedaimaster.com/coupon?c=${encodedCouponCode}`; // Optionally, set the URL to use with the coupon setCouponUrl(urlWithCoupon); diff --git a/src/pages/Join.module.css b/src/pages/Join.module.css index 0eb5eb6..a7f14e0 100644 --- a/src/pages/Join.module.css +++ b/src/pages/Join.module.css @@ -15,6 +15,12 @@ padding: 40px 3px 15px 3px; } +.input { + width: calc(100% - 10px); + border-radius: 6px; + font-size: 19px; + margin-bottom: 10px; +} /* Main Heading */ .mainHeading { width: 222px; diff --git a/src/pages/PlayerPrompt.js b/src/pages/PlayerPrompt.js new file mode 100644 index 0000000..8343514 --- /dev/null +++ b/src/pages/PlayerPrompt.js @@ -0,0 +1,31 @@ +// LinktreePage.js +import React, { useState, useEffect } from 'react'; +import styles from './Join.module.css'; // Import the module.css file + +const LinktreePage = ({ handleYes }) => { + const [captMessage, setCaptMessage] = useState(''); + const [descMessage, setDescMessage] = useState(''); + + useEffect(() => { + const newQueryParams = new URLSearchParams(window.location.search); + const r = newQueryParams.get('captMessage'); + const s = newQueryParams.get('descMessage'); + if (r) { + setCaptMessage(r) + setDescMessage(s) + } + }, []); + + return ( +
+
+
Filter jenis musik
+
Masukkan prompt untuk Gemini AI
+ +
Simpan
+
+
+ ); +}; + +export default LinktreePage;