Alterar o ícone do tópico com AJAX
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 • Compartilhe
Alterar o ícone do tópico com AJAX
Detalhes da questão
Endereço do fórum: https://brasilexperiencelife.forumeiros.com/
Versão do fórum: ModernBB
Descrição
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
*
* Modificação por RafaelS. restringir botões aos fóruns
* https://ajuda.forumeiros.com/
*
* @version 1.2
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Em Curso',
id: 6,
background: '#daa520',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Importante',
id: 4,
background: '#ffb300',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Aceito',
id: 9,
background: '#8c648c',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Recusado',
id: 2,
background: '#de5757',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Banido',
id: 7,
background: '#ff0000',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Desbanido',
id: 8,
background: '#00a651',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Tutorial',
id: 8,
background: '#8db3ff',
allowedGroups: [6, 2, 7],
forum: 14
},
{
name: 'Regras',
id: 3,
background: '#857f7e',
allowedGroups: [6, 2, 7],
forum: 14
}
];
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,
allowedGroups: [],
forum: 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[id*="p"]:first, [id*="post-"].post-wrap:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
return false;
}
// Verificar se o usuário pertence a um dos grupos permitidos
if (!self.config.allowedGroups.includes(_userdata.user_level)) {
return false;
}
var atual = $('.sub-header-path a:last').attr("href");
console.log("Forum detection by RafaelS.");
if (atual.indexOf("f" + this.config.forum + "-") < 0) {
console.log("O ícone " + this - config.name + " não está disponível no fórum: " + atual);
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> Carregando...');
$.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> Feito!'))
.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;
$(document).ready(function() {
$.each(config, function(index, iconConfig) {
var icon = new MarkIcon(iconConfig);
icon.init();
}(jQuery));
consegui modificar o código óriginal pois eu gostaria de privar para outros grupos os icones, não apénas para mod e admin. gostaria que corrigissem esse código pois ele não funciona, a inteligencia artificial me passou ele assim!
E gostaria que corrigissem também, só posso colocar em um fórum. gostaria que os icones aparecessem todos em quantos fóruns eu quiser!
esse é o código original:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
*
* Modificação por RafaelS. restringir botões aos fóruns
* https://ajuda.forumeiros.com/
*
* @version 1.2
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
onlyForMod: true,
forum: 14
},
{
name: 'Em Curso',
id: 6,
background: '#daa520',
onlyForMod: true,
forum: 14
},
{
name: 'Importante',
id: 4,
background: '#ffb300',
onlyForMod: true,
forum: 14
},
{
name: 'Aceito',
id: 9,
background: '#8c648c',
onlyForMod: true,
forum: 14
},
{
name: 'Recusado',
id: 2,
background: '#de5757',
onlyForMod: true,
forum: 14
},
{
name: 'Banido',
id: 7,
background: '#ff0000',
onlyForMod: true,
forum: 14
},
{
name: 'Desbanido',
id: 8,
background: '#00a651',
onlyForMod: true,
forum: 14
},
{
name: 'Tutorial',
id: 8,
background: '#8db3ff',
onlyForMod: true,
forum: 14
},
{
name: 'Regras',
id: 3,
background: '#857f7e',
onlyForMod: true,
forum: 14
}
];
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,
forum: 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[id*="p"]:first, [id*="post-"].post-wrap: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;
}
var atual = $('.sub-header-path a:last').attr("href");
console.log("Forum detection by RafaelS.");
if (atual.indexOf("f" + this.config.forum + "-") < 0) {
console.log("O ícone " + this - config.name + " não está disponível no fórum: " + atual);
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> Carregando...');
$.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> Feito!'))
.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));
Re: Alterar o ícone do tópico com AJAX
Boas @'Sousaph29',
Substitui o teu codigo por:
Atenciosamente,
Sleep
Substitui o teu codigo por:
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
* Modificação por RafaelS.
*
* @version 1.3
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
allowedGroups: [6, 2, 7], // Adicione IDs de grupos aqui
forums: [14, 15, 16] // Lista de IDs de fóruns onde o ícone deve aparecer
},
{
name: 'Em Curso',
id: 6,
background: '#daa520',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Importante',
id: 4,
background: '#ffb300',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Aceito',
id: 9,
background: '#8c648c',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Recusado',
id: 2,
background: '#de5757',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Banido',
id: 7,
background: '#ff0000',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Desbanido',
id: 8,
background: '#00a651',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Tutorial',
id: 8,
background: '#8db3ff',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
},
{
name: 'Regras',
id: 3,
background: '#857f7e',
allowedGroups: [6, 2, 7],
forums: [14, 15, 16]
}
];
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,
allowedGroups: [],
forums: []
};
self.config = $.extend({}, self.defaults, self.userConfig);
$.each(self.config, function(key, value) {
if (value === undefined) {
throw new Error('[Topic Icons] O valor da chave ' + key + ' não foi especificado no script.');
}
});
};
MarkIcon.prototype.init = function() {
var self = this;
var $post = $('.post[id*="p"]:first, [id*="post-"].post-wrap:first');
var $link = $post.find('a[href$="mode=editpost"]');
if (!$link.length) {
return false;
}
// Verificar se o usuário pertence a um dos grupos permitidos
if (!self.config.allowedGroups.includes(_userdata.user_level)) {
return false;
}
var atual = $('.sub-header-path a:last').attr("href");
console.log("Forum detection by RafaelS.");
var forumMatch = self.config.forums.some(function(forumId) {
return atual.indexOf("f" + forumId + "-") >= 0;
});
if (!forumMatch) {
console.log("O ícone " + this.config.name + " não está disponível neste fórum: " + atual);
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> Carregando...');
$.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> Feito!'))
.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] Erro AJAX. Atualize a página e tente novamente.');
};
MarkIcon.prototype.appendStyles = function() {
$('<style>', {
'text': [
'.fa-mark-icon-button {',
' padding: 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));
Atenciosamente,
Sleep
Re: Alterar o ícone do tópico com AJAX
Olá @Sousaph29,
Altere o código para
Cordialmente,
tikky.
Altere o código para
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
*
* Modificação por RafaelS. restringir botões aos fóruns
* https://ajuda.forumeiros.com/
*
* @version 1.2
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
allowedGroups: ["FAFAFA", "E80ECF"],
forum: 14
},
{
name: 'Em Curso',
id: 6,
background: '#daa520',
allowedGroups: ["E80ECF"],
forum: 14
},
{
name: 'Importante',
id: 4,
background: '#ffb300',
allowedGroups: ["E80ECF"],
forum: 14
},
{
name: 'Aceito',
id: 9,
background: '#8c648c',
allowedGroups: ["FAFAFA"],
forum: 14
},
{
name: 'Recusado',
id: 2,
background: '#de5757',
allowedGroups: ["FAFAFA", "E80ECF"],
forum: 14
},
{
name: 'Banido',
id: 7,
background: '#ff0000',
allowedGroups: ["FAFAFA"],
forum: 14
},
{
name: 'Desbanido',
id: 8,
background: '#00a651',
allowedGroups: ["FAFAFA"],
forum: 14
},
{
name: 'Tutorial',
id: 8,
background: '#8db3ff',
allowedGroups: ["FAFAFA"],
forum: 14
},
{
name: 'Regras',
id: 3,
background: '#857f7e',
allowedGroups: ["FAFAFA"],
forum: 14
}
];
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,
allowedGroups: false,
forum: 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[id*="p"]:first, [id*="post-"].post-wrap:first');
var $link = $post.find('a[href$="mode=editpost"]');
var isAllowed = self.config.allowedGroups.indexOf(_userdata.groupcolor) !== -1;
if (!$link.length) {
return false;
}
if (!isAllowed) return;
var atual = $('.sub-header-path a:last').attr("href");
console.log("Forum detection by RafaelS.");
if (atual.indexOf("f" + this.config.forum + "-") < 0) {
console.log("O ícone " + this - config.name + " não está disponível no fórum: " + atual);
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> Carregando...');
$.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> Feito!'))
.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));
Cordialmente,
tikky.
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
Re: Alterar o ícone do tópico com AJAX
E para colocar em mais de um fórum ? como faço, antes de fechar!
Re: Alterar o ícone do tópico com AJAX
Altere para
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
*
* Modificação por RafaelS. restringir botões aos fóruns
* https://ajuda.forumeiros.com/
*
* @version 1.2
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: [14, 104]
}, {
name: 'Em Curso',
id: 6,
background: '#daa520',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Importante',
id: 4,
background: '#ffb300',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Aceito',
id: 9,
background: '#8c648c',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Recusado',
id: 2,
background: '#de5757',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Banido',
id: 7,
background: '#ff0000',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Desbanido',
id: 8,
background: '#00a651',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Tutorial',
id: 8,
background: '#8db3ff',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}, {
name: 'Regras',
id: 3,
background: '#857f7e',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"],
forum: 14
}];
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,
allowedGroups: false,
forum: 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[id*="p"]:first, [id*="post-"].post-wrap:first');
var $link = $post.find('a[href$="mode=editpost"]');
var isAllowed = self.config.allowedGroups.indexOf(_userdata.groupcolor) !== -1;
var atual = $('.sub-header-path a:last').attr("href").includes("f" + this.config.forum + "-");
if (!$link.length) {
return false;
}
if (!isAllowed) return;
if (!atual) return;
console.log("Forum detection by RafaelS.");
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> Carregando...');
$.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> Feito!'))
.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 : 7962
Pontos : 9217
Re: Alterar o ícone do tópico com AJAX
Só aparece no fórum 14, o 104 não aparece nada
Re: Alterar o ícone do tópico com AJAX
O fórum 104 não existe ("O fórum selecionado não existe"). Onde quer adicionar?
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
Re: Alterar o ícone do tópico com AJAX
gostaria de adicionar em todo fórum, se possivel!
Re: Alterar o ícone do tópico com AJAX
Altere para
- Código:
/*globals jQuery, FA, _userdata*/
/**
* Alterar o ícone do tópico com AJAX.
*
* @author Luiz
*
* Modificação por RafaelS. restringir botões aos fóruns
* https://ajuda.forumeiros.com/
*
* @version 1.2
* @licence MIT
*/
(function($) {
'use strict';
var config = [{
name: 'Resolvido',
id: 1,
background: '#1c6b1c',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Em Curso',
id: 6,
background: '#daa520',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Importante',
id: 4,
background: '#ffb300',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Aceito',
id: 9,
background: '#8c648c',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Recusado',
id: 2,
background: '#de5757',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Banido',
id: 7,
background: '#ff0000',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Desbanido',
id: 8,
background: '#00a651',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Tutorial',
id: 8,
background: '#8db3ff',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}, {
name: 'Regras',
id: 3,
background: '#857f7e',
allowedGroups: ["2768A1", "FF6600", "00008C", "40781D", "F2163B", "90B01E", "D966D9", "8C668C"]
}];
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,
allowedGroups: 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[id*="p"]:first, [id*="post-"].post-wrap:first');
var $link = $post.find('a[href$="mode=editpost"]');
var isAllowed = self.config.allowedGroups.indexOf(_userdata.groupcolor) !== -1;
if (!$link.length) {
return false;
}
if (!isAllowed) 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);
self.appendStyles();
};
MarkIcon.prototype.runAjax = function() {
var self = this;
self.changeText('<i class="fa fa-refresh fa-spin"></i> Carregando...');
$.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> Feito!'))
.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 : 7962
Pontos : 9217
Re: Alterar o ícone do tópico com AJAX
Tem dois códigos ativos no fórum: um em todas as páginas que causa o desaparecimento da barra de ferramentas (código antigo) e o novo com investimento nos tópicos. Deixe só o que esta nos tópicos.
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
Re: Alterar o ícone do tópico com AJAX
RESOLVIDO!
Re: Alterar o ícone do tópico com AJAX
Tópico resolvidoMovido para "Questões resolvidas". |
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
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