Introduction

This web page, which is not on the site menu system, is intended to provide notes on how the site is constructed and intended to work. It is, therefore, both an aide memoir and a means of a guiding a new webmaster. The page should be updated as necessary!!! A basic knowledge of ASP, CSS, HTML, Javascript and PHP is useful but the various scripts are commented as appropriate to aid understanding.

Acronyms explained

HTML stands for "Hypertext Markup Language" and is the standard language of the web. You can survive without using the others but this one is mandatory. The files are simple text ones and are downloaded and interpreted by the web browser into the page you see. Pages using just HTML are normally named with a HTM or HTML filename extension.

CSS stands for "Cascading Style Sheet" and is an easy way to implement the visual appearance of web pages so as to ensure consistency of style and appearance across every page of a web site. CSS files names normally end with .css.

ASP stands for "Active Server Page" and is bespoke to Microsoft and servers running Windows Server. The language form is similar to Beginners' All Systems Instruction Code (BASIC). ASP scripts are normally run at the server before the HTML etc is downloaded to the browser. It is, therefore, useful for items where information needs to be kept secure and away from prying eyes. ASP page names must end with .asp or the server will ignore the need to run the scripts and simply deliver the whole lot, secure information and all to the browser!

While we are on the subject of acronyms, PHP stands for "PHP: Hypertext Preprocessor", the acronym also forming part of the name. PHP scripts also run at the server and are similarly useful where security is important. PHP can be used on Unix and Linux servers as well as Windows. Using PHP will allow the web site to be server technology independant.

Javascript is not an acronym. It is a scripting language designed to be downloaded with the HTML and then interpreted and executed by the browser. Do not confuse it with the Java programming language - that is something completely different.


Web Site Hosting Arrangements

The present site was initially hosted by PMH Internet Services, PMH being the initials of Peter Hawkes the proprietor. When he decided to retire to the golf course he sold the business to Sincordia Ltd of Leamington Spa and the site continues with them. Sincordia still use the PMH trading name and, indeed, the trading names of other companies they have bought, as well as trading under their own name. This link will take you to the PMH web site.

Web Site Product

The site is designed to run on a 'windows platform' and thus needs to reside on a server running Windows. The contract with PMH (Sincordia) is for their 'windows+' product which gives genuinely unlimited bandwidth and storage space. It is unlikely that any similar deal can be obtained elsewhere at a similarly low price. The windows+ product includes support for both ASP and PHP languages and scripts in these languages are normally executed by the server software before the page is downloaded to the client's web browser. Javascript scripts are downloaded to the web browser and interpreted and executed there.

If the site is moved to a unix or linux platform it will need a number of changes. Pages that rely on ASP will need to be rewritten to use PHP as the ASP language only works on a windows server. Windows is also tolerant of 'case' in variables and file names, unix and linux are not. If the site is transferred it will need a thorough test to pick up all the items windows tolerated and which will now throw up errors.

Programming Resources

Two invaluable links for information when developing web pages are W3 Schools and Dynamic Drive.

W3 schools is a learning centre for all the languages of the web and the W3 people are the custodians of some of the languages.

Dynamic Drive is a group of programmers who create and make available useful items of code. Whilst Dynamic Drive makes no charge for the use of their code, they do insist on a notice being included in the code which can be viewed by anyone electing to view the source code. The notices are included as comments so do not appear on the visible page. Many webmaster use their items to save the effort of reinventing the wheel. This web site uses a number of code items from this source.


Web Page Layout

Pages generally have filenames ending in .html or .php, the latter allowing text common to multiple pages (and not essential for local file testing) to be loaded in by server side processing. Pages running ASP code are named with the ending .asp or .shtml to ensure the relevant code is executed before the file is sent from the server to the browser.

Type Declaration

All displayable pages must start with the type declaration:

<!DOCTYPE HTML>

This tells the browser that the page is coded to HTML 5 standards and that features in HTML 5 but not in earlier versions may be encountered.

It therefore follows that users will need to view the site in an up to date version of their browser or some items will not display correctly. Users of older versions of browsers should be told to update theirs as such updates also plug vulnerabilities to malware etc.

