Tabs Based interface with IFRAMES

sunsetsystems wrote on Sunday, September 25, 2016:

OK done.

bradymiller wrote on Monday, September 26, 2016:

Hi,

I just brought a commit into the codebase today to clarify the global settings, so now have the following pertinent global settings in Administration->Globals->Appearance:

  1. ‘Layout’ with options of ‘Frames’ or ‘Tabs’
  2. ‘Tabs Layout Theme’ with options of ‘Full’, ‘Compact’ and any other tabs themes that are added on later
  3. ‘General Theme’ with the standard options for themes
  4. ‘Vertical Menu Style’ with options of ‘Tree’ and ‘Sliding’

-brady
OpenEMR

mdsupport wrote on Monday, September 26, 2016:

Added an issue related to missing inventory menu. It is increasingly harder to replicate left_nav menu groups that use unlimited room for growing vertically. Good menu design will limit top menu choices to 6-8 groups. A suggestion would be to use multi-column submenus for simplified top menu as
Home Patients Encounters Billing Reports
That will allow direct access to any function in at the most 2 clicks.

We are also finding this menu approach is too complex to administer. We need to implement our own navigation objects to implement functional aspects of menus and relegate rendering to standard bootstrap navigation components.

robertdown wrote on Monday, September 26, 2016:

Agree that the menu can get out of hand quickly. I also love the multi-column sub-menu idea! I think since we’ve got a small bit of breathing room for the next release I’ll try to tackle this.

Expect some changes in how the menu is generated to be more bootstrap friendly

bradymiller wrote on Tuesday, September 27, 2016:

Hi,

My main goal for now is to simply get all the original elements into the menu (along with the globals and acl_checking and other more customized methods for including menu items).

-brady
OpenEMR

sunsetsystems wrote on Wednesday, September 28, 2016:

Another issue I’m seeing. With tabs in use the warning for unsaved changes at “beforeunload” time is not triggering. I noticed this when making a change in the layout editor and then closing the tab without saving the changes… no warning. It does work with the sliding menus. Is this a known bug?

Rod
http://www.sunsetsystems.com/

bradymiller wrote on Wednesday, September 28, 2016:

Hi Rod,

Sounds like another bug to report :slight_smile:

-brady
OpenEMR

sunsetsystems wrote on Wednesday, September 28, 2016:

OK created #290 for this.

Rod
http://www.sunsetsystems.com/

bradymiller wrote on Tuesday, October 04, 2016:

Hi,

Checked in some fixes into the codebase over the last couple days on the higher priority bugs in the tab layout. The last high priority item left is to ensure all menu items along with appropriate acl/globals checks are supported, which I plan to take on next. At that point, I think the tabs layout will be ready for production release. Note there are still many minor issues and enhancements, but I don’t think any showstoppers:

btw, there’s a really nice tutorial on learning knockoutjs here:
http://learn.knockoutjs.com/#/?tutorial=intro

-brady
OpenEMR

bradymiller wrote on Friday, October 07, 2016:

Hi,

Have completed the tab layout menu to now effectively mimick the elements in the left_nav menu (and also in regards to globals and acl checks). Testing well so far and code can be reviewed here:

This should now mean the “basics” are covered with the tab layout menu. Next step is to think about how to support configurable per-user, per-role menu sets.

-brady
OpenEMR

mdsupport wrote on Saturday, October 08, 2016:

Currently the menu line is prone to overflow unless wide display is used. To minimize that possibilty, some suggestions are :

  • Replace Calendar by fa-calendar, flow board by fa-calendar-check-o, messages by fa-envelope with current text appearing on mouseover.

  • Does it still make sense to retain “Popups” in the iframes layout? In the 2 frames world, popups added optional additional window on demand. That restriction does not apply to this layout. On the other hand, this label takes some more room on the crowded menu line.

I suggest the items be digested by existing categories as follows :

  1. Issues - move to Patient after Summary as Issues.
  2. Export, Import - move to Patient in subcategory currently called ‘Import’. Rename import as submenu as Exchange(?).
  3. Appts - This is duplicated link to standard report for easy access. If a facility has started using flow board, it effectively shows the same information. If this is still needed, it can be moved to top of the ‘Reports’.
  4. Payment, Superbill, Checkout - move to Fees after ‘Fee Sheet’(?)
  5. Letter, * Label - move to Patient as a new group ‘Print(?)’ before ‘Import’.

bradymiller wrote on Saturday, October 08, 2016:

Hi,

I think the idea of supporting icons for the top level menu items is good. Would just simply need to add another category to the json menu structure for the icon and then support it when render the menu. The icons have already been mapped for each of these categories in left_nav, so could just use those.

Would there be a way to make this responsive? (ie. when screen is made too small to fit labels, it converts to icons, and when too small to support icons, it then goes to a icon pull down menu).

I also agree with migrating away the popup menu to the places you suggest.

-brady
OpenEMR

bradymiller wrote on Saturday, October 08, 2016:

Hi,

On another issue, I placed a PR that brings in a Message indicator (when there are messages that need to be read etc., the button pops up under the User at top right) and also incorporated some of MD Supports improvements to the tab layout (using icons in several places):

I think it looks really nice on the modern themes, however the icon/buttons look really bad on the legacy themes. Any suggestions on how to fix this issue?

-brady
OpenEMR

bradymiller wrote on Sunday, October 09, 2016:

Hi,

Fixed the legacy theme issue in above PR by modernizing the buttons via the code Ray did in the tan theme.

I think this is ready for a community review. The code is in the above PR link (in above post), and can be tested here:
http://www.open-emr.org/wiki/index.php/Development_Demo#192.168.1.131

-brady
OpenEMR

mdsupport wrote on Sunday, October 09, 2016:

As a transition matter it may be ok to replicate old interface style but getting rid of frames opens up a host of new interface opportunities. e.g. the new message notifier can actually show those messages in jGrowl or similar notifier with a user preference to repeat notification after (n) minutes until acknowledged. Same is true for patient clinical reminders popups. However that should be a general purpose extensible class.

mdsupport wrote on Sunday, October 09, 2016:

Also we should consider using some features available thru fa.

robertovasquez wrote on Sunday, October 09, 2016:

The TABS that have list drop down do not work with in my ipad. TABS LIKE procedure, Administration.

bradymiller wrote on Monday, October 10, 2016:

Agreed, especially after get above code into the codebase which will allow the legacy theme buttons to support the fontawesome icons(again, thanks to Ray’s work).
-brady

bradymiller wrote on Monday, October 10, 2016:

Hi,

Out of curiosity, just tested it out on my android phone and the menu works. The tabs layout is actually much more usable on my android phone than the frames layout was. Guessing that it should be rather usable on a android tablet.

Regarding the ipad, would be nice to sort out why the menu is not displaying correctly. Can you try other browsers?

-brady
OpenEMR

bradymiller wrote on Monday, October 10, 2016:

Just realized I misunderstood that you were talking about list drop downs and not the menu.
I also confirmed that the list drop downs in Administration->Globals are working fine on my android phone.