FORMS-834 : add scale type for radio entry

lutece-platform · Sep 15, 2022 · d2f1bbd · d2f1bbd
1 parent 46734c1
commit d2f1bbd
Show file tree

Hide file tree

Showing 6 changed files with 62 additions and 5 deletions.
diff --git a/src/java/fr/paris/lutece/plugins/forms/resources/forms_messages.properties b/src/java/fr/paris/lutece/plugins/forms/resources/forms_messages.properties
@@ -605,6 +605,11 @@ createEntry.viewNumber=View number
 createEntry.labelPresentation=presentation model
 createEntry.selectPresentationInLine=In line
 createEntry.selectPresentationNotInLine=In column
+createEntry.labelAlignmentText=Text alignment
+createEntry.selectAlignmentTop=At the top
+createEntry.selectAlignmentToTheRight=To the right
+createEntry.labelTextLeft=Left field
+createEntry.labelTextRight=Right field
 create_entry.label_role_associated=role
 createEntry.labelMandatoryCheckBoxHelp=Every check box must be checked
 createEntry.labelMandatoryCommentForEntryTypeSession=Check this box if you want to display the form only if there is a value in the attribute of this session

diff --git a/src/java/fr/paris/lutece/plugins/forms/resources/forms_messages_fr.properties b/src/java/fr/paris/lutece/plugins/forms/resources/forms_messages_fr.properties
@@ -609,6 +609,11 @@ createEntry.viewNumber=Num\u00e9ro de la vue
 createEntry.labelPresentation=Mod&#232;le de pr\u00e9sentation
 createEntry.selectPresentationInLine=En ligne
 createEntry.selectPresentationNotInLine=En colonne
+createEntry.labelAlignmentText=Alignement du texte
+createEntry.selectAlignmentTop=En haut
+createEntry.selectAlignmentToTheRight=A droite
+createEntry.labelTextLeft=Champ gauche
+createEntry.labelTextRight=Champ droite
 create_entry.label_role_associated=Associer un r\u00f4le
 createEntry.labelMandatoryCheckBoxHelp=Toutes les cases &#224; cocher doivent obligatoirement &#234;tre coch\u00e9es
 createEntry.labelMandatoryCommentForEntryTypeSession=Cochez cette case si vous souhaitez afficher le formulaire uniquement s'il y a une valeur dans cet attribut de session.

diff --git a/webapp/WEB-INF/templates/admin/plugins/forms/entries/create_entry_type_radio_button.html b/webapp/WEB-INF/templates/admin/plugins/forms/entries/create_entry_type_radio_button.html
@@ -45,6 +45,19 @@
 								<option value=0 <#if presentation_type = '0' >selected="selected"</#if> >#i18n{forms.createEntry.selectPresentationNotInLine}</option>
 							</@select>
 						</@formGroup>
+						<@formGroup labelFor='alignment_text' labelKey='#i18n{forms.createEntry.labelAlignmentText}'>
+							<#assign alignment_type = getName('alignment_text',list_param_default_values)!1>
+							<@select id='alignment_text' name='alignment_text'>
+								<option value=1 <#if alignment_type = '1' >selected="selected"</#if> >#i18n{forms.createEntry.selectAlignmentTop}</option>
+								<option value=0 <#if alignment_type = '0' >selected="selected"</#if> >#i18n{forms.createEntry.selectAlignmentToTheRight}</option>
+							</@select>
+						</@formGroup>
+						<@formGroup labelFor='entry_text_left' labelKey='#i18n{forms.createEntry.labelTextLeft}' helpKey='#i18n{forms.createEntry.labelTextLeft}'>
+							<@input type='text' name='left_text' id='left_text' value='' maxlength=100 />
+						</@formGroup>
+						<@formGroup labelFor='entry_text_right' labelKey='#i18n{forms.createEntry.labelTextRight}' helpKey='#i18n{forms.createEntry.labelTextRight}'>
+							<@input type='text' name='right_text' id='right_text' value='' maxlength=100 />
+						</@formGroup>
 						<@formGroup labelFor='mandatory' labelKey='#i18n{forms.createEntry.labelMandatory}'>
 							<@checkBox orientation='switch' name='mandatory' id='mandatory' value='1' checked=getChecked('mandatory',list_param_default_values) />
 						</@formGroup>

diff --git a/webapp/WEB-INF/templates/admin/plugins/forms/entries/modify_entry_type_radio_button.html b/webapp/WEB-INF/templates/admin/plugins/forms/entries/modify_entry_type_radio_button.html
@@ -50,6 +50,21 @@
 								<option value=0 <#if !entry.fieldInLine >selected="selected" </#if>>#i18n{forms.createEntry.selectPresentationNotInLine}</option>
 							</@select>
 						</@formGroup>
