[CASE OPENED] Making a collapsible set of filters at a page level within portal:

Have you tried to add the 'minimize' behaviour, to the panel that contains the launch page? If they 'minimize' the user would then do a 'restore' to get the panel back.

Posts: 822 | Registered: April 23, 2003

Ignored post by David Briars posted

Guru

posted

I started playing with AppStudio, have you looked at using any of the jQuery Animations? I am tinkering with a form design that toggles off and on parameters.

Food for thought

WebFOCUS 8.1.05

Posts: 496 | Registered: January 04, 2008

Ignored post by MattC posted

Virtuoso

posted

David,

The minimize behavior minimizes the panel with the form, but the rest of the panels, etc. fail to respond to the minimization of that panel. Almost.

Matt,

I haven't played around with those too much as of yet. Is there an animation for that there? Will have to check them out. Let me know if you figure out a way to use those to get a panel with an html form to collapse. Would those animations just effect the html though? If I place the html form into a page within my portal, does it not get stored within a panel container? Not sure if the animations would allow for portal level collapsibility. Maybe though.

The BI layer is so frustrating to work around/with. lol

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Virtuoso

posted

Here's a solution that would work if we were able to access the HTML created, and didn't have the added portal layer (panel container) to deal with that I came up with:

<!DOCTYPE html>
<html>
	<head>
		<script>
			function toggle(id){
				var check = document.getElementById('container'+id);
				if(check.style.display == 'none')
				{
				check.style.display='inline';
				}
				else
				{
				check.style.display='none';
				}
			}
		</script>
	</head>
	<body>
		<input type="button" onClick="toggle(1)" value="Toggle Filters"><br>
		<table id="container1" style="display:none;">
			<td>
				<form>
					First name:<br>
					<input type="text" name="firstname">
					<br>
					Last name:<br>
					<input type="text" name="lastname">
				</form>
			</td>
		</table>
		<p>This text will adjust after user minimizes the form above.</p>
	</body>
</html>

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

David Briars

Master

posted

quote:
...but the rest of the panels, etc. fail to respond to the minimization of that panel.

We have a portal page with two columns. Each of the columns have two panels, in a '2 X 2' structure.

When one of the top two panels is 'minimized', the bottom panel, in that column, 'slides up', to take up the now vacated real estate.

Restore causes the panel to expand to its original size, and 'push' the bottom panel back down.

I realize this might not meet your requirements, just wanted to clarify my post.

Good luck.

Posts: 822 | Registered: April 23, 2003

Ignored post by David Briars posted

Virtuoso

posted

David,

So, when I don't set up my portal page to utilize columns for the layout (Single Area layout option) the other resources fail to respond to the minimization. But if I do first set up columns for the layout, the other resources do respond to the minimization. That would work (sort of) if it still allowed me to place resources next to each other within that one column, but it doesn't. I was hoping to figure out a way to get this functionality by having a toggle button so I didn't have to have the title bar for the minimized panel. The whole panel should collapse to the left or right based on where you place it (much like how they can if placed within a banner.

Thanks for the insights though David!

This message has been edited. Last edited by: CoolGuy,

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Kris

Silver Member

posted

I was excited when I found out that they had added the ability in 8.1.0.4 for the banner to slide in and out and thought I could use that for my filters. Unfortunately, that banner appears on all the pages of the portal. There should be a way to either include that on the page or not and/or customize a different banner for each page. Or give us a panel that will slide in and out. I tried and tried to use the animations included in app studio to create filters that would slide in and out. They worked well until you had to put them in a panel within the portal and that panel wouldn't cooperate. Drat - back to the drawing board.

8.0.0.8
Linux/windows

Posts: 36 | Registered: October 24, 2012

Ignored post by Kris posted

Virtuoso

posted

Kris,

I understand your frustration. Luckily for me, I have been working with IBI portals for a bit now before attempting to add this type of functionality. So, I knew that we can definitely get close to adding this functionality via HTML Composer and/or our own embedded HTML and Js via -HTMLFORM and !IBI substitutions at an HTML page level, but that it wouldn't transfer over at the portal level due to it being inserted as a WF resource into a panel the portal designer forces it into.

So, after extensive testing today, I've found that the ability to have collapsible panels at a page level within an IBI portal is not supported save for the ability to minimize a panel (because they don’t give you access to the HTML, etc. that the tool generates for the portal page you are creating). The sad part about using the minimize behavior is that in order for the other resources to fill up the space that the minimized panel once took up, the resources must be contained within a column layout. By doing that, you lose the ability to place resources next to each other within the column (you are stuck with the stacked layout of the column constraints), and responsive design is shot/doesn’t work. When structuring it for responsive design (placing all resources within a parent responsive panel like in the 8.1.03 responsive demo portal from IBI), and then attempting to use the minimize behavior for one of the panels on the page, the entire page goes blank (bug?). Layout options for portals are Single Area layout (which doesn’t support responsive resources after minimization of 1+ panels), Fluid Canvas (which allows you to shrink/adjust your panels’ width down to 3.88% of entire “canvas” area within the page, but not allowing you to completely hide the panel), and then 1, 2, 3 or 4 Column layouts (which I’ve described the limitations and drawbacks for above). Also, when minimizing the panel your filters are within when using 2+ Column layout options and then adjusting the width of the columns if not set to auto, the minimized panel goes blank for the user and doesn't allow for restoring the panel back to its expanded size.

IBI has the portal level collapsible banner, but they need to implement a page level collapsible banner as well. For now, we can design our filter.html panel to take up a small amount of space along the top of the page (within a “One Column” layout) and allow it to minimize, but thereby causing the rest of the resources to be stacked one under the next without the ability to place them next to each other within the one column layout; or we can do the same but with a 2, 3, or 4 column layout allowing us to place resources next to each other (in a way) but all being restricted to and stacked one at a time in the x amount of columns within the layout; or we can be fine with the filters being visible (non-collapsible) within the page (this allowing for the addition of responsive design) along with the other WF resources on the page until IBI implements a way to add a page level collapsible banner or panel (if they even do). That, or place all filters within a banner, but then we lose the ability to restrict access to certain users/user groups for all the filters that will have to be placed within the banner (everyone will see all filters) to cover all data sources that need filtering from, and the filters no longer work at a page level but for the entire portal.

We could put the filters in the banner, but then have to increase the amount of portals created to be for specific users and/or groups of users to maintain security. That way when the user opens their portal, they can have their filters collapsible within the banner, but we won’t have to worry about restricting the filters to a specific page because the portal is meant for that 1+ user(s). I think that’s the best solution we have until IBI provides a solution for this functionality at a page level I'm sad to say.

Good luck!

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Virtuoso

posted

Aaaaand I just opened up a case explaining what I did to Kris.

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Guru

posted

Now this is 8.00.8 so it's a bit different then 8.1.4. In this picture shown, I am taking a panel "Filters_Panel" that is hidden onload and has other controls on it.

If I click on an element called Add_Filters, I have an animation that will slide it out and show it. It also sets the LEFT position. The Toggle, also toggles it in and out.

WebFOCUS 8.1.05

Posts: 496 | Registered: January 04, 2008

Ignored post by MattC posted

George Patton

Master

posted

Oh! What did you do to Kris ? Did he enjoy it ?

WebFOCUS 7.7.05 Windows, Linux, DB2, IBM Lotus Notes, Firebird, Lotus Symphony/OpenOffice. Outputs PDF, Excel 2007 (for OpenOffice integration), WP

Posts: 674 | Location: Guelph, Ontario, Canada ... In Focus since 1985 | Registered: September 28, 2010

Ignored post by George Patton posted

Virtuoso

posted

Matt,

Thanks for the share. Does that work in the portal though? What does it look like? How is it implemented? Do you have a screenshot or 7? haha Thanks though for your help.

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Guru

posted

Sure it should work in a Portal. I am just creating an HTML page with controls using App Studio. Depending on where you are developing on either the Client or the Server. If working on the client, just add it as a resource into a portal. If you are working on the server, create a launch fex on the client that call's the HTML on the server.

Below is a work in progress, (more like my tinkering) with App Studio.

Using the Onload task which is already pre-defined, you can hide/show elements, set attributes of a control.

