Added page based title, use local assets ( CSS and logo ), pagination in blocks page

This commit is contained in:
Vamsi Krishna B 2021-07-17 19:58:43 +05:30
parent d884ca6279
commit d970a6dfc0
20 changed files with 189 additions and 38 deletions

View File

@ -1,7 +1,11 @@
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
import "@fontsource/inter/400.css";
import "@fontsource/inter/variable.css";
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured

View File

@ -1015,6 +1015,11 @@
"to-fast-properties": "^2.0.0"
}
},
"@fontsource/inter": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-4.5.0.tgz",
"integrity": "sha512-2efK8Ru0LkuOYrEpiHPlV02YkTdIKGbezlxVNeA8/3c+tNt7P2aQPuiYYkVy7N4GA5LWSUVcLL/91MpCIjinOw=="
},
"@fullhuman/postcss-purgecss": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-3.1.3.tgz",
@ -3601,6 +3606,40 @@
"integrity": "sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==",
"dev": true
},
"file-loader": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/file-loader/-/file-loader-6.2.0.tgz",
"integrity": "sha512-qo3glqyTa61Ytg4u73GultjHGjdRyig3tG6lPtyX/jOEJvHif9uB0/OCI2Kif6ctF3caQTW2G5gym21oAsI4pw==",
"dev": true,
"requires": {
"loader-utils": "^2.0.0",
"schema-utils": "^3.0.0"
},
"dependencies": {
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
},
"schema-utils": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.0.tgz",
"integrity": "sha512-tTEaeYkyIhEZ9uWgAjDerWov3T9MgX8dhhy2r0IGeeX4W8ngtGl1++dUve/RUqzuaASSh7shwCDJjEzthxki8w==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.7",
"ajv": "^6.12.5",
"ajv-keywords": "^3.5.2"
}
}
}
},
"file-uri-to-path": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",

View File

@ -7,6 +7,7 @@
"watch": "webpack --mode development --watch"
},
"dependencies": {
"@fontsource/inter": "^4.5.0",
"alpinejs": "^2.8.2",
"phoenix": "file:../deps/phoenix",
"phoenix_html": "file:../deps/phoenix_html",
@ -15,10 +16,12 @@
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@tailwindcss/forms": "^0.3.3",
"autoprefixer": "^10.2.5",
"babel-loader": "^8.0.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.2",
"file-loader": "^6.2.0",
"hard-source-webpack-plugin": "^0.13.1",
"mini-css-extract-plugin": "^0.9.0",
"node-sass": "^4.13.1",
@ -29,7 +32,6 @@
"tailwindcss": "^2.0.4",
"terser-webpack-plugin": "^2.3.2",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.2",
"@tailwindcss/forms": "^0.3.3"
"webpack-cli": "^3.3.2"
}
}

View File

@ -0,0 +1,2 @@
<?xml version="1.0" encoding="utf-8"?>
<svg enable-background="new 0 0 493.3 490.2" viewBox="0 0 493.3 490.2" xmlns="http://www.w3.org/2000/svg"><g fill="#fff"><path d="m245.4 20c-124.3 0-225.4 101.1-225.4 225.4s101.1 225.4 225.4 225.4 225.4-101.1 225.4-225.4-101.1-225.4-225.4-225.4zm0 413.6c-103.8 0-188.2-84.4-188.2-188.2s84.4-188.2 188.2-188.2 188.2 84.4 188.2 188.2-84.4 188.2-188.2 188.2z"/><path d="m325.8 175.1v-34.3h-61.5v-37.8h-37.8v37.8h-61.5v45.5h95.3l-95.3 129.4v34.3h61.5v37.7h37.8v-37.7h61.5v-45.5h-95.4z"/></g></svg>

After

Width:  |  Height:  |  Size: 532 B

View File