The entire page is then wrapped in a <html></html> tag pair.

Assumptions

The web site relies on users having javascript enabled and will not function correctly, and possibly not at all, without it. A warning message is issued if the user has javascript turned off (or is using a non-compliant browser).

The site is designed first and foremost for use on a dessktop PC. The site will run on tablets and smart phones that have touch screens but there are vagaries and differences between these devices in handling menus. Accordingly the menu sub-menu system is turned off on touch screen devices and users should navigate using the buttons on the main pages and/or the site map page instead.

Links between different parts of the site use 'relative addressing' so that off-line testing can continue even if the internet connection is not functioning. Full URLs are used for the link to the Forum and where external web sites are involved.

Header Section

The section is contained between the <head></head> tag pair. In here are the various preliminaries necessary for the browser to correctly display the page. The order of some items in this section is important, particularly where one javascript file relies on functions contained in another javascript file being available.

Meta Declarations

These provide specific information to browsers and search engine spiders. For the most part they are the same on each page.

The robots and revisit-after declarations are the ones used by the spiders. Changing follow to 'nofollow' tells the spiders not to follow links on the page; and changing index to 'noindex' not to index the page and thus reduce the likelihood of the page appearing in a list in response to web searches. In order to keep the web site as visible as possible, only turn off where really necessary!

Page Title

Each page should have a unique title. As most browsers now use tabs, the title appears in the tab alongside the site icon and is usually offered as a title for the page when the user bookmarks it.

Link rel

This is the link to the [srs.ico] file located in the site's root directory which which is the icon that appears in the tab header and in the favourites / bookmarks list.

Link href

This is the link to the [srs.css] file located in the site's root directory which controls the look of the page. More than one css file can be used but most settings have been concentrated into a single file for ease of maintenance.

The gazetteer pages use [gazetteer.css] instead.

Javascript Entries

A series of javascripts are need to operate and display each page.

The first of these [jqery.js], located in the scripts directory, is called first using a <script></script> call. Jquery is a library of routines and must be loaded before any other scripts as some of them depend on jquery functions. Verson 1.9.1 of jquery is in use - if updating jquery with a new version ensure it overwrites the present one as this will avoid the need to change any other code used on the web site.

In order to comply with Dynamic Drive's licence conditions, a file crediting them is loaded between enabling jquery and loading the rest of the header scripts and functions. The content is only visible when a user selectes 'view source'.

The rest of the header scripts required are loaded next. These are treated as a standard set whether actually used on the page or not and are contained in [headroot.js] and [headsub.js] which are located in the includes directory. Both files must be maintained and the only difference is the addition of '../' in front of file names in [headsub.js] which runs on pages located in sub-directories.

The order in which the scripts are listed within [headroot.js] and [headsub.js] can be critical where one script relies on calls to another.

Javascript files or scripts bespoke to a single page need loading only on the relevant page concerned.

Body Section

The section is contained between the <body></body> tag pair and comprises the bulk of the page content. The body section is separated into various divisions (div) and the look and feel is determined by the entries in [srs.css] mentioned above.

The various master divisions (div) can be included on the page in any order, the positioning instructions in the css file providing the instructions so that the page layout comes out as intended. The master divs are of fixed width to give a fixed width to the page. The relevant declarations are in [srs.css]. If changing one be aware that this will impact on other divs which will need adjusting to suit.

The background colour for the page is set to #EEFFFF as a declaration in [srs.css] for the body div. The left hand stripe is a repeating colour block, 150px wide x 10px high, contained in pagebackground.jpg which resides in the images directory and also declared in the body div. Pagebackground.jpg is set to #87CEFA and the image repeats in the Y axis (downward) thus over-riding the background colour on the left hand side.

Note - CSS does not work with BMP, GIF or PNG images so the colour block file must be in JPG format.

A <noscript></noscript> tag pair is placed at the start of the body section, before any divs are declared, to trap any instances of the site being viewed in a browser with either javascript turned off, or an old browser that doesn't support javascript.

Footer Division

This sits as the last item within the Main division so that it appears at the bottom of every page, within the width of the main division. It contains the copyright notice for the site and needs changing annually to reflect the current year. On the OS map page it is at the end of the mappage "div".

