Jump to content


Photo

Text On Canvas

canvas html5 javascript text

  • Please log in to reply
2 replies to this topic

#1 bunnyali2013

bunnyali2013

    Advanced Member

  • Members
  • PipPipPip
  • 44 posts

Posted 20 November 2012 - 11:23 AM

Hi, I have an IFrame. Good. And I have a Canvas as well. Good again!

The user can write on the IFrame as I set the design mode ON. I am using document.execcomand to do the stuff, just like a simple text editor. I do not have issues on this. Here are my questions:

1/ What I want is, how to make the text written in the IFrame, appears on the Canvas? I mean, when the user is typing in the IFrame, the text is appearing simultaneously on the Canvas. If the user changes the text color, font color, bold, italic or whatever, of course the text also changes on the Canvas simultaneously. How to do that?

2/ Can I make all the elements draggable and resizable in the Canvas? I mean the text or anything but NOT the canvas?


Help!

#2 Adam

Adam

    Advanced Member

  • Gurus
  • 5,686 posts
  • LocationSheffield / UK

Posted 20 November 2012 - 12:41 PM

Hmm well at a guess, I would say given canvas and execCommand are two completely different things, you'll not be able to have the changes "automatically" reflected. You will need to write a common interface you can use to fire commands, that will in the background translate each command into instructions to the canvas and execCommand() calls.

#3 bunnyali2013

bunnyali2013

    Advanced Member

  • Members
  • PipPipPip
  • 44 posts

Posted 20 November 2012 - 01:07 PM

Ok, I have an idea, I will use a DIV. I will set it to contenteditable = true. Then I will write my text in it using document.execcomand. After that, I will drag and drop the text written to place it on the Canvas.

I think its a good idea. I want to know now, how to drag and drop only the content in a DIV? Not the entire DIV but only the content like the text for instance. I know how how to make the drag and drop using JQuery UI, but not something in a container.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com