Latest topics
» [HELP] About Profile Cover Code
by omarpop23 Yesterday at 06:39

» bloquer un membre
by berlingo Fri 17 Nov 2017, 18:19

» IconSkouliki Graphics
by skouliki Fri 17 Nov 2017, 03:54

» [IN PROGRESS] Can this code work on pun version
by skouliki Thu 16 Nov 2017, 03:50

» Auto-suggest @mentions as You Type
by skouliki Wed 15 Nov 2017, 14:56

» [TUTORIAL] [ALL VERSIONS] Warning before posting
by demon99 Wed 15 Nov 2017, 08:12

» About Add Reply & New Topic button (popup form)
by omarpop23 Mon 13 Nov 2017, 20:31

» Hello everyone this is Adam from France
by Adam Mon 13 Nov 2017, 13:32

» Add a login popup for the toolbar
by Ape Sun 12 Nov 2017, 18:41

» Post a message automatically when locking a topic
by ThunderTB Sun 12 Nov 2017, 13:51

» Control pannel issue
by Ange Tuteur Sun 12 Nov 2017, 09:49

» BUG... forum members birthday's
by Ape Sat 11 Nov 2017, 11:44

» Display a Preview of Groups on Hover
by ThunderTB Fri 10 Nov 2017, 21:56

» Search box only visible on hover
by Ange Tuteur Mon 06 Nov 2017, 09:57

» [GAME] Animal Game
by SLGray Sun 05 Nov 2017, 15:04

Recent Tutorials
Who is online?
In total there are 7 users online :: 0 Registered, 0 Hidden and 7 Guests :: 2 Bots

None

[ View the whole list ]


Most users ever online was 172 on Fri 19 Feb 2016, 05:17

Starred Forums

Page 3 of 3 Previous  1, 2, 3

View previous topic View next topic Go down

avatar
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 22
Posts : 4712
Points : 9585
Reputation : 2341
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 20 Apr 2016, 13:27

First topic message reminder :

This plugin allows you to "Star" forums. Starred forums are placed at the very top of the forum list, so you can easily access your favorite forums.


Click to view demo

Features
Usability ! You can star forums by hovering over the forum title and clicking the star next to it. You can unstar starred forums the same way.
Easy Access ! All the forums that you starred will be available at the top of the forum list.
Editability ! Personalize this plugin by changing the text, icons, etc ..!

This plugin will work on any forum version, so long as the templates aren't heavily modified.


Installation

To install this plugin go to Admin Panel > Modules > JavaScript codes management and create a new script with the following settings.

