sergiotarxz/owlcode.tech
1
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

Adding initial webpage.

Browse Source
This commit is contained in:
sergiotarxz 2022-11-09 13:31:58 +01:00
parent 0857e7b535
commit 492d64fae6
22 changed files with 650 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -1,2 +1,6 @@
# burguillos.info
## BURGUILLOS.INFO
### Descripción
Este repositorio permite añadir contenido nuevo a burguillos.info, de momento está en desarrollo.

7
build_styles.sh Normal file
View File

@ -0,0 +1,7 @@
#!/bin/bash
if which sassc &> /dev/null; then
sassc public/css/styles.scss > public/css/styles.css
else
exit 1
fi

3
burguillos_info.yml Normal file
View File

@ -0,0 +1,3 @@
---
secrets:
- e092a1a031c589ba2433b606b74ba0881b9c36f0

27
content/categories/autobuses.xml Normal file
View File

@ -0,0 +1,27 @@
<category>
<title>Horarios de Autobuses.</title>
<description>
<h3>Nuestros pésimos horarios de Autobuses.</h3>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
<p>Los horarios de autobuses de nuestro pueblo, que ya os advierto que son para echarse al monte en el contexto de una crisis climática.</p>
</description>
<priority>1</priority>
<menu_text>Autobuses</menu_text>
<slug>autobuses</slug>
</category>

11
content/categories/index.xml Normal file
View File

@ -0,0 +1,11 @@
<category>
<title>Portal de información de Burguillos.</title>
<description>
<p><b>burguillos.info no está afiliado con el Ayuntamiento de Burguillos.</b></p>
<p>Esta página está destinada a informar de los sucesos y negocios de nuestro pueblo, cualquiera puede redactar una noticia para que aparezca en este medio mientras pase un proceso de revisión por parte del staff de burguillos.info.</p>
</description>
<priority>0</priority>
<menu_text><img alt="Escudo de burguillos hypervinculo a página principal" src="/img/burguillos.png"/></menu_text>
<slug>index</slug>
</category>

17
content/posts/primer-post.xml Normal file
View File

@ -0,0 +1,17 @@
<post>
<author>Bobby Tables not welcome in a xml driven site.</author>
<date>2022-11-08T22:38+00:00</date>
<title>Primer post.</title>
<ogdesc>El primer artículo de burguillos.info.</ogdesc>
<category>index</category>
<slug>primer-post</slug>
<content>
<p>Bienvenidos a burguillos.info, tu portal a todas las novedades de lo que sucede en Burguillos.</p>
<p>burguillos.info es un proyecto hecho como hobby en menos de 2 días para prácticar mis habilidades de frontend.</p>
<p>La intención es que sea una web estática colaborativa, para escribir artículos puedes hacerlo desde <a href="https://git.owlcode.tech/sergiotarxz/burguillos.info">git</a>, tan solo se requiere conocimiento de html.</p>
<p>Todos los artículos pasarán por un proceso de revisión.</p>
<p>No tengo mucha idea de frontend, así que el diseño ha quedado como he podido, he usado <a href="https://randoma11y.com">randoma11y</a> para generar los colores con contraste alto por accesibilidad.</p>
</content>
</post>

51
content/posts/segundo-post.xml Normal file
View File

@ -0,0 +1,51 @@
<post>
<author>Bobby Tables not welcome in a xml driven site.</author>
<date>2022-11-09T12:01+00:00</date>
<title>Segundo post.</title>
<ogdesc>El segundo artículo de burguillos.info.</ogdesc>
<category>index</category>
<slug>segundo-post</slug>
<content>
<p>Este artículo se ha creado para ver como quedan múltiples artículos en una categoría, puedes ignorarlo felizmente ya que no contienen nada importante.</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
<p>blowaw</p>
</content>
</post>

23
lib/BurguillosInfo.pm Normal file
View File

@ -0,0 +1,23 @@
package BurguillosInfo;
use Mojo::Base 'Mojolicious', -signatures;
# This method will run once at server start
sub startup ($self) {
# Load configuration from config file
my $config = $self->plugin('NotYAMLConfig');
# Configure the application
$self->secrets($config->{secrets});
# Router
my $r = $self->routes;
# Normal route to controller
$r->get('/')->to('Page#index');
# $r->get('/:post')->to('Page#post');
$r->get('/:category')->to('Page#category');
$r->get('/posts/:slug')->to('Page#post');
}
1;

