Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/page-titles' into new-new-view-page
Browse files Browse the repository at this point in the history
  • Loading branch information
@janfaracik
janfaracik committed Oct 7, 2021
2 parents 3d6d8ff + 956ff65 commit 10702e3
Show file tree
Hide file tree
Showing 11 changed files with 303 additions and 424 deletions.
55 changes: 28 additions & 27 deletions core/src/main/resources/hudson/model/View/newJob.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,40 +29,41 @@ THE SOFTWARE.
<l:layout type="one-column" permission="${permission}" title="${%NewJob(it.newPronoun)}">

<l:js src="jsbundles/add-item.js" />
<l:css src="jsbundles/add-item.css" />

<l:main-panel>
<div class="container" id="add-item-panel" style="display: none;">
<div class="row">
<div class="col-md-offset-2 col-md-20">
<h1>${%New item}</h1>

<div class="jenkins-form" id="add-item-panel">
<div >
<div>
<form method="post" action="createItem" name="createItem" id="createItem">
<div class="header">
<div class="add-item-name">
<label for="name" class="h3">${%ItemName.label}</label>
<input name="name" id="name" data-valid="false" type="text" tabindex="0" />
<div class="input-help">&#187; ${%ItemName.help}</div>
<div id="itemname-required" class="input-validation-message input-message-disabled">&#187; ${%ItemName.validation.required}</div>
<div id="itemname-invalid" class="input-validation-message input-message-disabled"></div>
<div id="itemtype-required" class="input-validation-message input-message-disabled">&#187; ${%ItemType.validation.required}</div>
</div>
</div>

<div id="items" class="categories flat" role="radiogroup" aria-labelledby="Items" data-valid="false" />
<div class="jenkins-form-item">
<label for="name" class="jenkins-form-label">${%ItemName.label}</label>
<input name="name" class="jenkins-input" id="name" data-valid="false" type="text" tabindex="0" />
<div class="input-help">&#187; ${%ItemName.help}</div>
<div id="itemname-required" class="input-validation-message input-message-disabled">&#187; ${%ItemName.validation.required}</div>
<div id="itemname-invalid" class="input-validation-message input-message-disabled"></div>
<div id="itemtype-required" class="input-validation-message input-message-disabled">&#187; ${%ItemType.validation.required}</div>
</div>

<j:if test="${!empty(app.itemMap)}">
<div class="item-copy">
<p class="description">${%CopyOption.description}</p>
<div class="add-item-copy">
<input type="radio" name="mode" value="copy" />
<div class="icon">
<img src="${resURL}/images/48x48/copy.png" />
<div class="jenkins-form-item">
<div id="items" class="categories flat" role="radiogroup" aria-labelledby="Items" data-valid="false" />

<j:if test="${!empty(app.itemMap)}">
<div class="item-copy">
<p class="description"></p>
<div class="add-item-copy jenkins-radio">
<input class="jenkins-radio__input" id="copy" type="radio" name="mode" value="copy" />
<label class="jenkins-radio__label" for="copy">${%CopyOption.label}</label>
<p class="jenkins-radio__description">${%CopyOption.description}</p>
<div class="jenkins-radio__content">
<s:textbox id="from" data-valid="false" name="from" placeholder="${%CopyOption.placeholder}" field="copyNewItemFrom"/>
</div>
</div>
<label>${%CopyOption.label}</label>
<j:set var="descriptor" value="${it.descriptor}" />
<s:textbox id="from" data-valid="false" name="from" placeholder="${%CopyOption.placeholder}" field="copyNewItemFrom"/>
</div>
</div>
</j:if>
</j:if>
</div>

<div class="footer">
<div class="btn-decorator">
Expand Down
1 change: 1 addition & 0 deletions core/src/main/resources/jenkins/model/Jenkins/newView.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ THE SOFTWARE.
<st:include page="sidepanel.jelly" />

<l:main-panel>
<h1>${%New View}</h1>
<j:invokeStatic var="views" className="hudson.model.View" method="allInstantiable" />
<n:form nameTitle="${%View name}" action="createView" copyTitle="${%Copy Existing View}"
descriptors="${views}" checkUrl="checkViewName" xmlns:n="/lib/hudson/newFromList" />
Expand Down
2 changes: 1 addition & 1 deletion core/src/main/resources/lib/form/entry.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ THE SOFTWARE.
<div class='tr form-group'>
<j:choose>
<j:when test="${possiblyEscapedTitle!=null}">
<div class="setting-name help-sibling">
<div class="jenkins-form-label help-sibling">
<j:out value="${possiblyEscapedTitle}" />
<f:helpLink url="${attrs.help}" featureName="${title}"/>
</div>
Expand Down
5 changes: 4 additions & 1 deletion core/src/main/resources/lib/form/form.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,9 @@ THE SOFTWARE.
<st:attribute name="enctype">
@enctype of the &lt;form> HTML element.
</st:attribute>
<st:attribute name="id">
ID of the HTML element.
</st:attribute>
<st:attribute name="target">
@target of the &lt;form> HTML element. Works like &lt;a target="...">
and controls which window the result of the submission goes to.
Expand All @@ -53,7 +56,7 @@ THE SOFTWARE.
Default: false
</st:attribute>
</st:documentation>
<form action="${action}" method="${method}" enctype="${attrs.enctype}" name="${name}" target="${attrs.target}" autocomplete="${attrs.autocomplete==true?'on':'off'}">
<form id="${id}" action="${action}" method="${method}" enctype="${attrs.enctype}" name="${name}" target="${attrs.target}" autocomplete="${attrs.autocomplete==true?'on':'off'}">
<div width="100%" class="${attrs.tableClass}">
<d:invokeBody/>
</div>
Expand Down
2 changes: 1 addition & 1 deletion core/src/main/resources/lib/form/textbox.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ THE SOFTWARE.

