Menu
▾
▴
#95 Possibility to open popup in new window
My projects would like to have a possibility to open some content in a new window that pops up. There are actually three elements that could be used for this:
1. The eLML "popup" element does not offer that possibility yet because the content "pops up" below the link with eg. a question on the same page.
2. The multimedia element offers a thumbnail attribute and if that is used opens the main multimedia object in a new window. BUT it is not possible to define the size of the window nor to include eg. the legend etc. in the window that pops up since the link generated is directly to the multimedia object.
3. The link element does offer the possibility to open a link within a new window (target attribute) but neither the size of the window nor the hidden status and address bar can be defined for the new window.
If we want to offer the possibility of popups in new windows we need to discuss the following topics:
- Which elements will offer this possibility? Only one of the three listed or all three?
- What attribute do we need? Eg. height and width of the window, hidden address bar etc.?
- How are these new window options implemented into the print version?
- What kind of source is within the window that pops up? Comment see below
My last point is for me the most difficult point. We need to define what exactly is the source of the window that pops up. Eg. the multimedia element at the moment only opens the object itself (eg. directly the JPG file or flash animation) within a new window. If we want to add the legend or bibliography to that window, then the popup window needs to be an XHTML file that need to be generated. Same with the actual "popup" element: If we want to content of the element to be shown in a new window there needs to be a XHTML file that is generated on the fly. The link element on the other hand would not need a new file since links in new windows are only allowed if absolute links (http://www.blabla.com) are used.
Comments?
Logged In: YES
user_id=1150921
Originator: YES
This is how the project GLOPP creates their popups. In the link element they use:
javascript:void(popup('../../../A4_popup/en/html/popups_pop_4_1_fig1.html?olatraw=true','1',800,690));
And in their elml.js they use the following script:
// ******** popup window ****************
function popup(mylink, windowname, widthNow, heightNow)
{
var href;
if (typeof(mylink) == 'string')
href=mylink;
else
href=mylink.href;
// center popup window on screen
leftPos = 0;
topPos = 0;
if (screen) {
leftPos = (screen.width / 2) - (widthNow / 2);
topPos = (screen.height / 2) - (heightNow / 2);
}
newwindow = window.open(href, windowname, 'width='+ widthNow +',height='+ heightNow
+',scrollbars=yes,resizable=yes, left='+ leftPos +', top='+ topPos +'');
if (window.focus) {newwindow.focus()}
}
Logged In: YES
user_id=1150921
Originator: YES
Decision of yesterdays eLML Meeting:
There is no decision... Discussion continues here!
Depending on the way this is implemented, there are different problems. Let's look at the three options:
1. popup element with a new attribute to define if content pops up in same window or in new window. This is the most elegant solution but there are some problems. The author wants a possibility to define the width and height of the new window, if the window is resizable, scrollbars are shown, status bar etc. There are lots of attribute that could be defined (see eg. http://de.selfhtml.org/javascript/objekte/window.htm#open\). How do we handle this? One suggestion: We offer the attributes width, height and maybe something like "windowDecoration" with the values "all", "none" (showing no status bar, scrollbar, address bar etc.) and maybe some third option in between. Still there remains the problem of the actual HTML code used, which I will describe in the second item.
2. It would be easy to implement that if a thumbnail is used the new window that opens has an HTML file as target instead of the actual Flash or JPG file as it is now. Furthermore the width/height values could be used for window size. But the problem that remains is what HTML code is generated, what template is used. Would the background color be white? Would it be possible to define the background color? What about the font size and font style used for the legend? Would we just reference to the elml.css file of the project or would this cause more problems?
3. Here we have the same problem as with 1. What kind of new attributes would we have to offer?
The discussion is open. From what I saw now nearly all projects have some kind of popups and everyone implemented it differently:
- GITTA: Uses just the features available now
- GLOPP: Created a special lesson with only popup windows and references via link to these HTML files
- PTO: Created the popup HTML windows separately and stored them in the multimedia folder. No content in the actual XML file and therefore an HTML-only solution.
- etc.
Logged In: YES
user_id=1797906
Originator: NO
Probably we have to look at the requirements of some individual project in order to be able to define the functionalities of the new popup feature. Find the summarized needs of the project efeed below. They basically use popups for displaying pictures in a bigger size. Popups appear upon click on the small picture.
In this particular case the multimedia element would suit best (and is currently used), as we need the options multimedia elements offer (legends etc.). As for the attributes of the popup window: width, height and - important in the eyes of the efeeders - header (possibility to set descriptive title bar). Do we necessarily need a XHTML page in order to achieve the last issue? If so, adapting the background color and fonts of the popup to the color and font of the original page would be nice to have but as the content of the efeed popups is just the enlarged picture no requirement for them.
What other requirements / use cases concerning the popup content and format are there? Is it just for enlarging pics or opening flash files? Does anyone need text in the popup? GLOPP?
Logged In: YES
user_id=1150921
Originator: YES
As you can see on this page:
http://www.elml.ch/website/en/html/unit_output.html
I included a new script for popup windows (click on screenshot). Might this be a solution? Should we include this script into eLML? Would it fit the needs discussed in this request?
I have two different applications for popup windows:
A. to show sample solutions ("Musterlösungen") which are too long for a normal popup
B. to offer the user to have in a separate, slim window the code examples s/he should type into the matlab application. This window can be placed beside the application, which is much more convenient than having to switch back and forth between the tutorial and the matlab software (similar as in the E.Tutorials, see http://www.et.ethz.ch/\).
So now to the question of where to put the contents in the print version.
For A, an Appendix would be the best option, as I would not want the solution to be right below the task in the print version (as it would be in a normal popup element).
For B, these contents are redundant, so I would not want them anywhere in the print version.
So, in my view, a popup window should at least have the options to have the contents a) as in the normal popup, just as a box inserted in the main text, b) nowhere, c) in an appendix. As a sidenote, the possibility to create an appendix for each lesson, also for other contents, might be of general interest (similar to the glossary).
The popup window itself, in my opinion, would need at least the following attributes:
- width, height, position
- window title
- window name (to be able to re-use windows)
- some options to configure button, status, and scroll bars (as suggested in other comments)
- maybe a cssClass for the window body to be able to influence global properties such as background colour, margins etc.?
My intuition, based on the previous discussion, is that a new element such as "popupWindow", derived from the popup, seems the most appropriate solution.
So, the new script you proposed, Joel, does not work for these projects? Are we going to implement a new (optional) element? Please define how this should look like (name, attributes, occurence,...).