Historically, this "suite" began life as two separate programs, each with its own data base. First, a program to produce, on paper, a brief classified list of products for selection while working in the kitchen. Second, an app to review and elaborate the kitchen list and choose relevant quantities, to provide a practical list for use in the supermaket (possibly by another person), employing a smartphone with WhatsApp or similar app.

Eventually, I decided to amalgamate the two separate apps into a new app with a single data base, in order to save unnecessary work. The "Shopping Suite" is the result.

On the left is a screenshot of the program being used in the "Supermarket Mode" of list production where quantities are being inserted.

Firstly, you can make a list of products (falling into 24 categories) for use in the kitchen. It consists of 2 pages which can either be printed on separate sheets of paper, or one page on the back of the other. Product descriptions are brief so that they easily fit into the columns provided. From this full list of products, you just mark the ones required for your next intended purchase. The Shopping Suite app starts up in "Kitchen Mode", and this is where you prepare your pages for the kitchen list.

(Notepad or similar app)

(Desktop version of WhatsApp)

DOCUMENTS: KITCHEN LIST AND SUPERMARKET LIST

But first things first. Let's have a look at the documents the app is able to produce:

Armed with the kitchen list where you have already selected the products you need, you now return to the Shopping Suite, and after startup you click on the large button on the right-hand side to kick it into "Supermarket Mode". The briefly-described products for each category now all appear with a "0" (zero) as the first character, representing a zero quantity. You can now go through the list category by category, changing the zero quantities of products into the number required. You can also elaborate the descriptions "on the fly" as much as necessary with preferred brand names, comments, etc.

What comes out of "Supermarket Mode" usage then, is a text (list) which, once saved and subsequently opened in Notepad or similar program, can be pasted into the WhatsApp that you have installed on your computer as well as on your smartphone.

So in the supermarket (or wherever you do your shopping), you, or another person, can now consult the smartphone to pick up the products in the required quantity.

This is a screenshot of the app when it first opens in "Kitchen Mode". As yet, there are no products displayed. You need either to type in the products as a list in each of the 24 categories, or if you have done this already and saved a file of products, you can upload it. But you can also upload an example file HERE to help you get started. You can then adapt it to your needs, and save another file.

