Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Script Tags
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Script Tags
Detalhes da questão
Endereço do fórum: http://www.brasilplayultimate.com.br
Versão do fórum: ModernBB
Descrição
Bom o script é funcional e gostaria de fazer o seguinte:
que estas opções: http://prntscr.com/h233zr
Apareça apenas para moderadores/administradores, só que junto com isso: http://prntscr.com/h23459
Se possível ao clicar em "Em curso", por exemplo, já setar no título do tópico [Em Curso], seria possível isso?
Caso sim, fico no aguardo, caso não basta deixar como pedido mesmo.
Script :
- Código:
/**
*! Criar tags no título dos tópicos com painel de seleção.
*
* @author Luiz~
* @see <a href="http://ajuda.forumeiros.com">Fórum dos Fóruns</a>
* @licence MIT
*/
(function ($) {
'use strict';
var tags = [
{
tag: 'imagem',
background: '#666'
},
{
tag: 'widget',
background: '#000'
}
];
$(function () {
var counter = 1;
/**
* Parte 1.
* Aqui nós criamos o seletor de tags acima do editor:
*/
if (location.pathname === '/post' && $('form input[name="subject"]').length > 0) {
// Criar a zona para colocar-se os inputs:
var $textarea = $('#textarea_content');
var $title = $('form [name="subject"]');
var $zone = $([
'<div class="fa-icon-selector">',
' <div class="fa-icon-selector-inner">',
' </div>',
'</div>',
].join('\n'))
.prependTo($textarea)
;
// Criar-se os inputs dentro da zona criada anteriormente:
var $appendZone = $zone.find('.fa-icon-selector-inner');
$.each(tags, function (index, tag) {
$([
'<div class="fa-tag-form-group">',
' <input type="radio" class="select-tag-input" name="select-tag-radio" id="tag-input-' + counter + '" data-tag="' + tag.tag + '" />',
' <label for="tag-input-' + counter + '" class="fa-tag-label">' + tag.tag + '</label>',
'</div>',
].join('\n'))
.appendTo($appendZone)
;
counter++;
});
// Função para dar focus num input X caso este seja a tag dum tópico X:
if (/^\[.*\]/gi.test($title.val())) {
$title.val().replace(/^\[(.*)\]/gi, function (find, match) {
$('[data-tag="' + match + '"]').prop('checked', true);
});
}
// Trigger para a adição/edição do prefixo no input de título:
$zone
.find('input.select-tag-input')
.on('focus', function () {
setPrefix($(this).attr('data-tag'));
})
;
// Função para setar/editar o prefixo:
var setPrefix = function (prefix) {
if (/^\[.*\]/gi.test($title.val())) {
$title.val($title.val().replace(/^\[.*\]/gi, function () {
return '[' + prefix + ']';
}));
return;
}
$title.val('[' + prefix + '] ' + $title.val().trim());
};
}
/**
* Parte 2.
* Aqui nós iremos substituir a tag entre os colchetes por uma tag real:
*/
var $link = $('a[href^="/t"]');
$link.each(function () {
var $this = $(this);
$.each(tags, function (index, tag) {
var regex = new RegExp ('\\[' + tag.tag + '\\]', 'gim');
var text = $this.text();
if (!regex.test(text)) {
return;
}
$this.addClass('fa-tagged-link');
$this.text(text.trim().replace(regex, ''));
$this.prepend('<span class="fa-topic-tag" style="background-color: ' + tag.background + ';">' + tag.tag + '</span>');
});
});
/**
* Parte 3:
* Estilos.
*/
var styles = [
'.fa-icon-selector-inner strong {',
' display: block;',
' margin-bottom: 4px;',
' font-weight: bold;',
'}',
'',
'.fa-icon-selector .fa-tag-form-group {',
' display: inline-block;',
' margin-right: 15px;',
' margin-top: 4px;',
'}',
'',
'.fa-tagged-link {',
' text-decoration: none !important;',
'}',
'',
'.fa-tagged-link:hover {',
' color: #f73 !important;',
' text-decoration: none !important;',
'}',
'',
'span.fa-topic-tag {',
' color: #fff;',
' background-color: #39c;',
' padding: 1px 5px;',
' border-radius: 3px;',
' margin-right: 4px;',
' display: inline;',
' text-decoration: none!important',
'}'
].join('\n');
$(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
});
}(jQuery));
Re: Script Tags
É possível sim, mas é um pouco complexo, fora que...
Teríamos que fazer muitas requisições para alterar um só título, o que pode afetar mais ainda o problema de lentidão. :/
Acho que também não há razão para restringir apenas aos Administradores e moderadores, tendo em vista que é só adicionar a tag [TAG] no título que ela já repõe pela TAG. O painel no SCEditor tem a função de facilitar.
Teríamos que fazer muitas requisições para alterar um só título, o que pode afetar mais ainda o problema de lentidão. :/
Acho que também não há razão para restringir apenas aos Administradores e moderadores, tendo em vista que é só adicionar a tag [TAG] no título que ela já repõe pela TAG. O painel no SCEditor tem a função de facilitar.
Re: Script Tags
Sobre a lentidão, reparei que se marcar em "Melhorar CSS" ele repara isso '-', mas cria "alguns" bugs.
A restrição é para que os usuários não editem, tendo em vista que só usarei [Em Curso], [Recusado], [Importante], [Resolvido], em topicos que contenham formulários, sendo assim, eles não conseguem editar o tópico para mudar o título, a função de restringir é apenas esta.
A restrição é para que os usuários não editem, tendo em vista que só usarei [Em Curso], [Recusado], [Importante], [Resolvido], em topicos que contenham formulários, sendo assim, eles não conseguem editar o tópico para mudar o título, a função de restringir é apenas esta.
Re: Script Tags
Troque o código por este a fim de restringir a visualização do painel aos usuários normais:
E a melhor forma de fazer com que o script funcione é no SCEditor, o que me impede de fazê-lo via AJAX. o/
- Código:
/**
*! Criar tags no título dos tópicos com painel de seleção.
*
* @author Luiz~
* @see <a href="http://ajuda.forumeiros.com">Fórum dos Fóruns</a>
* @licence MIT
*/
(function ($) {
'use strict';
var tags = [
{
tag: 'imagem',
background: '#666'
},
{
tag: 'widget',
background: '#000'
}
];
$(function () {
var counter = 1;
/**
* Parte 1.
* Aqui nós criamos o seletor de tags acima do editor:
*/
if (location.pathname === '/post' && $('form input[name="subject"]').length > 0) {
if (_userdata.user_level !== 2 && _userdata.user_level !== 1) {
return;
}
// Criar a zona para colocar-se os inputs:
var $textarea = $('#textarea_content');
var $title = $('form [name="subject"]');
var $zone = $([
'<div class="fa-icon-selector">',
' <div class="fa-icon-selector-inner">',
' </div>',
'</div>',
].join('\n'))
.prependTo($textarea)
;
// Criar-se os inputs dentro da zona criada anteriormente:
var $appendZone = $zone.find('.fa-icon-selector-inner');
$.each(tags, function (index, tag) {
$([
'<div class="fa-tag-form-group">',
' <input type="radio" class="select-tag-input" name="select-tag-radio" id="tag-input-' + counter + '" data-tag="' + tag.tag + '" />',
' <label for="tag-input-' + counter + '" class="fa-tag-label">' + tag.tag + '</label>',
'</div>',
].join('\n'))
.appendTo($appendZone)
;
counter++;
});
// Função para dar focus num input X caso este seja a tag dum tópico X:
if (/^\[.*\]/gi.test($title.val())) {
$title.val().replace(/^\[(.*)\]/gi, function (find, match) {
$('[data-tag="' + match + '"]').prop('checked', true);
});
}
// Trigger para a adição/edição do prefixo no input de título:
$zone
.find('input.select-tag-input')
.on('focus', function () {
setPrefix($(this).attr('data-tag'));
})
;
// Função para setar/editar o prefixo:
var setPrefix = function (prefix) {
if (/^\[.*\]/gi.test($title.val())) {
$title.val($title.val().replace(/^\[.*\]/gi, function () {
return '[' + prefix + ']';
}));
return;
}
$title.val('[' + prefix + '] ' + $title.val().trim());
};
}
/**
* Parte 2.
* Aqui nós iremos substituir a tag entre os colchetes por uma tag real:
*/
var $link = $('a[href^="/t"]');
$link.each(function () {
var $this = $(this);
$.each(tags, function (index, tag) {
var regex = new RegExp ('\\[' + tag.tag + '\\]', 'gim');
var text = $this.text();
if (!regex.test(text)) {
return;
}
$this.addClass('fa-tagged-link');
$this.text(text.trim().replace(regex, ''));
$this.prepend('<span class="fa-topic-tag" style="background-color: ' + tag.background + ';">' + tag.tag + '</span>');
});
});
/**
* Parte 3:
* Estilos.
*/
var styles = [
'.fa-icon-selector-inner strong {',
' display: block;',
' margin-bottom: 4px;',
' font-weight: bold;',
'}',
'',
'.fa-icon-selector .fa-tag-form-group {',
' display: inline-block;',
' margin-right: 15px;',
' margin-top: 4px;',
'}',
'',
'.fa-tagged-link {',
' text-decoration: none !important;',
'}',
'',
'.fa-tagged-link:hover {',
' color: #f73 !important;',
' text-decoration: none !important;',
'}',
'',
'span.fa-topic-tag {',
' color: #fff;',
' background-color: #39c;',
' padding: 1px 5px;',
' border-radius: 3px;',
' margin-right: 4px;',
' display: inline;',
' text-decoration: none!important',
'}'
].join('\n');
$(['<style type="text/css">', styles, '</style>'].join('\n')).appendTo('head');
});
}(jQuery));
E a melhor forma de fazer com que o script funcione é no SCEditor, o que me impede de fazê-lo via AJAX. o/
Re: Script Tags
Seria possível faze-lo então aparecer na resposta rápida ? Ai quando o usuário comentar ele já clicar lá e enviar
Re: Script Tags
Certo, então vamos fazer diferente, nestes icones: http://prntscr.com/h2cflr
Será possível adiciona-los ?
Exemplo: Ao clicar "Em curso" já modifica para [Em Curso], "Resolvido" [Resolvido], entendeu?
Ou de alguma outra maneira que o senhor acha que não fique tão monótomo.
Será possível adiciona-los ?
Exemplo: Ao clicar "Em curso" já modifica para [Em Curso], "Resolvido" [Resolvido], entendeu?
Ou de alguma outra maneira que o senhor acha que não fique tão monótomo.
Re: Script Tags
Foi o que disse acima. O script em questão foi feito para funcionar na página de postagem, e somente lá.
Re: Script Tags
Certo, peço que deixe o tópico aberto para que se o senhor ou o Kyo bolar alguma ideia que deixe mais "automático" seria uma boa
Se puder ver com ele para responder este tópico eu ficaria agradecido também, caso contrário podes fechar.
Se puder ver com ele para responder este tópico eu ficaria agradecido também, caso contrário podes fechar.
Re: Script Tags
[...] Kyo bolar alguma ideia que deixe mais "automático" seria uma boa [...]
A única maneira de fazer isso seria com uma boa dose de requisições ajax, o que resultaria num plugin completamente diferente do atual. É possível fazer, mas demanda tempo e trabalho demais para ser produzido e sua aplicação é muito específica.
O senhor pode aguardar e ver se outro membro o faz para você.
Re: Script Tags
Essa dose de requisições certamente deixaria o fórum mais lento.. Estou evitando fazer isto, ja que resolvi o problema de lentidão cujo qual estava tendo..
Façamos o seguinte, do jeito que está já está ótimo, podem fechar e estou agradecido pelo atendimento.
Se futuramente você se disponibilizar para fazer tal código com a aplicação requisitada eu ficarei muito feliz em utilizar.
Podem fechar o tópico e vou aguardar até o dia em que vocês criarem
Façamos o seguinte, do jeito que está já está ótimo, podem fechar e estou agradecido pelo atendimento.
Se futuramente você se disponibilizar para fazer tal código com a aplicação requisitada eu ficarei muito feliz em utilizar.
Podem fechar o tópico e vou aguardar até o dia em que vocês criarem
Re: Script Tags
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para Questões resolvidas. |
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos