Smiley.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. /*
  2. Copyright (c) 2004-2012, The Dojo Foundation All Rights Reserved.
  3. Available via Academic Free License >= 2.1 OR the modified BSD license.
  4. see: http://dojotoolkit.org/license for details
  5. */
  6. if(!dojo._hasResource["dojox.editor.plugins.Smiley"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
  7. dojo._hasResource["dojox.editor.plugins.Smiley"] = true;
  8. dojo.provide("dojox.editor.plugins.Smiley");
  9. dojo.require("dijit._editor._Plugin");
  10. dojo.require("dijit.form.ToggleButton");
  11. dojo.require("dijit.form.DropDownButton");
  12. dojo.require("dojox.editor.plugins._SmileyPalette");
  13. dojo.require("dojo.i18n");
  14. dojo.require("dojox.html.format");
  15. dojo.requireLocalization("dojox.editor.plugins", "Smiley", null, "ROOT,ar,bg,ca,cs,da,de,el,es,fi,fr,he,hr,hu,it,ja,kk,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw");
  16. dojo.experimental("dojox.editor.plugins.Smiley");
  17. dojo.declare("dojox.editor.plugins.Smiley", dijit._editor._Plugin, {
  18. // summary:
  19. // This plugin allows the user to select from emoticons or "smileys"
  20. // to insert at the current cursor position.
  21. //
  22. // description:
  23. // The commands provided by this plugin are:
  24. // * smiley - inserts the selected emoticon
  25. // iconClassPrefix: [const] String
  26. // The CSS class name for the button node is formed from `iconClassPrefix` and `command`
  27. iconClassPrefix: "dijitAdditionalEditorIcon",
  28. // a marker for emoticon wrap like [:-)] for regexp convienent
  29. // when a message which contains an emoticon stored in a database or view source, this marker include also
  30. // but when user enter an emoticon by key board, user don't need to enter this marker.
  31. // also emoticon definition character set can not contains this marker
  32. emoticonMarker: '[]',
  33. emoticonImageClass: 'dojoEditorEmoticon',
  34. _initButton: function(){
  35. // summary:
  36. //
  37. this.dropDown = new dojox.editor.plugins._SmileyPalette();
  38. this.connect(this.dropDown, "onChange", function(ascii){
  39. this.button.closeDropDown();
  40. this.editor.focus();
  41. //
  42. ascii = this.emoticonMarker.charAt(0) + ascii + this.emoticonMarker.charAt(1);
  43. this.editor.execCommand("inserthtml", ascii);
  44. });
  45. this.i18n = dojo.i18n.getLocalization("dojox.editor.plugins", "Smiley");
  46. this.button = new dijit.form.DropDownButton({
  47. label: this.i18n.smiley,
  48. showLabel: false,
  49. iconClass: this.iconClassPrefix + " " + this.iconClassPrefix + "Smiley",
  50. tabIndex: "-1",
  51. dropDown: this.dropDown
  52. });
  53. this.emoticonImageRegexp = new RegExp("class=(\"|\')" + this.emoticonImageClass + "(\"|\')");
  54. },
  55. updateState: function(){
  56. // summary:
  57. // Over-ride for button state control for disabled to work.
  58. this.button.set("disabled", this.get("disabled"));
  59. },
  60. setEditor: function(editor){
  61. // summary:
  62. // Over-ride for the setting of the editor.
  63. // editor: Object
  64. // The editor to configure for this plugin to use.
  65. this.editor = editor;
  66. this._initButton();
  67. this.editor.contentPreFilters.push(dojo.hitch(this, this._preFilterEntities));
  68. this.editor.contentPostFilters.push(dojo.hitch(this, this._postFilterEntities));
  69. },
  70. _preFilterEntities: function(/*String content passed in*/ value){
  71. // summary:
  72. // A function to filter out emoticons into their UTF-8 character form
  73. // displayed in the editor. It gets registered with the preFilters
  74. // of the editor.
  75. // tags:
  76. // private.
  77. //
  78. //
  79. return value.replace(/\[([^\]]*)\]/g, dojo.hitch(this, this._decode));
  80. },
  81. _postFilterEntities: function(/*String content passed in*/ value){
  82. // summary:
  83. // A function to filter out emoticons into encoded form so they
  84. // are properly displayed in the editor. It gets registered with the
  85. // postFilters of the editor.
  86. // tags:
  87. // private.
  88. return value.replace(/<img [^>]*>/gi, dojo.hitch(this, this._encode));
  89. },
  90. _decode: function(str, ascii){
  91. // summary:
  92. // Pre-filter for editor to convert strings like [:-)] into an <img> of the corresponding smiley
  93. var emoticon = dojox.editor.plugins.Emoticon.fromAscii(ascii);
  94. return emoticon ? emoticon.imgHtml(this.emoticonImageClass) : str;
  95. },
  96. _encode: function(str){
  97. // summary:
  98. // Post-filter for editor to convert <img> nodes of smileys into strings like [:-)]
  99. // Each <img> node has an alt tag with it's ascii representation, so just use that.
  100. // TODO: wouldn't this be easier as a postDomFilter ?
  101. if(str.search(this.emoticonImageRegexp) > -1){
  102. return this.emoticonMarker.charAt(0) + str.replace(/(<img [^>]*)alt="([^"]*)"([^>]*>)/, "$2") + this.emoticonMarker.charAt(1);
  103. }
  104. else{
  105. return str;
  106. }
  107. }
  108. });
  109. // Register this plugin.
  110. dojo.subscribe(dijit._scopeName + ".Editor.getPlugin",null,function(o){
  111. if(o.plugin){ return; }
  112. if(o.args.name === "smiley"){
  113. o.plugin = new dojox.editor.plugins.Smiley();
  114. }
  115. });
  116. }