Adicionar texto antes da lista de botões

2 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Adicionar texto antes da lista de botões

Mensagem por JR_Junior 11.10.17 14:37

Detalhes da questão


Endereço do fórum: http://darkstreetrpg.forumeiros.com
Versão do fórum: phpBB3

Descrição


Olá!
Tenho um script que adiciona botões de Resolvido, Em Curso, Aceito, etc, que aparecem em lista horizontal no tópico.

Gostaria que antes da lista de botões, na mesma linha, eu possa add qualquer texto, por exemplo:

Marcar tópico como: [Resolvido] [Em Curso] [Recusado]

Código do script:
Código:

/*globals jQuery, FA*/
       
        /**
        * Alterar o ícone do tópico com AJAX.
        *
        * @author Luiz
        * @version 1.2
        * @licence MIT
        */
       
        (function ($) {
          'use strict';
   
          var config = [/*onlyForAdmin: true*/
            { name: 'Resolvido', id  : 1, background: '#80c25e', onlyForMod: true },
            { name: 'Em Curso', id  : 3, background: '#ecb840', onlyForMod: true },
            { name: 'Aceito', id  : 2, background: '#6c65a2', onlyForMod: true },
            { name: 'Recusado', id  : 6, background: '#cc43a7', onlyForMod: true },
            { name: 'Único', id  : 4, background: '#9256b2', onlyForMod: true },
            { name: 'Importante', id: 5, background: '#e34b3c', onlyForMod: true }
          ];
       
          window.FA = window.FA || {};
          FA.Topic = FA.Topic || {};
       
          var MarkIcon;
          FA.Topic.MarkIcon = MarkIcon = function (config) {
            var self = this;
       
            self.userConfig = config;
            self.defaults = {
              name: undefined,
              id: undefined,
              background: undefined,
              onlyForMod: false,
              onlyForAdmin: false
            };
           
            self.config = $.extend({}, self.defaults, self.userConfig);
       
            $.each(self.config, function (key, value) {
              if (key === undefined) {
                throw new Error ('Não foi especificado um: ' + key + ' para o script de botões.');
              }
       
              if (value === undefined) {
                throw new Error ('Não foi especificado um valor: ' + value + ' para o script de botões.');
              }
            });
          };
       
          MarkIcon.prototype.init = function () {
            var self = this;
       
            var $post = $('.post:first');
            var $link = $post.find('a[href$="mode=editpost"]');
       
            if (!$link.length) {
              return false;
            }
       
            if (this.config.onlyForMod && (_userdata.user_level !== 1 && _userdata.user_level !== 2)) {
              return false;
            }
       
            if (this.config.onlyForAdmin && _userdata.user_level !== 1) {
              return false;
            }
       
            self.messageLink = $link.attr('href');
       
            self.$button = $('<button>', {
              'class'  : 'fa-mark-icon-button',
              'data-id': self.config.id,
              'text'  : self.config.name
            });
       
            self.$button
              .css('background-color', self.config.background)
              .on('click', function (event) {
                event.preventDefault();
       
                self.runAjax();
              })
              .insertBefore($post)
            ;
       
            self.appendStyles();
          };
       
          MarkIcon.prototype.runAjax = function () {
            var self = this;
       
            self.changeText('<i class="fa fa-refresh fa-spin"></i> Marcando...');
       
            $.get(self.messageLink)
              .done(function (context) {
                var $form = $('form[action="/post"]', context);
       
                var encode  = document.charset.toLowerCase() === 'utf-8' ? window.encodeURIComponent : window.escape;
       
                var formData = $form.serializeArray();
       
                var data = {};
                $.each(formData, function () {
                  var obj = this;
       
                  data[obj.name] = obj.value;
                });
       
                data.post_icon = self.config.id;
                data.post = 1;
       
                var encoded = $.map(data, function (value, key) {
                  return key + '=' + encode(value);
                }).join('&');
       
                $.post(self.messageLink, encoded)
                  .done(self.changeText('<i class="fa fa-check"></i> Marcado!'))
                  .fail(self.error)
                ;
              })
              .fail(self.error)
            ;
          };
       
          MarkIcon.prototype.changeText = function (text) {
            var self = this;
       
            self.runAjax = function () {
              return false;
            };
       
            self.$button
              .html(text)
              .prop('disabled', true)
            ;
          };
       
          MarkIcon.prototype.error = function () {
            var self = this;
       
            alert([
              'Houve um erro ao marcar o tópico como "' + self.config.name + '".',
              'Por favor, contate o suporte técnico.'
            ].join('\n'));
          };
       
          MarkIcon.prototype.appendStyles = function () {
            $('<style>', {
              'text': [
                '.fa-mark-icon-button {',
                '  padding: 2px 5px 4px 5px;',
                '  padding-top: 2px;',
                '  padding-right: 5px;',
                '  padding-bottom: 4px;',
                '  padding-left: 5px;',
                '  border: none;',
                '  color: #fff;',
                '  margin: 0px 0 5px 4px;',
                '  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);',
                '  border-radius: 5px;',
                '  cursor: pointer;',
                '}'
              ].join('\n')
            }).appendTo('head');
          };
       
          $(function () {
            $.each(config, function () {
              var self = this;
       
              (new FA.Topic.MarkIcon(self)).init();
            });
          });
        }(jQuery));
