mirror of
https://github.com/Sonarr/Sonarr
synced 2024-12-26 09:47:39 +00:00
Removed jQuery UI selectable, using custom select boxes now. Cutoff dropbox is dynamic (based on selected qualities).
This commit is contained in:
parent
556d5d9fb3
commit
803ad8ca91
3 changed files with 99 additions and 105 deletions
|
@ -472,8 +472,8 @@ namespace NzbDrone.Web.Controllers
|
|||
|
||||
profile.Allowed = new List<QualityTypes>();
|
||||
|
||||
//Remove the extra comma from the end and replace double commas with a single one (the Javascript gets a little crazy)
|
||||
profile.AllowedString = profile.AllowedString.Replace(",,", ",").Trim(',');
|
||||
//Remove the extra comma from the end
|
||||
profile.AllowedString = profile.AllowedString.Trim(',');
|
||||
|
||||
foreach (var quality in profile.AllowedString.Split(','))
|
||||
{
|
||||
|
|
|
@ -7,11 +7,11 @@
|
|||
Layout = null;
|
||||
}
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
addOption('@Model.Name', '@ViewData["ProfileId"]');
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
.quality-selectee { width: 75px; padding: 1px; padding-left: 3px; padding-right: 3px; margin: 2px; float: left; }
|
||||
.quality-selecting { background: #85AEF9; }
|
||||
.quality-selected { background: #065EFE; color: white; }
|
||||
</style>
|
||||
|
||||
@using (Html.BeginCollectionItem("Profiles"))
|
||||
{
|
||||
|
@ -22,36 +22,7 @@
|
|||
string allowedStringName = String.Format("{0}_AllowedString", idClean);
|
||||
string title = String.Format("{0}_Title", idClean);
|
||||
string nameBox = String.Format("{0}_Name", idClean);
|
||||
string cutoff = String.Format("{0}.Cutoff", ugly);
|
||||
|
||||
<style>
|
||||
.selectableList .ui-selecting { background: #85AEF9; }
|
||||
.selectableList .ui-selected { background: #065EFE; color: white; }
|
||||
.selectableList { list-style-type: none; margin: 0; padding: 0; }
|
||||
.selectableList li { margin: 3px; margin-left: 10px; padding-left: 0.4em; padding-bottom: 1.5em; padding-top: 0em; float: left; font-size: 1.2em; width: 110px; height: 6px; }
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$("#@selectable").selectable({
|
||||
create: function () {
|
||||
var result = "";
|
||||
$(".ui-selected", this).each(function () {
|
||||
result += this.id + ",";
|
||||
});
|
||||
$("#@allowedStringName").empty().val(result);
|
||||
},
|
||||
|
||||
stop: function () {
|
||||
var result = "";
|
||||
$(".ui-selected", this).each(function () {
|
||||
result += this.id + ",";
|
||||
});
|
||||
$("#@allowedStringName").empty().val(result);
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
||||
string cutoff = String.Format("{0}_Cutoff", idClean);
|
||||
|
||||
<div class="profileSectionEditor" id="div_@(ViewData["ProfileId"])">
|
||||
|
||||
|
@ -70,49 +41,81 @@
|
|||
|
||||
<div class="config-group" style="width: 255px; margin-bottom: 5px; margin-left: 5px;">
|
||||
<div class="config-title">@Html.LabelFor(x => x.Cutoff)</div>
|
||||
<div class="config-value">@Html.DropDownListFor(m => m.Cutoff, new SelectList(ViewData["Qualities"] as IEnumerable, Model.Cutoff))</div>
|
||||
<div class="config-value">@Html.DropDownListFor(m => m.Cutoff, new SelectList(Model.Allowed, Model.Cutoff))</div>
|
||||
<div class="config-validation">@Html.ValidationMessageFor(x => x.Cutoff)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="selectableDiv" style="margin-top: 30px;">
|
||||
<ol id="@selectable" class="selectableList">
|
||||
|
||||
<div id="@selectable">
|
||||
@{var qualitiesList = (List<QualityTypes>)ViewData["Qualities"];}
|
||||
|
||||
@for (int i = 0; i < qualitiesList.Count(); i++)
|
||||
{
|
||||
if (qualitiesList[i].ToString() == "Unknown")
|
||||
{
|
||||
continue;
|
||||
}
|
||||
|
||||
if (Model.Allowed != null)
|
||||
{
|
||||
if (Model.Allowed.Contains(qualitiesList[i]))
|
||||
{
|
||||
<li class="ui-widget-content ui-selected" id="@qualitiesList[i].ToString()">
|
||||
@Html.Label(qualitiesList[i].ToString())
|
||||
</li>
|
||||
<fieldset class="quality-selectee quality-selected">@qualitiesList[i].ToString()</fieldset>
|
||||
continue;
|
||||
}
|
||||
}
|
||||
|
||||
<li class="ui-widget-content" id="@qualitiesList[i].ToString()">
|
||||
@Html.Label(qualitiesList[i].ToString())
|
||||
</li>
|
||||
<fieldset class="quality-selectee">@qualitiesList[i].ToString()</fieldset>
|
||||
}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hiddenProfileDetails2">
|
||||
<div class="hiddenProfileDetails">
|
||||
@Html.HiddenFor(x => x.QualityProfileId)
|
||||
@Html.HiddenFor(x => x.UserProfile)
|
||||
@Html.HiddenFor(m => m.AllowedString)
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
addOption('@Model.Name', '@ViewData["ProfileId"]');
|
||||
|
||||
result = "";
|
||||
$("#@selectable .quality-selected").each(function () {
|
||||
result += this.firstChild.data + ",";
|
||||
});
|
||||
|
||||
$("#@allowedStringName").empty().val(result);
|
||||
$('#@selectable .quality-selectee').disableSelection();
|
||||
});
|
||||
|
||||
$("#@nameBox").keyup(function () {
|
||||
var value = $(this).val();
|
||||
$("#@title").text(value);
|
||||
renameOption(value, '@ViewData["ProfileId"]');
|
||||
}).keyup();
|
||||
|
||||
$('#@selectable .quality-selectee').click(function () {
|
||||
if ($(this).hasClass('quality-selected'))
|
||||
{
|
||||
$(this).removeClass('quality-selected');
|
||||
var toRemove = this.firstChild.data;
|
||||
$('#@cutoff option').each(function () { if ($(this).text().indexOf(toRemove) > -1) $('#@cutoff option').remove(':contains("' + $(this).text() + '")'); });
|
||||
}
|
||||
|
||||
else {
|
||||
$(this).addClass('quality-selected');
|
||||
$('<option>' + this.firstChild.data + '</option>').appendTo('#@cutoff');
|
||||
}
|
||||
|
||||
result = "";
|
||||
$("#@selectable .quality-selected").each(function () {
|
||||
result += this.firstChild.data + ",";
|
||||
});
|
||||
|
||||
$("#@allowedStringName").empty().val(result);
|
||||
});
|
||||
</script>
|
||||
}
|
|
@ -1,58 +1,49 @@
|
|||
Hello World
|
||||
|
||||
<input type="checkbox" id="id_chk1" class="chkbox" value="1" />Check 1<br/>
|
||||
<input type="checkbox" id="id_chk2" class="chkbox" value="2" />Check 2<br/>
|
||||
<input type="checkbox" id="id_chk3" class="chkbox" value="3" />Check 3<br/>
|
||||
<input type="checkbox" id="id_chk4" class="chkbox" value="4" />Check 4<br/>
|
||||
<input type="checkbox" id="id_chk5" class="chkbox" value="5" />Check 5<br/>
|
||||
<input type="checkbox" id="id_chk6" class="chkbox" value="6" />Check 6<br/>
|
||||
<input type="checkbox" id="id_chk7" class="chkbox" value="7" />Check 7<br/>
|
||||
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
var lastChecked = null;
|
||||
|
||||
$(document).ready(function () {
|
||||
$('.chkbox').click(function (event) {
|
||||
if (!lastChecked) {
|
||||
lastChecked = this;
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.shiftKey) {
|
||||
var start = $('.chkbox').index(this);
|
||||
var end = $('.chkbox').index(lastChecked);
|
||||
|
||||
for (i = Math.min(start, end); i <= Math.max(start, end); i++) {
|
||||
$('.chkbox')[i].checked = lastChecked.checked;
|
||||
}
|
||||
}
|
||||
|
||||
lastChecked = this;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<style>
|
||||
#selectable .ui-selecting { background: #85AEF9; }
|
||||
#selectable .ui-selected { background: #065EFE; color: white; }
|
||||
#selectable { list-style-type: none; margin: 0; padding: 0; width: 110px; }
|
||||
#selectable li { margin: 3px; padding-left: 0.4em; padding-bottom: 1.5em; padding-top: 0em; font-size: 1.2em; height: 6px; }
|
||||
<style>
|
||||
.quality-selectee { width: 75px; padding: 1px; padding-left: 5px; margin: 3px; }
|
||||
.quality-selecting { background: #85AEF9; }
|
||||
.quality-selected { background: #065EFE; color: white; }
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$("#selectable").selectable();
|
||||
});
|
||||
</script>
|
||||
<fieldset class="quality-selectee">
|
||||
SDTV
|
||||
</fieldset>
|
||||
|
||||
<ol id="selectable">
|
||||
<li class="ui-widget-content">Unknown</li>
|
||||
<li class="ui-widget-content">SDTV</li>
|
||||
<li class="ui-widget-content">DVD</li>
|
||||
<li class="ui-widget-content">HDTV</li>
|
||||
<li class="ui-widget-content">WEBDL</li>
|
||||
<li class="ui-widget-content">Bluray720p</li>
|
||||
<li class="ui-widget-content">Bluray1080p</li>
|
||||
</ol>
|
||||
<fieldset class="quality-selectee">
|
||||
DVD
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="quality-selectee">
|
||||
HDTV
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="quality-selectee">
|
||||
WEBDL
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="quality-selectee">
|
||||
Bluray720p
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="quality-selectee">
|
||||
Bluray1080p
|
||||
</fieldset>
|
||||
|
||||
<br />
|
||||
|
||||
@Html.TextBox("result", "")
|
||||
|
||||
<script type="text/javascript">
|
||||
$('.quality-selectee').click(function () {
|
||||
if ($(this).hasClass('quality-selected'))
|
||||
$(this).removeClass('quality-selected');
|
||||
else
|
||||
$(this).addClass('quality-selected');
|
||||
|
||||
result = "";
|
||||
$(".quality-selected").each(function () {
|
||||
result += this.firstChild.data + ",";
|
||||
});
|
||||
|
||||
$("#result").empty().val(result);
|
||||
});
|
||||
</script>
|
Loading…
Reference in a new issue