File: D:/HostingSpaces/RImmers2/portal.photomenu.nl/wwwroot/views/menus/edit.html
<style>
.inline-group {
display: flex;
align-items: center;
}
.inline-group label {
margin-right: 5px;
flex-basis: 120px;;
}
</style>
<link rel="stylesheet" type="text/css" media="screen" href="/dist/css/jquery.fancybox-1.3.4.css" />
<style type="text/css">
a.fancybox img {
border: none;
box-shadow: 0 1px 7px rgba(0,0,0,0.6);
-o-transform: scale(1,1);
-ms-transform: scale(1,1);
-moz-transform: scale(1,1);
-webkit-transform: scale(1,1);
transform: scale(1,1);
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
a.fancybox:hover img {
position: relative;
z-index: 999;
-o-transform: scale(1.03,1.03);
-ms-transform: scale(1.03,1.03);
-moz-transform: scale(1.03,1.03);
-webkit-transform: scale(1.03,1.03);
transform: scale(1.03,1.03);
}
</style>
<div class="row">
<div class="col-lg-12">
<h1 class="page-header"> @{if model.dishID == 'new'}New Dish@{else} Edit dish "@{model.dish.Title}"@{fi} @{if repository.type == 'admin'}<span style="color:black;font-size:12px">@{model.dishID}</span> @{fi}</h1>
@{if model.error === true}
<div class="alert alert-danger">
@{model.errorMessage}
</div>
@{fi}
<form method="post" enctype='multipart/form-data'>
<input type="hidden" name="id" value="@{model.dishID}">
<div class="form-group inline-group col-md-6">
<label>Category *</label>
@{if repository.type == 'admin'}
<select style="width:200" class="form-control" name='Category'>
@{else}
@{if model.dishID !== 'new'}
<input type="hidden" name="Category" value="@{model.dish.Category}">
@{fi}
<select style="width:200" class="form-control" @{if model.dishID !== 'new'} disabled @{fi} name='Category'>
@{fi}
@{if user.hasLunch} <option value="Lunch" @{if model.dish && model.dish.Category == 'Lunch'}selected="selected"@{fi}>Lunch</option> @{fi}
<option value="-" @{if model.dish && (model.dish.Category == null || model.dish.Category == '-')}selected="selected"@{fi}>---</option>
<option value="Starter" @{if model.dish && model.dish.Category == 'Starter'}selected="selected"@{fi}>Starter</option>
<option value="Side Dish" @{if model.dish && model.dish.Category == 'Side Dish'}selected="selected"@{fi}>Side Dish</option>
<option value="Main Dish" @{if model.dish && model.dish.Category == 'Main Dish'}selected="selected"@{fi}>Main Dish</option>
<option value="Dessert" @{if model.dish && model.dish.Category == 'Dessert'}selected="selected"@{fi}>Dessert</option>
<option value="Menu" @{if model.dish && model.dish.Category == 'Menu'}selected="selected"@{fi}>Menu</option>
<option value="Drinks" @{if model.dish && model.dish.Category == 'Drinks' }selected="selected" @{fi}>Drinks</option>
</select>
</div>
@{if repository.type == 'admin'}
<div class="form-group inline-group col-md-6">
<label>Sort nr</label>
<input type="text" maxlength=10 class="form-control" value="@{model.dish['Sort order']}" name="Sort order" />
</div>
@{else}
<div class="form-group inline-group col-md-6">
<input type="text" style="visibility:hidden;" class="form-control" name="dishGUID" value="@{model.dishID}">
</div>
@{fi}
<div class="form-group inline-group col-md-6">
<label>Title *</label>
<input type="text" maxlength=25 class="form-control" value="@{model.dish.Title}" name="Title" />
</div>
<div class="form-group inline-group col-md-6">
<label>Title English</label>
<input type="text" maxlength=25 class="form-control" value="@{model.dish['Title ENG']}" name="Title ENG" />
</div>
<div class="form-group inline-group col-md-6">
<label valign="top">Description</label>
<textarea class="form-control" maxlength=50 name="Description">@{model.dish.Description}</textarea>
</div>
<div class="form-group inline-group col-md-6">
<label>Description English</label>
<textarea class="form-control" maxlength=50 name="Description ENG">@{model.dish['Description ENG']}</textarea>
</div>
<div class="form-group inline-group col-md-6">
<label>Ingredients</label>
<textarea class="form-control" maxlength=100 name="Ingredients">@{model.dish.Ingredients}</textarea>
</div>
<div class="form-group inline-group col-md-6">
<label>Ingredients English</label>
<textarea class="form-control" maxlength=100 name="Ingredients ENG">@{model.dish['Ingredients ENG']}</textarea>
</div>
<div class="form-group inline-group col-md-6">
<label>Price *</label>
<input type="text" maxlength=20 class="form-control" value="@{model.dish['Price']}" name="Price" />
</div>
@{if user.hasDrinks}
<div class="form-group inline-group col-md-6">
<label>Drinks</label>
<input type="text" maxlength=50 class="form-control" value="@{model.dish['Wine suggestion']}" name="Wine suggestion" />
</div>
@{fi}
<div class="form-group inline-group col-md-6">
<label style="flex-basis: 112px;">Active</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Inactive == false || model.dishID == 'new'} checked @{fi} name="Inactive" />
<i><font color="blue"><i class="fa fa-info-circle" aria-hidden="true"></i> disabling this will not show the dish on the mobile app!</i></font>
</div>
<div class="form-group inline-group col-md-6">
<label style="flex-basis: 112px;">Vegeterian</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Vegetarian} checked @{fi} name="Vegetarian" />
</div>
@{if user.hasAllergens}
<hr/>
<div class="row col-md-12">
<label><font color="gray" size="3">Allergens</font></label>
</div>
<div class="form-group inline-group col-md-2">
<label>Gluten</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_gluten} checked @{fi} name="Allergen_gluten" />
</div>
<div class="form-group inline-group col-md-2">
<label title="Schaaldieren">Shellfish</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_shellfish} checked @{fi} name="Allergen_shellfish" />
</div>
<div class="form-group inline-group col-md-2">
<label>Eggs</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_eggs} checked @{fi} name="Allergen_eggs" />
</div>
<div class="form-group inline-group col-md-2">
<label>Fish</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_fish} checked @{fi} name="Allergen_fish" />
</div>
<div class="form-group inline-group col-md-2">
<label>Peanut</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_peanut} checked @{fi} name="Allergen_peanut" />
</div>
<div class="form-group inline-group col-md-2">
<label>Soya</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_soya} checked @{fi} name="Allergen_soya" />
</div>
<div class="form-group inline-group col-md-2">
<label>Milk</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_milk} checked @{fi} name="Allergen_milk" />
</div>
<div class="form-group inline-group col-md-2">
<label>Nuts</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_nuts} checked @{fi} name="Allergen_nuts" />
</div>
<div class="form-group inline-group col-md-2">
<label title="Selderij">Celery</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_celery} checked @{fi} name="Allergen_celery" />
</div>
<div class="form-group inline-group col-md-2">
<label>Mustard</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_mustard} checked @{fi} name="Allergen_mustard" />
</div>
<div class="form-group inline-group col-md-2">
<label>Sesame</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_sesame} checked @{fi} name="Allergen_sesame" />
</div>
<div class="form-group inline-group col-md-2">
<label title="Zwaveldioxide en sulfiet ">Sulfur dioxide</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_sulfur} checked @{fi} name="Allergen_sulfur" />
</div>
<div class="form-group inline-group col-md-2">
<label>Lupine</label>
<input style="align-self:flex-start;" type="checkbox" @{if model.dish.Allergen_lupine} checked @{fi} name="Allergen_lupine" />
</div>
<div class="form-group inline-group col-md-2">
<label title="Weekdieren">Molluscs</label>
<input style="align-self:flex-start;" title="Weekdieren" type="checkbox" @{if model.dish.Allergen_molluscs} checked @{fi} name="Allergen_molluscs" />
</div>
@{fi}
<hr style="color: #f8f8f8; height: 1px; background-color:#f8f8f8;" />
<div class="row col-md-12">
<label><font color="gray" size="3"></font></label>
</div>
<div class="form-group col-md-4">
<label>Image *</label>
<input type="file" accept=".jpg,.jpeg,.png,.gif,.JPG,.JPEG,.PNG,.GIF" name="Image" onchange=thumbUploadPreview()>
<div style="font-style: italic;font-weight: 600;">
<i><font color="blue"><i class="fa fa-info-circle" aria-hidden="true"></i> All images will be resized automatically on saving</i></font>
</div>
</div>
<div class="form-group col-md-4">
@{if model.dishID != 'new'}<img id="img-preview" class="fancybox" title="Click to view large image" src="@{model.dish.Image}" height="150px" />@{fi}
</div>
@{if repository.type == 'admin' || user.hasStatistics}
<div class="form-group col-md-4">
@{if model.dishID !== 'new' }
<table border="0" width="75%">
<tr>
<td width="250"><b>Mobile App Views</i></b></td>
</tr>
<tr>
<td>
<table>
<tr>
<td width="120"></td>
<td width="100"><i>Apple</i></td>
<td width="10"></td>
<td width="100"><i>Android</i></td>
</tr>
<tr>
<td width="120px"><i>Overview</i></td>
<td><input name="Number of times shown in overview iOS" type="text" style="width:100px;" @{if repository.type !='admin' } disabled @{fi} value="@{model.dish['Number of times shown in overview iOS']}"></td>
<td></td>
<td><input name="Number of times shown in overview android" type="text" style="width:100px;" @{if repository.type !='admin' } disabled @{fi} value="@{model.dish['Number of times shown in overview android']}"></td>
</tr>
<tr>
<td><i>Detail</i></td>
<td><input name="Number of times shown in detail iOS" type="text" style="width:100px;" @{if repository.type !='admin' } disabled @{fi} value="@{model.dish['Number of times shown in detail iOS']}"></td>
<td></td>
<td><input name="Number of times shown in detail android" type="text" style="width:100px;" @{if repository.type !='admin' } disabled @{fi} value="@{model.dish['Number of times shown in detail android']}"></td>
</tr>
</table>
</td>
</tr>
</table>
@{else}
<input name="Number of times shown in overview iOS" type="hidden" value="0">
<input name="Number of times shown in overview android" type="hidden" value="0">
<input name="Number of times shown in detail iOS" type="hidden" value="0">
<input name="Number of times shown in detail android" type="hidden" value="0">
@{fi}
</div>
@{fi}
<div class="form-group col-md-12">
<button name="SaveButton" onClick="this.form.submit(); this.disabled=true;" type="submit" style="width:80px" class="btn btn-primary"><i class="fa fa-floppy-o" aria-hidden="true"></i> Save</button>
@{if model.dishID !== 'new'}
<a class="btn btn-default" href="javascript:void(0)" style="width:80px" onclick="if (confirm('Are you sure you want to delete this dish?')) {document.location.href = '/menus/@{model.restaurantId}/@{model.menuId}/delete/@{model.dishID}'}"><i class="fa fa-trash" aria-hidden="true"></i> Delete</a>
@{fi}
@{if model.dish.Category === 'Lunch'}
<a href="/menus/@{model.restaurantId}/@{model.menuId}/lunch" style="width:80px" class="btn btn-default"><i class="fa fa-times" aria-hidden="true"></i> Cancel</a>
@{else}
<a href="/menus/@{model.restaurantId}/@{model.menuId}?catId=@{model.dish.Category}" style="width:80px" class="btn btn-default"><i class="fa fa-times" aria-hidden="true"></i> Cancel</a>
@{fi}
</div>
</form>
</div>
</div>
<script type="text/javascript">
function thumbUploadPreview() {
var preview = document.querySelector('#img-preview');
var file = document.querySelector('input[name=Image]').files[0];
var reader = new FileReader();
reader.addEventListener("load", function () {
preview.src = reader.result;
}, false);
if (file) {
if (file.size < 10000000) {
reader.readAsDataURL(file);
} else {
alert("Image is too large.");
}
}
}
</script>