Title : Starred Forums
Placement : In the homepage
Code:
$(function() {
  'DEVELOPED BY ANGE TUTEUR';
  'NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR';
  'ORIGIN : http://fmdesign.forumotion.com/t501-starred-forums#6825';
  if (/\/c\d+-/.test(window.location.href)) return; // return if category
 
  // automatically detects the version
  var version = $('.bodylinewidth')[0] ? 0 : document.getElementById('wrap') ? 1 : $('div.pun')[0] ? 2 : document.getElementById('ipbwrapper') ? 3 : document.getElementById('fa_edge') ? 4 : 'badapple';
 
  // error notifications
  if (version == 'badapple' || !window.JSON || !window.localStorage) {
    var errString = 'The plugin "fa_starred" could not be executed because : ';
 
    if (version == 'badapple') errString += '\nYour forum version is not supported.';
    if (!window.JSON) errString += '\nJSON is not supported by your browser';
    if (!window.localStorage) errString += '\nThe Storage API is not support by your browser.';
 
    window.console && console.error ? console.error(errString) : alert(errString);
    return;
  }
 
  // get fontawesome if unavailable
  if (!$('link[href$="font-awesome.min.css"]')[0]) {
    document.getElementsByTagName('HEAD')[0].insertAdjacentHTML('beforeend', '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css" />');
  }
 
  window.fa_starred = {
    version : version, // forum version
    forums : localStorage.fa_starred_forums ? JSON.parse(localStorage.fa_starred_forums) : null,
 
    // language settings
    lang : {
        star : 'Star this forum',
      unstar : 'Unstar this forum',
      starred : 'Starred Forums'
    },
 
    icon : {
        star : '',
      unstar : ''
    },
 
    // selectors
    select : {
      content : version ? document.getElementById('main-content') : $('#content-container td:has(> img[height="5"])')[0],
      category : ['.forumline:has(.secondarytitle)', '.forabg', '.main:has(.tcr) .main-content', '.borderwrap:has(.index-box)', '.forum-category'][version],
      forum : 'a.' + (version ? 'forumtitle' : 'forumlink'),
      row : version == 1 ? 'li' : version == 4 ? '.forum-block' : 'tr'
    },
 
    // move the selected forum to the "starred" category
    star : function(that, id, startup) {
      if (!fa_starred.forums) fa_starred.forums = {};
      if (!fa_starred.board) fa_starred.createStarBoard();
 
      if (!fa_starred.forums[id]) {
        // clone the row and add it to the star board
        var clone = $(that).closest(fa_starred.select.row)[0].cloneNode(true),
            rows = $(that).closest(fa_starred.select.row).parent().find(fa_starred.select.row);
 
        // update the star attributes for the clone
        $('.fa_star', clone).attr({
          'onclick' : 'fa_starred.unstar(this, ' + id + '); return false',
          'class' : 'fa_unstar',
          'title' : fa_starred.lang.unstar
        }).html('<i class="fa">' + fa_starred.icon.unstar + '</i>');
 
        fa_starred.list.appendChild(clone); // append the clone to the starred category
 
        $(that).closest(fa_starred.select.row)[0].style.display = 'none'; // hide the original row
 
        // check if all forums are hidden for this category
        for (var i = 0, j = rows.length, k = 0; i < j; i++) {
          if (/none/.test(rows[i].style.display)) k++;
        }
 
        // hide the category if all forums are hidden
        if (i == k) {
          $(that).closest(fa_starred.select.category)[0].className += ' fa_star_hidden';
        }
 
        // jump to the star board if it's out of sight
        if (!startup && document.getElementById('fa_star_board').getBoundingClientRect().top < 0) {
          window.location.hash = '';
          window.location.hash = '#fa_star_board';
        }
 
        // update storage
        fa_starred.forums[id] = 1;
        localStorage.fa_starred_forums = JSON.stringify(fa_starred.forums);
      }
 
    },
 
    // unstar the selected forum
    unstar : function (that, id) {
      var forum, catg, i = 0, j;
 
      fa_starred.list.removeChild($(that).closest(fa_starred.select.row)[0]); // remove cloned row
 
      // update variables
      forum = $(fa_starred.select.forum + '[href^="/f' + id + '-"]')[0]; // original forum
      catg = $(forum).closest(fa_starred.select.category)[0]; // original category
 
      $(forum).closest(fa_starred.select.row)[0].style.display = ''; // show the original forum's row
 
      // show the category if all forums were hidden
      if (/fa_star_hidden/.test(catg.className)) {
        catg.className = catg.className.replace(/fa_star_hidden/, '');
      }
 
      // delete the starred forum and check if there are anymore stars
      delete fa_starred.forums[id];
      for (j in fa_starred.forums) {
        if (fa_starred.forums[j]) i++;
      }
 
      // update storage
      if (i) {
        localStorage.fa_starred_forums = JSON.stringify(fa_starred.forums);
      } else {
        fa_starred.forums = null;
        localStorage.removeItem('fa_starred_forums');
 
        // remove nodes
        if (version == 2) {
          fa_starred.board.parentNode.removeChild(fa_starred.board.previousSibling); // remove header for punbb
        }
        fa_starred.board.parentNode.removeChild(fa_starred.board);
 
        // delete node references
        delete fa_starred.board;
        delete fa_starred.list;
      }
 
    },
 
    // create the "starred" category
    createStarBoard : function() {
      var catg = $(fa_starred.select.category, fa_starred.select.content)[0],
          board = catg ? catg.cloneNode(true) : null,
          rows = $(fa_starred.select.row, board);
     
      if (!catg) return;
 
      board.id = 'fa_star_board';
      board.style.display = '';
 
      if (version != 2) {
        board.getElementsByTagName('H2')[0].innerHTML = fa_starred.lang.starred; // change category title
      }
 
      // find forum list and remove exisiting rows in the clone
      fa_starred.list = rows[0].parentNode;
      rows.remove();
 
      // punbb insertion method
      if (version == 2) {
        var head = catg.previousSibling.cloneNode(true);
        head.getElementsByTagName('H2')[0].innerHTML = fa_starred.lang.starred;
 
        catg.parentNode.insertBefore(board, catg.previousSibling);
        board.parentNode.insertBefore(head, board);
      } else {
        catg.parentNode.insertBefore(board, catg); // default insertion
      }
 
      fa_starred.board = board;
    }
  };
 
  fa_starred.select.row += ':has(' + fa_starred.select.forum + ')'; // update row selector
 
  // general startup
  var a = $(fa_starred.select.forum, fa_starred.select.content),
      i = 0,
      j = a.length,
      k,
      id;
 
  // setup star board and reset forum states if starred
  if (fa_starred.forums) {
    if (!fa_starred.board) fa_starred.createStarBoard();
    for (k in fa_starred.forums) {
      fa_starred.forums[k] = 0;
    }
  }
 
  // setup stars and starred forums
  for (; i < j; i++) {
    id = a[i].href.replace(/.*?\/f(\d+).*/, '$1');
 
    a[i].insertAdjacentHTML('afterend', '<a href="#" class="fa_star" onclick="fa_starred.star(this, ' + id + '); return false;" title="' + fa_starred.lang.star + '"><i class="fa">' + fa_starred.icon.unstar + '</i></a>');
 
    if (fa_starred.forums) {
      for (k in fa_starred.forums) {
        if (k == id) {
          fa_starred.star(a[i], id, true);
        }
      }
    }
  }
 
  document.getElementsByTagName('HEAD')[0].insertAdjacentHTML('beforeend', '<style type="text/css">a.fa_star,a.fa_unstar{color:#999!important;font-size:16px;vertical-align:-2px;margin-left:3px;opacity:0}a.fa_star:hover,a.fa_unstar,li:hover a.fa_star,tr:hover a.fa_star{opacity:1}a.fa_star i,a.fa_unstar i{position:relative}a.fa_star i:hover:after,a.fa_unstar i:after{content:"' + fa_starred.icon.star + '";position:absolute;left:0;bottom:0}a.fa_unstar i:hover:after{content:""}.fa_star_hidden {display:none!important}</style>');
});
When you're finished, save the script and the plugin will be installed ! Go to your forum and hover over a forum, doing so should display a star. Clicking this star will pin the forum to the very top of the list so you can easily access it. You can unstar forums and remove them from the starred list by clicking the star next to the forum title.