Navigation Division (Master)

The navigation "div" is positioned on the left side of the page and fixed in that position so it doesn't scroll out of site on longer pages. In this way it is always visible and usable. It should not be repositioned without first testing the change against other fixed position divs that use the left hand side of the page. The background colour is set by the background image and not within the css for the div.

Two versions of the navigation menu exist, both located in the includes directory. They are in the form of javascript instructions so as to allow local (off-line) testing of the pages. [menuroot.js] is used on pages that are located in the root (top level) directory of the web site and [menusub.js] is used on pages in the sub-directories one level below. Both files must be updated whenever a change is made to the navigation menu structure so that the presented menus are consistent. The only difference between the two files is the addition of '../' in front of the anchor links to pages within the web site in [menusub.js]. The quick way to maintain the files is to update [menusub.js], copy it to [menuroot.js] and then just strip out ',,/' by using find and replace.

Proper operation of the navigation menus relies on the availability of DDsmoothmenu from Dynamic Drive. The version in use is 2.2 and the link should be checked periodically in case any updates are available (Dynamic Drive don't always update the description page promptly - download a copy of the js file and check in the version detail lines at the start of the file. The location and name of the arrow files has been altered for this site - ensure this change is carried forward into any update or the arrows will 'disappear'.

The arrow graphics are located in the images directory. Any sub-directory that is used for pages containing the navigation menu must include the arrow graphics in a sub-sub-directory called images below the sub-directory. There is an unresolved problem of reliability in displaying the arrows.

The navigation div is also used to display the Society badge graphic and the link to bookmark the web site.

The "div" exists on the OS map page but is used for the various ancilliary facilities and guide notes.

Page Update Division (Master)

The page update "div" is located at the top left of the page and fixed in that position as a reminder of the date on which the individual page was last altered. It is used for this purpose on almost every page of the web site, the exceptions being the OS map page and the HTML section of the drawing office.

Remember to change this date whenever the content of the page is altered.

The "div" exists on the OS map page but is used for the page name.

The "div" does not exist on the Drawing Office pages located within the HTML directory.

Site Update Division (Master)

The site update "div" is located immediately below the page update division and fixed in that position as a reminder of the date on which the site was last updated.

Remember to change this date whenever updates are loaded to the web site.

On the OSmap page the space is encroached upon by the Page Update Division so cannot be used on this page.

The "div" does not exist on the Drawing Office pages located within the HTML directory.


Migration from Dreamweaver Library Function

Editing the web pages is currently done using Dreamweaver and, more importantly, Dreamweaver's library function which allows code common across many pages to be updated easily.

It is desired to move away from this using such methods as will allow local testing without using inetpub.

Dreamweaver Library File Problem

There is a major problem with the way Dreamweaver handles library files where these contain entries such as an anchor link containing this code snippet: "href="about.html". This form of setting a page link is acceptable to browsers and pretty well everyone else. Except the programmers of Dreamweaver! W3, who are the guardians of HTML accept it so it has to be valid HTML. Dreamweaver's programmers claim it is not properly formatted and should be "href="/about.html". This form is ignored by browsers and does not produce the move to the page as expected.

Dreamweaver, on encountering "href="about.html" immediately adds a path to the call "href="library/about.html" and this doesn't work either as the target file isn't in the library sub directory! Dreamweaver does accept "href="../about.html" and "href="#about" as correct - which they are. This stupid and superior attitude of the Dreamweaver staff means that you cannot use "href="about.html" in a library file which greatly reduces the usefulness of the library function unless an alternative method such as placing the link inside an input statement is resorted to or using absolute links or putting all the site's files in sub-directories. Absolute links are of no use for offline testing as the link will go to the live site instead of the test site!!

Migrating Away From Dreamweaver

A one-off exercise is needed that will implement the following changes. All the changes should be implemented on each page at one session although not all pages need to change at once.


Downloads of Archive Files

At the 2012 AGM members commented on the amount for material being given away free. The members took the view that downloading of archive material should be for members only unless the material had been donated with a specific caveat requiring the material to be downloadable to non-members and members alike. This view was supported by the 2013 AGM.

It is the policy of the Archivist that, where homogenous groups of material are available, this should be made available on CD/DVD rather than being downloadable as individual files.

Where material is on free download and a better copy is obtained later, the free copy is not replaced but the better copy will either be downloadable to members' only or included on the Research Note. Where better copies are required the left hand column of the entry in the list of digital material will be marked with a light grey background.


OS Map Page

This page is laid out differently to the other pages under the control of the webmaster. Specifically the main div is replaced by the mappage div and, whilst the left hand band remains, the space is used differntly. In the srs.css page the declaration of the mappage div must appear after the declarations of header styles otherwise style h1 doesn't work as intended. The reason is not understood but probably has something to do with the fixed size differences between main and mappage divs coupled with the order in which the entries are read by the browser.

Map Licence

The OS is obliged by the Westminster Follies to make the map information available to anyone who wants it. Free access licence is limited to non commercial users who are obliged to make access to the basic map page facilities open to all comers, fully usable and not hidden behind password or other closed access. Only certain OS maps are covered by the free licence and all of those allowed are accessible on our web site.

The OS licence key is bespoke to the SRS domain and is checked by the OS to ensure it is only used on our domain. However, since the page was first initiated this restriction may have been lifted as testing has become possible using the off-line copy of the site. Additionally, the code that displayed the number of tiles used as an indicator of whether we were near the daily limit no longer produces a result. It would seem that the OS has relaxed its limits etc!

There is a daily tile download limit for each user - the SRS is the 'user' for this purpose, not the end user at home. This has increased since the page was created and now seems to be 100,000. This has not been a problem for us. Once the limit is reached the access to the OS will stop working until the count is reset next day.

Map Operation

The page relies on a number of external systems to operate - and a working broadband connection.

Map Page Header

In here are the calls to the OS Open Space tile server - including the licence key and other scripts necessary for the page to function. There are also a number of css declarations bespoke to this page, partly because they didn't all work when called from the main css file.

Map Page Body

The bulk of this consists of javascript functions and code designed to operate the page. Some of the scripts have come free from the OS Open Space web site where code examples are posted for use, and some have been modified or written by me. The code has been commented so that it can be followed easily.

Note in particular the series of scales in the declaration of resolutions. They should be kept in sequence as shown as they then are accessible in logical sequence for the scale selector on the page.

The centreInfoWindow parameter has two settings - "true" or "false" and relates to whether or not the map page will automatically recentre to a map marker when that is selected. "True" means it will, as does omitting the parameter altogether. "False" means the map stays put.

The javascript code is used to place scale markings, also the grid reference of the current cursor position (in two formats) and similarly the longitude and latitude co-ordinates.

Map Page Default

Summoning up the page without passing any parameters causes the page to display with the map centred on the location of the SRS Archive at Kithead.

Map Page Parameters

The page can also be called in such a way that parameters can be passed and acted upon. There are two formats of parameters that can be accepted.

Map Parameters (1)

The first form uses a call to the map page in this format:

<a href="researchosmap.html?myEasting=012345&myNorthing=012345&myScale=12"></a>

This will display the map centred on a specific place, the specific place being determined by the six digit easting and northing values. The scale can be set as appropriate, 12 being the largest one. It is best not to go lower than a scale of 9 for the initial display! Opening in the present screen or a new tab is optional - most calls are set to open in a new page using the target="_blank" additional parameter.

The value for myScale must be between 1 (or 01) and 12 and no more than 2 characters length. This is not trapped in the javascript - it is the webmaster's responsibility to get it right.

Map Parameters (2)

The second form uses a call to the map page in this format:

<a href="researchosmap.html?myEasting=012345&myNorthing=012345&myFile=FileName.FileExtension"> </a>

This also displays the map centred on a specific place, the specific place being determined by the six digit easting and northing values. The scale is, however, hard coded to a value of 10 in researchosmap.html and can be changed in there if as appropriate. Again most calls are set to open in a new page. The myFile parameter is explained in the marker section below.

The value for myFile must be more than 3 characters length. This value is trapped in the javascript as the means of determining which parameter form has been passed in.

Map Markers

These fall into two groups - fixed ones that are placed every time the map page is loaded, and those selected ones that are imported from an additional file using a call to the jquery javascript library. In OS terms these are all classified as 'fixed' and the construct of each marker is identical.

The graphics used for the markers are kept in the MapIcons directory. Those used on the maps should be in Portable Network Graphics (PNG) format so as to provide fast download and quick handling by the browser. The (free) Sib Icon Editor is a useful way of creating these.

Fixed Markers

This group has been included in researchosmap.html as a standard, 'always include' set of markers. They are divided into two sub-sets, the first being the locations of SRS Committee meetings plus the marker for Kithead. The second set is the markers for key places of research and locations of official SRS visits. These two sets should be treated as 'permanent' so as to avoid having to look them up whenever they are wanted.

The markers are referenced by calls from the Calendar and Links pages and any other page as appropriate.

Selected Markers

These have been made 'variable' because of the sheer quantity that will exist, far in excess of the capacity of browsers to cope with in a single go.

They are arranged in 'geographic' sets and links are provided within each set to the adjoining set(s) thus allowing a user to easily follow a line of route across the country. These markers consist of four types - those that mark a spot or give information (markers), those that draw a line of railway (lines), those that mark an area (polygons), and those that link to external web sites (links).

The geographic set files rely on a common series of variables (to ensure consistency) that are contained in common.js which resides with the geographic files in the MapLines directory. The common.js file must be loaded first, immediately followed by the geographic set file using successive calls to jquery or the dependencies between the files will fail.

The file name for the geographic file consists of a two alpha, three numeric form derived from a convenient RailRef line code relevant to the set plus a file name extension of .js. An example is MG001.js. When declaring the file name as a parameter in the call to the researchosmap.html page the entry for myFile must be the just relevant RailRef line code used for the file - eg MG001. The '.js' will be added by the javascript as the presence of a dot in the parameter string will confuse the browsers.

Common.js contains all the necessary variable declarations for the graphics to be shown for the different marker types and the size they should be shown by the browser. It also contains the colour declarations for the lines using the two letter company code from the RailRef syatem.

In the geographic sets my practice is to draw railway lines that were open in 1921 (or opended later) as a solid line and lines closed by that year as dashed lines. Dotted lines are used for projected lines that were never built or were built but never opened. This convention can be varied and/or dash/dot combinations used as circumstances warrant.

There is a key to the markers on the research page and a link to it on the map page.

The various geographic set files are located in the directory MapLines.

Marker Content

The amount of information shown in the 'bubble' that opens when a marker is clicked will vary dependent on the information available to me when creating the marker. It typically includes the year of opening and closure (if it has closed) and any name changes. For signal boxes the Signal Box Register number is also given if this is known. Beware - stations and signal boxes moved and were replaced, there may be more than one marker with the same Register number!

Calls to External Sites

For the convenience of users and researchers, links have been posted at some locations to external mapping web sites.

Landmark (Old-Maps)

The "old-maps" web site is run by Landmark who are the official suppliers of old ordnance survey maps. The OS gave them part of their stock of old OS maps to enable them to provide the service when the OS gave doing this themselves. The maps are thus authorative but the on-line viwing facility is of deliberately degraded quality. Landmark's site is geared to selling copies of the maps at a price considerably higher than the Alan Godfrey reprints.

Calls to this site use the 12 digit gride reference which allows their map to be initially centred at a specific point. The format is:

www.old-maps.co.uk/maps.html?txtXCoord=561758&txtYCoord=318067

where the XCoord is the six figure easting and YCoord is the six figure northing.

National Library of Scotland

The OS also gave maps to the National Library of Scotland as their official old maps representatives in Scotland. The NLS have made the maps available on-line without any degradation and have gone further in that it is possible to overlay and swap between different georeferenced maps and Google Earth. Whilst the best coverage is of Scotland, the 1:25,000 series is available for the whole of England and Wales as well. The NLS are still increasing the range and coverage. As there is no commercial pressure screen prints can be made for personal use.

Calls to the NLS site require a zoom factor to be set and the longitude and latitude in decimal degrees together with a layers instruction:

maps.nls.uk/geo/explore/#zoom=14&lat=56.69989&lon=-2.88125 or
maps.nls.uk/geo/explore/#zoom=15&lat=56.69989&lon=-2.88125&layers=

A zoom level of 15 is useful for our purposes. The layers field is lengthy and determines what combination of overlaid maps will load as a result of the call. Possible combinations include:

A list of these is in the spreadsheet Openlayers_Mosaic sent by NLS. The Google Earth view provided does not include any of the Google Earth marker layers.

Where's The Path?

Calls are also provided to "Where's The Path" which provides a 'side by side' comparison between different maps. Coverage is not complete and the cursor registration between the two panes is sometimes a little out. Calls to the site require longitude and latitude, a zoom factor and a layers component. The major drawback of this site is the tendancy for it to be unable to show the current OS maps later in the day as the large number of users usually outstrips the daily data allowance granted by the OS.

Call format is:

wtp2.appspot.com/wheresthepath.htm?lat=52.793492&lon=1.047086&gz=14&oz=8>=6

Google Earth

Providing a call to a file with a filename extension of KMZ or KML will automatically summon Google Earth - provided the user has Google Earth installed. If they haven't they'll get an unkown file type error message from their computer.

The KMZ files are stored in line sub-directories under MapKMZ and file names are the SIgnal Box Register number for a signal box at the location.

Geographic Set Boundaries

Some overlap is provided at the boundary of adjacent sets. The page numbers refer to the Pre-Grouping Atlas published by Ian Allan in 1963.

Set GW080 (page 10)

Great Western Railway
Culham to Tackley
Thame Branch

Set GW710 (pages 9- 10)

Great Western Railway
OWW Wolvercot - Brettell Lane
Fairford Branch
WAH Worcester - Shelwick Junction
Leominster Branch
Over - Ledbury
Stoke Works Branch
SVR Hartlebury - Bridgenorth
SVR Kidderminster Loop
Abbotswood - Norton
Stourbridge Town Branch

Midland Railway
Malvern Branch

Set MG001 (pages 17-18)

Great Eastern Railway, north Norfolk.
Midland and Great Northern Railway.

Set SH001 (pages 9, 14-15)

Shrewbury & Hereford
English Bridge - Hereford

Gazetteers

OS 1:50,000 Gazetteer

As the name implies, this is the standard one supplied by the OS themselves and supposedly includes all the place names to be found on the 1:50,000 series of maps that replaced the previous 1" ones. I say supposedly because there seem to be omissions! Lookup calls go to the OS Open Space server master copy which avoids our having to maintain it in any way.

Limitations are the lack of specific entries for railway locations and the fact that their list is keyed on the first word of place names only. A search for a name will often result in a multiple choice list being presented from which the user can select. This does present occasional problems - a search for Hull won't get you the Hull you probably expect! You need the official name of the town - Kingston (upon Hull).

Area of coverage is England, Scotland, Wales, Isle of Man, Isle of Wight and the Scottish off-shore islands.

Post Codes

The OS also provide a look-up of UK post codes for the same geographic coverage. If a valid code is entered the map will centre to it and a place a marker on the map. If the code is invalid or is one applicable to Northern Ireland the map will not move and no marker will be displayed.

Co-ordinates

The map can be centred to a twelve figure grid code. There is a trap to keep the entry within the bounds of the OS system.

SRS Gazetteer

This is being built gradually as markers are added to the geographic marker sets.

Places represented are mainly stations, signal boxes and level crossings. Some other items are added where appropriate and the lists show current and past railway places. Where a location has had multiple names it is listed under all the known ones. From the lists the map can be centred on the location and the detail of the relevant RailRef line code looked up. County names are those applicable in 1921 to match the date basis of the RailRef system.

Future Developments

Items proposed to explore if time permits.

Web Site Operation

Progress bar for downloads.

Convert Photo catalogue to digital database.

Mapping Options

Traditional country boundaries / present day boundaries.

Postcode boundaries.

Changing marker colours - example River Habitat.

Reload map with selected markers only - example Mansfield Council and select findit maps.