Botão Moderação
2 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 • Compartilhe
Botão Moderação
Detalhes da questão
Endereço do fórum: http://policiafederal-dpf.forumeiros.com/
Versão do fórum: ModernBB
Descrição
olá boa tarde eu tenho um sistema moderação de icones diretamente na pagina os meus botões atuais são como a imagem abaixo
http://prntscr.com/k171qz
eu gostaria um botão igual esse ou melhor
http://prntscr.com/k171fb
desde ja obrigado!
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Botão Moderação
opa claro que sim segue abaixo o codigo js
- Código:
/*globals jQuery, FA*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
* @version {alpha} 1.0
* @licence MIT
*/
(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 1, background: '#8b5' },
{ name: 'Em Curso', id : 2, background: '#8b5' },
{ name: 'Regras', id : 3, background: '#8b5' },
{ name: 'Atendida', id : 4, background: '#8b5' },
{ name: 'Importante', id : 5, background: '#8b5' },
{ name: 'Tutorial', id : 6, background: '#8b5' },
{ name: 'Recusado', id : 7, background: '#8b5' },
{ name: 'Aceito', id : 8, background: '#8b5' },
{ name: 'Banido', id : 9, background: '#8b5' },
{ name: 'Desbanido', id : 10, background: '#8b5' },
{ name: 'Designer', id : 11, background: '#8b5' },
{ name: 'Aprovado', id : 12, background: '#8b5' },
{ name: 'Reprovado', id : 13, background: '#8b5' },
];
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 };
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.');
}
});
};
MarkIcon.prototype.init = function () {
var self = this;
var $post = $('.post:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
return;
}
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)
;
};
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);
$form.find('input[name="post_icon"]').val(self.config.id);
$form.find('input[name="edit_reason"]').remove();
var encode = document.charset.toLowerCase() === 'utf-8'
? window.encodeURIComponent
: window.escape
;
var data = {
subject : $form.find('[name="subject"]').val(),
post_icon : self.config.id,
message : $form.find('[name="message"]').val(),
mode : $form.find('[name="mode"]').val(),
p : $form.find('[name="p"]').val(),
modif_topic_title : $form.find('[name="modif_topic_title"]').val(),
topictype : $form.find('[name="topictype"]').val(),
poll_title : $form.find('[name="poll_title"]').val(),
poll_option_text : $form.find('[name="poll_option_text"]').val(),
poll_length : $form.find('[name="poll_length"]').val(),
poll_multiple : $form.find('[name="poll_multiple"]').val(),
poll_cancel_vote : $form.find('[name="poll_cancel_vote"]').val(),
'auth[]' : $form.find('[name="auth[]"]').val(),
post : 1
};
var encoded = $.map(data, function (value, key) {
return key + '=' + encode(value);
}).join('&');
$.post(self.messageLink, encoded)
.done(function () {
self.changeText('<i class="fa fa-check"></i> Marcado!');
})
.fail(function () {
alert([
'[#2] Houve um erro ao marcar o tópico como "' + self.config.name + '".',
'Por favor, contate o suporte técnico.'
].join('\n'));
})
;
})
.fail(function () {
alert([
'[#1] Houve um erro ao marcar o tópico como "' + self.config.name + '".',
'Por favor, contate o suporte técnico.'
].join('\n'));
})
;
};
MarkIcon.prototype.changeText = function (text) {
var self = this;
$(self.button)
.html(text)
;
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
Re: Botão Moderação
Mude para:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
* @version {alpha} 1.0
* @licence MIT
*/
/*(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 1, background: '#8BC163' },
{ name: 'Em Curso', id : 2, background: '#F6BA59' },
{ name: 'Regras', id : 3, background: '#434A53' },
{ name: 'Atendida', id : 4, background: '#8b5' },
{ name: 'Importante', id : 5, background: '#8b5' },
{ name: 'Tutorial', id : 6, background: '#8b5' },
{ name: 'Recusado', id : 7, background: '#8b5' },
{ name: 'Aceito', id : 8, background: '#8b5' },
{ name: 'Banido', id : 9, background: '#8b5' },
{ name: 'Desbanido', id : 10, background: '#8b5' },
{ name: 'Designer', id : 11, background: '#8b5' },
{ name: 'Aprovado', id : 12, background: '#8b5' },
{ name: 'Reprovado', id : 13, background: '#8b5' }
];
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
};
self.config = $.extend({}, self.defaults, self.userConfig);
$.each(self.config, function (key, value) {
if (key === undefined) {
throw new Error ('[Topic Icons] The ' + key + ' key was not specified in the script config.');
}
if (value === undefined) {
throw new Error ('[Topic Icons] The ' + value + ' value was not specified in the settings.');
}
});
};
MarkIcon.prototype.init = function () {
var self = this;
var $post = $('.post:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
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> Alterado...');
$.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> Alterado!'))
.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 () {
alert([
'[Topic Icons] AJAX Error.',
'Refresh the page and try again.'
].join('\n'));
};
MarkIcon.prototype.appendStyles = function () {
$('<style>', {
'text': [
'.fa-mark-icon-button {',
' padding: 8px 8px 8px 8px;',
' border: none;',
' color: #fff;',
' margin: 10px 0 10px 6px;',
' box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.08);',
' border-radius: 3px;',
'}'
].join('\n')
}).appendTo('head');
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Botão Moderação
Código não esta funcionando nem aparece os botões!
Re: Botão Moderação
Erro meu :/
Mude:
Mude:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
* @version {alpha} 1.0
* @licence MIT
*/
(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 1, background: '#8BC163' },
{ name: 'Em Curso', id : 2, background: '#F6BA59' },
{ name: 'Regras', id : 3, background: '#434A53' },
{ name: 'Atendida', id : 4, background: '#8b5' },
{ name: 'Importante', id : 5, background: '#8b5' },
{ name: 'Tutorial', id : 6, background: '#8b5' },
{ name: 'Recusado', id : 7, background: '#8b5' },
{ name: 'Aceito', id : 8, background: '#8b5' },
{ name: 'Banido', id : 9, background: '#8b5' },
{ name: 'Desbanido', id : 10, background: '#8b5' },
{ name: 'Designer', id : 11, background: '#8b5' },
{ name: 'Aprovado', id : 12, background: '#8b5' },
{ name: 'Reprovado', id : 13, background: '#8b5' }
];
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
};
self.config = $.extend({}, self.defaults, self.userConfig);
$.each(self.config, function (key, value) {
if (key === undefined) {
throw new Error ('[Topic Icons] The ' + key + ' key was not specified in the script config.');
}
if (value === undefined) {
throw new Error ('[Topic Icons] The ' + value + ' value was not specified in the settings.');
}
});
};
MarkIcon.prototype.init = function () {
var self = this;
var $post = $('.post:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
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> Alterado...');
$.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> Alterado!'))
.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 () {
alert([
'[Topic Icons] AJAX Error.',
'Refresh the page and try again.'
].join('\n'));
};
MarkIcon.prototype.appendStyles = function () {
$('<style>', {
'text': [
'.fa-mark-icon-button {',
' padding: 8px 8px 8px 8px;',
' border: none;',
' color: #fff;',
' margin: 10px 0 10px 6px;',
' box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.08);',
' border-radius: 3px;',
'}'
].join('\n')
}).appendTo('head');
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Botão Moderação
Pedxz escreveu:Erro meu :/
Mude:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
* @version {alpha} 1.0
* @licence MIT
*/
(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 1, background: '#8BC163' },
{ name: 'Em Curso', id : 2, background: '#F6BA59' },
{ name: 'Regras', id : 3, background: '#434A53' },
{ name: 'Atendida', id : 4, background: '#8b5' },
{ name: 'Importante', id : 5, background: '#8b5' },
{ name: 'Tutorial', id : 6, background: '#8b5' },
{ name: 'Recusado', id : 7, background: '#8b5' },
{ name: 'Aceito', id : 8, background: '#8b5' },
{ name: 'Banido', id : 9, background: '#8b5' },
{ name: 'Desbanido', id : 10, background: '#8b5' },
{ name: 'Designer', id : 11, background: '#8b5' },
{ name: 'Aprovado', id : 12, background: '#8b5' },
{ name: 'Reprovado', id : 13, background: '#8b5' }
];
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
};
self.config = $.extend({}, self.defaults, self.userConfig);
$.each(self.config, function (key, value) {
if (key === undefined) {
throw new Error ('[Topic Icons] The ' + key + ' key was not specified in the script config.');
}
if (value === undefined) {
throw new Error ('[Topic Icons] The ' + value + ' value was not specified in the settings.');
}
});
};
MarkIcon.prototype.init = function () {
var self = this;
var $post = $('.post:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
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> Alterado...');
$.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> Alterado!'))
.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 () {
alert([
'[Topic Icons] AJAX Error.',
'Refresh the page and try again.'
].join('\n'));
};
MarkIcon.prototype.appendStyles = function () {
$('<style>', {
'text': [
'.fa-mark-icon-button {',
' padding: 8px 8px 8px 8px;',
' border: none;',
' color: #fff;',
' margin: 10px 0 10px 6px;',
' box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.08);',
' border-radius: 3px;',
'}'
].join('\n')
}).appendTo('head');
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
Então amigo quando dou F5 na pagina está dando esse erro abaixo como eu resolvo esse erro
http://prntscr.com/k19wxb
Re: Botão Moderação
Então usa o teu primeiro JS e usa este CSS:
- Código:
.fa-mark-icon-button {
padding: 8px 8px 8px 8px;
border: none;
color: #fff;
margin: 10px 0 10px 6px;
box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.08);
border-radius: 3px;
}
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Botão Moderação
Tópico resolvidoTópico marcado como resolvido pela equipe por abandono do autor. |
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Tópicos semelhantes
» Caixa de Moderação
» Dar moderação
» Assistente de Moderação
» Tabelas de Moderação
» Mensagens de Moderação
» Dar moderação
» Assistente de Moderação
» Tabelas de Moderação
» Mensagens de Moderação
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