From c0e4f647a2ad49fe52c152844e6725dcbf75a117 Mon Sep 17 00:00:00 2001 From: Gabe Kangas Date: Sun, 19 Jul 2020 15:14:51 -0700 Subject: [PATCH] Show chat by default. Closes #72. Show placeholder text that no registration is needed. Closes #73 --- core/chat/chat.go | 9 --------- core/chat/server.go | 13 +++++++++++++ webroot/index.html | 3 ++- webroot/js/app.js | 2 +- webroot/js/message.js | 20 ++++++++++++++++++-- webroot/js/utils.js | 1 + 6 files changed, 35 insertions(+), 13 deletions(-) diff --git a/core/chat/chat.go b/core/chat/chat.go index 50a7b9bc4..2a548d1cc 100644 --- a/core/chat/chat.go +++ b/core/chat/chat.go @@ -19,15 +19,6 @@ func Setup(listener models.ChatListener) { pingCh := make(chan models.PingMessage) doneCh := make(chan bool) errCh := make(chan error) - - // Demo messages only. Remove me eventually!!! - messages = append(messages, models.ChatMessage{"", "Tom Nook", "I'll be there with Bells on! Ho ho!", "https://gamepedia.cursecdn.com/animalcrossingpocketcamp_gamepedia_en/thumb/4/4f/Timmy_Icon.png/120px-Timmy_Icon.png?version=87b38d7d6130411d113486c2db151385", "demo-message-1", "CHAT", true, time.Now()}) - messages = append(messages, models.ChatMessage{"", "Redd", "Fool me once, shame on you. Fool me twice, stop foolin' me.", "https://vignette.wikia.nocookie.net/animalcrossing/images/3/3d/Redd2.gif/revision/latest?cb=20100710004252", "demo-message-2", "CHAT", true, time.Now()}) - messages = append(messages, models.ChatMessage{"", "Kevin", "You just caught me before I was about to go work out weeweewee!", "https://vignette.wikia.nocookie.net/animalcrossing/images/2/20/NH-Kevin_poster.png/revision/latest/scale-to-width-down/100?cb=20200410185817", "demo-message-3", "CHAT", true, time.Now()}) - messages = append(messages, models.ChatMessage{"", "Isabelle", " Isabelle is the mayor's highly capable secretary. She can be forgetful sometimes, but you can always count on her for information about the town. She wears her hair up in a bun that makes her look like a shih tzu. Mostly because she is one! She also has a twin brother named Digby.", "https://dodo.ac/np/images/thumb/7/7b/IsabelleTrophyWiiU.png/200px-IsabelleTrophyWiiU.png", "demo-message-4", "CHAT", true, time.Now()}) - messages = append(messages, models.ChatMessage{"", "Judy", "myohmy, I'm dancing my dreams away.", "https://vignette.wikia.nocookie.net/animalcrossing/images/5/50/NH-Judy_poster.png/revision/latest/scale-to-width-down/100?cb=20200522063219", "demo-message-5", "CHAT", true, time.Now()}) - messages = append(messages, models.ChatMessage{"", "Blathers", "Blathers is an owl with brown feathers. His face is white and he has a yellow beak. His arms are wing shaped and he has yellow talons. His eyes are very big with small black irises. He also has big pink cheek circles on his cheeks. His belly appears to be checkered in diamonds with light brown and white squares, similar to an argyle vest, which is traditionally associated with academia. His green bowtie further alludes to his academic nature.", "https://vignette.wikia.nocookie.net/animalcrossing/images/b/b3/NH-character-Blathers.png/revision/latest?cb=20200229053519", "demo-message-6", "CHAT", true, time.Now()}) - messages = append(messages, getChatHistory()...) _server = &server{ diff --git a/core/chat/server.go b/core/chat/server.go index 2d3c20afc..4d8cabc12 100644 --- a/core/chat/server.go +++ b/core/chat/server.go @@ -8,6 +8,7 @@ import ( log "github.com/sirupsen/logrus" "golang.org/x/net/websocket" + "github.com/gabek/owncast/config" "github.com/gabek/owncast/models" ) @@ -98,6 +99,7 @@ func (s *server) Listen() { s.Clients[c.id] = c s.listener.ClientAdded(c.id) + s.sendWelcomeMessageToClient(c) // remove a client case c := <-s.delCh: @@ -121,3 +123,14 @@ func (s *server) Listen() { } } } + +func (s *server) sendWelcomeMessageToClient(c *Client) { + go func() { + time.Sleep(5 * time.Second) + + initialChatMessageText := fmt.Sprintf("Welcome to %s! %s", config.Config.InstanceDetails.Title, config.Config.InstanceDetails.Summary) + initialMessage := models.ChatMessage{"owncast-server", config.Config.InstanceDetails.Name, initialChatMessageText, config.Config.InstanceDetails.Logo["small"], "initial-message-1", "CHAT", true, time.Now()} + c.Write(initialMessage) + }() + +} diff --git a/webroot/index.html b/webroot/index.html index 048c63552..4d0845695 100644 --- a/webroot/index.html +++ b/webroot/index.html @@ -15,7 +15,8 @@ -
+ +

