ImageClipper.js 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. MWF.xApplication.ForumDocument = MWF.xApplication.ForumDocument || {};
  2. MWF.require("MWF.widget.ImageClipper", null, false);
  3. MWF.xApplication.ForumDocument.ImageClipper = new Class({
  4. Implements: [Options, Events],
  5. Extends: MWF.widget.Common,
  6. options: {
  7. "reference" : "",
  8. "referenceType" : "",
  9. "imageUrl" : "",
  10. "description" : "",
  11. "title": "Select Image",
  12. "style": "default",
  13. "aspectRatio": 1.5
  14. },
  15. initialize: function(designer, options){
  16. debugger;
  17. this.setOptions(options);
  18. this.app = designer;
  19. this.path = "/x_component_ForumDocument/$ImageClipper/";
  20. this.cssPath = "/x_component_ForumDocument/$ImageClipper/"+this.options.style+"/css.wcss";
  21. this._loadCss();
  22. },
  23. load: function(data){
  24. this.data = data;
  25. var options = {};
  26. var width = "668";
  27. var height = "510";
  28. width = width.toInt();
  29. height = height.toInt();
  30. var size = this.app.content.getSize();
  31. var x = (size.x-width)/2;
  32. var y = (size.y-height)/2;
  33. if (x<0) x = 0;
  34. if (y<0) y = 0;
  35. if (layout.mobile){
  36. x = 20;
  37. y = 0;
  38. }
  39. var _self = this;
  40. MWF.require("MWF.xDesktop.Dialog", function() {
  41. var dlg = new MWF.xDesktop.Dialog({
  42. "title": this.options.title || "Select Image",
  43. "style": options.style || "image",
  44. "top": y,
  45. "left": x - 20,
  46. "fromTop": y,
  47. "fromLeft": x - 20,
  48. "width": width,
  49. "height": height,
  50. "html": "<div></div>",
  51. "maskNode": this.app.content,
  52. "container": this.app.content,
  53. "buttonList": [
  54. {
  55. "text": MWF.LP.process.button.ok,
  56. "action": function () {
  57. _self.image.uploadImage( function( json ){
  58. _self.imageSrc = MWF.xDesktop.getImageSrc( json.id );
  59. _self.imageId = json.id;
  60. _self.fireEvent("change");
  61. this.close();
  62. }.bind(this));
  63. }
  64. },
  65. {
  66. "text": MWF.LP.process.button.cancel,
  67. "action": function () {
  68. this.close();
  69. }
  70. }
  71. ]
  72. });
  73. dlg.show();
  74. this.image = new MWF.widget.ImageClipper(dlg.content.getFirst(), {
  75. "aspectRatio": this.options.aspectRatio,
  76. "description" : this.options.description,
  77. "imageUrl" : this.options.imageUrl,
  78. "reference" : this.options.reference,
  79. "referenceType": this.options.referenceType,
  80. "resetEnable" : true
  81. });
  82. this.image.load(this.data);
  83. }.bind(this))
  84. }
  85. });