BOUNTY: Web GUI reprogramming

kelsen

yeah, it looks better.

Don't know what the Csrf line consist of… it could be related to Cross-Site Request Forgeries prevention.

looks important ;D
I just know that on 2.0.3 doesn't have this line.

charlie0440

CSRF is a security measure, what it does for example is if you were logged into the GUI via a Chrome browser, someone couldn’t issue a Curl post command, they would have to login via Curl first to get a CSRF.

@kelsen I have some concerns about your work. Let me start by saying it looks amazing and I don’t want to put you off. I do not work for pfsense and have therefore am not speaking for them, the following is my personal view, which may be incorrect!

How do you plan on releasing your theme when finished?

I see two options, a package or to push it to the pfsense team as the only theme to be used (as it breaks the others).

if you add it as a package every new update to pfsense would require fixes on your end, you would also need to be up-to-date with pfsense github at the time of release (which you currently are not, more on this in point 2).
If you want to get it merged into pfsense as a replacement to all the other themes (as currently it breaks all the other themes) I see two issues.

Firstly you need to learn how to use github properly. I realise this is a learning curve and I am willing to help you here, its not that hard.

Your branch is a mess, you have correctly cloned pfsense, but your "Metrolab" branch is based on the 2.1 branch while it should be based on the latest work ie master. This to me is a mistake because your branch is already "439 commits ahead and 582 commits behind master" while admittedly most of these will not effect the GUI some will have been changes which your theme will now be missing, or could be changes which have broken things.

This would also save you work. I see you have merged my progressbar code (https://github.com/kelsen/pfsense/commit/74ff944ce38928be9d43df8d5ebf56bec953d4ff) If you based your branch on master there is no need to merge this separately as it would already be there.

Secondly, if this is a single theme and not compatible with the other themes, all code allowing themeing/skinning etc should be removed. Basically instead of hacking the current working it should be rewritten from scatch. One example would be the loader.js each theme has a different one to allow different code, while that could be hardcoded into the core ie do away will all the themeing stuff.

Sorry for the long post. Its better I say this now then when you finish.

kelsen

CSRF is a security measure, what it does for example is if you were logged into the GUI via a Chrome browser, someone couldn’t issue a Curl post command, they would have to login via Curl first to get a CSRF.

I discovered later that I was copying from google chrome code view, it was a mistake.

How do you plan on releasing your theme when finished?

indeed it must be a package, I'm trying to get help from @marcelloc on this matter; as you said, I've based my work on 2.1, I didn't know what I was doing on github to tell the truth.

My work is intended to 2.1, I realised that would be to difficult to push it to master branch,maybe I can start from scratch for 2.2, I don't know, I'm tired.

Secondly, if this is a single theme and not compatible with the other themes, all code allowing themeing/skinning etc should be removed.

right, I'll take a look.

Basically instead of hacking the current working it should be rewritten from scatch.

This may or not consume all my time, I'll see what can be done, as I said, I'm tired, this is a great effort for me, I admire the pfSense team for their work..

iFloris

@kelsen:

This may or not consume all my time, I'll see what can be done, as I said, I'm tired, this is a great effort for me, I admire the pfSense team for their work..

As a fellow user, I can say that I admire your work. Thanks for the effort you are putting into your vision of a next gen web interface for pfsense.

kelsen

I've started a new theme, this time I forked master branch.
There is no javascript and nothing else that could disrupt the WebGUI and other themes, it looks similar to the metrolab theme except the menu and ícons.
The theme Metrolab is with some bug and will be stopped for now, until I have time and courage to remake it in the master branch or someone willing to help.

burnsl

I am curious where this project is, as i think the work is awesome!

Very eager to use this multi-column GUI.

Is it stable and available yet?

charlie0440

@burnsl it is in:

pfsense 2.2 under a new theme called pfsense_ng_fs (obviously not released yet and no snapshots are currently available). It is also in a new theme "code-blue_fs" which is awaiting review and may be merged in time for 2.2

Alternatively go back to this post and you will find some instructions on how to install it on top of your 2.1 pfsense: http://forum.pfsense.org/index.php/topic,48140.msg369658.html#msg369658

Mr. Jingles

I think I found a bug ;D

I installed it per the instructions on page 13 of this thread. After that, the traffic shaper wouldn't update anymore (Status/queues), it just showed 'loading' for minutes (in IE10, FF25, Opera). Switching back to the default 'skin' gave the updating of the traffic queues back.

charlie0440

@Hollander - indeed you have. Think I have found the cause just got to figure out how to fix it.

charlie0440

@Hollander, should be fixed, please test https://dl.dropboxusercontent.com/u/12367642/myTheme.zip

Install as before:

download zip
tar -xvzf myTheme.tar.gz
cd myTheme/
scp -r * root@pfsenseIPaddress:/

#example: scp -r * root@192.168.1.1:/

Mr. Jingles

@charlie0440:

@Hollander - indeed you have. Think I have found the cause just got to figure out how to fix it.

Well if it took you 37 minutes to figure out how to fix it and fix it, then I'd would say: don't let us call you, you call us ;D ;D ;D ;D ;D

It appears to working now, so thank you very, very much :P

c0urier

@charlie0440

I didn't notice this until now - But some of the widgets are not updating on one of my installs. I only became aware of this, when I made a clean install on another box, and install your theme, there I saw that all widgets were updating (Gateways, Firewall, Interface statistics etc). But on my old install these are not updating, actually the only thing updating is the Traffic graphs, Uptime, Current date/Time, MBUF Usage, Load average, CPU usage and Memory usage), do you have any idea why?

I tried enabling the standard theme pfsense_ng - Removing all widgets and reapplying them again, this didn't change anything - So I hoped you might have an idea of why =).

charlie0440

@courier, not looked into this. Before I do is it possible for you to try one of the 2.1.1-PRERELEASE Snapshots Available No need to apply any of my patches they should all be applied already in the snapshots.

c0urier

hi @Charlie0440 - I tried upgrading all widgets are updating now, but I can only have two side by side columns in the widescreen.

Any suggestions?

charlie0440

my mistake, although my work was pulled into master a long time ago, it hasn't been pulled into the 2.1 branch. I will have to create a PR for this. I have very limited spare time at the mo and there is no guarantee it will be accepted, are we in feature freeze??.

If someone wants to do this please feel free, the commits are already in master.

c0urier

@charlie0440:

my mistake, although my work was pulled into master a long time ago, it hasn't been pulled into the 2.1 branch. I will have to create a PR for this. I have very limited spare time at the mo and there is no guarantee it will be accepted, are we in feature freeze??.

If someone wants to do this please feel free, the commits are already in master.

Can I reapply your old packages to get the widescreen back, or how should I proceed? =)

c0urier

It almost worked.

Small cosmetic error, but else everything seems to update.

c0urier

@charlie0440 - Will you make one that is fully compatible with 2.1.1?

justincase

Applying this patch:
https://github.com/melomac/widescreen_fs

On pfSense 2.1.1 pfsense_ng theme works.

c0urier

Some warnings during install, but it worked perfectly.

And no cosmetic errors.