Separation of Concerns: View Model & Database Model

I noticed how when I used scaffolding to generate my MVC5 controller with views using Entity Framework this would only allow me to specify a model representing a table in my database, which is not what I want.  In order to have true separation of concerns I wanted to:

  • Use view models for my views that get validated prior to any database updates
  • Use database models, auto generated, to represent my database and contain the results of queries

I accomplished this by implementing various services which handle the communication with the database.  The controller contains an instance of the service it requires to communicate with the database.  The service queries the database and returns the results to the controller, which then sends the information to the view utilizing the appropriate format.

When querying (performing  select) the database:

  • Resulting database model(s) are converted to the corresponding view model(s), and
  • Returned to the controller, where
  • They are passed through to the view for display

When updating an entry:

  • View Model is passed from the view to the controller
  • Validated using an appropriate validator, I built with Fluent Validation
  • If invalid, error message is returned to the view and displayed
  • If valid, view model is passed to the service to update the corresponding tables in the database
  • In either case if errors occur then the model state is updated and the default view for the action is returned

An example of this is how I manage reading lists.  I have my reading list controller (ReadingListController class) which handles user interactions and manipulates the model.  You can see below that the controller class contains minimal logic and utilizes helper classes to perform the logic. A validator class is used for validating data being passed from the view, when creating/editing a reading list, using Fluent Validation.  This ensures valid data is being entered into the database rather than relying on exceptions being returned on insert/updating of the database due to ill formatted values.

To provide separation of concerns services are used to interact with the database model.  Utilizing a service also means that the controller does not need to know the implementation of the service and how to interact with the database so by extending the particular service interface you can change the implementation, i.e. if I decided to not utilize the Entity Framework anymore and instead use NHibernate.

In the case of reading lists two services are used, the reading list service and the author service. The author service is utilized here so that we do not duplicate code for retrieving authors who have books and specific books for that author based on selection.  I am still working on the view implementation of this.  The reading list service contains the implementation for retrieving:

  • List of reading lists for a particular user (List title, number of novels in the list)
  • A specific reading list (for editing/deleting)
  • Book information for a book in a particular reading list
  • Details for a reading list (Book titles, year, whether they are read, and date finished)

Also an implementation for editing, creating, and deleting a reading list.

[Authorize]
public class ReadingListController : Controller
{
	private readonly IReadingListService _service;
	private readonly IAuthorService _aService;
 
	public ReadingListController() : this(new ReadingListService()) { }
 
	public ReadingListController(IReadingListService service)
	{
		_service = service;
	}
 
	// GET: ReadingList
	public ActionResult Index()
	{
		int userId = GetUserId();
 
		var readingLists = _service.GetReadingListsForUser(userId);
 
		if(readingLists == null)
		{
			ModelState.AddModelError("", "An error occurred in retrieving your reading lists.");
			return View();
		}
 
		return View(readingLists);
	}
 
