The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Preview latest topics

2 posters

Go down

Solved Preview latest topics

Post by Guest February 20th 2016, 11:13 pm

Hello again!

It's been a while. How y'all doing? Hello

Please, be aware the stuff below is copyrighted! Thank you.

We've got 2 scripts running on our website. 1 'Preview topics' script running on the sub-forums:

Code:
$(function(){
      var isPunbb = '';
      if ($('.pun').length) var isPunbb = 'class="pun"';
      $('a.topictitle').after('&nbsp;<img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Voorbeeldweergave" alt="Voorbeeldweergave" style="cursor:pointer;"/>');
      $('img#topicPreview').click(function() {
        $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:460px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:16px;">Momentje. Bezig met laden ...</span></center></div></div>');
        $('#topicPreviewing').load($(this).siblings('a.topictitle').attr('href')+' .post:eq(0)');
        $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()});
      });
    });

in effect giving us something like this in the subs: http://prntscr.com/a5w4xa , and 1 custom built and copyrighted 'Latest Topics' script (running on all the pages):

Code:
$(function(){
var a ="";
    $('#right').css('display','none');
a = $('#right .module .inner').html();
if(a=== null){ return; };
$('.introduction').after('<div class="forabg"><div class="inner rctopicslist"><span class="corners-top"></span><ul class="topiclist"><li class="header"><dl class="icon"><dd class="rctoptitle"><div class="table-title"><h2>Meest Recente Berichten</h2></div></dd><dd class="rctoptime"><span>Datum \& Tijd</span></dd><dd  class="rctopauthor"><span>Auteur</span></dd></dl></li></ul></div></div>');
a = a.replace(/<a href="\/t(.*)<\/a><br>/g,'<div id="topicc"><span id="rctitle"><a href="\/t$1</a></span>').replace(/<a href="\/u(.*)\/a>/g,'<span id="author"><a href="/u$1/a></span><span id="thedate">').replace(/<br><br>/g,'</span></div>');
$('#right .module .inner').html(a);
$('.module .inner #topicc').each(function(){
var   l = $(this).find('#rctitle').html();
var   m = $(this).find('#author').html();
var   n = $(this).find('#thedate').html();
   $('.rctopicslist').append('<ul class="topiclist rcforums"><li class="rcrow"><dl class="icon"><dd class="rctoptitle"><div class="table-title"><h2>'+l+'</h2></div></dd><dd class="rctoptime"><span>'+n+'</span></dd><dd  class="rctopauthor"><span>'+m+'</span></dd></dl></li></ul>');
});
});

giving us something like this: http://prntscr.com/a5w5bt .

Also, we've got a special 'Block Users from Viewing the topics' JS in place, running on the Index as well as the topics:

Code:
$(function(){
if(_userdata.session_logged_in==0){
if(location.href.match(/\/t\d+-(.*)/)){
alert('Je moet ingelogd zijn om berichten te kunnen bekijken. Registreer je nu op Friendcodes of log in!\n\nYou need to be logged in to be able to watch the topics. Please register with Friendcodes now or log in!');
location.href="/";
    }
$('.topiclist a[href^="/t"]').parent().each(function(){
var atext =   $(this).html();
var atext2 = atext.replace(/(.*)href="(.*)"(.*)<\/a>/,'$1href="/"$3<font color="red"></font></a>');
$(this).html(atext2);
})}
});

Now, in the 'Latest topics' table, we want the same 'Preview Topic' symbol and function like in the first script, combining the two, just behind the topic titles. Could someone please built us a properly functioning script for that?

Thanks in advance.


Forum version: phpBB3
Forum address: http://www.friendcodes.nl


Last edited by RoXaNNeX on February 22nd 2016, 7:11 pm; edited 1 time in total
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 3:52 pm

Hey,

I think it may be as simple as changing the first scripts placement to "in all the pages", although this will apply the preview image to all
Code:
.topictitle
links. However, if your links are from elsewhere -- a widget for example -- I'd recommend changing this selector in the first script :
Code:
a.topictitle
to this :
Code:
a.topictitle, .module a[href^="/t"]

If that doesn't work let me know.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 4:50 pm

Alright, thnx man. But neither of them worked, unfortunately.

I tried:

1. Setting the original script to 'All the Pages' -> no change
2. Altered the script to this:

Code:
$(function(){
      var isPunbb = '';
      if ($('.pun').length) var isPunbb = 'class="pun"';
      $('a.topictitle, .module a[href^="/t"]').after('&nbsp;<img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Voorbeeldweergave" alt="Voorbeeldweergave" style="cursor:pointer;"/>');
      $('img#topicPreview').click(function() {
        $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:470px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:16px;">Momentje. Bezig met laden ...</span></center></div></div>');
        $('#topicPreviewing').load($(this).siblings('a.topictitle, .module a[href^="/t"]').attr('href')+' .post:eq(0)');
        $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()});
      });
    });

