 |
prettygoodsoftware.org Discussion forums for Pretty Good Software Applications
|
View previous topic :: View next topic |
Author |
Message |
MisterRogers Site Admin
Joined: 30 Sep 2005 Posts: 581
|
Posted: Sat Dec 17, 2005 2:49 pm Post subject: html/css attribute tricks with Invoice Customization |
|
|
The current invoicing engine does have limitations; and many of you have ran into a few. A release at the end of Dec. or early Jan. will allow greater control over changing attributes for elements in a section, as well as reordering elements within a section, and sections themselves. But, there are some things you can do (undocumented) to tweak things, if you understand how iRatchet works.
iRatchet generates html on the fly to render invoices. So with just a little html knowledge, and a little knowledge on iRatchet internals, you can really do quite a bit. For example. If you want your company name in bold, you can go to 'Preference/Me', prefix your company name with '<b>' and postfix it with '</b>', and there ya go. iRatchet generates html/css style syntax for attributes, so it will accept your own, and give you bold in the case above.
A little more complex but workable; iRatchet generates font/color css style blocks for each section on the invoice. These are named after their sections. Below is a list of the blocks generated:
static NSString* cssClient = @"client";
static NSString* cssClientLabel = @"clientlabel";
static NSString* cssClientID = @"clientid";
static NSString* cssClientIDLabel = @"clientidlabel";
static NSString* cssCompany = @"company";
static NSString* cssCompanyLabel = @"companylabel";
static NSString* cssCompanyID = @"companyid";
static NSString* cssCompanyIDLabel = @"companyidlabel";
static NSString* cssProjectInfo = @"projectinfo";
static NSString* cssProjectInfoLabel = @"projectinfolabel";
static NSString* cssTimed = @"timed";
static NSString* cssTimedCaption = @"timedcaption";
static NSString* cssTimedHeader = @"timedheader";
static NSString* cssTimedTotals = @"timedtotals";
static NSString* cssTimedTotalsLabel = @"timedtotalslabel";
static NSString* cssFixed = @"fixed";
static NSString* cssFixedCaption = @"fixedcaption";
static NSString* cssFixedHeader = @"fixedheader";
static NSString* cssFixedTotals = @"fixedtotals";
static NSString* cssFixedTotalsLabel = @"fixedtotalslabel";
static NSString* cssTax = @"tax";
static NSString* cssTax2 = @"tax2";
static NSString* cssTaxLabel = @"taxlabel";
static NSString* cssTax2Label = @"tax2label";
static NSString* cssTaxID = @"taxid";
static NSString* cssTax2ID = @"tax2id";
static NSString* cssTaxIDLabel = @"taxidlabel";
static NSString* cssTax2IDLabel = @"tax2idlabel";
static NSString* cssDiscount = @"discount";
static NSString* cssDiscountLabel = @"discountlabel";
static NSString* cssSubTotals = @"subtotals";
static NSString* cssSubTotalsLabel = @"subtotalslabel";
static NSString* cssTotals = @"totals";
static NSString* cssTotalsLabel = @"totalslabel";
static NSString* cssComment = @"comment";
static NSString* cssClosing = @"closing";
static NSString* cssAdvance = @"advance";
static NSString* cssPayment = @"payment";
static NSString* cssAdvanceLabel = @"advancelabel";
static NSString* cssPaymentLabel = @"paymentlabel";
static NSString* cssMarkup = @"markup";
static NSString* cssMarkupLabel = @"markuplabel";
static NSString* cssMileageCaption = @"mileagecaption";
static NSString* cssMileageHeader = @"mileageheader";
static NSString* cssMileageItems = @"mileageitems";
static NSString* cssMileageTotals = @"mileagetotals";
static NSString* cssMileageTotalsLabel = @"mileagetotalslabel";
iRatchet supports sections that are not used by everyone, such as say markup. If you selected the markup section, set the font up the way you wanted, then prefixed your company name with '<markup>' and postfix it with '</markup>', the markup style would be applied to the text between the tags.
So, if your comfortable with this level of tweaking, and understand that
this isn't supported , you can do alot of tweaking. |
|
Back to top |
|
 |