JR_Junior

JR_Junior
*

Membro desde : 10/05/2012
Mensagens : 46
Pontos : 74

http://darkstreet-server.livreforum.com

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por Luiz 11.10.17 18:12

Leia:
-> https://ajuda.forumeiros.com/t46956-tutorial-sistema-de-prefixos

Note que as imagens do FDF devem ser exclusivas para este fórum:
-> http://prntscr.com/gw5rdr

o/
Luiz

Luiz
Membro Entusiasta
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por JR_Junior 11.10.17 18:22

Luiz escreveu:Leia:
-> https://ajuda.forumeiros.com/t46956-tutorial-sistema-de-prefixos

Note que as imagens do FDF devem ser exclusivas para este fórum:
-> http://prntscr.com/gw5rdr

o/

Não mano, não é isso! É um script que você mesmo arrumou pra mim!
Aquele que add os botões Resolvido, Em Curso, etc:
Adicionar - Adicionar texto antes da lista de botões VXeMozVHSXCNKwKm23pj2A

O que eu quero é que antes do primeiro botão(Resolvido) eu possa add o texto: Marcar tópico como:
JR_Junior

JR_Junior
*

Membro desde : 10/05/2012
Mensagens : 46
Pontos : 74

http://darkstreet-server.livreforum.com

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por Luiz 11.10.17 18:24

Eu precisarei que o senhor libere a visualização de ao menos um dos botões para os membros sem poderes moderativos.
Não se esqueça também de modificar as imagens dos ícones. o/
Luiz

Luiz
Membro Entusiasta
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por JR_Junior 11.10.17 18:29

Luiz escreveu:Eu precisarei que o senhor libere a visualização de ao menos um dos botões para os membros sem poderes moderativos.
Não se esqueça também de modificar as imagens dos ícones. o/

Feito! Botão Resolvido liberado!

Conta: Tester
Senha: @Testes

OBS: As imagens do ícones são temporárias, logo estarei criando outras personalizadas!
JR_Junior

JR_Junior
*

Membro desde : 10/05/2012
Mensagens : 46
Pontos : 74

http://darkstreet-server.livreforum.com

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por Luiz 11.10.17 18:35

