BCS 4.0 UI

Things to come.
Post Reply
ddorsett
Posts: 20
Joined: Fri Apr 08, 2011 6:14 pm
Bot?: No

BCS 4.0 UI

Post by ddorsett »

So I'm definitely liking the new UI overall. One cosmetic criticism I had right away, though, was the fixed allocations for 8 processes and 8 states per process. I don't have 8 processes, and some (running the fermenter fridge) are really simple (2 states), and all those distracting ovals, even when blanking out the default process and state names, were, well, distracting. (My day job involves the development and support for multiple large corporate websites).

So, the feature request is to suppress the display of un-programmed processes and states. Either because the process/state name hasn't been changed from the default, or by a convention of using a blank (  in html) name.

And, because I was just in that kind of mood today, I decided to play around with the tantalizing "Advanced JS" setting. So I created a bit of Javascript (attached) that suppresses the display of processes or states with a blank name. It's not perfect: if you edit a process or state to have a non-blank name, you need to refresh the main page control page to have it appear. It's good for me for the moment, tho.

I'm hosting the attached script file on a local server, seems to be working just fine for me, but if you take this and use it, it's at your own risk!

Before:
Main Control before
Main Control before
before.png (76.03 KiB) Viewed 13429 times
After:
after
after
after.png (59.93 KiB) Viewed 13429 times
Attachments
BCS4_UI_updates.js
Javascript
(3.97 KiB) Downloaded 493 times
User avatar
oakbarn
Posts: 846
Joined: Thu Jan 05, 2012 2:28 pm
Bot?: No
Location: Texas
Contact:

Re: BCS 4.0 UI

Post by oakbarn »

I really like the new UI as well.

Something like this is on my "dreamsheet" as well.

I have never written JS but wish I could. Thanks for the example of what is possible. :D

I would love to get rid of the Timers I am not using. I also wish that if a Timer is used as an Exit Condition, the Timer "goal" was Displayed for the Current State of the Process.


(Note: Before I get flamed for Current State: Current State may be Con-Current State. You may have one Current State per Process, but more than One Process running, so more than a single Current State, but only one per Process)
JonW
Site Admin
Posts: 1726
Joined: Sun Jul 18, 2010 7:51 am
Bot?: No
Location: Huntington Beach, CA
Contact:

Re: BCS 4.0 UI

Post by JonW »

We actually had an early release that collapsed unused entries for states and timers. The problem with it is that when you have multiple processes running with varying numbers of states and timers, it causes you to have to visually scan/search up & down looking at the screen when you want to see status across the board. Also, the outputs & inputs below the processes are still going to be in the same place so you're not saving any screen real estate by collapsing them.

Fortunately, the advanced JS option is a nice hook that you can perform things exactly like you did if you are so inclined. Nice job!
ddorsett
Posts: 20
Joined: Fri Apr 08, 2011 6:14 pm
Bot?: No

Re: BCS 4.0 UI

Post by ddorsett »

Jon- I think as 4.0 matures it would be good to consider some display preferences like these. I can understand where some folks setup their processes/states in such a way that lining them up would make sense, others might want just a little cleaner look (yes, I realize it doesn't compress the vertical size, it only adds some whitespace).
brahn
Posts: 543
Joined: Thu Dec 13, 2012 11:01 am
Bot?: No

Re: BCS 4.0 UI

Post by brahn »

ddorsett wrote:Jon- I think as 4.0 matures it would be good to consider some display preferences like these. I can understand where some folks setup their processes/states in such a way that lining them up would make sense, others might want just a little cleaner look (yes, I realize it doesn't compress the vertical size, it only adds some whitespace).
Definitely! I expect things to evolve as people use the new system and we get more feedback. That may or may not involve a feature like this. Like Jon said in our previous testing it seemed to hurt the usability. This is a cool use of the advanced js feature! In 3.x it was basically only used for custom HMI elements (if it was used at all.) Other than porting it over I hadn't given a lot of thought to how it might be used.
User avatar
oakbarn
Posts: 846
Joined: Thu Jan 05, 2012 2:28 pm
Bot?: No
Location: Texas
Contact:

Re: BCS 4.0 UI

Post by oakbarn »

On my dream sheet is a "compact" Process Pane that does away with some white space.

It would show only 3 States:

For a non asserted Process that is displayed "Always"

State 0 would be on top
The Next State would be the State to Jump to in the First Exit Condition of State 0
The Next State would be the State to Jump to in the First Exit Condition of Just Above.
(No Exit Condition? Then just Numeric Sequence)
For an Assserted Process:

Current State in Green would be on Top
The Next State would be the State to Jump to in the First Exit Condition of Current State
The Next State would be the State to Jump to in the First Exit Condition of Just Above.

(No Exit Condition? Then just Numeric Sequence)

You would still need the "Expanded View" as you have now if you wanted to jump to a different state that the limited 3 displayed. That Expanded View would be as it is now.

Selecting Compact or Expanded could be from a Drop Down Menu similar to the Temp Gauge Display.

While not as expanded as the Exit Displayed in 3.7.1, it does give at least one leg of the next State.

Since I know almost nothing about JS, I do not know if something like this is possible with the advanced JS. I looked at the above Code and have looked at the old one about creating a widget that is on the ecc web. Is there a place where user's can submit sample code? I have a background in VB and can make out the code in a simple manner, but have not seen enough examples to plagerize. What I really need is a Code Academy course on the BCS specific JS! :lol:
User avatar
Baron Ken
Posts: 99
Joined: Fri Jan 15, 2010 2:50 pm
Bot?: No

Re: BCS 4.0 UI

Post by Baron Ken »

ddorsett wrote:attachment
This external JS doesn't work for me. Using firefox.

I verified that using an external JS file does work:

Code: Select all

// external JS test
alert("This is an alert!");
// end test
Saving the above (exactly as above) as brewing.js on pastebin and pointing the BCS to that location does indeed pop up an alert when the BCS page is reloaded.

If I save your code in the same manner and point BCS to it, nothing changes on the Main page for me when I reload the page. I still have Processes and States (with no text) showing up.

Thanks,
Ken
User avatar
Baron Ken
Posts: 99
Joined: Fri Jan 15, 2010 2:50 pm
Bot?: No

Re: BCS 4.0 UI

Post by Baron Ken »

Baron Ken wrote:If I save your code in the same manner and point BCS to it, nothing changes on the Main page for me when I reload the page. I still have Processes and States (with no text) showing up.
If I put a call to updateUI() outside of the function, like this:

Code: Select all

updateUI();
externalJS = function(){
        
}
it works (before or after works).
I have tested it with the alert code in the function as well and it doesn't do anything.

Code: Select all

externalJS = function(){
        alert("This is an alert!");
}
How is the externalJS function called? It doesn't seem to be for me.
JonW
Site Admin
Posts: 1726
Joined: Sun Jul 18, 2010 7:51 am
Bot?: No
Location: Huntington Beach, CA
Contact:

Re: BCS 4.0 UI

Post by JonW »

I just did a quick test and I could get the alert to work at page load, but not inside the externaljs function where it should execute repeatedly. I could not get the code posted by ddorsett to work at all.

Since the HMI portion is removed in 4.0, I'm guessing part of the code to continually call the external JS was also chopped. We'll have to look into this to see what's going on.


Edit: I could get ddorsett's code to work by moving the call to updateUI() outside of the externalJS block.
Post Reply