Skip to content

Commit 519abc4

Browse files
symkatsymkat
committed
Template cleanup and homepage.
1 parent 39e16de commit 519abc4

File tree

9 files changed

+68
-232
lines changed

9 files changed

+68
-232
lines changed

‎Web/lib/OpenNewsWire/Web/Controller/Root.pm‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,10 @@ sub base :Chained('/') PathPart('') CaptureArgs(0) {
2424

2525
sub index :Chained('base') PathPart('') Args(0) {
2626
my ( $self, $c ) = @_;
27+
$c->stash->{template} = 'index.tx';
28+
29+
push @{$c->stash->{messages}},
30+
$c->model('DB')->resultset('TopicChannelMessage')->search()->all;
2731
}
2832

2933
sub get_logout :Chained('base') PathPart('logout') Args(0) Method('GET') {

‎Web/root/index.tx‎

Lines changed: 29 additions & 228 deletions
Original file line numberDiff line numberDiff line change
@@ -1,232 +1,33 @@
11
%% cascade '_base.tx'
22

3-
%% override footer -> {
4-
<!-- Syntax Hilighting Support -->
5-
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.2/build/highlight.min.js"></script>
6-
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.2/build/languages/perl.min.js"></script>
7-
<script>hljs.highlightAll();</script>
8-
%% }
9-
10-
%% override header -> {
11-
<!-- Syntax Hilighting Support -->
12-
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.2/build/styles/default.min.css">
13-
14-
15-
<style>
16-
.inline-code {
17-
font-family: monospace;
18-
background-color: #eee;
19-
}
20-
21-
h2, h3, h4, h5, h6 {
22-
padding-top: 1em;
23-
padding-bottom: 0.5em;
24-
font-weight: bold;
25-
display: flex;
26-
align-items: center;
27-
}
28-
h1 { font-size: 2em; }
29-
h2 { font-size: 1.5em; }
30-
h3 { font-size: 1.25em; }
31-
h4 { font-size: 1em; }
32-
h5 { font-size: 0.75em; }
33-
h6 { font-size: 0.5em; }
34-
35-
h1::after, h2::after, h3::after, h4::after, h5::after, h6::after {
36-
content: '';
37-
flex: 1;
38-
margin-left: 1rem;
39-
height: 1px;
40-
background-color: #000;
41-
}
42-
43-
p {
44-
text-indent: 1.5em;
45-
}
46-
</style>
47-
%% }
48-
49-
%% override content -> {
50-
<p style="margin-top: 1.5em">HouseNewsWire is meant to be a starting point for building your own webapp. It is a fully functional webapp that supports user registration, login. It has a simple dashboard with one to many message posting and per-user mark-as-read feature.</p>
51-
52-
<p>The creation process is detailed <a href="https://modfoss.com/building-house-new-wire.html">in this blog post</a> so that one could follow that guide and arrive at having written the same application. The repository created in that documentation is available <a href="https://github.com/symkat/HouseNewsWire/">on GitHub @ symkat/HouseNewsWire</a>.</p>
53-
54-
<p>You can try out the application at <a href="https://housenewswire.com/">House News Wire</a>.</p>
55-
56-
<h2>Running With Docker</h2>
57-
58-
<p>This docker-compose.yml file will start HouseNewsWire and it will be accessable at <a href="http://127.0.0.1:5000">http://127.0.0.1:5000</a>.</p>
59-
60-
<pre><code class="yaml">
61-
version: '3'
62-
63-
services:
64-
website:
65-
image: symkat/housenewswire:latest
66-
container_name: hnw-web
67-
ports:
68-
- 5000:5000
69-
database:
70-
image: postgres:11
71-
container_name: hnw-db
72-
environment:
73-
- POSTGRES_PASSWORD=housenewswire
74-
- POSTGRES_USER=housenewswire
75-
- POSTGRES_DB=housenewswire
76-
volumes:
77-
- ./schema.sql:/docker-entrypoint-initdb.d/000_schema.sql:ro
78-
- database:/var/lib/postgresql/data
79-
80-
volumes:
81-
database:
82-
83-
</code></pre>
84-
85-
<p>Make sure to bring in the schema.sql file to the same directory as the <span class="inline-code">docker-compose.yaml</span> file.</p>
86-
87-
<pre><code class="bash">
88-
curl -Lo schema.sql https://raw.githubusercontent.com/symkat/HouseNewsWire/master/Database/etc/schema.sql
89-
90-
</code></pre>
91-
92-
<p>Once these files exist, you should be able to start HouseNewsWire with <span class="inline-code">docker-compose</span>:</p>
93-
94-
<pre><code class="bash">
95-
symkat@test:~/hnw$ ls
96-
docker-compose.yml schema.sql
97-
symkat@test:~/hnw$ docker-compose up
98-
symkat@test:~/hnw$ docker-compose up
99-
Starting hnw-db ... done
100-
Starting hnw-web ... done
101-
Attaching to hnw-db, hnw-web
102-
hnw-db |
103-
hnw-db | PostgreSQL Database directory appears to contain a database; Skipping initialization
104-
105-
</code></pre>
106-
107-
<h2>Forking and Development Environment</h2>
108-
109-
<p>Before you begin you should have an environment that supports development. <a href="https://github.com/symkat/modfoss_devel">modFoss Devel</a> includes the configuration I use for Debian 10 machines, and installs dependencies that are needed by the build processes for this project.</p>
110-
111-
<p>Once a development environment exists, you'll want to fork the repo.</p>
112-
113-
<pre><code class="bash">
114-
symkat@test:~$ git clone git@github.com:symkat/HouseNewsWire.git
115-
Cloning into 'HouseNewsWire'...
116-
...
117-
Resolving deltas: 100% (25/25), done.
118-
symkat@test:~$ cd HouseNewsWire/
119-
120-
</code></pre>
121-
122-
<p>Once forked, install the modules you'll use to control the development environment. This will take a couple of minutes, on a 2GiB Linode machine it took about 10 minutes.</p>
123-
124-
<pre><code class="bash">
125-
symkat@test:~/HouseNewsWire$ cpanm App::plx App::opan Carton Dist::Zilla
126-
...
127-
Building and testing Dist-Zilla-6.017 ... OK
128-
Successfully installed Dist-Zilla-6.017
129-
140 distributions installed
130-
131-
</code></pre>
132-
133-
<p>Once these modules are installed, you can build the <span class="inline-code">HouseNewsWire::DB</span> package.</p>
134-
135-
<pre><code class="bash">
136-
symkat@test:~/HouseNewsWire/Database$ dzil build
137-
[DZ] beginning to build HouseNewsWire-DB
138-
[DZ] writing HouseNewsWire-DB in HouseNewsWire-DB-0.001
139-
[DZ] building archive with Archive::Tar; install Archive::Tar::Wrapper 0.15 or newer for improved speed
140-
[DZ] writing archive to HouseNewsWire-DB-0.001.tar.gz
141-
[DZ] built in HouseNewsWire-DB-0.001
142-
symkat@test:~/HouseNewsWire/Database$
143-
144-
</code></pre>
145-
146-
<p>This package is now built, so you can set up the Web app itself to use it, and install of the dependencies for the webapp.</p>
147-
148-
<pre><code class="bash">
149-
symkat@test:~/HouseNewsWire/Web$ plx --userinit
150-
# plx --bareinit
151-
Resolving perl 'perl' via PATH
152-
# plx --config libspec add 25.perl5.ll perl5
153-
symkat@test:~/HouseNewsWire/Database$ cd ../Web/
154-
symkat@test:~/HouseNewsWire/Web$ plx --init
155-
Resolving perl 'perl' via PATH
156-
symkat@test:~/HouseNewsWire/Web$ plx --config libspec add 00tilde.ll $HOME/perl5
157-
symkat@test:~/HouseNewsWire/Web$ plx --config libspec add 40HNW-DB.ll $HOME/HouseNewsWire/Database/lib
158-
159-
</code></pre>
160-
161-
<p>What you have just done is, first set up <a href="https://metacpan.org/pod/App::plx">plx</a> for your user account. Then you configured <span class="inline-code">plx</span> in the <span class="inline-code">~/HouseNewsWire/Web</span> directory. When you use <span class="inline-code">plx</span>, it will include libraries from <span class="inline-code">~/perl5/</span>, <span class="inline-code">~/HouseNewsWire/Database/lib</span>. It will include, and more modules can be installed to the directories <span class="inline-code">~/HouseNewsWire/Web/devel</span> and <span class="inline-code">~/HouseNewsWire/Web/local</span>. The <span class="inline-code">devel/</span> directory is used for modules that help you develop, while the <span class="inline-code">local/</span> directory is for modules that the application is using.</p>
162-
163-
<p>Now it's time to install all of the dependancies. The first three commands use <a href="https://metacpan.org/pod/App::opan">opan</a> to set up <span class="inline-code">HouseNewsWire::DB</span> as a module that can be included in automatic installation with carton and other tools that interact with cpan. The last <span class="inline-code">plx</span> command installs all of the packages that HouseNewsWire::Web depends on and takes about 10 minutes to run on a 2GiB machine. Finally, you'll want to install <a href="https://github.com/symkat/App-Dex">dex</a> to use the commands defined in the directory.</p>
164-
165-
<pre><code class="bash">
166-
symkat@test:~/HouseNewsWire/Web$ plx opan init
167-
symkat@test:~/HouseNewsWire/Web$ plx opan add ../Database/HouseNewsWire-DB-0.001.tar.gz
168-
symkat@test:~/HouseNewsWire/Web$ plx opan merge
169-
symkat@test:~/HouseNewsWire/Web$ plx opan carton install
170-
Web application available at http://localhost:44211/
171-
Installing modules using /home/symkat/HouseNewsWire/Web/cpanfile
172-
Successfully installed Module-Build-0.4231
173-
Successfully installed Module-Runtime-0.016
174-
...
175-
symkat@test:~/HouseNewsWire/Web$ curl --create-dirs -Lo ~/bin/dex https://raw.githubusercontent.com/symkat/App-Dex/master/scripts/dex
176-
% Total % Received % Xferd Average Speed Time Time Time Current
177-
Dload Upload Total Spent Left Speed
178-
100 635k 100 635k 0 0 8471k 0 --:--:-- --:--:-- --:--:-- 8471k
179-
symkat@test:~/HouseNewsWire/Web$ chmod u+x ~/bin/dex
180-
symkat@test:~/HouseNewsWire/Web$ . ~/.profile
181-
182-
</code></pre>
183-
184-
<p>Now it's time to run it all. You'll want to bring up two more terminals. One to run the database from and one to run the webapp from.</p>
185-
186-
<pre><code class="bash">
187-
symkat@test:~$ cd HouseNewsWire/
188-
symkat@test:~/HouseNewsWire$ dex
189-
db : Control Devel DB Only
190-
start : Start devel db on localhost via docker.
191-
stop : Stop devel db on localhost via docker.
192-
status : Show status of devel db.
193-
reset : Wipe devel db data.
194-
docker : Run Docker Container Environment (Web + DB)
195-
start : Start Docker Container Environment
196-
stop : Stop Docker Container Environment
197-
status : Show status of Docker Container Environment
198-
reset : Wipe data from Docker Container Environment
199-
build : Build HouseNewsWire container
200-
symkat@test:~/HouseNewsWire$ dex db start
201-
Creating network "database_default" with the default driver
202-
Creating volume "database_database" with default driver
203-
Pulling database (postgres:11)...
204-
11: Pulling from library/postgres
205-
62deabe7a6db: Pull complete
206-
...
207-
housenewswire-database | 2021-04-30 17:21:20.647 UTC [1] LOG: database system is ready to accept connections
208-
209-
</code></pre>
210-
211-
<p>The database is now running in that terminal. In another terminal you'll want to run the webapp itself.</p>
212-
213-
<pre><code class="bash">
214-
symkat@test:~/HouseNewsWire/Web$ plx starman
215-
2021/04/30-17:22:11 Starman::Server (type Net::Server::PreFork) starting! pid(4088)
216-
Resolved [*]:5000 to [0.0.0.0]:5000, IPv4
217-
Binding to TCP port 5000 on host 0.0.0.0 with IPv4
218-
...
219-
[info] HouseNewsWire::Web powered by Catalyst 5.90128
220-
221-
</code></pre>
222-
223-
<p>Now you should be able to go to your <a href="http://Your-IP:5000/register">http://Your-IP:5000/register</a> to create an account and have it saved in the database. You can now work on the code directly and restart it to have changes appear in your web browser.</p>
224-
225-
3+
%% around content -> {
4+
<nav aria-label="breadcrumb">
5+
<ol class="breadcrumb">
6+
<li class="breadcrumb-item active"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
7+
</ol>
8+
</nav>
9+
10+
%% for $messages -> $message {
11+
<div class="card my-4">
12+
<div class="card-body">
13+
%% if ( $message.message.url ) {
14+
<h5 class="card-title">
15+
<span style="font-size: 0.8em"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', $message.channel.name ) %]">t/[% $message.channel.name %]</a>: </span>
16+
<a href="[% $message.message.url %]">[% $message.message.title %]</a>
17+
<span class="text-mute" style="font-size: 0.6em">([% $message.message.url | domain %])</span>
18+
</h5>
19+
%% } else {
20+
<h5 class="card-title">
21+
<span style="font-size: 0.8em"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', $message.channel.name ) %]">t/[% $message.channel.name %]</a>: </span>
22+
<a href="[% $c.uri_for_action( '/topicchannel/get_topic_message', $message.channel.name, $message.message.id, $message.message.slug ) %]">[% $message.message.title %]</a>
23+
<span class="text-mute" style="font-size: 0.6em">(text post)</span>
24+
</h5>
25+
%% }
26+
<br />
27+
<a href="[% $c.uri_for_action( '/topicchannel/get_topic_message', [ ], $message.channel.name, $message.message.id, $message.message.slug ) %]" class="card-link">Comments ([% $message.message.comment_count %])</a>
28+
<a class="card-link" href="[% $c.uri_for_action( '/userchannel/get_user', [ $message.author.name ] ) %]">u/[% $message.author.name %]</a>
29+
<small><span title="[% $message.message.created_at.strftime('%Y %T') %]">[% $message.message.time_ago %]</span></small>
22630
</div>
31+
</div>
32+
%% }
22733
%% }
228-
229-
230-
231-
232-

‎Web/root/topic/index.tx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
%% around content -> {
44
<nav aria-label="breadcrumb">
55
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
67
<li class="breadcrumb-item active aria-current="page""><a href="[% $c.uri_for_action( '/topicchannel/index' ) %]">Topics</a></li>
78
</ol>
89
</nav>

‎Web/root/topic/show_topic.tx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
%% around content -> {
44
<nav aria-label="breadcrumb">
55
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
67
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/topicchannel/index' ) %]">Topics</a></li>
78
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', [], $topic.name ) %]">t/[% $topic.name %]</a></li>
89
</ol>
@@ -12,11 +13,17 @@
1213
<div class="card my-4">
1314
<div class="card-body">
1415
%% if ( $message.message.url ) {
15-
<h5 class="card-title"><a href="[% $message.message.url %]">[% $message.message.title %]</a></h5>
16-
<small class="text-mute">[% $message.message.url %]</small>
16+
<h5 class="card-title">
17+
%% # <span style="font-size: 0.8em"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', $message.channel.name ) %]">t/[% $message.channel.name %]</a>: </span>
18+
<a href="[% $message.message.url %]">[% $message.message.title %]</a>
19+
<span class="text-mute" style="font-size: 0.6em">([% $message.message.url | domain %])</span>
20+
</h5>
1721
%% } else {
18-
<h5 class="card-title"><a href="[% $c.uri_for_action( '/topicchannel/get_topic_message', [ ], $topic.name, $message.message.id, $message.message.slug ) %]">[% $message.message.title %]</a></h5>
19-
<small class="text-mute">(text post)</small>
22+
<h5 class="card-title">
23+
%% # <span style="font-size: 0.8em"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', $message.channel.name ) %]">t/[% $message.channel.name %]</a>: </span>
24+
<a href="[% $c.uri_for_action( '/topicchannel/get_topic_message', $message.channel.name, $message.message.id, $message.message.slug ) %]">[% $message.message.title %]</a>
25+
<span class="text-mute" style="font-size: 0.6em">(text post)</span>
26+
</h5>
2027
%% }
2128
<br />
2229
<a href="#" class="card-link">Comments ([% $message.message.comment_count %])</a>

‎Web/root/topic/show_topic_message.tx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44

55
<nav aria-label="breadcrumb">
66
<ol class="breadcrumb">
7+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
78
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/topicchannel/index' ) %]">Topics</a></li>
89
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', [], $topic.name ) %]">t/[% $topic.name %]</a></li>
910
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/topicchannel/get_topic', [], $topic.name, $message.id, $message.title ) %]">[% $message.title %]</a></li>

‎Web/root/user/show_user.tx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
%% cascade '_base.tx'
22

33
%% around content -> {
4+
<nav aria-label="breadcrumb">
5+
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
7+
<li class="breadcrumb-item">People</li>
8+
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/userchannel/get_user', [ $user_profile.name ] ) %]">u/[% $user_profile.name %]</a></li>
9+
</ol>
10+
</nav>
411

512
<h2 class="my-4">u/[% $user_profile.name %]</h2>
613

‎Web/root/user/show_user_comments.tx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
%% cascade '_base.tx'
22

33
%% around content -> {
4+
<nav aria-label="breadcrumb">
5+
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
7+
<li class="breadcrumb-item">People</li>
8+
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/userchannel/get_user', [ $user_profile.name ] ) %]">u/[% $user_profile.name %]</a></li>
9+
</ol>
10+
</nav>
411

512
<h2 class="my-4">u/[% $user_profile.name %]</h2>
613

‎Web/root/user/show_user_message.tx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
%% around content -> {
44
<nav aria-label="breadcrumb">
55
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
67
<li class="breadcrumb-item">People</li>
78
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/userchannel/get_user', [ $user_profile.name ] ) %]">u/[% $user_profile.name %]</a></li>
89
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/userchannel/get_user_message', [], $user_profile.name, $message.id, $message.slug ) %]">[% $message.title %]</a></li>

‎Web/root/user/show_user_submissions.tx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
%% cascade '_base.tx'
22

33
%% around content -> {
4+
<nav aria-label="breadcrumb">
5+
<ol class="breadcrumb">
6+
<li class="breadcrumb-item"><a href="[% $c.uri_for_action( '/index' ) %]">Home</a></li>
7+
<li class="breadcrumb-item">People</li>
8+
<li class="breadcrumb-item active" aria-current="page"><a href="[% $c.uri_for_action( '/userchannel/get_user', [ $user_profile.name ] ) %]">u/[% $user_profile.name %]</a></li>
9+
</ol>
10+
</nav>
411

512
<h2 class="my-4">u/[% $user_profile.name %]</h2>
613

0 commit comments

Comments
 (0)