Adicionar novo botão no SCEditor

2 participantes

Ir para baixo

Tópico resolvido Adicionar novo botão no SCEditor

Mensagem por James Watts 29.01.18 20:16

Detalhes da questão


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

Descrição


Saudação, Pessoal do FdF. Muito feliz

Neste dia, eu queria colocar uma nova opção na minha caixa de mensagem. Por esse motivo, vou apresentar através de ilustrações e comentários a forma como eu quero que seja feito. Sendo assim, vamos à questão:


Explicando por etapas

Etapa 01 - Alocar a opção, o ícone do botão [como demonstrado na figura] e quando a seta estiver sobre ele aparecer a nomeação "Símbolos".

Adicionar novo botão no SCEditor Normal11

Etapa 02 - Depois de clicado no botão, deve aparecer os símbolos e assim, o usuário poderá escolher o signo que lhe agrada para pôr na sua mensagem.


Adicionar novo botão no SCEditor Symbol11

Etapa 03 - Os signos devem está organizados de forma parecida com o botão de cores, por exemplo.

Adicionar novo botão no SCEditor C_m_d12

Materiais:

Ícone do botão

Símbolos:

Código:
C ~ ≈ ≠ ≡ ≠ ∀ ∃ ⇒ ⇔ → ƒ ↔️ ∈ ∋ℝ ℕ ℕ* ℚ ℤ ℤ* ℤ+ ℤ- Ø ¢ | | ٧ ٨ ∧ ∨ ⊂ ⊃ ∆ ∇ ∩ Ո ∪ ○ f◦g − × ± ∓­ ÷ ⊕ • · ⊙ ⊗ ◈ 丄 ⊥ 丅 ㅜ √ ∛ ∜ ∑ ∏ ⊥ ⊿ → ↑ ↓ ↕️ ← Շ ≮ ⌒ ≯ ≤ ≥ ∝ π ℮ אօ ∞ Å ■ | ∣ ∣ 4‾ ┴ ║ ij \ # № ∟ ∠ ℓ ♯ fˉ¹ ● ‰ ² ³ ¹ º ª ⁿ ⁴ ⁿˉ ༝ ⁿˉ¹ ∫ a ∝ ₁ ₂ ₃ ₄ ı ո ց ь հ զ ս օ ג ½ ¼ ¾ ½ ⅓ ⅔ ⅛ ⅜ ⅝ ⅞ $ £ ™️ ₁օօ ∴ ∵ ∷ ㋵ α β γ δ λ μ Ω ο ρ φ χ ψ ξ ε η θ ∂ ♏️ ω


Obs: Tutorial - Já vi e li esse tutorial


Em suma é isso galera... Até mais! Estilo cool





Última edição por James Watts em 30.01.18 4:13, editado 2 vez(es)
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 29.01.18 20:26

Antes de começarmos, eu preciso que você me forneça um array (vetor) com todos os caracteres que deseja colocar.

Vou fazer um exemplo com algumas letras do alfabeto:
Código:
[
  'a',
  'b',
  'c',
  'd'
  // E assim por diante.
]

Note as vírgulas ao final de cada item (exceto no último).

Spoiler:

o/
Luiz
Luiz
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 novo botão no SCEditor

Mensagem por James Watts 29.01.18 20:45

Olá, irei fazer isso daqui algum tempo. Vou ter que sair agora. rsrs Muito feliz

Spoiler:

Enquanto a isso eu confundir e coloquei "Tutorial" em vez de "Dúvida" conforme apresenta na instrução:

Adicionar novo botão no SCEditor Observ11

O título já foi corrigido. Muito feliz

Até mais! Estilo cool


Última edição por James Watts em 29.01.18 20:50, editado 2 vez(es) (Motivo da edição : correção do comment)
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por James Watts 30.01.18 0:32

Luiz escreveu:Antes de começarmos, eu preciso que você me forneça um array (vetor) com todos os caracteres que deseja colocar.

Vou fazer um exemplo com algumas letras do alfabeto:
Código:
[
  'a',
  'b',
  'c',
  'd'
  // E assim por diante.
]

Note as vírgulas ao final de cada item (exceto no último).

Spoiler:

o/

Dessa forma? Muito feliz

