Kodi Community Forum
MediaFrontPage - Web interface with widget type architecture to control multiple apps - Printable Version

+- Kodi Community Forum (https://forum.kodi.tv)
+-- Forum: Support (https://forum.kodi.tv/forumdisplay.php?fid=33)
+--- Forum: Supplementary Tools for Kodi (https://forum.kodi.tv/forumdisplay.php?fid=116)
+--- Thread: MediaFrontPage - Web interface with widget type architecture to control multiple apps (/showthread.php?tid=83304)



- Nick8888 - 2011-05-08

DejaVu Wrote:Is there a way where we can go back to the Database version (which I tried, but failed to get working) with the newer changes made?

I've changed the widget architecture in the database branch in an attempt to clean it up / simplify it so the new widgets would need to be adapted.

Personally I wouldn't do it until the database branch has its issues ironed out.


- gugahoi - 2011-05-08

hernandito Wrote:Holy Crap! This is amazing!! I just tested your version, without my edits and it works terrific.

Couple minor bugs- When I click to add a movie to CP from TMDB, I get an error 404 page not found.

On the Search section hearder, there word "Rating" and the two little up-down arrows are on separate lines.

The search results table does not expand to 100% of the width. Not sure if that is on purpose.

I will start to try to do my color tweaking and possibly adding specific css stuff for the widget. This will turn my hair completely gray, but I am gonna figure it out.

This is insanely good.... thanks!

For the cp 404 error, did you set the cp-URL in the config page?

Which part is not set to 100%? can you post a pic?

For the rating with the arrows, I know about that one. Will still change it a bit the table. Did you notice you can now sort the tmdb results?


- steve1977 - 2011-05-08

gugahoi Wrote:For the cp 404 error, did you set the cp-URL in the config page?

Wow, I somehow missed this development. CP is supported now? This is great. Besides search, is there a function to see upcoming DVD/bluray releases to add those to CP?


- gugahoi - 2011-05-08

steve1977 Wrote:Wow, I somehow missed this development. CP is supported now? This is great. Besides search, is there a function to see upcoming DVD/bluray releases to add those to CP?

Not just yet. I'm going to wait when CP v2 comes out cause there's an API implemented which would make our life much easier.

I'm still ironing out some minor bugs and maybe tonight or tomorrow I'll have TMDB search with CP added in the master branch.


- gugahoi - 2011-05-08

hernandito Wrote:Holy Crap! This is amazing!! I just tested your version, without my edits and it works terrific.

Couple minor bugs- When I click to add a movie to CP from TMDB, I get an error 404 page not found.

On the Search section hearder, there word "Rating" and the two little up-down arrows are on separate lines.

The search results table does not expand to 100% of the width. Not sure if that is on purpose.

I will start to try to do my color tweaking and possibly adding specific css stuff for the widget. This will turn my hair completely gray, but I am gonna figure it out.

This is insanely good.... thanks!

Just to let you know I started converting my inline styling to CSS so if things looks somewhat wierd - sorry. I really don't like CSS so please be patient and we'll get there.


- hernandito - 2011-05-08

gugahoi Wrote:Just to let you know I started converting my inline styling to CSS so if things looks somewhat wierd - sorry. I really don't like CSS so please be patient and we'll get there.

Missed the config.php part. CP working now.

Let me know when you are ready and I will start tweaking.

Thanks. Big Grin


- DejaVu - 2011-05-08

I've just sorting the finishing touches to my MFP (again) and have been snooping around the code. In-particular inside widget.php and found this at the bottom...

Code:
//Support the Widget "sytlesheet", "headerfunction", "headerinclude", "script" properties
function renderWidgetHeaders($widget, $params = "") {
    global $DEBUG;
    
    switch ($widget["type"]) {
        case "ajax":
            echo "\t\t<script type=\"text/javascript\" language=\"javascript\">\n";
            
            $loader = (!empty($widget["loader"])) ? $widget["loader"] : "ajaxPageLoad('".$widget["call"]."', '".$widget["block"]."');";
            if((int)$widget["interval"] > 0) {
                echo "\t\t\tvar ".$widget["block"]."_interval = setInterval(\"".$loader."\", ".$widget["interval"].");\n";
            }
            echo "\t\t\t".$loader."\n";
            echo "\t\t</script>\n";
            break;
        case "mixed":
            foreach( $widget["parts"] as $widgetsub ) {
                renderWidgetHeaders($widgetsub);
            }
            break;
    }
    if(!empty($widget["stylesheet"]) && (strlen($widget["stylesheet"]) > 0)) {
        echo "\t\t<link rel=\"stylesheet\" type=\"text/css\" href=\"".$widget["stylesheet"]."\">\n";
    }
    if(!empty($widget["script"]) && (strlen($widget["script"]) > 0)) {
        echo "\t\t<link type=\"text/javascript\" language=\"javascript\ src=\"".$widget["script"]."\">\n";
    }
    if(!empty($widget["headerinclude"]) && (strlen($widget["headerinclude"]) > 0)) {
        echo "\t\t".$widget["headerinclude"]."\n";
    }
    if(!empty($widget["headerfunction"]) && (strlen($widget["headerfunction"]) > 0)) {
        if($DEBUG) { echo "\n<!-- Calling Function:".$widget["headerfunction"]." -->\n"; }
        eval($widget["headerfunction"]);
    }
}

?>
I dont confess to being a secret coder, but that looks to me that if a CSS existed for say, wComingEpisodes.css it would use it as opposed to the front.css it defaults to.

Am I correct or completely off base, if so, that means that standalone CSS for individual widgets already exists in the code yes?!


- gugahoi - 2011-05-08

DejaVu Wrote:I've just sorting the finishing touches to my MFP (again) and have been snooping around the code. In-particular inside widget.php and found this at the bottom...

Code:
//Support the Widget "sytlesheet", "headerfunction", "headerinclude", "script" properties
function renderWidgetHeaders($widget, $params = "") {
    global $DEBUG;
    
    switch ($widget["type"]) {
        case "ajax":
            echo "\t\t<script type=\"text/javascript\" language=\"javascript\">\n";
            
            $loader = (!empty($widget["loader"])) ? $widget["loader"] : "ajaxPageLoad('".$widget["call"]."', '".$widget["block"]."');";
            if((int)$widget["interval"] > 0) {
                echo "\t\t\tvar ".$widget["block"]."_interval = setInterval(\"".$loader."\", ".$widget["interval"].");\n";
            }
            echo "\t\t\t".$loader."\n";
            echo "\t\t</script>\n";
            break;
        case "mixed":
            foreach( $widget["parts"] as $widgetsub ) {
                renderWidgetHeaders($widgetsub);
            }
            break;
    }
    if(!empty($widget["stylesheet"]) && (strlen($widget["stylesheet"]) > 0)) {
        echo "\t\t<link rel=\"stylesheet\" type=\"text/css\" href=\"".$widget["stylesheet"]."\">\n";
    }
    if(!empty($widget["script"]) && (strlen($widget["script"]) > 0)) {
        echo "\t\t<link type=\"text/javascript\" language=\"javascript\ src=\"".$widget["script"]."\">\n";
    }
    if(!empty($widget["headerinclude"]) && (strlen($widget["headerinclude"]) > 0)) {
        echo "\t\t".$widget["headerinclude"]."\n";
    }
    if(!empty($widget["headerfunction"]) && (strlen($widget["headerfunction"]) > 0)) {
        if($DEBUG) { echo "\n<!-- Calling Function:".$widget["headerfunction"]." -->\n"; }
        eval($widget["headerfunction"]);
    }
}

?>
I dont confess to being a secret coder, but that looks to me that if a CSS existed for say, wComingEpisodes.css it would use it as opposed to the front.css it defaults to.

Am I correct or completely off base, if so, that means that standalone CSS for individual widgets already exists in the code yes?!

MFP has supported custom CSS files for quite a while now if that's what you're asking...

At the bottom of the config page there is an example of how to use them.

BTW did you managed to get the custom scrollbar working?

Update: OK, I think I've finished editing it. Possibly ready for primetime. If some of you can test it out and report the bugs it would be great. Then, depending on how the replies go I will merge it into the master branch.


- DejaVu - 2011-05-08

gugahoi Wrote:MFP has supported custom CSS files for quite a while now if that's what you're asking...
Is that not per Widget though? I thought that creating a wComingEpisodes.css would use that as opposed to using the global one. Thus making it possible to skin each widget seperately (or adding CSS specific for that widget only)?
gugahoi Wrote:BTW did you managed to get the custom scrollbar working?
Erm... YES!!

gugahoi Wrote:Update: OK, I think I've finished editing it. Possibly ready for primetime. If some of you can test it out and report the bugs it would be great. Then, depending on how the replies go I will merge it into the master branch.
Commit them anyway and we'll bug report and fix from the git. Wink


- DejaVu - 2011-05-09

I am also now VERY proud to announce, I have the Scrollbar working perfectly, just needs some minor adjustments to make it look like it belongs to MFP and the right colors and I'll uploading it!

Hopefully, Gugahoi updates his git soon with the recent additions so I dont break anything with these edits!!

--DONE--
The latest editions that I think look excellent - including the Scroll bar that adjusts with the size of your screen!! - will be up on my repo soon...


- Nick8888 - 2011-05-09

DejaVu Wrote:Is that not per Widget though? I thought that creating a wComingEpisodes.css would use that as opposed to using the global one. Thus making it possible to skin each widget seperately (or adding CSS specific for that widget only)?

Yes that code is so that widgets can define stylesheets and js. It was added by zarquon in the very beginning of his work. I'm not 100% but I believe there should be atleast 1 widget using it.

This is some of the cleanup I keep referring to. Essentially I think it should be possible to just add a widget into the widget folder and have it work. This is what I targetted in the database branch but its harder than it seems because each widget has its own settings.


- DejaVu - 2011-05-09

Awesome. Great to know. That explains the folder structure in the database version. Fingers crossed it gets finished one day! Wink

Any who, check this out...
It's finally here, all working and took me fricking ages to do, so please enjoy it and leave feedback...

Clone this Repo and let me know what you think.

Scroller is the main addition (with easing and mousewheel support) and all the standard scrollbars are hidden!
The frameset finally working correctly without that annoying tiny jump (Scrollbar's set to Auto perfectly).
And hernandito's additions to real estate maximisation with the submenu and 4 columns. (would like to introduce your theme too matey if it's easily applied - simple CSS changes?)

Image

I have also tested this on my TV, looks great. I had to mess about getting the column percentages correct, but I think it now looks great, my TV is 1080p, but XBMC runs a 720 and I used Google Chrome installed in Linux/Executor to check it.

To relaunch this, I think it's going to take ages. The amount of screenshots and options it has is incredible - just the search one is immense!


- hernandito - 2011-05-09

DejaVu Wrote:And hernandito's additions to real estate maximisation with the submenu and 4 columns. (would like to introduce your theme too matey if it's easily applied - simple CSS changes?)
My Light Theme

I was really worried about this as I have made so many changes over time, that I could never remember what I did... But I did a test with Guga's IMDB branch, and I completely replaced his CSS folder with mine and most thing worked... But I want to go back to verify this. My goal would be to have my "branch" be just the css fodler, the background image, and one or 2 stock widget replacement where I changed inline formatting (Hard Drive widget).

But first I want to a) test your scrollbar and change that as necessary. If you have original light grey color stuff, please do send my way... and b) Once Guga does his CSS modifications to the Search widget, I can look at how to tweak those to my scheme.

It will be nice to get jDownloader and Transmission sorted out... Transmission I did by tweaking their html templates so it fits in a widget, and the call for the interface in an iframe. To mee it looks good and has some functionality. jDownloader is a no show for me.

I saw the web site to the jQuery UI, and I have done nothing about fantasizing about completely re-doing the interface... but I would have to hire an expert somewhere who can work for small money.... Is this what Nick's database MFP looked like?

EDIT:
PS Deja.... since you did all that work for the scroller, do you think you could tackle the nesting drop down menus you mentioned in the past... To have some items in Nav bar be drop down context type menus would be killer.


- DejaVu - 2011-05-09

Would'nt a simple prefix added to the files you've created/edited be an easier idea and have the config.php select them if you wanted to use the light theme. Have you not tried the light theme already available in the config.php towards the bottom?

I'm sure anything you write into your own CSS will override the whole theme so long as it's specified as a customtheme in config.php


- DPickles - 2011-05-09

hmm.... you should probably have a look at this in firefox. It looks fine in chrome, but does strange things in FF. Also, the widgets no longer move?