Mudar ícone de mensagem com AJAX
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
Mudar ícone de mensagem com AJAX
Detalhes da questão
Endereço do fórum: http://brasilmagicrpg.forumeiros.com/
Versão do fórum: ModernBB
Descrição
Essas tags só aparecem para mim que sou admin fórum! Para os demais, até mesmo fundador, moderador... só aparece resolvido e em curso. Queria que aparecesse todas as tags para qualquer membro, tanto novato quanto fundador.
Aguardo a ajuda! Obrigado.
IMAGEM DAS TAG'S
Re: Mudar ícone de mensagem com AJAX
Olá,
Pode-me passar o código?
Relembro, ainda, a importância de postar tópicos nos setores corretos.
Continuação de um bom Natal.
Tópico movido de 'Outras questões' para 'Questões sobre códigos'
Título alterado de 'TAGS DISPONÍVEIS PARA TODOS' para 'Mudar ícone de mensagem com AJAX'.
Uso de formatação de textoInformamos que a formatação excessiva não é permitida no Fórum dos Fóruns. Isto é, o uso do riscado, o uso de alinhamentos, a alteração do texto, cor ou tamanho da fonte. Estes privilégios são reservados à Staff do Fórum dos Fóruns. |
Pode-me passar o código?
Relembro, ainda, a importância de postar tópicos nos setores corretos.
Continuação de um bom Natal.
Tópico movido de 'Outras questões' para 'Questões sobre códigos'
Título alterado de 'TAGS DISPONÍVEIS PARA TODOS' para 'Mudar ícone de mensagem com AJAX'.
Convidado- Convidado
Re: Mudar ícone de mensagem com AJAX
Aqui está o código:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Change the topic icon with AJAX and JavaScript.
*
* @author Luiz
* @version 1.2
* @licence MIT
*/
(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 0, background: '#76be52', onlyForMod: true },
{ name: 'Em Curso', id : 2, background: '#ecb73c' },
{ name: 'Aceito', id: 1, background: '#6d66a3', onlyForAdmin: true },
{ name: 'Recusado', id: 3, background: '#c837a1', onlyForAdmin: true },
{ name: 'Importante', id: 4, background: '#e55649', onlyForAdmin: 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 ('[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;
}
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> Marking...');
$.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> Marked!'))
.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: 5px 5px 5px 5px;',
' border: none;',
' color: #ffffff;',
' margin: 7px 0 7px 3px;',
' box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.08);',
' border-radius: 5px;',
'}'
].join('\n')
}).appendTo('head');
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
Re: Mudar ícone de mensagem com AJAX
Olá,
Troque para:
Cordialmente.
Troque para:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Change the topic icon with AJAX and JavaScript.
*
* @author Luiz
* @version 1.2
* @licence MIT
*/
(function ($) {
'use strict';
var config = [
{ name: 'Resolvido', id : 0, background: '#76be52', onlyForMod: false },
{ name: 'Em Curso', id : 2, background: '#ecb73c' },
{ name: 'Aceito', id: 1, background: '#6d66a3', onlyForAdmin: false },
{ name: 'Recusado', id: 3, background: '#c837a1', onlyForAdmin: false },
{ name: 'Importante', id: 4, background: '#e55649', onlyForAdmin: false }
];
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 ('[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;
}
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> Marking...');
$.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> Marked!'))
.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: 5px 5px 5px 5px;',
' border: none;',
' color: #ffffff;',
' margin: 7px 0 7px 3px;',
' box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.08);',
' border-radius: 5px;',
'}'
].join('\n')
}).appendTo('head');
};
$(function () {
$.each(config, function () {
var self = this;
(new FA.Topic.MarkIcon(self)).init();
});
});
}(jQuery));
Cordialmente.
Convidado- Convidado
Tópicos semelhantes
» Ícone do tópico com AJAX
» Alterar o ícone do tópico com AJAX
» Alterar o ícone do tópico com AJAX
» Alterar o ícone do tópico em modo AJAX
» [TUTORIAL] Alterar o ícone do tópico em modo AJAX
» Alterar o ícone do tópico com AJAX
» Alterar o ícone do tópico com AJAX
» Alterar o ícone do tópico em modo AJAX
» [TUTORIAL] Alterar o ícone do tópico em modo AJAX
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