Código:
[
'C',
'~',
'≈',
'≠',
'≡',
'≠',
'∀',
'∃',
'⇒',
'⇔',
'→',
'ƒ',
'↔️',
'∈',
'∋',
'ℝ',
'ℕ',
'ℕ*',
'ℚ',
'ℤ',
'ℤ*',
'ℤ+',
'ℤ-',
'Ø',
'¢',
'|',
'|',
'٨',
'٧',
'∧',
'∨',
'⊂',
'⊃',
'∆',
'∇',
'∩',
'Ո',
'∪',
'○',
'f',
'◦',
'g',
'−',
'×',
'±',
'∓',
'÷',
'⊕',
'•',
'·',
'⊙',
'⊗',
'◈',
'丄',
'⊥',
'丅',
'ㅜ',
'√',
'∛',
'∜',
'∑',
'∏',
'⊥',
'⊿',
'→',
'↑',
'↓',
'↕️',
'←',
'Շ',
'≮ ',
'⌒',
'≯ ',
'≤',
'≥',
'∝',
'π',
'℮',
'אօ',
'∞',
'Å',
'■',
'|',
'∣',
'∣',
'4',
'‾',
'┴',
'║',
'ij',
'\',
'#',
'№',
'∟',
'∠',
'ℓ',
'♯',
'fˉ¹',
'●',
'‰',
'²',
'³',
'¹',
'º',
'ª',
'ⁿ',
'⁴',
'ⁿˉ',
'༝',
'ⁿˉ¹',
'∫ ',
'a',
'∝',
'₁',
'₂',
'₃',
'₄',
'ı',
'ո',
'ց',
'ь',
'հ',
'զ',
'ս',
'օ',
'₁',
'™️',
'£ ',
'$',
'⅞',
'⅝',
'⅜',
'⅛',
'⅔',
'⅓',
'½',
'¾',
'¼',
'½',
'∴',
'∵',
'∷',
'㋵',
'α',
'β',
'γ',
'δ',
'λ',
'μ',
'Ω',
'ο',
'ρ',
'φ',
'χ',
'ψ',
'ξ',
'ε',
'η',
'θ',
'∂',
'♏️',
'ω',
'₁օօ'
 //
]

Qualquer coisa é só comentar. Estilo cool
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 30.01.18 1:07


Atenção!

Você não pode fazer mensagens consecutivas antes de se completar 24 horas desde a última mensagem deste tópico! Por este motivo, nós pedimos que leia as regras do setor de suporte e principalmente a do Fórum dos Fóruns para não cometer novos erros!
Regras do FdF | Regras do Setor de Suporte

Em casos como o acima, edite a última mensagem. Feliz

---

Dessa forma?

Yeah.
Acabo de pensar em um jeito um pouco mais completo.

Como serão vários símbolos, podemos criar um meio de filtrar por um item (pelo seu nome). Você deseja isso?
Luiz
Luiz
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 novo botão no SCEditor

Mensagem por James Watts 30.01.18 1:19

Pode ser. Agora se for dar muito trabalho pra vc pode optar pelo jeito mais simples mesmo. Muito feliz


Última edição por James Watts em 30.01.18 2:38, editado 2 vez(es) (Motivo da edição : Complemento)
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 30.01.18 9:55

Na verdade nesse caso o maior trabalho será do senhor, portanto, fique livre para prosseguir do modo como desejar.

