From db7c2321cd0af59f9e810e84c7d4eb83ec416458 Mon Sep 17 00:00:00 2001 From: Logan Hunt Date: Thu, 14 Apr 2022 13:56:10 -0600 Subject: [PATCH] Add initial channels for posts --- assets/js/app.js | 6 ++- assets/js/chat.js | 46 +++++++++++++++++++ lib/aggiedit_web/channels/post_channel.ex | 22 +++++++++ lib/aggiedit_web/channels/user_socket.ex | 17 +++++++ lib/aggiedit_web/endpoint.ex | 2 + lib/aggiedit_web/live/post_live/index.ex | 1 - .../live/post_live/show.html.heex | 5 ++ .../templates/layout/root.html.heex | 2 +- 8 files changed, 98 insertions(+), 3 deletions(-) create mode 100644 assets/js/chat.js create mode 100644 lib/aggiedit_web/channels/post_channel.ex create mode 100644 lib/aggiedit_web/channels/user_socket.ex diff --git a/assets/js/app.js b/assets/js/app.js index a884e88..94780d0 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -44,4 +44,8 @@ liveSocket.connect() window.liveSocket = liveSocket // Hack to remove alerts on click -Array.from(window.document.getElementsByClassName('alert')).forEach((x) => x.addEventListener('click', () => x.style.display = "none")) \ No newline at end of file +Array.from(window.document.getElementsByClassName('alert')).forEach((x) => x.addEventListener('click', () => x.style.display = "none")) + +import RoomChat from "./chat" +window.RoomChat = RoomChat; +window.userSocket = new Socket("/socket", {params: {_csrf_token: csrfToken}}) \ No newline at end of file diff --git a/assets/js/chat.js b/assets/js/chat.js new file mode 100644 index 0000000..aa32aba --- /dev/null +++ b/assets/js/chat.js @@ -0,0 +1,46 @@ +let RoomChat = { + init(socket, postId) { + console.log(postId); + console.log(socket); + let channel = socket.channel(`post:${postId}`) + channel.join() + .receive("ok", resp => { console.log("Joined successfully", resp) }) + .receive("error", resp => { console.log("Unable to join", resp) }) + this.listenForChats(channel) + }, + addMessage(user, message) { +// let body = `${user}: ${message}
` +// if (message.match(new RegExp(`@${window.userName}`, "ig"))) { +// $("#chat-box").append('

' + body + '

') +// } else { +// $("#chat-box").append('

' + body + '

') +// } + }, + scrollBottom() { +// $("#chat-box").animate({ scrollTop: $('#chat-box').prop("scrollHeight")}, 200) + }, + listenForChats(channel) { + channel.push('send', { body: "HELLO"}); +// $(() => { +// $("#chat-form").on("submit", function(ev) { +// ev.preventDefault() +// +// let userMsg = $('#user-msg').val() +// channel.push('send', {body: userMsg}) +// +// $("#user-msg").val("") +// }) + +// channel.on('shout', function(payload) { +// console.log(payload) +// RoomChat.addMessage(payload.name, payload.body) +// RoomChat.scrollBottom() +// }) + // }) + channel.on('shout', function(payload) { + console.log(payload) + }); + } +} + +export default RoomChat; \ No newline at end of file diff --git a/lib/aggiedit_web/channels/post_channel.ex b/lib/aggiedit_web/channels/post_channel.ex new file mode 100644 index 0000000..308c6de --- /dev/null +++ b/lib/aggiedit_web/channels/post_channel.ex @@ -0,0 +1,22 @@ +defmodule AggieditWeb.PostChannel do + use AggieditWeb, :channel + + alias Aggiedit.Roles + alias Aggiedit.Rooms + + @impl true + def join("post:" <> post_id, _payload, socket) do + post = Rooms.get_post!(post_id) + if Roles.guard?(socket.assigns.current_user, :show, post) do + {:ok, socket} + else + {:error, "You do not have permission to view this post."} + end + end + + @impl true + def handle_in("send", body, socket) do + broadcast!(socket, "shout", body) + {:reply, :ok, socket} + end +end \ No newline at end of file diff --git a/lib/aggiedit_web/channels/user_socket.ex b/lib/aggiedit_web/channels/user_socket.ex new file mode 100644 index 0000000..b7c0124 --- /dev/null +++ b/lib/aggiedit_web/channels/user_socket.ex @@ -0,0 +1,17 @@ +defmodule AggieditWeb.UserSocket do + alias Aggiedit.Accounts + use Phoenix.Socket + + channel "post:*", AggieditWeb.PostChannel + + @impl true + def connect(_params, socket, %{:session => %{"user_token" => token}}) do + case Accounts.get_user_by_session_token(token) do + user=%Accounts.User{} -> {:ok, assign(socket, %{:current_user => user})} + _ -> {:error, "Invalid user token."} + end + end + + @impl true + def id(_socket), do: nil +end \ No newline at end of file diff --git a/lib/aggiedit_web/endpoint.ex b/lib/aggiedit_web/endpoint.ex index 95577f0..d431553 100644 --- a/lib/aggiedit_web/endpoint.ex +++ b/lib/aggiedit_web/endpoint.ex @@ -12,6 +12,8 @@ defmodule AggieditWeb.Endpoint do socket "/live", Phoenix.LiveView.Socket, websocket: [connect_info: [session: @session_options]] + socket "/socket", AggieditWeb.UserSocket, websocket: [connect_info: [session: @session_options]], longpoll: false + # Serve at "/" the static files from "priv/static" directory. # # You should set gzip to true if you are running phx.digest diff --git a/lib/aggiedit_web/live/post_live/index.ex b/lib/aggiedit_web/live/post_live/index.ex index 6b2be56..59ec234 100644 --- a/lib/aggiedit_web/live/post_live/index.ex +++ b/lib/aggiedit_web/live/post_live/index.ex @@ -29,7 +29,6 @@ defmodule AggieditWeb.PostLive.Index do @impl true def handle_params(params, _url, socket) do - IO.puts(inspect(params)) {:noreply, apply_action(socket, socket.assigns.live_action, params)} end diff --git a/lib/aggiedit_web/live/post_live/show.html.heex b/lib/aggiedit_web/live/post_live/show.html.heex index ba71c75..107a3a6 100644 --- a/lib/aggiedit_web/live/post_live/show.html.heex +++ b/lib/aggiedit_web/live/post_live/show.html.heex @@ -30,3 +30,8 @@ <%= live_patch "Edit", to: Routes.post_show_path(@socket, :edit, @room, @post), class: "button" %> | <%= live_redirect "Back", to: Routes.post_index_path(@socket, :index, @room) %> + + diff --git a/lib/aggiedit_web/templates/layout/root.html.heex b/lib/aggiedit_web/templates/layout/root.html.heex index 3fb7d93..a164571 100644 --- a/lib/aggiedit_web/templates/layout/root.html.heex +++ b/lib/aggiedit_web/templates/layout/root.html.heex @@ -7,7 +7,7 @@ <%= csrf_meta_tag() %> <%= live_title_tag assigns[:page_title] || "Aggiedit" %> - +