+						<@formGroup labelFor='alignment_text' labelKey='#i18n{forms.createEntry.labelAlignmentText}'>
+							<#assign alignment_type=getFieldValueByCode( entry, "alignment_text")>
+							<@select id='alignment_text' name='alignment_text'>
+								<option value=1 <#if alignment_type = '1' >selected="selected"</#if> >#i18n{forms.createEntry.selectAlignmentTop}</option>
+								<option value=0 <#if alignment_type = '0' >selected="selected"</#if> >#i18n{forms.createEntry.selectAlignmentToTheRight}</option>
+							</@select>
+						</@formGroup>
+						<@formGroup labelFor='entry_radio_left' labelKey='#i18n{forms.createEntry.labelTextLeft}' helpKey='#i18n{forms.createEntry.labelTextLeft}'>
+							<#assign text_left=getFieldValueByCode( entry, "left_text")>
+							<@input type='text' name='left_text' id='left_text' value=text_left maxlength=100 />
+						</@formGroup>
+						<@formGroup labelFor='entry_radio_right' labelKey='#i18n{forms.createEntry.labelTextRight}' helpKey='#i18n{forms.createEntry.labelTextRight}'>
+							<#assign text_right=getFieldValueByCode( entry, "right_text")>
+							<@input type='text' name='right_text' id='right_text' value=text_right maxlength=100 />
+						</@formGroup>
 						<@formGroup>
 							<@checkBox orientation='switch' labelFor='mandatory' labelKey='#i18n{forms.createEntry.labelMandatory}' name='mandatory' id='mandatory' value='1' checked=entry.mandatory labelKey='#i18n{forms.createEntry.labelMandatory}' />
 						</@formGroup>

diff --git a/webapp/WEB-INF/templates/skin/plugins/forms/entries/fill_entry_type_radio_button.html b/webapp/WEB-INF/templates/skin/plugins/forms/entries/fill_entry_type_radio_button.html
@@ -11,18 +11,31 @@
 			<#assign idConditional = idName + field.idField>
 			<#assign hide=hide+"hideId(${idConditional}.id);">
 		</#if>
+		<#if field.code == 'left_text'> 
+			<#assign leftText = field.value> 
+		</#if>
+		<#if field.code == 'right_text'> 
+			<#assign rightText = field.value> 
+		</#if>
+		<#if field.code == 'alignment_text'> 
+			<#assign fieldAlignment = field.value> 
+		</#if>
 	</#list>
 	${entry.CSSClass!}
 
 		<div class="form-group">
 			<label class="control-label col-xs-12 col-sm-12 col-md-3 col-lg-3" for="form${entry.idEntry}" id="form${entry.idEntry}">${entry.title}<#if entry.mandatory> *</#if></label>
 			<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
 			<#assign inLine = entry.fieldInLine>
+			${leftText!}
 			<#list entry.fields as field>
 				<#if field.code == 'answer_choice'>
 					<#assign idName = buildEntryName( entry, entry_iteration_number )>
 					<#if entry.fieldInLine != true><div class="radio"></#if>
-						<label <#if entry.fieldInLine>class="radio-inline"</#if> for="${idName}_${field.idField}" <#if field.comment?? && field.comment != ''>title="${field.comment}"</#if> > 
+						<#if fieldAlignment?? && fieldAlignment == "1">
+						<label <#if entry.fieldInLine>class="custom-control custom-radio custom-control-inline"</#if> for="${idName}_${field.idField}" <#if field.comment?? && field.comment != ''>title="${field.comment}"</#if> > 
+							<div class="radio-above">
+						</#if>
 							<input type="radio" id="${idName}_${field.idField}" name="${idName}" value="${field.idField}"
 							<#if list_responses?? && list_responses?has_content>
 								<#list list_responses as response>
@@ -40,9 +53,12 @@
 								<#assign idConditional = idName + field.idField>
 								displayId(${idConditional}.id);</#if>"
 							/>
-					 <#if !field.noDisplayTitle>
-					 	${field.title}
-					 </#if>
+							 <#if !field.noDisplayTitle>
+							 	${field.title}
+							 </#if>
+							 <#if fieldAlignment?? && fieldAlignment == "1">
+								</div>
+							</#if>
 						</label>
 						<#if entry.fieldInLine != true></div></#if>
 
@@ -58,6 +74,7 @@
 				<#if entry.fieldInLine&&entry.helpMessage?exists&&entry.helpMessage!=''>
 				<span class="help-block">${entry.helpMessage}</span>
 				</#if>
+				${rightText!}
 			</div>
 		</div>
 

diff --git a/webapp/css/plugins/forms/forms.css b/webapp/css/plugins/forms/forms.css
@@ -5,4 +5,6 @@
 
 .cam-wrapper{ position: relative; border: 1px dotted #000; display: flex; justify-content: center;}
 .cam-wrapper > video{ max-width: 100%; }
-.btn-cam{  position: absolute !important; bottom:15px; right:15px; }
+.btn-cam{  position: absolute !important; bottom:15px; right:15px; }
+
+.radio-above{ display: flex; flex-direction: column-reverse; padding:15px; }