From 23e9c9382d8d528e1d0d3f8fce353340f4dd0c32 Mon Sep 17 00:00:00 2001
From: Fernando <tbyuyfcjjll@gmail.com>
Date: Sat, 20 Apr 2019 19:36:45 -0500
Subject: [PATCH] Agregado soporte para disqus en los animes

---
 package.json                                  |   1 +
 src/App.vue                                   |   2 +-
 src/components/Anime/Anime.vue                |  12 +-
 .../Inicio/y-notaras-la-diferencia.vue        | 141 +++++++++---------
 src/main.js                                   |   2 +
 src/views/Inicio.vue                          |   3 +-
 yarn.lock                                     |   5 +
 7 files changed, 94 insertions(+), 72 deletions(-)

diff --git a/package.json b/package.json
index 258ea19..4195340 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
     "mysql": "^2.16.0",
     "register-service-worker": "^1.6.2",
     "vue": "^2.6.6",
+    "vue-disqus": "^3.0.5",
     "vue-router": "^3.0.1",
     "vuex": "^3.0.1",
     "yaml": "^1.4.0"
diff --git a/src/App.vue b/src/App.vue
index db62f57..b52498c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -33,7 +33,7 @@
                 })
                     .then((x) -> x.text())
                     .then (res) ->
-                    # if DEV then console.log res
+                        # if DEV then console.log res
                         resultado = YAML.parse res
 
                         if resultado.exito
diff --git a/src/components/Anime/Anime.vue b/src/components/Anime/Anime.vue
index f957cac..4dfe62a 100644
--- a/src/components/Anime/Anime.vue
+++ b/src/components/Anime/Anime.vue
@@ -3,8 +3,6 @@
         div(v-if="estadoAnime === 0") Cargando...
         div(v-if="estadoAnime === -1") Error. Anime no encontrado
         div(v-if="estadoAnime === 1")
-            // div.titulo {{ anime.titulo }} -> {{ anime.anime_ID }}
-            // p {{ anime }}
             br
             br
             div.datos
@@ -24,6 +22,9 @@
                         div.tarjeta.fondo1.op-ed ops y eds aqui. En construcción.
                     br
                     panel-de-descarga(:animeid="anime.anime_ID" :color="anime.color")
+                    div.tarjeta.background__disqus
+                        vue-disqus(shortname="www-pseudosubs-com" :identifier="nombreCortoAnime"
+                            :url="'https://pseudosubs.com/Anime/' + nombreCortoAnime")
             br
             //
 </template>
@@ -39,6 +40,9 @@
             anime: {}
             # -1 no encontrado, 0 cargando y 1 encontrado
             estadoAnime: 0
+        computed:
+            nombreCortoAnime: ->
+                @anime.link?.substr(7)
         created: ->
             _ = this
             animes = @$store.state.animes
@@ -70,6 +74,10 @@
 <style scoped lang="sass">
     @import "../../assets/sass/variables"
 
+    .background__disqus
+        background-color: #101010
+        padding: 15px
+
     .contenedor
         margin: 0 50px
 
diff --git a/src/components/Inicio/y-notaras-la-diferencia.vue b/src/components/Inicio/y-notaras-la-diferencia.vue
index 7d68f4e..669336c 100644
--- a/src/components/Inicio/y-notaras-la-diferencia.vue
+++ b/src/components/Inicio/y-notaras-la-diferencia.vue
@@ -1,87 +1,94 @@
 <!-- Y notarás la diferencia. Responsivo hasta 285px de ancho. -->
 <template lang="pug">
-  div(style="position: absolute; width: 100%")
-    div.contImg(:style="'min-height: ' + altoPantalla + 'px' ")
-    div.otro(:style="'min-height: ' + altoPantalla + 'px' ")
-      div.col
-        div.fil
-          div.titulo <!--Cámbiate a PseudoSubs--> RIP PseudoSubs - 2017-2019
-          div.motto Y notarás la diferencia <small>¿O no?</small>
-          br
-          br
-          br
-          br
-          router-link.comparar(to="/comparar") Comparar pixel a pixel.
-    //
+    div(style="position: absolute; width: 100%")
+        div.contImg(:style="'min-height: ' + altoPantalla + 'px; ' + imagenActual")
+        div.otro(:style="'min-height: ' + altoPantalla + 'px' ")
+            div.col
+                div.fil
+                    div.titulo PseudoSubs ain't fansub
+                    div.motto Nuevos eps cuando me de la gana.
+                    br
+                    br
+                    br
+                    br
+                    router-link.comparar(to="/comparar") Comparar pixel a pixel.
+        //
 
 </template>
 
 <script lang="coffee">
 
