Menu

Freehand Drawing Widget for Layout Based Visit Forms

Developers
Rod Roark
2016-07-03
2016-07-04
  • Rod Roark

    Rod Roark - 2016-07-03

    This will be useful for docs who want to draw on images of a body or body part to show the location and nature of some ailment. The optional starting image can be stored in the sites/default/images/ directory and is specified for the layout field by putting "image=imagename" in its Description column.

    There are 2 commits, the first to bring in the LiterallyCanvas and React JavaScript libraries. Code is here:

    https://github.com/sunsetsystems/openemr/commits/draw

    The widget itself is demonstrated here:

    http://literallycanvas.com/

    Rod
    http://www.sunsetsystems.com/

     
  • Brady Miller

    Brady Miller - 2016-07-04

    Hi Rod,

    This looks very nice. Will need to figure out a way to support translations of the terms in LiterallyCanvas.

    -brady
    OpenEMR

     
  • Rod Roark

    Rod Roark - 2016-07-04

    Oh yes, there's an API function for that. I'll figure out what to do with it. Thanks.

    Rod
    http://www.sunsetsystems.com/

     
  • Rod Roark

    Rod Roark - 2016-07-04

    I added a commit for the translations.

    Rod
    http://www.sunsetsystems.com/

     
  • aperez

    aperez - 2017-03-08

    @Rod
    Well I placed a file (jpg and png) into sites/default/images/ directory in placed "image=imagename" in its Description column in the LBF.
    No Image is displayed.
    I also tested image=kidney.png, image=kidney.jpg, "image=kidney.png", "image=kidney.jpg".

    All I find in Apache Error log is this.
    Undefined variable: is_lbf in /var/www/openemr/interface/forms/LBF/new.php on line 484, referer: http://localhost/openemr/interface/patient_file/encounter/forms.php
    [Wed Mar 08 19:51:48.575920 2017] [:error] [pid 3115] [client 127.0.0.1:55612]
    PHP Notice: Undefined variable: is_lbf in /var/www/openemr/interface/forms/LBF/new.php on line 488

    Any Idea?

    Ubuntu 14.04
    OpenEMR 5.0.0(1)

     
  • Rod Roark

    Rod Roark - 2017-03-09

    You might check the Apache access log while opening the form to see if it's trying to load the image. Also make sure you're opening a new form and not an existing one, so it will bring in the default image and not one that may already be in the form data.

    No need to put quotes around "image=imagename".

     
  • aperez

    aperez - 2017-03-09

    Nope still a no go... Here is what I found in the access log. Image is Kidney.jpg. All I get is a is a small white box in the middle of the Literally Canvas app. FYI: And in the white box is where I can draw.
    Couple of Questions:
    Any Specific file types (jpg,png,bmp...)?
    Any Maximum or Minimum file sizes?
    Any other file specs?

    127.0.0.1 - - [09/Mar/2017:09:50:43 -0400] "GET /openemr/sites/default/images/Kidney.jpg HTTP/1.1" 200 50178 "http://localhost/openemr/interface/patient_file/encounter/load_form.php?formname=LBFKidney" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:52.0) Gecko/20100101 Firefox/52.0"
    127.0.0.1 - - [09/Mar/2017:09:50:46 -0400] "POST /openemr/library/ajax/dated_reminders_counter.php HTTP/1.1" 200 375 "http://localhost/openemr/interface/main/left_nav.php" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:52.0) Gecko/20100101 Firefox/52.0"
    127.0.0.1 - - [09/Mar/2017:09:50:46 -0400] "POST /openemr/library/ajax/execute_background_services.php HTTP/1.1" 200 376 "http://localhost/openemr/interface/main/left_nav.php" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:52.0) Gecko/20100101 Firefox/52.0"
    127.0.0.1 - - [09/Mar/2017:09:50:51 -0400] "GET /openemr/interface/main/daemon_frame.php HTTP/1.1" 200 744 "http://localhost/openemr/interface/main/main_screen.php?auth=login&site=default" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:52.0) Gecko/20100101 Firefox/52.0"
    127.0.0.1 - - [09/Mar/2017:09:50:53 -0400] "POST /openemr/interface/main/dated_reminders/dated_reminders.php HTTP/1.1" 200 415 "http://localhost/openemr/interface/main/messages/messages.php?form_active=1" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:52.0) Gecko/20100101 Firefox/52.0"

     
  • Rod Roark

    Rod Roark - 2017-03-09

    What do you have for width and height in the Size column of the layout? Unlike with other field types, these are image dimensions in pixels.

    I think file types supported would be those supported by the browser. Jpeg and PNG should definitely be among those.

     
  • aperez

    aperez - 2017-03-09

    Ooooh....that never even crossed my mind.
    So I need to consider image size in both file and LBF.
    And speaking in pixels...1296x728 is too large (see attachment).
    What would you recommend as sizes go.

     
  • Rod Roark

    Rod Roark - 2017-03-09

    I think the last one I did was 300x400. I'm sure some more improvements could be done for flexibility.

     
  • aperez

    aperez - 2017-03-09

    Ok I'll test a few....
    Thanks a million!

     
  • aperez

    aperez - 2017-03-09

    Ok so 600x400 is adecuate...you can go a bit wider but no much higher.

    Next problem...Modified image in LBF does not display. Not in Encounter Summary (Show up as Image not found) less so in Edit.
    Where is it stored?

     
  • Rod Roark

    Rod Roark - 2017-03-09

    The form's data, including images, are stored in the lbf_data table. Look for rows where field_value starts with "data:image/".

     
  • aperez

    aperez - 2017-03-10

    Yup entries are there...
    The above screenshot is from chrome, FireFox gives back less. IE (For the same screen shot above) give back an unknow protocol and type not available.

    Still haven't figured it out.
    Ubuntu 14.04
    PHP 5
    OpenEMR 5.0.0(1)

     
  • Rod Roark

    Rod Roark - 2017-03-10

    I'm guessing you are running into a size limit with data URLs. That will be browser-dependent. You can confirm that by trying a smaller image.

    Probably what needs to happen is a code fix to create a temporary image file for these cases.

     
  • aperez

    aperez - 2017-03-15

    Did a new install. Began resizing the image by 50px increments. I'm down to 400x233 and still no go. I did notice that if I set the Max Size to any value other than Zero I get
    ERROR: Field 'Kidney' is too long: data:image/png;base64,iVBORw0KGgoAAAA...
    But now it does pull up the image on a re-edit but does not store the changes.

    I'm down to 64 MaxSize.

    FYI: I have tested with Firefox, Chrome and IE.

     
  • Rod Roark

    Rod Roark - 2017-03-15

    OK could be something broke it. I'll test when I get some time. Thanks.

     

Log in to post a comment.