@ -12,7 +12,7 @@ module.exports = {
theme: {
extend: {
fontFamily: {
sans: ['Inter var'],
sans: ['Inter', defaultTheme.fontFamily.sans],
}
},
},

View File

@ -42,7 +42,24 @@ module.exports = (env, options) => {
'postcss-loader',
'sass-loader',
],
}
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: [
{
loader: 'file-loader',
options: {
outputPath: (url, resourcePath, context) => {
if(devMode) {
const relativePath = path.relative(context, resourcePath);
return `/${relativePath}`;
}
return `/assets/fonts/${path.basename(resourcePath)}`;
}
}
}
]
}
]
},
plugins: [

View File

@ -38,6 +38,8 @@ defmodule ZcashExplorerWeb do
import Phoenix.Controller,
only: [get_flash: 1, get_flash: 2, view_module: 1, view_template: 1]
# Include shared imports and aliases for views
unquote(view_helpers())
end

View File

@ -9,7 +9,11 @@ defmodule ZcashExplorerWeb.AddressController do
|> EQRCode.png(width: 150, color: <<0, 0, 0>>, background_color: :transparent)
|> Base.encode64()
render(conn, "z_address.html", address: address, qr: qr)
render(conn, "z_address.html",
address: address,
qr: qr,
page_title: "Zcash Shielded Address"
)
end
{:ok, info} = Cachex.get(:app_cache, "metrics")
@ -39,7 +43,8 @@ defmodule ZcashExplorerWeb.AddressController do
end_block: e,
start_block: s,
latest_block: blocks,
capped_e: capped_e
capped_e: capped_e,
page_title: "Zcash Address #{address}"
)
end
@ -51,7 +56,11 @@ defmodule ZcashExplorerWeb.AddressController do
|> EQRCode.png(width: 150, color: <<0, 0, 0>>, background_color: :transparent)
|> Base.encode64()
render(conn, "z_address.html", address: address, qr: qr)
render(conn, "z_address.html",
address: address,
qr: qr,
page_title: "Zcash Shielded Address"
)
end
c = 128
@ -78,7 +87,8 @@ defmodule ZcashExplorerWeb.AddressController do
end_block: e,
start_block: s,
latest_block: latest_block,
capped_e: nil
capped_e: nil,
page_title: "Zcash Address #{address}"
)
end
end

View File

@ -11,10 +11,19 @@ defmodule ZcashExplorerWeb.BlockController do
n when n <= 250 ->
{:ok, block_data} = Zcashex.getblock(hash, 2)
block_data = Zcashex.Block.from_map(block_data)
render(conn, "index.html", block_data: block_data, block_subsidy: nil)
height = block_data.height
render(conn, "index.html",
block_data: block_data,
block_subsidy: nil,
page_title: "Zcash block #{height}"
)
n when n > 250 ->
render(conn, "basic_block.html", block_data: basic_block_data)
render(conn, "basic_block.html",
block_data: basic_block_data,
page_title: "Zcash block #{hash}"
)
end
# TODO : display block subsidy
@ -24,7 +33,25 @@ defmodule ZcashExplorerWeb.BlockController do
def index(conn, %{"date" => date}) do
max_concurrency = System.schedulers_online() * 2
now = NaiveDateTime.utc_now() |> Timex.beginning_of_day()
parsed_date = Timex.parse!(date, "{YYYY}-{0M}-{D}")
diff = Timex.diff(parsed_date, now, :day)
if diff > 0 do
conn
|> put_status(:not_found)
|> put_view(ZcashExplorerWeb.ErrorView)
|> render(:invalid_input)
end
previous = Timex.shift(parsed_date, days: -1) |> Timex.format!("{YYYY}-{0M}-{D}")
next = Timex.shift(parsed_date, days: 1) |> Timex.format!("{YYYY}-{0M}-{D}")
first_block_date = "2016-10-28"
disable_previous = if first_block_date == date, do: true, else: false
disable_next =
if Timex.today() |> Timex.format!("{YYYY}-{0M}-{D}") == date, do: true, else: false
high = parsed_date |> Timex.end_of_day() |> Timex.to_unix()
low = parsed_date |> Timex.beginning_of_day() |> Timex.to_unix()
@ -40,7 +67,17 @@ defmodule ZcashExplorerWeb.BlockController do
|> Enum.map(fn {task, {:ok, res}} -> res end)
|> Enum.reverse()
render(conn, "blocks.html", blocks_data: blocks_data, date: date)
render(
conn,
"blocks.html",
blocks_data: blocks_data,
date: date,
disable_next: disable_next,
disable_previous: disable_previous,
next: next,
previous: previous,
page_title: "Zcash blocks mined on #{date}"
)
end
end
@ -49,6 +86,9 @@ defmodule ZcashExplorerWeb.BlockController do
today = Timex.today()
high = DateTime.utc_now() |> DateTime.to_unix()
low = DateTime.utc_now() |> Timex.beginning_of_day() |> Timex.to_unix()
disable_next = true
disable_previous = false
previous = Timex.shift(today, days: -1)
case Zcashex.getblockhashes(high, low, true, false) do
{:ok, blocks} ->
@ -62,7 +102,14 @@ defmodule ZcashExplorerWeb.BlockController do
|> Enum.map(fn {task, {:ok, res}} -> res end)
|> Enum.reverse()
render(conn, "blocks.html", blocks_data: blocks_data, date: today)
render(conn, "blocks.html",
blocks_data: blocks_data,
date: today,
disable_next: disable_next,
disable_previous: disable_previous,
previous: previous,
page_title: "Zcash latest blocks"
)
end
end
end