and tried with both 'All the Pages' as well as 'Subs' only. Nothing worked.
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 4:54 pm

Try replacing the script with this :
Code:
$(function(){$(function(){
      var isPunbb = '';
      if ($('.pun').length) var isPunbb = 'class="pun"';
      $('a.topictitle, .table-title a').after('&nbsp;<img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Voorbeeldweergave" alt="Voorbeeldweergave" style="cursor:pointer;"/>');
      $('img#topicPreview').click(function() {
        $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:470px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:16px;">Momentje. Bezig met laden ...</span></center></div></div>');
        $('#topicPreviewing').load($(this).siblings('a.topictitle, .module a[href^="/t"]').attr('href')+' .post:eq(0)');
        $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()});
      });
})});

Make sure the placement is :
- In the sub-forums
- In the homepage

or : All pages
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 4:58 pm

OK, the symbol is visible now on the latest topics, however it's stuck in 'Loading' mode http://prntscr.com/a6k86t ... Preview latest topics Mouais , no matter what placement I choose.
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 5:02 pm

My bad I forgot to change one of the selector sets. Try now :
Code:
$(function(){$(function(){
      var isPunbb = '';
      if ($('.pun').length) var isPunbb = 'class="pun"';
      $('a.topictitle, .table-title a').after('&nbsp;<img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Voorbeeldweergave" alt="Voorbeeldweergave" style="cursor:pointer;"/>');
      $('img#topicPreview').click(function() {
        $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:470px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:16px;">Momentje. Bezig met laden ...</span></center></div></div>');
        $('#topicPreviewing').load($(this).siblings('a.topictitle, .table-title a').attr('href')+' .post:eq(0)');
        $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()});
      });
})});
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 5:09 pm

Cool. I like it. It's differnt then the other previews found on the forums Laughing Well, it does what it says... it previews the latest topic and not the whole bunch of posts in a topic. It doesn't seem to be working as a guest tho.... Guests should be able to use the preview mode.

Perhaps, this script is blocking it?

Code:
var CopyrightNotice='Samantha Melissa S. Block Users from Viewing the Forum. Copyright ©️ 2014-2016 by Samantha Melissa S. at Friendcodes.nl . All Rights Reserved. Use, modification, and/or distribution of this script is NOT allowed without direct permission from Samantha . This entire copyright notice MUST remain in the original, copied, or modified script';
$(function(){
if(_userdata.session_logged_in==0){
if(location.href.match(/\/t\d+-(.*)/)){
alert('Je moet ingelogd zijn om berichten te kunnen bekijken. Registreer je nu op Friendcodes of log in!\n\nYou need to be logged in to be able to watch the topics. Please register with Friendcodes now or log in!');
location.href="/";
    }
$('.topiclist a[href^="/t"]').parent().each(function(){
var atext =   $(this).html();
var atext2 = atext.replace(/(.*)href="(.*)"(.*)<\/a>/,'$1href="/"$3<font color="red"></font></a>');
$(this).html(atext2);
})}
});