To be honest, I am kind of impressed with it. It does streamline some of the JS I would code.

Now the version I am using 8.00.8 it is a bit buggy and I believe IBI has made that clear, so it can be frustrating as it crashes, but I do see the potential of "Composing" some pretty neat HTML forms.

WebFOCUS 8.1.05

Posts: 496 | Registered: January 04, 2008

Ignored post by MattC posted

Kris

Silver Member

posted

Matt,

I'm not sure what your example gives you. How are you displaying these in the portal? Doesn't it require you to place the html in a panel? And if so, then the panel is still there. The filters may slide in an out, but the panel remains. Sorry, guess I'm a little bit confused.

8.0.0.8
Linux/windows

Posts: 36 | Registered: October 24, 2012

Ignored post by Kris posted

Guru

posted

These panels are in a single HTML, Then I throw this HTML into a panel in a portal.

This may be another design option for you to consider.

You want to try and adjust panels in a portal. I am not sure that is possible.

I really haven't done much portal work, but I don't think there is a lot to do in there anyway. Usually I will create a HTML and put it into a single panel in the portal editor and lock things down so users can't change or manipulate panels.

WebFOCUS 8.1.05

Posts: 496 | Registered: January 04, 2008

Ignored post by MattC posted

Virtuoso

posted

Thanks Matt for your take on building filters that slide in and out at a page level. The trouble with your implementation is that the user can't customize their portal page AdHoc style by dragging in WF resources into the various panels on the page that the dev sets up for them if they are using an HTML page w/form only. They would have to be able to drag and drop WF resources into that one HTML page in its panel that has the filters for the newly added WF resources to utilize those filters (if there is only room allotted for that panel on the one page). Or is there a way to set up ad hoc via HTML Composer for an HTML page that will cover an entire portal page with the one panel? Also, having just one panel with one HTML page with all content, it doesn't allow for responsive UI design.

This message has been edited. Last edited by: CoolGuy,

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted

Kris

Silver Member

posted

Thanks CoolGuy... couldn't have said it better myself.

8.0.0.8
Linux/windows

Posts: 36 | Registered: October 24, 2012

Ignored post by Kris posted

StuBouyer

Guru

posted

quote:
Originally posted by CoolGuy:
Thanks Matt for your take on building filters that slide in and out at a page level. The trouble with your implementation is that the user can't customize their portal page AdHoc style by dragging in WF resources into the various panels on the page that the dev sets up for them. They would have to be able to drag and drop WF resources into that one HTML page in its panel that has the filters for the newly added WF resources to utilize those filters. Or is there a way to set up ad hoc via HTML Composer for an HTML page that will cover an entire portal page with the one panel? Also, Having just one panel with one HTML page with all content, it doesn't allow for responsive UI design.

This is not exactly true. you can remove the iframe that holds the report from Matt's example and add code to refresh all (or only some) reports in the portal. That way as long as your parameter names are common across all reports the end user can drag and drop reports onto the portal at will.

You can also change the portal parameter refresh code to call only that portal page/tab or the whole portal.

I've done this with a client where we designed the HTML page that only has parameters and then told the InfoAssist users that if they needed to use START_DATE, END_DATE, PRODUCT_ID etc as variable names if they wanted to use the "magic filters". We had four variants of HTML filters for different business groups - mainly just changes to input field names and icons.

Cheers

Stu

WebFOCUS 8.2.03 (8.2.06 in testing)

Posts: 253 | Location: Melbourne, Australia | Registered: February 07, 2007

Ignored post by StuBouyer posted

Virtuoso

posted

Stu,

Thanks for your input. I get what you are trying to say. I think I wasn't as clear as I should have been. I just edited my post to try and be more clear. My response was conditional upon there only being 1 single HTML page used that covers the entire portal page (no room for other panels). I need responsive design, and for our users to still be able to drag and drop WF resources into that sole HTML page if it's the only thing on the page. This being done to allow for a collapsible set of filters on some part of that page. This because IBI has no implementation for such at a portal level.

8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.

Posts: 1113 | Location: USA | Registered: January 27, 2015

Ignored post by CoolGuy posted