[AddOn] Criar botão no editor com lista de comandos

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

  • 0

[AddOn] Criar botão no editor com lista de comandos

Mensagem por Daemon em 03/06/15, 12:55 pm


Criar botão no editor com lista de comandos
Este código irá criar um botão no editor, e uma lista de comandos para tags bbcode.
Características e aplicação
Criador: @Daemon
Versão: 1.0
Versão: Todas as versões
Resultado da aplicação
Local de instalação
A instalação é única, e pode ser feita apenas criando um novo javascript. Para isso, acesse Painel de Controle ->> Módulos >> HTML e Javascript >> Gestão dos códigos Javascript >> Criar um novo javascript >> Investimento >> Em todas as páginas.
Código:
$(function() {
  if (!$.sceditor) return;

  $.sceditor.command.set('cmd', {

  dropDown : function(editor, caller, callback) {

    // Adicione abaixo as tags que farão parte da sua lista de comandos, separando-as por vírgula

    var items = ['sucesso', 'alerta', 'aviso'];

    var content = $(
    '<div>' +
    '  <div>' +
    '    <label>Selecione uma tag</label>' +
    '    <select></select>' +
    '  </div>' +
    '  <div>' +
    '    <label>Título (opcional)</label>' +
    '    <input type="text" id="cmdValue" value="" />' +
    '  </div>' +
    '  <div>' +
    '    <input type="button" class="button" value="Inserir">' +
    '  </div>' +
    '</div>'
    );
            $.each(items, function(key, val) {
                  content.find('select').append('<option class="sceditor-cmd-option" value="' + val + '">' + val + '</option>');
            });
            content.find('.button').click(function(e) {
                callback(content.find('select').val());
                editor.closeDropDown(true);
            });
            editor.createDropDown(caller, "cmd", content);
  },
  // WYSIWYG MODE
  exec : function(caller) {
  var editor = this;
      $.sceditor.command.get('cmd').dropDown(editor, caller, function(cmd) {
        var before = '[' + cmd + ']', end = '[/' + cmd + ']', title = $('#cmdValue').val();
        if(title !== '') {
            before = '[' + cmd + '="' + title + '"]';
            editor.wysiwygEditorInsertHtml(before, end);
        }
      });
  },
  // SOURCE MODE
  txtExec : function(caller) {
  var editor = this;
      $.sceditor.command.get('cmd').dropDown(editor, caller, function(cmd) {
        var title = $('#cmdValue').val();
        if(title) {
            editor.insertText('[' + cmd + '="' + title + '"]','[/' + cmd + ']');
        } else {
            editor.insertText('[' + cmd + ']','[/' + cmd + ']');
        }
      });
  }, tooltip: "Lista de comandos"});
 
  toolbar = toolbar.replace(/quote/,'cmd,quote');

  $('head').append(
  '<style type="text/css">' +
  '.sceditor-button-cmd div {' +
  '  background:url(https://cdn2.iconfinder.com/data/icons/snipicons/500/th-list-16.png) !important}' +
  '  .sceditor-cmd {' +
  '  width:auto;' +
  '  height:auto;' +
  '  overflow-y:auto;' +
  '}' +
  '.sceditor-cmd select {' +
  '  margin: 0 0 .75em;' +
  '}' +
  '</style>'
  );
});

Importante: Leia a notação dentro do código
avatar

Daemon
Membro do Fórum

Masculino
Inscrito dia : 01/03/2012
Mensagens : 1096
Pontos Ativos : 1688

Ver perfil do usuário http://bestskins.forumeiros.com/

Re: [AddOn] Criar botão no editor com lista de comandos

Mensagem por Karadruz DL em 30/10/16, 12:27 am

Revivendo o tópico porque sim ( e porque ninguém comentou nada também ). Achei isso uma excelente ideia, mas estou com uma duvida, este plugin faz conjunto com este http://ajuda.forumeiros.com/t99723-plugin-criar-tags-bbcode , ou são dois plugins diferentes? Só tenho essa duvida mesmo.
avatar

Karadruz DL
Nível 4

Masculino
Inscrito dia : 28/10/2016
Mensagens : 31
Pontos Ativos : 45

Ver perfil do usuário http://digimonviverpg.forumeiros.com

Re: [AddOn] Criar botão no editor com lista de comandos

Mensagem por Daemon em 31/10/16, 12:41 pm

@Karadruz DL escreveu:
Revivendo o tópico porque sim ( e porque ninguém comentou nada também ). Achei isso uma excelente ideia, mas estou com uma duvida, este plugin faz conjunto com este http://ajuda.forumeiros.com/t99723-plugin-criar-tags-bbcode , ou são dois plugins diferentes? Só tenho essa duvida mesmo.

Meio que faz sim... este aqui servirá para você criar o botão no SCEDITOR que irá mostrar a lista de BBCodes que podem ser utilizados, e que são pré-definidos por você.

O do link que você citou, irá criar estas tags BBCodes, convertendo o BBCode para HTML.
avatar

Daemon
Membro do Fórum

Masculino
Inscrito dia : 01/03/2012
Mensagens : 1096
Pontos Ativos : 1688

Ver perfil do usuário http://bestskins.forumeiros.com/

Re: [AddOn] Criar botão no editor com lista de comandos

Mensagem por Karadruz DL em 31/10/16, 01:17 pm

Sim sim, acabei de perceber isso testando no meu fórum! Gostei disso!
avatar

Karadruz DL
Nível 4

Masculino
Inscrito dia : 28/10/2016
Mensagens : 31
Pontos Ativos : 45

Ver perfil do usuário http://digimonviverpg.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum