Compound CAS

13 August 2006

Compound CAS
   
Compound CAS


Click here to download


Compound CAS (Content Administration System) was written to facilitate administration of content for database driven websites. It was written in ASP.NET 2.0. Compound CAS takes the form of a single control, and is packaged in a dll. Compound CAS allows editing of database data in a way suitable for that data, uploading of files and image thumbnail generation. The overall objective is to allow centralised administration of database content.

Pre-Requisites:

  • ASP.NET 2.0. Won’t run with .NET 1.1.
  • SQL Server 2005 or MySQL (no other DB providers have been written at the moment).
  • The control has been tested on both IIS5 and IIS6.



Setup

Installing Control and adding to a website
  • First set up the database tables to be access. Note that all tables must have a field named “id” as a primary key. This must auto-increment.

  • Copy the dll to your file system and reference it in your asp.net 2.0 website (or just copy it straight to the bin folder of your website). You will probably want to set up some sort of authentication mechanism to that directory / the page containing the CompoundCAS control. Security will be handled by the location that you deploy the control, so you need to set this up if required.

  • If you wish for your content to have associated files uploaded and administered through the CAS, add a folder to upload to. Make sure that this has read and write permissions.

  • Set up the XML config file, or hack the example config file in the appendix. Setting this up is explained in detail in a later section.

  • Add the control to an asp.net page. Note that I haven’t yet tried to do this through the toolbox, I followed this procedure:
    • Register the CompoundCAS control on the page i.e.
      <%@ Register Namespace=”CompoundCAS” TagPrefix=”cas” Assembly=”CompoundCAS” %>

    • Add the CompoundCAS to the actual page – i.e. add the following between the form tags (note that you will probably need to alter the path to the xml config file – can be either a filesystem or a http path). Note that if it is to reside in the website, make sure it can be accessed anonymously – although this may cause problems as people may be able to browse to it. I would recommend that its not stored in a web directory.
      <cas:CASControl runat="server" id="CAS" PathToXmlConfigFile="http://localhost/CompoundTestSite/CompoundCasConfig.xml" />

    • Note that validateRequest will need to be set to false in the page directive if html etc is to be placed inside the textarea. This is to prevent script injection etc, but as users using this system will be trusted (via auth) it is safe to set this to off.
      <%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeFile="Default.aspx.cs" Inherits="_Default" %>

    • Note that if the CAS is to be used for uploading and administering files, you will need to add enctype="multipart/form-data" to the form.




Setting up the Database and Config File

Database Setup

It is absolutely essential that tables interfaced by CompoundCAS have a primary key field named "id" which auto increments. I decided to make this the case to facilitate ease of cross lookups between tables, and to allow a record to be easily identified.

At present, CompoundCAS is compatible with two type of database – MySQL and SQLServer2005. Which database provider to use must be specified in the compoundCasConfig/settings/databaseType element in the config file and must be either MySql or SqlServer2005 (case sensitive). E.g.

<databaseType>SqlServer2005</databaseType>

Note that to use the MySQL database you will need to install the MySQL .NET connector on the machine running CompoundCAS. Note that you need to copy MySql.Data.dll to the bin directory – e.g. from C:\Program Files\MySQL\MySQL Connector Net 1.0.7\bin\.NET 2.0\MySql.Data.dll or equivalent. This can be downloaded from http://dev.mysql.com/downloads/connector/net/1.0.html.

The connection string must be specified in the compoundCasConfig/settings/databaseType element of the config file. MySql and SqlServer2005 examples are shown respectively:

<databaseConnectionString>server=localhost; user id=root; password=xxxxxxx; database=rnowik; pooling=false;</databaseConnectionString>

<databaseConnectionString>Integrated Security=SSPI;Persist Security Info=False;Initial Catalog=compoundcastest;Data Source=AZTECSQLExpress</databaseConnectionString>


General format of the xml config file

Below is an example showing the general format of the xml config file. The main points are that in consists of a settings node (containing number of items per page, and database related stuff) as well as a tables node describing how to interface and present data from the database.

<?xml version="1.0" encoding="utf-8" ?>
<compoundCasConfig>
  <settings>
      <databaseType>SqlServer2005</databaseType>
      <databaseConnectionString>Integrated Security=SSPI;Persist Security Info=False;Initial       <Catalog=compoundcastest;Data Source=AZTECSQLExpress</databaseConnectionString>
      <itemsPerPage>25</itemsPerPage>
  </settings>
  <tables>
       ...tables removed  -described later
  </tables>
</compoundCasConfig>

Specifying Tables and Fields to be interfaced

Tables must be interfaced with the tables node of the xml file. The table name must be specified (corresponding to the name in the database, and then the fields to be made available need to be described – so that they are displayed in a certain way). An example of setting up a table is shown below (note that this table node must fall within the tables node).

    <table>
      <name>blogcomments</name>
      <fields>
        <field>
          <name>name</name>
          <alias>Title</alias>
          <type>Text</type>
          <visibleInListMode>true</visibleInListMode>
        </field>
        <field>
          <name>newsId</name>
          <alias>News Article</alias>
          <type>LookupField</type>
          <visibleInListMode>true</visibleInListMode>
          <lookupTable>news</lookupTable>
          <lookupField>name</lookupField>
        </field>
      </fields>
    </table>

Below is a description of all the possible fields types and corresponding properties that should be specified in the xml file.


Text
The text field is used to display one line of text (via a standard html text input box). The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>Text</type> for a text field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>



TextArea
The textarea field type is used to display multiple lines of text (via a standard html textarea). The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>TextArea</type> for a textarea field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>
  • truncateListViewNumberOfCharacters (optional) specifies number of characters to show in list view (ie truncating the data for list view) e.g. <truncateListViewNumberOfCharacters>40</truncateListViewNumberOfCharacters>
  • numberOfCols (optional) specifies the width of the text area e.g. <numberOfCols>80</numberOfCols>
  • numberOfRows (optional) specifies the height of the text area e.g. <numberOfRows>15</numberOfRows>



Boolean
The Boolean field type is used for true / false type data. Data is interfaced via radio buttons. The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>Boolean</type> for a boolean field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>
  • Default (optional) whether the field is set as true / false by default. Valid values are 1, true, 0, false. E.g. <default>1</default>



DateTimeField
For a datetime field, the field must be of datetime type in the db. Data is interfaced via dropdowns for day and month, as well as a text input box for the year. Note that you cannot use DateTime field with MySQL. Believe this is an issue with the connector – an exception is thrown when the dataset is filled. Instead use a Unix timestamp (see field type below). The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>DateTimeField</type> for a datetime field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>



UnixTimeStamp
For a UnixTimeStamp field, the field must be of integer type in the db. Note that a unix timestamp can be used by both SQLServer2005 and MySql providers. Data is interfaced via dropdowns for day and month, as well as a text input box for the year. The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>UnixTimeStamp</type> for a UnixTimeStamp field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>



FileUpload
The FileUpload field type is used for uploading files to a directory. The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>FileUpload</type> for a FileUpload field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>
  • uploadPath (required) path to the folder where files will be uploaded. E.g. <uploadPath>dyn</uploadPath>

Upload files can be stored in a separate virtual directory, but the path to these must be specified relative eg ../../castest/dyn. Make sure the location of the upload folder allows anon access and has read and write permissions.



ImageWithThumbnail
The ImageWithThumbnail field type is used for uploading files to a directory. Note if you want an image without a thumbnail, you should use the file field type. The properties of this must be set as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>ImageWithThumbnail</type> for a ImageWithThumbnail field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>
  • uploadPath (required) path to the folder where files will be uploaded. E.g. <uploadPath>dyn</uploadPath>
  • ThumbWidth (optional) the width of the generated thumbnail e.g. <ThumbWidth>200</ThumbWidth>
  • ThumbHeight (optional) the height of the generated thumbnail e.g. <ThumbHeight>100</ThumbHeight>
  • ThumbFixedProportions (optional). This is only relevant if both thumb width and height are specified. If so it crops the image instead after performing some resizing so that the image does not become distorted (stretched / compress in width / height directions). Valid values are either true (to preserve proportions) or false <ThumbFixedProportions>true</ThumbFixedProportions>

