- Agregados los datos a un json en la carpeta public.

- Agregados componentes para Anime
master
Fernando 2018-10-24 11:44:18 -05:00
parent f06ce17f44
commit cc0ad0ce73
23 changed files with 1169 additions and 126 deletions

382
public/animes.json Normal file
View File

@ -0,0 +1,382 @@
[
{
"titulo": "Irozuku Sekai no Ashita Kara",
"link": "/Anime/2018/Otono/IrozuKai",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1424/93855.jpg",
"descripcion": "Ambientada en la ciudad de Nagasaki, la historia tiene lugar en un mundo en el que una cantidad minúscula de magia permanece en la vida cotidiana. Hitomi Tsukishiro es una descendiente de 17 años de una familia de brujas que creció con emociones vivas, ya que perdió su sentido del color a una edad muy temprana. Sintiéndose mal por el futuro de su nieta, Kohaku, una gran bruja, envía a Hitomi al pasado, el año 2018. Mediante intercambios con su abuela de 17 años y los miembros de su club, la historia sigue el crecimiento de Hitomi como persona.",
"data": {
"estudio": "P.A. Works",
"eps": "?",
"alAire": "06 de Octubre a ?",
"temporada": "Otono",
"anio": 2018,
"fuente": "Original",
"generos": "Drama, Magia, Romance",
"OP": {
"1": "17sai - Haruka to Miyuki"
},
"ED": {
"1": "Mimei no Kimi to Hakumei no Mahou - Yanagi Nagi"
}
},
"onPagPrin": [true,1],
"key": 10001111
},
{
"titulo": "Goblin Slayer",
"link": "/Anime/2018/Otono/Goblin-Slayer",
"imgUrl": "",
"descripcion": "",
"data": {
"estudio": "",
"eps": "",
"alAire": "",
"temporada": "",
"anio": 2018,
"fuente": "",
"generos": "",
"OP": {
"1": ""
},
"ED": {
"1": ""
}
},
"onPagPrin": [false,2],
"key": 10001110
},
{
"titulo": "Overlord 3",
"link": "/Anime/2018/Verano/Overlord-3",
"imgUrl": "",
"descripcion": "Tercera temporada de Overlord.",
"data": {
"estudio": "Madhouse",
"eps": "13",
"alAire": "10 de Julio a 2 de Octubre",
"temporada": "Verano",
"anio": 2018,
"fuente": "Novela Ligera",
"generos": "Accion, Fantasia, Magia, Sobrenatural",
"OP": {
"1": "VORACITY - MYTH & ROID"
},
"ED": {
"1": "Silent Solitude - OxT"
}
},
"onPagPrin": [false,2],
"key": 10001101
},
{
"titulo": "Banana Fish",
"link": "/Anime/2018/Verano/Banana-Fish",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1190/93472.jpg",
"descripcion": "La naturaleza hizo a Ash Lynx hermoso; la crianza lo convirtió en un asesino despiadado y frío. Un fugitivo lo crió como el heredero adoptivo y el juguete sexual de 'Papa' Dino Golzine, Ash, ahora a la edad rebelde de diecisiete años, abandona el reino sostenido por el diablo que lo crió.",
"data": {
"estudio": "MAPPA",
"eps": "24",
"alAire": "6 de Julio a 21 de Diciembre",
"temporada": "Verano",
"anio": 2018,
"fuente": "Matgo",
"generos": "Accion, Aventura, Drama",
"OP": {
"1": "found & lost - Survive Said The Prophet",
"2": "FREEDOM - BLUE ENCOUNT"
},
"ED": {
"1": "Prayer X - King Gnu",
"2": "RED - Survive Said The Prophet"
}
},
"onPagPrin": [true,2],
"key": 10001100
},
{
"titulo": "Steins;Gate 0",
"link": "/Anime/2018/Primavera/Steins;Gate-0",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1768/93520.jpg",
"descripcion": "La oscura historia no contada de Steins;Gate muestra al excéntrico científico loco Okabe, que lucha por recuperarse de un intento fallido de rescatar a Kurisu. Decide darse por vencido y abandona a su animado álter ego científico, en la búsqueda de olvidar el pasado. Cuando todo parece ser normal, aparentemente recuerda el pasado al conocer a un conocido de Kurisu... ",
"data": {
"estudio": "White Fox",
"eps": "23",
"alAire": "12 de Abril a 27 de Septiembre",
"temporada": "Primavera",
"anio": 2018,
"fuente": "Novela Visual",
"generos": "Ciencia ficcion, Thriller",
"OP": {
"1": "Fatima - Kanako Itou"
},
"ED": {
"1": "Amadeus - Kanako Itou",
"2": "LAST GAME - Zwei",
"3": "World-Line - Amai Isami",
"4": "GATE OF STEINER - Sasaki Eri"
}
},
"onPagPrin": [false,0],
"key": 10001011
},
{
"titulo": "Mahou Shoujo Site",
"link": "/Anime/2018/Primavera/Mahou-Shoujo-Site",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1720/95064.jpg",
"descripcion": "Aya Asagiri es una chica de secundaria que tiene problemas tanto en la escuela con el acoso escolar como en el hogar debido al abuso físico de su hermano. Al navegar en línea, aparece un sitio web en su computadora con una persona de aspecto espeluznante. Esta persona parece tener piedad de ella, y anuncia que le ha otorgado poderes mágicos a Asagiri. ",
"data": {
"estudio": "production doA",
"eps": "12",
"alAire": "7 de Abril a 23 de Junio",
"temporada": "Primavera",
"anio": 2018,
"fuente": "Manga",
"generos": "Drama, Horror, Psicologico, Supernatural",
"OP": {
"1": "Changing Point - i Ris"
},
"ED": {
"1": "Zenzen Tomodachi - Yamazaki Haruka"
}
},
"onPagPrin": [true,3],
"key": 10001010
},
{
"titulo": "Wotaku ni Koi wa Muzukashii",
"link": "/Anime/2018/Primavera/WotaKoi",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1864/93518.jpg",
"descripcion": "Después de descubrir que trabajan en la misma compañía, un otaku enloquecido y un fujoshi se reúnen por primera vez desde la secundaria. Después de algunas sesiones de bebida después del trabajo comienzan a salir, pero ¿será una relación perfecta para los dos? ",
"data": {
"estudio": "A-1 Pictures",
"eps": "11",
"alAire": "13 de Abril a 22 de Junio",
"temporada": "Primavera",
"anio": 2018,
"fuente": "Manga web",
"generos": "Comedia, Romance",
"OP": {
"1": "Fiction - Sumika"
},
"ED": {
"1": "Kimi no Tonari - halca"
}
},
"onPagPrin": [false,0],
"key": 10001001
},
{
"titulo": "Shokugeki no Soma: San no Sara - Toutsuki Ressha-hen",
"link": "/Anime/2018/Primavera/Shokugeki-no-Soma-3-2",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1604/93531.jpg",
"descripcion": "El segundo platillo de Shokugeki no Soma: San no Sara",
"data": {
"estudio": "J.C. Staff",
"eps": "12",
"alAire": "9 de Abril a 25 de Junio",
"temporada": "Primavera",
"anio": 2018,
"fuente": "Manga",
"generos": "Ecchi, Escolar, Shonen",
"OP": {
"1": "Symbol - Luck Life"
},
"ED": {
"1": "Atria - Fo'xTails"
}
},
"onPagPrin": [false,0],
"key": 10001000
},
{
"titulo": "Violet Evergarden",
"link": "/Anime/2018/Invierno/Violet-Evergarden",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/1795/95088.jpg",
"descripcion": "Hay palabras que Violet escuchó en el campo de batalla, las cuales no puede olvidar. Esas palabras le fueron dadas por alguien que conocía, más que nadie. Ella aún no conoce su significado. ",
"data": {
"estudio": "Kyoto Animation",
"eps": "13",
"alAire": "11 de Enero a 5 de Abril",
"temporada": "Invierno",
"anio": 2018,
"fuente": "Novela ligera",
"generos": "Fantasia, Drama, Slice of Life",
"OP": {
"1": "Sincerely - TRUIE"
},
"ED": {
"1": "Michishirube - Minori Chihara",
"2": "Believe in... - Yuuki Aira"
}
},
"onPagPrin": [false,0],
"key": 10000111
},
{
"titulo": "Inuyashiki",
"link": "/Anime/2017/Otono/Inuyashiki",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/3/88470.jpg",
"descripcion": "Inuyashiki Ichirou está de mala suerte. Justo cuando parece que las cosas no pueden empeorar, una luz cegadora en el cielo nocturno golpea la tierra donde se encuentra Ichirou. ",
"data": {
"estudio": "MAPPA",
"eps": "11",
"alAire": "13 de Octubre al 22 de Diciembre",
"temporada": "Otono",
"anio": 2017,
"fuente": "Manga",
"generos": "Accion, Drama, Psicologico, Ciencia ficcion, Seinen",
"OP": {
"1": "My Hero - MAN WITH A MISSION"
},
"ED": {
"1": "Ai wo Oshiete Kureta Kimi e - Qaijff"
}
},
"onPagPrin": [false,0],
"key": 10000110
},
{
"titulo": "Kekkai Sensen & Beyond",
"link": "/Anime/2017/Otono/Kekkai-Sensen-Beyond",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/9/88281.jpg",
"descripcion": "Segunda temporada de Kekkai Sensen.",
"data": {
"estudio": "Bones",
"eps": "12",
"alAire": "8 de Octubre al 24 de Diciembre",
"temporada": "Otono",
"anio": 2017,
"fuente": "Manga",
"generos": "Accion, Comedia, Fantasia, Shounen, Super poderes, Sobrenatural",
"OP": {
"1": "fake town baby - UNISON SQUARE GARDEN"
},
"ED": {
"1": "Step Up LOVE - DAOKO x Yasuyuki Okamura"
}
},
"onPagPrin": [false,0],
"key": 10000101
},
{
"titulo": "Just Because!",
"link": "/Anime/2017/Otono/Just-Because",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/3/88185.jpg",
"descripcion": "Al final del segundo semestre del tercer año de preparatoria, cuatro estudiantes están listos para graduarse y pueden sentir el final de su vida en la preparatoria. Pero eso cambia un poco con la llegada de un estudiante transferido. ",
"data": {
"estudio": "Pine Jam",
"eps": "12",
"alAire": "5 de Octubre al 28 de Diciembre",
"temporada": "Otono",
"anio": 2017,
"fuente": "Original",
"generos": "Slice of Life, Drama, Romance, Escolar",
"OP": {
"1": "over and over - Yanagi Nagi"
},
"ED": {
"1": "behind - Mio Natsume (Karin Isobe), Hatsuki Morikawa (Yuna Yoshino), Ena Komiya (Lynn)"
}
},
"onPagPrin": [false,0],
"key": 10000100
},
{
"titulo": "Shokugeki no Soma: San no Sara",
"link": "/Anime/2017/Otono/Shokugeki-no-Soma-3",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/4/86603.jpg",
"descripcion": "Tercera temporada de Shokugeki no Soma",
"data": {
"estudio": "J.C. Staff",
"eps": "12",
"alAire": "4 de Octubre al 20 de Diciembre",
"temporada": "Otono",
"anio": 2017,
"fuente": "Manga",
"generos": "Ecchi, Escolar, Shonen",
"OP": {
"1": "BRAVER - ZAQ"
},
"ED": {
"1": "Kyokyo Jitsujitsu - nano.RIPE"
}
},
"onPagPrin": [true,4],
"key": 10000011
},
{
"titulo": "Kakegurui",
"link": "/Anime/2017/Verano/Kakegurui",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/3/86578.jpg",
"descripcion": "Academia Privada Hyakkaou. Una institución para los privilegiados con un currículo muy peculiar. Veras, cuando eres de los hijos e hijas de los más ricos de los ricos, no es la destreza atlética o la inteligencia lo que te mantiene por delante. Es leer a tu oponente, el arte del trato. ¿Qué mejor manera de afilar esas habilidades que con un riguroso plan de estudios de juegos de azar? ",
"data": {
"estudio": "MAPPA",
"eps": "12",
"alAire": "1 de Julio al 23 de Septiembre",
"temporada": "Verano",
"anio": 2017,
"fuente": "Manga",
"generos": "Drama, Juegos, Misterio, Psicologico, Escolar, Shonen",
"OP": {
"1": "Deal with the devil - Tia"
},
"ED": {
"1": "LAYon-theLINE - D-selections"
}
},
"onPagPrin": [false,0],
"key": 10000010
},
{
"titulo": "Re:Creators",
"link": "/Anime/2017/Verano/Re:Creators",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/11/85469.jpg",
"descripcion": "Los humanos han creado muchas historias. Felicidad, tristeza, ira, emociones profundas. Las historias sacuden nuestro corazón y nos fascinan. Sin embargo, estos son sólo los pensamientos de los espectadores. Pero ¿y si los personajes de la historia tienen 'intenciones'?",
"data": {
"estudio": "TROYCA",
"eps": "22",
"alAire": "8 de Abril al 26 de Septiembre",
"temporada": "Verano",
"anio": 2017,
"fuente": "Original",
"generos": "Accion, Ciencia ficcion, Fantasia",
"OP": {
"1": "gravityWall - SawanoHiroyuki[nZk]:Tielle & Gemie",
"2": "sh0ut - SawanoHiroyuki[nZk]:Tielle & Gemie"
},
"ED": {
"1": "gravityWall - SawanoHiroyuki[nZk]:Tielle & Gemie",
"2": "NEWLOOK - Ayano Mashiro",
"3": "world Étude - Toyosaki Aki",
"4": "Rubikon - Sangatsu no Phantasia"
}
},
"onPagPrin": [false,0],
"key": 10000001
},
{
"titulo": "Flip Flappers",
"link": "/Anime/2016/Otono/Flip-Flappers",
"imgUrl": "https://myanimelist.cdn-dena.com/images/anime/4/82292.jpg",
"descripcion": "Cocona, que lleva una vida normal, se encuentra un día con Papika, y juntas van a Pure Illusion, a conseguir 'fragmentos', que se dice, pueden conceder deseos. ",
"data": {
"estudio": "Studio 3Hz",
"eps": "13",
"alAire": "6 de Octubre al 29 de Diciembre",
"temporada": "Otono",
"anio": 2016,
"fuente": "Original",
"generos": "Ciencia ficcion, Aventura, Comedia, Magia",
"OP": {
"1": "Serendipity - ZAQ"
},
"ED": {
"1": "FLIP FLAP FLIP FLAP - TO-MAS feat.Chima",
"2": "find the wind - ZAQ",
"3": "Over the Rainbow - TO-MAS feat.Chima"
}
},
"onPagPrin": [false,0],
"key": 10000000
}
]

