# Como contribuir al sitio.

El sitio esta construido bajo la concepcion de que prácticamente cualquier framework iba a introducir más complejidad de lo que le iba a aportar al desarrollo del mismo.

Nuestro framework es `sitegen.py`, su función principal es construir el sitio usando [jinja2](https://www.fullstackpython.com/jinja2.html) como motor de plantillas.

Además `sitegen.py`, cuando se corre en modo `watch` actualiza en tiempo real los cambios que se hacen en el sitio.

## Estructura

-   build/

Cuando se construye el sitio, todos los ficheros y carpetas están aquí.

-   languages/

Un diccionario que contiene todas las traducciones del sitio.

-   layout/

Contiene todos los html que conforman el sitio y el esqueleto de lo que se va a generar. Ver mas en #layout.

-   plugins/

Funciones que extienden nuestro framework. (No es muy relevante)

-   root/

Archivos que se van a copiar en la raíz del sitio estático para ser servidos. Cuando se genera el sitio estático, todos los ficheros en esta dirección se copian verbatim para carpeta build/

-   static/

Similar a `root` (no recuerdo porque tenemos diferenciado root de static). Todo lo que esta en este directorio se copia verbatim para la carpeta build/

-   .gitignore

-   deploy.sh

Function para

-   run_server.sh

Construir el sitio en modo watch, para hacer ver los cambios en tiempo real.

-   sitegen.py

El framework hecho en python

## Requerimientos

-   python3 (Disponible en el PATH)
-   jinja2 (Dependencia de python)

## Layout

La carpeta `layout` contiene todas las paginas del sitio. Para los ficheros que comienzan por underscore (`_`) no se generan páginas en el sitio. (Por ejemplo para `_base.html` y `_work_no_all.html`).

Las plantillas se generan usando [jinja2](https://www.fullstackpython.com/jinja2.html), un motor de plantillas por defecto en python. Es el motor de plantillas usado en django.

### Aprender jinja en 5 minutos

-   **Extend:** Usando extend, se "hereda" de otro fichero, lo que significa que se copia el contenido del otro fichero en este. Por ejemplo:

`{% extends "_base.html"%}`

-   **Block:** Crea un bloque que se puede sobre escribir cuando una plantilla depende de otra.

Por ejemplo, en el fichero `_base.html` esta el siguiente fragmento:

```
    ...
	<main class="main-layout">
		{% block main %}
		{% endblock %}
	</main>
    ...
```

Eso quiere decir que cualquier plantilla que extienda a `_base.html` (que son todas) pueden determina el contenido que se genera dentro del tag `<main>`

Por ejemplo: ver en `about-and-contact.html` como todo el contenido se encuentra dentro del bloque:

```
		{% block main %}
            ...
		{% endblock %}
```

Nota: Hay mas funcionalidades de jinja que se usan, pero no creo que sean muy relevantes por ahora.

Todos los cambios que se deban aplicar al sitio entero (como el banner o cosas así) se deben hacer directamente en el fichero `_base.html`. Cuando son cambios particulares de alguna vista (como el tamaño de los carteles, o cantidad de columnas) se debe modificar la vista en particular.

Ver por ejemplo `illustration.html`. Nota como se añade un elemento de `<style>` y luego se llama a `{{ super() }}`. Esto último es para indicarle a jinja que ademas de incluir el `<style>` incluya todo el contenido del bloque del layout del que se hereda (en el que caso particular de `illustration.html` se hereda de `_work_no_all.html`).

## CSS

Todos los css están en la carpeta `static/css` y se incluyen en todas las vistas.

## Para desarrollar

Correr `./run_server.sh` en una terminal. El sitio se construye, y se actualiza automaticamente. Para acceder al mismo, ir a http://localhost:8001.

Desgraciadamente esta funcionalidad no funciona out-of-the-box en Windows aún.