Skip to content

Commit

Permalink
Reset
Browse files Browse the repository at this point in the history
  • Loading branch information
@janfaracik
janfaracik committed Oct 7, 2021
1 parent 0d38bb0 commit 170f87e
Show file tree
Hide file tree
Showing 5 changed files with 394 additions and 87 deletions.
86 changes: 30 additions & 56 deletions core/src/main/resources/lib/hudson/newFromList/form.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,40 +49,29 @@ THE SOFTWARE.
</st:attribute>
</st:documentation>


<j:set var="descriptors" value="${h.filterDescriptors(it,attrs.descriptors)}" />

<s:form class="jenkins-form" method="post" id="createItemForm" action="${attrs.action?:'createItem'}" name="createItem">
<!-- View name field -->
<div class="jenkins-form-item">
<label for="name" class="jenkins-form-label">${attrs.nameTitle}</label>
<s:form method="post" action="${attrs.action?:'createItem'}" name="createItem">
<s:entry title="${attrs.nameTitle}">
<s:textbox id="name" name="name" checkUrl="'${h.jsStringEscape(attrs.checkUrl)}?value='+encodeURIComponent(this.value)"
onchange="updateOk()" onkeyup="updateOk()" />
onchange="updateOk(this.form)" onkeyup="updateOk(this.form)" />
<script>$('name').focus();</script>
</div>

<!-- View name field -->
<div class="jenkins-form-item">
<fieldset class="jenkins-fieldset">
<legend class="jenkins-form-label">
View type
</legend>
<j:forEach var="descriptor" items="${descriptors}">
<div class="jenkins-radio">
<input class="jenkins-radio__input" type="radio" name="mode" id="${descriptor.id}" value="${descriptor.id}" onchange="updateOk()" onclick="updateOk()" />
<label for="${descriptor.id}" class="jenkins-radio__label">
${descriptor.displayName}
</label>
<p class="jenkins-radio__description">
${descriptor}
</p>
</div>
</j:forEach>
</fieldset>
</div>
</s:entry>

<j:forEach var="descriptor" items="${descriptors}">
<s:block>
<input type="radio" name="mode" value="${descriptor.id}" onchange="updateOk(this.form)" onclick="updateOk(this.form)" />
<label class="attach-previous"><b>${descriptor.displayName}</b></label>
</s:block>
<s:entry>
<st:set var="instance" value="${descriptor}" />
<st:include page="newInstanceDetail.jelly" it="${descriptor}" />
</s:entry>
</j:forEach>
<j:if test="${!empty(attrs.copyNames) or attrs.showCopyOption}">
<s:block>
<input type="radio" id="copy" name="mode" value="copy" onchange="updateOk()" onclick="updateOk()" />
<input type="radio" id="copy" name="mode" value="copy" onchange="updateOk(this.form)" onclick="updateOk(this.form)" />
<label class="attach-previous"><b>${attrs.copyTitle}</b></label>
</s:block>
<s:entry>
Expand All @@ -100,47 +89,32 @@ THE SOFTWARE.
</s:entry>
</j:if>

<div class="jenkins-form-item">
<s:bottomButtonBar>
<!--
when there's only one radio above, form.elements['mode]' won't return an array, which makes the script complex.
So always force non-empty array
-->
<input type="radio" name="mode" value="dummy1" style="display:none" />
<input type="radio" name="mode" value="dummy2" style="display:none" />
<button type="submit" id="ok" class="jenkins-button">
${%OK}
</button>
</div>
<input type="submit" name="Submit" value="${%OK}" id="ok" style="margin-left:5em" />
</s:bottomButtonBar>
</s:form>

