RetroPosterBoard / index.html
rr19tech's picture
Updated about section.
7e9b8cf verified
Raw History Blame Contribute Delete
35.3 kB
<html>
<head>
<link rel="stylesheet" href="style.css">
<!-- Loadint podketbase from cdn -->
<script src="https://cdn.jsdelivr.net/gh/pocketbase/js-sdk@master/dist/pocketbase.umd.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="main-company" id="rrMain">
<h3 class="main-heading">RR Technologies - Retro Poster Board</h3>
<p class="details">
<ul>
<li>An experimental posterboard website.</li>
</ul>
</p>
<div class="login-card">
<div id="login-section">
<span>Business Login</span><br>
<input type="email" id="email" placeholder="Email" required size="28" ><br>
<input type="password" id="password" placeholder="Password" required size="28" ><br>
<button onclick="doLogin()" >Sign In</button>
</div>
<div id="user-section" class="hidden">
<!--<span>Welcome!</span><br>-->
<p id="user-email"></p>
<button onclick="doLogout()" style="background: #f44336;" >Logout</button>
</div>
<p id="message"></p>
</div>
<!--
<div class="user-input-container" >
<form>
<h4>Feedback</h4>
<textarea id="feedback" name="feedback" rows="5" cols="40"
placeholder="Leave your feedback, Example: Hello, I am somebody, please increase the font size ..." ></textarea>
<div class="button-group">
<button type="button" class="btn send" id="structure">Create Feedback</button>
<button type="button" class="btn save" disabled>Submit</button>
<button type="button" class="btn clear" id="feedbackClr" >Clear</button>
</div>
</form>
</div>
-->
</div>
<div class="tabs">
<!--
<button class="tab-link" onclick="openTab(event, 'Plnb')"><span class="tab-heading">NUTRITION</span></button>
<button class="tab-link" onclick="openTab(event, 'Hcs')"><span class="tab-heading">CAKES</span></button>
<button class="tab-link" onclick="openTab(event, 'Jobs')"><span class="tab-heading">JOB-POSTINGS</span></button>
<button class="tab-link" onclick="openTab(event, 'Training')"><span class="tab-heading">TRAINING</span></button>
<button class="tab-link" onclick="openTab(event, 'Portfolio')"><span class="tab-heading">PORTFOLIO</span></button>
<button class="tab-link" onclick="openTab(event, 'Insurance')"><span class="tab-heading">INSURANCE</span></span></button>
<button class="tab-link" onclick="openTab(event, 'SixgStudies')"><span class="tab-heading">6G-STUDIES</span></button>
<button class="tab-link" onclick="openTab(event, 'Digital')"><span class="tab-heading">DIGITAL-MARKETING</span></button>
-->
<button class="tab-link" onclick="openTab(event, 'AI-Studies')"><span class="tab-heading"><span class="ai-icon">AI-STUDIES</span></span></button>
<button class="tab-link" onclick="openTab(event, 'Nature')"><span class="tab-heading"><span class="nature-leaf">NATURE</span></span></button>
<button class="tab-link" onclick="openTab(event, 'Garden')"><span class="tab-heading"><span class="potted-plant">GARDENING</span></span></button>
<!--<button class="tab-link" onclick="openTab(event, 'Devotional')"><span class="tab-heading">DEVOTIONAL</span></button>-->
<button class="tab-link" onclick="openTab(event, 'About')"><span class="tab-heading">ABOUT</span></button>
</div>
<div id="Plnb" class="tab-content" inert class="disabled-div">
<h4>Project LeanNation </h4>
<table >
<tr>
<td>
<p>
We are incredibly excited to announce the launch of a new store <a href="https://projectleannation.com/locations/burlington-ma" alt="Project LeanNation" target="_blank" rel="noopener noreferrer">Project LeanNation</a> in Burlington mid-June.<br>
We would like to introduce the owner, Shweta, a former Google engineer who has transitioned her passion for nutrition and building healthier habits into a community-focused endeavor.<br>
Shweta is currently looking to connect with the community and would love to partner
with local groups, corporate teams, fitness studios, sports clubs and other organizations to host pop-ups. <br>
<br>
They offer macro-balanced meals and nutrition coaching designed to make healthy eating simple,
convenient, and sustainable for busy professionals.<br>
These are great ways to sample meals, try protein snacks, and learn more about the nutrition program in a fun, low-pressure setting.<br>
We would love to connect you with Shweta and explore potential wellness initiatives for your teams!<br>
<br> If you're open to it, we would be happy to make an introduction.
</p>
</td>
</tr>
</table>
</div>
<div id="Hcs" class="tab-content" inert class="disabled-div">
<h4>Harshali Custom Cake Shop</h4>
<table >
<tr>
<td vertical-align="top">
We are happy to introduce a speciality cake shop by Harshali in Boston Neighborhood.<br>
Harshali creates affordable and handmade theme based cake design's that suit your needs. <br>
Please check out her <a class="anchor-tags" href="https://www.facebook.com/harshaliscreativecakes/" alt="Harshali Cake Shop" target="_blank" rel="noopener noreferrer">Facebook</a> link to discuss customizations based on your preferences!
</td>
<td><span style="visibility: hidden;">space filler for now!</span></td>
<td >
<table >
<tr>
<td><img src="images/20230407_140300.jpg" height="100" width="80"/></td>
<td><img src="images/20240501_175250.jpg" height="100" width="80"/></td>
<td><img src="images/20250407_183652.jpg" height="100" width="80"/></td>
<td><img src="images/20250510_145255.jpg" height="100" width="80"/></td>
</tr>
</table>
</td>
</tr>
</table>
<br>
<p>
If you like to hear more, we would be happy to make an introduction.
</p>
</div>
<div id="Jobs" class="tab-content">
<h4>Job Postings</h4>
<p>Postings from known recruiters will be posted here!</p>
</div>
<div id="Training" class="tab-content" inert class="disabled-div">
<h4>Training</h4>
<p>
We are extremely happy to introduce Apache Cassandra training offered by Sarma on Udemy. <br>
<ol>
<li><a href="https://www.udemy.com/course/everything-cassandra/" target="_blank" rel="noopener noreferrer" alt="cassandra-basic">Everything You Need To Know To Get Started With Apache Cassandra.</a></li>
<li><a href="https://www.udemy.com/course/install-cassandra/" alt="install-cassandra" target="_blank" rel="noopener noreferrer">Learn How To Install & Configure Apache Cassandra.</a></li>
<li><a href="https://www.udemy.com/course/upgrade-cassandra/" alt="upgrade-cassandra" target="_blank" rel="noopener noreferrer">A comprehensive guide to upgrading "Apache Cassandra" clusters with minimal risk, and downtime. </a></li>
<li><a href="https://www.udemy.com/course/spark-scala-cassandra/" alt="spark-scala-cassandra" target="_blank" rel="noopener noreferrer">Learn How To Use Apache Spark for Data Stored In Apache Cassandra</a></li>
<li><a href="https://www.udemy.com/course/datastax-enterprise-installation/" alt="datastax-enterprise-installation" target="_blank" rel="noopener noreferrer">Learn Installation & Configuration of most popular Cassandra distribution : DataStax Enterprise</a></li>
<li><a href="https://www.udemy.com/course/datastax-astra-db/" alt="astra-datastax" target="_blank" rel="noopener noreferrer">Learn how to use DataStax Astra DB</a></li>
</ol>
If you like to hear more, we would be happy to make an introduction.
</p>
</div>
<div id="Portfolio" class="tab-content" inert class="disabled-div">
<h4>Projects Yard</h4>
<p>
We are very excited to introduce <a href="https://www.projectsyard.com" target="_blank" rel="noopener noreferrer"" alt="Projects Yard">Projects Yard</a>.
They can help you create stunning, interactive portfolios that bring your projects to life. <br>
They can guide you to stand out to recruiters and land your dream job.<br>
Built specifically for showcasing AI/ML and technical projects that deserve more than a bullet point. <br>
<br>
If you like to hear more, we would be happy to make an introduction.
</p>
</div>
<!--
<div id="Digital" class="tab-content">
<h4>Digital Marketing</h4>
<p>
We are very excited to introduce <a href="https://www.aptdigital.in" target="_blank" rel="noopener noreferrer" alt="APT Digital Express">APT Digital Express</a>.
They help businesses grow with modern digital marketing strategies, performance-led execution, and measurable online results.<br>
Core services span across SEO (Search Engine Optimizations), social media, paid campaigns, content, and web experiences. <br>
<br>
If you like to hear more, we would be happy to make an introduction.
</p>
</div>
<div id="Insurance" class="tab-content">
<h4>Insurance</h4>
<p>Coming soon..</p>
</div>
-->
<div id="AI-Studies" class="tab-content">
<h4>AI Studies</h4>
<p>
AI experimental articles
To run AI models locally, we need a runtime engine (inference), decent machine preferably with few gpu's to support and provide reasonable performance.
&nbsp; <a href="/LLM_Basics.html" target="_blank" rel="noopener noreferrer">Basics</a>
<ul>
<li>We have used the following, Ollama, llama.cpp, mlx_lm etc to run few models like llama, gemma, phi to obtain decent performance.</li>
<li>We have used openlit, pheonix as llm observability tools to evaluate the model performances.</li>
<li>We have used nomic-embed, all-minilm like embedding models with chroma_db like vector database to test the RAG concepts.</li>
<li>We have used kuzu and llama index property graphstore and local llm's to evaluate the graph RAG. <a href="/Articles_Quality_Check.html" target="_blank" rel="noopener noreferrer">Sample Project-1(Article Quality Check)</a></li>
<li><a href="/Finetuning.html" target="_blank" rel="noopener noreferrer">Fine-Tuning</a></li>
<li><a href="/Graph_RAG.html" target="_blank" rel="noopener noreferrer">Graph RAG Example Lab</a></li>
<li><a href="/Lang_Graph.html" target="_blank" rel="noopener noreferrer">Lang Graph Example Lab</a></li>
</ul>
Detailed experiments and some interesting observations will be published soon ..
</p>
</div>
<!--
<div id="Devotional" class="tab-content">
<h4>Devotional Channel from Waltair Ravi <a href="https://youtube.com/@waltairravi?si=D6p1jv28eZeCaLGZ" alt="Waltair Ravi Channel" target="_blank" rel="noopener noreferrer">Channel</a></h4>
<p>
We are happy to present some real time experiences of visits from various temples
<ol>
<li><a href="https://youtu.be/QVI-7Yy4ybA" target="_blank" rel="noopener noreferrer" >Gudilova Temple</a></li>
<li><a href="https://youtu.be/Tsa1TnMkEHk" target="_blank" rel="noopener noreferrer">Sri Uma Vyaseswara Swamy temple, Kesanakurru</a></li>
<li><a href="https://youtu.be/nDzUBLUgfv0" target="_blank" rel="noopener noreferrer">Sri Kameswari Devi temple, Kesanakurru</a></li>
<li><a href="https://youtu.be/R-gboClGdWE" target="_blank" rel="noopener noreferrer">Sri Mallamamba and Parvati Devi Temple, Kesanakurru</a></li>
<li><a href="https://youtu.be/mb3FyRUZl2A" target="_blank" rel="noopener noreferrer">Sri Kundaleswara Swamy temple</a></li>
<li><a href="https://youtu.be/mLKDkqt4kiU" target="_blank" rel="noopener noreferrer">Sri Kalabhairava Swamy temple, Konaseema</a></li>
<li><a href="https://youtu.be/YLnmTkbuQag" target="_blank" rel="noopener noreferrer">Bhuvaneswari Devi Temple near Vizag</a></li>
<li><a href="https://youtu.be/uMJ7gysnexY" target="_blank" rel="noopener noreferrer">Lakshmi Ganapathi Temple, Bikkavolu, East Godavari</a></li>
<li><a href="https://youtu.be/spWjhMHxqhs" target="_blank" rel="noopener noreferrer">Underground Sivalayam, Anakapalle</a></li>
<li><a href="https://youtu.be/mb3FyRUZl2A" target="_blank" rel="noopener noreferrer">Sri Chakra Maha Meru Yantralayam, Yenugulamahal village, Konaseema</a></li>
<li><a href="https://youtu.be/lejJ5XCm4UY" target="_blank" rel="noopener noreferrer">Sri Lalitha Peetham, Srinivasa Mangapuram, Tirupati</a></li>
</ol>
</p>
<br>
If you like to hear more, we would be happy to make an introduction.
</div>
-->
<div id="Nature" class="tab-content">
<h4>Nature</h4>
<ol>
<li><a href="/Leaf_Article.html" target="_blank" rel="noopener noreferrer" alt="four-o-clock-plant">Leaf Story</a></li>
<li><a href="/Maple_Article.html" alt="common-purslane" target="_blank" rel="noopener noreferrer">Maple Tree</a></li>
</ol>
<!--
<p>
Every <span class="fallen-leaf">leaf</span> holds a tiny story, a silent promise of growth and life. <br>
It makes us sad to see majority of folks throw away these
treasure troves in the yardwaste. <br>
Don't just let them disappear, they are amazing ingradients for creating homemade soil, a
wonderful way to contributing something back to the mother earth.<br>
<br>
<span class="money-tip">
Forget the large leaf bags, start your savings today and watch your <span class="cash-icon">wealth grow</span>!
</span>
<br>
If you like to hear more, we would be happy to guide you through.
</p>
-->
</div>
<div id="Garden" class="tab-content">
<h4>Gardening with impactful environmental protection</h4>
<p>
We can help the environment by growing plants that are very environmental friendly and protect it in ways unimaginable.
Here is a list of few plants and how they can help the environment.
<ol>
<li><a href="/Mirabilis_Jalapa_Article.html" target="_blank" rel="noopener noreferrer" alt="four-o-clock-plant">Four O'Clock Plant</a></li>
<li><a href="/Environment_Articles.html#section-purslane" alt="common-purslane" target="_blank" rel="noopener noreferrer">Common Purslane</a></li>
<li><a href="/Environment_Articles.html#section-moss" alt="moss" target="_blank" rel="noopener noreferrer">Moss</a></li>
<li><a href="/Tomato_Article.html" alt="moss" target="_blank" rel="noopener noreferrer">Growing Tomatoes Efficiently and Economically</a></li>
<li><a href="/Marygold_Article.html" alt="marygold" target="_blank" rel="noopener noreferrer">Marygold</a></li>
<li><a href="/Tulasi_Article.html" alt="holy-basil" target="_blank" rel="noopener noreferrer">Holy Basil (Tulasi)</a></li>
</ol>
<br>
If you like to hear more, we would be happy to guide you through.
</p>
</div>
<div id="About" class="tab-content">
<h4>About</h4>
<p>We are Java/Python developers evaluating AI platforms, frameworks. <br>
<ol>
<li>We can help in building AI RAG applications (Classic RAG/Graph RAG).</li>
<li>We can help with RAG pipeline testing, benchmarking results.</li>
<li>We can help finetune models (LORA/DORA), set up test beds for bench marking.</li>
<li>We conduct workflow experiments with LlamaIndex, LangGraph etc.</li>
</ol>
</p>
</div>
<!--
<div class="ai-assistant-container" id="aiAssistant">
<img src="images/RR_Logo.png" alt="AI Assistant Avatar" class="assistant-avatar" id="net-ai">
<div class="chat-bubble" id="net">
<p>Hello! RR Technologies assistant here, how may I help you?
<ol>
<li>Please click the icon to collapse this window</li>
<li>Please type your question and press enter</li>
<li>Please dblclick to clear the contents!</li>
</ol>
</p>
<textarea rows="10" cols="35" id="console" style="display:none" >
</textarea>
</div>
</div>
<div id="balloon-container">
<svg viewBox="0 0 150 150">
<g id="balloon-group">
<ellipse cx="50" cy="50" rx="40" ry="50" fill="#ff6b6b" />
<polygon points="50,100 45,110 55,110" fill="#ff6b6b" />
<line x1="50" y1="110" x2="50" y2="140" stroke="black" stroke-width="2" />
<text id="advBalloon" x="50" y="45"
text-anchor="middle" fill="white" font-size="15" font-family="Arial">
</text>
</g>
</svg>
<textarea id="joke-section" rows="5" cols="25" disabled></textarea>
</div>
-->
<script>
function openTab(evt, tabName) {
var i, tabcontent, tablinks;
// Hide all elements with class="tab-content"
tabcontent = document.getElementsByClassName("tab-content");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Remove the "active" class from all tab buttons
tablinks = document.getElementsByClassName("tab-link");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(tabName).style.display = "block";
evt.currentTarget.className += " active";
}
</script>
<script type="module">
import { Client } from "https://cdn.jsdelivr.net/npm/@gradio/client/dist/index.min.js";
async function callGradioAPI(userInput, api_method) {
// 1. Connect to the app (use your Space name or URL)
const app = await Client.connect('https://rr19tech-my-proxy.hf.space');
// 2. Call the endpoint with user input passed as an array
//const result = await app.predict("/call_private_api", [userInput]);
const result = await app.predict(api_method, [userInput]);
// 3. Access the returned data
console.log("Result:", result.data);
return result.data;
}
/**
const consoleArea = document.getElementById('console');
const assistantAvatar = document.getElementById('net-ai');
const chatBubble = document.getElementById('net');
const aiChatArea = document.getElementById("console");
// Add a click event listener to the avatar
assistantAvatar.addEventListener('click', () => {
// Toggle the display style to show or hide the chat bubble
if (chatBubble.style.display === 'none' || chatBubble.style.display === '') {
chatBubble.style.display = 'block';
aiChatArea.style.display = "block";
} else {
chatBubble.style.display = 'none';
aiChatArea.style.display = "none";
}
console.log("Is the button clicked!! net-ai");
//we have to call the language model from this chat
});
function checkJobPostings(input){
console.log("Looking for Job Posting data");
//if(input.inclues)
}
// this function will pick up contents from each of the tabs, pick random data and post it on the banner
function postAdv(){
console.log("Posting a random joke");
const businesses = ["HCS", "Sharma-Udemy", "ProjectsYard"];
const randomBusinees = businesses[Math.floor(Math.random() * businesses.length)];
console.log("Random Business chosen is : " + randomBusinees);
//set the text of the ballon from this one
const advBalloon = document.getElementById("advBalloon");
advBalloon.textContent = randomBusinees;
//pick a random text color from the following and random position
const colors = ["red", "blue", "green", "yellow", "cyan"];
//positions =["center", "left", "right"];
const randomColor = colors[Math.floor(Math.random() * colors.length)];
//const jokeContainer = document.getElementById("joke-section");
//const topics=["planets", "foods", "training", "photos", "portfolio"];
//const randomTopic = topics[Math.floor(Math.random() * topics.length)];
const randomTopic = getRelavantData(randomBusinees);
//call the api and get a random joke
//const content = "Tell a random joke about " + randomTopic;
const content = "Give 2 to 3 sentences about the topic " + randomTopic;
console.log("Random joke selected is: " + content);
const jokeContainer = document.getElementById('joke-section');
//let result = get_api_results(content, jokeContainer);
let result = randomTopic;//not calling the api for now to avoid rate limit issue
//jokeContainer.style.color = randomColor;
jokeContainer.textContent = result;
moveBalloon();
}
//move this to the backend
function getRelavantData(business){
//const plnb = ["Lunches", "Dinner", "Salads", "Cravings"];
const hcs = ["Muffins", "Apple Cake", "Banana Cake", "Bread"];
const sarmaU = ["Cassandra Get Started", "Install Cassandra", "Cluser Cassandra","DataStax and Cassandra", "Datastax"];
const prjYard = ["Stunning Portfolios", "Standout in front of recruiters", "AI ML skills"];
switch(business)
{
case "PLN":
return plnb[Math.floor(Math.random() * plnb.length)];
break;
case "HCS":
return hcs[Math.floor(Math.random() * hcs.length)];
break;
case "Sharma-Udemy":
return sarmaU[Math.floor(Math.random() * sarmaU.length)];
break;
case "ProjectsYard":
return prjYard[Math.floor(Math.random() * prjYard.length)];
break;
}
}
function moveBalloon() {
console.log("Animating the baloon!");
// 1. Instant Reset (No animation)
const balloon = document.getElementById('balloon-container');
balloon.style.transition = 'all 10s ease';
balloon.style.transform = 'translateX(800px)'; //almost to the edge
balloon.style.opacity = "1";
// Step 2: Reset position and fade back in after it's hidden
setTimeout(() => {
// Turn off transition so it "teleports" back instantly
balloon.style.transition = 'none';
balloon.style.transform = 'translateX(0)';
// Trigger fade in at original position
setTimeout(() => {
balloon.style.transition = 'opacity 1s ease';
balloon.style.opacity = '1';
}, 100); // Small buffer to let the "none" transition take effect
}, 10000); // Let's do the animation for 10 secs
}
postAdv();//posting it one time
const intervalId = setInterval(postAdv, 300000);
**/
/**
function get_api_results(result, container, api_method){
callGradioAPI(result, api_method)
.then(data => {
if (data) {
console.log('Received data:', data);
//if (api_method == "/call_private_api") {
container.value = data;
container.textContent = data;
//}
return data;
}
else{
console.log("No data received");
}
});
}
consoleArea.addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
//not sure if we need below to prevent the default behaviour
event.preventDefault();
console.log('Enter key pressed! Perform action.');
//get the entered value
let command = consoleArea.value;
//call_api(command);
//we will use a different method to call the LLM
fetchDataWithStatus(command, "/call_private_api", consoleArea);
//let result = get_api_results(command, consoleArea, "/call_private_api");
//console.log("data is: " + result);
consoleArea.value = "";//null the value
}
});
//adding a double click event to clear the contents for next question
consoleArea.addEventListener('dblclick', function(event) {
console.log("am i double clicked!!");
consoleArea.value = ""; //clearning for next question
});
**/
/**
//code for getting structured llm
const userFeedback = document.getElementById('feedback');
const structBtn = document.getElementById('structure');
structBtn.addEventListener('click', () => {
//caputre the value ented in the text area
let feedback = userFeedback.value;
console.log("Get structure button clicekd! " + feedback);
userFeedback.value = ""; //clear the content
let result = get_api_results(feedback, userFeedback, "/user_feedback");
});
//adding a double click event to clear the contents for next question
userFeedback.addEventListener('dblclick', function(event) {
console.log("userFeedback double clicked!!");
userFeedback.value = ""; //clearning for next question
});
const clearFeedback = document.getElementById('feedbackClr');
clearFeedback.addEventListener('click', function(event) {
console.log("Clearing feedback!!");
userFeedback.value = ""; //clearning for next question
});
//we will try to send some updates to the client, while we are waiting for the results
//we will replace this with some advertisements for the businesses
const messages = [
"While we gather data, please visit Sarma's Udemy courses...",
"As we are digging deeper, please visit ProjectsYard website...",
"Almost there, check for Cake design's at Harshali's ...",
"Double-checking the results...",
"Just a few more seconds, hmm, its taking longer than usual..."
];
async function fetchDataWithStatus(userInput, api_method, consoleArea) {
console.log("Am i getting called for a API call!!");
let messageIndex = 0;
// Update UI every 5 seconds
const statusInterval = setInterval(() => {
const nextMessage = messages[messageIndex % messages.length];
console.log(nextMessage); // Replace with your UI update logic
consoleArea.value = nextMessage;
messageIndex++;
}, 7000);
try {
const response = await callGradioAPI(userInput, api_method);
const data = await response;
consoleArea.value = data;
console.log("Success!", data);
} catch (error) {
console.error("Failed to fetch data:", error);
} finally {
// Ensure the messages stop immediately when the call ends
clearInterval(statusInterval);
console.log("Task complete.");
}
}
**/
</script>
<script>
// Pointing to my hf pocketbase cms url
//const pb = new PocketBase('https://rr19tech-retropocketbasecms.hf.space');
const pb = new PocketBase('https://rr20tech-PosterBoardCMS.hf.space');
const loginSection = document.getElementById('login-section');
const userSection = document.getElementById('user-section');
const message = document.getElementById('message');
// Check auth status on load
updateUI();
async function doLogin() {
const email = document.getElementById('email').value;
const pass = document.getElementById('password').value;
try {
// 3. Authenticate
//await pb.collection('users').authWithPassword(email, pass);
const authData = await pb.collection('users').authWithPassword(email, pass);
//get the role
const userRole = authData.record.role;
console.log("User Role is: " + userRole);
if (userRole == "writer"){
message.innerText = "Login successful!";
// Redirect the user to a custom page
window.location.href = './Nature_Articles.html';
message.style.color = "green";
}
if (userRole == "ai_writer"){
message.innerText = "Login successful!";
// Redirect the user to a custom page
window.location.href = './AI_Articles.html';
message.style.color = "blue";
}
updateUI();
} catch (err) {
message.innerText = "Error: " + err.message;
message.style.color = "red";
}
}
function doLogout() {
pb.authStore.clear();
updateUI();
// Redirect the user to a custom page
window.location.href = './index.html';
message.innerText = "Logged out.";
}
function updateUI() {
if (pb.authStore.isValid) {
loginSection.classList.add('hidden');
userSection.classList.remove('hidden');
document.getElementById('user-email').innerText = `Logged in as: ${pb.authStore.model.email}`;
} else {
loginSection.classList.remove('hidden');
userSection.classList.add('hidden');
}
}
async function loadArticles() {
const natureContainer = document.getElementById("Nature");
try {
// Fetch records. API rules enforce that only 'published' items return.
const records = await pb.collection('nature_posts').getFullList({
sort: '-created',
});
if (records.length === 0) {
console.log("No records");
return;
}
const articles = records.map(article => {console.log(article.short_summary); return article.full_text;});
console.log("Total articles: " + records.length);
//natureContainer.innerHTML = articles;
}
catch (error) {
console.error('Failed to load articles:', error);
//container.innerHTML = '<p class="text-red-500">Error loading content.</p>';
}
}
//loadArticles();
//console.log("Articles are: " + articles);
</script>
<div class="disclaimer"><span >Disclaimer: </span><p>All information presented is sourced from the respective business owners and is intended for informational purposes only.</p></div>
</body>
</html>