View File

@ -2,11 +2,14 @@ defmodule ZcashExplorerWeb.PageController do
use ZcashExplorerWeb, :controller
def index(conn, _params) do
render(conn, "index.html")
render(conn, "index.html", page_title: "Zcash Explorer - Search the Zcash Blockchain")
end
def broadcast(conn, _params) do
render(conn, "broadcast.html", csrf_token: get_csrf_token())
render(conn, "broadcast.html",
csrf_token: get_csrf_token(),
page_title: "Broadcast raw Zcash transaction"
)
end
def do_broadcast(conn, params) do
@ -17,13 +20,19 @@ defmodule ZcashExplorerWeb.PageController do
# IO.inspect(resp)
conn
|> put_flash(:info, resp)
|> render("broadcast.html", csrf_token: get_csrf_token())
|> render("broadcast.html",
csrf_token: get_csrf_token(),
page_title: "Broadcast raw Zcash transaction"
)
{:error, reason} ->
# IO.inspect(reason)
conn
|> put_flash(:error, reason)
|> render("broadcast.html", csrf_token: get_csrf_token())
|> render("broadcast.html",
csrf_token: get_csrf_token(),
page_title: "Broadcast raw Zcash Transaction"
)
end
end
@ -31,7 +40,8 @@ defmodule ZcashExplorerWeb.PageController do
render(conn, "disclosure.html",
csrf_token: get_csrf_token(),
disclosed_data: nil,
disclosure_hex: nil
disclosure_hex: nil,
page_title: "Zcash Payment Disclosure"
)
end
@ -45,7 +55,8 @@ defmodule ZcashExplorerWeb.PageController do
|> render("disclosure.html",
csrf_token: get_csrf_token(),
disclosed_data: resp,
disclosure_hex: disclosure_hex
disclosure_hex: disclosure_hex,
page_title: "Zcash Payment Disclosure"
)
{:error, reason} ->
@ -54,12 +65,13 @@ defmodule ZcashExplorerWeb.PageController do
|> render("disclosure.html",
csrf_token: get_csrf_token(),
disclosed_data: nil,
disclosure_hex: disclosure_hex
disclosure_hex: disclosure_hex,
page_title: "Zcash Payment Disclosure"
)
end
end
def mempool(conn, _params) do
render(conn, "mempool.html")
render(conn, "mempool.html", page_title: "Zcash Mempool")
end
end

View File

@ -4,6 +4,6 @@ defmodule ZcashExplorerWeb.TransactionController do
def get_transaction(conn, %{"txid" => txid}) do
{:ok, tx} = Zcashex.getrawtransaction(txid, 1)
tx_data = Zcashex.Transaction.from_map(tx)
render(conn, "tx.html", tx: tx_data)
render(conn, "tx.html", tx: tx_data, page_title: "Zcash Transaction #{txid}")
end
end