Thanks Ange!

Grtz.

Samantha & Roxanne.

avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 5:17 pm

I think it's not working for guests because the base URL it's loading is your index page, and the script is attempting to load that page and find
Code:
.post:eq(0)
which is null. If you want, you can return an error by replacing this :
Code:
$('#topicPreviewing').load($(this).siblings('a.topictitle, .table-title a').attr('href')+' .post:eq(0)');

by :
Code:
$('#topicPreviewing').load($(this).siblings('a.topictitle, .table-title a').attr('href')+' .post:eq(0)', function() {
  if (!$('#topicPreviewing .post').length) {
    $('#topicPreviewing').html('MESSAGE ERROR');
  }
});

That should display a message if the post cannot be retrieved.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 5:19 pm

What I meant is that the preview @ 'Latest Topics' should be loading, but not the topic itself in Guest View when people click on them. That view should remain blocked. I want guests to be shown just the latest post in preview mode. And preview mode isn't loading very well at the moment as a guest (it does when logged in), eventhough the posts do exist. In other words: things work fine, except as a guest because the preview doen't load very well (post is not being displayed).

EDIT: And it just seems to pick a random post from the topic now I just noticed Rolling Eyes It's not even the latest in some cases. That's new...
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 5:54 pm

Hmm.. before I can figure out the later, try disabling the prior script you mentioned. Think
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 6:00 pm

OK, did that. Took 'SECURITY: Samantha Melissa S. - Block Users from Viewing the Forum (Index/Topics)' offline. But that script served a purpose on the forum, please keep in mind.
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 6:04 pm

Well that seems to be the cause. Try replacing this script with :
Code:
var CopyrightNotice='Samantha Melissa S. Block Users from Viewing the Forum. Copyright © 2014-2016 by Samantha Melissa S. at Friendcodes.nl . All Rights Reserved. Use, modification, and/or distribution of this script is NOT allowed without direct permission from Samantha . This entire copyright notice MUST remain in the original, copied, or modified script';
$(function(){
if(_userdata.session_logged_in==0){
if(location.href.match(/\/t\d+-(.*)/)){
alert('Je moet ingelogd zijn om berichten te kunnen bekijken. Registreer je nu op Friendcodes of log in!\n\nYou need to be logged in to be able to watch the topics. Please register with Friendcodes now or log in!');
location.href="/";
    }
}
});
and re-enable it of course.

Now for the topics in the list on the homepage. Do you want it to show the first post or the latest post ?
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 6:16 pm

I replaced the script, but as a guest, we can just enter the topic from the 'Latest Topics' again... That's not right. Just the Preview should be opening the latest post, the entire topic shouldn't be made public.

I haven't figured out which one is best yet, first or latest. I feel like it should be the first post, like found on the rest of the forum, just to keep people curious and have them keep coming back to register or log in. The preview mode should serve as an example mode only. On the other hand, in 'latest topics' view, showing the latest in preview mode would be more intelligent. Please feel free to show me the different scripts.

Edit: In the 'Latest Topics' pane I just tried clicking different topic links. Some of them show the message alright, like the 'Mirror's Edge' topic: http://prntscr.com/a6lo0b <-- the way it should be, where others don't ... Odd. I guess it just works for topics, not posts atm.
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 6:44 pm