View File

@ -5,11 +5,15 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>pseudocloud</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Muli|Open+Sans" rel="stylesheet">
<title>PseudoSubs - Anime 100% libre de publicidad</title>
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but pseudocloud doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> <strong>Ups. Parece que tu navegador decidió desactivar JavaScript. Actívalo y recarga la página.</strong>
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->

View File

@ -1,29 +1,8 @@
<template> <template>
<div id="app"> <div id="app">
<div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
</div>
<router-view/> <router-view/>
</div> </div>
</template> </template>
<style lang="scss"> <style lang="sass">
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
}
#nav {
padding: 30px;
a {
font-weight: bold;
color: #2c3e50;
&.router-link-exact-active {
color: #42b983;
}
}
}
</style> </style>

View File

@ -0,0 +1,20 @@
<template>
<div class="barra caja">
Anime
</div>
</template>
<script>
export default {
name: "BarraTitulo"
}
</script>
<style scoped lang="sass">
.barra
font:
family: Muli, "Open Sans", serif
size: xx-large
weight: bold
text-align: center
</style>

View File

@ -0,0 +1,74 @@
<template>
<div class="caja tarjeta" >
<div class="center-on-small">
<span>
<router-link :to="link" class="tarjeta--nombre">
{{ titulo }}
</router-link>
</span>
</div>
<br>
<div class="row">
<div class="col l4 m4 s12 center-on-small">
<img :src="imgUrl" class="responsive-img">
</div>
<div class="col l8 m8 s12">
<div class="hide-on-med-and-up"><br></div>
{{ descr }}
</div>
</div>
</div>
</template>
<script>
export default {
name: "Tarjeta",
props: {
titulo: {
type: String,
default: "Nombre del Anime"
},
descr: {
type: String,
default: "Descripcion del anime. Descripcion del anime. Descripcion del anime. Descripcion del anime. " +
"Descripcion del anime. "
},
imgUrl: {
type: String,
default: "https://myanimelist.cdn-dena.com/images/anime/1424/93855.jpg"
},
link: {
type: String,
default: "/"
},
tags: {
type: String,
default: "nombre del anime"
},
temporada: {
type: String,
default: "Ninguna"
},
anio: {
type: Number,
default: 2020
}
}
}
</script>
<style scoped lang="sass">
@media only screen and (max-width: 500px)
.center-on-small
text-align: center
.tarjeta--nombre
font:
family: Muli, "Open Sans", serif
weight: bold
size: xx-large
color: black
transition: color 100ms
&:hover
color: #23bf87
</style>