<f:possibleReadOnlyField>
<m:input xmlns:m="jelly:hudson.util.jelly.MorphTagLibrary"
class="setting-input ${attrs.checkUrl!=null?'validated':''} ${attrs.autoCompleteUrl!=null?'auto-complete':null} ${attrs.clazz}"
class="jenkins-input ${attrs.checkUrl!=null?'validated':''} ${attrs.autoCompleteUrl!=null?'auto-complete':null} ${attrs.clazz}"
name="${name}"
value="${value}"
type="text"
Expand Down
86 changes: 56 additions & 30 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,29 +49,40 @@ THE SOFTWARE.
</st:attribute>
</st:documentation>


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

<s:form method="post" action="${attrs.action?:'createItem'}" name="createItem">
<s:entry title="${attrs.nameTitle}">
<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:textbox id="name" name="name" checkUrl="'${h.jsStringEscape(attrs.checkUrl)}?value='+encodeURIComponent(this.value)"
onchange="updateOk(this.form)" onkeyup="updateOk(this.form)" />
onchange="updateOk()" onkeyup="updateOk()" />
<script>$('name').focus();</script>
</s:entry>
</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>

<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(this.form)" onclick="updateOk(this.form)" />
<input type="radio" id="copy" name="mode" value="copy" onchange="updateOk()" onclick="updateOk()" />
<label class="attach-previous"><b>${attrs.copyTitle}</b></label>
</s:block>
<s:entry>
Expand All @@ -89,32 +100,47 @@ THE SOFTWARE.
</s:entry>
</j:if>

<s:bottomButtonBar>
<div class="jenkins-form-item">
<!--
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" />
<input type="submit" name="Submit" value="${%OK}" id="ok" style="margin-left:5em" />
</s:bottomButtonBar>
<button type="submit" id="ok" class="jenkins-button">
${%OK}
</button>
</div>
</s:form>

<script><![CDATA[
var okButton = makeButton($('ok'),null);
function updateOk(form) {
function updateOk() {
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)
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;
}
for (i = 0; i < radios.length; i++) {
if (radios[i].checked) {
return false;
}
}
return true;
}
okButton.set('disabled',state(),false);
document.getElementById("ok").disabled = state();
}
updateOk(okButton.getForm());
updateOk();
]]></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 = $('input[name="name"]', '#createItem').val();
var itemName = $('#name', '#createItem').val();
return (itemName === '') ? true : false;
}

Expand Down Expand Up @@ -135,16 +135,15 @@ $.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 = $('<ul/>').addClass('j-item-options');
var $catHeader = $('<div class="header" />');
var title = '<h2>' + category.name + '</h2>';
var description = '<p>' + category.description + '</p>';
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>';

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

function drawItem(elem) {
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 item = document.createElement('div');
item.className = 'jenkins-radio';

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

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

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

var desc = item.appendChild(document.createElement('div'));
desc.className = 'desc';
desc.className = 'jenkins-radio__description';
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 @@ -267,7 +262,7 @@ $.when(getItems()).done(function(data) {
$('#add-item-panel').removeAttr('style');

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

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

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

console.log(itemName)

$.get("checkJobName", { value: itemName }).done(function(data) {
var message = parseResponseFromCheckJobName(data);

if (message !== '') {
activateValidationMessage('#itemname-invalid', '.add-item-name', message);
activateValidationMessage('#itemname-invalid', '#name', message);
} else {
cleanValidationMessages('.add-item-name');
showInputHelp('.add-item-name');
cleanValidationMessages('#name');
showInputHelp('#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('.add-item-name');
activateValidationMessage('#itemname-required', '.add-item-name');
cleanValidationMessages('#name');
activateValidationMessage('#itemname-required', '#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', '.add-item-name');
activateValidationMessage('#itemname-required', '#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', '.add-item-name');
activateValidationMessage('#itemname-required', '#name');
$('input[name="name"][type="text"]', '#createItem').focus();
} else {
if (!getFieldValidationStatus('items') && !getFieldValidationStatus('from')) {
activateValidationMessage('#itemtype-required', '.add-item-name');
activateValidationMessage('#itemtype-required', '#name');
$('input[name="name"][type="text"]', '#createItem').focus();
}
}
Expand Down
Loading

0 comments on commit 10702e3

Please sign in to comment.