diff --git a/webroot/js/app.js b/webroot/js/app.js index 06a38206f..333979ba8 100644 --- a/webroot/js/app.js +++ b/webroot/js/app.js @@ -293,6 +293,6 @@ class Owncast { } setChatHistory(messages) { - this.vueApp.messages = messages; + this.vueApp.messages = messages.concat(this.vueApp.messages); } }; diff --git a/webroot/js/message.js b/webroot/js/message.js index 85a6aab4e..5744149b7 100644 --- a/webroot/js/message.js +++ b/webroot/js/message.js @@ -91,7 +91,7 @@ class MessagingInterface { getLocalStorage(KEY_AVATAR) || generateAvatar(`${this.username}${Date.now()}`); this.updateUsernameFields(this.username); - this.chatDisplayed = getLocalStorage(KEY_CHAT_DISPLAYED) || false; + this.chatDisplayed = getLocalStorage(KEY_CHAT_DISPLAYED) || true; this.displayChat(); } @@ -110,6 +110,7 @@ class MessagingInterface { this.tagAppContainer.classList.add('no-chat'); this.tagAppContainer.classList.remove('chat'); } + this.setChatPlaceholderText(); } @@ -225,6 +226,12 @@ class MessagingInterface { // clear out things. this.formMessageInput.value = ''; this.tagMessageFormWarning.innerText = ''; + + const hasSentFirstChatMessage = getLocalStorage(KEY_CHAT_FIRST_MESSAGE_SENT); + if (!hasSentFirstChatMessage) { + setLocalStorage(KEY_CHAT_FIRST_MESSAGE_SENT, true); + this.setChatPlaceholderText(); + } } disableChat() { @@ -236,9 +243,18 @@ class MessagingInterface { enableChat() { if (this.formMessageInput) { this.formMessageInput.disabled = false; - this.formMessageInput.placeholder = "Message" + this.setChatPlaceholderText(); } } + + setChatPlaceholderText() { + const firstMessageChatPlacholderText = "Type here to chat, no account necessary."; + const chatPlaceholderText = "Message" + + const hasSentFirstChatMessage = getLocalStorage(KEY_CHAT_FIRST_MESSAGE_SENT); + this.formMessageInput.placeholder = hasSentFirstChatMessage ? chatPlaceholderText : firstMessageChatPlacholderText + } + // handle Vue.js message display onReceivedMessages(newMessages, oldMessages) { if (newMessages.length !== oldMessages.length) { diff --git a/webroot/js/utils.js b/webroot/js/utils.js index 4bd224b63..827137585 100644 --- a/webroot/js/utils.js +++ b/webroot/js/utils.js @@ -42,6 +42,7 @@ const VIDEO_OPTIONS = { const KEY_USERNAME = 'owncast_username'; const KEY_AVATAR = 'owncast_avatar'; const KEY_CHAT_DISPLAYED = 'owncast_chat'; +const KEY_CHAT_FIRST_MESSAGE_SENT = 'owncast_first_message_sent'; const TIMER_STATUS_UPDATE = 5000; // ms const TIMER_WEBSOCKET_RECONNECT = 5000; // ms