Open EMR and AJAX library choice

cfapress wrote on Friday, December 07, 2007:

Hi All (mostly Rod),

There have been hints about including AJAX functionality into OpenEMR. Personally I think it would be a great addition. My experience has been with writing raw AJAX code with Javascript and, most recently, using the Prototype library (http://www.prototypejs.org/). I’ve read another post in the forums about the jQuery library (http://jquery.com/). They are similar in syntax and jQuery looks just as easy to use as Prototype.

I don’t have a preference as to which library is used but I think our fearless leader (Rod?) should make a decision about the library of choice before there are four developers all adding AJAX stuff with different libraries.

What do others have to say on this topic?

Jason

sunsetsystems wrote on Friday, December 07, 2007:

Yes I agree we should stick with just one library.  I would also like to hear from others.

By the way, note there are other ways to do similar things, one of which I have already employed in the “new style” frame layout.  This uses a hidden frame (see interface/main/daemon_frame.php and main_screen.php) to perform background operations.  Very effective without requiring browser support for XMLHttpRequest, but it doesn’t have that cool AJAX name.  :wink:

Rod
www.sunsetsystems.com

bradymiller wrote on Friday, December 07, 2007:

hey,

Nice timing. I’m working on access control administration code using AJAX. I considered native, prototype, sajax, and xajax frameworks; but definitely think JQuery is the most ideal. Easy to use and lots of updates/supports/ and plug ins, so should be around for awhile. And it’s small(45kb or even below 20kb if zipped).

If you want to get an idea of how it works, here’s my source code so far for the ACL administration. Warning you, I’m just learning javascript/JQuery and there still is lots to do, figure out, and clean up. Link to files is below. I’ve only been using with firefox so far.
http://sparmy.com/aclAdminAJAX.zip

To try it:
Do NOT try this on a production server. Ideally use a current CVS version. Php-gacl needs to be installed.
Put the jquery.js, adminacl.php, and adminacl_ajax.php into new directory: /openemr/interface/acl
Replace file /openemr/interface/usergroup/usergroup_navigation.php (puts the acl link into admin menu)
Then go to ACL administration page by clicking ‘ACL’ link in admin menu

If we do go with JQuery, then we should consider putting version in source titles(for example Jquery121.js), since this thing is updated quite frequently and changes are made that could break old code. This would allow us to update to new versions and ensure not breaking old code by keeping the previous sources.

-Brady

markleeds wrote on Saturday, December 08, 2007:

I agree 100% with Brady.  JQuery.

sunsetsystems wrote on Saturday, December 08, 2007:

Doing a bit of googling for "jQuery vs. Prototype" suggests that jQuery is the accepted favorite by a pretty wide margin.  Looks like Drupal, for which I have much respect, is using it, and like OpenEMR it has a GPL v2 licensing option.  So I have no objection to including it in OpenEMR, with the version number in the name as Brady suggests.

Then this begs the question, what would it be used for?  How can we best take advantage of its capabilities?  Obviously we don’t want to use it just for the sake of using it – so what’s the goal?  Specific ideas/examples would be good.  Working towards a consistent overall look-and-feel is also good.

Rod
www.sunsetsystems.com

bradymiller wrote on Saturday, December 08, 2007:

hey,

Check out my above code for an example(ACL administration). Again, this is currently a work in progress, but it’s beginning to have some functionality; I’ve kept the same look-and-feel as OpenEMR.

I agree we shouldn’t use it just to use it. It will add to code complexity(developers will need to know javascript/jquery) and could also argue that time would be better spent on a developing a lot of functions(php) rather than a few luxurious functions(AJAX). But in certain situations, such as ACL editing(complicated), it’s obvious to me that AJAX definitely simplifies the editing process and provides a smoother user experience.

Probably be more manageable to develop a common pattern, for example, keeping client stuff in one file(adminacl.php), and server stuff in another file(adminacl_ajax.php).
Another question that will be raised is should our AJAX code require javascript(Do our new AJAX functions need to be able to fallback to simple php functionality?). Putting this in would even further complicate the code, and probably not worth it(just my humble opinion here).

-Brady

markleeds wrote on Sunday, December 09, 2007:

Regarding AJAX with or without Javascript: AJAX, by definition, requires javascript.  (Asynchronous Javascript And XML).

We should not have to worry about compatibility with old browsers and browsers with javascript turned off.  OpenEMR is a web application, but it is not a public website.  We can dictate what the client configuration should be.

My goal in using JQery, AJAX and Javascript in general is for use in forms.  AJAX allows for interaction of the database without leaving the form.  This can be done without AJAX, but it is more elegant with it and more efficient because the user can continue interacting with the form while data is being submitted or retrieved in the background.  This is the asynchronous part of AJAX. 

Otherwise, javascript allows us to do tricks like hiding parts of a page when they are not needed, which allows for better use of screen real estate.  JQuery has some interesting plugins, like ‘draggable’ which allows for drag and drop functionality.  This may help us in developing a program which is easier to use from a tablet or touch screen pda.  JQuery makes these fancy features more accessible to the average programmer.

The iphone and ipod touch have the full featured safari browser.  This may be an ideal device for EMR use.  The creator of JQuery, John Resig, is also involved in development for safari and the portable apple devices: http://ejohn.org/blog/iphone-tech-talk/

cfapress wrote on Tuesday, December 11, 2007:

Having written Javascript for years without any sort of framework I truly appreciate the features offered by jQuery and Prototype. I recently started with Prototype because writing AJAX calls using the standard XMLHttpRequest code is cumbersome. And I was reading a book about AJAX that used Prototype for all the examples.

Anyway… jQuery looks good. I recommend including it into the codebase for OpenEMR even if it’s not fully utilized at first.

As Mark described, AJAX allows a much more fluid and seemless experience to the user of a web page. I’m using it within our Agency for small time stuff like name look up as the user types or updating select boxes based on checkboxes elsewhere on the page. But it can be used for lots more like drag-and-drop features. Ultimately it could eliminate the frames used in OpenEMR in favor of CSS formatted DIV elements controlled by AJAX objects.

Jason Morrill

bradymiller wrote on Thursday, December 13, 2007:

hey,

Sounds like were going with JQuery. Since I’m working on a module adding phpgacl ACL administration within OpenEMR using jquery/ajax, I had a few questions:

1. Do we want to compress the Jquery library?(I’m voting no for now, since it’s just 44kb to 20bk, and it’s just another possible source of errors)

2. Do we still want to include version in jquery source file(jquery121.js)? (I’m thinking this may be a good idea, since jquery is updated frequently and functions seem to be frequently discontinued)

3. Where do we want to put the library? (/openemr/library/js?)

4. How should we organize newly created ajax functions/objects?
As an example, for the acl administration function I’m working on(check my previous message to download the most updated source if you want). Again, I’m just learning this stuff and now have/plan these files:

adminacl.php
-client side, planning to only put client stuff here(CSS, jquery, ajax calls)
-Goal is to have no php in this file, and change to adminacl.js before committing

adminacl_ajax.php
-Server stuff(also where acl checks are done to ensure security)
-Passes info to client via ajax(via xml, because jquery has excellent processing of xml)
-I’m basically putting all the ajax functions regarding administration of phpgacl acl in this file.

user_functions_ajax.php
-This is not made yet, but planning to put a openemr username collect function here.

So, am wondering if it would be best to put the *_ajax.php files in a specific directory, such as pibrary, to allow use by other pages(for example maybe all the admin stuff will be on one ajax page in the future or if another page wants to use the username collect function)

-Brady

sunsetsystems wrote on Thursday, December 13, 2007:

On Wednesday 12 December 2007 21:52, you wrote:
> 1. Do we want to compress the Jquery library?(I’m voting no for now, since it’s
> just 44kb to 20bk, and it’s just another possible source of errors)

I would say to leave this as an install-time decision, and have both
options available.

> 2. Do we still want to include version in jquery source file(jquery121.js)?
> (I’m thinking this may be a good idea, since jquery is updated frequently and
> functions seem to be frequently discontinued)

I think that’s a good idea.

> 3. Where do we want to put the library? (/openemr/library/js?)

Works for me.

> 4. How should we organize newly created ajax functions/objects?
> As an example, for the acl administration function I’m working on(check my previous
> message to download the most updated source if you want). Again, I’m just learning
> this stuff and now have/plan these files:
>
> adminacl.php
> -client side, planning to only put client stuff here(CSS, jquery, ajax calls)
> -Goal is to have no php in this file, and change to adminacl.js before
> committing

Any special reason to start it as a .php file at all?  It’s good to
put any large amounts of JavaScript into .js files, because then the
browser can cache it.

> adminacl_ajax.php
> -Server stuff(also where acl checks are done to ensure security)
> -Passes info to client via ajax(via xml, because jquery has excellent processing
> of xml)
> -I’m basically putting all the ajax functions regarding administration of phpgacl
> acl in this file.
>
> user_functions_ajax.php
> -This is not made yet, but planning to put a openemr username collect function
> here.

Fine with me, especially for reusable classes or functions.  But try
not to break things up into multiple files needlessly, as that makes
it harder for others to follow.

> So, am wondering if it would be best to put the *_ajax.php files in a specific
> directory, such as pibrary, to allow use by other pages(for example maybe all
> the admin stuff will be on one ajax page in the future or if another page wants
> to use the username collect function)

I guess we’ll have to figure it out as we go along.  Apply common sense,
and strive for simplicity.

Rod
www.sunsetsystems.com

lemonsoftwarero wrote on Saturday, December 22, 2007:

In the DBC System (dutch specific module) we are already used JQuery for AJAX stuff :slight_smile: Great!

bradymiller wrote on Monday, December 24, 2007:

hey,

  I committed the new acl administration page( http://sourceforge.net/forum/forum.php?thread_id=1844870&forum_id=202506 ) along with jquery.

  I put jquery(called it jquery121.js) in /library/js directory. I also put a small(5kb) jquery plugin(jquery.livequery101.js) there, which is a small, clever plugin that is vital for dynamic event binding.

  I also created a /library/ajax directory, which can be used to keep the ajax server functions. For example, this is where I’ve put the adminacl_ajax.php file, which handles all the ajax calls for acl administration. If your curious, the client page for acl administration is at /interface/usergroup/adminacl.php. My goal was initially to have adminacl.php be only javascript(.js), however not able to at this time, because would lose language translations with our current mechanism.

  I hope this will work, now let the ajaxification begin.

-brady

sunsetsystems wrote on Monday, December 24, 2007:

Thanks Brady!

Rod
www.sunsetsystems.com

bradymiller wrote on Sunday, January 06, 2008:

hey,

Just wanted to post something to avoid with AJAX, which caused me some headaches. In the php.ini file, make sure the display_errors=Off. If an error/warning happens in AJAX with the display setting on, then it gets put into the AJAX datastream and can cause problems. It’s best to only log errors/warnings to a file anyways.

-Brady