Troque o script por este:
Código:
/*globals jQuery, FA*/
       
        /**
        * Alterar o ícone do tópico com AJAX.
        *
        * @author Luiz
        * @version 1.2
        * @licence MIT
        */
       
        (function ($) {
          'use strict';
   
          var config = [/*onlyForAdmin: true*/
            { name: 'Resolvido', id  : 1, background: '#80c25e', onlyForMod: true },
            { name: 'Em Curso', id  : 3, background: '#ecb840', onlyForMod: true },
            { name: 'Aceito', id  : 2, background: '#6c65a2', onlyForMod: true },
            { name: 'Recusado', id  : 6, background: '#cc43a7', onlyForMod: true },
            { name: 'Único', id  : 4, background: '#9256b2', onlyForMod: true },
            { name: 'Importante', id: 5, background: '#e34b3c', onlyForMod: true }
          ];
       
          window.FA = window.FA || {};
          FA.Topic = FA.Topic || {};
       
          var MarkIcon;
          FA.Topic.MarkIcon = MarkIcon = function (config) {
            var self = this;
       
            self.userConfig = config;
            self.defaults = {
              name: undefined,
              id: undefined,
              background: undefined,
              onlyForMod: false,
              onlyForAdmin: false
            };
           
            self.config = $.extend({}, self.defaults, self.userConfig);
       
            $.each(self.config, function (key, value) {
              if (key === undefined) {
                throw new Error ('Não foi especificado um: ' + key + ' para o script de botões.');
              }
       
              if (value === undefined) {
                throw new Error ('Não foi especificado um valor: ' + value + ' para o script de botões.');
              }
            });
          };
       
          MarkIcon.prototype.init = function () {
            var self = this;
       
            var $post = $('.post:first');
            var $link = $post.find('a[href$="mode=editpost"]');
       
            if (!$link.length) {
              return false;
            }
       
            if (this.config.onlyForMod && (_userdata.user_level !== 1 && _userdata.user_level !== 2)) {
              return false;
            }
       
            if (this.config.onlyForAdmin && _userdata.user_level !== 1) {
              return false;
            }
       
            self.messageLink = $link.attr('href');
       
            self.$button = $('<button>', {
              'class'  : 'fa-mark-icon-button',
              'data-id': self.config.id,
              'text'  : self.config.name
            });
       
            self.$button
              .css('background-color', self.config.background)
              .on('click', function (event) {
                event.preventDefault();
       
                self.runAjax();
              })
              .insertBefore($post)
            ;
       
            self.appendStyles();
          };
       
          MarkIcon.prototype.runAjax = function () {
            var self = this;
       
            self.changeText('<i class="fa fa-refresh fa-spin"></i> Marcando...');
       
            $.get(self.messageLink)
              .done(function (context) {
                var $form = $('form[action="/post"]', context);
       
                var encode  = document.charset.toLowerCase() === 'utf-8' ? window.encodeURIComponent : window.escape;
       
                var formData = $form.serializeArray();
       
                var data = {};
                $.each(formData, function () {
                  var obj = this;
       
                  data[obj.name] = obj.value;
                });
       
                data.post_icon = self.config.id;
                data.post = 1;
       
                var encoded = $.map(data, function (value, key) {
                  return key + '=' + encode(value);
                }).join('&');
       
                $.post(self.messageLink, encoded)
                  .done(self.changeText('<i class="fa fa-check"></i> Marcado!'))
                  .fail(self.error)
                ;
              })
              .fail(self.error)
            ;
          };
       
          MarkIcon.prototype.changeText = function (text) {
            var self = this;
       
            self.runAjax = function () {
              return false;
            };
       
            self.$button
              .html(text)
              .prop('disabled', true)
            ;
          };
       
          MarkIcon.prototype.error = function () {
            var self = this;
       
            alert([
              'Houve um erro ao marcar o tópico como "' + self.config.name + '".',
              'Por favor, contate o suporte técnico.'
            ].join('\n'));
          };
       
          MarkIcon.prototype.appendStyles = function () {
            $('<style>', {
              'text': [
                '.fa-mark-icon-button {',
                '  padding: 2px 5px 4px 5px;',
                '  padding-top: 2px;',
                '  padding-right: 5px;',
                '  padding-bottom: 4px;',
                '  padding-left: 5px;',
                '  border: none;',
                '  color: #fff;',
                '  margin: 0px 0 5px 4px;',
                '  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);',
                '  border-radius: 5px;',
                '  cursor: pointer;',
                '}'
              ].join('\n')
            }).appendTo('head');
          };
       
          $(function () {
            $.each(config, function () {
              var self = this;
       
              (new FA.Topic.MarkIcon(self)).init();
            });

            $('.fa-mark-icon-button:first').before($('<strong>', {
               'text': 'Marcar tópico como : '
            }));
          });
        }(jQuery));
Luiz

Luiz
Membro Entusiasta
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por JR_Junior 11.10.17 20:12

Perfeito! Muito obrigado!!!! OK
JR_Junior

JR_Junior
*

Membro desde : 10/05/2012
Mensagens : 46
Pontos : 74

http://darkstreet-server.livreforum.com

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Adicionar texto antes da lista de botões

Mensagem por Luiz 11.10.17 20:15

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
Luiz

Luiz
Membro Entusiasta
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos