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

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:


Someone would have more ideas to add to the code?

JS

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

hope i get a reply

thanks

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