View File

@ -1,57 +0,0 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component
export default class HelloWorld extends Vue {
@Prop() private msg!: string;
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>

View File

@ -0,0 +1,72 @@
<template>
<div :class="oculto? 'mi-slider--contenido-oculto': 'mi-slider--contenido'" :id="'entrada' + id">
<div>
<span>
<router-link :to="link" class="mi-slider--contenido--titulo">
{{ titulo }}
</router-link>
</span>
</div>
<br>
<div class="row">
<div class="col l4 m4 s12">
<img :src="imgUrl" class="responsive-img mi-slider--contenido--img">
</div>
<div class="col l8 m8 s12 mi-slider--contenido--descripcion">
<div class="hide-on-med-and-up"><br></div>
{{ descr }}
</div>
</div>
</div>
</template>
<script>
export default {
name: "entrada-reciente",
props: {
titulo: String,
descr: String,
imgUrl: String,
link: String,
id: Number,
oculto: {
type: Boolean,
default: true
}
}
}
</script>
<style scoped lang="sass">
.mi-slider--contenido
transition: opacity 250ms
opacity: 1
.mi-slider--contenido-oculto
transition: opacity 250ms
display: none
overflow: hidden
opacity: 0
.mi-slider--contenido--titulo
color: #151515
font:
family: Muli, 'Product Sans', serif
size: x-large
weight: bold
transition: color 100ms
&:hover
color: #039f67
.mi-slider--contenido--img
width: 222px
height: 320px
.mi-slider--contenido--descripcion
font:
size: large
text-align: justify
padding-right: 20px
</style>

View File

@ -0,0 +1,104 @@
<template>
<div class="caja features">
<span class="features--titulo">
Nosotros hacemos el trabajo sucio, disfrutas.
</span>
<br /><br />
<div class="row">
<div class="col l4 m4 s12 noSelectionBackground" style="cursor: default">
<i class="large material-icons noSelectionBackground">cast_connected</i>
<br />
<span class="features--imagen-label">Para todos.</span>
<br />
<br />
Descarga 1 vez, reproduce donde sea. Te ofrecemos la mayor compatibilidad,
desde el Pocket Neo hasta la PC Master Race.
</div>
<div class="col l4 m4 s12 noSelectionBackground" style="cursor: default">
<i class="large material-icons noSelectionBackground">aspect_ratio</i>
<br />
<span class="features--imagen-label">No te distraigas.</span>
<br />
<br />
Nuestro diseño minimalista es fácil y agradable de leer, concéntrate en el
contenido y no en el diseño.
</div>
<div class="col l4 m4 s12 noSelectionBackground" style="cursor: default">
<i class="large material-icons noSelectionBackground">create</i>
<br />
<span class="features--imagen-label"> eliges cómo.</span>
<br />
<br />
Te ofrecemos hasta 4 opciones diferentes en Anime, y el poder de personalizar todo
en Novelas Ligeras.
</div>
</div>
<br />
<div class="divider"></div>
<br />
<div>
<span class="features--titulo">
Puedes desactivar el AdBlock.
</span><br>
<i class="medium material-icons">beach_access</i>
<br>
<span style="font-size: large">
"¿Espera 5 segundos? Mmmph"<br />
"¡No, no quiero conocer chicas cerca a mi área!"<br />
"Rayos, publicidad.com se ha vuelto inmune al AdBlock."<br /><br />
Que no te suceda nunca más. PseudoSubs es 100% libre de publicidad, desde siempre, y por siempre.<br />
</span>
<br />
<br />
<div class="divider"></div>
</div>
<br />
<span class="features--titulo">
Estamos para ayudarte.
</span><br>
<i class="medium material-icons">help</i>
<br />
<span style="font-size: large">
¿No sabes qué hacer? ¿Tienes alguna duda? Aquí te explicamos las soluciones a los problemas
más frecuentes.
</span>
<br /><br />
<router-link to="/Ayuda" class="waves-effect waves-light btn teal lighten-1"><b>¡Ayuda!</b></router-link>
<br />
<br />
<span style="font-size: large">
¿No encontraste una solución? ¿No lo entendiste? ¿Simplemente quieres hablar? ¡Puedes entrar a nuestro Discord!
</span>
<br /><br />
<a href="https://discord.gg/S3vwyXV" class="waves-effect waves-light btn blue darken-1" target="_blank"><b>¡Discord!</b></a>
</div>
</template>
<script>
export default {
name: "features-card"
}
</script>
<style scoped lang="sass">
.features
text-align: center
.features--titulo
font:
family: Muli, "Open Sans", serif
size: xx-large
color: #23bf87
&::selection
color: white
background-color: #23bf87
.features--imagen-label
font:
size: x-large
family: Muli, "Open Sans",serif
cursor: default
</style>

View File

@ -0,0 +1,50 @@
<template>
<footer class="page-footer mi-footer">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text mi-footer--titulo">PseudoSubs</h5>
<p class="grey-text text-lighten-4">
Anime de temporada @24FPS y @60FPS, H.264 y H.265<br>
Traducciones de Novelas Ligeras desde Ingles y Japones.<br>
Cosas varias.
</p>
</div>
<div class="col l4 offset-l2 s12">
<h5 class="white-text">Otros vínculos.</h5>
<ul>
<li>
<a class="grey-text text-lighten-3" target="_blank" href="http://puya.si/">PuyaSubs</a>
</li>
<li><a class="grey-text text-lighten-3" target="_blank" href="http://horriblesubs.info/">
HorribleSubs</a></li>
<li>
<a class="grey-text text-lighten-3" target="_blank" href="http://acechanime.com/">AcechaAnime</a>
</li>
</ul>
</div>
</div>
</div>
<div class="footer-copyright">
<div class="container">
© 2018 Copyright PseudoSubs.
</div>
</div>
</footer>
</template>
<script>
export default {
name: "mi-footer"
}
</script>
<style scoped lang="sass">
.mi-footer
background-color: #23bf87
.mi-footer--titulo
font:
family: Muli, "Open Sans", serif
size: xx-large
</style>

View File

@ -0,0 +1,159 @@
<template>
<div class="mi-slider">
<div class="mi-slider--titulo">
¡Entradas Recientes!
</div>
<div class="mi-slider--contenido" id="entradasRecientes">
<entrada-reciente
v-for="(anime, index) in animes"
v-if="anime.onPagPrin[0]"
:titulo="anime.titulo"
:key="anime.key"
:id="anime.key"
:link="anime.link"
:descr="anime.descripcion"
:img-url="anime.imgUrl"
:oculto="anime.onPagPrin[1] !== 1"
/>
</div>
<div class="mi-slider--flechas" style="display: none;">
<i class="material-icons medium left hide-on-small-only noSelectionBackground mi-slider--barra--boton">arrow_back</i>
<i class="material-icons medium right hide-on-small-only noSelectionBackground mi-slider--barra--boton">arrow_forward</i>
<div class="center">
<br />
<div style="border: solid #23BF87 1px; border-radius: 8px; display: inline-block; min-width: 160px;
max-height: 8px; overflow: hidden">
<div id="progressEntrRec">.
</div>
</div>
</div>
<i class="material-icons large left hide-on-med-and-up noSelectionBackground" style="cursor: pointer"
onclick="retroceder()">arrow_back
</i>
<i class="material-icons large big right hide-on-med-and-up noSelectionBackground" style="cursor: pointer"
onclick="avanzar()">arrow_forward
</i>
</div>
</div>
</template>
<script lang="ts">
import entradaReciente from './entrada-reciente'
let posCicloActual = 0;
let entradas = undefined;
let intervaloCiclo = undefined;
const ciclarEntradasRecientes = ():void => {
entradas = document.getElementById("entradasRecientes").children;
intervaloCiclo = setInterval(sigElemReciente, 5000);
};
const sigElemReciente = () => {
const elemActual = entradas[posCicloActual];
if (posCicloActual === entradas.length-1)
posCicloActual = 0;
else
posCicloActual++;
const elemSig = entradas[posCicloActual];
elemActual.style.opacity = 0;
setTimeout(() => {
elemActual.className = "mi-slider--contenido-oculto";
elemActual.style = "";
setTimeout(() => {
elemSig.className = "mi-slider--contenido";
},10);
},250);
};
export default {
name: "slider-reciente",
data: function () {
return {
animes: []
}
},
created: function () {
// Alias the component instance as `vm`, so that we
// can access it inside the promise function
let vm = this;
// Fetch our array of posts from an API
fetch('/animes.json')
.then( response => response.json())
.then(function (myJson) {
vm.animes = myJson;
window.indiceAnimes = myJson;
})
},
components: {
'entrada-reciente': entradaReciente
},
methods: {
avanzar: () => {
sigElemReciente();
}
},
updated: function () {
ciclarEntradasRecientes();
}
}
</script>
<style scoped lang="sass">
.mi-slider
text-align: center
background-color: white
margin: 10px 0
box-shadow: 2px 2px 2px darkgrey
border-radius: 3px
padding: 15px
.mi-slider--titulo
color: #039f67
font:
family: 'Product Sans', serif
size: xx-large
padding-bottom: 20px
.mi-slider--contenido
max-height: 390px
min-height: 389px
overflow: hidden
.mi-slider--contenido-oculto
display: none
.mi-slider--contenido--titulo
color: #151515
font:
family: Muli, 'Product Sans', serif
size: x-large
weight: bold
transition: color 100ms
&:hover
color: #039f67
.mi-slider--contenido--img
width: 222px
height: 320px
.mi-slider--contenido--descripcion
font:
size: large
text-align: justify
padding-right: 20px
.mi-slider--barra--boton
cursor: pointer
</style>

View File

@ -0,0 +1,55 @@
<template>
<div class="col s12 m6" :class="aLaIzq? 'tarjeta-izq': 'tarjeta-der'">
<div class="card hoverable tarjeta" v-on:click="goTo(url)">
<div class="card-image">
<img :src="imgUrl" class="noSelectionBackground">
<router-link :to="url" class="btn-floating halfway-fab waves-effect waves-light teal lighten-1">
<i class="material-icons">arrow_forward</i>
</router-link>
</div>
<div class="card-content">
<span class="card-title noSelectionBackground tarjeta--titulo">
{{ titulo }}
</span>
<p class="noSelectionBackground">
<span v-html="descr"></span>
</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: "tarjeta-menu-princ",
props: {
url: String,
imgUrl: String,
titulo: String,
descr: String,
aLaIzq: Boolean
},
methods: {
goTo: function (url) {
window.miRouter.push(url);
}
}
}
</script>
<style scoped lang="sass">
.tarjeta-izq
padding-left: 0
.tarjeta-der
padding-right: 0
.tarjeta
cursor: pointer
padding: 0
.tarjeta--titulo
font:
family: Muli, "Open Sans", serif
size: xx-large
</style>