-  export default
-    name: "y-notaras-la-diferencia"
-    computed:
-      altoPantalla: ->
-        window.innerHeight ? document.documentElement.clientHeight ? document.body.clientHeight
-      anchoPantalla: ->
-        window.innerWidth ? document.documentElement.clientWidth ? document.body.clientWidth
-    #
+    export default
+        name: "y-notaras-la-diferencia"
+        computed:
+            altoPantalla: ->
+                window.innerHeight ? document.documentElement.clientHeight ? document.body.clientHeight
+            anchoPantalla: ->
+                window.innerWidth ? document.documentElement.clientWidth ? document.body.clientWidth
+            imagenActual: ->
+                num = Math.floor(Math.random() * 1) + 1
+                "background-image: url(\"/img/notaras-dif-img/img#{num}.svg\")"
+#
 
 </script>
 
 <style scoped lang="sass">
-  @import "../../assets/sass/variables"
+    @import "../../assets/sass/variables"
 
-  .contImg
-    display: inline-table
-    width: 100%
-    filter: brightness(0.4)
+    .contImg
+        display: inline-table
+        width: 100%
+        filter: brightness(0.4)
 
 
-    background-image: url("../../assets/img/y_notaras_la_diferencia.jpg")
-    background-attachment: fixed
-    background-position: center
-    background-repeat: no-repeat
-    background-size: cover
-    background-color: black
+        // background-image: url("/img/notaras-dif-img/img1.webp")
+        background-attachment: fixed
+        background-position: center
+        background-repeat: no-repeat
+        background-size: cover
+        background-color: black
 
-  .otro
-    position: absolute
-    top: 0
-    left: 0
-    z-index: 2
-    width: 100%
-    display: inline-table
-    .col
-      display: table-row
-      .fil
-        display: table-cell
-        vertical-align: middle
-        text-align: center
-        color: white
-        .titulo
-          padding: 0 20px
-          font:
-            family: "Product Sans", Muli, "Open Sans", sans-serif
-            weight: bold
-            size: 4rem
-        .comparar
-          display: inline-block
-          color: white
-          text-decoration: none
-          padding: 20px 30px
-          background-color: $colorSecundario
-          font-family: Muli, "Open Sans", sans-serif
-          border-radius: 32px
+    .otro
+        position: absolute
+        top: 0
+        left: 0
+        z-index: 2
+        width: 100%
+        display: inline-table
 
-  @media only screen and (max-width: $movil)
-    .otro .col .fil .titulo
-      font-size: 3rem
+        .col
+            display: table-row
 
-  @media only screen and (max-width: $movilDiminuto)
-    .otro .col .fil .titulo
-      font-size: 2.3rem
-  //
+            .fil
+                display: table-cell
+                vertical-align: middle
+                text-align: center
+                color: white
+
+                .titulo
+                    padding: 0 20px
+                    font:
+                        family: "Product Sans", Muli, "Open Sans", sans-serif
+                        weight: bold
+                        size: 4rem
+
+                .comparar
+                    display: inline-block
+                    color: white
+                    text-decoration: none
+                    padding: 20px 30px
+                    background-color: $colorSecundario
+                    font-family: Muli, "Open Sans", sans-serif
+                    border-radius: 32px
+
+    @media only screen and (max-width: $movil)
+        .otro .col .fil .titulo
+            font-size: 3rem
+
+    @media only screen and (max-width: $movilDiminuto)
+        .otro .col .fil .titulo
+            font-size: 2.3rem
+    //
 
 
 </style>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 0cf8fb8..6454bf3 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,8 +3,10 @@ import App from './App.vue'
 import router from './router.coffee'
 import store from './store.coffee'
 import './registerServiceWorker'
+import VueDisqus from "vue-disqus"
 
 Vue.config.productionTip = false;
+Vue.use(VueDisqus);
 
 new Vue({
   router,
diff --git a/src/views/Inicio.vue b/src/views/Inicio.vue
index 037f37d..f71e903 100644
--- a/src/views/Inicio.vue
+++ b/src/views/Inicio.vue
@@ -5,8 +5,7 @@
         br
         caracteristicas
         y-notaras-la-diferencia
-        //
-
+    //
 </template>
 
 <script lang="coffee">
diff --git a/yarn.lock b/yarn.lock
index d22a4b2..4b56015 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8171,6 +8171,11 @@ vue-cli-plugin-express@^1.0.0:
     portfinder "^1.0.17"
     ts-node "^7.0.1"
 
+vue-disqus@^3.0.5:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/vue-disqus/-/vue-disqus-3.0.5.tgz#8d0dd5cabdba7c47f82d129d2907a64366842fa8"
+  integrity sha512-T3Y68lXf5W2lYt6j4Y3kZ4opLPH0EAzqriy11MS4D4Q2+UN0tFuUXeYP1MxfvdyaCEboXSM6CUswxsULuNV70Q==
+
 vue-hot-reload-api@^2.3.0:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.3.tgz#2756f46cb3258054c5f4723de8ae7e87302a1ccf"