How to resize custom widget or container widget?

Submitted by skenguva on Fri, 07/15/2016 - 16:21
1
0
-1

Hi,

I have a requirement where I have to ensure that my custom widget is displayed the entire webpage.(top to bottom, left to right). No empty space should be present.
Right now the custom widget can be displayed 100% of webpage's width(i.e 12 columns) and approx. 30% webpage's height, but I want the custom widget's height to be 100% of webpage. Is it possible to do this in BPM 7.2? If yes, please give details.

Additionally another question is: Is it possible to change the height of the container widget? If yes, please explain how.

Thanks,
Santosh Kenguva

resize widgets
2 answers

Submitted by skenguva on Mon, 07/18/2016 - 09:09
1
0
-1

Submitted by Sean McP on Fri, 07/15/2016 - 23:56
1
0
-1

This is actually a problem of HTML not Bonitasoft. HTML reduces white-space to ensure speed of response and amount of data on the web.

You will have to develop your own solution based on your requirements, but here are some pointers on how to do it:
http://stackoverflow.com/questions/712689/css-div-stretch-100-page-height

http://stackoverflow.com/questions/90178/make-a-div-fill-the-height-of-t...

regards
Seán

PS: If this reply answers your question, please mark as resolved.

Comments

Submitted by skenguva on Mon, 07/18/2016 - 09:10

Hi Sean,

Thanks for your response and your time. I appreciate it very much.
I checked your pointers, thanks for the same. I am using almost the same code

In my case, when I open my html in any browser(chrome, Mozilla, IE or even mobile chrome), the page is displayed with 100% width and 100% height.
However, when I include the same code in my custom widget and try to display the custom widget, then the width is 100% and height is just about 20% to 30%, where as I want height to be 100%.
Since the html is displayed as required in browsers but not in Bonitasoft, I still wonder if its problem with my code or if I need to do some settings in BPM.
If the widget can be set such that it can be displayed 100% width and 100% height of any webpage, then my problem would be solved.Please suggest.

Thanks,
Santosh Kenguva

Permalink
Submitted by Sean McP on Mon, 07/18/2016 - 09:41

I hear you, there are no settings in BPM at all.

Width is easy to do because everything is as wide as the screen, but HTML pages can be bigger than the screen which means you have to calculate what 100% is.

Not sure that makes sense.

What you will have to do is add some javascript to the page, determine the page width and height and then change the containing DIV to have height="??px" this might work for you.

But there is no easy way to do it unfortunately.

So I search and find this:
http://stackoverflow.com/questions/5721904/make-body-fill-entire-screen

html {
   margin: 0px;
   height: 100%;
   width: 100%;
}

body {
   margin: 0px;
   min-height: 100%;
   width: 100%;
}

You would have to execute javascript to alter the page with these values after it has fully loaded...I have that somewhere but not on this machine.

regards
Seán

Permalink
Submitted by skenguva on Mon, 07/18/2016 - 12:45

Thanks Sean.
Is it possible for you to share what you have in regard to: execute javascript to alter the page with the values after it has fully loaded? I think that might might be very useful for us.

Permalink
Submitted by Sean McP on Tue, 07/19/2016 - 04:15

In two months, maybe...

My systems are all in shipment between the Middle East and New Zealand. Needless to say there are some files I didn't manage to copy / forgot to.

regards

Permalink
Notifications