Print Current Page Question

You can do a lot with Lectora without any knowledge of Html, CSS, or Javascript. But Html extensions are purely about this. The "only" function this object has, is adding a self-written snippet of code to the published pages. Explaining the possibilities of this feature to full extent would (more or less) mean explaining html, css and javascript (and many other languages) completely, i.e. fill 1000s of pages. The basic functions (what the Trivantis developers think are the basic functions) are already integrated in Lectora as "Actions" (usually javascript) or "Properties" (often CSS), at least when publishing to a html-based format. For your task (which is not too advanced, but still not basic) there a many possible solutions:

1. Use only Lectora

Make the page and the textfield you want to print as long / high as it needs to display the whole text. Open that page in a popup, not with a "Display page in popup"-action but with "Go to" "Target Page", Set "Open in:" to "New window". Open the "New window properties" via the icon on the right of the "Open in:" field. Uncheck "Use default size" and enter the appropriate size of the window. If it's smaller than the page size the browser will provide you with a scrollbar. Use the normal "Print current page" action and all the text on that page will be printed.

It's only the textfield with a "Vertical Scroll" that's preventing the text from being printed. If you don't want to remove the scrollbar from the textfield, you can:

2. Use CSS

In that other thread Sergey published some code, that can change the style of the page or elements on the page but only for the printer. Add a "Html extension" to the page you want to print. Set the type to "Meta tags". Click edit and paste:

undefined

This style will make the text, that is hidden until you scroll, visible for the printer. You won't see any difference on the screen, but all of the text will be printed when using the normal "Print current page" action. If you prefer to learn about javascript instead of CSS you can

3. Use javascript / jQuery

... and follow Darrels guidance which is usually excellent and comes with a working example. Remember that learning about jQuery will open a whole world of possibilities to you (maybe even in a new window).

Tim

You can leave out the entire line - ‘undefined’+ if you'd like as this is not necessary for what we are doing. It wont hurt anything if left in.

DRS

Hi Deron. If I understand you correctly, you have your students notes (variable) mirrored in a scrolling text field and you want to print the entire contents, not just what is visible on the screen, correct?

The good news is that you do not need to understand JavaScript to get this to work. You only need to know how to add some external JavaScript and implement it.

Because this utilizes the jQuery library you will need to either link to it via cdn or download it and include it in your project. To link to it, add an HTML Extension. Choose Meta Tags and then open the EDIT and enter the following:

The print-action will always print the whole page. The problem results from the "Vertical scroll" at your textfield. If you created a popup page that is long / high enough to contain the whole text and let the browser window do the scrolling (instead of the textfield) all text will be printed.

If you're familiar with CSS you can also use the info from this thread:

http://community.trivantis.com/forums/topic/non-printing-buttons/

Tim

Thanks Tim...I'm not well-versed with CSS or the HTML Extension feature in Lectora.

I do wish Lectora had classes (at LUC) or added the feature to the E-Learning Uncovered book...more so than having only 1 page dedicated to this very important and extremely expanding function. Instead you get the Caution caption at the top of the page with ... "If you don't understand HTML, JavaScript, or other programming languages, this procedure may not make a lot of sense."

I fully agree with this statement, however, I believe basic actions and functions could be provided based on what I've tried to do and what I have researched and then could be expanded by the user as they gain more experience.

I took a look at the other thread and work to try the information in my course. Good news is, it's not something I need quickly so I have time to figure it out and try the work with the information you provided.

Thanks again,

Deron

@Timk - I just tried to use your CSS option and then previewed it in browser. Unfortunately, it still won't see whatever text isn't visible on the page from my scrolling text box. Does it actually have to be fully published (vs. preview in browser) for it to work? I also tried deleting and replacing the quotation marks, in case Lectora didn't like the way they copied over. Do I maybe have to substitute something in the code you provided with a "real" name of something? Or is it possible that something has changed with the newer version of Lectora?

I liked this CSS method because it seemed so much simpler/shorter, but I'll have to go with Darrel's method if I can't get this one to work... (Unfortunately, the "Lectora Only" option isn't viable for my situation, because the text box is built with a combination of static text and the contents of entry boxes that the user has typed in, so there's no way to know exactly how long the resulting text will be.)

Thanks, in advance, for any help!

Laura

@timk - Thank you, thank you, thank you!!!!! That worked like a charm and you've saved my project! And thank you for the quick response, too!! :D

Hi Laura,

there have been some changes with regard to how the page is built in Lectora 17. Whether there's a difference between Publishing and Preview in browser depends on how you want to publish because Preview in Browser is never "Seamless".

It should work both seamless and not with this CSS:

undefined

You do have to replace the quotes around "text" or it won't work. I'd put the code into a code block, but that isn't working correctly for CSS.

Tim

Hi Darrel.

I'm trying your jquery method to print a table element on a page. I am using Lectora 17 and the issue I am running into is the print window that gets created is coming up with "Undefined" in it rather than the table. I put my table into your Lectora example and it works fine. Is there some code that needs to added when using 17 with seamless play selected? Do I need to use "getDisplayDocument()" to access the the table?

Thanks.

-Shawn

Yes, Shawn. Try something like this when using seamless play.

First create a variable and store a reference of your table.

var toPrint = getDisplayDocument().getElementById('your tables name');

PrintElem(toPrint);

Let me know if that does it for you. If you have any trouble, please post a sample and I will try to get it working.