Modifying/Adding to GUI

Status
Not open for further replies.

agehring

Dabbler
Joined
Sep 11, 2011
Messages
10
I've added MySQL to the image, and I've been working on adding it to the GUI.

I've successfully added it to the 'tree' on the left, but I've not been successful in getting it under the tab on the right.

Can anyone offer some pointers?

Thanks!

2uf3ww5.jpg
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
Nice work Agehring! Maybe you can post a HowTo when you get it all figured out. Don't forget to back up your changes so you don't lose them in an upgrade.
 

agehring

Dabbler
Joined
Sep 11, 2011
Messages
10
I'm not making changes on a running instance, this is a build from modified source...

I'll put together some HowTo notes once I finish it up...
 

joeschmuck

Old Man
Moderator
Joined
May 28, 2011
Messages
10,970
@agehring
I need to add some buttons to the GUI and after reading your postings here I realized I could (with your help) make it look very good.

Here is my goal: I need to setup under services 'minidlna' on/off and instead of a configuration wrench maybe a 'rebuild database' button. The commands are simple to start, stop, and rebuild but getting the button on in the GUI is beyond my minds power at this time.

In all all I really need are three buttons to perform those actions and they can be just to the right of the 'System' icon but what you have done looks much cleaner.

Any help would be appreciated.

-Mark
 

joeschmuck

Old Man
Moderator
Joined
May 28, 2011
Messages
10,970
Don't know how to link in command from Web interface

Problem: Cannot figure out how to get an icon on the GUI to perform the function I need.

Well getting the icons on the screen is easy and will be simple for others to do as well and we all know that these modifications would need to be done with each build so simple is good. My problem is getting the GUI to do what I want and I'm sure it's easy in someones mind but Dojo is quite honestly beyond me. Searching the internet left me more baffled than when I started.

So I know I need to call two functions but where do I put them and how would they be formatted?

I placed the following lines into the /trunk/gui/templates/menubar.html file:

Code:
    <div dojoType="dijit.MenuBarItem" onClick="minidlna_stop();" class="menu_icon">
        <img src="{{ STATIC_URL }}images/ui/menu/minidlna_stop.png" width="24" height="24" align="center">
        <span>{% trans "Stop" %}<br>{% trans "Minidlna" %}</span>
    </div>
    <div dojoType="dijit.MenuBarItem" onClick="minidlna_rebuild();" class="menu_icon">
        <img src="{{ STATIC_URL }}images/ui/menu/minidlna_run.png" width="24" height="24" align="center">
        <span>{% trans "Rebuild" %}<br>{% trans "Minidlna" %}</span>
    </div>
And I added the two icons as well.

The two functions I need are:
1) stop_minidlna() : would run the command '/usr/local/etc/rc.d/minidlna stop'.

2) rebuild_minidlna() : which would run the commands:
'/usr/local/etc/rc.d/minidlna stop'
'minidlna -f /usr/local/etc/minidlna.conf -R'

No parameters need be passed as they are simple commands.

Of course knowing how one works means I'd easily figure out any others needed.

Here is a screenshot of the GUI with those above lines incorporated:
minidlnagui.jpg

The GUI can be made to look a little nicer but the gist is there. I need some help, a point in the right direction in order to finish this little project up.

Thanks.
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
Why don't you just have the Rebuild icon do the whole process of stopping, rebuilding, restarting? You could just add another ?? what's the word?? ugggh... into the RC script and call it rebuild.
 

joeschmuck

Old Man
Moderator
Joined
May 28, 2011
Messages
10,970
Why don't you just have the Rebuild icon do the whole process of stopping, rebuilding, restarting? You could just add another ?? what's the word?? ugggh... into the RC script and call it rebuild.

Actually it would. The second line (with the -R) would start up minidlna and force a rebuild. I put the stop up there so I could check to see if I actually stopped the service, kind of proof I was doing something which did fail many many times before I asked for help. I could get all fancy and add it to the Services tab but this is a temporary adjustment and should just be easy, functional, and look nice until the FreeNAS product includes minidlna (hoping it does).