If you want to make modifications to this plugin please see the next section.


Modifications

Below are the modifications that can be made to this plugin.


1. Language
If you want to change the wording or translate the texts, find the lang object in the script and edit the texts to whatever you want.
Code:
    lang : {
        star : 'Star this forum',
      unstar : 'Unstar this forum',
      starred : 'Starred Forums'
    },


2. The Star Icon
If you want to change the star icon to something else, find the icon object in the script.
Code:
    icon : {
        star : '',
      unstar : ''
    },
By default it uses FontAwesome icons. However, you can also use HTML images if you want.


3. The Theme
If you want to change the color of the star icons, find this stylesheet at the bottom of the script and change this color ;
Code:
#999
Code:
document.getElementsByTagName('HEAD')[0].insertAdjacentHTML('beforeend', '<style type="text/css">a.fa_star,a.fa_unstar{color:#999!important;font-size:16px;vertical-align:-2px;margin-left:3px;opacity:0}a.fa_star:hover,a.fa_unstar,li:hover a.fa_star,tr:hover a.fa_star{opacity:1}a.fa_star i,a.fa_unstar i{position:relative}a.fa_star i:hover:after,a.fa_unstar i:after{content:"' + fa_starred.icon.star + '";position:absolute;left:0;bottom:0}a.fa_unstar i:hover:after{content:""}.fa_star_hidden {display:none!important}</style>');
You can also change the font-size and other attributes.



That's all the modifications you can make ! If you have any questions, comments, or find a bug feel free to leave a reply below. Enjoy ! Coffee


Notice
Tutorial written by Ange Tuteur.
Special thanks to the Beta Testers for testing this plugin.
Reproduction not permitted without consent from the author.


Last edited by Ange Tuteur on Mon 30 Jan 2017, 10:27; edited 3 times in total

avatar
Gae
New Member
Title :
Gender : Unspecified
Posts : 9
Points : 244
Reputation : 2
Language : French English
Browser : Browser : Google Chrome Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile

PostGae on Sat 27 May 2017, 15:01

Hi @Ange Tuteur

Thanks for your answer
It doesnt comes from modified templates but i've found the problem. 
It comes about one forum and his category. (And i see in your screenshot that the category and the forum in question are not here instead of he must normally) When i've deleted these forum and category, the trick works as he must work.

Thank you very much to have attracted me the attention.
avatar
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 22
Posts : 4712
Points : 9585
Reputation : 2341
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Mon 29 May 2017, 10:31

No problem, I'm glad you were able to fix the issue. Smile
avatar
berlingo
New Member
Title :
Gender : Unspecified
Posts : 5
Points : 175
Reputation : 0
Language : francais
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB2
Awards :
View all awards
View user profile

Postberlingo on Sun 04 Jun 2017, 08:42

Bonjours alors déjà merci pour les très bon script

mais voila avec celui ci quand je met le script étoile il y a que les admin qui sont capable de l'utilisé les membres qui souhaite mettre un forum en favori alors ils on un gros problème il ne peuvent plus voir aucun des forums ni la possibilité de revenir avant leur clic sur l'étoile
avatar
Ange Tuteur
Administrator
Title :
Coffee Addict
Gender : Male
Age : 22
Posts : 4712
Points : 9585
Reputation : 2341
Location : Macungie, PA
Language : EN10, FR5
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
Awards :
View all awards
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Mon 05 Jun 2017, 11:43

Hi @berlingo,

It sounds like a javascript error. What's the URL of your forum ?
avatar
berlingo
New Member
Title :
Gender : Unspecified
Posts : 5
Points : 175
Reputation : 0
Language : francais
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB2
Awards :
View all awards
View user profile

Postberlingo on Mon 05 Jun 2017, 15:27

Salut @Ange Tuteur

je viens de retirer ce script car après un vote une seul personne l'utilise donc j'ai supprimer

mais merci a toi quand même Wink

Page 3 of 3 Previous  1, 2, 3

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

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