O que você deverá fazer é:
Código:
{
  'C': 'Nome do caractere',
  '~': 'Nome do caractere',
  '≈': 'Nome do caractere',
  '≠': 'Nome do caractere',
  '≡': 'Nome do caractere',
  '≠': 'Nome do caractere',
  '∀': 'Nome do caractere',
  '∃': 'Nome do caractere',
  '⇒': 'Nome do caractere',
  '⇔': 'Nome do caractere',
  '→': 'Nome do caractere',
  'ƒ': 'Nome do caractere',
  '↔️': 'Nome do caractere',
  '∈': 'Nome do caractere',
  '∋': 'Nome do caractere',
  'ℝ': 'Nome do caractere',
  'ℕ': 'Nome do caractere',
  'ℕ*': 'Nome do caractere',
  'ℚ': 'Nome do caractere',
  'ℤ': 'Nome do caractere',
  'ℤ*': 'Nome do caractere',
  'ℤ+': 'Nome do caractere',
  'ℤ-': 'Nome do caractere',
  'Ø': 'Nome do caractere',
  '¢': 'Nome do caractere',
  '|': 'Nome do caractere',
  '|': 'Nome do caractere',
  '٨': 'Nome do caractere',
  '٧': 'Nome do caractere',
  '∧': 'Nome do caractere',
  '∨': 'Nome do caractere',
  '⊂': 'Nome do caractere',
  '⊃': 'Nome do caractere',
  '∆': 'Nome do caractere',
  '∇': 'Nome do caractere',
  '∩': 'Nome do caractere',
  'Ո': 'Nome do caractere',
  '∪': 'Nome do caractere',
  '○': 'Nome do caractere',
  'f': 'Nome do caractere',
  '◦': 'Nome do caractere',
  'g': 'Nome do caractere',
  '−': 'Nome do caractere',
  '×': 'Nome do caractere',
  '±': 'Nome do caractere',
  '∓': 'Nome do caractere',
  '÷': 'Nome do caractere',
  '⊕': 'Nome do caractere',
  '•': 'Nome do caractere',
  '·': 'Nome do caractere',
  '⊙': 'Nome do caractere',
  '⊗': 'Nome do caractere',
  '◈': 'Nome do caractere',
  '丄': 'Nome do caractere',
  '⊥': 'Nome do caractere',
  '丅': 'Nome do caractere',
  'ㅜ': 'Nome do caractere',
  '√': 'Nome do caractere',
  '∛': 'Nome do caractere',
  '∜': 'Nome do caractere',
  '∑': 'Nome do caractere',
  '∏': 'Nome do caractere',
  '⊥': 'Nome do caractere',
  '⊿': 'Nome do caractere',
  '→': 'Nome do caractere',
  '↑': 'Nome do caractere',
  '↓': 'Nome do caractere',
  '↕️': 'Nome do caractere',
  '←': 'Nome do caractere',
  'Շ': 'Nome do caractere',
  '≮ ': 'Nome do caractere',
  '⌒': 'Nome do caractere',
  '≯ ': 'Nome do caractere',
  '≤': 'Nome do caractere',
  '≥': 'Nome do caractere',
  '∝': 'Nome do caractere',
  'π': 'Nome do caractere',
  '℮': 'Nome do caractere',
  'אօ': 'Nome do caractere',
  '∞': 'Nome do caractere',
  'Å': 'Nome do caractere',
  '■': 'Nome do caractere',
  '|': 'Nome do caractere',
  '∣': 'Nome do caractere',
  '∣': 'Nome do caractere',
  '4': 'Nome do caractere',
  '‾': 'Nome do caractere',
  '┴': 'Nome do caractere',
  '║': 'Nome do caractere',
  'ij': 'Nome do caractere',
  '/': 'Nome do caractere',
  '#': 'Nome do caractere',
  '№': 'Nome do caractere',
  '∟': 'Nome do caractere',
  '∠': 'Nome do caractere',
  'ℓ': 'Nome do caractere',
  '♯': 'Nome do caractere',
  'fˉ¹': 'Nome do caractere',
  '●': 'Nome do caractere',
  '‰': 'Nome do caractere',
  '²': 'Nome do caractere',
  '³': 'Nome do caractere',
  '¹': 'Nome do caractere',
  'º': 'Nome do caractere',
  'ª': 'Nome do caractere',
  'ⁿ': 'Nome do caractere',
  '⁴': 'Nome do caractere',
  'ⁿˉ': 'Nome do caractere',
  '༝': 'Nome do caractere',
  'ⁿˉ¹': 'Nome do caractere',
  '∫ ': 'Nome do caractere',
  'a': 'Nome do caractere',
  '∝': 'Nome do caractere',
  '₁': 'Nome do caractere',
  '₂': 'Nome do caractere',
  '₃': 'Nome do caractere',
  '₄': 'Nome do caractere',
  'ı': 'Nome do caractere',
  'ո': 'Nome do caractere',
  'ց': 'Nome do caractere',
  'ь': 'Nome do caractere',
  'հ': 'Nome do caractere',
  'զ': 'Nome do caractere',
  'ս': 'Nome do caractere',
  'օ': 'Nome do caractere',
  '₁': 'Nome do caractere',
  '™️': 'Nome do caractere',
  '£ ': 'Nome do caractere',
  '$': 'Nome do caractere',
  '⅞': 'Nome do caractere',
  '⅝': 'Nome do caractere',
  '⅜': 'Nome do caractere',
  '⅛': 'Nome do caractere',
  '⅔': 'Nome do caractere',
  '⅓': 'Nome do caractere',
  '½': 'Nome do caractere',
  '¾': 'Nome do caractere',
  '¼': 'Nome do caractere',
  '½': 'Nome do caractere',
  '∴': 'Nome do caractere',
  '∵': 'Nome do caractere',
  '∷': 'Nome do caractere',
  '㋵': 'Nome do caractere',
  'α': 'Nome do caractere',
  'β': 'Nome do caractere',
  'γ': 'Nome do caractere',
  'δ': 'Nome do caractere',
  'λ': 'Nome do caractere',
  'μ': 'Nome do caractere',
  'Ω': 'Nome do caractere',
  'ο': 'Nome do caractere',
  'ρ': 'Nome do caractere',
  'φ': 'Nome do caractere',
  'χ': 'Nome do caractere',
  'ψ': 'Nome do caractere',
  'ξ': 'Nome do caractere',
  'ε': 'Nome do caractere',
  'η': 'Nome do caractere',
  'θ': 'Nome do caractere',
  '∂': 'Nome do caractere',
  '♏️': 'Nome do caractere',
  'ω': 'Nome do caractere',
  '₁օօ': 'Nome do caractere'
}