I think I understand where you are going with adding to the RC script, I could call the function with a single command. But the answer I still am in need of is how to call that command from the web interface. I've tried the stop and start commands in the OnClick= section of the buttons which proved that didn't work. I know I'm missing something.
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
I've almost got it figured out. It's not trivial for certain. A lot of the GUI is built from values in the database and buttons don't work if those tables and values aren't there. I'm adding a service for the jail, but after I get that finished I should be able to add the stuff for Minidlna. The code is actually written in Python with a sprinkle of javascript. Most of the stuff gets done in notifier.py, the rest is database tweaking, lots of it. I'm working with 8.02, I could zip up the modified files, or write a script to merge the changes into a running system, or look at adding it to the source, but that probably isn't a good idea if you're using nightlies. I think the easiest is zipping it all up for people using 8.02 and having a script backup the existing stuff and replace it with the modified stuff. I've still got a bit more to do because jails don't have pid's and the notifier code uses pgrep which doesn't find jails unless you use -lj, but I've almost got it.

A lot of stuff is pre-configured for a webserver, unison, bittorrent, and a couple other things to be added in later on.
 

joeschmuck

Old Man
Moderator
Joined
May 28, 2011
Messages
10,970
Thanks for all the help. For the database, is that something that is easily adjusted prior to compiling FreeNAS? I new notifier.py was involved but couldn't figure out how to execute any code in there (button commanded that is).
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
For the database, is that something that is easily adjusted prior to compiling FreeNAS?

I need to look into that more at the source level. I know when you do an upgrade it automatically updates the database, but for doing this is just a couple of lines of SQL to add stuff to the database at the command line and that's it. If you want to add a popup window with settings for your new 'service' then there's a bit more to add to the database etc.

I was thinking for minidlna of using the On/Off button to start/stop minidlna, and making the wrench icon do the rebuild you asked about. I've still got a little more to go before I get to that point though. I was thinking I can just make a patch file to make the changes after backing up the originals & database. I haven't tried any nightlies so I don't know what might have changed with the GUI.
 

joeschmuck

Old Man
Moderator
Joined
May 28, 2011
Messages
10,970
I have a few questions but I'll hold them until you're finished. I think a how-to guide would be great here. It would show people how they could implement these types of changes. That would be considerable work if you took that on as well.

As for the rebuild, I think that is the key but in my experience you must stop minidlna first and then start it with the -R option.

-Mark
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
I have a few questions but I'll hold them until you're finished.

Mark,

Ask away, it might be easier for me to find the answer while I've still got my head in it, or at least know what to look for to try and answer them. I don't know python or javascript, although I can usually figure stuff out. When I used to do coding it was either C or Perl with a sprinkle of other stuff. I never really cared for object oriented programming.

I will absolutely do a HowTo. I didn't get much accomplished today as I occasionally get periods of migraines that last from several days to several weeks and I can't even look at a screen long enough to concentrate. Hopefully if I can work this out and do a HowTo so it will take some pressure off the developers and they can work on the good stuff and keep the mobs satisfied until they finish.
 

agehring

Dabbler
Joined
Sep 11, 2011
Messages
10
Based on my work (which is still in progress), your rc scripts need to get their data from the database, and use that data to create/modify the configuration file for you daemon. for example, in my ix-mysql, I have a function that looks like:

