Alternative Homepage / Indexpage / Dashboard

Got something cool to share with AppGini users? Feel free to post it here!
Post Reply
User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Alternative Homepage / Indexpage / Dashboard

Post by jsetzer » 2018-07-24 17:23

Hi,

I've modified my appGini code to build a completely different homepage / indexpage. I've turned this...
chrome_2018-07-24_19-16-19.png
chrome_2018-07-24_19-16-19.png (18.97 KiB) Viewed 8519 times
...into that...
chrome_2018-07-24_19-11-12.png
chrome_2018-07-24_19-11-12.png (207.14 KiB) Viewed 8519 times
I did not change any overwritable files but only jQuery does the job. New table-groups and new tables will be applied automatically without any further code change.

I hope you like it.

Kind Regards,
Jan

PS: The code is a bit too complex for posting it here.
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

landrea
Posts: 27
Joined: 2018-08-04 13:09

Re: Alternative Homepage / Indexpage / Dashboard

Post by landrea » 2018-08-04 16:07

this is really a very good, really amazing
i woudl like to know how you did it
do you work only in footer hook?

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Alternative Homepage / Indexpage / Dashboard

Post by jsetzer » 2018-08-07 19:24

Thank you, @landrea!

Well, in header-extras.php I have a couple of includes and some magic initialization:

Code: Select all

<script src="/app/AppGiniHelper.min.js"></script>
<script src="/app/AppGiniCharts.min.js"></script>

<?php include_once __DIR__ . '/../../AppGiniHelper.php'; ?>
<!-- ... one more include here ... -->

  <script>
    var config = {
      icon: 'pencil',
      title: '<b>Case</b>Worxx',
      backgroundimage: 'images/background.jpg',
      copyright: {
        text: 'Copyright &copy; 2016 - ' + '2018' + ' bizzworxx.de'
      },
      default: {
        icon: 'glyphicon glyphicon-cog'
      },
      loginpage: {
        backgroundimage: 'images/background-login.jpg'
      },
      homepage: {
        backgroundimage: 'images/background-home.jpg',
        change: true
      }
    };
    appGiniHelper = new AppGiniHelper(config);
  </script>
I have placed my includes in the parent directory, so all my different appGini apps can make use of it.

As you can see I can configure background-images etc. for login-page, home-page and other pages. The magic is being done in my appGiniHelper class. I only have to pass the config variable.

The hardest part was finding the collapsible table groups and the table links inside.

Code: Select all

	// ...
        var table_groups = $j('a.collapser');
        // ...
        table_groups.each(function () {
                    var a = $j(this);
                    var text = a.text();
                    var panel_id = a.attr('href');
                    var table_links_panel = $j(panel_id);

                    var table_links_row = table_links_panel.children('div.row.table_links').first();
                    var table_links = table_links_row.children('div');

                    if (table_links.length) {
                    
                        // create the new panels and links here
                        // ...
                    }

                    // ...
                });

I only use header-extras.php and my own includes. The file footer-extras.php is empty. No overwritable file has been touched.

Kind Regards,
Jan
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Alternative Homepage / Indexpage / Dashboard

Post by jsetzer » 2018-08-15 11:20

Hi!

The alternative homepage design now also supports $homeLinks[] from the hooks/links-home.php file.

It's also tested in a right-to-left (rtl) environment thanks to @M Tessler

Regards,
Jan
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Alternative Homepage / Indexpage / Dashboard

Post by jsetzer » 2018-09-30 19:03

You may also have a look at my forum post here https://forums.appgini.com/phpbb/viewto ... f=4&t=2804 where I am showing a more "desktop-like" homepage style:

homepage-desktopstyle-small.jpg
homepage-desktopstyle-small.jpg (13.91 KiB) Viewed 8015 times

Kind Regards,
Jan
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

Post Reply