Trocar "Nome do caractere" pelo nome do símbolo. Feliz
Prefere do outro jeito ou poderá fazer isso?

Se você optar por fazê-lo, cuidado só para não remover nenhuma vírgula ou aspas.

Estarei no aguardo de uma resposta.
Luiz
Luiz
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 novo botão no SCEditor

Mensagem por James Watts 30.01.18 15:48

Então eu prefiro o jeito mais fácil mesmo. Rindo
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 30.01.18 16:37

Olá novamente,

Acho que com a caixa de busca ficaria melhor para os usuários, mas é o senhor quem manda.

Em seu fórum, acesse:
Painel -> Módulos -> Gestão dos Códigos JavaScript.

01) Ative o gerenciamento de códigos JavaScript.

02) Crie um novo JS investido em todas as páginas com o seguinte código:
Código:
(function ($) {
  'use strict';

  var charset = [
    'C',
    '~',
    '≈',
    '≠',
    '≡',
    '≠',
    '∀',
    '∃',
    '⇒',
    '⇔',
    '→',
    'ƒ',
    '↔️',
    '∈',
    '∋',
    'ℝ',
    'ℕ',
    'ℕ*',
    'ℚ',
    'ℤ',
    'ℤ*',
    'ℤ+',
    'ℤ-',
    'Ø',
    '¢',
    '|',
    '|',
    '٨',
    '٧',
    '∧',
    '∨',
    '⊂',
    '⊃',
    '∆',
    '∇',
    '∩',
    'Ո',
    '∪',
    '○',
    'f',
    '◦',
    'g',
    '−',
    '×',
    '±',
    '∓',
    '÷',
    '⊕',
    '•',
    '·',
    '⊙',
    '⊗',
    '◈',
    '丄',
    '⊥',
    '丅',
    'ㅜ',
    '√',
    '∛',
    '∜',
    '∑',
    '∏',
    '⊥',
    '⊿',
    '→',
    '↑',
    '↓',
    '↕️',
    '←',
    'Շ',
    '≮ ',
    '⌒',
    '≯ ',
    '≤',
    '≥',
    '∝',
    'π',
    '℮',
    'אօ',
    '∞',
    'Å',
    '■',
    '|',
    '∣',
    '∣',
    '4',
    '‾',
    '┴',
    '║',
    'ij',
    '#',
    '№',
    '∟',
    '∠',
    'ℓ',
    '♯',
    'fˉ¹',
    '●',
    '‰',
    '²',
    '³',
    '¹',
    'º',
    'ª',
    'ⁿ',
    '⁴',
    'ⁿˉ',
    '༝',
    'ⁿˉ¹',
    '∫ ',
    'a',
    '∝',
    '₁',
    '₂',
    '₃',
    '₄',
    'ı',
    'ո',
    'ց',
    'ь',
    'հ',
    'զ',
    'ս',
    'օ',
    '₁',
    '™️',
    '£ ',
    '$',
    '⅞',
    '⅝',
    '⅜',
    '⅛',
    '⅔',
    '⅓',
    '½',
    '¾',
    '¼',
    '½',
    '∴',
    '∵',
    '∷',
    '㋵',
    'α',
    'β',
    'γ',
    'δ',
    'λ',
    'μ',
    'Ω',
    'ο',
    'ρ',
    'φ',
    'χ',
    'ψ',
    'ξ',
    'ε',
    'η',
    'θ',
    '∂',
    'ω',
    '₁օօ'
  ];

  $(window).on('load', function () {
    if ($.sceditor) return;

    var $drop = $([
      '<div class="sceditor-dropdown sceditor-dropdown-math" style="display: none;">',
      '  <div class="fa-math-charset"></div>',
      '</div>'
    ].join('\n'))
      .appendTo('body')
    ;

    $.each(charset, function (index, char) {
      $('<span>', { 'class': 'fa-math-char' })
        .text(char)
        .on('click', function (event) {
          event.stopPropagation();
          event.preventDefault();

          $('#text_editor_textarea')
            .sceditor('instance')
            .insert($(this).text())
          ;

          $drop.hide();
        })
        .appendTo($drop.find('.fa-math-charset'))
      ;
    });

    $('<a>', {
      'class': 'sceditor-button sceditor-button-math',
      'html' : '<div>Matemática</div>'
    })
      .on('click', function (event) {
        event.stopPropagation();
        event.preventDefault();

        var $this = $(this);

        if ($drop.is(':visible')) {
          $drop.hide();
         
          return;
        }

        $drop
          .css('top', $this.offset().top + $this.height())
          .css('left', $this.offset().left)
          .css('position', 'absolute')
          .show()
        ;
      })
      .appendTo('.sceditor-group:last')
    ;

    $('body').on('click', function () {
      if ($drop.is(':visible')) $drop.hide();
    });

    $('<style>', { 'text': [
      '.sceditor-button-math > div {',
      '  background-image: url(https://i.imgur.com/lWJ2Mqe.png) !important;',
      '  background-size: 16px;',
      '  background-position:  center;',
      '}',
      '',
      '.sceditor-dropdown-math {',
      '  max-height: 150px;',
      '  overflow-y: auto;',
      '  padding: 0px !important;',
      '}',
      '',
      '.sceditor-dropdown-math > div > span {',
      '  cursor: pointer;',
      '  font-size: 17px;',
      '  padding: 6px 10px;',
      '  border-bottom: dashed 1px #ddd;',
      '  display: block;',
      '}',
      '',
      '.sceditor-dropdown-math > div > span:hover {',
      '  background-color: #eee;',
      '}'
    ].join('\n') }).appendTo('head');
  });
}(jQuery));

