This commit is contained in:
Younes ENNAJI
2025-03-13 08:13:26 +00:00
parent 113e609b55
commit 568e3583b9
4 changed files with 44 additions and 145 deletions
+1 -1
View File
@@ -1,5 +1,5 @@
{
"dist/main.css": "/dist/main.f22cec93.css",
"dist/main.css": "/dist/main.def4cf18.css",
"dist/main.js": "/dist/main.c89a204f.js",
"dist/455.3a7b4474.css": "/dist/455.3a7b4474.css",
"dist/455.17bc016b.js": "/dist/455.17bc016b.js",
+41 -142
View File
@@ -495,10 +495,13 @@
.cursor {
display: inline-block;
width: 3px;
height: 1.2em;
height: 1em;
background-color: var(--primary-color);
margin-left: 2px;
margin-left: 4px;
animation: blink 1s infinite;
vertical-align: middle;
position: relative;
top: -1em;
}
/* Animation for code typing */
@@ -588,13 +591,6 @@
opacity: 0;
}
}
.cursor {
animation: blink 1s infinite;
display: inline-block;
width: 2px;
height: 1.2em;
}
</style>
<script>
@@ -737,6 +733,7 @@ class PaymentController extends Controller
after: `
return back();
}
return redirect()->route('payment.success');
}
}`
@@ -762,6 +759,7 @@ class PaymentController extends AbstractController
after: `
return $this->redirectToRoute('payment_form');
}
return $this->redirectToRoute('payment_success');
}
}`
@@ -812,6 +810,7 @@ class OrderController extends Controller
after: `
// Send to processing queue
ProcessOrderJob::dispatch($order);
return redirect()->route('orders.show', $order);
}
}`
@@ -840,6 +839,7 @@ class OrderController extends AbstractController
after: `
// Dispatch order processing
$this->messageBus->dispatch(new ProcessOrder($order->getId()));
return $this->redirectToRoute('app_order_show', [
'id' => $order->getId()
]);
@@ -891,6 +891,7 @@ class AccountController extends Controller
`,
after: `
}
return view('account.dashboard', compact('user'));
}
}`
@@ -915,6 +916,7 @@ class AccountController extends AbstractController
`,
after: `
}
return $this->render('account/dashboard.html.twig', [
'user' => $user
]);
@@ -943,6 +945,26 @@ async function checkStatus() {
}
}
};
const indentMap = {
js: {
success: " ",
error: " ", // You can adjust these values as desired
info: " ",
warning: " "
},
laravel: {
success: " ",
error: " ", // For error, we use an extra level (8 spaces vs. 12 spaces)
info: " ",
warning: " "
},
symfony: {
success: " ",
error: " ", // Similarly, error notifications get extra indentation
info: " ",
warning: " "
}
};
/**
* Helper function to safely escape special characters in code
@@ -1147,16 +1169,6 @@ async function checkStatus() {
return lines.join("\n");
}
/**
* Generate the complete code example
*/
function generateCompleteExample(framework) {
const template = contextTemplates[state.type][framework];
const indent = framework === "js" ? " " : " ";
const flashCode = generateFlashCode(framework, indent);
return `${template.code.before}\n${flashCode}\n${template.code.after}`;
}
/**
* Update code display with animation
*/
@@ -1167,7 +1179,8 @@ async function checkStatus() {
return;
}
const template = contextTemplates[state.type][currentTab];
const indent = currentTab === "js" ? " " : " ";
const defaultIndent = currentTab === "js" ? " " : " ";
const indent = (indentMap[currentTab] && indentMap[currentTab][state.type]) || defaultIndent;
const flashCode = generateFlashCode(currentTab, indent);
if (animate) {
panel.innerHTML = `
@@ -1180,10 +1193,9 @@ async function checkStatus() {
}
const typingContainer = document.createElement("div");
typingContainer.className = "typing-container border-l-4 border-green-500 bg-green-50/20";
typingContainer.style.marginTop = "-20px";
typingContainer.style.fontFamily = "monospace";
typingContainer.style.position = "relative";
typingContainer.style.minHeight = "50px";
typingContainer.style.top = "-10px";
panel.querySelector("pre").appendChild(typingContainer);
const afterContainer = document.createElement("pre");
afterContainer.className = `language-${currentTab === "js" ? "javascript" : "php"}`;
@@ -1214,24 +1226,20 @@ async function checkStatus() {
function typeCode(code, container) {
const cursor = document.createElement("span");
cursor.className = "cursor";
cursor.innerHTML = "|";
cursor.style.display = "inline-block";
cursor.style.width = "2px";
cursor.style.backgroundColor = "#4F46E5";
cursor.style.color = "transparent";
cursor.style.marginLeft = "1px";
cursor.style.animation = "blink 1s infinite";
container.appendChild(cursor);
let i = 0;
let currentLine = document.createElement("div");
currentLine.style.minHeight = "1.2em";
container.insertBefore(currentLine, cursor);
const charsPerMinute = 5000;
const baseDelay = 60000 / charsPerMinute;
function typeNextChar() {
if (i < code.length) {
const char = code.charAt(i);
if (char === "\n") {
currentLine = document.createElement("div");
currentLine.style.minHeight = "1.2em";
@@ -1252,8 +1260,10 @@ async function checkStatus() {
charSpan.textContent = char;
currentLine.appendChild(charSpan);
}
i++;
let delay = baseDelay;
if ([".", ",", ";", ")", "}", ">", "!"].includes(char)) {
delay *= 2.5;
} else if (char === "\n") {
@@ -1261,9 +1271,11 @@ async function checkStatus() {
} else {
delay *= (0.7 + Math.random() * 0.6);
}
if (Math.random() < 0.05) {
delay += Math.random() * 500;
}
setTimeout(typeNextChar, delay);
} else {
setTimeout(() => {
@@ -1275,119 +1287,6 @@ async function checkStatus() {
setTimeout(typeNextChar, 150);
}
/**
* Create and play a typing animation for the flash code section
*/
function animateFlashCode(framework) {
const template = contextTemplates[state.type][framework];
const panel = document.getElementById(`${framework}-code-panel`);
if (!panel) {
return;
}
const codeElement = panel.querySelector("code");
if (!codeElement) {
return;
}
const flashCode = generateFlashCode(framework, framework === "js" ? " " : " ");
const fullText = codeElement.textContent;
const startIndex = fullText.indexOf(flashCode);
if (startIndex === -1) {
return;
}
const range = document.createRange();
const selection = window.getSelection();
selection.removeAllRanges();
try {
const textNodes = getTextNodesIn(codeElement);
let currentPos = 0;
let startNode, startOffset, endNode, endOffset;
for (let node of textNodes) {
const nodeTextLength = node.textContent.length;
if (currentPos <= startIndex && currentPos + nodeTextLength > startIndex) {
startNode = node;
startOffset = startIndex - currentPos;
}
if (currentPos <= startIndex + flashCode.length &&
currentPos + nodeTextLength >= startIndex + flashCode.length) {
endNode = node;
endOffset = startIndex + flashCode.length - currentPos;
break;
}
currentPos += nodeTextLength;
}
if (startNode && endNode) {
range.setStart(startNode, startOffset);
range.setEnd(endNode, endOffset);
const highlightSpan = document.createElement("span");
highlightSpan.className = "animated-line";
highlightSpan.style.animation = "highlight-line 2s ease-in-out";
range.surroundContents(highlightSpan);
simulateTyping(highlightSpan, flashCode);
}
} catch (e) {
console.warn("Animation error:", e);
}
}
/**
* Get all text nodes within an element
*/
function getTextNodesIn(element) {
const textNodes = [];
const walk = document.createTreeWalker(
element,
NodeFilter.SHOW_TEXT,
null,
false
);
let node;
while (node = walk.nextNode()) {
textNodes.push(node);
}
return textNodes;
}
/**
* Simulate typing effect within an element
*/
function simulateTyping(element, text) {
if (!element) {
return;
}
const cursor = document.createElement("span");
cursor.className = "cursor";
element.appendChild(cursor);
const originalContent = element.innerHTML;
element.innerHTML = "";
element.appendChild(cursor);
let i = 0;
const typingSpeed = 600;
function typeCharacter() {
if (i < text.length) {
const char = document.createTextNode(text.charAt(i));
element.insertBefore(char, cursor);
i++;
let delay = typingSpeed;
const currentChar = text.charAt(i - 1);
if ([";", ".", ":", ",", ")", "}"].includes(currentChar)) {
delay = typingSpeed * 3;
} else if (currentChar === "\n") {
delay = typingSpeed * 5;
} else if (Math.random() < 0.1) {
delay = typingSpeed * (1 + Math.random());
}
setTimeout(typeCharacter, delay);
} else {
setTimeout(() => {
cursor.remove();
}, 50);
}
}
setTimeout(typeCharacter, 30);
}
/**
* Updates the message and title based on the notification type
*/
+1 -1
View File
@@ -2,7 +2,7 @@
"entrypoints": {
"main": {
"css": [
"/dist/main.f22cec93.css"
"/dist/main.def4cf18.css"
],
"js": [
"/dist/main.c89a204f.js"
File diff suppressed because one or more lines are too long