📜 ⬆️ ⬇️

Implementation of the author's autograph session for iBooks

I work in a small publishing house. And, after the release of the paper version of the children's book, they decided to make its electronic version for the iPad. Not an application, but a book in eEub format.
We agreed on a presentation in a large shopping center: paper books are sold, the author signs them, the iPad version is downloaded by visitors of the center, plus they are also played with animation on the provided iPads.
But, if the author signs paper books, why not sign an e-book?
The idea is new and original, but is it realizable?
I will say right away that it was not possible to implement the signing, and this is why ...

Technically, everything is simple - we take the induction stylus, in the book we place the canvas-block with drawing handlers and two secret places, for erasing the unsuccessfully written and for its preservation. We will save in LocalStorage.

C writing texts in the book of problems did not arise. The code for drawing on the canvas is full internet; the main “trick” is to draw with lines, not points. The drawing code was underlined here .
')
We will save the canvas with getImageData() .
Since our signature is black and white, you can save not all three RGB values, but only one. Then we transform the resulting number into a character code and get a hefty line describing our picture.

To save used jQuery-plugin jStorage .
Fine. Everything works, really on the computer. We transfer to the iPad.

Written text is not restored. We set alert'y, we look. It turns out that the drawing is not saved. We simplify the code, replace the jStorage plugin with a banal, but definitely working - LocalStorage.name=”-” .
Does not work. Google It turns out that somewhere between iBooks 1.3 and iBooks 2 - Apple has cut off support for LocalStorage, but there is support for cookies.

Our canvas is 767x600 pixels in size, which is more than 400 kilobytes of data.
A cookie can save only 4 kilobytes. So let's cut these pictures into pieces of 4K.
Cook can be 20 pieces per site. Just in case we create a 150 cookie in a cycle - it works.
We are trying to distribute these images in them - it does not work. It turns out that the total capacity of cookies is 20 * 4096, i.e., about 80 kilobytes, and the cookie may not be 20, but more, but with less data, so that it does not exceed 80 kilobytes.
Along the way, we otbrebaem another problem - Apache, under which the debugged version ceases to open the page from which such large headers are transferred, you have to clean the cookies every time.

It is necessary to reduce the volume of the picture. You can encode each point not byte, but by bit, but the picture from grayscale becomes black and white, which is ugly.
We google, we find library Canvas2Image . The library returns either an object of type image, or saves the canvas to disk in jpeg, png or bmp format. We don't need the object, we need clean data, so an unnecessary piece was thrown out of the library code. Now we have base64 encoded png.
The size of the picture starts to fluctuate between 20 and 50 KB, which suits us. The author will receive instructions so as not to be interested in the wishes of the readers.

We try to restore the drawn ... Use for this the drawImage() function from canvas. Hmm, recovers from the second time. The problem is that the image object that needs to be fed to the drawImage does not have time to fill with data. For me it was unexpected, because as the image.src base64 data was used, which already seems to be loaded.
The problem was solved by calling drawImage on the load event for the image.

Check on your computer - it works.
Transferring to ipad - does not work. Ory use alert'y. The picture is saved successfully, it is restored - no. Put an alert to view each cookie. The first cookie is read, the second is gone, the javascript in iBooks seems to be falling.
We try to make cookies smaller. To remove the old ones - I had to remove and re-install iBooks.
Now everything stops after the second cookie is 200 bytes. It seems that the size of the data for cookies is substantially less than in the browser. Fail ...

At this point, the development was discontinued. It would be possible to find out the size of the iBooks storage, but debugging the interactive book on the device is too tedious and, it seems, is hopeless in this case. The author will have to sign only paper books ...

Source: https://habr.com/ru/post/139733/


All Articles