53
lib/BurguillosInfo/Categories.pm Normal file
View File

@ -0,0 +1,53 @@
package BurguillosInfo::Categories;
use v5.34.1;
use strict;
use warnings;
use Const::Fast;
use Mojo::DOM;
use Path::Tiny;
const my $CURRENT_FILE => __FILE__;
const my $CATEGORIES_DIR =>
path($CURRENT_FILE)->parent->parent->parent->child('content/categories');
my $cached_categories;
sub new {
return bless {}, shift;
}
sub Retrieve {
if ( defined $cached_categories ) {
return $cached_categories;
}
$cached_categories = {};
for my $category_file ( $CATEGORIES_DIR->children ) {
warn "Bad file $category_file, omiting...", next
if !-f $category_file || $category_file !~ /\.xml$/;
my $dom = Mojo::DOM->new( $category_file->slurp_utf8 );
my $title = $dom->at(':root > title')->text
or die "Missing title at $category_file.";
my $description = $dom->at(':root > description')->content
or die "Missing description at $category_file";
my $slug = $dom->at(':root > slug')->text
or die "Missing slug at $category_file";
my $menu_text = $dom->at(':root > menu_text')->content
or die "Missing menu_text at $category_file";
defined (my $priority = $dom->at(':root > priority')->text)
or die "Missing priority at $category_file";
my $category = {
title => $title,
menu_text => $menu_text,
slug => $slug,
description => $description,
priority => $priority,
};
$cached_categories->{$slug} = $category;
}
return $cached_categories;
}
1;

11
lib/BurguillosInfo/Controller/Example.pm Normal file
View File

@ -0,0 +1,11 @@
package BurguillosInfo::Controller::Example;
use Mojo::Base 'Mojolicious::Controller', -signatures;
# This action will render a template
sub welcome ($self) {
# Render template "example/welcome.html.ep" with message
$self->render(msg => 'Welcome to the Mojolicious real-time web framework!');
}
1;

57
lib/BurguillosInfo/Controller/Page.pm Normal file
View File

@ -0,0 +1,57 @@
package BurguillosInfo::Controller::Page;
use BurguillosInfo::Categories;
use BurguillosInfo::Posts;
use v5.34.1;
use strict;
use warnings;
use Data::Dumper;
use Mojo::Base 'Mojolicious::Controller';
sub index {
my $self = shift;
my $categories = BurguillosInfo::Categories->new->Retrieve;
my $current_category = $categories->{'index'};
# Render template "example/welcome.html.ep" with message
$self->render(
categories => $categories,
current_category => $current_category
);
}
sub post {
my $self = shift;
my $slug = $self->param('slug');
my ( $posts_categories, $posts_slug ) =
BurguillosInfo::Posts->new->Retrieve;
my $categories = BurguillosInfo::Categories->new->Retrieve;
my $post = $posts_slug->{$slug};
my $current_category = $categories->{ $post->{category} };
if ( !defined $post ) {
$self->render( template => '404', status => 404 );
return;
}
$self->render( post => $post, current_category => $current_category );
}
sub category {
my $self = shift;
my $categories = BurguillosInfo::Categories->new->Retrieve;
my $category_name = $self->param('category');
my $current_category = $categories->{$category_name};
if ( !defined $current_category ) {
$self->render( template => '404', status => 404 );
return;
}
$self->render(
template => 'page/index',
categories => $categories,
current_category => $current_category
);
}
1;

70
lib/BurguillosInfo/Posts.pm Normal file
View File

@ -0,0 +1,70 @@
package BurguillosInfo::Posts;
use v5.34.1;
use strict;
use warnings;
use Const::Fast;
use Mojo::DOM;
use Path::Tiny;
use DateTime::Format::ISO8601;
use Data::Dumper;
const my $CURRENT_FILE => __FILE__;
const my $POSTS_DIR =>
path($CURRENT_FILE)->parent->parent->parent->child('content/posts');
my $iso8601 = DateTime::Format::ISO8601->new;
my $cached_posts_by_category;
my $cached_posts_by_slug;
sub new {
return bless {}, shift;
}
sub Retrieve {
if ( defined $cached_posts_by_category && defined $cached_posts_by_slug ) {
return ( $cached_posts_by_category, $cached_posts_by_slug );
}
$cached_posts_by_category = {};
$cached_posts_by_slug = {};
for my $post_file ( $POSTS_DIR->children ) {
warn "Bad file $post_file, omiting...", next
if !-f $post_file || $post_file !~ /\.xml$/;
my $dom = Mojo::DOM->new( $post_file->slurp_utf8 );
my $title = $dom->at(':root > title')->text
or die "Missing title at $post_file.";
my $author = $dom->at(':root > author')->text
or die "Missing author at $post_file.";
my $date = $dom->at(':root > date')->text
or die "Missing date at $post_file.";
my $ogdesc = $dom->at(':root > ogdesc')->text
or die "Missing ogdesc at $post_file";
my $category = $dom->at(':root > category')->text
or die "Missing category at $post_file.";
my $slug = $dom->at(':root > slug')->text
or die "Missing slug at $post_file.";
my $content = $dom->at(':root > content')->content
or die "Missing content at $post_file.";
my $post = {
title => $title,
author => $author,
date => $date,
ogdesc => $ogdesc,
category => $category,
slug => $slug,
content => $content,
};
$cached_posts_by_category->{$category} //= [];
my $category_posts = $cached_posts_by_category->{$category};
$cached_posts_by_slug->{$slug} = $post;
push @$category_posts, $post;
}
return ($cached_posts_by_category, $cached_posts_by_slug);
}
1;

217
public/css/styles.scss Normal file
View File

@ -0,0 +1,217 @@
$background: url(../img/parque_patos.jpg);
$color: #2f4f4f;
$background_div: #d8079e;
$color_div: #fafcdd;
$background-secondary: #635283;
$color-secondary: #8eea6d;
$accent-secondary: #fde68f;
$primary-secondary: #590e11;
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
overflow: hidden;
min-height: 100%;
width: 100%;
height: 100%;
div.site-wrapper {
display: table;
width: 100%;
height: 100%; /* For at least Firefox */
min-height: 100%;
color: $color;
background: $background;
filter: blur(10px);
background-size: cover;
overflow: hidden;
}
div.page-contents {
position: absolute;
position: fixed;
overflow-y: scroll;
z-index: 2;
background: $color_div;
color: $background_div;
top: 0%;
left: 0%;
height: 100%;
width: 100%;
b,p {
font-size: 40px;
}
h3 {
font-size: 47px;
}
h2 {
font-size: 53px;
}
h1 {
font-size: 60px;
}
div.description {
padding: 1%;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 1%;
margin-top: 10%;
div.articles {
display: flex;
flex-direction: row;
flex-wrap: wrap;
a {
width: 100%;
max-height: 500px;
overflow: hidden;
display:block;
text-decoration: none;
text-overflow: ellipsis;
margin-bottom: 10px;
article {
width: 90%;
b,p {
font-size: 38px;
}
h4 {
font-size: 44px;
}
h3 {
font-size: 47px;
}
h2 {
font-size: 53px;
}
h1 {
font-size: 60px;
}
padding-left: 3%;
padding-right: 3%;
padding-bottom: 3%;
padding-top: 0px;
color: $color-secondary;
background: $background-secondary;
&:hover {
color: $background-secondary;
background: $color-secondary;
p.author {
color: $primary-secondary;
}
}
p.author {
color: $accent-secondary;
font-size: 30px;
text-align: right;
}
}
}
}
}
nav > a > img {
vertical-align: middle;
width: 30px;
height: 30px;
}
nav {
overflow: auto;
display: block;
font-size: 35px;
margin: 0px;
a.go-to-index img {
margin-top: 5%;
}
a {
display: inline-block;
height: 100%;
text-decoration: none;
background: $background_div;
color: $color_div;
padding: 10px;
margin: 0;
&.selected {
background: $color_div;
color: $background_div;
}
&:hover {
background: $color_div;
color: $background_div;
}
}
a.menu-expand {
position: relative;
float: right;
}
}
nav.mobile-shortcuts {
position: fixed;
background: $background_div;
width: 100%;
}
nav.desktop {
display: none;
}
nav.mobile-foldable {
display: none;
background: $background-secondary;
color: $color-secondary;
a {
color: $color-secondary;
background: $background-secondary;
display: block;
}
}
nav.mobile-foldable.show {
display: block;
}
h1 {
text-align: center;
font-size: 50px;
}
}
}
@media (min-width: 720px) {
body {
div.page-contents {
nav.mobile-foldable,nav.mobile-foldable.show {
display: none;
}
div.description {
margin-top: auto;
}
nav.desktop {
display: block;
height: auto;
}
nav.mobile-shortcuts {
display: none;
}
top: 2%;
left: 5%;
height: 96%;
width: 90%;
}
}
}
@media (min-width: 1222px) {
body {
div.page-contents {
div.description {
margin-top: auto;
div.articles {
a {
width: 49%;
margin-left: 1%;
}
}
}
}
}
}

BIN
public/img/burguillos.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

BIN
public/img/menu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
public/img/parque_patos.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 70 KiB

10
public/js/index.js Normal file
View File

@ -0,0 +1,10 @@
"use strict";
window.onload = () => {
let menu_expand = document.querySelector('a.menu-expand');
let mobile_foldable = document.querySelector('nav.mobile-foldable');
menu_expand.addEventListener('click', () => {
mobile_foldable.classList.toggle('show');
});
};

7
templates/404.html.ep Normal file
View File

@ -0,0 +1,7 @@
% use Mojo::Util;
% use BurguillosInfo::Categories;
% layout 'default', current_slug => undef, categories => BurguillosInfo::Categories->new->Retrieve;
<div class="description">
<h2>Esta página no existe.</h2>
<p>Si un enlace te ha llevado aquí, reporta el error a <a href="mailto://contact@owlcode.tech">los administradores</a>.</p>
</div>

35
templates/layouts/default.html.ep Normal file
View File

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<script src="/js/index.js"></script>
<link rel="stylesheet" href="/css/styles.css"/>
<title><%= title %></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div class="site-wrapper">
</div>
<div class="page-contents">
<nav class="desktop"><% for my $category_key (sort {
$categories->{$a}{priority} <=> $categories->{$b}{priority}
} keys %$categories) {
my $category = $categories->{$category_key};
my $selected = defined($current_slug) && $category->{slug} eq $current_slug;
%><a class="<%=$selected && "selected" %>" href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><%
}
%></nav>
<nav class="mobile-shortcuts">
<a class="go-to-index" href="<%='/'.$categories->{index}{slug}%>"><%== $categories->{index}{menu_text} %></a>
<a href="#mobile-foldable" class="menu-expand"><img src="/img/menu.png" alt="Expandir el menú."/></a>
</nav>
<nav class="mobile-foldable" id="mobile-foldable"><% for my $category_key (sort {
$categories->{$a}{priority} <=> $categories->{$b}{priority}
} keys %$categories) {
my $category = $categories->{$category_key};
%><a href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><%
}
%></nav>
<%= content %></body>
</div>
</html>

1
templates/not_found.html.ep Symbolic link
View File

@ -0,0 +1 @@
404.html.ep

33
templates/page/index.html.ep Normal file
View File

@ -0,0 +1,33 @@
% use Mojo::DOM;
% use Mojo::Util;
%
% use BurguillosInfo::Posts;
%
% layout 'default', current_slug => $current_category->{slug};
% title $current_category->{title};
<div class="description">
<h2><%= $current_category->{title} %></h2>
<%== $current_category->{description} %>
<h3>Artículos</h3>
<div class="articles">
% my ($cached_posts_by_category) = BurguillosInfo::Posts->new->Retrieve;
% my $category_post = $cached_posts_by_category->{$current_category->{slug}};
% if (defined $category_post) {
% for my $post (@$category_post) {
<a href="/posts/<%=$post->{slug}%>">
<article>
<h4><%=$post->{title}%></h4>
% my $xml = Mojo::DOM->new($post->{content});
% my $text = $xml->all_text;
% if (length($text) > 120) {
% $text = substr($text, 0, 100).'...';
% }
<p><%=$text%></p>
<p class="author">Escrito por <%=$post->{author}%></p>
</article>
</a>
% }
% } else {
<p>Parece que aun no hay artículos.</p>
% }
</div>

12
templates/page/post.html.ep Normal file
View File

@ -0,0 +1,12 @@
% use Mojo::DOM;
% use Mojo::Util;
%
% use BurguillosInfo::Posts;
% use BurguillosInfo::Categories;
% my $categories = BurguillosInfo::Categories->new->Retrieve;
% layout 'default', current_slug => $current_category->{slug}, categories => $categories;
% title $post->{title};
<div class="description">
<h2><%= $post->{title} %></h2>
<%== $post->{content} %>
</div>