MisterRogers Site Admin
Joined: 30 Sep 2005 Posts: 581
|
Posted: Fri Jan 05, 2007 2:47 pm Post subject: |
|
|
Hey All,
I drafted an email for a potential user giving an overview of the template system in iRatchet. Thought I'd capture it here for others:
Overview
iRatchet templates are organized into 'Sections' and 'elements'.
Sections
Sections are delimited by '<!--{{*}}-->' sequences. For example, the Timed Table section is delimited by '<!--{{Timed Table}}-->'. Sections make templates more difficult to design, but they're important in supporting invoice compositing. In relaxed workflow mode, iRatchet has the ability to composite together multiple projects, or composite invoices from a single project with items set to differing states (open, billed, paid, etc.). To support compositing, iRatchet 'assembles' the html on the fly, as a composited invoice could have more than one timed item table, etc. More on sections later.
Elements
Within a section, columns or fields are delimited by element sequences '<!--{*}-->'. iRatchet uses elements to support reordering/visibility of elements through the UI. For example, in preferences invoice, you can select the 'Hourly Table Column Headers' section, and reorder the elements in the labels table, which will reorder them in the rendered html table. Internally it works pretty much as you would expect. iRatchet loads up a template, carves it into sections, then uses the element properties (order/visibility) to generate the proper html for tables, etc.
Style and Data Tags
Tags are delimited by '[]' characters. The two main types are data which are named after the data element that will be inserted, and *_STYLE tags which gives the user font, size, color, etc. control through the preferences/invoice UI. For example, when you selected the 'Timed Table Column Headers' section and set a font, size, color through the UI, iRatchet will generate a css style block that matches your settings, and set the style name in place of the '[TIMED_TABLE_STYLE]' style tags.
Rules
Because of the section/banding model iRatchet uses, there are a few design rules that you must follow:
1. Your html/css must be written such that sections are not dependent on styles that may or may not be rendered. For example, if you open a block in the Project Info section and then code your Timed Table section to expect that block styling, the Project Info section may not be rendered, and generated html will be invalid. The exceptions to this rule are table rows, which will always and only be rendered within a table.
2. iRatchet is stable against tag removal. If you want to hardcode styles, headers, etc, iRatchet will handle that just fine.
Best way to get started:
1. In the Invoice Templates folder, copy and rename 'Clean.htm' to whatever.htm you want.
2. Copy and rename 'Clean.css' to whatever you want.
3. Open up you renamed clean.htm file. Be sure to use an html appropriate editor. At the top of the file is a section called 'Multiple Styles'. Change the 'Clean' style reference to whatever you named your copied css style file.
4. Launch iRatchet. You'll now see your template/style available in the reporting preference. While you're in there, check the 'Invoice design mode' option. This will do two things for you:
a) With iRatchet running, you can tweak the template/css file, and when you refresh invoice preview (the refresh button will be enabled), iRatchet will reload the template from disk so you can view your changes. This allows iRatchet to act as template viewer.
b) iRatchet will emit the generated html to the console, so you can see the assembled output. This is obviously of great value.
Now, depending on what you want to do, you can get alot of design mileage out of simply modifying your css file. If that's not going to cut it for you, then have at the htm file. The bloke who did my templates generally followed these steps:
1. Using your favorite visual html designer, build a template with the sections in it needed by iRatchet (company info, client info, project info, timed table, timed headers, timed items, etc.) You don't need to worry about splitting it up, just be sure all the elements you want are in your design.
2. Then carve it up, wrapping the various html chunks into sections, elements, etc.
If you design something you like the look of and it's slick, If you send it to me I'll so the reformatting for iRatchet consumption. In trade, I'll add it to iRatchet for others to use. |
|
Back to top |
|
 |
trombonegirl
Joined: 10 Nov 2007 Posts: 6 Location: Winnipeg, Canada
|
Posted: Sun Nov 11, 2007 11:54 pm Post subject: Can you do this HTML-ing with MacFreelance? |
|
|
Hmmm. This looks promising, but I see the posts are quite old.
Just picked up a copy of MacFreelance and am unhappy with the editor - doesn't seem to work at all (greyed out)...
Can I use these HTML techniques in the new MF?
Karin _________________ *-*-*-*-*-*-*-*-*-*-*-*
Be who you are and say what you feel;
those who mind don't matter and
those who matter don't mind.
~Dr. Seuss |
|
Back to top |
|
 |
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
Powered by phpBB © 2001, 2005 phpBB Group
|