Opened 7 years ago
Closed 7 years ago
#8935 closed bug (notabug)
can't not create a rectangle with ui.boxer (widget)
| Reported by: | ankit.sanghvi | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.10.0 |
| Component: | ui.widget | Version: | 1.9.2 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
if i am using following with 1.7.2 ui then i can draw rectanlge with mouse events
Boxer = $.extend({}, $.ui.mouse, {
_init: function () {
this.element.addClass("ui-boxer"); this.dragged = false; console.log('start'); this._mouseInit();
this.helper = $(document.createElement('div'))
.css({ border: '1px dotted black' }) .addClass("ui-boxer-helper");
},
init: function () {
this.element.addClass("ui-boxer"); this.dragged = false; console.log('start'); this._mouseInit();
this.helper = $(document.createElement('div'))
.css({ border: '1px dotted black' }) .addClass("ui-boxer-helper");
},
destroy: function () {
this.element.removeClass("ui-boxer ui-boxer-disabled").removeData("boxer").unbind(".boxer"); this._mouseDestroy();
return this;
},
_mouseStart: function (event) {
var self = this;
this.opos = [event.pageX, event.pageY];
if (this.options.disabled)
return;
var options = this.options;
this._trigger("start", event);
$(options.appendTo).append(this.helper);
this.helper.css({
"z-index": 100, "position": "absolute", "left": event.clientX, "top": event.clientY, "width": 0, "height": 0
});
},
_mouseDrag: function (event) {
var self = this; this.dragged = true;
if (this.options.disabled)
return;
var options = this.options;
var x1 = this.opos[0], y1 = this.opos[1], x2 = event.pageX, y2 = event.pageY; if (x1 > x2) { var tmp = x2; x2 = x1; x1 = tmp; } if (y1 > y2) { var tmp = y2; y2 = y1; y1 = tmp; } this.helper.css({ left: x1, top: y1, width: x2 - x1, height: y2 - y1 });
this._trigger("drag", event);
return false;
},
_mouseStop: function (event) {
var self = this;
this.dragged = false;
var options = this.options;
var clone = this.helper.clone().removeClass('ui-boxer-helper').appendTo(this.element);
this._trigger("stop", event, { box: clone });
this.helper.remove();
return false;
}
});
$.widget("ui.boxer", Boxer);
but if i am using 1.9.2 with following than i can't
$.widget("ui.boxer", $.ui.mouse, {
_init: function () {
this.element.addClass("ui-boxer"); this.dragged = false; console.log('start'); this._mouseInit();
this.helper = $(document.createElement('div'))
.css({ border: '1px dotted black' }) .addClass("ui-boxer-helper");
},
destroy: function () {
this.element.removeClass("ui-boxer ui-boxer-disabled").removeData("boxer").unbind(".boxer"); this._mouseDestroy();
return this;
},
_mouseStart: function (event) {
var self = this;
this.opos = [event.pageX, event.pageY];
if (this.options.disabled)
return;
var options = this.options;
this._trigger("start", event);
$(options.appendTo).append(this.helper);
this.helper.css({
"z-index": 100, "position": "absolute", "left": event.clientX, "top": event.clientY, "width": 0, "height": 0
});
},
_mouseDrag: function (event) {
var self = this; this.dragged = true;
if (this.options.disabled)
return;
var options = this.options;
var x1 = this.opos[0], y1 = this.opos[1], x2 = event.pageX, y2 = event.pageY; if (x1 > x2) { var tmp = x2; x2 = x1; x1 = tmp; } if (y1 > y2) { var tmp = y2; y2 = y1; y1 = tmp; } this.helper.css({ left: x1, top: y1, width: x2 - x1, height: y2 - y1 });
this._trigger("drag", event);
return false;
},
_mouseStop: function (event) {
var self = this;
this.dragged = false;
var options = this.options;
var clone = this.helper.clone().removeClass('ui-boxer-helper').appendTo(this.element);
this._trigger("stop", event, { box: clone });
this.helper.remove();
return false;
}
});
Unfortunately we cannot debug an issue this vague. Please either report a specific bug or ask for help on the forums.