generic-skin 2.5.2 → 2.6.41

package/config/vueComponents.js

@@ -2,7 +2,7 @@
 Vue.component('categoria-foro', {
     props: ['dataId'],
     computed: {
-        slugName: function () {
+        slugName() {
             const name = (this.dataId.indexOf('<h2>') > -1 ? FNR.utility.genSlug(this.dataId.split('<h2>')[1].split('</h2>')[0], '-') : FNR.utility.genSlug(this.dataId, '-'));
 
             return 'category-' + name;
@@ -16,7 +16,7 @@ Vue.component('categoria-foro', {
 });
 
 Vue.component('cabecera-foro', {
-    data: function () {
+    data() {
         return {
             dataTitle: this.$slots['title'][0].tag === undefined ? this.$slots['title'][0].text : this.$slots['title'][0].children[0].text
         }
@@ -29,7 +29,7 @@ Vue.component('cabecera-foro', {
 });
 
 Vue.component('cabcategoria-foro', {
-    data: function () {
+    data() {
         return {
             dataTitle: this.$slots['title'][0].tag === undefined ? this.$slots['title'][0].text : this.$slots['title'][0].children[0].text
         }
@@ -42,7 +42,7 @@ Vue.component('cabcategoria-foro', {
 });
 
 Vue.component('cabespecial-foro', {
-    data: function () {
+    data() {
         return {
             dataTitle: this.$slots['title'][0].tag === undefined ? this.$slots['title'][0].text : this.$slots['title'][0].children[0].text
         }
@@ -57,7 +57,7 @@ Vue.component('cabespecial-foro', {
 Vue.component('subforo-foro', {
     props: ['dataId'],
     computed: {
-        slugId: function () {
+        slugId() {
             let id = '';
 
             if (window.location.pathname.match(/f(\d+)-/)) {
@@ -68,7 +68,7 @@ Vue.component('subforo-foro', {
 
             return 'subforum-' + id;
         },
-        slugName: function () {
+        slugName() {
             const name = (this.dataId.indexOf('<h2>') > -1 ? FNR.utility.genSlug(this.dataId.split('<h2>')[1].split('</h2>')[0], '-') : FNR.utility.genSlug(this.dataId, '-'));
 
             return 'subforum-' + name;
@@ -83,7 +83,7 @@ Vue.component('subforo-foro', {
 
 Vue.component('lista-temas-cabecera', {
     props: ['dataElements'],
-    data: function () {
+    data() {
         return {
             elementos: JSON.parse(this.dataElements.replace(/'/g, '"'))
         }
@@ -99,7 +99,7 @@ Vue.component('lista-temas-cabecera', {
 
 Vue.component('tema-foro', {
     computed: {
-        slugId: function () {
+        slugId() {
             let id = '';
 
             if (window.location.pathname.match(/t(\d+)-/)) {
@@ -110,7 +110,7 @@ Vue.component('tema-foro', {
 
             return 'topic-' + id;
         },
-        slugName: function () {
+        slugName() {
             const name = FNR.utility.genSlug((this.$slots['title'][0].tag === undefined ? this.$slots['title'][0].text : this.$slots['title'][0].children[0].text), '-');
 
             return 'topic-' + name;
@@ -125,24 +125,8 @@ Vue.component('tema-foro', {
 
 Vue.component('mando-foro', {
     props: ['dataId', 'dataApp'],
-    data: function () {
-        return {
-            children: 0
-        }
-    },
-    computed: {
-        isStatusClass: function () {
-            if (this.children > 0) return 'forum-controls';
-            else return 'forum-controls not-show';
-        }
-    },
-    created() {
-        Object.values(this.$slots).map((item) => {
-            this.children += item.length;
-        });
-    },
     template: `
-    <section :id="dataId" :class="isStatusClass">
+    <section :id="dataId" class="forum-controls">
         <template v-if="dataApp === 'true'">
             <div class="left page-pagination">
                 <slot name="pagination"></slot>
@@ -162,24 +146,15 @@ Vue.component('mando-foro', {
 /* Componentes del foro */
 Vue.component('titulo-especial', {
     props: ['dataTitle'],
-    computed: {
-        cleaned: function () {
-            if (this.dataTitle.indexOf('<h2>') > -1) return this.dataTitle.split('<h2>')[1].split('</h2>')[0];
-            else return this.dataTitle;
-        },
-        minimized: function () {
-            return FNR.utility.genSlug(this.cleaned, ' ');
-        }
-    },
     template: `
-    <h3 class="is-tweakeable"><span class="is-measurable">{{ cleaned }}</span></h3>
+    <h3 class="is-tweakeable"><span class="is-measurable" v-html="dataTitle"></span></h3>
     `
 });
 
 Vue.component('cuerpo-widget', {
     props: ['dataClass'],
     computed: {
-        currentClass: function () {
+        currentClass() {
             if (this.dataClass === undefined) return 'plank-inner';
             else return 'plank-inner' + ' ' + this.dataClass;
         }
@@ -195,7 +170,7 @@ Vue.component('cuerpo-widget', {
 
 Vue.component('separador-foro', {
     props: ['dataFaction'],
-    data: function () {
+    data() {
         return {
             image: forumDefaults.separator
         }
@@ -209,13 +184,13 @@ Vue.component('separador-foro', {
 
 Vue.component('tema-ref', {
     props: ['dataInfo'],
-    data: function () {
+    data() {
         return {
             profileName: forumConfig.profileOptions.profileName || 'perfil'
         }
     },
     computed: {
-        userColor: function () {
+        userColor() {
             return 'color: ' + this.dataInfo.lastpost.who.color;
         }
     },
@@ -253,14 +228,14 @@ Vue.component('campo-foro', {
 Vue.component('boton-foro', {
     props: ['dataUrl', 'dataName', 'dataIcon', 'dataType', 'dataInput'],
     computed: {
-        realClass: function () {
+        realClass() {
             if (this.dataInput === 'true') return 'forum-button is-input';
             else return 'forum-button';
         },
-        realName: function () {
+        realName() {
             return 'text' + (this.dataType === 'no-name' ? ' is-hidden-touch' : '');
         },
-        realUrl: function () {
+        realUrl() {
             if (this.dataInput === 'true') return 'javascript:{}';
             else return this.dataUrl;
         }
@@ -306,7 +281,7 @@ Vue.component('aviso-foro', {
 });
 
 Vue.component('afiliaciones-foro', {
-    data: function () {
+    data() {
         return {
             afis: {}
         }
@@ -323,7 +298,7 @@ Vue.component('afiliaciones-foro', {
 
 /* Navbar del foro */
 Vue.component('controles-foro', {
-    data: function () {
+    data() {
         return {
             maPage: 0,
             userName: _userdata.username,
@@ -336,12 +311,12 @@ Vue.component('controles-foro', {
         };
     },
     computed: {
-        isActiveClass: function () {
+        isActiveClass() {
             return 'has-bg' + ((this.isActive) ? ' visible' : ' not-visible');
         }
     },
     methods: {
-        turnActive: function () {
+        turnActive() {
             this.isActive = (this.isActive) ? false : true;
         }
     },
@@ -368,14 +343,14 @@ Vue.component('controles-foro', {
                 <navbar-foro :data-username="userName" :data-userlevel="userLevel" :data-userid="userId" :data-userlog="userLog" :data-usermp="userMP" :data-userout="userOut" />
             </section>
             <section id="forum-navbar-mobile" class="is-hidden-desktop">
-                <div id="hmg-button" v-on:click="turnActive()" class="is-pointer">
+                <div id="hmg-button" @click="turnActive()" class="is-pointer">
                     <i class="fas fa-bars"></i>
                 </div>
                 <div id="hmg-menu" :class="isActiveClass">
-                    <h3>{{ userName | just-name }}<i class="fas fa-times is-pointer" v-on:click="turnActive()"></i></h3>
+                    <h3>{{ userName | just-name }}<i class="fas fa-times is-pointer" @click="turnActive()"></i></h3>
                     <navbar-foro :data-username="userName" :data-userlevel="userLevel" :data-userid="userId" :data-userlog="userLog" :data-usermp="userMP" :data-userout="userOut" />
                 </div>
-                <div class="bg-active" v-on:click="turnActive()"></div>
+                <div class="bg-active" @click="turnActive()"></div>
             </section>
             <section v-if="maPage === 1" id="multiaccount-transition">
                 <cargando-foro data-text="Cambiando de cuenta…"></cargando-foro>
@@ -387,10 +362,11 @@ Vue.component('controles-foro', {
 
 Vue.component('navbar-foro', {
     props: ['dataUsername', 'dataUserlevel', 'dataUserid', 'dataUserlog', 'dataUsermp', 'dataUserout'],
-    data: function () {
+    data() {
         return {
             profileName: forumConfig.profileOptions.profileName || 'perfil',
             items: forumContent.navbar,
+            navigation: forumContent.links,
             directions: forumConfig.usableDirections,
             multiAccount: {
                 status: false,
@@ -400,20 +376,20 @@ Vue.component('navbar-foro', {
         }
     },
     computed: {
-        isStatusClass: function () {
+        isStatusClass() {
             return ((this.dataUserlog === 1) ? 'is-logged' : 'is-unlogged') + ((this.dataUserlevel === 1) ? ' is-admin' : ' is-user')
         },
-        mpText: function () {
+        mpText() {
             return 'Mensajería' + ((this.dataUsermp !== 0) ? ' (' + this.dataUsermp + ')' : '')
         },
-        links: function () {
-            return forumContent.links.filter((item) => {
+        links() {
+            return this.navigation.filter((item) => {
                 return item.icon !== undefined;
             });
         }
     },
     methods: {
-        changeAccount: function () {
+        changeAccount() {
             this.$parent.maPage = 1;
 
             FNR.user.changeAccount(this.dataUserout, this.multiAccount.accounts[this.multiAccount.position].name, this.multiAccount.accounts[this.multiAccount.position].password).then((r) => {
@@ -517,7 +493,7 @@ Vue.component('navbar-foro', {
                         </div>
                         <div class="text">Temas personales</div>
                     </a>
-                    <a class="navbar-item" :href="dataUserout">
+                    <a class="navbar-item" :href="dataUserout" title="Cerrar sesión">
                         <div class="icon">
                             <i class="fas fa-sign-out-alt"></i>
                         </div>
@@ -526,7 +502,7 @@ Vue.component('navbar-foro', {
                     <template v-if="multiAccount.status">
                         <hr/>
                         <div class="select-container">
-                            <select v-model="multiAccount.position" v-on:change="changeAccount()" v-on:click="$event.stopPropagation()">
+                            <select v-model="multiAccount.position" @change="changeAccount()" @click="$event.stopPropagation()">
                                 <option value="-1" hidden selected>Selec. personaje</option>
                                 <option v-for="(account, index) in multiAccount.accounts" :value="index">{{ account.name }}</option>
                             </select>
@@ -541,7 +517,7 @@ Vue.component('navbar-foro', {
 
 /* Widgets del foro */
 Vue.component('links-ayuda', {
-    data: function () {
+    data() {
         return {
             links: forumContent.links
         }
@@ -554,7 +530,7 @@ Vue.component('links-ayuda', {
 });
 
 Vue.component('links-anuncios', {
-    data: function () {
+    data() {
         return {
             announcements: forumContent.announcements
         }
@@ -570,7 +546,7 @@ Vue.component('links-anuncios', {
 });
 
 Vue.component('links-staff', {
-    data: function () {
+    data() {
         return {
             staff: forumContent.staff
         }
@@ -583,47 +559,35 @@ Vue.component('links-staff', {
 });
 
 Vue.component('sabias-que', {
-    data: function () {
+    data() {
         return {
-            content: forumContent.sq,
-            position: this.content[Math.floor(Math.random() * this.content.length)]
-        }
-    },
-    computed: {
-        current: function () {
-            return this.content[this.position];
+            content: forumContent.sq[Math.floor(Math.random() * forumContent.sq.length)]
         }
     },
     created() {
         setInterval(() => {
-            this.position = this.content[Math.floor(Math.random() * this.content.length)];
+            this.content = forumContent.sq[Math.floor(Math.random() * forumContent.sq.length)];
         }, 12000);
     },
     template: `
-    <img id="sq-img" :src="current" alt="¿Sabías que?" />
+    <img id="sq-img" :src="content" alt="¿Sabías que?" />
     `
 });
 
 Vue.component('busquedas', {
-    data: function () {
+    data() {
         return {
-            content: forumContent.searches,
-            position: this.content[Math.floor(Math.random() * this.content.length)]
-        }
-    },
-    computed: {
-        current: function () {
-            return this.content[this.position];
+            content: forumContent.searches[Math.floor(Math.random() * forumContent.searches.length)]
         }
     },
     created() {
         setInterval(() => {
-            this.position = this.content[Math.floor(Math.random() * this.content.length)];
+            this.content = forumContent.searches[Math.floor(Math.random() * forumContent.searches.length)];
         }, 16000);
     },
     template: `
-    <a id="search-img" :href="current.url" target="_blank" :title="current.desc">
-        <img :src="current.img" alt="Búsqueda" />
+    <a id="search-img" :href="content.url" target="_blank" :title="content.desc">
+        <img :src="content.img" alt="Búsqueda" />
     </a>
     `
 });
@@ -643,7 +607,7 @@ Vue.component('note-info', {
 Vue.component('redirect', {
     props: ['dataTo'],
     computed: {
-        currentStatus: function () {
+        currentStatus() {
             if (window.location.pathname.match(/t(\d+)-/)) return true;
             else return false;
         }
@@ -702,7 +666,7 @@ Vue.component('wiki-index-items-d', {
 
 Vue.component('wiki-index', {
     computed: {
-        indexContent: function () {
+        indexContent() {
             const getChildren = (name) => {
                 return filtered.filter((item) => {
                     return item.component.page_parent === name;
@@ -793,7 +757,7 @@ Vue.component('wiki-contenido', {
 
 Vue.component('wiki-nav', {
     computed: {
-        more: function () {
+        more() {
             return routes.filter((item) => {
                 return item.component
             }).filter((item) => {
@@ -802,7 +766,7 @@ Vue.component('wiki-nav', {
                 })[0].component.page_parent
             }).length > 1;
         },
-        nav: function () {
+        nav() {
             const list = routes.filter((item) => {
                 return item.component
             }).filter((item) => {
@@ -833,7 +797,7 @@ Vue.component('wiki-nav', {
 Vue.component('wiki-children', {
     props: ['dataName', 'dataCategory'],
     computed: {
-        nav: function () {
+        nav() {
             return routes.filter((item) => {
                 return item.component
             }).filter((item) => {
@@ -853,7 +817,7 @@ Vue.component('wiki-children', {
 Vue.component('modal-foro', {
     props: ['dataTitle'],
     methods: {
-        modalClose: function () {
+        modalClose() {
             this.$parent.state.modal = false;
             this.$emit('modal-close');
         }
@@ -863,7 +827,7 @@ Vue.component('modal-foro', {
         <div class="modal-element">
             <div class="modal-title">
                 <h3>{{ dataTitle }}</h3>
-                <a v-on:click="modalClose()">
+                <a @click="modalClose()">
                     <i class="fas fa-times"></i>
                 </a>
             </div>
@@ -874,7 +838,7 @@ Vue.component('modal-foro', {
                 <slot name="controls"></slot>
             </div>
         </div>
-        <div class="is-bgmodal bg-active" v-on:click="modalClose()"></div>
+        <div class="is-bgmodal bg-active" @click="modalClose()"></div>
     </div>
     `
 });
@@ -889,7 +853,7 @@ Vue.component('controles-modal', {
 
 /* Expediente */
 Vue.component('expediente-usuario', {
-    data: function () {
+    data() {
         return {
             info: {
                 name: _userdata.username,
@@ -901,16 +865,16 @@ Vue.component('expediente-usuario', {
         }
     },
     computed: {
-        userRank: function () {
+        userRank() {
             return this.profile.fields[forumConfig.profileOptions.profileRank].content;
         },
-        userCite: function () {
+        userCite() {
             return this.profile.fields[forumConfig.profileOptions.profileCite].content
         },
-        userCover: function () {
+        userCover() {
             return this.profile.fields[forumConfig.profileOptions.profileCover].content
         },
-        usableMiniFields: function () {
+        usableMiniFields() {
             if (this.config.miniFields === undefined || !this.config.miniFields.length) return [];
             else return Object.entries(this.profile.fields).filter((item) => {
                 return this.config.miniFields.indexOf(item[0]) > -1;
@@ -934,7 +898,7 @@ Vue.component('expediente-usuario', {
                 };
             });
         },
-        usableBigFields: function () {
+        usableBigFields() {
             if (this.config.mainFields === undefined || !Object.keys(this.config.mainFields).length) return [];
             else return Object.entries(this.profile.fields).filter((item) => {
                 return Object.keys(this.config.mainFields).indexOf(item[0]) > -1;
@@ -960,7 +924,7 @@ Vue.component('expediente-usuario', {
                 };
             });
         },
-        lengthBigFields: function () {
+        lengthBigFields() {
             let length = 0;
 
             this.usableBigFields.map((item) => {
@@ -971,7 +935,7 @@ Vue.component('expediente-usuario', {
 
             return length;
         },
-        usableExtraFields: function () {
+        usableExtraFields() {
             if (this.config.extraFields === undefined || !this.config.extraFields.length) return [];
             else return Object.entries(this.profile.fields).filter((item) => {
                 return this.config.extraFields.indexOf(item[0]) > -1;
@@ -995,7 +959,7 @@ Vue.component('expediente-usuario', {
                 };
             });
         },
-        lengthExtraFields: function () {
+        lengthExtraFields() {
             let length = 0;
 
             this.usableExtraFields.map((item) => {
@@ -1006,7 +970,7 @@ Vue.component('expediente-usuario', {
 
             return length;
         },
-        usableLinkFields: function () {
+        usableLinkFields() {
             if (this.profile.contact.length) return [];
             else return Object.entries(this.profile.contact).filter((item) => {
                 return item[1].label !== 'Mensaje Privado';
@@ -1020,15 +984,15 @@ Vue.component('expediente-usuario', {
                 }
             });
         },
-        chronologyField: function () {
+        chronologyField() {
             if (this.config.cronoField === undefined || !this.config.cronoField.length) return [];
             else return FNR.utility.genArray(this.profile.fields[FNR.utility.genSlug(this.config.cronoField, '_')].content);
         },
-        relationshipsField: function () {
+        relationshipsField() {
             if (this.config.relaField === undefined || !this.config.relaField.length) return [];
             else return FNR.utility.genArray(this.profile.fields[FNR.utility.genSlug(this.config.relaField, '_')].content);
         },
-        lengthHistoryFields: function () {
+        lengthHistoryFields() {
             let length = 0;
 
             length += this.chronologyField.length;
@@ -1036,7 +1000,7 @@ Vue.component('expediente-usuario', {
 
             return length;
         },
-        currentClass: function () {
+        currentClass() {
             return 'usergroup-' + this.profile.colour
         }
     },
@@ -1082,16 +1046,16 @@ Vue.component('expediente-usuario', {
                 </div>
             </section>
             <section id="profile-subhead">
-                <div class="columns is-vcentered">
+                <div class="columns is-centered is-vcentered is-gapless">
                     <div class="column is-6 is-full-mobile">
                         <div id="profile-quote" class="is-content">
                             <quote>{{ userCite }}</quote>
                         </div>
                     </div>
-                    <div class="column is-5 is-offset-1 is-full-mobile is-offset-0-mobile">
-                        <div class="columns is-flex is-vcentered">
-                            <div class="column is-half is-half-mobile">
-                                <ul class="profile-links">
+                    <div class="column is-5 is-full-mobile">
+                        <div id="profile-links" class="columns is-flex is-vcentered is-multiline py-4">
+                            <div class="column is-full-touch is-half-desktop">
+                                <ul class="profile-linklist">
                                     <li>
                                         <a :href="profile.links.posts" :title="'Mensajes de «' + profile.name + '»'" target="_blank">
                                             <i :class="config.contactFields.mensajes"></i> Mensajes
@@ -1109,8 +1073,8 @@ Vue.component('expediente-usuario', {
                                     </li>
                                 </ul>
                             </div>
-                            <div class="column is-half is-half-mobile">
-                                <ul class="profile-links">
+                            <div class="column is-full-touch is-half-desktop">
+                                <ul class="profile-linklist">
                                     <li :id="'profile-link-' + field.id" v-for="field in usableLinkFields">
                                         <a :href="field.url" :title="field.desc" target="_blank">
                                             <i :class="field.icon"></i> {{ field.title }}
@@ -1194,7 +1158,7 @@ Vue.component('expediente-usuario', {
 Vue.component('cuerpo-principal', {
     props: ['dataTitle'],
     computed: {
-        title: function () {
+        title() {
             if (typeof this.dataTitle === 'undefined') return '';
             else return this.dataTitle;
         }
@@ -1212,7 +1176,7 @@ Vue.component('cuerpo-principal', {
 Vue.component('cuerpo-interior', {
     props: ['dataTitle'],
     computed: {
-        title: function () {
+        title() {
             if (typeof this.dataTitle === 'undefined') return '';
             else return this.dataTitle;
         }
@@ -1230,7 +1194,7 @@ Vue.component('cuerpo-interior', {
 Vue.component('cuerpo-lista', {
     props: ['dataTitle'],
     computed: {
-        title: function () {
+        title() {
             if (typeof this.dataTitle === 'undefined') return '';
             else return this.dataTitle;
         }