	// GET: ReadingList/Details/5
	public ActionResult Details(int? id)
	{
		if (id == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var readingListDetails = _service.GetReadingListDetails(id ?? 0);
 
		if (readingListDetails == null)
		{
			return HttpNotFound();
		}
 
		return View(readingListDetails);
	}
 
	// GET: ReadingList/Create
	public ActionResult Create()
	{
		return View();
	}
 
	// POST: ReadingList/Create
	// To protect from overposting attacks, please enable the specific properties you want to bind to, for 
	// more details see http://go.microsoft.com/fwlink/?LinkId=317598.
	[HttpPost]
	[ValidateAntiForgeryToken]
	public ActionResult Create([Bind(Include = "ListTitle")] ReadingListModel readingListModel)
	{
		readingListModel.UserId = GetUserId();
		var rlValidator = new ReadingListValidator();
		var results = rlValidator.Validate(readingListModel);
 
		if (results.IsValid)
		{
			var success = _service.CreateReadingList(readingListModel);
 
			if (!success)
				return RedirectToAction("Failed", new FailedModel { Message = "Unable to create reading list, please try again.", Action = "Index" });
 
			return RedirectToAction("Index");
		}
 
		return View(readingListModel);
	}
 
	public ActionResult Failed(FailedModel fm)
	{
		return View(fm);
	}
 
	// GET: ReadingList/Edit/5
	public ActionResult Edit(int? id)
	{
		if (id == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var readingList = _service.GetReadingList((int)id);
 
		if(readingList != null)
			readingList.UserId = GetUserId();
 
		//ViewBag.UserID = new SelectList(db.Users, "UserID", "Username", readingList.UserID);
		return View(readingList);
	}
 
	// POST: ReadingList/Edit/5
	// To protect from overposting attacks, please enable the specific properties you want to bind to, for 
	// more details see http://go.microsoft.com/fwlink/?LinkId=317598.
	[HttpPost]
	[ValidateAntiForgeryToken]
	public ActionResult Edit([Bind(Include = "ReadingListID,ListTitle,UserID")] ReadingListModel readingListModel)
	{
		var rlValidator = new ReadingListValidator();
		var results = rlValidator.Validate(readingListModel);
 
		if (results.IsValid)
		{
			var success = _service.EditReadingList(readingListModel);
 
			if (!success)
				return RedirectToAction("Failed", new FailedModel { Message = "Unable to edit reading list, please try again.", Action = "Index" });
 
			return RedirectToAction("Index");
		}
 
		return View(readingListModel);
	}
 
	// GET: ReadingList/Delete/5
	public ActionResult Delete(int? id)
	{
		if (id == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var rlm = _service.GetReadingList((int)id);
 
		if (rlm == null)
		{
			return HttpNotFound();
		}
 
		return View(rlm);
	}
 
	// POST: ReadingList/Delete/5
	[HttpPost, ActionName("Delete")]
	[ValidateAntiForgeryToken]
	public ActionResult DeleteConfirmed(int id)
	{
		_service.DeleteReadingList(id);
		return RedirectToAction("Index");
	}
 
	//Get: ReadingList/DeleteBook/5/4
	public ActionResult DeleteBook(int? readingListId, int? bookId, string bookTitle)
	{
		if (readingListId == null || bookId == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var bm = _service.GetReadingListBookInfo((int)bookId, (int)readingListId);
 
		if (bm == null)
		{
			return HttpNotFound();
		}
 
		return View(bm);
	}
 
	// POST: ReadingList/DeleteBook/5
	[HttpPost, ActionName("DeleteBook")]
	[ValidateAntiForgeryToken]
	public ActionResult DeleteBookConfirmed(int readingListId, int bookId)
	{
		_service.DeleteBookFromList(bookId, readingListId);
		return RedirectToAction("Details", new { id = readingListId });
	}
 
	// Get: ReadingLis/AddBook/5
	public ActionResult AddBook(int? readingListId, string rlTitle)
	{
		if(readingListId == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var rlam = new ReadingListAuthorsModel
		{
			Authors = _aService.GetAuthorsWithBooks().ToList(),
			ListTitle = rlTitle,
			ReadingListId = (int)readingListId
		};
 
		return View(rlam);
	}
 
	public ActionResult Books(int authorId)
	{
		var books = _aService.GetBooksForAuthor(authorId);
 
		return Json(books, JsonRequestBehavior.AllowGet);
	}
 
	//Get: ReadingList/MoveBook/5/4
	public ActionResult MoveBook(int? readingListId, int? bookId, string bookTitle)
	{
		if (readingListId == null || bookId == null)
		{
			return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
		}
 
		var bm = _service.GetReadingListBookInfo((int)bookId, (int)readingListId);
		var usersReadingLists = _service.GetReadingListsForUser(GetUserId()).Where(x => x.ReadingListId != readingListId);  //Can't move book to itself
 
		if (bm == null || usersReadingLists == null)
		{
			return HttpNotFound();
		}
 
		bm.ReadingLists.ToList().AddRange(usersReadingLists);
 
		return View(bm);
	}
 
	private int GetUserId()
	{
		int userId;
		userId = int.TryParse(User.Identity.Name.Split(':')[0], out userId) ? userId : 0;
		return userId;
	}
}

Validation for creating a new reading list is shown below.  I chose this example since it is a very simplistic validator, to implement.  The only criteria is that the list title has to be 1-255 characters long and the returned result for the number of novels in a list should be greater than or equal to zero, the highlighted rows.

using FluentValidation;
using tracker.Models.View.ReadingList;
 
namespace tracker.Validators.Novels
{
    public class ReadingListValidator : AbstractValidator<ReadingListModel>
    {
        public ReadingListValidator()
        {
            RuleFor(a => a.ListTitle).Length(1, 255).WithMessage("List name needs to be between 1 and 255 characters.");            RuleFor(a => a.NumberOfNovels).GreaterThanOrEqualTo(0).WithMessage("Number of novels was less than 0, please contact admin.");        }
    }
}

In order to utilize my view model instead of the database model for each view I changed the @model parameter to be my view model instead of the database model.   This ensures that the model is populated within the database session prior to being passed back to the view.  An example is the details view for a reading list:

@model tracker.Models.View.ReadingList.ReadingListDetailsModel

Upgrade to WordPress 4.0 Failed through GoDaddy

WordPress & Godaddy

I got myself into an interesting predicament today.  I was in going to show my mom how to update the church website and saw that there was an update to WordPress 4.0 showing in the GoDaddy console.  I decided to do the update and then that is when things went sideways.

Upon the update finishing I went to the website site only to see a 500 Internal server error message, shown below:

I knew this was not a good sign, and preceded to investigate and my first thought after some Googling was to manually upload WordPress 4.0 files (all of them except the wp-content folder & wp-config file), so I downloaded the zip and preceded to do so.  Once this didn’t fix my issue and the site is for someone else I wanted to rectify the problem as quickly as I could so I contacted GoDaddy support.  Thanks to the patience of Spencer D. and his technical contact we were able to get to the bottom of things.

The first step was to create a web.config file (back up any current one, or in my case where you deleted it, create a new one) that contains the following:

<?xml version="1.0"
encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <httpErrors errorMode="Detailed"
existingResponse="PassThrough"
/>
    </system.webServer>
</configuration>

In my case I am using the IIS 8 Plesk version; however, you should be able to find the correct version for you in this GoDaddy’s Help article if you are using GoDaddy Windows hosting.

You upload this to the root folder for your particular domain and in my specific case this led to me receiving the following when I navigated to the website, stlukesdryden.com, after waiting for a bit:

All-in-One Event Calendar: require(G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\vendor\lessphp\lessc.inc.php): failed to open stream: No such file or directory @ G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\lib\bootstrap\loader.php:88 #2
All-in-One Event Calendar: require(G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\vendor\lessphp\lessc.inc.php): failed to open stream: No such file or directory @ G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\lib\bootstrap\loader.php:88 #2
PHP Fatal error: require(): Failed opening required ‘G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\vendor\lessphp\lessc.inc.php’ (include_path=’.;.\includes;.\pear’) in G:\PleskVhosts\dwcryan.com\stlukesdryden.com\wp-content\plugins\all-in-one-event-calendar\lib\bootstrap\loader.php on line 88

I now knew that an error in the All-in-One Event Calendar was causing my site to not be displayed.  In order to disable the failing plugin you can apparently either rename the plugin folder located in ../wp-content/plugins or (the way I did it) you can access your database through PhpMyAdmin and search the wp_options table for active_plugins.  I then saw this for the active_plugins option:

32       active_plugins       a:4:{i:0;s:55:”all-in-one-event-calendar/all-in-on…       yes

Editing this row, and focusing on the options_value column you want to delete the plugin information for the message you saw when navigating to your site earlier in this post, which in my case is All-in-One Event Calendar, in bold below:

a:4:{i:0;s:55:”all-in-one-event-calendar/all-in-one-event-calendar.php”;i:1;s:36:”contact-form-7/wp-contact-form-7.php”;i:2;s:24:”wordpress-seo/wp-seo.php”;i:3;s:31:”wp-google-maps/wpGoogleMaps.php”;}

It is important to delete the entire contents from the i to the ; (semicolon) for the plugin in question.  Once I had done this I was able to access my website homepage, though not the login screen (which I rectified by copying over the wp-login.php file, it wasn’t allowing me to copy earlier, because as I later realized I had the page, giving me the error, open in my browser), but no other pages on the site.  I was able to solve the broken links/pages in the same fashion as when I broke them with my publish, you can find it at the bottom of this post.

Worth noting is that Spencer mentioned my WordPress installation was indeed at version 4.0, which jives with what the GoDaddy console under ‘Manage My Web Applications’ states and when I access the WordPress Dashboard for my site it states I am running WordPress 4.0 too, so I’m hoping all is good now.  Well, that is except the Event Page is blank as I have to get the event calendar plugin working, which involves getting the latest version installed.

This process took longer than expected and I felt it was worth blogging about.  Will make sure I have a fair bit of free time on my hands before attempting to upgrade WordPress on this domain.

MySql.Data Reference

I previously wrote a post about configuring MySQL for use with a Microsoft MVC application.  I noticed after publishing that my application could not connect to the database and returned the following exception:

System.ArgumentException: The ADO.NET provider with invariant name ‘MySql.Data.MySqlClient’ is either not registered in the machine or application config file, or could not be loaded. See the inner exception for details. —> System.ArgumentException: Unable to find the requested .Net Framework Data Provider. It may not be installed.

In order to solve this I had to do two things:

  1. In the Solution Explore under ‘References’ set Copy Local to true for the MySql.data reference
  2. Add the database provider configuration to your Web.config as seen below, with your particular version
<system.data>
  <DbProviderFactories>
    <add name="MySQL Data Provider" 
         invariant="MySql.Data.MySqlClient" 
         description=".Net Framework Data Provider for MySQL"  
         type="MySql.Data.MySqlClient.MySqlClientFactory, MySql.Data, Version=6.4.4.0, Culture=neutral, PublicKeyToken=c5687fc88969c44d" />
  </DbProviderFactories>
</system.data>

The reason for #2 is that I am trying to run my code on a machine where the provider is not installed, so I have to specify the provider in my configuration file and then installation adds it to the machine.config registering the provider on the remote server.

Configure MySQL with ADO.NET EF in VS 2013

MySQL, ADO.NET & MVC

Even though we are using a Microsoft framework (MVC) and ADO.NET Entity Framework (EF) we may not want to connect to a Microsoft Database.  In my case I am going to connect to a MySQL database which means I have to configure MySQL for use in my project.

I had to download the latest version of MySQL for Visual Studio installer and once downloaded run the installer and follow the on-screen prompts to install.  I went with the Typical install option.

I then downloaded the latest MySQL connector and ran the installer also using the Typical install option.

Once this is done you can open your project in Visual Studio and right click on the solution in the solution explorer to Manage NuGet Packages… as in Figure 1 below.

Figure 1: Manage NuGet Packages
Figure 1: Manage NuGet Packages

You then go to the Online section and search for MySQL.  You then want to install the MySQL.Data.Entities package, highlighted in Figure 2 below, by clicking install which will then install the NuGet package and it’s dependencies (Figure 3) and once it’s done a green check mark will show that the package installed correctly (Figure 4).

Figure 2: Search MySQL and Select
Figure 2: Search MySQL and Select
Figure 3: Installing MySQL and Dependencies
Figure 3: Installing MySQL and Dependencies
Figure 4: Shows Installed - Close NuGet
Figure 4: Shows Installed – Close NuGet

After you have MySQL configured you need to add the MySQL provider to your Web.config by replacing the Entity Framework tag with the following:

<entityFramework>
     <defaultConnectionFactory type="MySql.Data.Entity.MySqlConnectionFactory, MySql.Data.Entity.EF6"/>
     <providers>
        <provider invariantName="MySql.Data.MySqlClient" type="MySql.Data.MySqlClient.MySqlProviderServices, MySql.Data.Entity.EF6"/>
     </providers>
</entityFramework>

Then you save the Web.config file and add an ADO.NET Entity Model by adding a new item (Figure 5) to your solution.  The new item is an ADO.NET Entity Model which provides the connection to your database (Figure 6) by selecting Visual C# from the left menu followed by ADO.NET Entity Data Model, giving it a name (in my case TrackerDB) and clicking Add.

Figure 5: Add New Item to Solution
Figure 5: Add New Item to Solution
Figure 6: Select Visual C# ADO.NET Entity Data Model
Figure 6: Select Visual C# ADO.NET Entity Data Model

In the window that appears select the option EF Designer from Database and click Next (Figure 7).  In the window that appears, Figure 8, click the New Connection button to create a connection to your database and select MySQL Database from the list of options, Figure 9.  Make sure to deselect the option to always use this selection and click Continue.

 

Figure 7: Select EF Designer From Database
Figure 7: Select EF Designer From Database
Figure 8: New Connection
Figure 8: New Connection
Figure 9: Select MySQL Database & Uncheck Always use this selection
Figure 9: Select MySQL Database & deselect ‘Always use this selection’

The Connections Properties menu will open where you will need to provide the details for the database server your application is going to connect to, as in Figure 10.  In my case I entered the server name as an ip address since no DNS friendly name exists along with the username and password required to connect to the database server.  You can click the Test Connection button to ensure your information is correct; however, in my case I also noticed that you can attempt to select the database you want to.  If your credentials are incorrect an error message will appear, otherwise a list of databases the username/password combination has access to will appear.    If the connection succeeds click OK, returning you to the previous screen.

Figure 10: Enter MySQL Database Information
Figure 10: Enter MySQL Database Information

As an aside I find it best to create a username/password combination that is unique to each database, rather than one to rule them all, so that if the credentials get compromised only access to a particular database will be granted.  If you have finer grained control over database usernames it is best to only grant a user the rights to do the minimal tasks required.

After clicking OK I received an error message (Figure 11) about the XML declaration.  I clicked OK which brings you back to a screen like Figure 8 above, however, information will be populated under the connection string.  I determined this was caused by me having extra lines, which I had commented out as part of my experimentation, at the top of my Web.Config file.  After deleting these lines making the <?xml …> tag the first line in the file I was able to proceed (canceled, deleted the connection and started from the beginning) without error which brought me back to the screen as seen in Figure 12.  I stuck with the default name provided for the connection string in my Web.Config file and choose yes for storing my password since the account only has the writes required.  I may decide to change this later and how you wish to handle this is up to you.  You then want to click the Next button.

Figure 11: XML Error Message - Click OK
Figure 11: XML Error Message – Click OK
Figure 12: Yes/No to Password and Connection Setting
Figure 12: Yes/No to Password and Connection Setting

Update (Aug 22, 2014): You may want to provide a better name for your connection settings in your Web.Config file as that acts as your context.  That is if your database is called tracker then db_nameEntities could be TrackerContext.

On the next screen you will see “Retrieving database information, please wait..” followed by the various elements you can select to be included in your model.  In my case I selected only Tables as I currently have no Views or Stored Procedures and Functions for my database, as seen in Figure 13.  I left the default to pluralize or singularize generated object names as well as to include foreign keys since I want my model to include the foreign keys.  Click Finish to complete the Entity Data Model Wizard.

Update (Aug 22, 2014): You may want to provide a more friendly model name for your database model, again if database is called Tracker you could use TrackerModel.

Figure 13: Select Database Object and Finish
Figure 13: Select Database Object and Finish

You will receive the message “Running this text template can potentially harm your computer. Do not run if you obtained it from untrusted source.. ”, as a reminder that you are about to execute someone else’s code which you should only do if you trust the source of that code.  I am confident in this case that I can run this template so I click OK, which I had to do a couple of times.  If you want you can disable these warnings by going to Tools Options… Text Templating and setting the Show Security Message to False.

Figure 14: Click OK to Run Text Template
Figure 14: Click OK to Run Text Template

Under Data Connections in the Solution Explorer I able to see the database I added.  At first it showed as having a red ‘X’ next to the database icon, but once I expanded the connection to see the contents, Figure 15, the icon refreshed and the database contents were displayed which signifies that I now have a data connection established to my database for use with my application.

Figure 15: View Database Contents to Confirm
Figure 15: View Database Contents to Confirm

Finally now that everything is configured you are able to see an ERD diagram of you database open up as well as the database schema in the Solution Explorer that you can navigate, shown in Figure 16.

Figure 16: Tracker DB in Solution Explorer and Diagram
Figure 16: Tracker DB in Solution Explorer and Diagram

The connection string added to my Web.Config file under the <connectionStrings> tag looks similar to below, but with the actual values for server, user id, and database.  The reason for the connection string (with the space) and the &quot sections is because it is escaping the connection string generated for the database I am connecting to and putting it into the web configuration file under the connectionString attribute.  I will have to see if this works as generated by the wizard or if I will have to modify its results.

<add name="tracker_appEntities" connectionString="metadata=res://*/TrackerDB.csdl|res://*/TrackerDB.ssdl|res://*/TrackerDB.msl;provider=MySql.Data.MySqlClient;provider connection string=&quot;server=192.168.2.1;user id=user_name;password=db_password;persistsecurityinfo=True;database=db_name&quot;" providerName="System.Data.EntityClient" />

Note:  You may not run into this, however, there were times throughout when Visual Studio would go into a non-responsive state (sometimes flashing in and out of them) throughout the process.  I found that I just had to be patient and give the application time to complete the necessary tasks.

Publish Web Project to GoDaddy

The web hosting provider I am using is GoDaddy and I chose Windows hosting since some of my ideas include developing web applications using Microsoft technologies.  The following explains how I set up my first web project I am in the process of developing, which was my tracker application.

The first step is to get the web deploy publishing settings for the location you wish to host your web project. In my case I want to host it on a subdomain (which I have already created), but the steps are the same if it is your root domain. You navigate to the subdomain section of where you would like to host your app in GoDaddy’s ‘Websites & Domains’ section.  You then click the ‘Web Deploy Publishing Settings’ link to start the download of your settings file (seen in Figure 1 below).

Step 1 - Download Web DeployPublishing Settings
Figure 1: Download Web Deploy Publishing Settings

The downloaded file will contain a .publishsettings extension with the contents of the file similar to:

<?xml version="1.0"?>
<publishData><publishProfile profileName="tracker.dwcryan.com - Web Deploy" publishMethod="MSDeploy" publishUrl="tracker.dwcryan.com" msdeploySite="tracker.dwcryan.com" userName="dwcryan" destinationAppUrl="http://tracker.dwcryan.com" controlPanelLink="https://p3nwvpweb100.shr.prod.phx3.secureserver.net:8443"/></publishData>

Once you have the settings file you can configure your actual project. With your web project opened in Visual Studio you right click on the project in the Solution Explorer and select Publish.. (or something similar depending on project type) as in Figure 2.

Step 2 Right Click Project In Solution Explorer and select Publish
Figure 2: Right Click Project In Solution Explorer and select Publish

This will present you with the window in Figure 3, where you will select the Import option by left clicking.  In the displayed dialog ‘Import Publish Settings’, also displayed in Figure 3, you will browse to your publish settings file, select it, and then click Open; thus, displaying the path to your file in the ‘Import Publish Settings’ dialog as in Figure 4, and then click OK.

Step 3 - Click Import
Figure 3 – Click Import
Step 4 - Browse For Publishing File
Figure 4: Browse For Publishing File

Once the settings have loaded enter the password for your account and click Test Connection.  If everything is OK you will see a check mark next to the test connection button as in Figure 5.

Step 5 - Enter Password and Validate Connection
Figure 5: Enter Password and Validate Connection

Clicking Next will then take you to the ‘Settings’ tab.  I did not change anything here as I did not see the need for any file publishing options and I do not want the publish to modify my database.  I may need to update my publish settings and insert a connection string for my database once I have that configured within my application and will update this post with any such changes.  Clicking Next again brings me to the ‘Preview’ tab as in Figure 6.

Step 6 - Preview and Publish
Figure 6: Preview and Publish

Clicking ‘Start Preview’  in the middle of the screenshot above (Figure 6) will provide a list of the files being uploaded and the action being performed (i.e. update for files being modified and add for new files being pushed to the destination) as in Figure 7.

Step 7 - Clicking Preview
Figure 7: Clicking Preview

Lastly you click Publish to finish off the process which will publish your application to its destination.  The output of the file will look similar to that of Figure 8 (I cropped out the middle section as to highlight the start and end sections as well as displaying some of the adds and updates.  The web application (at the URL provided) will then open up in your default web browser.

Step 8 - Output
Figure 8: Output

If their are issues with the settings in your application when running on the remote server an error page will be displayed with some information as to what you have to do.  At this point it becomes a matter of experimenting.  In my case I got a security exception stating “The application attempted to perform an operation not allowed by the security policy. To grant this application the required permission please contact your system administrator or change the application’s trust level in the configuration file”.

I was able to solve this by adding the following line to my web.config file between the system.web tags and publishing again:

<trust level="Full" />

Through further investigative work I determined a second option is changing the configuration on your hosting provider, if they allow it. In my case that involved selecting the option ASP.NET Settings in the same view as Figure 1 above, which in my case was at the bottom of the 3rd column (from the left).  Once in there you set the CAS trust level to Full, Figure 8 below, and while here make sure that the Default webpage language is correct for your application.

CAS trust level
Figure 8: CAS trust level

That appears to be it for now and will have to see what happens once my web application contains a database and actions are being taken if any further modifications to the publishing settings need to be added or modified.

Subdomain within Main Domain Folder

Well, today I was doing some experimenting and investigating how I could get my Tracker application published to a subdomain through automation instead of manually copying the files every time.  It’s only an MVC template right now but I wanted to be able to test that the default functionality was going to work with my web hosting, prior to proceeding.  Things were going pretty good until I realized that publishing my application broke my WordPress site.  By broke what I mean is that critical files and settings got overwritten causing my site navigation menu to get messed up as well as links to pages not working (404 errors) and only my home page could be displayed.

I hypothesized the cause of the overwrite to be due to the subdomain folder being contained within the root folder for my website instead of up one level so I deleted the subdomain and the folder it was using.  I then recreated it so its root folder is at the same level as my main sites root folder.  Apparently trying to organize your subdomains within your root domain folder is not a good idea.

I was then able to follow the steps again to publish a web application, which I outline here.

I took the opportunity of my site already being broken to install the latest WordPress update.

Since my incorrect publish broke my custom links I determined how to fix this was from my WordPress dashboard you go to Settings -> Permalinks and switch the option to Default and save your changes.  Then you switch it back to your custom selection and save the changes again.  Prior to discovering this not even deleting the pages permanently and recreating them removed the 404 error for me.

Tracker Database Design

Tracker Database v.1

What is an application without some sort of storage mechanism behind the scenes?  Above represents my database design which I am going to go into more details about.

At the heart of the database is the User table which stores user information and associates a reading list, measurement, or golf round with a corresponding user such that users can only see their data when logged in.  This also makes it easy to track additional information by adding the corresponding tables which will then get associated with a user if I choose to expand the application at a later time.  The other tables which stores, what I will call public data, is visible to all users to avoid duplication of data.  This includes golf course information (Golf Course, Address, Region and Course Par Information tables) and book information (Author, Book, and what authors are associated with which book). The measurement and course par info tables each have a ‘special’ column.  The measurement table contains a column called Type which takes a number from 1-4.  Since this never changes the application can handle the numbers, rather than creating an additional static look-up table in the database.  The number representation is as follows:

  1. Weight
  2. Neck
  3. Waist
  4. Hips

The course par information table contains a column called IsCNine to accommodate courses that have more than 18 holes with a format of: (Course Color)*( )(Front|Back).  Where there can be 0 or more colors   Examples of this would be:

  • White Front
  • Blue Front
  • Blue Back
  • Front
  • Back

This format allow for courses which provide 27 holes of golf as they typically have a white, blue, and red course, each with 9 wholes.  I’d imagine both would also have a front and back nine.  I have never played at a 27 whole golf course but I try to develop for future (or potential) possibilities.

I’ll explain the user profile dynamic content and dashboards text boxes in the diagram in my next post about the dynamic content and dashboards I plan to provide in my application.

Slider Customization

Slider Flex Caption CSS

Since not all my posts will contain a feature image I had to find a work around that would allow the text content to show properly in the slider.  In order to do this I added a very tiny white square as my featured image.  When it first displayed the caption for the post was at the bottom and ran out of the visual area (couldn’t even see ‘Read More’ button).  In order to accommodate this I modified the CSS for the slider so that the caption starts at 20% from the top instead of its default of 40%; in hopes this will also work for future blog posts without a featured image.

I had to change a block of CSS which starts at line 235 in theme.css from:

.flex-caption{
	width: 800px;
	position: absolute;
	top:40%;
	left: 50%;
	margin-left: -400px;
	text-align: center;
	z-index: 120;
	color: #fff;	
}

To the following:

.flex-caption{
	width: 800px;
	position: absolute;
	top:20%;
	left: 50%;
	margin-left: -400px;
	text-align: center;
	z-index: 120;
	color: #fff;
}

It is worth noting that a caveat I have discovered is that this is insufficient for smaller screen sizes so I may have to become more ‘clever’ in my featured images; like I did for this post, when I can.

Why Develop a Tracker Web Application?

Ahh, it is so nice to have completed my Masters and be able to focus on some personal projects I have been pondering.  The first was this website and the second is a tracker application.  I have been using an Excel spreadsheet I store on Google Drive for tracking various things, which does work pretty well for just maintaining one long list of, for instance, the novels I have read and the novels I’d like to read.  When it comes to tracking items with more complex items like rounds of golf played and at which course they were played dealing with the relationships becomes a little more cumbersome though I could also implement this in a spreadsheet; however, I thought this would be a great opportunity to learn more about web applications.

The technologies I will be using to develop my web app are C#.NET, Entity Framework, and MVC for the main framework of the application.  I will also be utilizing CSS to style my application forms and views when necessary.  I am going to attempt utilizing a MySQL back-end, since my web host provides more storage for MySQL databases, which requires additional configuration from utilizing MS SQL when using Microsoft technologies.

Security is an important aspect of any application making it necessary to implement a login system for my web app.  The login form will be the first page a user sees when accessing the site.  The web app will test, when access to other pages are attempted, if a valid user is logged in prior to granting access to any other page and redirect to the login page for unauthorized users.

Once the basic create, read, update, and delete (CRUD) functionality is implemented I am going to generate various dashboards for the users to provide statistics and further information at a glance based on database records relevant to the user.  This will include elements like what was the last novel you read (and completion date) and the number of novels you read over a specified time frame.  Related to golfing this would include calculating your overall golf handicap, average score for 9 and 18 whole games, and a further drill down to information per course will also be available.  I’m thinking at least 5 rounds will have to be played for a handicap to be calculated for a given category and averages will always show as only courses you have played will be presented as options.  I may also show the number of different courses you have played and a map of where they are located.  Additional technologies I plan to use in accomplishing these tasks are Google Charts (Google Visualization API) and Google Maps API.