View File

@ -1,5 +1,5 @@
<main class="py-4">
<div class="grid gap-4 grid-cols-1 mx-8">
<div class="grid gap-4 grid-cols-1 mx-8">
<h3 class="text-lg leading-6 font-medium text-gray-500 py-3">
Zcash blocks mined on <%= @date %>
@ -13,7 +13,6 @@
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Time ( UTC )</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Confirmations</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Difficulty</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Version</th>
</tr>
</thead>
<tbody class="bg-white-500 divide-y divide-gray-200">
@ -40,18 +39,30 @@
<%= block["difficulty"] %>
</td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
<%= block["version"] %>
</td>
</tr>
<% end %>
</table>
</div>
</div>
</div>
<div class="flex-1 flex justify-between sm:justify-end">
<%= if !@disable_previous do %>
<a href='/blocks?date=<%= @previous %>' class="relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
Previous
</a>
<% end %>
<%= if !@disable_next do %>
<a href="='/blocks?date=<%= @next %>" class="ml-3 relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
Next
</a>
<% end %>
</div>
</div>
</main>

View File

@ -6,7 +6,7 @@
<div class="flex items-center px-2 lg:px-0 xl:w-64">
<a href="/">
<div class="flex-shrink-0">
<img class="h-8 w-auto" src="https://z.cash/wp-content/uploads/2020/03/zcash-icon-white.svg" alt="Zcash Explorer">
<img class="h-8 w-auto" src="<%= Routes.static_path(@conn, "/images/zcash-icon-white.svg") %>" alt="Zcash Explorer">
</div>
</a>
<a href="/">

View File

@ -4,9 +4,8 @@
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Zcash Explorer</title>
<%= live_title_tag assigns[:page_title] || " " %>
<link rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/app.css") %>"/>
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
<%= csrf_meta_tag() %>
<script defer type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
</head>

View File

@ -1,6 +1,8 @@
defmodule ZcashExplorerWeb.AddressView do
use ZcashExplorerWeb, :view
def title(:get_address, _assigns), do: "Edit Profile"
def zatoshi_to_zec(zatoshi) do
zatoshi_per_zec = :math.pow(10, -8)
zatoshi_per_zec * zatoshi

View File

@ -1,6 +1,7 @@
defmodule ZcashExplorerWeb.BlockView do
use ZcashExplorerWeb, :view
def mined_time(nil) do
"Not yet mined"
end

View File

@ -15,7 +15,7 @@ defmodule ZcashExplorerWeb.ErrorView do
end
def render("invalid_input.html", _assigns) do
"Not a valid search input"
"Invalid input"
end
def render("404.html", _assigns) do

View File

@ -55,7 +55,8 @@ defmodule ZcashExplorer.MixProject do
{:zcashex, github: "nighthawk-apps/zcashex"},
{:timex, "~> 3.0"},
{:sizeable, "~> 1.0"},
{:eqrcode, "~> 0.1.8"}
{:eqrcode, "~> 0.1.8"},
{:contex, "~> 0.3.0"}
]
end

View File

