library/ESign/js/jquery.esign.js

   1 /**
   2  * jQuery plugin to enable esign functionality on a DOM object.
   3  * Pass in a selector to enable esign on the objects that match
   4  *
   5  * Copyright (C) 2013 OEMR 501c3 www.oemr.org
   6  *
   7  * LICENSE: This program is free software; you can redistribute it and/or
   8  * modify it under the terms of the GNU General Public License
   9  * as published by the Free Software Foundation; either version 3
  10  * of the License, or (at your option) any later version.
  11  * This program is distributed in the hope that it will be useful,
  12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  14  * GNU General Public License for more details.
  15  * You should have received a copy of the GNU General Public License
  16  * along with this program. If not, see <http://opensource.org/licenses/gpl-license.php>;.
  17  *
  18  * @package OpenEMR
  19  * @author  Ken Chapple <ken@mi-squared.com>
  20  * @author  Medical Information Integration, LLC
  21  * @link    http://www.open-emr.org
  22  **/
  23
  24 (function( $ ) {
  25
  26         $.fn.esign = function( customSettings, customEvents ) {
  27
  28                 // Initialize settings
  29                 var settings = $.extend({
  30
  31                         // These are the defaults.
  32                         module : "default",
  33                         baseUrl : "/interface/esign/index.php",
  34                         logViewAction : "/interface/esign/index.php?method=esign_log_view",
  35                         formViewAction : "/interface/esign/index.php?method=esign_form_view",
  36                         formSubmitAction : "/interface/esign/index.php?method=esign_form_submit"
  37                 }, customSettings );
  38
  39                 var events = $.extend({
  40
  41                         afterFormSuccess : function( response ) {
  42                                 var logId = "esign-signature-log-"+response.formDir+"-"+response.formId;
  43                                 $.post( settings.logViewAction, response, function( html ) {
  44                                         $("#"+logId).replaceWith( html );
  45                                 });
  46                                 var editButtonId = "form-edit-button-"+response.formDir+"-"+response.formId;
  47                                 $("#"+editButtonId).replaceWith( response.editButtonHtml );
  48                         }
  49                 }, customEvents );
  50
  51                 // Set up the page with the masking div and form container
  52                 $('body').append( "<div id='esign-mask-content' class='window rounded'></div>" );
  53                 $('body').append( "<div id='esign-mask'></div>" );
  54
  55                 // Initialize mask event handlers
  56                 $(document).on( 'click', '#esign-mask', function() {
  57                         $(this).hide();
  58                         $('.window').hide();
  59                         return false;
  60                 });
  61
  62                 $(window).resize( function() {
  63
  64                         var box = $('.window');
  65
  66                 //Get the screen height and width
  67                 var maskHeight = $(document).height();
  68                 var maskWidth = $(window).width();
  69
  70                 //Set height and width to mask to fill up the whole screen
  71                 $('#esign-mask').css({'width':maskWidth,'height':maskHeight});
  72
  73                 //Get the window height and width
  74                         var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;
  75
  76                 //Set the popup window to center
  77                 box.css('top',  y/2 - box.height()/2);
  78                 box.css('left', x/2 - box.width()/2);
  79
  80                 return false;
  81                 });
  82
  83                 // Initialize the signature form event handlers
  84             $(document).on( 'click', '#esign-back-button', function( e ) {
  85
  86                 e.preventDefault();
  87                 $(".window").hide();
  88                 $("#esign-mask").hide();
  89
  90                 return false;
  91             });
  92
  93             $(document).on( 'click', '#esign-sign-button-'+settings.module, function( e ) {
  94
  95                 e.preventDefault();
  96                 var formData = $('#esign-signature-form').serialize();
  97                 $.post(
  98                         settings.formSubmitAction,
  99                         formData,
 100                         function( response ) {
 101                                 if ( response.status != 'success' ) {
 102                                         $("#esign-form-error-container").remove();
 103                                         $("#esign-mask-content").find("form").append("<div id='esign-form-error-container' class='error'>"+response.message+"</div>");
 104                                 } else {
 105                                         // Close the form and refresh the log if it's on the screen
 106                                         $(".window").hide();
 107                                 $("#esign-mask").hide();
 108                                 events.afterFormSuccess( response );
 109                                 }
 110                         },
 111                         'json'
 112                 );
 113
 114                 return false;
 115             });
 116
 117                 function initElement( element ) {
 118
 119                         // Override the anchor
 120                         element.attr( 'href', '#esign-mask-content' );
 121
 122                         element.click( function( e ) {
 123
 124                                 e.preventDefault();
 125
 126                                 //Get the screen height and width
 127                                 var maskHeight = $(document).height();
 128                                 var maskWidth = $(window).width();
 129
 130                                 // Set heigth and width to mask to fill up the whole screen
 131                                 $('#esign-mask').css({'width':maskWidth,'height':maskHeight});
 132
 133                                 //transition effect
 134                                 $('#esign-mask').fadeIn(200);
 135                                 $('#esign-mask').fadeTo("fast",0.5);
 136
 137                                 // Get the window height (y) and width (x)
 138                                 var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;
 139
 140                                 //Set the popup window to center
 141                                 $('#esign-mask-content').css( 'top', Math.min( y/4-$('#esign-mask-content').height()/4, 100 ) );
 142                                 $('#esign-mask-content').css( 'left', x/2-$('#esign-mask-content').width()/2 );
 143
 144                                 // Get a list of all the data-* attributes
 145                                 var params = element.data();
 146
 147                                 // Load the form
 148                                 $.post( settings.formViewAction, params, function( response ) {
 149                                         $('#esign-mask-content').html( response );
 150                                 });
 151
 152                                 //transition effect
 153                                 $('#esign-mask-content').fadeIn(200);
 154                     });
 155
 156                         return false;
 157                 }
 158
 159                 return this.each( function() {
 160                         var element = $(this);
 161                 initElement( element );
 162         });
 163         };
 164
 165 }( jQuery ));