Tech Blog

New Portal View and AEK Full Screen

campusM has released a new portal view display option for browser viewing. This new release gives institutions the ability to provide a more portal oriented experience for their users. The new portal view is easy to configure and offers personalization for users. In tandem with the new portal view, AEK projects can be used to create responsive, full screen services. 

Contents

  1. campusM’s New Portal View
  2. Full Screen AEK Projects in the New Portal View 
  3. Full Screen AEK Projects With the New Portal View Disabled
  4. Testing AEK Projects in Full Screen Mode While Developing

campusM’s New Portal View

The new portal view allows the institution to display a menu on the left hand side when viewing the app in the browser. The menu items are associated with various app services. The menu is completely configurable, allowing admins to brand it appropriately, arrange the items in the menu, and even associate menu items with roles, adding personalization to the user’s portal experience. For additional details on how the portal works and how it can be configured, please click here.

Example of the new portal view:

Full Screen AEK Projects in the New Portal View

With the new portal view, campusM moves away from the previous modular view. By default, the portal view sets all AEK screens to be full screen (non-modular). In other words, if the new portal view is enabled, no further steps need to be taken to make your AEK projects full screen. Note, that during the creation of the AEK project, it will be helpful to test the project in both desktop and mobile views. To test an AEK project in full screen view, edit your runserver.yaml file as shown below in the section labelled “Testing AEK Projects in Full Screen Mode While Developing.”

Here is an example of the new portal view with an AEK screen clicked open:

Full Screen AEK Projects With the New Portal View Disabled

From within the App Builder, admins can apply a “Full-Screen AEK” property to tiles. Set this property to “Full-Screen.” When clicked open, this will make the tile screen take up the entire width of the browser. To use full screen mode, you first must make sure that you are not using the Container element within your code base. Container is made to stop pages from being too big and keeps all elements in place. Find out more here.

Here is an example of the setting a tile to full screen mode within the App Builder in the App Manager:

Testing AEK Projects in Full Screen Mode While Developing

This setting can be easily disabled/enabled from within the runserver.yaml  file.

To enable full screen mode, add the following to your file:

modal:
  fullscreen: true

Your runserver.yaml file should now look something like this:

homepage:
  menu:
    replace:
      - desc: Screen
        screenName: screen
        modal:
          fullscreen: true

Note: Sometimes you have to close the tile from localhost:5000, refresh, and reopen the tile to see the full screen change take place.

To disable full screen mode, just remove the following:

modal:
  fullscreen: true

When you deploy your AEK project after local testing, you will also have to set the tile to full screen from within the App Builder (if you have the new portal view disabled). Remember, to use full screen mode you first must make sure that you are not using the Container element within your code base. 

As always, complete various tests on the project to ensure the AEK screens are showing up how you expected.

Happy coding!

Leave a Reply