Here is the gist of what I am trying to achieve:
- Capture a webcam image from the Edit view. (working)
- Assign the image a file name and path. (working)
- Save the image to the images folder. (working)
- Store the path to the image in the database. (Not working)
Here is my Capture controller:
public void Capture(String FileLocation)
{
//var FileLocation = Server.MapPath("~/Images/test.jpg");
var stream = Request.InputStream;
string dump;
using (var reader = new StreamReader(stream))
dump = reader.ReadToEnd();
if (System.IO.File.Exists(FileLocation))
{
System.IO.File.Delete(FileLocation);
System.IO.File.WriteAllBytes(FileLocation, String_To_Bytes2(dump));
}
else System.IO.File.WriteAllBytes(FileLocation, String_To_Bytes2(dump));
return;
}
And here is the Edit controller:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(TrappingEvent trappingevent)
{
if (ModelState.IsValid)
{
db.Entry(trappingevent).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.PersonId = new SelectList(db.People, "Id", "First_Name", trappingevent.PersonId);
return View(trappingevent);
}
From my limited understanding it would be nice to pass the file path as a variable from the Capture void to the controller for binding to the model.
Thanks for your help.
Its working! Well I did it in a roundabout way and still happy to hear suggestions.
Heres the gist:
when I click the capture button i run the function:
function CaptureAndAssignText() {
var Div = document.getElementById("ImagePath");//ImagePath is the field
// I want to bind to the model.
newText = "ID_" + @Model.Id + ".jpg";//Here I grab the Id of
//the current model to use as the file name
Div.value = newText;//Assign the file name to the input
//field ready for submission.
webcam.capture();//Run the capture function
}
Here is the Capture function(fairly standard - can someone tell me if I need document ready for this?)
$(document).ready(function () {
$("#Camera").webcam({
width: 320,
height: 240,
mode: "save",
swffile: "@Url.Content("~/Scripts/jscam.swf")",
onTick: function () { },
onSave: function () {
},
onCapture: function () {
webcam.save("@Url.Action("Capture", "TrapActivity", new { id = @Model.Id , pid = @Model.PersonId})");
},
debug: function () { },
onLoad: function () { }
});
});
Here is my controller, modified to accept the model ID as a string (have included the String to Bytes function for easy reference):
public ActionResult Capture(string ID)
{
var path = Server.MapPath("~/Images/ID_" + ID + ".jpg" );
//var path1 = "~/Images/test.jpg;";
var stream = Request.InputStream;
string dump;
using (var reader = new StreamReader(stream))
dump = reader.ReadToEnd();
if (System.IO.File.Exists(path))
{
System.IO.File.Delete(path);
System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));
}
else System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));
return View(ID);
}
private byte[] String_To_Bytes2(string strInput)
{
int numBytes = (strInput.Length) / 2;
byte[] bytes = new byte[numBytes];
for (int x = 0; x < numBytes; ++x)
{
bytes[x] = Convert.ToByte(strInput.Substring(x * 2, 2), 16);
}
return bytes;
}
Now once capture has been clicked. The form can be submitted just as if you were submitting a strongly typed form.
There is a potential issue with this method
- This way only allows one image to be stored.
- Im sort of storing the file path in a really strange way.
Im more than open to suggestions.