CODEWITHSUNDEEP
javascriptjqueryhtmlcssprinting
James Skidmore
James Skidmore

Reputation: 50328

Ideas on limiting content to single printed page?

I have 5-6 text areas that users fill out in a template (a couple of columns, basically a newsletter format). I'm needing to limit their content to one printed page, but I'm having a hard time coming up with practical solutions. The printed format (margin, font size, etc.) will be the same for all users, as it's printed from a central source.

I've had a couple of ideas, but all of them seem rather unreliable and difficult to implement:

What ideas do you all have? I appreciate your help!

Upvotes: 0

Views: 807

Answers (3)

x77
x77

Reputation: 737

Reduce Line Spacing when Page Overflow.

LineHeight = 12 'Default

MaxLines = 50

-Here you Count lines

if CountLines > MaxLines then LineSpace = lineSpace * MaxLines / CountLines

Most complex option is change Font Size until Fit.

Upvotes: 0

Gus Melo
Gus Melo

Reputation: 322

You could format your printout using a monospaced font - this means every letter/number/etc on the font is the same width (e.g. Courier). Monospaced fonts were very popular in early computer days for similar reasons - it allowed developers to have control over what was being displayed on the screen.

With a fixed width for your columns, you can now determine exactly how many characters the user can add per line. The only challenge left is accounting for linebreaks, which you can do by searching for them with Javascript.

So, given these variables:

  • of characters per line in a given element (width of your column)

  • of lines per element (height of your content box)

You can now know exactly, ahead of time, whether your content will fit on a page.

You count the number of lines per input field, and a linebreak just forces you to start counting another line regardless of how many characters are in the current line.

This should give you exactly the amount of control you need.

As for the looks, as long as you're going for that "typewritten" feel it's not that hard to style it to look interesting ;) A quick web search yields some monospaced fonts that could help:

Upvotes: 1

Gert Grenander
Gert Grenander

Reputation: 17104

Measuring the content etc can be very tricky. Instead, read up on how to make a print stylesheet. CSS gives you some control over what and how text gets printed.

Edit:

I've never done restricted page printing the way you intend to, but I think by using a fixed font (each character takes up exactly the same amount of space), you could perhaps be able to pull it off. So, try print a page full of fixed font characters, then see how many characters you fit in x and y. Then use JavaScript to monitor (on the fly, using for instance jQuery) the input boxes on how many rows they've used up. You would then be able to limit the users from entering too much text/linefeeds (you will need to write all this code, since I doubt there's a solution out there for this). You will also need to take into account the spacing in between the text areas on the printed page. Does this makes sense?

Upvotes: 1

Related Questions