[FOORUM] Hashtagi pop-up

Hashtagi pop-up muudab tagide kasutamise mugavamaks ning kasutaja saab edasised valikud teha ühest kohast.

• Lisa Javascript (ACP -> Modules -> HTML & JAVASCRIPT -> Javascript codes management -> ).
✓ In all the pages

Kood:

$(function() {
  var a = document.getElementsByTagName('A'), b = document.createElement('DIV'), i = 0, j = a.length, actif, t;
  b.className = 'fa-hashtag-options';
  b.style.display = 'none';
  document.body.appendChild(b);
 
  for (; i<j; i++) {
    if (a[i].title && /\/tags\//.test(a[i].href) && /^#/.test(a[i].innerHTML)) {
      a[i].className += ' fa-hashtag';
   
      a[i].onclick = function() {
     
        if (actif != this) {
          actif = this, t = this.innerHTML;
          t.length > 24 && (t = t.slice(0, 25).replace(/^\s+|\s+$/g, '') + '...');
       
          b.style.left = $(this).offset().left + 'px';
          b.style.top = $(this).offset().top + 'px';
          b.innerHTML = '<div class="fa-hashtag-title"><span class="fa-hashtag-tag">' + t + '</span> valikud</div><b>• </b><a href="' + this.href + '">Vaata märgitud teemasid</a>' + (_userdata.session_logged_in ? '<form method="post" name="addtag_form" action="/profile?mode=editprofile&page_profil=tags&start&submit=1"><b>• </b><a href="#" onclick="this.parentNode.submit();return false;">Jälgi <span class="fa-hashtag-tag">' + t + '</span></a><input name="addtag" type="hidden" value="' + this.innerHTML.slice(1) + '"></form><b>• </b><a href="/profile?mode=editprofile&page_profil=tags">Juhtpaneel</a>' : '');
       
          /none/.test(b.style.display) && (b.style.display = 'block');
        } else {
          actif = null;
          b.style.display = 'none';
        }
     
        return false;
      };
    }
  }
});

• Lisa CSS (ACP -> Display -> Colors -> CSS Stiilifail).

Kood:

/* options drop down */
.fa-hashtag-options {
  color:#666;
  font-size:11px;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  line-height:14px;
  background:#EEE;
  border:1px solid #CCC;
  border-radius:3px;
  box-shadow:0 3px 6px rgba(0, 0, 0, 0.175);
  margin-top:20px;
  padding:3px;
  position:absolute;
  z-index:100;
}

/* options title */
.fa-hashtag-title {
  font-size:12px;
  border-bottom:1px solid #CCC;
  padding-bottom:3px;
  margin-bottom:3px;
}

/* option links */
.fa-hashtag-options a {
  color:#333;
  text-decoration:none;
  display:inline-block;
  padding:2px 6px 2px 0;
}

.fa-hashtag-options a:hover {
  color:#666;
  text-decoration:underline;
}

/* option bullets */
.fa-hashtag-options b {
  color:#333;
  padding-left:6px;
}

/* option tags */
.fa-hashtag-tag {
  color:#000;
  font-weight:bold;
}