System of automatic pagination on the images (except functional script on a technicality)
3 posters
Page 1 of 2
Page 1 of 2 • 1, 2
System of automatic pagination on the images (except functional script on a technicality)
Technical Details
Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Opera
Who the problem concerns : All members
Forum link : http://altitudetest.forumactif.com
Description of problem
Hello everyone,I use a js forum that allows paginationsur images and / or text.
The tutorial comes from the French forum : http://forum.forumactif.com/t355762-pagination-dans-un-message?highlight=pagination
History automate the system, I have worked a js that allows to affix the tag page every 6 images.
the script works except on one point: the center tag is not taken into account. This centering can isolate the expanded part of the rest of the message which should not be paged.
- Code:
$(function() {
$('div.postbody').each(function() {
$(this).find('div').first().find('img:not("[longdesc]")').attr('id', function(img) {
return 'M14_img_' + img;
})
});
$('img[id^="M14_img"]').unwrap();
});
$(function() {
$('div.postbody').each(function() {
$(this).find('img[id^="M14_img"]').length;
$(this).find('img[id="M14_img_0"]').before('[center] ');
$(this).find('img[id="M14_img_6"]').before('[page]');
$(this).find('img[id="M14_img_12"]').before('[page]');
$(this).find('img[id="M14_img_18"]').before('[page]');
$(this).find('img[id="M14_img_24"]').before('[page]');
$(this).find('img[id="M14_img_30"]').before('[page]');
$(this).find('img[id^="M14_img"]:last').after('[/center]');
});
});
Here is a link that allows to realize the concern
http://altitudetest.forumactif.com/t91-essai-post-photos
Would you have a solution to help me solve this little problem ?.
Thank you in advance for your help.
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
Re: System of automatic pagination on the images (except functional script on a technicality)
send me a test account please
Ch@lo Valdez- Forumember
- Posts : 138
Reputation : 50
Language : spanish
Re: System of automatic pagination on the images (except functional script on a technicality)
Hello Ch@lo Valdez,
here are the identifiers of a test account
Thank for your help
here are the identifiers of a test account
Thank for your help
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
Re: System of automatic pagination on the images (except functional script on a technicality)
i add on your main code this one, and i think is solved or not? @fascicularia
- Code:
document.addEventListener('DOMContentLoaded', function () {
var a, b, c, d, e,f, last, l, postbody = document.getElementsByClassName('postbody');
for (l = 0; l < postbody.length; l++) {
a = postbody[l];
b = a.getElementsByTagName('img');
last = b[b.length - 1].parentNode.nodeName == 'A' ? b[b.length - 1].parentNode : b[b.length - 1];
for (c = 0; c < b.length; c++) {
d = b[c];
e = a.innerHTML;
f = d.parentNode.nodeName == 'A' ? d.parentNode : d;
(!d.hasAttribute('longdesc') && d.src.indexOf('smiles') == -1) && (d.id = 'M14_img_' + c);
(b.length > 1 && /M14_img_0/.test(d.id)) && (f.insertAdjacentHTML('beforebegin', '[center]'));
/M14_img_6/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_12/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_18/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_24/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_30/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
(b.length > 1 && last.id.indexOf('M14_img_') != -1 )&& (last.insertAdjacentHTML('afterend', '[/center]'));
e.match(/\[center\]/g) && (a.innerHTML = e.replace(/\[center\]/, '<center>'));
e.match(/\[\/center\]g/) && (a.innerHTML = e.replace(/\[\/center\]/, '</center>'));
}
}
});
Ch@lo Valdez- Forumember
- Posts : 138
Reputation : 50
Language : spanish
Re: System of automatic pagination on the images (except functional script on a technicality)
Hello Ch@lo Valdez,
We are almost there. The modification of the javascript keeps the writings of the top but those of the bottom are always integrated to the pagination.
The current js
We are almost there. The modification of the javascript keeps the writings of the top but those of the bottom are always integrated to the pagination.
The current js
- Code:
document.addEventListener('DOMContentLoaded', function () {
var a, b, c, d, e,f, last, l, postbody = document.getElementsByClassName('postbody');
for (l = 0; l < postbody.length; l++) {
a = postbody[l];
b = a.getElementsByTagName('img');
last = b[b.length - 1].parentNode.nodeName == 'A' ? b[b.length - 1].parentNode : b[b.length - 1];
for (c = 0; c < b.length; c++) {
d = b[c];
e = a.innerHTML;
f = d.parentNode.nodeName == 'A' ? d.parentNode : d;
(!d.hasAttribute('longdesc') && d.src.indexOf('smiles') == -1) && (d.id = 'M14_img_' + c);
(b.length > 1 && /M14_img_0/.test(d.id)) && (f.insertAdjacentHTML('beforebegin', '[center]'));
/M14_img_6/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_12/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_18/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_24/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
/M14_img_30/.test(d.id) && (f.insertAdjacentHTML('beforebegin', '[page]'));
(b.length > 1 && last.id.indexOf('M14_img_') != -1 )&& (last.insertAdjacentHTML('afterend', '[/center]'));
e.match(/\[center\]/g) && (a.innerHTML = e.replace(/\[center\]/, '<center>'));
e.match(/\[\/center\]g/) && (a.innerHTML = e.replace(/\[\/center\]/, '</center>'));
}
}
});
document.addEventListener('DOMContentLoaded', function () {
var x= "div.postbody";
if($("#text_editor_textarea").length && $.sceditor) {
$(function() {
if(!$("#text_editor_textarea").sceditor("instance")) {
return
}
$('<a class="sceditor-button" unselectable="on" title="Page"><div unselectable="on" style="background:url(http://i.imgur.com/a3RgTJc.gif);opacity:1">Page</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) {
$("#text_editor_textarea").sceditor("instance").insertText("[page]")
})
})
}
var c, y, g = function(a) {
var b;
a = document.createElement(a);
b = "getComputedStyle" in window;
document.body.appendChild(a);
b = (b ? window.getComputedStyle(a, "") : a.currentStyle).display;
document.body.removeChild(a);
return b
}, t = function(o) {
if(o.tagName == "CODE") {
return
}
if(!o.hasChildNodes()) {
return
}
var a = 0;
var p = [0];
var i;
for(i = 0;i < o.childNodes.length;i++) {
c = o.childNodes[i];
if(c.nodeType == 1) {
p.push(c);
t(c)
}else {
if(c.nodeType == 3 && c.nodeValue.indexOf("[page]") != -1) {
while((y = c.nodeValue.indexOf("[page]")) != -1) {
if(y != 0) {
p.push(document.createTextNode(c.nodeValue.substr(0, y)))
}
p.push(0);
a++;
c.nodeValue = c.nodeValue.substr(y + 6)
}
p.push(c)
}else {
p.push(c)
}
}
}
if(a == 0) {
return
}
var b = g(o.tagName) == "block";
for(i = 0;i < p.length;i++) {
if(p[i] === 0) {
y = document.createElement(b ? "DIV" : "SPAN");
y.className = "postpage";
o.appendChild(y)
}else {
y.appendChild(p[i])
}
}
$("> .postpage", o).not(":first").hide();
y = document.createElement(b ? "DIV" : "SPAN");
y.className = "postpagination";
$(y).append('<span class="pp_current">1</span><span>2</span>');
if(a > 1) {
$(y).append("<span>... " + (a + 1) + "</span>")
}
if(b) {
$(y).append('<span class="pp_next">Suivant</span><span class="pp_all">Voir tout</span>')
}else {
$(y).append('<span class="pp_next"></span>')
}
o.appendChild(y);
$(y).on("click", "span", function() {
if($(this).hasClass("pp_all")) {
$(this).parent().parent().children().show();
$(this).parent().remove();
return
}
var pagin = $(this).parent();
var num = parseInt($(".pp_next", pagin).prev().text().replace(/ ?\.\.\. ?/, ""));
var cur = parseInt($(".pp_current", pagin).text().replace(/ ?\.\.\. ?/, ""));
if($(this).hasClass("pp_next")) {
cur += 1
}else {
cur = parseInt($(this).text().replace(/ ?\.\.\. ?/, ""))
}
if(cur < 1) {
cur = 1
}else {
if(cur > num) {
cur = num
}
}
$(".pp_next", pagin).prevUntil().remove();
if(cur < num - 1) {
$(pagin).prepend("<span>... " + num + "</span>")
}else {
if(cur == num) {
$(pagin).prepend('<span class="pp_current">' + num + "</span>")
}
}
if(cur < num) {
$(".pp_next", pagin).show();
$(pagin).prepend('<span class="pp_current">' + cur + "</span><span>" + (cur + 1) + "</span>")
}else {
$(".pp_next", pagin).hide()
}
if(cur > 1) {
$(pagin).prepend("<span>" + (cur - 1) + "</span>");
if(cur > 2) {
$(pagin).prepend("<span>1 ...</span>")
}
}
$(".postpage", $(pagin).parent()).hide();
$(".postpage", $(pagin).parent()).eq(cur - 1).show()
})
};
$(x).each(function() {
t(this)
})
});
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
Re: System of automatic pagination on the images (except functional script on a technicality)
I don't understand what you mean
Ch@lo Valdez- Forumember
- Posts : 138
Reputation : 50
Language : spanish
Re: System of automatic pagination on the images (except functional script on a technicality)
Hello,
If a text is inserted after the images, it is automatically integrated into the pagination despite the closing of the center tag.
Is it possible to modify the js so that it acts whatever the number of images so that the text that is not paginated is not integrated as part of the pagination?
If a text is inserted after the images, it is automatically integrated into the pagination despite the closing of the center tag.
Is it possible to modify the js so that it acts whatever the number of images so that the text that is not paginated is not integrated as part of the pagination?
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
fascicularia- Forumember
- Posts : 172
Reputation : 1
Language : french
Page 1 of 2 • 1, 2
Page 1 of 2
Permissions in this forum:
You cannot reply to topics in this forum