@ -3,6 +3,7 @@
"certifi": {:hex, :certifi, "2.6.1", "dbab8e5e155a0763eea978c913ca280a6b544bfa115633fa20249c3d396d9493", [:rebar3], [], "hexpm", "524c97b4991b3849dd5c17a631223896272c6b0af446778ba4675a1dff53bb7e"},
"combine": {:hex, :combine, "0.10.0", "eff8224eeb56498a2af13011d142c5e7997a80c8f5b97c499f84c841032e429f", [:mix], [], "hexpm", "1b1dbc1790073076580d0d1d64e42eae2366583e7aecd455d1215b0d16f2451b"},
"connection": {:hex, :connection, "1.1.0", "ff2a49c4b75b6fb3e674bfc5536451607270aac754ffd1bdfe175abe4a6d7a68", [:mix], [], "hexpm", "722c1eb0a418fbe91ba7bd59a47e28008a189d47e37e0e7bb85585a016b2869c"},
"contex": {:hex, :contex, "0.3.0", "d390713efee604702600ba801a481bcb8534a9af43e118b29d9d37fe4495fcba", [:mix], [{:nimble_strftime, "~> 0.1.0", [hex: :nimble_strftime, repo: "hexpm", optional: false]}], "hexpm", "3fa7535cc3b265691a4eabc2707fe8622aa60a2565145a14da9aebd613817652"},
"cowboy": {:hex, :cowboy, "2.9.0", "865dd8b6607e14cf03282e10e934023a1bd8be6f6bacf921a7e2a96d800cd452", [:make, :rebar3], [{:cowlib, "2.11.0", [hex: :cowlib, repo: "hexpm", optional: false]}, {:ranch, "1.8.0", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm", "2c729f934b4e1aa149aff882f57c6372c15399a20d54f65c8d67bef583021bde"},
"cowboy_telemetry": {:hex, :cowboy_telemetry, "0.3.1", "ebd1a1d7aff97f27c66654e78ece187abdc646992714164380d8a041eda16754", [:rebar3], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "3a6efd3366130eab84ca372cbd4a7d3c3a97bdfcfb4911233b035d117063f0af"},
"cowlib": {:hex, :cowlib, "2.11.0", "0b9ff9c346629256c42ebe1eeb769a83c6cb771a6ee5960bd110ab0b9b872063", [:make, :rebar3], [], "hexpm", "2b3e9da0b21c4565751a6d4901c20d1b4cc25cbb7fd50d91d2ab6dd287bc86a9"},
@ -25,6 +26,7 @@
"metrics": {:hex, :metrics, "1.0.1", "25f094dea2cda98213cecc3aeff09e940299d950904393b2a29d191c346a8486", [:rebar3], [], "hexpm", "69b09adddc4f74a40716ae54d140f93beb0fb8978d8636eaded0c31b6f099f16"},
"mime": {:hex, :mime, "1.6.0", "dabde576a497cef4bbdd60aceee8160e02a6c89250d6c0b29e56c0dfb00db3d2", [:mix], [], "hexpm", "31a1a8613f8321143dde1dafc36006a17d28d02bdfecb9e95a880fa7aabd19a7"},
"mimerl": {:hex, :mimerl, "1.2.0", "67e2d3f571088d5cfd3e550c383094b47159f3eee8ffa08e64106cdf5e981be3", [:rebar3], [], "hexpm", "f278585650aa581986264638ebf698f8bb19df297f66ad91b18910dfc6e19323"},
"nimble_strftime": {:hex, :nimble_strftime, "0.1.1", "b988184d1bd945bc139b2c27dd00a6c0774ec94f6b0b580083abd62d5d07818b", [:mix], [], "hexpm", "89e599c9b8b4d1203b7bb5c79eb51ef7c6a28fbc6228230b312f8b796310d755"},
"observer_cli": {:hex, :observer_cli, "1.6.2", "016588e9a966247401bcbf02976d468f1e6f06891dde44f873c9259c6496cca1", [:mix, :rebar3], [{:recon, "~>2.5.1", [hex: :recon, repo: "hexpm", optional: false]}], "hexpm", "c23db9e4cca0e849adc42b0a099affb9e6267c5f23a871fc6f144348b249341f"},
"parse_trans": {:hex, :parse_trans, "3.3.1", "16328ab840cc09919bd10dab29e431da3af9e9e7e7e6f0089dd5a2d2820011d8", [:rebar3], [], "hexpm", "07cd9577885f56362d414e8c4c4e6bdf10d43a8767abb92d24cbe8b24c54888b"},
"phoenix": {:hex, :phoenix, "1.5.9", "a6368d36cfd59d917b37c44386e01315bc89f7609a10a45a22f47c007edf2597", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_html, "~> 2.13 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.0", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:plug, "~> 1.10", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 1.0 or ~> 2.2", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.1.2 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "7e4bce20a67c012f1fbb0af90e5da49fa7bf0d34e3a067795703b74aef75427d"},