Upload files can be stored in a separate virtual directory, but the path to these must be specified relative eg ../../castest/dyn. Make sure the location of the upload folder allows anon access and has read and write permissions.



LookupField
The LookupField field type is used to cross reference an item in another table. A drop down field is given showing values from a specific field in the lookup table (eg title). The id of this lookup item is stored in the database (one of the reasons why all tables must have an auto-increment primary key named id). Lookup fields must be integer (as they will hold the id of a corresponding record in the lookup table. They may work as a string (I haven’t tested). The properties for a LookupField are as follows:

  • Name (required) e.g. <name>nameOfFieldInDatabase</name>
  • Alias (required) e.g. <alias>Friendly Name for Field</alias>
  • Type (required) must always be <type>LookupField</type> for a LookupField field.
  • visibleInListMode (required) true of false – whether the field is shown when the table data is being listed. E.g. <visibleInListMode>true</visibleInListMode>
  • lookupTable (required). Table to lookup from e.g. <lookupTable>news</lookupTable>
  • lookupField (required). Field in lookup table to display, e.g. <lookupField>name</lookupField>



Notes
I have purposely chosen not to have a number type – it should be handled by a text field. An exception will be thrown if the database cannot convert input to a number.

Note that you do not need to interface the id field. Id is called implicitly, but can never be set by the end user directly.

You should ensure that fields are the correct size in the database.



Styling CompoundCAS

I have purposely not allowed for a stylesheet reference in the control – so styling can all be contained in one place (ie a stylesheet for the website). Instead there are certain elements that you should embed in your style sheet for the web page.

To add a stylesheet reference to your aspx page, simply add the following, replacing the path to the stylesheet as appropriate:

<link rel=”stylesheet” href=”StyleSheet.css” type=”text/css” media=”all” />


The classes that have actually been define are as follows:
  • compoundcas_availabletables
  • compoundcas_listview
  • compoundcas_pagination
  • compoundcas_editview


All of the elements that can be style, are as follows (using style class inheritance):
  • div.compoundcas_availabletables
  • div.compoundcas_availabletables a
  • div.compoundcas_availabletables a:hover
  • table.compoundcas_listview
  • table.compoundcas_listview th
  • table.compoundcas_listview th a
  • table.compoundcas_listview th a:hover
  • table.compoundcas_listview td
  • table.compoundcas_listview td a
  • table.compoundcas_listview td a:hover
  • table.compoundcas_listview td a.compoundcas_button
  • div.compoundcas_pagination
  • div.compoundcas_pagination a
  • div.compoundcas_pagination a:hover
  • table.compoundcas_editview
  • table.compoundcas_editview th
  • table.compoundcas_editview td
  • table.compoundcas_editview td input
  • table.compoundcas_editview td textarea
  • table.compoundcas_editview td select
  • table.compoundcas_editview td input.radio
  • table.compoundcas_editview td input.button


The appendix contains a full example of styling CompoundCAS. You can simply copy these into your stylesheet to get a nice blue style layout.



Known issues

  • Cannot use DateTime field with MySQL. Believe this is an issue with the mysql.dll
  • App_data did not seem to allow uploading of files??? Note that although you can upload files to this folder, you cannot seem to view them over http here. I do not know what in iis is blocking this yet.
  • With the SQLServer2005 provider, database fields of type “text” cannot be sorted upon. Clicking the sort column heading on these will throw an exception.




Terms and Conditions

Please note that this system is © to Robert Nowik 2006. Decompiling and copying of the source code is prohibited. This product must not be rebranded or sold. This product may not be advertised or distributed by third parties as anything other than software created by Robert Nowik.