-
Notifications
You must be signed in to change notification settings - Fork 93
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
184cfa9
commit 8dfb080
Showing
35 changed files
with
2,063 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
@import "tailwindcss/base"; | ||
@import "tailwindcss/components"; | ||
@import "tailwindcss/utilities"; | ||
|
||
/* This file is for your main application CSS */ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
// If you want to use Phoenix channels, run `mix help phx.gen.channel` | ||
// to get started and then uncomment the line below. | ||
// import "./user_socket.js" | ||
|
||
// You can include dependencies in two ways. | ||
// | ||
// The simplest option is to put them in assets/vendor and | ||
// import them using relative paths: | ||
// | ||
// import "../vendor/some-package.js" | ||
// | ||
// Alternatively, you can `npm install some-package --prefix assets` and import | ||
// them using a path starting with the package name: | ||
// | ||
// import "some-package" | ||
// | ||
|
||
// Include phoenix_html to handle method=PUT/DELETE in forms and buttons. | ||
import "phoenix_html" | ||
// Establish Phoenix Socket and LiveView configuration. | ||
import {Socket} from "phoenix" | ||
import {LiveSocket} from "phoenix_live_view" | ||
import topbar from "../vendor/topbar" | ||
|
||
let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") | ||
let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}}) | ||
|
||
// Show progress bar on live navigation and form submits | ||
topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"}) | ||
window.addEventListener("phx:page-loading-start", info => topbar.delayedShow(200)) | ||
window.addEventListener("phx:page-loading-stop", info => topbar.hide()) | ||
|
||
// connect if there are any LiveViews on the page | ||
liveSocket.connect() | ||
|
||
// expose liveSocket on window for web console debug logs and latency simulation: | ||
// >> liveSocket.enableDebug() | ||
// >> liveSocket.enableLatencySim(1000) // enabled for duration of browser session | ||
// >> liveSocket.disableLatencySim() | ||
window.liveSocket = liveSocket | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
// See the Tailwind configuration guide for advanced usage | ||
// https://tailwindcss.com/docs/configuration | ||
|
||
const plugin = require("tailwindcss/plugin") | ||
|
||
module.exports = { | ||
content: [ | ||
"./js/**/*.js", | ||
"../lib/*_web.ex", | ||
"../lib/*_web/**/*.*ex" | ||
], | ||
theme: { | ||
extend: { | ||
colors: { | ||
brand: "#FD4F00", | ||
} | ||
}, | ||
}, | ||
plugins: [ | ||
require("@tailwindcss/forms"), | ||
plugin(({addVariant}) => addVariant("phx-no-feedback", [".phx-no-feedback&", ".phx-no-feedback &"])), | ||
plugin(({addVariant}) => addVariant("phx-click-loading", [".phx-click-loading&", ".phx-click-loading &"])), | ||
plugin(({addVariant}) => addVariant("phx-submit-loading", [".phx-submit-loading&", ".phx-submit-loading &"])), | ||
plugin(({addVariant}) => addVariant("phx-change-loading", [".phx-change-loading&", ".phx-change-loading &"])) | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,167 @@ | ||
/** | ||
* @license MIT | ||
* topbar 1.0.0, 2021-01-06 | ||
* Modifications: | ||
* - add delayedShow(time) (2022-09-21) | ||
* http://buunguyen.github.io/topbar | ||
* Copyright (c) 2021 Buu Nguyen | ||
*/ | ||
(function (window, document) { | ||
"use strict"; | ||
|
||
// https://gist.github.com/paulirish/1579671 | ||
(function () { | ||
var lastTime = 0; | ||
var vendors = ["ms", "moz", "webkit", "o"]; | ||
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { | ||
window.requestAnimationFrame = | ||
window[vendors[x] + "RequestAnimationFrame"]; | ||
window.cancelAnimationFrame = | ||
window[vendors[x] + "CancelAnimationFrame"] || | ||
window[vendors[x] + "CancelRequestAnimationFrame"]; | ||
} | ||
if (!window.requestAnimationFrame) | ||
window.requestAnimationFrame = function (callback, element) { | ||
var currTime = new Date().getTime(); | ||
var timeToCall = Math.max(0, 16 - (currTime - lastTime)); | ||
var id = window.setTimeout(function () { | ||
callback(currTime + timeToCall); | ||
}, timeToCall); | ||
lastTime = currTime + timeToCall; | ||
return id; | ||
}; | ||
if (!window.cancelAnimationFrame) | ||
window.cancelAnimationFrame = function (id) { | ||
clearTimeout(id); | ||
}; | ||
})(); | ||
|
||
var canvas, | ||
currentProgress, | ||
showing, | ||
progressTimerId = null, | ||
fadeTimerId = null, | ||
delayTimerId = null, | ||
addEvent = function (elem, type, handler) { | ||
if (elem.addEventListener) elem.addEventListener(type, handler, false); | ||
else if (elem.attachEvent) elem.attachEvent("on" + type, handler); | ||
else elem["on" + type] = handler; | ||
}, | ||
options = { | ||
autoRun: true, | ||
barThickness: 3, | ||
barColors: { | ||
0: "rgba(26, 188, 156, .9)", | ||
".25": "rgba(52, 152, 219, .9)", | ||
".50": "rgba(241, 196, 15, .9)", | ||
".75": "rgba(230, 126, 34, .9)", | ||
"1.0": "rgba(211, 84, 0, .9)", | ||
}, | ||
shadowBlur: 10, | ||
shadowColor: "rgba(0, 0, 0, .6)", | ||
className: null, | ||
}, | ||
repaint = function () { | ||
canvas.width = window.innerWidth; | ||
canvas.height = options.barThickness * 5; // need space for shadow | ||
|
||
var ctx = canvas.getContext("2d"); | ||
ctx.shadowBlur = options.shadowBlur; | ||
ctx.shadowColor = options.shadowColor; | ||
|
||
var lineGradient = ctx.createLinearGradient(0, 0, canvas.width, 0); | ||
for (var stop in options.barColors) | ||
lineGradient.addColorStop(stop, options.barColors[stop]); | ||
ctx.lineWidth = options.barThickness; | ||
ctx.beginPath(); | ||
ctx.moveTo(0, options.barThickness / 2); | ||
ctx.lineTo( | ||
Math.ceil(currentProgress * canvas.width), | ||
options.barThickness / 2 | ||
); | ||
ctx.strokeStyle = lineGradient; | ||
ctx.stroke(); | ||
}, | ||
createCanvas = function () { | ||
canvas = document.createElement("canvas"); | ||
var style = canvas.style; | ||
style.position = "fixed"; | ||
style.top = style.left = style.right = style.margin = style.padding = 0; | ||
style.zIndex = 100001; | ||
style.display = "none"; | ||
if (options.className) canvas.classList.add(options.className); | ||
document.body.appendChild(canvas); | ||
addEvent(window, "resize", repaint); | ||
}, | ||
topbar = { | ||
config: function (opts) { | ||
for (var key in opts) | ||
if (options.hasOwnProperty(key)) options[key] = opts[key]; | ||
}, | ||
delayedShow: function(time) { | ||
if (showing) return; | ||
if (delayTimerId) return; | ||
delayTimerId = setTimeout(() => topbar.show(), time); | ||
}, | ||
show: function () { | ||
if (showing) return; | ||
showing = true; | ||
if (fadeTimerId !== null) window.cancelAnimationFrame(fadeTimerId); | ||
if (!canvas) createCanvas(); | ||
canvas.style.opacity = 1; | ||
canvas.style.display = "block"; | ||
topbar.progress(0); | ||
if (options.autoRun) { | ||
(function loop() { | ||
progressTimerId = window.requestAnimationFrame(loop); | ||
topbar.progress( | ||
"+" + 0.05 * Math.pow(1 - Math.sqrt(currentProgress), 2) | ||
); | ||
})(); | ||
} | ||
}, | ||
progress: function (to) { | ||
if (typeof to === "undefined") return currentProgress; | ||
if (typeof to === "string") { | ||
to = | ||
(to.indexOf("+") >= 0 || to.indexOf("-") >= 0 | ||
? currentProgress | ||
: 0) + parseFloat(to); | ||
} | ||
currentProgress = to > 1 ? 1 : to; | ||
repaint(); | ||
return currentProgress; | ||
}, | ||
hide: function () { | ||
clearTimeout(delayTimerId); | ||
delayTimerId = null; | ||
if (!showing) return; | ||
showing = false; | ||
if (progressTimerId != null) { | ||
window.cancelAnimationFrame(progressTimerId); | ||
progressTimerId = null; | ||
} | ||
(function loop() { | ||
if (topbar.progress("+.1") >= 1) { | ||
canvas.style.opacity -= 0.05; | ||
if (canvas.style.opacity <= 0.05) { | ||
canvas.style.display = "none"; | ||
fadeTimerId = null; | ||
return; | ||
} | ||
} | ||
fadeTimerId = window.requestAnimationFrame(loop); | ||
})(); | ||
}, | ||
}; | ||
|
||
if (typeof module === "object" && typeof module.exports === "object") { | ||
module.exports = topbar; | ||
} else if (typeof define === "function" && define.amd) { | ||
define(function () { | ||
return topbar; | ||
}); | ||
} else { | ||
this.topbar = topbar; | ||
} | ||
}.call(this, window, document)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,55 @@ | ||
# This file is responsible for configuring your application | ||
# and its dependencies with the aid of the Config module. | ||
# | ||
# This configuration file is loaded before any dependency and | ||
# is restricted to this project. | ||
|
||
# General application configuration | ||
import Config | ||
|
||
config :chat, | ||
ecto_repos: [Chat.Repo] | ||
|
||
# Configures the endpoint | ||
config :chat, ChatWeb.Endpoint, | ||
url: [host: "localhost"], | ||
render_errors: [ | ||
formats: [html: ChatWeb.ErrorHTML, json: ChatWeb.ErrorJSON], | ||
layout: false | ||
], | ||
pubsub_server: Chat.PubSub, | ||
live_view: [signing_salt: "+WPT6t+Q"] | ||
|
||
# Configure esbuild (the version is required) | ||
config :esbuild, | ||
version: "0.14.41", | ||
default: [ | ||
args: | ||
~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*), | ||
cd: Path.expand("../assets", __DIR__), | ||
env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)} | ||
] | ||
|
||
# Configure tailwind (the version is required) | ||
config :tailwind, | ||
version: "3.1.8", | ||
default: [ | ||
args: ~w( | ||
--config=tailwind.config.js | ||
--input=css/app.css | ||
--output=../priv/static/assets/app.css | ||
), | ||
cd: Path.expand("../assets", __DIR__) | ||
] | ||
|
||
# Configures Elixir's Logger | ||
config :logger, :console, | ||
format: "$time $metadata[$level] $message\n", | ||
metadata: [:request_id] | ||
|
||
# Use Jason for JSON parsing in Phoenix | ||
config :phoenix, :json_library, Jason | ||
|
||
# Import environment specific config. This must remain at the bottom | ||
# of this file so it overrides the configuration defined above. | ||
import_config "#{config_env()}.exs" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,76 @@ | ||
import Config | ||
|
||
# Configure your database | ||
config :chat, Chat.Repo, | ||
username: "postgres", | ||
password: "postgres", | ||
hostname: "localhost", | ||
database: "chat_dev", | ||
stacktrace: true, | ||
show_sensitive_data_on_connection_error: true, | ||
pool_size: 10 | ||
|
||
# For development, we disable any cache and enable | ||
# debugging and code reloading. | ||
# | ||
# The watchers configuration can be used to run external | ||
# watchers to your application. For example, we use it | ||
# with esbuild to bundle .js and .css sources. | ||
config :chat, ChatWeb.Endpoint, | ||
# Binding to loopback ipv4 address prevents access from other machines. | ||
# Change to `ip: {0, 0, 0, 0}` to allow access from other machines. | ||
http: [ip: {127, 0, 0, 1}, port: 4000], | ||
check_origin: false, | ||
code_reloader: true, | ||
debug_errors: true, | ||
secret_key_base: "49JM0j5WAPMEqDoNZb0TLFmJ+AkNmE+wGX0pR55AEvV2z6yWNjhlWCcVbPASEl1a", | ||
watchers: [ | ||
esbuild: {Esbuild, :install_and_run, [:default, ~w(--sourcemap=inline --watch)]}, | ||
tailwind: {Tailwind, :install_and_run, [:default, ~w(--watch)]} | ||
] | ||
|
||
# ## SSL Support | ||
# | ||
# In order to use HTTPS in development, a self-signed | ||
# certificate can be generated by running the following | ||
# Mix task: | ||
# | ||
# mix phx.gen.cert | ||
# | ||
# Run `mix help phx.gen.cert` for more information. | ||
# | ||
# The `http:` config above can be replaced with: | ||
# | ||
# https: [ | ||
# port: 4001, | ||
# cipher_suite: :strong, | ||
# keyfile: "priv/cert/selfsigned_key.pem", | ||
# certfile: "priv/cert/selfsigned.pem" | ||
# ], | ||
# | ||
# If desired, both `http:` and `https:` keys can be | ||
# configured to run both http and https servers on | ||
# different ports. | ||
|
||
# Watch static and templates for browser reloading. | ||
config :chat, ChatWeb.Endpoint, | ||
live_reload: [ | ||
patterns: [ | ||
~r"priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$", | ||
~r"lib/chat_web/(live|views)/.*(ex)$", | ||
~r"lib/chat_web/templates/.*(eex)$" | ||
] | ||
] | ||
|
||
# Enable dev routes for dashboard and mailbox | ||
config :chat, dev_routes: true | ||
|
||
# Do not include metadata nor timestamps in development logs | ||
config :logger, :console, format: "[$level] $message\n" | ||
|
||
# Set a higher stacktrace during development. Avoid configuring such | ||
# in production as building large stacktraces may be expensive. | ||
config :phoenix, :stacktrace_depth, 20 | ||
|
||
# Initialize plugs at runtime for faster development compilation | ||
config :phoenix, :plug_init_mode, :runtime |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import Config | ||
|
||
# For production, don't forget to configure the url host | ||
# to something meaningful, Phoenix uses this information | ||
# when generating URLs. | ||
|
||
# Note we also include the path to a cache manifest | ||
# containing the digested version of static files. This | ||
# manifest is generated by the `mix phx.digest` task, | ||
# which you should run after static files are built and | ||
# before starting your production server. | ||
config :chat, ChatWeb.Endpoint, cache_static_manifest: "priv/static/cache_manifest.json" | ||
|
||
# Do not print debug messages in production | ||
config :logger, level: :info | ||
|
||
# Runtime production configuration, including reading | ||
# of environment variables, is done on config/runtime.exs. |
Oops, something went wrong.