This is an old revision of the document!
There are tech comments in italic
Page layout
The layout will be fixed width
Add new design could be placed as a single element or added into every Label design area (should be discussed with Andreas)
Section 1 - Design area
Design area includes different controls to customize the label, Flash Area to represent results of customization. All controls will be made as HTML elements. Each design could include one image and many text lines. //Interaction of controls with flash will be based on JS-Flash integrations (http://www.permadi.com/tutorial/flashjscommand/) //
Lines
Each stamp size has a maximum number of lines to be added for design so the number of lines will be from 0 to MAX_FOR_SIZE, this will be controlled by the code of Add new line. Initially on label creation there are 0 lines. Add new line click produces an addition of new Line Group, which including text input to add line and removal 'x' icon to delete line from design. Text added into the line will be immediately shown in Label Area, the new line will be placed into free place and auto - adjusted in sizes. Also we need to define a condition, when the new line couldn't be added because no free space The interface of label design area needs to be adjusted that in different circumstances there could be different number of Line Groups.
Font selector - select for fonts
Add own image - this button click will launch file selector to file upload using SWFUpload package. If the file is in unsupported format or not uploaded - there will be a notification message to user, nothing will happen with flash. Image will be added/replaced to the Label Area. Image will be auto resampled on upload case of image sizes is more then available free space, keeping aspect ratio. The button click also hides motifs selector area
select from motifs - this button click will launch sliding down motifs selector area which will be the same as current merkalt.no in layout. The selected image will be added/replaced to the Label Area, the same rule for resampling.
ALIGNMENT DEFAULT CONTROLS - controls which setup initial alignment of elements. the interface for this area is unclear, probably could be realized as a select with different positions of image location (top left, middle center, middle bottom, bottom center, bottom right, etc.). //Functionality will change Label Area blocks grid - the grid needs to be auto adjusted keeping the same sizes of blocks as they were used //
COLOUR SELECTOR - will be similar to http://ecritters.biz/colorselector/, be integrated lated . Change of colour will result changes of all texts colours
Size selector - a group of radio buttons (or could be realized any other way) which will change the size of label designed. //Change of size will result in change of Label Area size. Current controls in Label Area will be resized - reduced on area reducing, kept the same on area increasing. Aspect ratio will be kept the same.
//
Flash Area
Flash Area is the container for Label Area. Flash Area size is the max size from the stamp sizes (please note that sizes are done in mms) 40 x 90 + paddings.
—STAMP SIZES—
- 10×60 mm
- 12×12 mm
- 14×38 mm
- 18×50 mm
- 20×20 mm
- 22×60 mm
- 27×70 mm
- 30×30 mm
- 34×58 mm
- 40×40 mm
- 40×90 mm
Label Area
Label Area is used to store customization design. It is a bordered area inside Flash Area. It is important to keep aspect ratio of Label Area. Label Area could contain one image and numerous lines. One image or one line forms a block. Blocks could be resized and moved, without crossing (overlaying) borders of other blocks. Blocks could be moved and resized only in active state (active state is set when user is clicked on block, block is bordered in active state with small resize icon. if the user clicked on block and move mouse the block will be moved. If the user is clicked on resize icon and move mouse, the block will be resized. There will be minimal sizes of font and minimal width and height, block couldn't be made less than such sizes)
Any change in Label Area will result in changes of resulting jpeg image which will be 600 DPI resolution and sizes in pixels approximately equal to stamp sizes in mms.
Section 2 - Labels Listing
The functionality and layout of labels listing will be mostly the same as on the current merkalt.no. Each position will be represented by labels 'types' and a small copy of Label Area jpeg. The main difference is that there will be different image sizes, because of different stamp sizes used. QC block means quantity controls
Payment option section is a new section with selectors of payment type (Paypal, Cash on delivery, Bank transfer, Invoice). Option selection will result in price change
Section 3 - Customer Info
The functionality and layout will be mostly the same as on the current merkalt.no