generate_my_cnf()
{
local IFS=\|
local f="mysql_srv_datapath"
eval local $f
local cmd sf cfg
sf=$(echo $f | sed -e 's/ /, /g')
cfg=/etc/my.cnf
${FREENAS_SQLITE_CMD} ${FREENAS_CONFIG} \
"SELECT $sf FROM services_mysql ORDER BY -id LIMIT 1" | \
while eval read $f; do
cat > $cfg <<EOF


which reads the configuration information from the DB, and creates a /etc/my.cnf file...

In order to add a service to the GUI, there are many files that need modified. If you have specific question, I may be able to answer them.

I'm still working on my How-To...
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
Thanks Agehring,

That answers another piece in the puzzle. I hadn't seen a post here for awhile from you so I assumed you'd given up or something. It's definitely not a trivial task. Here is some of my analysis which you probably already know, but might help others:

To add a service entry in the GUI, and have basic ON/OFF control of the service, these are the minimum files I found need editing. To make stuff consistent with the way other services are done, there are a LOT of database entries and other python files to edit.

  • /usr/local/www/freenasUI/templates/services/index.html
  • /usr/local/www/freenasUI/services/tests.py
  • /usr/local/www/freenasUI/services/models.py
  • /usr/local/www/freenasUI/services/views.py
  • /usr/local/www/freenasUI/services/forms.py
  • /usr/local/www/freenasUI/services/migrations/0001_initial.py
  • /usr/local/www/freenasUI/services/json_init (FreeNAS 8.02)
  • /usr/local/www/freenasUI/media/css/custom.css
  • /usr/local/www/freenasUI/schema.init (FreeNAS 8.02)
  • /usr/local/www/freenasUI/middleware/notifier.py


  • json_init & schema.init seem like they are dynamically generated from the database & don't exist in 8.2 nightlies
  • There is some way stuff is linked from the index.html to the python files I haven't figured out.
  • /usr/local/www/freenasUI/media/lib/js/freeadmin.js (Toggles the graphic image ON/OFF and does the animation)
  • The On/Off Icon for a service will not appear unless there is a record in the services_services table for that service (ID=unique #, service-name, 1/0 (enable/disabled)).
  • There also need to be a table added for each service, ie. service_jail & service_upnp containing fields for settings
  • views.py has the info for creating the popup window when the Wrench is clicked
  • forms.py calls stuff in notifier.py
  • notifier.py is where the rc init scripts get called and needs an entry for each service
  • /usr/local/www/freenasUI/media/css/custom.css has info for icons in the left panel for services, and GUI colors etc.
  • onClick "toggle_service" & "editObject" are handled in /usr/local/www/freenasUI/media/lib/js/freeadmin.js
 

agehring

Dabbler
Joined
Sep 11, 2011
Messages
10
That looks a lot like my notes...

Additionally:

Any changes you make in /usr/local/www/freenasUI/services/migrations/0001_initial.py, you have to make sure that it is in all of the migrations.

You have to create your ix-'service' file, but the /etc/rc.d/'service' file comes from the port, so you need to know the name for the notifier.py

---

I'm not sure what you mean with "There is some way stuff is linked from the index.html to the python files I haven't figured out."
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
I'm not sure what you mean with "There is some way stuff is linked from the index.html to the python files I haven't figured out."

For example, if you wanted to create a button at the top where you could execute some command at the command line. How does the text of the command get passed from the javascript in the index.html to the notifier.py?

Any changes you make in /usr/local/www/freenasUI/services/migrations/0001_initial.py, you have to make sure that it is in all of the migrations.

This is strange, but not entirely true. I made one addition for jails which I added to all the other migration files to be consistent. Then I also added another entry in the GUI for MiniDLNA and only changed the files I mentioned above and it also worked. There are probably side-effects, but it stopped and started the service and updated the GUI properly.
 

agehring

Dabbler
Joined
Sep 11, 2011
Messages
10
For example, if you wanted to create a button at the top where you could execute some command at the command line. How does the text of the command get passed from the javascript in the index.html to the notifier.py?

Ah, in the previous version they had a 'command' menu item, but I haven't noticed that in the 8 series...

Everything I'm doing requires updating the DB, using the DB and the ix-'service' script to manage the config, then using the services script to manage the service.




This is strange, but not entirely true. I made one addition for jails which I added to all the other migration files to be consistent. Then I also added another entry in the GUI for MiniDLNA and only changed the files I mentioned above and it also worked. There are probably side-effects, but it stopped and started the service and updated the GUI properly.

Are you building from source, or modifying a running system?

I'm building from source, and I've only tried to add the one service (MySQL), and the only way I got it to compile was to have the changes I made in the 0001, in all of them, so apparently YMMV :)
 

ProtoSD

MVP
Joined
Jul 1, 2011
Messages
3,348
Are you building from source, or modifying a running system?

I'm building from source, and I've only tried to add the one service (MySQL), and the only way I got it to compile was to have the changes I made in the 0001, in all of them, so apparently YMMV

I'm modifying a running system since most people don't know how to build or want to build from source. I figured my method was easier for the average user.

Ah, in the previous version they had a 'command' menu item, but I haven't noticed that in the 8 series...

Yeah, I'm sure it will happen 'officially' at some point. It seems like now they're planning to skip version 8.1 and go directly to 8.2, probably to sync up the version numbers with FreeBSD a little faster.
 
G

gcooper

Guest
That looks a lot like my notes...

Additionally:

Any changes you make in /usr/local/www/freenasUI/services/migrations/0001_initial.py, you have to make sure that it is in all of the migrations.

You have to create your ix-'service' file, but the /etc/rc.d/'service' file comes from the port, so you need to know the name for the notifier.py

---

I'm not sure what you mean with "There is some way stuff is linked from the index.html to the python files I haven't figured out."

An ix-<blah> script isn't required. It just how we're doing things for now (and it might change...).
 
Status
Not open for further replies.
Top