Factory Pattern

Defines an interface for creating an object, but lets the classes that implement the interface decide which class to instantiate

public interface FactoryInterFace
{
   string ImgURL { get; }
}

public class Boat : FactoryInterFace
{
   public string ImgURL
   {
      get { return "/Images/Boat.JPG"; }
   }
}

public class Car : FactoryInterFace
{
   public string ImgURL
   {
      get { return "/Images/Car.JPG"; }
   }
}

public class Motorcycle : FactoryInterFace
{
   public string ImgURL
   {
      get { return "/Images/Motorcycle.JPG"; }
   }
}

public class Truck : FactoryInterFace
{
   public string ImgURL
   {
      get { return "/Images/Truck.JPG"; }
   }
}
//end of Factory Interface		
public static class VehicleFactory
{
   public static FactoryInterFace Build(string vehicleType)
   {
     switch (vehicleType)
     {
       case "Boat":
         return new Boat();
       case "Car":
         return new Car();
       case "Motorcycle":
         return new Motorcycle();
       case "Truck":  
         return new Truck();
       default:
         return new Car();
     }
   }
}
//end of Vehicle class
//Controller methods
public ActionResult FactoryPattern()
{
   return View();
}

public string GetVehicle(string inVehicle)
{
   return (VehicleFactory.Build(inVehicle).ImgURL);
}
//end of Controller methods
//FactoryPattern.cshtml
@{
  ViewBag.Title = "Factory Pattern";
  Layout = "~/Views/Shared/_Layout.cshtml";
}

<script src="~/Scripts/jquery-2.1.4.min.js"></script>
@Styles.Render("~/Content/bootstrap.css")
<style type="text/css">
  .border2pxSolidBlack {
    border: 2px solid black;
  }

  .fontLargeBold {
    font-size: large;
    font-wight: bold;
  }
  
</style>

<div class="row col-sm-12">
  <center>
    <h1>Factory Pattern</h1>
    <p>
      Defines an interface for creating an object, but lets the classes that implement the interface decide which class to instantiate
    </p>
  </center>
</div>

<div class="row col-sm-12 form-check-inline fontLargeBold" id="dvRadioButtons">
  <center>
    <label class="radio-inline"><input type="radio" name="optradio" value="Boat">Boat</label>
    <label class="radio-inline"><input type="radio" name="optradio" value="Car" checked>Car</label>
    <label class="radio-inline"><input type="radio" name="optradio" value="Motorcycle">Motorcycle</label>
    <label class="radio-inline"><input type="radio" name="optradio" value="Truck">Truck</label>
  </center>
</div>

<div class="row col-sm-12 rowHeight20px"></div>

<div class="row">
  <div class="col-sm-4"></div>
    <div class="col-sm-4">
    <center>
      <div class="row" id="dvImage">
        <img src="/Images/Car.JPG" class="img-responsive border2pxSolidBlack" />
      </div>
    </center>
  </div>
  <div class="col-sm-4"></div>
</div>

<script type="text/javascript">
  $(".radio-inline").click(function () {
    //get value of checked radio button
    var vType = $("input[name='optradio']:checked").val();

    //retrieve Factory Pattern
    var goToFactoryPattern = '@Url.Action("GetVehicle", "DesignPatterns")';
    $.ajax(
    {
       url: goToFactoryPattern,
       contentype: 'application/json; charset=utf-8',
       type: 'GET',
       data:
       {
         inVehicle: vType
       },
       success: function (data) {
         var dv = document.getElementById('dvImage');

         // remove all child nodes from div
         while (dv.hasChildNodes()) {
           dv.removeChild(dv.lastChild);
         }

         //create image
        var img = document.createElement("IMG");

        //set image source to Factory value
        img.src = data;
        img.classList.add("img-responsive");
        img.classList.add("border2pxSolidBlack");
        
        //append image to div
        dv.appendChild(img);
       }, //end of success
       error: function (jqXHR, textStatus, errorThrown) {
         alert('Factory Pattern error jqXHR ' + jqXHR);
       }
     });
  });

</script>