View File

@ -0,0 +1,43 @@
<template>
<div>
<div id="titulo-contenedor">
<div class="hide-on-small-only">
<br>
</div>
<router-link to="/" id="titulo">PseudoSubs</router-link>
<div class="hide-on-small-only">
<br>
</div>
</div>
</div>
</template>
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
name: 'titulo-principal'
})
</script>
<style lang="sass" scoped>
#titulo-contenedor
font:
family: 'Product Sans', serif
size: 50px
weight: bold
text-align: center
background-color: white
margin: 10px 0
box-shadow: 2px 2px 2px darkgrey
border-radius: 3px
#titulo
color: #434343
text-shadow: 2px 2px 0 #ffffff, 6px 6px 0 #DDDDDD
transition: color 100ms
&:hover
color: #23bf87
</style>

Binary file not shown.

Binary file not shown.

View File

@ -2,9 +2,18 @@ import Vue from 'vue'
import App from './App.vue' import App from './App.vue'
import router from './router' import router from './router'
Vue.config.productionTip = false Vue.config.productionTip = false;
require('./sass/main.sass');
(() => {
// @ts-ignore
window.miRouter = router;
// @ts-ignore
window.indiceAnimes = {};
})();
new Vue({ new Vue({
router, router,
render: h => h(App) render: h => h(App)
}).$mount('#app') }).$mount('#app');

View File

@ -1,25 +1,33 @@
import Vue from 'vue' import Vue from 'vue'
import Router from 'vue-router' import Router from 'vue-router'
import Home from './views/Home.vue' import Inicio from './views/Inicio.vue'
import Anime from './views/Anime.vue'
import AnimeView from './views/AnimeView.vue'
Vue.use(Router) Vue.use(Router);
export default new Router({ export default new Router({
mode: 'history', mode: 'history',
base: process.env.BASE_URL, base: process.env.BASE_URL,
routes: [ routes: [
{ {
path: '/', path: '/',
name: 'home', name: 'Inicio',
component: Home component: Inicio
}, },
{ {
path: '/about', path: '/Anime/',
name: 'about', name: 'AnimeIndex',
// route level code-splitting component: Anime
// this generates a separate chunk (about.[hash].js) for this route },
// which is lazy-loaded when the route is visited. {
component: () => import(/* webpackChunkName: "about" */ './views/About.vue') path: '/Anime/:anio/:temp/:anime',
name: 'AnimeView',
component: AnimeView
}
],
scrollBehavior (to, from, savedPosition) {
// return desired position
return { x: 0, y: 0 }
} }
] });
})

27
src/sass/main.sass Normal file
View File

@ -0,0 +1,27 @@
@font-face
font-family: 'Product Sans'
src: url(../fonts/ProductSans/ProductSans.ttf)
font-style: normal
font-weight: normal
@font-face
font-family: 'Product Sans'
src: url(../fonts/ProductSans/ProductSansBold.ttf)
font-style: normal
font-weight: bold
body
background-color: #eeeeee
font:
family: "Open Sans", serif
size: large
.noSelectionBackground
user-select: none
.caja
background-color: white
margin: 10px 0
box-shadow: 2px 2px 2px darkgrey
border-radius: 3px
padding: 15px

