Agregado soporte para disqus en los animes

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"

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

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
 

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(style="position: absolute; width: 100%")
-    div.contImg(:style="'min-height: ' + altoPantalla + 'px' ")
+        div.contImg(:style="'min-height: ' + altoPantalla + 'px; ' + imagenActual")
-    div.otro(:style="'min-height: ' + altoPantalla + 'px' ")
+        div.otro(:style="'min-height: ' + altoPantalla + 'px' ")
-      div.col
+            div.col
-        div.fil
+                div.fil
-          div.titulo <!--Cámbiate a PseudoSubs--> RIP PseudoSubs - 2017-2019
+                    div.titulo PseudoSubs ain't fansub
-          div.motto Y notarás la diferencia <small>¿O no?</small>
+                    div.motto Nuevos eps cuando me de la gana.
-          br
+                    br
-          br
+                    br
-          br
+                    br
-          br
+                    br
-          router-link.comparar(to="/comparar") Comparar pixel a pixel.
+                    router-link.comparar(to="/comparar") Comparar pixel a pixel.
-    //
+        //
 
 </template>
 
 <script lang="coffee">
 
-  export default
+    export default
-    name: "y-notaras-la-diferencia"
+        name: "y-notaras-la-diferencia"
-    computed:
+        computed:
-      altoPantalla: ->
+            altoPantalla: ->
-        window.innerHeight ? document.documentElement.clientHeight ? document.body.clientHeight
+                window.innerHeight ? document.documentElement.clientHeight ? document.body.clientHeight
-      anchoPantalla: ->
+            anchoPantalla: ->
-        window.innerWidth ? document.documentElement.clientWidth ? document.body.clientWidth
+                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
+    .contImg
-    display: inline-table
+        display: inline-table
-    width: 100%
+        width: 100%
-    filter: brightness(0.4)
+        filter: brightness(0.4)
 
 
-    background-image: url("../../assets/img/y_notaras_la_diferencia.jpg")
+        // background-image: url("/img/notaras-dif-img/img1.webp")
-    background-attachment: fixed
+        background-attachment: fixed
-    background-position: center
+        background-position: center
-    background-repeat: no-repeat
+        background-repeat: no-repeat
-    background-size: cover
+        background-size: cover
-    background-color: black
+        background-color: black
 
-  .otro
+    .otro
-    position: absolute
+        position: absolute
-    top: 0
+        top: 0
-    left: 0
+        left: 0
-    z-index: 2
+        z-index: 2
-    width: 100%
+        width: 100%
-    display: inline-table
+        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
 
-  @media only screen and (max-width: $movil)
+        .col
-    .otro .col .fil .titulo
+            display: table-row
-      font-size: 3rem
 
-  @media only screen and (max-width: $movilDiminuto)
+            .fil
-    .otro .col .fil .titulo
+                display: table-cell
-      font-size: 2.3rem
+                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>

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,

src/views/Inicio.vue

@@ -5,8 +5,7 @@
         br
         caracteristicas
         y-notaras-la-diferencia
-        //
+    //
-
 </template>
 
 <script lang="coffee">

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"