[By the way, the design of the interface might give you the (wrong) impression that there are 12 categories on the left under "KITCHEN", and 12 categories on the right under "SUPERMARKET". Not so! All 24 categories on both the left and right apply to 'KITCHEN", and the same 24 categories apply equally to "SUPERMARKET". OK?]

Our first task then, is to create and print a kitchen list. What follows is a step-by-step description of how to do it.

If you need this HELP while you are working, just click on the question-mark icon in the top left-hand corner.

As I said, you can type up your kitchen list from scratch. Click on each of the 24 category buttons and type up a list of products for each category. As you move from category to category, the browser remembers what you have typed, so you don't need to worry about losing your work. When you have finished, you can save the 24 categories of products as a single file on your computer. Hitting the "Save" button at the top will provide you with the required dialogue.

The order of products within a category can be of your preference. For example, if you are sufficiently familiar with the layout of your local supermarket, you can make the order of products follow your journey around the building. That's fine until they decide to alter the supermarket layout! Or you might have other reasons for a preferred order. If so, make sure you save it early on, as soon as you have finished the lists for the 24 categories. I say this because you can also get the app to sort your product lists into alphabetical order. You might even want a sorted list as well as an unsorted one, and you can save both. However, if you sort your lists using the "abc" icon (just on the right of the KITCHEN mode button), there is NO UNDO! So save your unsorted list first, and then you can load it up whenever you want. Click on "abc" afterwards and do another save for your alphabetically-sorted list. Of course, if you only need a sorted list, you don't need to worry about losing the original order at all.

Whatever you type when describing the products, make sure that each line is SHORT! The lines need to fit into the boxes of the kitchen list. If not, you will create a mess. Later, when you prepare your list for the supermarket, you can elaborate (almost) as much as you want, including brand names and so on. Inevitably though, you will make mistakes in this regard, and after seeing a PRINT PREVIEW, you can go back and shorten your lines as required.

So this is a picture of you working in KITCHEN MODE. (If you move out of it for any reason, just click on the "KITCHEN" icon to return.) You've uploaded a kitchen list file (if you have one) using "OPEN", and you are editing it according to your needs, clicking on each category button for its respective list. Editing is the same if you start from scratch without an uploaded file. If you want the category lists in alphabetical order, you SAVE your original whole list first, click on "abc", and do another SAVE, giving the output file an altered name If you wish to keep the original).

[I suggest you AVOID editing kitchen files outside the app (e.g. in Notepad). They are in a special format, and if you don't get it right, the Shopping Suite will be unable to read them.]

So now it's time to look at PRINTING:

PRINTING KITCHEN FILES

GETTING STARTED: EDITING AND SAVING KITCHEN FILES

Once you are satisfied with your edited kitchen list, you need to get it printed. Just click on the PRINT icon. Two new browser windows will open. Here's a picture of one of them (the first - the second dispĺay is similar):

Comparing this image to the one of the kitchen list shown above, this might not be quite what you were expecting! That's because the window is in "mobile friendly" mode that is also handy for printing. This concept is explained elsewhere.

For now, have no fear! Do a PRINT PREVIEW in the browser, and this is what you will see:

After printing page 1 of the kitchen list, you can print page 2 on the back of it, or separately if you prefer.

The two printing windows can be closed now, unless you need more copies.

So now you have the kitchen list on paper, it can be marked manually according to the products you are running out of, or other products you intend to buy at the supermarket. You will need it when you return to your Shopping Suite app in order to decide on quantities and possibly to elaborate on the product descriptions.

But while we are on the subject of quantities and elaboration of descriptions, it needs to be explained that the Pharmacy (the 24th category) is regarded as SPECIAL, and this is explained in the following section.

You will note that a Pharmacy (Chemist's) category has been provided on the kitchen list, where there is limited space for the description of the products. That's fine if you buy the products yourself and you are familiar with the exact specifications of the medicines etc. you need. However, regarding medicines particularly, it is important that there should be no confusion as to the nature of the products you buy and administer. Much of the time, very brief descriptions are not enough. So in adddition to the descriptions on the kitchen list, you can create a second set of detailed descriptions for use in the Supermarket (i.e. buying) Mode of the app.

When in Kitchen Mode, after you have created the simple descriptions in the Pharmacy category (the 24th and last), the products look something like this:

Give a DOUBLE-CLICK on the Pharmacy button. This is what you will see:

In fact, you have created a 25th category: "Pharmacy Long Names".

But because no long names were found, your short names have been displayed instead.

You now need to elaborate your short names as required, like this:

Later, when you are in "Supermarket Mode", preparing your products for actual shopping, your Pharmacy Short Names will not be shown at all. They will be replaced by the long names (if they exist).

USING BROWSER MEMORY

When you have finished, and you click on the "Stop Editing" button, you will be asked whether you want to save your work. On the first occasion using the editor, you probably will. HOWEVER, it will only be saved temporarily while the page you are using remains open. To save it permanently, you need to do another save of the entire kitchen list. Then, on future occasions when you upload your kitchen file, the 25th category (Pharmacy Long Names) will be included in it. And to prove this on future occasions when only the Pharmacy Short Names are showing, just give a double-click on the Pharmacy button again, and it will show you your long names. And if you do not want to make any further alterations, choose CANCEL when you exit via the Stop Editing button. But if you do include further alterations, remember to save them temporarily upon exit, and save the entire kitchen list once again, just as before.

As things stand, when you navigate to the Shopping Suite app, it is empty. You need to upload a Kitchen File in order to begin work. If you use the same file on following occasions, this can become a tiny bit tedious. Not terrible, but you can eliminate this constant upload. With your file on display, just click on the Save button for Browser Memory:

So from now on, you can work with TWO Kitchen Files, one for normal usage, and the other for exceptional use.

If you no longer need this arrangement, and you wish to return to an empty display on startup and uploading your choice of file for the day, just click on the Browser Memory CLEAR button. The next time you start the Shopping Suite (or even just refresh your browser), nothing will be displayed:

Finally, in relation to the browser Memory (or "localStorage" as it is known tecnically), rest assured that the information STAYS ON YOUR LOCAL MACHINE. Nothing is transmitted anywhere else. I say this because other apps also use the browser'a memory, and with more sensitive information you might be worried about it.

SUPERMARKET MODE FOR SHOPPING

When you have marked the products required on your kitchen list, and are ready to go shopping, you need to decide on the quantities you require, add complementary information if necessary, and prepare your list (text) for transfer to your smartphone, or to simply print on paper.

With the appropriate list already being displayed in Kitchen Mode, click on the big SUPERMARKET button, top-right:

That's about all regarding Kitchen Mode usage, I think. We now move on to subsequent usage in SUPERMARKET MODE for shopping.

You then get a message telling you that from now on, the current kitchen file will be shown on startup.

To test it, you can navigate to another website, close your browser, turn your computer off, and whatever. When you come back to the Shopping Suite, your kitchen file, which the browser has "remembered", will appear automatically, and you don't need to upload it.

Assuming that you normally use this particular list, what happens if you want to use a DIFFERENT one on some occasion? Just upload it and do what you have to do, replacing the "standard" list you have on display. If you want this new list to become the "standard" one, just save it to Browser Memory again. Otherwise, leave the old one there. On the next occasion when you start up the Shopping Suite, or just REFRESH your browser, the original list will be displayed automatically again. You did not remove it from memory.

Your products now all have the quantity ZERO in front of them. With your marked kitchen list by your side, you can now go through the categories and decide the quantities you need. Just change the leading zero of any particular line into something else (numbers or letters) and this will be carried forward onto the supermarket shopping list. Product descriptions can also be extended with more specific information if required. You can even include comments if you wish. It doesn't matter. Only lines beginning with "0" will be ignored.

When you have finished, click on the COMPILE button:

You are now shown a preview of your final supermarket list.

After reviewing it, if you are not satisfied, close the window using the red cross icon in the top right-hand corner of the editor, and you will be able to return and make the required adjustments. Then click on COMPILE again.

Note that a SAVE button has appeared. When you are happy with your output list, use this to save the text file on your computer.

Once saved, if you go to the location where you saved the shopping list on your computer and double-click on it, it will be displayed in your default text editor:

If you wish, you can now print your Notepad shopping list on paper.

Also, you can transfer it to your smartphone. There are various methods of doing this, and you probably know better than I do which way is best for you personally. The way I do it is shown at the very beginning of this HELP: select the entire text in Notepad, copy it, and paste it into the desktop version of WhatsApp. By this method, it's already there on the smartphone.

SUMMARY OF BUTTON FUNCTIONS

Here's a summary of the different buttons used in the Shopping Suite.

Please note that although they are shown here all together, in fact, not all buttons are shown simultaneously.

KITCHEN MODE

BUTTON

SUPERMARKET

MODE BUTTON

Kitchen file upload button

Kitchen list print button

Category selector buttons

Kitchen file download button

Shopping list compiler

button

Shopping list download

button

Products alphabetic sort button

Sets

persistent

kitchen file storage

Removes persistent kitchen file storage

Permits Pharmacy long-names editing when double-clicked

Note: Using your browser in FULL SCREEN mode (using the F11 key) provides access to all category buttons without scrolling.

N.B. When you print for the first time, a message like this might appear in your browser. Just click on the PREFERENCES button, and PERMIT POPUPS for the site. Thereafter, you will not be bothered again.

For each of the two printing windows that are open, before you actually print, open up the browser's menu in the top right-hand corner. There, you will see a "Save page as..." option. Choosing this option will allow you to save this particular page of the kitchen list on your computer. You can save the page anywhere, but I prefer to save mine to the Desktop:

As you can see, the saved page consists of a file and a folder. They are given a name of your choice.

Don't forget to save the second kitchen page as well, in a similar fashion.

As shown above, the Shopping Suite prints a kitchen list of 2 pages by opening two extra windows or tabs. No doubt you will print more than one copy on paper for use on various occasions. The number of copies depends on how often you do your shopping, whether or not you intend to make changes to the products on the list within a certain period, and so on. As things stand, when you need more copies, you return to the Shopping Suite on the Internet in order to do your printing. No big deal, but you can do your printing a little more conveniently, expecially if you do not intend to adjust your products list within the very near future.