View File

@ -1,5 +0,0 @@
<template>
<div class="about">
<h1>This is an about page</h1>
</div>
</template>

64
src/views/Anime.vue Normal file
View File

@ -0,0 +1,64 @@
<template>
<div>
<div class="container">
<titulo-principal />
<barra-titulo />
<tarjeta-anime v-for="(anime, key) in animes" :key="anime.key"
:titulo="anime.titulo"
:descr="anime.descripcion"
:imgUrl="anime.imgUrl"
:link="anime.link"
:temporada="anime.data.temporada.toLowerCase()"
:anio="anime.data.anio"
/>
</div>
<mi-footer />
</div>
</template>
<script>
import tituloPrincipal from '@/components/titulo-principal.vue'
import BarraTitulo from '@/components/Anime/BarraTitulo.vue'
import Tarjeta from '@/components/Anime/Tarjeta.vue'
import MiFooter from '@/components/mi-footer.vue'
export default {
name: "Anime",
data: function () {
return {
animes: {}
}
},
components: {
'titulo-principal': tituloPrincipal,
'barra-titulo': BarraTitulo,
'tarjeta-anime': Tarjeta,
'mi-footer': MiFooter
},
created: function () {
if (window.indiceAnimes[0]) {
console.log("Existe we v:");
console.log(window.indiceAnimes);
this.animes = window.indiceAnimes;
} else {
console.log("No hay nada we v':");
let vm = this;
// Obtener los animes desde una API v:
fetch('/animes.json')
.then( response => response.json())
.then(function (myJson) {
vm.animes = myJson;
window.indiceAnimes = myJson;
console.log("Pero ya me aseguré de que haya algo.");
})
}
}
}
</script>
<style scoped lang="sass">
</style>