E:
Não se esqueça de votar nos seus candidatos favoritos!


o/
Luiz
Luiz
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 novo botão no SCEditor

Mensagem por James Watts 30.01.18 19:41

Olá, amigo. Infelizmente ainda não resultou. Observe:

https://i.servimg.com/u/f62/19/80/65/20/aindan10.png
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 30.01.18 19:50

Perdão. Eu me esqueci de adicionar um caractere. :v

Eu fiz:
Código:
if ($.sceditor) return;
O correto era:
Código:
if (!$.sceditor) return;
A desatenção me pegou agora. Rindo

Enfim, troque por:
Código:
(function ($) {
  'use strict';
 
  var charset = [
    'C',
    '~',
    '≈',
    '≠',
    '≡',
    '≠',
    '∀',
    '∃',
    '⇒',
    '⇔',
    '→',
    'ƒ',
    '↔️',
    '∈',
    '∋',
    'ℝ',
    'ℕ',
    'ℕ*',
    'ℚ',
    'ℤ',
    'ℤ*',
    'ℤ+',
    'ℤ-',
    'Ø',
    '¢',
    '|',
    '|',
    '٨',
    '٧',
    '∧',
    '∨',
    '⊂',
    '⊃',
    '∆',
    '∇',
    '∩',
    'Ո',
    '∪',
    '○',
    'f',
    '◦',
    'g',
    '−',
    '×',
    '±',
    '∓',
    '÷',
    '⊕',
    '•',
    '·',
    '⊙',
    '⊗',
    '◈',
    '丄',
    '⊥',
    '丅',
    'ㅜ',
    '√',
    '∛',
    '∜',
    '∑',
    '∏',
    '⊥',
    '⊿',
    '→',
    '↑',
    '↓',
    '↕️',
    '←',
    'Շ',
    '≮ ',
    '⌒',
    '≯ ',
    '≤',
    '≥',
    '∝',
    'π',
    '℮',
    'אօ',
    '∞',
    'Å',
    '■',
    '|',
    '∣',
    '∣',
    '4',
    '‾',
    '┴',
    '║',
    'ij',
    '#',
    '№',
    '∟',
    '∠',
    'ℓ',
    '♯',
    'fˉ¹',
    '●',
    '‰',
    '²',
    '³',
    '¹',
    'º',
    'ª',
    'ⁿ',
    '⁴',
    'ⁿˉ',
    '༝',
    'ⁿˉ¹',
    '∫ ',
    'a',
    '∝',
    '₁',
    '₂',
    '₃',
    '₄',
    'ı',
    'ո',
    'ց',
    'ь',
    'հ',
    'զ',
    'ս',
    'օ',
    '₁',
    '™️',
    '£ ',
    '$',
    '⅞',
    '⅝',
    '⅜',
    '⅛',
    '⅔',
    '⅓',
    '½',
    '¾',
    '¼',
    '½',
    '∴',
    '∵',
    '∷',
    '㋵',
    'α',
    'β',
    'γ',
    'δ',
    'λ',
    'μ',
    'Ω',
    'ο',
    'ρ',
    'φ',
    'χ',
    'ψ',
    'ξ',
    'ε',
    'η',
    'θ',
    '∂',
    'ω',
    '₁օօ'
  ];
 
  $(window).on('load', function () {
    if (!$.sceditor) return;
 
    var $drop = $([
      '<div class="sceditor-dropdown sceditor-dropdown-math" style="display: none;">',
      '  <div class="fa-math-charset"></div>',
      '</div>'
    ].join('\n'))
      .appendTo('body')
    ;
 
    $.each(charset, function (index, char) {
      $('<span>', { 'class': 'fa-math-char' })
        .text(char)
        .on('click', function (event) {
          event.stopPropagation();
          event.preventDefault();
 
          $('#text_editor_textarea')
            .sceditor('instance')
            .insert($(this).text())
          ;
 
          $drop.hide();
        })
        .appendTo($drop.find('.fa-math-charset'))
      ;
    });
 
    $('<a>', {
      'class': 'sceditor-button sceditor-button-math',
      'html' : '<div>Matemática</div>'
    })
      .on('click', function (event) {
        event.stopPropagation();
        event.preventDefault();
 
        var $this = $(this);
 
        if ($drop.is(':visible')) {
          $drop.hide();
       
          return;
        }
 
        $drop
          .css('top', $this.offset().top + $this.height())
          .css('left', $this.offset().left)
          .css('position', 'absolute')
          .show()
        ;
      })
      .appendTo('.sceditor-group:last')
    ;
 
    $('body').on('click', function () {
      if ($drop.is(':visible')) $drop.hide();
    });
 
    $('<style>', { 'text': [
      '.sceditor-button-math > div {',
      '  background-image: url(https://i.imgur.com/lWJ2Mqe.png) !important;',
      '  background-size: 16px;',
      '  background-position:  center;',
      '}',
      '',
      '.sceditor-dropdown-math {',
      '  max-height: 150px;',
      '  overflow-y: auto;',
      '  padding: 0px !important;',
      '}',
      '',
      '.sceditor-dropdown-math > div > span {',
      '  cursor: pointer;',
      '  font-size: 17px;',
      '  padding: 6px 10px;',
      '  border-bottom: dashed 1px #ddd;',
      '  display: block;',
      '}',
      '',
      '.sceditor-dropdown-math > div > span:hover {',
      '  background-color: #eee;',
      '}'
    ].join('\n') }).appendTo('head');
  });
}(jQuery));

o/
Luiz
Luiz
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 novo botão no SCEditor

Mensagem por James Watts 30.01.18 20:43

Funcionou! Obrigado, amigo! Muito feliz

Pode fechar o tópico.
Estilo cool
James Watts
James Watts
**

Membro desde : 20/11/2017
Mensagens : 78
Pontos : 129

http://pre-vestibulando.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adicionar novo botão no SCEditor

Mensagem por Luiz 30.01.18 20:46

@James Watts, favor não usar formatações desnecessárias nos tópicos (como itálico).

Obrigado.

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 desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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