generic-skin 3.3.6 → 3.3.7

package/apps/vueChrono.js

@@ -198,7 +198,7 @@ Vue.component('modal-cronologia', {
         this.info.people = list;
     },
     template: `
-    <modal-foro :data-title="modalTitle" v-on:modal-close="modalClose()">
+    <modal-foro :data-title="modalTitle" @modal-close="modalClose()">
         <template v-if="page === 0">
             <template slot="content">
                 <aviso-foro v-show="oneCheck.length">
@@ -251,7 +251,7 @@ Vue.component('modal-cronologia', {
             </template>
             <template slot="controls" v-if="!oneCheck.length">
                 <controles-modal>
-                    <button class="button1 btn-main" v-on:click="page = 1" title="Paso siguiente">Siguiente</button>
+                    <button class="button1 btn-main" @click="page = 1" title="Paso siguiente">Siguiente</button>
                 </controles-modal>
             </template>
         </template>
@@ -278,14 +278,14 @@ Vue.component('modal-cronologia', {
                             <div class="character-selector">
                                 <input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />
                                 <ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">
-                                    <li v-for="(character, index) in sortedCharacters" v-on:click="addCharacter(character)" :title="'Seleccionar «' + character + '»'">{{ character }}<i class="fas fa-plus"></i></li>
+                                    <li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="'Seleccionar «' + character + '»'">{{ character }}<i class="fas fa-plus"></i></li>
                                 </ul>
-                                <a class="character-custom" v-on:click="addCharacter(info.user)" v-if="info.user.length > 2" :title="'Seleccionar «' + info.user + '»'">
+                                <a class="character-custom" @click="addCharacter(info.user)" v-if="info.user.length > 2" :title="'Seleccionar «' + info.user + '»'">
                                     <i class="fas fa-plus"></i>
                                 </a>
                             </div>
                             <ul v-if="info.people.length" class="no-style character-list">
-                                <li v-for="(character, index) in sortedEditCharacters" v-on:click="deleteCharacter(index)" :title="'Quitar ' + character"><i class="fas fa-times"></i> {{ character }}</li>
+                                <li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="'Quitar ' + character"><i class="fas fa-times"></i> {{ character }}</li>
                             </ul>
                         </campo-foro>
                     </li>
@@ -293,8 +293,8 @@ Vue.component('modal-cronologia', {
             </template>
             <template slot="controls">
                 <controles-modal>
-                    <button class="button2" v-on:click="page = 0" title="Paso anterior">Anterior</button>
-                    <button class="button1 btn-main" v-on:click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>
+                    <button class="button2" @click="page = 0" title="Paso anterior">Anterior</button>
+                    <button class="button1 btn-main" @click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>
                 </controles-modal>
             </template>
         </template>
@@ -463,22 +463,22 @@ Vue.component('gestor-cronologia', {
             <modal-cronologia v-if="modal.status" :data-type="modal.type" :data-element="entry"></modal-cronologia>
             <mando-foro data-id="upper-controls" data-app="true">
                 <template slot="pagination" v-if="paginationContent.pages.length > 1">
-                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">
+                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">
                         <i class="fas fa-chevron-left"></i>
                     </a>
                     <template v-for="page in paginationContent.pages">
                         <strong v-if="page === state.pagination">{{ page + 1 }}</strong>
-                        <a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>
+                        <a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else @click="state.pagination = page">{{ page + 1 }}</a>
                     </template>
-                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">
+                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">
                         <i class="fas fa-chevron-right"></i>
                     </a>
                 </template>
                 <template slot="controls">
-                    <li v-on:click="addEntry($event)">
+                    <li @click="addEntry($event)">
                         <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>
                     </li>
-                    <li v-if="finalCheck" v-on:click="save($event)">
+                    <li v-if="finalCheck" @click="save($event)">
                         <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>
                     </li>
                 </template>
@@ -495,22 +495,22 @@ Vue.component('gestor-cronologia', {
             </ul>
             <mando-foro data-id="lower-controls" data-app="true">
                 <template slot="pagination" v-if="paginationContent.pages.length > 1">
-                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">
+                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">
                         <i class="fas fa-chevron-left"></i>
                     </a>
                     <template v-for="page in paginationContent.pages">
                         <strong v-if="page === state.pagination">{{ page + 1 }}</strong>
-                        <a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>
+                        <a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else @click="state.pagination = page">{{ page + 1 }}</a>
                     </template>
-                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">
+                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">
                         <i class="fas fa-chevron-right"></i>
                     </a>
                 </template>
                 <template slot="controls">
-                    <li v-on:click="addEntry($event)">
+                    <li @click="addEntry($event)">
                         <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>
                     </li>
-                    <li v-if="finalCheck" v-on:click="save($event)">
+                    <li v-if="finalCheck" @click="save($event)">
                         <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>
                     </li>
                 </template>
@@ -572,7 +572,7 @@ Vue.component('elemento-cronologia', {
                         </small>
                     </div>
                     <div class="rp-controls">
-                        <span v-on:click="editElement()" title="Editar entrada">Editar</span> / <span v-on:click="deleteElement()" title="Eliminar entrada">Eliminar</span>
+                        <span @click="editElement()" title="Editar entrada">Editar</span> / <span @click="deleteElement()" title="Eliminar entrada">Eliminar</span>
                     </div>
                 </div>
             </a>

package/apps/vueChrono.min.js

@@ -1 +1 @@
-Vue.component("modal-cronologia", { props: ["dataElement", "dataType"], data() { return { page: 0, state: { modal: !1 }, info: { user: "", people: [], selector: !0 }, content: { edit: JSON.parse(JSON.stringify(this.dataElement)), current: this.dataElement } } }, computed: { modalTitle() { return "new" === this.dataType ? "Nueva entrada" : "edit" === this.dataType ? "Editar entrada" : void 0 }, oneCheck() { let t = ""; if (!Object.keys(this.content.edit).length) return t; this.content.edit.name.length < 5 && (t += "<li>Escribe un título lo suficientemente largo.</li>"), -1 === this.content.edit.link.indexOf("/t") && (t += "<li>Escribe un enlace válido.</li>"); let e = []; if ((1 > parseFloat(this.content.edit.date.day) || parseFloat(this.content.edit.date.day) > forumData.date.day || "" === this.content.edit.date.day || Number.isNaN(parseFloat(this.content.edit.date.day))) && e.push("un día correcto (1 al " + forumData.date.day + ")"), (1 > parseFloat(this.content.edit.date.month) || parseFloat(this.content.edit.date.month) > forumData.date.month || "" === this.content.edit.date.month || Number.isNaN(parseFloat(this.content.edit.date.month))) && e.push("un mes correcto (1 al " + forumData.date.month + ")"), ("DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) > forumData.date.year || "DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) < 1 || "" === this.content.edit.date.year || Number.isNaN(parseFloat(this.content.edit.date.year))) && e.push("un año correcto"), -1 === this.content.edit.date.time && e.push("un periodo correcto"), e.length) { let n = ""; n += "<li>Recuerda poner ", [].forEach.call(e, (t, e, a) => { n += t, a.length - 2 === e ? n += " y " : a.length === e + 1 ? n += "." : a.length > e && (n += ", ") }), n += "</li>", t += n } return t }, secondCheck() { let t = ""; return Object.keys(this.content.edit).length ? (-1 === this.content.edit.status && (t += "<li>Selecciona un estado para el tema.</li>"), this.info.people.length || (t += "<li>Selecciona al menos un personaje.</li>"), t) : t }, finalCheck() { return JSON.stringify(this.content.current) !== JSON.stringify(this.finalData) }, finalData() { let t = JSON.parse(JSON.stringify(this.content.edit)); if (!Object.keys(this.content.edit).length) return t; let e = "", n = ""; return [].forEach.call(JSON.parse(JSON.stringify(this.sortedEditCharacters)), (t, a, o) => { e += t, n += Vue.filter("just-name")(t), o.length - 2 === a ? (e += " y ", n += " y ") : o.length === a + 1 ? (e += "", n += "") : o.length > a && (e += ", ", n += ", ") }), t.people.count = this.info.people.length, t.people.list = e, t.people.short = n, "new" === this.$parent.modal.type && (t.position = this.$parent.content.edit.length), t }, sortedCharacters() { return Object.keys(this.content.edit).length ? this.$parent.users.map(t => t.user).filter(t => -1 === this.info.people.indexOf(t)).filter(t => t.toLowerCase().indexOf(this.info.user.toLowerCase()) > -1) : this.$parent.users.map(t => t.user) }, sortedEditCharacters() { return this.info.people.sort((t, e) => t < e ? -1 : t > e ? 1 : 0) } }, methods: { modalClose() { this.$parent.modal.type = "new", this.$parent.modal.status = !1, this.$parent.setEntry() }, pushElement() { "edit" === this.$parent.modal.type && this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.content.current.position), 1), this.$parent.content.edit.push(this.finalData), this.modalClose() }, addCharacter: function (t) { this.info.people.push(t), this.info.selector = !1, this.info.user = "", setTimeout(() => { this.info.selector = !0 }, 250) }, deleteCharacter: function (t) { const e = JSON.parse(JSON.stringify(this.content.edit.status)); this.info.people.splice(t, 1), this.forceRerender(), this.content.edit.status = -1, this.content.edit.status = e } }, created() { let t = []; "" !== this.content.edit.people.list && (t = -1 === this.content.edit.people.list.indexOf(" y ") ? [this.content.edit.people.list] : this.content.edit.people.list.split(" y ")[0].split(", ").concat(this.content.edit.people.list.split(" y ")[1])), this.info.people = t }, template: '\n    <modal-foro :data-title="modalTitle" v-on:modal-close="modalClose()">\n        <template v-if="page === 0">\n            <template slot="content">\n                <aviso-foro v-show="oneCheck.length">\n                    <ul v-html="oneCheck"></ul>\n                </aviso-foro>\n                <ul class="forum-fieldlist no-style">\n                    <li>\n                        <campo-foro data-name="Título">\n                            <input type="text" v-model="content.edit.name" placeholder="Escribe el nombre del tema." />\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Enlace">\n                            <input type="text" v-model="content.edit.link" placeholder="Escribe el enlace del tema." />\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Fecha">\n                            <div class="input-date">\n                                <div class="date-element date-dmy">\n                                    <label>\n                                        Día\n                                        <input type="text" v-model="content.edit.date.day" placeholder="0" />\n                                    </label>\n                                    <label>\n                                        Mes\n                                        <input type="text" v-model="content.edit.date.month" placeholder="0" />\n                                    </label>\n                                    <label>\n                                        Año\n                                        <input type="text" v-model="content.edit.date.year" placeholder="0" />\n                                    </label>\n                                </div>\n                                <div class="date-element not-show mt-4">\n                                    <label>\n                                        Periodo\n                                        <div class="select-container">\n                                            <select v-model="content.edit.date.time">\n                                                <option value="-1" hidden>-</option>\n                                                <option value="AFI">AFI</option>\n                                                <option value="DFI">DFI</option>\n                                            </select>\n                                        </div>\n                                    </label>\n                                </div>\n                            </div>\n                        </campo-foro>\n                    </li>\n                </ul>\n            </template>\n            <template slot="controls" v-if="!oneCheck.length">\n                <controles-modal>\n                    <button class="button1 btn-main" v-on:click="page = 1" title="Paso siguiente">Siguiente</button>\n                </controles-modal>\n            </template>\n        </template>\n        <template v-else-if="page === 1">\n            <template slot="content">\n                <aviso-foro v-show="secondCheck.length">\n                    <ul v-html="secondCheck"></ul>\n                </aviso-foro>\n                <ul class="forum-fieldlist no-style">\n                    <li>\n                        <campo-foro data-name="Estado">\n                            <div class="select-container">\n                                <select v-model="content.edit.status">\n                                    <option value="-1" selected="selected" hidden="hidden">Selecciona un estado para el tema</option>\n                                    <option value="ropened">Activo</option>\n                                    <option value="rclosed">Cerrado</option>\n                                    <option value="rabandoned">Abandonado</option>\n                                </select>\n                            </div>\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Personajes">\n                            <div class="character-selector">\n                                <input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />\n                                <ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">\n                                    <li v-for="(character, index) in sortedCharacters" v-on:click="addCharacter(character)" :title="\'Seleccionar «\' + character + \'»\'">{{ character }}<i class="fas fa-plus"></i></li>\n                                </ul>\n                                <a class="character-custom" v-on:click="addCharacter(info.user)" v-if="info.user.length > 2" :title="\'Seleccionar «\' + info.user + \'»\'">\n                                    <i class="fas fa-plus"></i>\n                                </a>\n                            </div>\n                            <ul v-if="info.people.length" class="no-style character-list">\n                                <li v-for="(character, index) in sortedEditCharacters" v-on:click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n                            </ul>\n                        </campo-foro>\n                    </li>\n                </ul>\n            </template>\n            <template slot="controls">\n                <controles-modal>\n                    <button class="button2" v-on:click="page = 0" title="Paso anterior">Anterior</button>\n                    <button class="button1 btn-main" v-on:click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>\n                </controles-modal>\n            </template>\n        </template>\n    </modal-foro>\n    ' }), Vue.component("gestor-cronologia", { data() { return { render: 0, modal: { type: "new", status: !1 }, users: [], state: { page: 0, pagination: 0 }, entry: {}, content: { edit: [], current: [] } } }, computed: { sortedContent() { return JSON.parse(JSON.stringify(this.content.edit)).sort(({ date: t, name: e }, { date: n, name: a }) => { if (t.time !== n.time) return "AFI" === t.time ? -1 : 1; const o = "AFI" === t.time ? n : t, i = "AFI" === t.time ? t : n; return parseFloat(t.year) !== parseFloat(n.year) ? parseFloat(o.year) - parseFloat(i.year) : parseFloat(t.month) !== parseFloat(n.month) ? parseFloat(o.month) - parseFloat(i.month) : parseFloat(t.day) !== parseFloat(n.day) ? parseFloat(o.day) - parseFloat(i.day) : e - a }) }, paginationContent() { const t = forumConfig.skinOptions.paginationDefault, e = Math.floor((this.sortedContent.length - 1) / t) + 1; let n = []; for (let t = 0; t < e; t++)n.push(t); return this.forceRerender(), { pages: n, content: this.sortedContent.slice(this.state.pagination * t, (this.state.pagination + 1) * t) } }, finalCheck() { return JSON.stringify(this.content.current) !== JSON.stringify(this.content.edit) } }, methods: { forceRerender() { this.render += 1 }, setEntry() { this.entry = { link: "", name: "", status: -1, people: { list: "", short: "", count: 0 }, date: { time: "DFI", day: "", month: "", year: "" } } }, addEntry: function (t) { t.preventDefault(), this.modal.status = !0 }, save: function (t) { t.preventDefault(), this.state.page = 2; const e = this.sortedContent.map(t => (void 0 !== t.desc && delete t.desc, void 0 !== t.position && delete t.position, t)); FNR.user.profile.setData([{ name: forumConfig.profileUser.cronoField, type: "textarea", value: JSON.stringify(e).replace(/"/g, "`") }]).then(t => { t ? (FNR.html.genNotification("Atención", "Información actualizada sin inconvenientes.", "fas fa-check"), setTimeout(() => { window.location.reload() }, 2e3)) : FNR.html.genNotification("Atención", "Hubo un problema al actualizar. Dale otro intento.", "fas fa-exclamation") }) } }, created() { FNR.user.profile.getData([{ name: forumConfig.profileUser.cronoField, type: "textarea" }]).then(t => { const e = FNR.utility.genArray(t[0].value).map((t, e) => { let n = t; return n.position = e, n }); this.content.edit = e, this.content.current = JSON.parse(JSON.stringify(e)), FNR.forum.getMembers().then(t => { this.setEntry(), this.users = t, this.state.page = 1 }) }) }, template: '\n    <section id="forum-chronology" class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Cronología</h2>\n            <hr />\n            <p>En esta página podrás editar la cronología de tu personaje. Experimenta con su funcionamiento, es bastante intuitivo.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <modal-cronologia v-if="modal.status" :data-type="modal.type" :data-element="entry"></modal-cronologia>\n            <mando-foro data-id="upper-controls" data-app="true">\n                <template slot="pagination" v-if="paginationContent.pages.length > 1">\n                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">\n                        <i class="fas fa-chevron-left"></i>\n                    </a>\n                    <template v-for="page in paginationContent.pages">\n                        <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n                        <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>\n                    </template>\n                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">\n                        <i class="fas fa-chevron-right"></i>\n                    </a>\n                </template>\n                <template slot="controls">\n                    <li v-on:click="addEntry($event)">\n                        <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n                    </li>\n                    <li v-if="finalCheck" v-on:click="save($event)">\n                        <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n                    </li>\n                </template>\n            </mando-foro>\n            <ul id="forum-rplist" class="no-style" :key="render">\n                <template v-if="!paginationContent.content.length">\n                    <li class="is-not-lastpost not-status">\n                        <h6>No hay entradas en tu cronología</h6>\n                    </li>\n                </template>\n                <template v-else v-for="rp in paginationContent.content">\n                    <elemento-cronologia :data-element="rp" data-type="manager" :data-id="rp.position" />\n                </template>\n            </ul>\n            <mando-foro data-id="lower-controls" data-app="true">\n                <template slot="pagination" v-if="paginationContent.pages.length > 1">\n                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">\n                        <i class="fas fa-chevron-left"></i>\n                    </a>\n                    <template v-for="page in paginationContent.pages">\n                        <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n                        <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>\n                    </template>\n                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">\n                        <i class="fas fa-chevron-right"></i>\n                    </a>\n                </template>\n                <template slot="controls">\n                    <li v-on:click="addEntry($event)">\n                        <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n                    </li>\n                    <li v-if="finalCheck" v-on:click="save($event)">\n                        <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n                    </li>\n                </template>\n            </mando-foro>\n        </template>\n        <template v-else-if="state.page === 2">\n            <cargando-foro data-text="Actualizando información…"></cargando-foro>\n        </template>\n    </section>\n    ' }), Vue.component("elemento-cronologia", { props: ["dataElement", "dataType", "dataId"], data() { return { content: this.dataElement } }, methods: { deleteElement() { this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.dataId), 1), 0 === this.$parent.paginationContent.content.length && 0 !== this.$parent.state.pagination && (this.$parent.state.pagination -= 1), this.$parent.forceRerender() }, editElement() { this.$parent.modal.type = "edit", this.$parent.entry = this.content, this.$parent.modal.status = !0 } }, template: '\n    <li class="rp-list">\n        <template v-if="dataType === \'manager\'">\n            <a class="rp-element rp-manager">\n                <div class="rp-icon">\n                    <template v-if="content.status === \'ropened\'">\n                        <i class="fas fa-lock-open"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rclosed\'">\n                        <i class="fas fa-lock"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rabandoned\'">\n                        <i class="fas fa-times"></i>\n                    </template>\n                </div>\n                <div class="rp-content">\n                    <div class="rp-name">\n                        <span>{{ content.name }}</span>\n                        <small>\n                            {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n                        </small>\n                    </div>\n                    <div class="rp-controls">\n                        <span v-on:click="editElement()" title="Editar entrada">Editar</span> / <span v-on:click="deleteElement()" title="Eliminar entrada">Eliminar</span>\n                    </div>\n                </div>\n            </a>\n        </template>\n        <template v-else-if="dataType === \'profile\'">\n            <a class="rp-element" :href="content.link" target="_blank" :title="\'Ir al tema «\' + content.name + \'»\'">\n                <div class="rp-icon">\n                    <template v-if="content.status === \'ropened\'">\n                        <i class="fas fa-lock-open"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rclosed\'">\n                        <i class="fas fa-lock"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rabandoned\'">\n                        <i class="fas fa-times"></i>\n                    </template>\n                </div>\n                <div class="rp-content">\n                    <div class="rp-name">\n                        <span>{{ content.name }}</span>\n                        <small>\n                            {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n                        </small>\n                    </div>\n                </div>\n            </a>\n        </template>\n    </li>\n    ' });
+Vue.component("modal-cronologia", { props: ["dataElement", "dataType"], data() { return { page: 0, state: { modal: !1 }, info: { user: "", people: [], selector: !0 }, content: { edit: JSON.parse(JSON.stringify(this.dataElement)), current: this.dataElement } } }, computed: { modalTitle() { return "new" === this.dataType ? "Nueva entrada" : "edit" === this.dataType ? "Editar entrada" : void 0 }, oneCheck() { let t = ""; if (!Object.keys(this.content.edit).length) return t; this.content.edit.name.length < 5 && (t += "<li>Escribe un título lo suficientemente largo.</li>"), -1 === this.content.edit.link.indexOf("/t") && (t += "<li>Escribe un enlace válido.</li>"); let e = []; if ((1 > parseFloat(this.content.edit.date.day) || parseFloat(this.content.edit.date.day) > forumData.date.day || "" === this.content.edit.date.day || Number.isNaN(parseFloat(this.content.edit.date.day))) && e.push("un día correcto (1 al " + forumData.date.day + ")"), (1 > parseFloat(this.content.edit.date.month) || parseFloat(this.content.edit.date.month) > forumData.date.month || "" === this.content.edit.date.month || Number.isNaN(parseFloat(this.content.edit.date.month))) && e.push("un mes correcto (1 al " + forumData.date.month + ")"), ("DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) > forumData.date.year || "DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) < 1 || "" === this.content.edit.date.year || Number.isNaN(parseFloat(this.content.edit.date.year))) && e.push("un año correcto"), -1 === this.content.edit.date.time && e.push("un periodo correcto"), e.length) { let n = ""; n += "<li>Recuerda poner ", [].forEach.call(e, (t, e, a) => { n += t, a.length - 2 === e ? n += " y " : a.length === e + 1 ? n += "." : a.length > e && (n += ", ") }), n += "</li>", t += n } return t }, secondCheck() { let t = ""; return Object.keys(this.content.edit).length ? (-1 === this.content.edit.status && (t += "<li>Selecciona un estado para el tema.</li>"), this.info.people.length || (t += "<li>Selecciona al menos un personaje.</li>"), t) : t }, finalCheck() { return JSON.stringify(this.content.current) !== JSON.stringify(this.finalData) }, finalData() { let t = JSON.parse(JSON.stringify(this.content.edit)); if (!Object.keys(this.content.edit).length) return t; let e = "", n = ""; return [].forEach.call(JSON.parse(JSON.stringify(this.sortedEditCharacters)), (t, a, o) => { e += t, n += Vue.filter("just-name")(t), o.length - 2 === a ? (e += " y ", n += " y ") : o.length === a + 1 ? (e += "", n += "") : o.length > a && (e += ", ", n += ", ") }), t.people.count = this.info.people.length, t.people.list = e, t.people.short = n, "new" === this.$parent.modal.type && (t.position = this.$parent.content.edit.length), t }, sortedCharacters() { return Object.keys(this.content.edit).length ? this.$parent.users.map(t => t.user).filter(t => -1 === this.info.people.indexOf(t)).filter(t => t.toLowerCase().indexOf(this.info.user.toLowerCase()) > -1) : this.$parent.users.map(t => t.user) }, sortedEditCharacters() { return this.info.people.sort((t, e) => t < e ? -1 : t > e ? 1 : 0) } }, methods: { modalClose() { this.$parent.modal.type = "new", this.$parent.modal.status = !1, this.$parent.setEntry() }, pushElement() { "edit" === this.$parent.modal.type && this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.content.current.position), 1), this.$parent.content.edit.push(this.finalData), this.modalClose() }, addCharacter: function (t) { this.info.people.push(t), this.info.selector = !1, this.info.user = "", setTimeout(() => { this.info.selector = !0 }, 250) }, deleteCharacter: function (t) { const e = JSON.parse(JSON.stringify(this.content.edit.status)); this.info.people.splice(t, 1), this.forceRerender(), this.content.edit.status = -1, this.content.edit.status = e } }, created() { let t = []; "" !== this.content.edit.people.list && (t = -1 === this.content.edit.people.list.indexOf(" y ") ? [this.content.edit.people.list] : this.content.edit.people.list.split(" y ")[0].split(", ").concat(this.content.edit.people.list.split(" y ")[1])), this.info.people = t }, template: '\n    <modal-foro :data-title="modalTitle" @modal-close="modalClose()">\n        <template v-if="page === 0">\n            <template slot="content">\n                <aviso-foro v-show="oneCheck.length">\n                    <ul v-html="oneCheck"></ul>\n                </aviso-foro>\n                <ul class="forum-fieldlist no-style">\n                    <li>\n                        <campo-foro data-name="Título">\n                            <input type="text" v-model="content.edit.name" placeholder="Escribe el nombre del tema." />\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Enlace">\n                            <input type="text" v-model="content.edit.link" placeholder="Escribe el enlace del tema." />\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Fecha">\n                            <div class="input-date">\n                                <div class="date-element date-dmy">\n                                    <label>\n                                        Día\n                                        <input type="text" v-model="content.edit.date.day" placeholder="0" />\n                                    </label>\n                                    <label>\n                                        Mes\n                                        <input type="text" v-model="content.edit.date.month" placeholder="0" />\n                                    </label>\n                                    <label>\n                                        Año\n                                        <input type="text" v-model="content.edit.date.year" placeholder="0" />\n                                    </label>\n                                </div>\n                                <div class="date-element not-show mt-4">\n                                    <label>\n                                        Periodo\n                                        <div class="select-container">\n                                            <select v-model="content.edit.date.time">\n                                                <option value="-1" hidden>-</option>\n                                                <option value="AFI">AFI</option>\n                                                <option value="DFI">DFI</option>\n                                            </select>\n                                        </div>\n                                    </label>\n                                </div>\n                            </div>\n                        </campo-foro>\n                    </li>\n                </ul>\n            </template>\n            <template slot="controls" v-if="!oneCheck.length">\n                <controles-modal>\n                    <button class="button1 btn-main" @click="page = 1" title="Paso siguiente">Siguiente</button>\n                </controles-modal>\n            </template>\n        </template>\n        <template v-else-if="page === 1">\n            <template slot="content">\n                <aviso-foro v-show="secondCheck.length">\n                    <ul v-html="secondCheck"></ul>\n                </aviso-foro>\n                <ul class="forum-fieldlist no-style">\n                    <li>\n                        <campo-foro data-name="Estado">\n                            <div class="select-container">\n                                <select v-model="content.edit.status">\n                                    <option value="-1" selected="selected" hidden="hidden">Selecciona un estado para el tema</option>\n                                    <option value="ropened">Activo</option>\n                                    <option value="rclosed">Cerrado</option>\n                                    <option value="rabandoned">Abandonado</option>\n                                </select>\n                            </div>\n                        </campo-foro>\n                    </li>\n                    <li>\n                        <campo-foro data-name="Personajes">\n                            <div class="character-selector">\n                                <input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />\n                                <ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">\n                                    <li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="\'Seleccionar «\' + character + \'»\'">{{ character }}<i class="fas fa-plus"></i></li>\n                                </ul>\n                                <a class="character-custom" @click="addCharacter(info.user)" v-if="info.user.length > 2" :title="\'Seleccionar «\' + info.user + \'»\'">\n                                    <i class="fas fa-plus"></i>\n                                </a>\n                            </div>\n                            <ul v-if="info.people.length" class="no-style character-list">\n                                <li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n                            </ul>\n                        </campo-foro>\n                    </li>\n                </ul>\n            </template>\n            <template slot="controls">\n                <controles-modal>\n                    <button class="button2" @click="page = 0" title="Paso anterior">Anterior</button>\n                    <button class="button1 btn-main" @click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>\n                </controles-modal>\n            </template>\n        </template>\n    </modal-foro>\n    ' }), Vue.component("gestor-cronologia", { data() { return { render: 0, modal: { type: "new", status: !1 }, users: [], state: { page: 0, pagination: 0 }, entry: {}, content: { edit: [], current: [] } } }, computed: { sortedContent() { return JSON.parse(JSON.stringify(this.content.edit)).sort(({ date: t, name: e }, { date: n, name: a }) => { if (t.time !== n.time) return "AFI" === t.time ? -1 : 1; const o = "AFI" === t.time ? n : t, i = "AFI" === t.time ? t : n; return parseFloat(t.year) !== parseFloat(n.year) ? parseFloat(o.year) - parseFloat(i.year) : parseFloat(t.month) !== parseFloat(n.month) ? parseFloat(o.month) - parseFloat(i.month) : parseFloat(t.day) !== parseFloat(n.day) ? parseFloat(o.day) - parseFloat(i.day) : e - a }) }, paginationContent() { const t = forumConfig.skinOptions.paginationDefault, e = Math.floor((this.sortedContent.length - 1) / t) + 1; let n = []; for (let t = 0; t < e; t++)n.push(t); return this.forceRerender(), { pages: n, content: this.sortedContent.slice(this.state.pagination * t, (this.state.pagination + 1) * t) } }, finalCheck() { return JSON.stringify(this.content.current) !== JSON.stringify(this.content.edit) } }, methods: { forceRerender() { this.render += 1 }, setEntry() { this.entry = { link: "", name: "", status: -1, people: { list: "", short: "", count: 0 }, date: { time: "DFI", day: "", month: "", year: "" } } }, addEntry: function (t) { t.preventDefault(), this.modal.status = !0 }, save: function (t) { t.preventDefault(), this.state.page = 2; const e = this.sortedContent.map(t => (void 0 !== t.desc && delete t.desc, void 0 !== t.position && delete t.position, t)); FNR.user.profile.setData([{ name: forumConfig.profileUser.cronoField, type: "textarea", value: JSON.stringify(e).replace(/"/g, "`") }]).then(t => { t ? (FNR.html.genNotification("Atención", "Información actualizada sin inconvenientes.", "fas fa-check"), setTimeout(() => { window.location.reload() }, 2e3)) : FNR.html.genNotification("Atención", "Hubo un problema al actualizar. Dale otro intento.", "fas fa-exclamation") }) } }, created() { FNR.user.profile.getData([{ name: forumConfig.profileUser.cronoField, type: "textarea" }]).then(t => { const e = FNR.utility.genArray(t[0].value).map((t, e) => { let n = t; return n.position = e, n }); this.content.edit = e, this.content.current = JSON.parse(JSON.stringify(e)), FNR.forum.getMembers().then(t => { this.setEntry(), this.users = t, this.state.page = 1 }) }) }, template: '\n    <section id="forum-chronology" class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Cronología</h2>\n            <hr />\n            <p>En esta página podrás editar la cronología de tu personaje. Experimenta con su funcionamiento, es bastante intuitivo.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <modal-cronologia v-if="modal.status" :data-type="modal.type" :data-element="entry"></modal-cronologia>\n            <mando-foro data-id="upper-controls" data-app="true">\n                <template slot="pagination" v-if="paginationContent.pages.length > 1">\n                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">\n                        <i class="fas fa-chevron-left"></i>\n                    </a>\n                    <template v-for="page in paginationContent.pages">\n                        <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n                        <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else @click="state.pagination = page">{{ page + 1 }}</a>\n                    </template>\n                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">\n                        <i class="fas fa-chevron-right"></i>\n                    </a>\n                </template>\n                <template slot="controls">\n                    <li @click="addEntry($event)">\n                        <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n                    </li>\n                    <li v-if="finalCheck" @click="save($event)">\n                        <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n                    </li>\n                </template>\n            </mando-foro>\n            <ul id="forum-rplist" class="no-style" :key="render">\n                <template v-if="!paginationContent.content.length">\n                    <li class="is-not-lastpost not-status">\n                        <h6>No hay entradas en tu cronología</h6>\n                    </li>\n                </template>\n                <template v-else v-for="rp in paginationContent.content">\n                    <elemento-cronologia :data-element="rp" data-type="manager" :data-id="rp.position" />\n                </template>\n            </ul>\n            <mando-foro data-id="lower-controls" data-app="true">\n                <template slot="pagination" v-if="paginationContent.pages.length > 1">\n                    <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">\n                        <i class="fas fa-chevron-left"></i>\n                    </a>\n                    <template v-for="page in paginationContent.pages">\n                        <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n                        <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else @click="state.pagination = page">{{ page + 1 }}</a>\n                    </template>\n                    <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">\n                        <i class="fas fa-chevron-right"></i>\n                    </a>\n                </template>\n                <template slot="controls">\n                    <li @click="addEntry($event)">\n                        <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n                    </li>\n                    <li v-if="finalCheck" @click="save($event)">\n                        <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n                    </li>\n                </template>\n            </mando-foro>\n        </template>\n        <template v-else-if="state.page === 2">\n            <cargando-foro data-text="Actualizando información…"></cargando-foro>\n        </template>\n    </section>\n    ' }), Vue.component("elemento-cronologia", { props: ["dataElement", "dataType", "dataId"], data() { return { content: this.dataElement } }, methods: { deleteElement() { this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.dataId), 1), 0 === this.$parent.paginationContent.content.length && 0 !== this.$parent.state.pagination && (this.$parent.state.pagination -= 1), this.$parent.forceRerender() }, editElement() { this.$parent.modal.type = "edit", this.$parent.entry = this.content, this.$parent.modal.status = !0 } }, template: '\n    <li class="rp-list">\n        <template v-if="dataType === \'manager\'">\n            <a class="rp-element rp-manager">\n                <div class="rp-icon">\n                    <template v-if="content.status === \'ropened\'">\n                        <i class="fas fa-lock-open"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rclosed\'">\n                        <i class="fas fa-lock"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rabandoned\'">\n                        <i class="fas fa-times"></i>\n                    </template>\n                </div>\n                <div class="rp-content">\n                    <div class="rp-name">\n                        <span>{{ content.name }}</span>\n                        <small>\n                            {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n                        </small>\n                    </div>\n                    <div class="rp-controls">\n                        <span @click="editElement()" title="Editar entrada">Editar</span> / <span @click="deleteElement()" title="Eliminar entrada">Eliminar</span>\n                    </div>\n                </div>\n            </a>\n        </template>\n        <template v-else-if="dataType === \'profile\'">\n            <a class="rp-element" :href="content.link" target="_blank" :title="\'Ir al tema «\' + content.name + \'»\'">\n                <div class="rp-icon">\n                    <template v-if="content.status === \'ropened\'">\n                        <i class="fas fa-lock-open"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rclosed\'">\n                        <i class="fas fa-lock"></i>\n                    </template>\n                    <template v-else-if="content.status === \'rabandoned\'">\n                        <i class="fas fa-times"></i>\n                    </template>\n                </div>\n                <div class="rp-content">\n                    <div class="rp-name">\n                        <span>{{ content.name }}</span>\n                        <small>\n                            {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n                        </small>\n                    </div>\n                </div>\n            </a>\n        </template>\n    </li>\n    ' });

package/apps/vueDefault.js

@@ -98,7 +98,7 @@ Vue.component('panel-control', {
                 </li>
             </ul>
             <div id="usereply-comand" v-if="toSave.length && validationPanel === ''">
-                <button class="button1 btn-main" v-on:click="updateProfile()" title="Actualizar perfil">Actualizar</button>
+                <button class="button1 btn-main" @click="updateProfile()" title="Actualizar perfil">Actualizar</button>
             </div>
         </template>
         <template v-if="state.page === 2">
@@ -262,7 +262,7 @@ Vue.component('editor-foro', {
                 document.selection.createRange().text = pre + document.selection.createRange().text + post;
             } else if (myField.selectionStart || myField.selectionStart == '0') {
                 const startPos = myField.selectionStart;
-                const endPos = myField.selectionEnd;
+                const endPos = myField.selectionEnd - post.length;
                 const cursorPos = endPos + pre.length + post.length;
 
                 myField.value = myField.value.substring(0, startPos) + pre + myField.value.substring(startPos, endPos) + post + myField.value.substring(endPos, myField.value.length);
@@ -824,11 +824,11 @@ Vue.component('editor-foro', {
                             <div class="character-selector">
                                 <input type="text" v-model="users.current" placeholder="Escribe el nombre de un usuario." :disabled="groups.type !== -1" />
                                 <ul class="no-style selector-list" v-if="users.selector && sortedCharacters.length > 0">
-                                    <li v-for="(character, index) in sortedCharacters" v-on:click="addCharacter(character)" :title="'Seleccionar ' + character">{{ character }}<i class="fas fa-plus"></i></li>
+                                    <li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="'Seleccionar ' + character">{{ character }}<i class="fas fa-plus"></i></li>
                                 </ul>
                             </div>
                             <ul v-if="sortedEditCharacters.length" class="no-style character-list">
-                                <li v-for="(character, index) in sortedEditCharacters" v-on:click="deleteCharacter(index)" :title="'Quitar ' + character"><i class="fas fa-times"></i> {{ character }}</li>
+                                <li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="'Quitar ' + character"><i class="fas fa-times"></i> {{ character }}</li>
                             </ul>
                         </campo-foro>
                     </li>
@@ -838,7 +838,7 @@ Vue.component('editor-foro', {
                         <li>
                             <campo-foro data-name="Grupo">
                                 <div class="select-container">
-                                    <select v-model="groups.type" v-on:change="changeGroup()" :disabled="users.selected.length !== 0">
+                                    <select v-model="groups.type" @change="changeGroup()" :disabled="users.selected.length !== 0">
                                         <option value="-1" hidden>Selecciona un grupo.</option>
                                         <option v-for="option in groups.options" :value="option.value">{{ option.name }}</option>
                                     </select>
@@ -872,22 +872,22 @@ Vue.component('editor-foro', {
                 <div id="usereply-buttons">
                     <ul class="is-hidden-mobile">
                         <li id="bold-button">
-                            <button class="usereply-button" v-on:click="insertSomething('[b]', '[/b]')" title="Negrita">
+                            <button class="usereply-button" @click="insertSomething('[b]', '[/b]')" title="Negrita">
                                 <i class="fas fa-bold"></i>
                             </button>
                         </li>
                         <li id="italic-button">
-                            <button class="usereply-button" v-on:click="insertSomething('[i]', '[/i]')" title="Cursiva">
+                            <button class="usereply-button" @click="insertSomething('[i]', '[/i]')" title="Cursiva">
                                 <i class="fas fa-italic"></i>
                             </button>
                         </li>
                         <li id="underline-button">
-                            <button class="usereply-button" v-on:click="insertSomething('[u]', '[/u]')" title="Subrayado">
+                            <button class="usereply-button" @click="insertSomething('[u]', '[/u]')" title="Subrayado">
                                 <i class="fas fa-underline"></i>
                             </button>
                         </li>
                         <li id="strike-button">
-                            <button class="usereply-button" v-on:click="insertSomething('[strike]', '[/strike]')" title="Tachado">
+                            <button class="usereply-button" @click="insertSomething('[strike]', '[/strike]')" title="Tachado">
                                 <i class="fas fa-strikethrough"></i>
                             </button>
                         </li>
@@ -902,7 +902,7 @@ Vue.component('editor-foro', {
                                 </div>
                                 <div class="dropdown-menu" role="menu">
                                     <div id="colour-list" class="dropdown-content">
-                                        <div v-for="color in colors" class="usereply-option" :style="'color:' + color.hex" v-on:click="insertSomething('[color=' + color.hex + ']', '[/color]')">{{ color.name }}</div>
+                                        <div v-for="color in colors" class="usereply-option" :style="'color:' + color.hex" @click="insertSomething('[color=' + color.hex + ']', '[/color]')">{{ color.name }}</div>
                                     </div>
                                 </div>
                             </div>
@@ -930,9 +930,9 @@ Vue.component('editor-foro', {
                                 </div>
                                 <div class="dropdown-menu" role="menu">
                                     <div id="align-list" class="dropdown-content">
-                                        <div class="usereply-option" v-on:click="insertSomething('[left]', '[/left]')">Izquierda</div>
-                                        <div class="usereply-option" v-on:click="insertSomething('[center]', '[/center]')">Centro</div>
-                                        <div class="usereply-option" v-on:click="insertSomething('[right]', '[/right]')">Derecha</div>
+                                        <div class="usereply-option" @click="insertSomething('[left]', '[/left]')">Izquierda</div>
+                                        <div class="usereply-option" @click="insertSomething('[center]', '[/center]')">Centro</div>
+                                        <div class="usereply-option" @click="insertSomething('[right]', '[/right]')">Derecha</div>
                                     </div>
                                 </div>
                             </div>
@@ -946,13 +946,13 @@ Vue.component('editor-foro', {
                                 </div>
                                 <div class="dropdown-menu" role="menu">
                                     <div id="toolbox-list" class="dropdown-content">
-                                        <div class="usereply-option" v-on:click="insertUrl()">Enlace</div>
-                                        <div class="usereply-option" v-on:click="insertImg()">Imagen</div>
-                                        <div class="usereply-option" v-on:click="insertSpoiler()">Spoiler</div>
-                                        <div class="usereply-option" v-on:click="insertSomething('[code]', '[/code]')">Code</div>
-                                        <div class="usereply-option" v-on:click="insertQuote()">Cita</div>
-                                        <div class="usereply-option" v-on:click="insertSomething('[hide]', '[/hide]')">Ocultar</div>
-                                        <div class="usereply-option" v-on:click="insertSomething('[youtube]', '[/youtube]')">Youtube</div>
+                                        <div class="usereply-option" @click="insertUrl()">Enlace</div>
+                                        <div class="usereply-option" @click="insertImg()">Imagen</div>
+                                        <div class="usereply-option" @click="insertSpoiler()">Spoiler</div>
+                                        <div class="usereply-option" @click="insertSomething('[code]', '[/code]')">Code</div>
+                                        <div class="usereply-option" @click="insertQuote()">Cita</div>
+                                        <div class="usereply-option" @click="insertSomething('[hide]', '[/hide]')">Ocultar</div>
+                                        <div class="usereply-option" @click="insertSomething('[youtube]', '[/youtube]')">Youtube</div>
                                     </div>
                                 </div>
                             </div>
@@ -962,10 +962,10 @@ Vue.component('editor-foro', {
             </div>
             <textarea id="usereply-editor" contenteditable="true" v-model="content.msg"></textarea>
             <div id="usereply-comand" v-if="!msgCheck.length">
-                <button class="button1 btn-main" v-on:click="sendMsg()">Enviar</button>
-                <button class="button1" v-on:click="draftMsg()" v-if="state.editor === 'editpostdraft'">Modificar</button>
-                <button class="button1" v-on:click="draftMsg()" v-else-if="state.editor === 'reply' && state.dice">Bosquejo</button>
-                <button class="button1" v-on:click="prevMsg()">Previsualizar</button>
+                <button class="button1 btn-main" @click="sendMsg()">Enviar</button>
+                <button class="button1" @click="draftMsg()" v-if="state.editor === 'editpostdraft'">Modificar</button>
+                <button class="button1" @click="draftMsg()" v-else-if="state.editor === 'reply' && state.dice">Bosquejo</button>
+                <button class="button1" @click="prevMsg()">Previsualizar</button>
             </div>
             <div v-if="state.editor === 'reply' && state.dice" id="usereply-dice">
                 <div class="usereply-header">
@@ -974,13 +974,13 @@ Vue.component('editor-foro', {
                 <ul>
                     <li v-for="(item, index) in dice.current">
                         <div class="select-container">
-                            <select v-model="item.dice">
+                            <select v-model="item.dice" @change="item.number = 1">
                                 <option value="-1" selected hidden>Selec. un dado</option>
                                 <option v-for="option in dice.options" :value="option.value">{{ option.content }}</option>
                             </select>
                         </div>
                         <input type="number" v-model="item.number" />
-                        <button v-on:click="newDice()" v-if="(index + 1) === dice.current.length" class="dice-more">
+                        <button @click="newDice()" v-if="(index + 1) === dice.current.length" class="dice-more">
                             <i class="fas fa-plus"></i>
                         </button>
                         <div v-else class="dice-more"></div>

package/apps/vueDefault.min.js

@@ -1,2 +1,2 @@
-Vue.component("panel-control",{props:["dataElements"],data:function(){return{userId:_userdata.user_id,state:{page:0},content:{original:[],current:[]}}},computed:{validationPanel:function(){return FNR.utility.genValidation(this.content.current)},toSave:function(){let e=[];return[].forEach.call(this.content.current,(t,o)=>{t.value!==this.content.original[o].value&&e.push({name:t.name,type:t.type,value:t.value})}),e}},methods:{updateProfile:function(){this.state.page=2,FNR.user.profile.setData(this.toSave).then(e=>{if(e){let e=!1;this.toSave.map(t=>{t.name.toLowerCase().indexOf("tema")>-1&&(e=!0)}),e?(FNR.html.genNotification("Atención","Información actualizada sin inconvenientes.","fas fa-check"),FNR.user.setTheme(!0)):(FNR.html.genNotification("Atención","Información actualizada sin inconvenientes.","fas fa-check"),setTimeout(()=>{window.location.reload()},2e3))}else FNR.html.genNotification("Atención","Hubo un problema al actualizar. Dale otro intento.","fas fa-exclamation")})}},created(){FNR.user.profile.getData(JSON.parse(this.dataElements.replace(/'/g,'"'))).then(e=>{this.content.original=JSON.parse(JSON.stringify(e)),this.content.current=e,this.state.page=1})},template:'\n    <section id="forum-cp" class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Editar perfil</h2>\n            <hr />\n            <p>En esta página podrás editar tu perfil de usuario. En caso de que quieras editar tu contraseña, por favor dirígete a <a target="_blank" title="Ir a «Cambiar contraseña»" :href="\'/profile?change_password=Cambiar+tu+contraseña&mode=editprofile&page_profil=informations&user_id=\' + userId">este enlace</a>.</p>\n            <p>Si estás experimentando problemas con el foro, pulsa <a title="Reiniciar cache" onclick="localStorage.clear(); window.location.replace(\'/\')">este otro</a>. Puede que los solucione.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <aviso-foro v-show="validationPanel !== \'\'">\n                <ul v-html="validationPanel"></ul>\n            </aviso-foro>\n            <ul class="forum-fieldlist no-style">\n                <li v-for="item in content.current">\n                    <campo-foro :data-name="item.name">\n                        <input v-model="item.value" v-if="item.type === \'input\' || item.type === \'avatar\'" type="text"/>\n                        <textarea v-model="item.value" v-else-if="item.type === \'textarea\'"></textarea>\n                        <div v-else-if="item.type === \'select\'" class="select-container">\n                            <select v-model="item.value">\n                                <option :value="option.value" v-for="option in item.options">{{ option.name }}</option>\n                            </select>\n                        </div>\n                    </campo-foro>\n                </li>\n            </ul>\n            <div id="usereply-comand" v-if="toSave.length && validationPanel === \'\'">\n                <button class="button1 btn-main" v-on:click="updateProfile()" title="Actualizar perfil">Actualizar</button>\n            </div>\n        </template>\n        <template v-if="state.page === 2">\n            <cargando-foro data-text="Actualizando información…"></cargando-foro>\n        </template>\n    </section>\n    '}),Vue.component("lista-bosquejos",{data:function(){return{state:{page:0},content:{drafts:[]}}},created(){FNR.user.profile.getDrafts().then(e=>{this.state.page=1,this.content.drafts=e})},template:'\n    <section class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Lista de bosquejos</h2>\n            <hr />\n            <p>En esta página tienes tu lista de tus bosquejos. No es una lista completa, tan solo muestra la primera página. Si deseas ver más bosquejos, aligera la lista publicándolos.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <section id="forum-drafts" class="forum-topiclist">\n                <lista-temas-cabecera data-elements="[\'Tema\', \'Información\']"></lista-temas-cabecera>\n                <ul class="topiclist-topics no-style">\n                    <template v-if="content.drafts === false">\n                        <li class="is-not-lastpost not-status">\n                            <h6>No tienes bosquejos guardados</h6>\n                        </li>\n                    </template>\n                    <template v-else>\n                        <li class="row is-not-lastpost not-status" v-for="draft in content.drafts">\n                            <temas-foro data-type="draft" data-mode="" :data-url="draft.topic.url" :data-replies="draft.info.location" :data-views="draft.info.date" :data-quick="draft.modify">\n                                <template slot="title">{{ draft.topic.name }}</template>\n                            </temas-foro>\n                        </li>\n                    </template>\n                </ul>\n            </section>\n        </template>\n    </section>\n    '}),Vue.component("editor-foro",{data:function(){return{state:{page:0,editor:"none",admin:1===_userdata.user_level,guest:0===_userdata.session_logged_in,dice:document.querySelectorAll("#list_dice").length},colors:FNR.forum.getColors(),content:{username:"",subject:"",msg:"",type:-1,options:[]},users:{current:"",options:[],selected:[],selector:!0},groups:{type:-1,options:[]},dice:{options:[],current:[]}}},computed:{msgCheck:function(){let e="";return this.state.guest&&(this.content.username.trim().length<4||this.content.username.trim().length>60)&&(e+="<li>Escribe un nombre de usuario de tamaño adecuado.</li>"),"post"===this.state.editor&&0===this.users.selected.length&&-1===this.groups.type&&(e+="<li>Selecciona al menos un usuario.</li>"),this.state.admin&&"post"===this.state.editor&&0===this.users.selected.length&&-1===this.groups.type&&(e+="<li>Selecciona un grupo.</li>"),"newtopic"!==this.state.editor&&"post"!==this.state.editor||(this.content.subject.trim().length<4||this.content.subject.trim().length>60)&&(e+="<li>Escribe un titulo de tamaño adecuado.</li>"),this.content.msg.trim().length<10&&(e+="<li>Escribe un mensaje lo suficientemente largo.</li>"),e},sortedCharacters:function(){return Object.keys(this.users.options).length?this.users.options.map(e=>e.user).filter(e=>-1===this.users.selected.indexOf(e)).filter(e=>e.toLowerCase().indexOf(this.users.current.toLowerCase())>-1).sort((e,t)=>e<t?-1:e>t?1:0):[]},sortedEditCharacters:function(){return this.users.selected.sort((e,t)=>e<t?-1:e>t?1:0)}},methods:{insertSomething:function(e,t){const o=document.getElementById("usereply-editor"),n=e.replace(/-jump-/g,"\n"),i=t.replace(/-jump-/g,"\n");if(document.selection)o.focus(),document.selection.createRange().text=n+document.selection.createRange().text+i;else if(o.selectionStart||"0"==o.selectionStart){const e=o.selectionStart,t=o.selectionEnd,r=t+n.length+i.length;o.value=o.value.substring(0,e)+n+o.value.substring(e,t)+i+o.value.substring(t,o.value.length),o.setSelectionRange(r,r)}this.content.msg=o.value},newDice:function(){this.dice.current.push({dice:-1,number:0})},addCharacter:function(e){this.users.selected.push(e),this.users.selector=!1,this.users.current="",setTimeout(()=>{this.users.selector=!0},250)},deleteCharacter:function(e){this.users.current="",this.users.selected.splice(e,1)},changeGroup:function(){this.users.selected=[],this.users.current=""},insertUrl:function(){const e=document.getElementById("usereply-editor"),t=e.selectionStart,o=e.selectionEnd;FNR.html.genPrompt("Insertar enlace","Introduce el título del enlace. Por defecto, ponemos la este como título.","Título del enlace","").then(n=>{!1!==n?this.insertSomething("[url=","]"+n+"[/url]"):this.insertSomething("[url=","]"+e.value.substring(t,o)+"[/url]")})},insertImg:function(){FNR.html.genPrompt("Insertar imagen","Introduce las medidas de la imagen en píxeles pero sin la medida (por ejemplo 100x100). <u>En caso de dejarlo en blanco, se insertará con la medida inicial</u>.","Medidas de la imagen","").then(e=>{!1!==e?this.insertSomething("[img="+e+"]","[/img]"):this.insertSomething("[img]","[/img]")})},insertSpoiler:function(){FNR.html.genPrompt("Insertar spoiler","Introduce el título del spoiler. <u>En caso de dejarlo en blanco, se insertará sin él.</u>.","Título del spoiler","").then(e=>{!1!==e?this.insertSomething("[spoiler="+e+"]","[/spoiler]"):this.insertSomething("[spoiler]","[/spoiler]")})},insertQuote:function(){FNR.html.genPrompt("Insertar cita","Introduce el destinatario de la cita. <u>En caso de dejarlo en blanco, se insertará sin él.</u>.","Destinatario de la cita","").then(e=>{!1!==e?this.insertSomething("[quote="+e+"]","[/quote]"):this.insertSomething("[quote]","[/quote]")})},parseMsg:function(){window.forumParsing=!0,document.querySelector("#forum-realreply > form .sceditor-container > textarea")?document.querySelector("#forum-realreply > form .sceditor-container > textarea").value=this.content.msg.replace(/#per/g,this.colors[this.colors.length-1].hex):document.querySelector("#forum-realreply > form textarea#text_editor_textarea").value=this.content.msg.replace(/#per/g,this.colors[this.colors.length-1].hex),"reply"===this.state.editor&&(FNR.content.isAutosave()&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)&&-1!==_userdata.user_id&&FNR.cache.delData("post"+document.post.t.value+"-"+_userdata.user_id),this.state.dice&&([].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice tr"),(e,t)=>{0!==t&&e.remove()}),document.querySelector("#forum-realreply > form #list_dice tr td").insertAdjacentHTML("beforeend",'<span id="dice_to_del"></span>'),this.dice.current.filter(e=>-1!==e.dice).filter(e=>0!==parseFloat(e.number)&&!isNaN(parseFloat(e.number))).forEach(e=>{add_dice(document.querySelectorAll("#list_dice tr").length,e.dice,e.number)}))),this.state.guest&&(this.content.subject.trim().length>4||this.content.subject.trim().length<60)&&(document.querySelector('#forum-realreply > form input[name="username"]').value=this.content.username),"post"===this.state.editor&&this.users.selected.length>0&&-1===this.groups.type&&this.users.selected.forEach(e=>{document.querySelector("#forum-realreply > form #add_username").click(),document.querySelectorAll('#forum-realreply > form input[name="username[]"]')[document.querySelectorAll('#forum-realreply > form input[name="username[]"]').length-2].value=e}),this.state.admin&&("post"===this.state.editor?0===this.users.selected.length&&-1!==this.groups.type&&(document.querySelector('#forum-realreply > form select[name="usergroup"]').value=this.groups.type):"newtopic"===this.state.editor&&-1!==this.content.type&&(document.querySelector('#forum-realreply > form input[type="radio"][name="topictype"][value="'+this.content.type+'"]').checked=!0)),"newtopic"!==this.state.editor&&"post"!==this.state.editor||(this.content.subject.trim().length>4||this.content.subject.trim().length<60)&&(document.querySelector('#forum-realreply > form input[name="subject"]').value=this.content.subject.trim())},draftMsg:function(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Bosquejo"], #forum-realreply input[value="Modificar"]').click()},sendMsg:function(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Enviar"], #forum-realreply input[value="Publicar"]').click()},prevMsg:function(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Previsualización"], #forum-realreply input[value="Previsualizar"]').click()}},created(){const e=()=>{if(document.querySelector('#forum-realreply > form input[name="username"]')&&(this.content.username=document.querySelector('#forum-realreply > form input[name="username"]').value),document.querySelector("#forum-realreply > form #text_editor_textarea")){let e=document.querySelector("#forum-realreply > form #text_editor_textarea").value;this.content.msg=e}if(document.querySelector('#forum-realreply > form input[name="subject"]')){let e=document.querySelector('#forum-realreply input[name="subject"]').value;document.querySelector('#forum-realreply select[name="usergroup"]')&&""!==document.querySelector('#forum-realreply select[name="usergroup"]').value?this.groups.type=document.querySelector('#forum-realreply select[name="usergroup"]').value:document.querySelector('#forum-realreply input[name="username[]"]')&&[].forEach.call(document.querySelectorAll('#forum-realreply input[name="username[]"]'),e=>{""!==e.value&&this.users.selected.push(e.value)}),this.content.subject=e}document.querySelector("#forum-realreply > form #list_dice")&&([].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice #post_dice option"),e=>{""!==e.value&&this.dice.options.push({value:e.value,content:e.textContent})}),1===document.querySelectorAll("#forum-realreply > form #list_dice tr").length?this.dice.current.push({dice:-1,number:0}):[].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice tr"),e=>{""!==e.querySelector("select").value&&this.dice.current.push({dice:parseFloat(e.querySelector("select").value),number:parseFloat(e.querySelector("input").value)})})),4===document.querySelectorAll('#forum-realreply > form .panel.row3 input[type="radio"]').length&&[].forEach.call(document.querySelectorAll('#forum-realreply > form .panel.row3 input[type="radio"]'),e=>{this.content.options.push({value:e.value,name:e.parentElement.textContent.trim()}),e.checked&&(this.content.type=e.value)}),document.querySelector('#forum-realreply > form select[name="usergroup"]')&&[].forEach.call(document.querySelectorAll('#forum-realreply > form select[name="usergroup"] option'),e=>{""!==e.value&&this.groups.options.push({value:e.value,name:e.textContent})}),FNR.content.isAutosave()&&""===this.content.msg&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)&&-1!==_userdata.user_id&&(this.content.msg=FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)),this.state.page=1,document.onkeydown=(e=>{const t=document.getElementById("usereply-editor");document.activeElement===t&&(e.ctrlKey&&"b"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b]","[/b]")):e.ctrlKey&&"i"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[i]","[/i]")):e.ctrlKey&&"s"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[strike]","[/strike]")):e.ctrlKey&&"u"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[u]","[/u]")):e.ctrlKey&&","===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[left]","[/left]")):e.ctrlKey&&"."===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[center]","[/center]")):e.ctrlKey&&"-"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[right]","[/right]")):e.ctrlKey&&"o"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertUrl()):e.ctrlKey&&"p"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertImg()):e.ctrlKey&&"`"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSpoiler()):e.ctrlKey&&"+"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[code]","[/code]")):e.ctrlKey&&"l"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertQuote()):e.ctrlKey&&"ñ"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[hide]","[/hide]")):e.ctrlKey&&"´"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[youtube]","[/youtube]")):"Home"===e.key?(e.preventDefault(),e.stopPropagation(),t.setSelectionRange(0,0)):"End"===e.key?(e.preventDefault(),e.stopPropagation(),t.setSelectionRange(t.value.length,t.value.length)):e.ctrlKey&&"1"===e.key&&"undefined"!==this.colors[0]&&this.colors.length-1!=0?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[0].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"!"===e.key&&"undefined"!==this.colors[0]&&this.colors.length-1!=0?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[0].hex+"]","[/color][/b]")):e.ctrlKey&&"2"===e.key&&"undefined"!==this.colors[1]&&this.colors.length-1!=1?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[1].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&'"'===e.key&&"undefined"!==this.colors[1]&&this.colors.length-1!=1?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[1].hex+"]","[/color][/b]")):e.ctrlKey&&"3"===e.key&&"undefined"!==this.colors[2]&&this.colors.length-1!=2?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[2].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"·"===e.key&&"undefined"!==this.colors[2]&&this.colors.length-1!=2?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[2].hex+"]","[/color][/b]")):e.ctrlKey&&"4"===e.key&&"undefined"!==this.colors[3]&&this.colors.length-1!=3?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[3].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"$"===e.key&&"undefined"!==this.colors[3]&&this.colors.length-1!=3?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[3].hex+"]","[/color][/b]")):e.ctrlKey&&"5"===e.key&&"undefined"!==this.colors[4]&&this.colors.length-1!=4?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[4].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"%"===e.key&&"undefined"!==this.colors[4]&&this.colors.length-1!=4?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[4].hex+"]","[/color][/b]")):e.ctrlKey&&"6"===e.key&&"undefined"!==this.colors[5]&&this.colors.length-1!=5?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[5].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"&"===e.key&&"undefined"!==this.colors[5]&&this.colors.length-1!=5?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[5].hex+"]","[/color][/b]")):e.ctrlKey&&"7"===e.key&&"undefined"!==this.colors[6]&&this.colors.length-1!=6?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[6].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"/"===e.key&&"undefined"!==this.colors[6]&&this.colors.length-1!=6?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[6].hex+"]","[/color][/b]")):e.ctrlKey&&"8"===e.key&&"undefined"!==this.colors[7]&&this.colors.length-1!=7?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[7].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"("===e.key&&"undefined"!==this.colors[7]&&this.colors.length-1!=7?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[7].hex+"]","[/color][/b]")):e.ctrlKey&&"9"===e.key&&"undefined"!==this.colors[8]&&this.colors.length-1!=8?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[8].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&")"===e.key&&"undefined"!==this.colors[8]&&this.colors.length-1!=8?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[8].hex+"]","[/color][/b]")):e.ctrlKey&&"º"===e.key&&void 0!==forumConfig.skinOptions.customColour?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color=#per]","[/color]")):e.ctrlKey&&e.shiftKey&&"ª"===e.key&&void 0!==forumConfig.skinOptions.customColour?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color=#per]","[/color][/b]")):e.ctrlKey&&e.shiftKey&&"Enter"===e.key&&!this.msgCheck.length?(e.preventDefault(),e.stopPropagation(),this.prevMsg()):e.ctrlKey&&e.altKey&&"Enter"===e.key&&"reply"===this.state.editor&&this.state.dice&&!this.msgCheck.length?(e.preventDefault(),e.stopPropagation(),this.draftMsg()):e.ctrlKey&&"Enter"===e.key&&!this.msgCheck.length&&(e.preventDefault(),e.stopPropagation(),this.sendMsg()))}),setTimeout(()=>{FNR.behaviour.genDropeable()},250)},t=()=>{"post"===this.state.editor?FNR.forum.getMembers(!0).then(t=>{this.users.options=t,e()}):e()};void 0!==document.post&&("editpost"===document.post.mode.value?void 0!==document.post.modif_topic_title?this.state.editor="newtopic":this.state.editor="reply":"edit"===document.post.mode.value?this.state.editor="post":this.state.editor=document.post.mode.value),this.state.guest?setTimeout(()=>{e()},2e3):void 0===forumConfig.skinOptions.customColour?t():FNR.user.profile.getData([{name:forumConfig.skinOptions.customColour,type:"input"}]).then(e=>{this.colors.push({hex:e[0].value,name:"Personal"}),t()}),this.state.replies=document.querySelectorAll(".forum-otherposts > *").length||document.querySelector('input[type="submit"][value="Modificar"]')?"Varios":""},mounted(){insertIntoEditor=(e=>{try{this.insertSomething(" "+e+" ","")}catch(e){console&&console.error(e)}}),$("#quickEmojInternal").on("load",function(){$("#quickEmojInternal").contents().find("head").append("<style>body{padding: 1rem!important}</style>")});let e="";document.querySelector('p[style="color: red;"]')&&(e=document.querySelector('p[style="color: red;"]').textContent,"preview"===document.querySelector('p[style="color: red;"]').parentElement.parentElement.id?document.querySelector('p[style="color: red;"]').parentElement.parentElement.remove():document.querySelector('p[style="color: red;"]').remove()),window.forumParsing=!1,""!==e&&FNR.html.genNotification("Atención","Hubo un problema al enviar. Inténtalo de nuevo.","fas fa-exclamation"),FNR.content.isAutosave()&&window.addEventListener("beforeunload",()=>{!1===forumParsing&&(""===document.querySelector("#usereply-editor").value&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)||""!==document.querySelector("#usereply-editor").value)&&FNR.cache.setData("post"+document.post.t.value+"-"+_userdata.user_id,document.querySelector("#usereply-editor").value,-1)},!1)},
-template:'\n    <div id="forum-usereply">\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <aviso-foro v-show="msgCheck.length">\n                <ul v-html="msgCheck"></ul>\n            </aviso-foro>\n            <ul id="usereply-extra" class="forum-fieldlist no-style" v-if="state.editor !== \'reply\'">\n                <template v-if="state.guest">\n                    <li>\n                        <campo-foro data-name="Nombre de usuario">\n                            <input type="text" v-model="content.username" placeholder="Escribe tu nombre de usuario." />\n                        </campo-foro>\n                    </li>\n                </template>\n                <template v-if="state.editor === \'post\'">\n                    <li>\n                        <campo-foro data-name="Usuarios">\n                            <div class="character-selector">\n                                <input type="text" v-model="users.current" placeholder="Escribe el nombre de un usuario." :disabled="groups.type !== -1" />\n                                <ul class="no-style selector-list" v-if="users.selector && sortedCharacters.length > 0">\n                                    <li v-for="(character, index) in sortedCharacters" v-on:click="addCharacter(character)" :title="\'Seleccionar \' + character">{{ character }}<i class="fas fa-plus"></i></li>\n                                </ul>\n                            </div>\n                            <ul v-if="sortedEditCharacters.length" class="no-style character-list">\n                                <li v-for="(character, index) in sortedEditCharacters" v-on:click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n                            </ul>\n                        </campo-foro>\n                    </li>\n                </template>\n                <template v-if="state.admin">\n                    <template v-if="state.editor === \'post\'">\n                        <li>\n                            <campo-foro data-name="Grupo">\n                                <div class="select-container">\n                                    <select v-model="groups.type" v-on:change="changeGroup()" :disabled="users.selected.length !== 0">\n                                        <option value="-1" hidden>Selecciona un grupo.</option>\n                                        <option v-for="option in groups.options" :value="option.value">{{ option.name }}</option>\n                                    </select>\n                                </div>\n                            </campo-foro>\n                        </li>\n                    </template>\n                    <template v-else-if="state.editor === \'newtopic\' && content.type !== -1">\n                        <li>\n                            <campo-foro data-name="Tipo de tema">\n                                <div class="select-container">\n                                    <select v-model="content.type">\n                                        <option value="-1" hidden>Selecciona una opción.</option>\n                                        <option v-for="option in content.options" :value="option.value">{{ option.name }}</option>\n                                    </select>\n                                </div>\n                            </campo-foro>\n                        </li>\n                    </template>\n                </template>\n                <template v-if="state.editor === \'newtopic\' || state.editor === \'post\'">\n                    <li>\n                        <campo-foro data-name="Título">\n                            <input type="text" v-model="content.subject" placeholder="Escribe el título." />\n                        </campo-foro>\n                    </li>\n                </template>\n            </ul>\n            <div id="usereply-top" class="usereply-header">\n                <h3>Editor de texto<small>Ver guía de <a href="https://www.bbcode.org/reference.php" target="_blank">BBCode</a>.</small></h3>\n                <div id="usereply-buttons">\n                    <ul class="is-hidden-mobile">\n                        <li id="bold-button">\n                            <button class="usereply-button" v-on:click="insertSomething(\'[b]\', \'[/b]\')" title="Negrita">\n                                <i class="fas fa-bold"></i>\n                            </button>\n                        </li>\n                        <li id="italic-button">\n                            <button class="usereply-button" v-on:click="insertSomething(\'[i]\', \'[/i]\')" title="Cursiva">\n                                <i class="fas fa-italic"></i>\n                            </button>\n                        </li>\n                        <li id="underline-button">\n                            <button class="usereply-button" v-on:click="insertSomething(\'[u]\', \'[/u]\')" title="Subrayado">\n                                <i class="fas fa-underline"></i>\n                            </button>\n                        </li>\n                        <li id="strike-button">\n                            <button class="usereply-button" v-on:click="insertSomething(\'[strike]\', \'[/strike]\')" title="Tachado">\n                                <i class="fas fa-strikethrough"></i>\n                            </button>\n                        </li>\n                    </ul>\n                    <ul>\n                        <li id="colour-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Color">\n                                        <i class="fas fa-palette"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="colour-list" class="dropdown-content">\n                                        <div v-for="color in colors" class="usereply-option" :style="\'color:\' + color.hex" v-on:click="insertSomething(\'[color=\' + color.hex + \']\', \'[/color]\')">{{ color.name }}</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="emoji-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Emoticono">\n                                        <i class="fas fa-smile"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="emoji-list" class="dropdown-content">\n                                        <iframe id="quickEmojInternal" marginheight="0" marginwidth="0" name="smilies" scrolling="auto" src="/smilies?mode=smilies_frame"></iframe>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="align-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Alinear">\n                                        <i class="fas fa-align-justify"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="align-list" class="dropdown-content">\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[left]\', \'[/left]\')">Izquierda</div>\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[center]\', \'[/center]\')">Centro</div>\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[right]\', \'[/right]\')">Derecha</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="toolbox-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Otros">\n                                        <i class="fas fa-toolbox"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="toolbox-list" class="dropdown-content">\n                                        <div class="usereply-option" v-on:click="insertUrl()">Enlace</div>\n                                        <div class="usereply-option" v-on:click="insertImg()">Imagen</div>\n                                        <div class="usereply-option" v-on:click="insertSpoiler()">Spoiler</div>\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[code]\', \'[/code]\')">Code</div>\n                                        <div class="usereply-option" v-on:click="insertQuote()">Cita</div>\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[hide]\', \'[/hide]\')">Ocultar</div>\n                                        <div class="usereply-option" v-on:click="insertSomething(\'[youtube]\', \'[/youtube]\')">Youtube</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <textarea id="usereply-editor" contenteditable="true" v-model="content.msg"></textarea>\n            <div id="usereply-comand" v-if="!msgCheck.length">\n                <button class="button1 btn-main" v-on:click="sendMsg()">Enviar</button>\n                <button class="button1" v-on:click="draftMsg()" v-if="state.editor === \'editpostdraft\'">Modificar</button>\n                <button class="button1" v-on:click="draftMsg()" v-else-if="state.editor === \'reply\' && state.dice">Bosquejo</button>\n                <button class="button1" v-on:click="prevMsg()">Previsualizar</button>\n            </div>\n            <div v-if="state.editor === \'reply\' && state.dice" id="usereply-dice">\n                <div class="usereply-header">\n                    <h3>Tirar dados</h3>\n                </div>\n                <ul>\n                    <li v-for="(item, index) in dice.current">\n                        <div class="select-container">\n                            <select v-model="item.dice">\n                                <option value="-1" selected hidden>Selec. un dado</option>\n                                <option v-for="option in dice.options" :value="option.value">{{ option.content }}</option>\n                            </select>\n                        </div>\n                        <input type="number" v-model="item.number" />\n                        <button v-on:click="newDice()" v-if="(index + 1) === dice.current.length" class="dice-more">\n                            <i class="fas fa-plus"></i>\n                        </button>\n                        <div v-else class="dice-more"></div>\n                    </li>\n                </ul>\n            </div>\n        </template>\n    </div>\n    '});
+Vue.component("panel-control",{props:["dataElements"],data:()=>({userId:_userdata.user_id,state:{page:0},content:{original:[],current:[]}}),computed:{validationPanel(){return FNR.utility.genValidation(this.content.current)},toSave(){let e=[];return[].forEach.call(this.content.current,(t,o)=>{t.value!==this.content.original[o].value&&e.push({name:t.name,type:t.type,value:t.value})}),e}},methods:{updateProfile(){this.state.page=2,FNR.user.profile.setData(this.toSave).then(e=>{if(e){let e=!1;this.toSave.map(t=>{t.name.toLowerCase().indexOf("tema")>-1&&(e=!0)}),e?(FNR.html.genNotification("Atención","Información actualizada sin inconvenientes.","fas fa-check"),FNR.user.setTheme(!0)):(FNR.html.genNotification("Atención","Información actualizada sin inconvenientes.","fas fa-check"),setTimeout(()=>{window.location.reload()},2e3))}else FNR.html.genNotification("Atención","Hubo un problema al actualizar. Dale otro intento.","fas fa-exclamation")})}},created(){FNR.user.profile.getData(JSON.parse(this.dataElements.replace(/'/g,'"'))).then(e=>{this.content.original=JSON.parse(JSON.stringify(e)),this.content.current=e,this.state.page=1})},template:'\n    <section id="forum-cp" class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Editar perfil</h2>\n            <hr />\n            <p>En esta página podrás editar tu perfil de usuario. En caso de que quieras editar tu contraseña, por favor dirígete a <a target="_blank" title="Ir a «Cambiar contraseña»" :href="\'/profile?change_password=Cambiar+tu+contraseña&mode=editprofile&page_profil=informations&user_id=\' + userId">este enlace</a>.</p>\n            <p>Si estás experimentando problemas con el foro, pulsa <a title="Reiniciar cache" onclick="localStorage.clear(); window.location.replace(\'/\')">este otro</a>. Puede que los solucione.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <aviso-foro v-show="validationPanel !== \'\'">\n                <ul v-html="validationPanel"></ul>\n            </aviso-foro>\n            <ul class="forum-fieldlist no-style">\n                <li v-for="item in content.current">\n                    <campo-foro :data-name="item.name">\n                        <input v-model="item.value" v-if="item.type === \'input\' || item.type === \'avatar\'" type="text"/>\n                        <textarea v-model="item.value" v-else-if="item.type === \'textarea\'"></textarea>\n                        <div v-else-if="item.type === \'select\'" class="select-container">\n                            <select v-model="item.value">\n                                <option :value="option.value" v-for="option in item.options">{{ option.name }}</option>\n                            </select>\n                        </div>\n                    </campo-foro>\n                </li>\n            </ul>\n            <div id="usereply-comand" v-if="toSave.length && validationPanel === \'\'">\n                <button class="button1 btn-main" @click="updateProfile()" title="Actualizar perfil">Actualizar</button>\n            </div>\n        </template>\n        <template v-if="state.page === 2">\n            <cargando-foro data-text="Actualizando información…"></cargando-foro>\n        </template>\n    </section>\n    '}),Vue.component("lista-bosquejos",{data:()=>({state:{page:0},content:{drafts:[]}}),created(){FNR.user.profile.getDrafts().then(e=>{this.state.page=1,this.content.drafts=e})},template:'\n    <section class="wiki-content is-dramatic">\n        <div class="is-content">\n            <h2>Lista de bosquejos</h2>\n            <hr />\n            <p>En esta página tienes tu lista de tus bosquejos. No es una lista completa, tan solo muestra la primera página. Si deseas ver más bosquejos, aligera la lista publicándolos.</p>\n        </div>\n        <separador-foro />\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <section id="forum-drafts" class="forum-topiclist">\n                <lista-temas-cabecera data-elements="[\'Tema\', \'Información\']"></lista-temas-cabecera>\n                <ul class="topiclist-topics no-style">\n                    <template v-if="content.drafts === false">\n                        <li class="is-not-lastpost not-status">\n                            <h6>No tienes bosquejos guardados</h6>\n                        </li>\n                    </template>\n                    <template v-else>\n                        <li class="row is-not-lastpost not-status" v-for="draft in content.drafts">\n                            <temas-foro data-type="draft" data-mode="" :data-url="draft.topic.url" :data-replies="draft.info.location" :data-views="draft.info.date" :data-quick="draft.modify">\n                                <template slot="title">{{ draft.topic.name }}</template>\n                            </temas-foro>\n                        </li>\n                    </template>\n                </ul>\n            </section>\n        </template>\n    </section>\n    '}),Vue.component("editor-foro",{data:()=>({state:{page:0,editor:"none",admin:1===_userdata.user_level,guest:0===_userdata.session_logged_in,dice:document.querySelectorAll("#list_dice").length},colors:FNR.forum.getColors(),content:{username:"",subject:"",msg:"",type:-1,options:[]},users:{current:"",options:[],selected:[],selector:!0},groups:{type:-1,options:[]},dice:{options:[],current:[]}}),computed:{msgCheck(){let e="";return this.state.guest&&(this.content.username.trim().length<4||this.content.username.trim().length>60)&&(e+="<li>Escribe un nombre de usuario de tamaño adecuado.</li>"),"post"===this.state.editor&&0===this.users.selected.length&&-1===this.groups.type&&(e+="<li>Selecciona al menos un usuario.</li>"),this.state.admin&&"post"===this.state.editor&&0===this.users.selected.length&&-1===this.groups.type&&(e+="<li>Selecciona un grupo.</li>"),"newtopic"!==this.state.editor&&"post"!==this.state.editor||(this.content.subject.trim().length<4||this.content.subject.trim().length>60)&&(e+="<li>Escribe un titulo de tamaño adecuado.</li>"),this.content.msg.trim().length<10&&(e+="<li>Escribe un mensaje lo suficientemente largo.</li>"),e},sortedCharacters(){return Object.keys(this.users.options).length?this.users.options.map(e=>e.user).filter(e=>-1===this.users.selected.indexOf(e)).filter(e=>e.toLowerCase().indexOf(this.users.current.toLowerCase())>-1).sort((e,t)=>e<t?-1:e>t?1:0):[]},sortedEditCharacters(){return this.users.selected.sort((e,t)=>e<t?-1:e>t?1:0)}},methods:{insertSomething:function(e,t){const o=document.getElementById("usereply-editor"),n=e.replace(/-jump-/g,"\n"),r=t.replace(/-jump-/g,"\n");if(document.selection)o.focus(),document.selection.createRange().text=n+document.selection.createRange().text+r;else if(o.selectionStart||"0"==o.selectionStart){const e=o.selectionStart,t=o.selectionEnd-r.length,i=t+n.length+r.length;o.value=o.value.substring(0,e)+n+o.value.substring(e,t)+r+o.value.substring(t,o.value.length),o.setSelectionRange(i,i)}this.content.msg=o.value},newDice(){this.dice.current.push({dice:-1,number:0})},addCharacter:function(e){this.users.selected.push(e),this.users.selector=!1,this.users.current="",setTimeout(()=>{this.users.selector=!0},250)},deleteCharacter:function(e){this.users.current="",this.users.selected.splice(e,1)},changeGroup(){this.users.selected=[],this.users.current=""},insertUrl(){const e=document.getElementById("usereply-editor"),t=e.selectionStart,o=e.selectionEnd;FNR.html.genPrompt("Insertar enlace","Introduce el título del enlace. Por defecto, ponemos la este como título.","Título del enlace","").then(n=>{!1!==n?this.insertSomething("[url=","]"+n+"[/url]"):this.insertSomething("[url=","]"+e.value.substring(t,o)+"[/url]")})},insertImg(){FNR.html.genPrompt("Insertar imagen","Introduce las medidas de la imagen en píxeles pero sin la medida (por ejemplo 100x100). <u>En caso de dejarlo en blanco, se insertará con la medida inicial</u>.","Medidas de la imagen","").then(e=>{!1!==e?this.insertSomething("[img="+e+"]","[/img]"):this.insertSomething("[img]","[/img]")})},insertSpoiler(){FNR.html.genPrompt("Insertar spoiler","Introduce el título del spoiler. <u>En caso de dejarlo en blanco, se insertará sin él.</u>.","Título del spoiler","").then(e=>{!1!==e?this.insertSomething("[spoiler="+e+"]","[/spoiler]"):this.insertSomething("[spoiler]","[/spoiler]")})},insertQuote(){FNR.html.genPrompt("Insertar cita","Introduce el destinatario de la cita. <u>En caso de dejarlo en blanco, se insertará sin él.</u>.","Destinatario de la cita","").then(e=>{!1!==e?this.insertSomething("[quote="+e+"]","[/quote]"):this.insertSomething("[quote]","[/quote]")})},parseMsg(){window.forumParsing=!0,document.querySelector("#forum-realreply > form .sceditor-container > textarea")?document.querySelector("#forum-realreply > form .sceditor-container > textarea").value=this.content.msg.replace(/#per/g,this.colors[this.colors.length-1].hex):document.querySelector("#forum-realreply > form textarea#text_editor_textarea").value=this.content.msg.replace(/#per/g,this.colors[this.colors.length-1].hex),"reply"===this.state.editor&&(FNR.content.isAutosave()&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)&&-1!==_userdata.user_id&&FNR.cache.delData("post"+document.post.t.value+"-"+_userdata.user_id),this.state.dice&&([].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice tr"),(e,t)=>{0!==t&&e.remove()}),document.querySelector("#forum-realreply > form #list_dice tr td").insertAdjacentHTML("beforeend",'<span id="dice_to_del"></span>'),this.dice.current.filter(e=>-1!==e.dice).filter(e=>0!==parseFloat(e.number)&&!isNaN(parseFloat(e.number))).forEach(e=>{add_dice(document.querySelectorAll("#list_dice tr").length,e.dice,e.number)}))),this.state.guest&&(this.content.subject.trim().length>4||this.content.subject.trim().length<60)&&(document.querySelector('#forum-realreply > form input[name="username"]').value=this.content.username),"post"===this.state.editor&&this.users.selected.length>0&&-1===this.groups.type&&this.users.selected.forEach(e=>{document.querySelector("#forum-realreply > form #add_username").click(),document.querySelectorAll('#forum-realreply > form input[name="username[]"]')[document.querySelectorAll('#forum-realreply > form input[name="username[]"]').length-2].value=e}),this.state.admin&&("post"===this.state.editor?0===this.users.selected.length&&-1!==this.groups.type&&(document.querySelector('#forum-realreply > form select[name="usergroup"]').value=this.groups.type):"newtopic"===this.state.editor&&-1!==this.content.type&&(document.querySelector('#forum-realreply > form input[type="radio"][name="topictype"][value="'+this.content.type+'"]').checked=!0)),"newtopic"!==this.state.editor&&"post"!==this.state.editor||(this.content.subject.trim().length>4||this.content.subject.trim().length<60)&&(document.querySelector('#forum-realreply > form input[name="subject"]').value=this.content.subject.trim())},draftMsg(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Bosquejo"], #forum-realreply input[value="Modificar"]').click()},sendMsg(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Enviar"], #forum-realreply input[value="Publicar"]').click()},prevMsg(){this.parseMsg(),document.querySelector('#forum-realreply > form input[value="Previsualización"], #forum-realreply input[value="Previsualizar"]').click()}},created(){const e=()=>{if(document.querySelector('#forum-realreply > form input[name="username"]')&&(this.content.username=document.querySelector('#forum-realreply > form input[name="username"]').value),document.querySelector("#forum-realreply > form #text_editor_textarea")){let e=document.querySelector("#forum-realreply > form #text_editor_textarea").value;this.content.msg=e}if(document.querySelector('#forum-realreply > form input[name="subject"]')){let e=document.querySelector('#forum-realreply input[name="subject"]').value;document.querySelector('#forum-realreply select[name="usergroup"]')&&""!==document.querySelector('#forum-realreply select[name="usergroup"]').value?this.groups.type=document.querySelector('#forum-realreply select[name="usergroup"]').value:document.querySelector('#forum-realreply input[name="username[]"]')&&[].forEach.call(document.querySelectorAll('#forum-realreply input[name="username[]"]'),e=>{""!==e.value&&this.users.selected.push(e.value)}),this.content.subject=e}document.querySelector("#forum-realreply > form #list_dice")&&([].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice #post_dice option"),e=>{""!==e.value&&this.dice.options.push({value:e.value,content:e.textContent})}),1===document.querySelectorAll("#forum-realreply > form #list_dice tr").length?this.dice.current.push({dice:-1,number:0}):[].forEach.call(document.querySelectorAll("#forum-realreply > form #list_dice tr"),e=>{""!==e.querySelector("select").value&&this.dice.current.push({dice:parseFloat(e.querySelector("select").value),number:parseFloat(e.querySelector("input").value)})})),4===document.querySelectorAll('#forum-realreply > form .panel.row3 input[type="radio"]').length&&[].forEach.call(document.querySelectorAll('#forum-realreply > form .panel.row3 input[type="radio"]'),e=>{this.content.options.push({value:e.value,name:e.parentElement.textContent.trim()}),e.checked&&(this.content.type=e.value)}),document.querySelector('#forum-realreply > form select[name="usergroup"]')&&[].forEach.call(document.querySelectorAll('#forum-realreply > form select[name="usergroup"] option'),e=>{""!==e.value&&this.groups.options.push({value:e.value,name:e.textContent})}),FNR.content.isAutosave()&&""===this.content.msg&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)&&-1!==_userdata.user_id&&(this.content.msg=FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)),this.state.page=1,document.onkeydown=(e=>{const t=document.getElementById("usereply-editor");document.activeElement===t&&(e.ctrlKey&&"b"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b]","[/b]")):e.ctrlKey&&"i"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[i]","[/i]")):e.ctrlKey&&"s"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[strike]","[/strike]")):e.ctrlKey&&"u"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[u]","[/u]")):e.ctrlKey&&","===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[left]","[/left]")):e.ctrlKey&&"."===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[center]","[/center]")):e.ctrlKey&&"-"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[right]","[/right]")):e.ctrlKey&&"o"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertUrl()):e.ctrlKey&&"p"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertImg()):e.ctrlKey&&"`"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSpoiler()):e.ctrlKey&&"+"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[code]","[/code]")):e.ctrlKey&&"l"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertQuote()):e.ctrlKey&&"ñ"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[hide]","[/hide]")):e.ctrlKey&&"´"===e.key?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[youtube]","[/youtube]")):"Home"===e.key?(e.preventDefault(),e.stopPropagation(),t.setSelectionRange(0,0)):"End"===e.key?(e.preventDefault(),e.stopPropagation(),t.setSelectionRange(t.value.length,t.value.length)):e.ctrlKey&&"1"===e.key&&"undefined"!==this.colors[0]&&this.colors.length-1!=0?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[0].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"!"===e.key&&"undefined"!==this.colors[0]&&this.colors.length-1!=0?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[0].hex+"]","[/color][/b]")):e.ctrlKey&&"2"===e.key&&"undefined"!==this.colors[1]&&this.colors.length-1!=1?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[1].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&'"'===e.key&&"undefined"!==this.colors[1]&&this.colors.length-1!=1?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[1].hex+"]","[/color][/b]")):e.ctrlKey&&"3"===e.key&&"undefined"!==this.colors[2]&&this.colors.length-1!=2?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[2].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"·"===e.key&&"undefined"!==this.colors[2]&&this.colors.length-1!=2?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[2].hex+"]","[/color][/b]")):e.ctrlKey&&"4"===e.key&&"undefined"!==this.colors[3]&&this.colors.length-1!=3?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[3].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"$"===e.key&&"undefined"!==this.colors[3]&&this.colors.length-1!=3?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[3].hex+"]","[/color][/b]")):e.ctrlKey&&"5"===e.key&&"undefined"!==this.colors[4]&&this.colors.length-1!=4?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[4].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"%"===e.key&&"undefined"!==this.colors[4]&&this.colors.length-1!=4?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[4].hex+"]","[/color][/b]")):e.ctrlKey&&"6"===e.key&&"undefined"!==this.colors[5]&&this.colors.length-1!=5?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[5].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"&"===e.key&&"undefined"!==this.colors[5]&&this.colors.length-1!=5?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[5].hex+"]","[/color][/b]")):e.ctrlKey&&"7"===e.key&&"undefined"!==this.colors[6]&&this.colors.length-1!=6?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[6].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"/"===e.key&&"undefined"!==this.colors[6]&&this.colors.length-1!=6?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[6].hex+"]","[/color][/b]")):e.ctrlKey&&"8"===e.key&&"undefined"!==this.colors[7]&&this.colors.length-1!=7?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[7].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&"("===e.key&&"undefined"!==this.colors[7]&&this.colors.length-1!=7?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[7].hex+"]","[/color][/b]")):e.ctrlKey&&"9"===e.key&&"undefined"!==this.colors[8]&&this.colors.length-1!=8?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color="+this.colors[8].hex+"]","[/color]")):e.ctrlKey&&e.shiftKey&&")"===e.key&&"undefined"!==this.colors[8]&&this.colors.length-1!=8?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color="+this.colors[8].hex+"]","[/color][/b]")):e.ctrlKey&&"º"===e.key&&void 0!==forumConfig.skinOptions.customColour?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[color=#per]","[/color]")):e.ctrlKey&&e.shiftKey&&"ª"===e.key&&void 0!==forumConfig.skinOptions.customColour?(e.preventDefault(),e.stopPropagation(),this.insertSomething("[b][color=#per]","[/color][/b]")):e.ctrlKey&&e.shiftKey&&"Enter"===e.key&&!this.msgCheck.length?(e.preventDefault(),e.stopPropagation(),this.prevMsg()):e.ctrlKey&&e.altKey&&"Enter"===e.key&&"reply"===this.state.editor&&this.state.dice&&!this.msgCheck.length?(e.preventDefault(),e.stopPropagation(),this.draftMsg()):e.ctrlKey&&"Enter"===e.key&&!this.msgCheck.length&&(e.preventDefault(),e.stopPropagation(),this.sendMsg()))}),setTimeout(()=>{FNR.behaviour.genDropeable()},250)},t=()=>{"post"===this.state.editor?FNR.forum.getMembers(!0).then(t=>{this.users.options=t,e()}):e()};void 0!==document.post&&("editpost"===document.post.mode.value?void 0!==document.post.modif_topic_title?this.state.editor="newtopic":this.state.editor="reply":"edit"===document.post.mode.value?this.state.editor="post":this.state.editor=document.post.mode.value),this.state.guest?setTimeout(()=>{e()},2e3):void 0===forumConfig.skinOptions.customColour?t():FNR.user.profile.getData([{name:forumConfig.skinOptions.customColour,type:"input"}]).then(e=>{this.colors.push({hex:e[0].value,name:"Personal"}),t()}),this.state.replies=document.querySelectorAll(".forum-otherposts > *").length||document.querySelector('input[type="submit"][value="Modificar"]')?"Varios":""},mounted(){insertIntoEditor=(e=>{try{this.insertSomething(" "+e+" ","")}catch(e){console&&console.error(e)}}),$("#quickEmojInternal").on("load",function(){$("#quickEmojInternal").contents().find("head").append("<style>body{padding: 1rem!important}</style>")});let e="";document.querySelector('p[style="color: red;"]')&&(e=document.querySelector('p[style="color: red;"]').textContent,"preview"===document.querySelector('p[style="color: red;"]').parentElement.parentElement.id?document.querySelector('p[style="color: red;"]').parentElement.parentElement.remove():document.querySelector('p[style="color: red;"]').remove()),window.forumParsing=!1,""!==e&&FNR.html.genNotification("Atención","Hubo un problema al enviar. Inténtalo de nuevo.","fas fa-exclamation"),FNR.content.isAutosave()&&window.addEventListener("beforeunload",()=>{!1===forumParsing&&(""===document.querySelector("#usereply-editor").value&&!1!==FNR.cache.getData("post"+document.post.t.value+"-"+_userdata.user_id)||""!==document.querySelector("#usereply-editor").value)&&FNR.cache.setData("post"+document.post.t.value+"-"+_userdata.user_id,document.querySelector("#usereply-editor").value,-1)},!1)},
+template:'\n    <div id="forum-usereply">\n        <template v-if="state.page === 0">\n            <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n        </template>\n        <template v-else-if="state.page === 1">\n            <aviso-foro v-show="msgCheck.length">\n                <ul v-html="msgCheck"></ul>\n            </aviso-foro>\n            <ul id="usereply-extra" class="forum-fieldlist no-style" v-if="state.editor !== \'reply\'">\n                <template v-if="state.guest">\n                    <li>\n                        <campo-foro data-name="Nombre de usuario">\n                            <input type="text" v-model="content.username" placeholder="Escribe tu nombre de usuario." />\n                        </campo-foro>\n                    </li>\n                </template>\n                <template v-if="state.editor === \'post\'">\n                    <li>\n                        <campo-foro data-name="Usuarios">\n                            <div class="character-selector">\n                                <input type="text" v-model="users.current" placeholder="Escribe el nombre de un usuario." :disabled="groups.type !== -1" />\n                                <ul class="no-style selector-list" v-if="users.selector && sortedCharacters.length > 0">\n                                    <li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="\'Seleccionar \' + character">{{ character }}<i class="fas fa-plus"></i></li>\n                                </ul>\n                            </div>\n                            <ul v-if="sortedEditCharacters.length" class="no-style character-list">\n                                <li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n                            </ul>\n                        </campo-foro>\n                    </li>\n                </template>\n                <template v-if="state.admin">\n                    <template v-if="state.editor === \'post\'">\n                        <li>\n                            <campo-foro data-name="Grupo">\n                                <div class="select-container">\n                                    <select v-model="groups.type" @change="changeGroup()" :disabled="users.selected.length !== 0">\n                                        <option value="-1" hidden>Selecciona un grupo.</option>\n                                        <option v-for="option in groups.options" :value="option.value">{{ option.name }}</option>\n                                    </select>\n                                </div>\n                            </campo-foro>\n                        </li>\n                    </template>\n                    <template v-else-if="state.editor === \'newtopic\' && content.type !== -1">\n                        <li>\n                            <campo-foro data-name="Tipo de tema">\n                                <div class="select-container">\n                                    <select v-model="content.type">\n                                        <option value="-1" hidden>Selecciona una opción.</option>\n                                        <option v-for="option in content.options" :value="option.value">{{ option.name }}</option>\n                                    </select>\n                                </div>\n                            </campo-foro>\n                        </li>\n                    </template>\n                </template>\n                <template v-if="state.editor === \'newtopic\' || state.editor === \'post\'">\n                    <li>\n                        <campo-foro data-name="Título">\n                            <input type="text" v-model="content.subject" placeholder="Escribe el título." />\n                        </campo-foro>\n                    </li>\n                </template>\n            </ul>\n            <div id="usereply-top" class="usereply-header">\n                <h3>Editor de texto<small>Ver guía de <a href="https://www.bbcode.org/reference.php" target="_blank">BBCode</a>.</small></h3>\n                <div id="usereply-buttons">\n                    <ul class="is-hidden-mobile">\n                        <li id="bold-button">\n                            <button class="usereply-button" @click="insertSomething(\'[b]\', \'[/b]\')" title="Negrita">\n                                <i class="fas fa-bold"></i>\n                            </button>\n                        </li>\n                        <li id="italic-button">\n                            <button class="usereply-button" @click="insertSomething(\'[i]\', \'[/i]\')" title="Cursiva">\n                                <i class="fas fa-italic"></i>\n                            </button>\n                        </li>\n                        <li id="underline-button">\n                            <button class="usereply-button" @click="insertSomething(\'[u]\', \'[/u]\')" title="Subrayado">\n                                <i class="fas fa-underline"></i>\n                            </button>\n                        </li>\n                        <li id="strike-button">\n                            <button class="usereply-button" @click="insertSomething(\'[strike]\', \'[/strike]\')" title="Tachado">\n                                <i class="fas fa-strikethrough"></i>\n                            </button>\n                        </li>\n                    </ul>\n                    <ul>\n                        <li id="colour-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Color">\n                                        <i class="fas fa-palette"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="colour-list" class="dropdown-content">\n                                        <div v-for="color in colors" class="usereply-option" :style="\'color:\' + color.hex" @click="insertSomething(\'[color=\' + color.hex + \']\', \'[/color]\')">{{ color.name }}</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="emoji-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Emoticono">\n                                        <i class="fas fa-smile"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="emoji-list" class="dropdown-content">\n                                        <iframe id="quickEmojInternal" marginheight="0" marginwidth="0" name="smilies" scrolling="auto" src="/smilies?mode=smilies_frame"></iframe>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="align-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Alinear">\n                                        <i class="fas fa-align-justify"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="align-list" class="dropdown-content">\n                                        <div class="usereply-option" @click="insertSomething(\'[left]\', \'[/left]\')">Izquierda</div>\n                                        <div class="usereply-option" @click="insertSomething(\'[center]\', \'[/center]\')">Centro</div>\n                                        <div class="usereply-option" @click="insertSomething(\'[right]\', \'[/right]\')">Derecha</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                        <li id="toolbox-button">\n                            <div class="dropdown upper-controls is-dropeable is-right">\n                                <div class="dropdown-trigger">\n                                    <button class="usereply-button" title="Otros">\n                                        <i class="fas fa-toolbox"></i>\n                                    </button>\n                                </div>\n                                <div class="dropdown-menu" role="menu">\n                                    <div id="toolbox-list" class="dropdown-content">\n                                        <div class="usereply-option" @click="insertUrl()">Enlace</div>\n                                        <div class="usereply-option" @click="insertImg()">Imagen</div>\n                                        <div class="usereply-option" @click="insertSpoiler()">Spoiler</div>\n                                        <div class="usereply-option" @click="insertSomething(\'[code]\', \'[/code]\')">Code</div>\n                                        <div class="usereply-option" @click="insertQuote()">Cita</div>\n                                        <div class="usereply-option" @click="insertSomething(\'[hide]\', \'[/hide]\')">Ocultar</div>\n                                        <div class="usereply-option" @click="insertSomething(\'[youtube]\', \'[/youtube]\')">Youtube</div>\n                                    </div>\n                                </div>\n                            </div>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <textarea id="usereply-editor" contenteditable="true" v-model="content.msg"></textarea>\n            <div id="usereply-comand" v-if="!msgCheck.length">\n                <button class="button1 btn-main" @click="sendMsg()">Enviar</button>\n                <button class="button1" @click="draftMsg()" v-if="state.editor === \'editpostdraft\'">Modificar</button>\n                <button class="button1" @click="draftMsg()" v-else-if="state.editor === \'reply\' && state.dice">Bosquejo</button>\n                <button class="button1" @click="prevMsg()">Previsualizar</button>\n            </div>\n            <div v-if="state.editor === \'reply\' && state.dice" id="usereply-dice">\n                <div class="usereply-header">\n                    <h3>Tirar dados</h3>\n                </div>\n                <ul>\n                    <li v-for="(item, index) in dice.current">\n                        <div class="select-container">\n                            <select v-model="item.dice" @change="item.number = 1">\n                                <option value="-1" selected hidden>Selec. un dado</option>\n                                <option v-for="option in dice.options" :value="option.value">{{ option.content }}</option>\n                            </select>\n                        </div>\n                        <input type="number" v-model="item.number" />\n                        <button @click="newDice()" v-if="(index + 1) === dice.current.length" class="dice-more">\n                            <i class="fas fa-plus"></i>\n                        </button>\n                        <div v-else class="dice-more"></div>\n                    </li>\n                </ul>\n            </div>\n        </template>\n    </div>\n    '});