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.

Chatbox: Smile's window integrated into the chat window!

3 posters

Go down

Chatbox: Smile's window integrated into the chat window! Empty Chatbox: Smile's window integrated into the chat window!

Post by JScript July 11th 2015, 5:34 pm

Hello guys!

We know that the chat smiles appear within a pop up window, so I decided to integrate them into own chat window!

The code is easy to understand and modify the placement is only The homepage:
Code:

$(function() {
   if (_userdata.session_logged_in) {
      // Here will be checked if the chat is within the object tag, if it is, changes to iframe!
      if (jQuery('object#frame_chatbox').length) {
         jQuery('#frame_chatbox').replaceWith('<iframe src="/chatbox/index.forum?archives" id="frame_chatbox" scrolling="yes" width="100%" height="100%" type="text/html" style="border: 0px;" />');
      }
   }
});

$(window).load(function() {
   if (_userdata.session_logged_in) {
      // Calls the customization feature of the chat...
      chatFunction();

      // Here is the solution to a problem: When the iframe is changed, the function is called again!
      $('#frame_chatbox').load(function() {
         chatFunction();
      });
   }
});

// Function for customizing the chat.
function chatFunction() {
   var oIframe = (document.getElementById("frame_chatbox").contentWindow.document || document.getElementById("frame_chatbox").contentDocument),
      script = oIframe.createElement("script"),
      chatbox_script = function() {
         window.smile = {
            Load: function() {
               jQuery.ajax({
                  url: "/post?mode=smilies",
                  cache: true,
                  type: "get",
                  dataType: "text",
                  success: function(response, status, xhr) {
                     if (xhr.status == 200) {
                        var htmlSmile = $("<div>" + response + "</div>");
                        htmlSmile.find("#smilies_categ, p, span").remove();
                        var oTarget = htmlSmile.find("a"),
                           oThis, patt, regex;
                        for (var i = 0, len = oTarget.length; i < len; i++) {
                           oThis = $(oTarget[i]);
                           patt = /\('(.*?)'\)/i.exec(oThis.attr("href"))[1];
                           oThis.attr({
                              href: "#",
                              onclick: "smile.Insert('" + patt + "');return false;"
                           });
                        }
                        /*var aSmiles = [
                        "&phone;", "&starf;", "&hearts;", "&sung;", "&check;",
                        "&boxbox;", "©", "&Jscr;&Sscr;", "&block;", "&blk34;",
                        "&xcirc;", "&star;", "&clubs;", "&cross;", "&Fscr;&Mscr;"
                        ],
                        sSmiles = "<p>";
                        for (var i = 0, len = aSmiles.length; i < len; i++) {
                        sSmiles += "<a href='#' onclick='smile.Insert("" + aSmiles[i] + "");return false;'>" + aSmiles[i] + "</a>";
                        }*/
                        jQuery("#chat-smiles-show").html(
                           htmlSmile.find("#simple-wrap, tbody:last").html()
                        );
                     }
                  }
               });
               jQuery("head").append(
                  "<style type='text/css'>" +
                  "#chat-smiles-show {" +
                  " background: none no-repeat scroll center center rgb(255, 255, 255);" +
                  " border: 2px solid #d2d2d2;" +
                  " height: 250px;" +
                  " overflow: auto;" +
                  " padding-top: 6px;" +
                  " position: absolute;" +
                  " width: 225px;" +
                  " z-index: 99999;" +
                  "}" +
                  "#chat-smiles-show > p {" +
                  " margin: 0;" +
                  "}" +
                  "#chat-smiles-show p a {" +
                  " margin-bottom: 14px;" +
                  "}" +
                  "#chat-smiles-show a {" +
                  " display: inline-block;" +
                  " font-size: 18px;" +
                  " margin-bottom: 5px;" +
                  " margin-left: 10px;" +
                  " text-decoration: none;" +
                  "}" +
                  "</style>"
               );
               jQuery("body").append("<div id='chat-smiles-show' style='display: none;'></div>");
            },

            Show: function(event) {
               var elenPos = jQuery("#divsmilies"),
                  target = jQuery("#chat-smiles-show");
               target.css({
                  "left": (elenPos.offset().left + elenPos.outerWidth()) - target.outerWidth(),
                  "top": elenPos.offset().top - target.outerHeight()
               });
               return (target[0].style.display == "none") ? target.fadeIn("fast") : target.fadeOut("fast");
            },

            Insert: function(smile) {
               var id = document.getElementById("message");
               id.focus();
               id.value += " " + smile + " ";
               document.getElementById("chat-smiles-show").style.display = "none";
            }
         };

         smile.Load();

         $("#divsmilies").unbind("click").bind("click", function(event) {
            smile.Show(event);
         });
      };
   script.type = "text/javascript";
   script.innerHTML = "(" + chatbox_script.toString() + ")();";
   oIframe.getElementsByTagName("head")[0].appendChild(script);
}

Result:
Chatbox: Smile's window integrated into the chat window! SsrzQ1N

Someone would have more ideas to add to the code?

JS
JScript
JScript
Forumember

Male Posts : 741
Reputation : 175
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Chatbox: Smile's window integrated into the chat window! Empty Re: Chatbox: Smile's window integrated into the chat window!

Post by mist3r0us_b0y January 12th 2016, 10:21 am

i tried this to add in punbb but faild any thing wrong sir ?

hope i get a reply

thanks
mist3r0us_b0y
mist3r0us_b0y
Forumember

Male Posts : 747
Reputation : 19
Language : english

http://sh.st/nJRXG

Back to top Go down

Chatbox: Smile's window integrated into the chat window! Empty Re: Chatbox: Smile's window integrated into the chat window!

Post by SLGray February 23rd 2017, 8:05 am

This will no longer be supported by JScript: https://help.forumotion.com/t151137-in-memory-of-jscript-joao-carlos.


Chatbox: Smile's window integrated into the chat window! 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 : 51512
Reputation : 3519
Language : English
Location : United States

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

Back to top Go down

Back to top

- Similar topics

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