jquery - Fabric.js Image.fromURL not working in Firefox -


i using fabric.js , jquery ui drag , drop scene creator. when drag , drop image canvas on chrome works fine. however, when drag , drop image on firefox nothing , following error in console:

typeerror: t undefined 

here code:

// html  <canvas id="scene"></canvas>  // draggable setup  $('.scene-item').draggable({     helper: 'clone',     appendto: 'body',     containment: 'window',     scroll: false,     zindex: 9999 });  // drop setup  var canvas = new fabric.canvas('scene');  canvas.setdimensions({         width: '800px',         height: '500px'     }, {         cssonly: true }); document.getelementbyid("scene").fabric = canvas;  canvas.on({     'object:moving': function(e) {         e.target.opacity = 0.5;     },     "object:modified": function(e) {         e.target.opacity = 1;     } });       $('#scene').droppable({         drop: function(e, ui) {             if ($(e.target).attr('id') === 'scene') {                 var pointer = canvas.getpointer();                 fabric.image.fromurl(ui.draggable[0].currentsrc, function (img) {                     console.log(img);                     img.set({                         left: pointer.x - 20,                         top: pointer.y - 20,                         width: 52,                         height: 52,                         scale: 0.1                     });                     //canvas.clear();                     canvas.add(img);                     canvas.renderall();                 });             }         }      }); 

any ideas happening?

edit:

i used regular fabric.js instead of minified version , error was:

typeerror: event undefined 

i figured out wrong. not passing event getpointer() function.

this code works fine:

$('#scene').droppable({         drop: function(e, ui) {             if ($(e.target).attr('id') === 'scene') {                 var pointer = canvas.getpointer(e);                 fabric.image.fromurl(ui.draggable[0].currentsrc, function (img) {                     img.filters.push(new fabric.image.filters.resize({scalex: 0.2, scaley: 0.2}));                     img.set({                         left: pointer.x - 20,                         top: pointer.y - 20,                         width: 52,                         height: 52                     });                     canvas.clear();                     canvas.add(img);                     canvas.renderall();                 });             }         }      }); 

Comments

Popular posts from this blog

node.js - Using Node without global install -

How to access a php class file from PHPFox framework into javascript code written in simple HTML file? -

java - Null response to php query in android, even though php works properly -