Well for the first post only you'll have to change the latest topics script into this :
Code:
$(function(){
var a ="";
    $('#right').css('display','none');
a = $('#right .module .inner').html();
if(a=== null){ return; };
$('.introduction').after('<div class="forabg"><div class="inner rctopicslist"><span class="corners-top"></span><ul class="topiclist"><li class="header"><dl class="icon"><dd class="rctoptitle"><div class="table-title"><h2>Meest Recente Berichten</h2></div></dd><dd class="rctoptime"><span>Datum \& Tijd</span></dd><dd  class="rctopauthor"><span>Auteur</span></dd></dl></li></ul></div></div>');
a = a.replace(/<a href="\/t(\d+).*?>(.*?)<\/a><br>/g,'<div id="topicc"><span id="rctitle"><a href="\/t$1-">$2</a></span>').replace(/<a href="\/u(.*)\/a>/g,'<span id="author"><a href="/u$1/a></span><span id="thedate">').replace(/<br><br>/g,'</span></div>');
$('#right .module .inner').html(a);
$('.module .inner #topicc').each(function(){
var  l = $(this).find('#rctitle').html();
var  m = $(this).find('#author').html();
var  n = $(this).find('#thedate').html();
  $('.rctopicslist').append('<ul class="topiclist rcforums"><li class="rcrow"><dl class="icon"><dd class="rctoptitle"><div class="table-title"><h2>'+l+'</h2></div></dd><dd class="rctoptime"><span>'+n+'</span></dd><dd  class="rctopauthor"><span>'+m+'</span></dd></dl></li></ul>');
});
});

and as for the topic links your other script should prevent viewing of them. Although I noticed some inconsistencies, so try replacing that script with this :
Code:
$(function(){
  var CopyrightNotice='Samantha Melissa S. Block Users from Viewing the Forum. Copyright © 2014-2016 by Samantha Melissa S. at Friendcodes.nl . All Rights Reserved. Use, modification, and/or distribution of this script is NOT allowed without direct permission from Samantha . This entire copyright notice MUST remain in the original, copied, or modified script';
  if(!_userdata.session_logged_in && /\/t\d+/.test(window.location.href)){
    alert('Je moet ingelogd zijn om berichten te kunnen bekijken. Registreer je nu op Friendcodes of log in!\n\nYou need to be logged in to be able to watch the topics. Please register with Friendcodes now or log in!');
    window.location.href = '/';
  }
});
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 6:51 pm

ALRIGHT! Way better now. It'll block them posts as well now, not just the topics Very Happy Nearly there now.

What script should be used to show the last post (and not some random pick) in Preview Mode @ 'Latest Topics', Ange?
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by Ange Tuteur February 22nd 2016, 6:56 pm

For that you'll need to edit the preview script to this :
Code:
$(function(){$(function(){
      var isPunbb = '';
      if ($('.pun').length) var isPunbb = 'class="pun"';
      $('a.topictitle, .table-title a').after('&nbsp;<img id="topicPreview" src="http://i56.servimg.com/u/f56/18/45/41/65/new_wi10.gif" title="Voorbeeldweergave" alt="Voorbeeldweergave" style="cursor:pointer;"/>');
      $('img#topicPreview').click(function() {
        $('body').append('<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="topicPreview-container" '+isPunbb+' style="width:auto;top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#EEE;border:1px solid #CCC;border-radius:5px;"><div id="topicPreviewing" style="max-height:470px;overflow-y:auto;"><center><span class="topicPreview-loading" style="font-weight:bold;font-size:16px;">Momentje. Bezig met laden ...</span></center></div></div>');
        $('#topicPreviewing').load($(this).siblings('a.topictitle, .table-title a').attr('href') + ($(this).siblings('a.topictitle')[0] ? ' .post:eq(0)' : ' .post:last'));
        $('#preview-filter').click(function(){$('#preview-filter, #topicPreview-container').remove()});
      });
})});

It should get the last post, or
Code:
.post:last
which is being used.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Preview latest topics

Post by Guest February 22nd 2016, 7:11 pm

YAY! WOOHOO!!! You're a sweetheart Ange :rose: And now, finally, for some dinner bwi Wink

Grtz.

Sam & Rox

PS: Alright, fair enough. I'm gonna use 'the latest' for a while. Thanks for both dude, I bookmarked this ticket so I can fall back to it lateron if needed. You can scrap and dump this ticket on the pile. Smile
avatar
Guest
Guest


Back to top Go down

Solved Re: Preview latest topics

Post by SLGray February 22nd 2016, 7:55 pm

Topic solved and archived


Preview latest topics Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum