Proyecto Universitario open-source en donde se mantiene una plataforma web que facilita información sobre las mallas en la Universidad. Alojado en mallas.labcomp.cl (actualmente no se actualiza, usar booterman98.github.io/malla-interactiva mientras)
Cada malla necesita de dos archivos .json
para que esta se muestre en el sitio. Estos tienen por nombre
data_CARR.json
y colors_CARR.json
y se ubican en el directorio /data
. CARR
corresponde a la abrebiatura de la carrera (por Ej: INF para informática) El primero (data_CARR.json
) contiene
la información de cada ramo y sus características agrupados por semestre. Se sigue la siguiente estructura:
{
"s2": [
["Química y Sociedad","QUI-010",3,5,"PC",[],"A"],
["Matemáticas II","MAT-022",5,7,"PC",["MAT-021"],"A"],
["Física General I","FIS-110",5,8,"PC",["MAT-021","FIS-100"],"A"],
["Introducción a la Ingeniería","IWG-101",2,3,"TIN",[],"A"],
["Humanístico II","HRW-133",2,3,"HUM",[],"A"],
["Educación Física II","DEW-101",1,0,"HUM",["DEW-100"],"A"]
],
// ...
}
En donde
s2
Corresponde al semestre, en este caso, Semestre II. s2
contiene una lista de ramos, donde cada ramo tiene 7 items en el siguiente orden:
sigla-número
0
, se calcula
basándose en los créditos USMcolors_CARR.json
."P"
, "I"
, "A"
o ""
. Indica
si el ramo se dicta en un semestre Par, Impar, o en Ambos. ""
Actúa como "A"
pero significa que no se sabe, por favor evitar dejarlo en blanco.El segundo archivo corresponde a colors_CARR.json
. Este contiene las categorías y los colores de la malla y sigue el siguiente formato:
{
"Abreviación": ["Color", "Categoría"],
// ...
}
Para elegir un buen color, puedes buscar Color Picker en Google
Ejemplo:
{
"PC": ["#00838F", "Plan Común"]
}
Si aun hay dudas, puede revisar data_INF.json y colors_INF.json
Hay varias formas de agregar o cambiar una malla. La más directa es editar o crear directamente los archivos usando el formato ya explicado, y realizar una pull request con los archivos en directorio correcto. Otra forma consiste en crear o editar una malla con la generadora de mallas (tiene instrucciones :p) y contestar este formulario con la malla generada. Por último, usar la malla generada en una pull request
Nota: Es recomendable (por no decir necesario) hacer el proceso en un computador.
Para probar la malla, existen los siguientes métodos:
NOTA: Independientemente de la forma en que se prueba la malla, en caso de editar archivos .js
, para que estos se reflejen, ejecute desde una terminal en la carpeta raíz
npm run devBuild
Lo ideal sería probarlo usando python, ya que permite levantar un mini servidor http lo que facilita la carga para el navegador. Para esto, se tiene que abrir una terminal, ir al directorio principal de la malla y ejecutar lo siguiente:
python -m SimpleHTTPServer
python -m http.server
Independiente de la version, una vez ejecutado la línea, después se debe abrir un navegador
e ir a la dirección http://localhost:8000 y ahí debería ver la malla.
Dependiendo de la malla a probar, deberá navegar agregando al final de la url ?m=CARR
. Por ejemplo,
para abrir data_INF.json
debería quedar algo como http://localhost:8000/index.html?m=INF
.
Los únicos requisitos son el tener docker
, podman
o cualquier otro container manager.
Primero clone el repo y construya la imagen mediante:
docker build -t malla-interactiva .
dentro del mismo directorio del repositorio.
Para correr la imagen ejecute:
docker run -d -p 8080:8080 --name mallas malla-interactiva
Y listo! Con esto podrá visitar la malla utilizando la dirección http://localhost:8080/.
Para detener y eliminarla la instancia del container al mismo tiempo ejecute:
docker rm --force mallas
Para solo detener la instancia
docker stop mallas
Se tiene que abrir el index.html
con Firefox (debido a que los otros navegadores tienen
desactivada la lectura de archivos locales por defecto), y al final de la URL agregar ?m=CARR
. Por ejemplo,
para abrir data_INF.json
debería quedar algo como index.html?m=INF
.
Con NPM instalado en el equipo, ejecute desde una terminal en la carpeta raíz de el repo
npm install
npx browser-sync -w
o simplemente (hay una diferencia entre ambos)
npx browser-sync -w
Ejecutado lo anterior, se tendrá en su explorador favorito una
versión local de la página. La dirección por defecto es http://localhost:3000
Si su explorador tiene problemas, abra Firefox y copie y pegue la dirección de la página.
Se agradece especialmente a:
Al mismo tiempo se agradece a todos quienes hayan realizado un aporte al proyecto