Quadriform Dataserve is a web solutions company :: Home
This new design is an example of the advantages of using Style Sheets or CSS
as it is usually referred to. The whole site was revised in a matter of hours. This would have been a much larger operation if the site was done in a the older html code. So if you would like to take advantage of this kind of design, get in touch! Along with the update of the site using a new style sheet, a version for the iPhone and iPod Touch has been produced. If you are using one of these devices to read this site and you have a problem we would like to know!
Get rid of your old stuff!
Still using old technology? Why? Throw out the old gear like this typewriter, or give it to a museum. Contact us to assist you in making the transition to new ways of doing business via the internet.
[The above pictures have been viewed many times, so I thought to add a little more information about them. This old typewriter was discovered lying in the sand on a beach on the north coast of Scotland, near Thurso, Caithness. The thing was lying undisturbed in the soft sand, it is quite staggering what people throw away, with no regard for the environment. I had passed the spot before but only when the tide was down is the old rusty typewriter visible. I contemplated removing it to have as an unusual ornament, but decided to leave it for others to wonder at.... did an irate writer pitch it into the sea due to frustrations with a new novel? Or was it disposed with because a new electronic device had rendered it obsolete? How long might it have lain in the sand, washed over twice a day by the tide? Does anyone know what make or brand it might be, the distinctive front piece above the keys maybe a clue? me if you know! ]
Returning to the main theme... we specialize in developing web based applications for people to make better use of the Internet. We started like so many with "Online Brochures" but we rapidly realized that there was much more that could be done and we started creating bespoke e-commerce and other interactive applications.
Text Manipulation :: GREP [Regular Expressions]
There are many occasions when I have witnessed people working at a computer doing boring and repetitive tasks, sometimes unnecessarily.
After setting up an automated process for manipulating some text files, a client asked how had the modifications been completed so rapidly, well it was all done with regular expressions. The client was impressed by the technology, but was surprised he had not heard of it as his IT staff had never mentioned using it and such a procedure could have been usefully deployed on numerous occasions!
Text manipulation may strike you as the most boring subject on earth, but to a large extent many business processes include a lot of this tedious work. Some years ago, in the last century, I started using Regular Expressions
to solve the problem of getting large quantities of text into a form which could be used for a technical manual on the web. This sparked my interest in regular expressions and to be honest it is as addictive as Sudoku! Added to Applescript it can make a very powerful processing tool.
From a technical perspective, no doubt many programmers and the like will regard GREP
or regex
[Wikipedia Definition here] as a routine power tool for performing text searches and manipulation. However it is less known, or hardly even contemplated, in the world of graphic design and web design. Like so many things in business, different departments may guard the information they have jealously, so people in the design section struggle away copying, pasting, editing, until they drop, completely unaware of a small tool which could make their lives much easier.
In simplistic terms writing a regular expression to search for a particular text pattern or string, to use the technical terminology, is only the beginning, the ability to construct a replacement string is perhaps the real advantage. The combination of these two mechanisms is a very powerful tool.
My reasons for setting out this information to our readers, here, is to point out how this technology can be beneficial to projects we undertake in time and money and it was the recent receipt of two documents amounting to 137 pages with listings of colours in both RAL coding and Dulux notation, that reminded me to brush up on my use of regular expressions! More on this below.
There are many flavours of regular expressions, which I will not go into here, as I suspect most readers will not be concerned as to the nuts and bolts of the system, for those that are and want to learn more, there is an excellent book Mastering Regular Expressions
, 2nd Edition
by Jeffrey E.F. Friedl. O'Reilly & Associates, 2002. ISBN 0-596-00289-0 Available Here
Continuing on the problem with the lists, this is an example of the data received.
Below is the required style in a table in html.
| 00 NN 05/000 | 7500 Black | 73.11% |
| 2730 Blue | 17.92% | |
| 6219 Red Oxide | 6.41% | |
| 7016 White | 2.56% |
This appears fine until you copy the data from the word processor document, it is represented as shown below:
00 NN 05/000 7500 Black 2730 Blue 6219 Red Oxide 7016 White 73.11 17.92 6.41 2.56
You will see that the data contained in three columns is listed in the order of the columns, however the pigment percentage needs to be adjacent to the appropriate colour, as it appears in the original document, but this is not how it is presented in an html table, shown below:
Basic html to achieve the tabular layout.
<table border="1" width="100%" cellspacing="0" cellpadding="2" bgcolor="white">
<tr>
<td rowspan="4" valign="top">00 NN 05/000</td>
<td>7500 Black</td>
<td>73.11%</td>
</tr>
<tr>
<td>2730 Blue</td>
<td>17.92%</td>
</tr>
<tr>
<td>6219 Red Oxide</td>
<td>6.41%</td>
</tr>
<tr>
<td>7016 White</td>
<td> 2.56%</td>
</tr>
</table>
There are additional considerations, the colour reference column is required to span the number of pigments that are used to make up the colour, this varies in the listing from two to five pigments and each pigment should have a percentage sign after it.
To re-order the listing to get the text into the form required for the tabular layout in html is an ideal job for regular expressions (regex). To attempt this without using regex is both daunting and likely to cause the unfortunate individual tasked with the job to seek new employment elsewhere. But most importantly, it is a huge waste of time and energy to tackle such a job any other way.
The expression below will select the entire block of text as set out in the client document. (It has been split over four lines for ease of reading.)
^(\d{2}\s\w{2}\s\d{2}/\d{3})\t(\d{4}\s\w+\s?\w+$)\r
(\d{4}\s\w+\s?\w+$)\r(\d{4}\s\w+\s?\w+$)\r(\d{4}\s\w+\s?\w+$)\r
(\d{1,2}\.\d{2})\r(\d{1,2}\.\d{2})\r(\d{1,2}\.\d{2})\r
(\d{1,2}\.\d{2})
At first glance this gobbledygook may seem as bad as working through the document and changing it one part at a time. But it is really not very complicated once you understand what is happening. The replacement expression to get the data into a table is as follows: (again split over four lines for ease of reading.)
<tr>\r<td rowspan="4" valign="top">\1</td>\r<td>\2</td>
<td>\6%</td></tr>\r<tr><td>\3</td><td>\7%</td></tr>
\r<tr><td>\4</td><td>\8%</td></tr>\r<tr><td>\5
lt;/td><td>\9%</td></tr>
The expressions are not necessarily the only way of searching through the document to extract the required data, but are ones I used for this project. In essence what is happening is that the data is considered in a series of packets, made up by the colour reference, each pigment and the percentage, giving 9 pieces of data. These are then replaced in the order required and with the percent sign along with the surrounding html tags to make up the parts of the table.
How these expressions are constructed will be shown next, check back for the details soon.
If you are looking for an organisation who can make the most efficient use of time to deliver a comprehensive web application, get in touch, if you would like to see an example of regex in action the site featured here was build using this technology its an e-commerce site with over five hundred products click on the image or here. The starting point was a Quark Xpress Document used by the print publishers to create the magazine, the online version was derived from this data.
Photo Viewer [From a recent visit to Dunfrieshire]
New Project, Vetrocolour Complete Revamp
Vetrocolour is a glass coating company, producing some architectural gems, the web site is undergoing a complete revamp, to demonstrate the capabilities of this flexible coating system.
To strengthen the brand image the site colours change on each re-load to reflect the logo colouring, all done with css
Lasso
and a bit of Javascript
