Skip to content
This repository was archived by the owner on Oct 5, 2024. It is now read-only.

chat page - initial design #27

Merged
merged 1 commit into from
Mar 13, 2024
Merged

chat page - initial design #27

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
428 changes: 428 additions & 0 deletions frontend/assets/chat.nosehad
View file
Open in desktop

Large diffs are not rendered by default.

8 changes: 8 additions & 0 deletions frontend/assets/json/pages-config.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,5 +22,13 @@
"description": "The social media chat app with a new innovative concept: Chat with EVERYONE",
"keywords": ["Radix", "Chat", "App", "Innovative"],
"author": "Noah Nagel"
},
{
"route":"/app/chat",
"static": "/static/chat.nosehad",
"title": "Radix Chat",
"description": "The social media chat app with a new innovative concept: Chat with EVERYONE",
"keywords": ["Radix", "Chat", "App", "Innovative"],
"author": "Noah Nagel"
}
]
2 changes: 1 addition & 1 deletion frontend/assets/login.nosehad
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -546,7 +546,7 @@ input[type="file"] {
</div>
</body>
<script type="text/javascript">
cms_loadScript("/static/scripts/message.js");
cms_loadScript("/static/scripts/message_popup.js");
cms_loadScript("/static/scripts/login.js");
</script>
</html>
2 changes: 2 additions & 0 deletions frontend/assets/scripts/chat.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
cms_runOnStartup(() => {
});
18 changes: 18 additions & 0 deletions frontend/assets/scripts/message_popup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
const audio = new Audio("/static/sounds/new_message.mp3");
cms_runOnStartup(() => {
document.addEventListener('animationend', (event) => {
if (event.animationName == "appear") {
event.target.remove();
}
});
document.addEventListener('animationstart', (event) => {
if (event.animationName == "appear") {
try {
audio.play();
}
catch (exception) {
console.log("Failed to play notification sound");
}
}
});
});
6 changes: 5 additions & 1 deletion frontend/html/build.sh
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,10 @@ mkdir -p assets/scripts
gcc -w -E -x c -P html/pages/login/index.html -o assets/login.nosehad
gcc -w -E -x c -P html/pages/login/login.js -o assets/scripts/login.js

# chat page
gcc -w -E -x c -P html/pages/chat/index.html -o assets/chat.nosehad
gcc -w -E -x c -P html/pages/chat/chat.js -o assets/scripts/chat.js

# landing page
gcc -w -E -x c -P html/pages/landing/index.html -o assets/landing.nosehad

Expand All @@ -32,4 +36,4 @@ gcc -w -E -x c -P html/background.svg -o assets/images/background.svg
gcc -w -E -x c -P html/generic/Content/cms.html -o assets/cms.nosehad

# message utility
gcc -w -E -x c -P html/generic/message.js -o assets/scripts/message.js
gcc -w -E -x c -P html/generic/message_popup.js -o assets/scripts/message_popup.js
25 changes: 25 additions & 0 deletions frontend/html/generic/message_popup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
/* message sound */
const audio = new Audio("/static/sounds/new_message.mp3");

cms_runOnStartup(() => {
/* animated inbox */
document.addEventListener('animationend', (event) => {
if (event.animationName == "appear") {
event.target.remove();
}
});

//document.body.style.animationDuration
document.addEventListener('animationstart', (event) => {
if (event.animationName == "appear") {
//event.target.style.animationDuration = ""
try {
audio.play();
}
catch (exception) {
/// TODO: print message to allow sounds (ask for permission)
console.log("Failed to play notification sound");
}
}
});
});
20 changes: 20 additions & 0 deletions frontend/html/pages/chat/chat.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
nav {
position: fixed;
top: 0;
/* left: 0; */
text-align: center;
margin-top:20px;
border: 2px solid PRIMARY_BG_2;
border-radius: 5px;
}

nav a {
padding: 10px;
color: FONT_COLOR;
}

nav a.active {
background-color: SECONDARY_BG;
color:PRIMARY_BUTTON_BG;
border-radius: 5px;
}
3 changes: 3 additions & 0 deletions frontend/html/pages/chat/chat.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
cms_runOnStartup(() => {

});
50 changes: 50 additions & 0 deletions frontend/html/pages/chat/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="en">

<head>
<title>Radix Chat - Login</title>
<style>
#include "../../generic/wrapper.css"
#include "chat.css"
</style>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
<div class="inbox" id="inbox">
</div>

<nav>
<a class="active">Your Feed</a>
<a>Tomorrows's Topic</a>
<a>Private Messages</a>
<a>Personal Preferences</a>
</nav>

<div class="content">
<div class="chat-header"></div>

<div class="chat"></div>

<div class="chat-input">
<input type="text" placeholder="Tell the world...">
<span>
<svg
xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-mic-fill"
viewBox="0 0 16 16">
<path d="M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0z" />
<path
d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5" />
</svg>
</span>
</div>
</div>
</body>
<script type="text/javascript">
cms_loadScript("/static/scripts/message_popup.js");
cms_loadScript("/static/scripts/chat.js");
</script>

</html>
2 changes: 1 addition & 1 deletion frontend/html/pages/login/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ <h1 style="margin-left: 5px;">
</div>
</body>
<script type="text/javascript">
cms_loadScript("/static/scripts/message.js");
cms_loadScript("/static/scripts/message_popup.js");
cms_loadScript("/static/scripts/login.js");
</script>

Expand Down