<script><![CDATA[
function updateOk() {
function state() {
let form = document.getElementById("createItemForm");
let nameInput = document.getElementById("name");
let radios = form.querySelectorAll('input[type="radio"]');
if (nameInput.value.length == 0) {
return true;
}
// this means we only have dummy checkboxes
if (radios.length == 2) {
return true;
}
var okButton = makeButton($('ok'),null);
for (i = 0; i < radios.length; i++) {
if (radios[i].checked) {
function updateOk(form) {
function state() {
if($('name').value.length==0) return true;
var radio = form.elements['mode'];
if (radio.length==2) return false; // this means we only have dummy checkboxes
for(i=0;i<radio.length;i++)
if(radio[i].checked)
return false;
}
}
return true;
}
document.getElementById("ok").disabled = state();
okButton.set('disabled',state(),false);
}
updateOk();
updateOk(okButton.getForm());
]]></script>
</j:jelly>
60 changes: 30 additions & 30 deletions war/src/main/js/add-item.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ $.when(getItems()).done(function(data) {
}

function isItemNameEmpty() {
var itemName = $('#name', '#createItem').val();
var itemName = $('input[name="name"]', '#createItem').val();
return (itemName === '') ? true : false;
}

Expand Down Expand Up @@ -135,15 +135,16 @@ $.when(getItems()).done(function(data) {
setFieldValidationStatus('from', false);
}


//////////////////////////////////
// Draw functions

function drawCategory(category) {
var $category = $('<div/>').addClass('category').attr('id', 'j-add-item-type-' + cleanClassName(category.id));
var $items = $('<div/>');
var $catHeader = $('<div />');
var title = '<label class="jenkins-form-label">' + category.name + '</label>';
var description = '<p class="jenkins-form-description">' + category.description + '</p>';
var $items = $('<ul/>').addClass('j-item-options');
var $catHeader = $('<div class="header" />');
var title = '<h2>' + category.name + '</h2>';
var description = '<p>' + category.description + '</p>';

// Add items
$.each(category.items, function(i, elem) {
Expand All @@ -159,26 +160,30 @@ $.when(getItems()).done(function(data) {
}

function drawItem(elem) {
var item = document.createElement('div');
item.className = 'jenkins-radio';
var item = document.createElement('li');
item.tabIndex = 0;
item.className = cleanClassName(elem.class);
item.setAttribute('role', 'radio');
item.setAttribute('aria-checked', 'false');

var label = item.appendChild(document.createElement('label'));

var radio = item.appendChild(document.createElement('input'));
var radio = label.appendChild(document.createElement('input'));
radio.type = 'radio';
radio.name = 'mode';
radio.className= 'jenkins-radio__input';
radio.value = elem.class;

var displayName = item.appendChild(document.createElement('span'));
displayName.className = 'jenkins-radio__label';
var displayName = label.appendChild(document.createElement('span'));
displayName.className = 'label';

displayName.appendChild(document.createTextNode(elem.displayName));

var desc = item.appendChild(document.createElement('div'));
desc.className = 'jenkins-radio__description';
desc.className = 'desc';
desc.innerHTML = checkForLink(elem.description);

// var iconDiv = drawIcon(elem);
// item.appendChild(iconDiv);
var iconDiv = drawIcon(elem);
item.appendChild(iconDiv);

function select(e) {
e.preventDefault();
Expand Down Expand Up @@ -262,7 +267,7 @@ $.when(getItems()).done(function(data) {
$('#add-item-panel').removeAttr('style');

// Render all categories
var $categories = $('#items');
var $categories = $('div.categories');
$.each(data.categories, function(i, elem) {
drawCategory(elem).appendTo($categories);
});
Expand All @@ -271,21 +276,16 @@ $.when(getItems()).done(function(data) {
$("#add-item-panel").find("#name").focus();

// Init NameField
$('#name', '#createItem').on("blur input", function() {

$('input[name="name"]', '#createItem').on("blur input", function() {
if (!isItemNameEmpty()) {
var itemName = $('#name', '#createItem').val();

console.log(itemName)

var itemName = $('input[name="name"]', '#createItem').val();
$.get("checkJobName", { value: itemName }).done(function(data) {
var message = parseResponseFromCheckJobName(data);

if (message !== '') {
activateValidationMessage('#itemname-invalid', '#name', message);
activateValidationMessage('#itemname-invalid', '.add-item-name', message);
} else {
cleanValidationMessages('#name');
showInputHelp('#name');
cleanValidationMessages('.add-item-name');
showInputHelp('.add-item-name');
setFieldValidationStatus('name', true);
if (getFormValidationStatus()) {
enableSubmit(true);
Expand All @@ -295,8 +295,8 @@ $.when(getItems()).done(function(data) {
} else {
enableSubmit(false);
setFieldValidationStatus('name', false);
cleanValidationMessages('#name');
activateValidationMessage('#itemname-required', '#name');
cleanValidationMessages('.add-item-name');
activateValidationMessage('#itemname-required', '.add-item-name');
}
});

Expand All @@ -309,7 +309,7 @@ $.when(getItems()).done(function(data) {
$('#createItem').find('input[type="radio"][value="copy"]').prop('checked', true);
setFieldValidationStatus('from', true);
if (!getFieldValidationStatus('name')) {
activateValidationMessage('#itemname-required', '#name');
activateValidationMessage('#itemname-required', '.add-item-name');
setTimeout(function() {
$('input[name="name"][type="text"]', '#createItem').focus();
}, 400);
Expand All @@ -326,11 +326,11 @@ $.when(getItems()).done(function(data) {
if (!getFormValidationStatus()) {
event.preventDefault();
if (!getFieldValidationStatus('name')) {
activateValidationMessage('#itemname-required', '#name');
activateValidationMessage('#itemname-required', '.add-item-name');
$('input[name="name"][type="text"]', '#createItem').focus();
} else {
if (!getFieldValidationStatus('items') && !getFieldValidationStatus('from')) {
activateValidationMessage('#itemtype-required', '#name');
activateValidationMessage('#itemtype-required', '.add-item-name');
$('input[name="name"][type="text"]', '#createItem').focus();
}
}
Expand Down
Loading

0 comments on commit 170f87e

Please sign in to comment.