20
src/views/AnimeView.vue Normal file
View File

@ -0,0 +1,20 @@
<template>
<div>
Anumaaaa v': <br>
<br>
Veamos.... <br>
{{ this.$route.params.anio }}<br>
{{ this.$route.params.temp }}<br>
{{ this.$route.params.anime }}<br>
</div>
</template>
<script>
export default {
name: "AnimeView"
}
</script>
<style scoped>
</style>

View File

@ -1,18 +0,0 @@
<template>
<div class="home">
<img alt="Vue logo" src="../assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
@Component({
components: {
HelloWorld,
},
})
export default class Home extends Vue {}
</script>

53
src/views/Inicio.vue Normal file
View File

@ -0,0 +1,53 @@
<template>
<div>
<div class="container">
<titulo-principal />
<slider-reciente />
<div class="row">
<tarjeta-menu-prin
url="/Anime/"
imgUrl="http://pseudosubs.com/rcs/img/PagInicio/Anime.png"
titulo="Anime"
descr="Anime de Temporada con la mejor calidad, rápidamente y minimalista.<br>
¡Disfruta el original a 24FPS, o deleitate con la fluidez de los 60FPS en 720p y 1080p!"
:aLaIzq="true"
/>
<tarjeta-menu-prin
url="/Novelas/"
imgUrl="http://pseudosubs.com/rcs/img/PagInicio/NLyukino.png"
titulo="Novelas Ligeras"
descr="Traducciones de calidad, lo más rápido posible sin descuidar la coherencia, ortografía y atmosfera.<br/>
¡Leelo como gustes! decides si es PDF, EPUB, la fuente, tamaño de letra, etc.."
:aLaIzq="false"
/>
</div>
<features-card/>
</div>
<br>
<mi-footer/>
</div>
</template>
<script lang="ts">
import tituloPrincipal from '@/components/titulo-principal.vue'
import sliderReciente from '@/components/slider-reciente.vue'
import tarjetaMenuPrin from '@/components/tarjeta-menu-princ.vue'
import featuresCard from '@/components/features-card.vue'
import footer from '@/components/mi-footer.vue'
export default {
components: {
'titulo-principal': tituloPrincipal,
'slider-reciente': sliderReciente,
'tarjeta-menu-prin': tarjetaMenuPrin,
'features-card': featuresCard,
'mi-footer': footer
}
}
</script>
<style lang="sass" scoped>
</style>

View File

@ -1,6 +1,6 @@
{ {
"compilerOptions": { "compilerOptions": {
"target": "es5", "target": "es2015",
"module": "esnext", "module": "esnext",
"strict": true, "strict": true,
"jsx": "preserve", "jsx": "preserve",