Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

IText/Textbox - The first character is ignored when you type #2819

Closed
MajaToplicanin opened this issue Feb 29, 2016 · 5 comments
Closed

IText/Textbox - The first character is ignored when you type #2819

MajaToplicanin opened this issue Feb 29, 2016 · 5 comments

Comments

@MajaToplicanin
Copy link

Version

1.6.0

Test Case

http://jsfiddle.net/Da7SP/16/

Steps to reproduce

text is my Itext class
canvas.add(text);
canvas.setActiveObject(text);
text.selectAll();
text.enterEditing();
text.hiddenTextarea.focus();

Expected Behavior

Actual Behavior

My Itext object is selected and when i start typing first character don't show.This is worked earlier,but I update my fabric.js library some day before(when you update issues for retina displays), and now don't work again. My fabric.js version is:"1.6.0-rc.1". This is related on this issue : #2451.

@asturur
Copy link
Member

asturur commented Feb 29, 2016

Closed as not reproducible on test case.

@asturur asturur closed this as completed Feb 29, 2016
@MajaToplicanin
Copy link
Author

Ok, when i use library which you send me the first character show, but don't work download on retina displays.
Here is my code for download(just don't work on retina displays):
function downloadCanvas(link, canvasId, filename) {
link.href = canvas.toDataURL();
link.download = filename;
}
document.getElementById('download').addEventListener('click', function() {

        if( window.devicePixelRatio !== 1 ){

        var c = canvas.getElement(); 
        var w = c.width, h = c.height;

      // Scale the canvas up by two for retina
      // just like for an image
        c.setAttribute('width', w*window.devicePixelRatio);
        c.setAttribute('height', h*window.devicePixelRatio);

      // then use css to bring it back to regular size
      // or set it here
      //    c.setAttribute('style', 'width="'+w+'"; height="'+h+'";')
      // or jQuery  $(c).css('width', w);
      //      $(c).css('width', w);
      //      $(c).css('height', h);

        // finally set the scale of the context
        c.getContext('2d').scale(window.devicePixelRatio, window.devicePixelRatio);

        }
        downloadCanvas(this, canvas, 'image.png');
    }, false);

@MajaToplicanin
Copy link
Author

Hello,
here is your demo: http://fabricjs.com/kitchensink/.
I execute my code:
// clear canvas
canvas.clear();
var text= new fabric.IText('Make your statement!',
{
fontFamily: 'Open Sans',
left: 10,
top: 20 ,
})
canvas.add(text);
canvas.setActiveObject(text);
text.selectAll();
text.enterEditing();
text.hiddenTextarea.focus();

Here, you can see that the first character is ignored when you type.
Can you check please, this is very important for me?

@asturur
Copy link
Member

asturur commented Mar 9, 2016

Please refer to the jsfiddle and you will see it works.
Probably the fabricjs.com version is older than the github build you linked.

@MajaToplicanin
Copy link
Author

Yes, you are right!
I use fabricjs.com version and there work my functionalities on retina diplays too(just ignored first character when you type)
My problem is : when i introduce library which you send me first character work, but don't work well on retina displays , and i need both features to work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants