hr-design-system-handlebars 1.114.2 → 1.114.3

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v1.114.3 (Thu Nov 07 2024)
+
+#### 🐛 Bug Fix
+
+- add voting-cookie [#1152](https://github.com/mumprod/hr-design-system-handlebars/pull/1152) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
 # v1.114.2 (Wed Nov 06 2024)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -3687,7 +3687,7 @@ article.indexTextDS .indexTextHighlighted .link {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1730913575405;
+  counter-reset: cnt1730979409611;
 }
 .placeholder-text-xs::-webkit-input-placeholder {
   font-size: 0.75rem;
@@ -4101,7 +4101,7 @@ article.indexTextDS .indexTextHighlighted .link {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1730913575405 1;
+  counter-increment: cnt1730979409611 1;
 }
 .-ordered::before {
   position: absolute;
@@ -4119,7 +4119,7 @@ article.indexTextDS .indexTextHighlighted .link {
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, 1);
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1730913575405);
+  content: counter(cnt1730979409611);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */

package/dist/assets/js/components/voting/js/votingCookieCheckerDs.feature.js

@@ -6,7 +6,7 @@ const VotingCookieChecker = (context) => {
         votingId = options.votingId,
         votingWrapper = hr$('.js-voting-wrapper', rootElement)[0],
         hideVotingResult = options.hideVotingResult,
-        alreadyVotedTmpl = '<p>' + options.alreadyVotedHintText + '<p>'
+        alreadyVotedTmpl = '<p class="mt-6 text-base font-bold sm:text-xl font-heading sm:mt-12 dark:text-text-dark">' + options.alreadyVotedHintText + '<p>'
     let cookie = ''
 
     const checkForVotingCookie = function () {

package/dist/assets/js/components/voting/js/votingResultCookieDs.feature.js

@@ -0,0 +1,12 @@
+import { setJSONCookie } from 'hrQuery'
+
+const VotingResultCookie = function (context) {
+    'use strict'
+    const { options } = context,
+        cookie = options.votingId,
+        voteCookieLifetime = options.cookieLifetime * 60 * 1000
+    console.log(voteCookieLifetime)
+    setJSONCookie(cookie, true, voteCookieLifetime)
+}
+
+export default VotingResultCookie

package/dist/views/components/voting/voting.hbs

@@ -1,64 +1,96 @@
-{{#with this.form}}
-    {{#unless this.isVotingOver}}
-        {{#unless ../this.hasRedirect}}
-            <div class="js-load {{../_addClass}}"
-                data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'
-                data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
-                {{#if this.isSimpleSecured}}
-                    data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
-                    id="{{this.sophoraId}}"
-                {{/if}}
-            >
-        {{else}}
-            <div class="js-load {{../_addClass}}"
-                {{#if this.is2FSecured}}data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'{{/if}}
-                data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
-                {{#if this.isSimpleSecured}}
-                    data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
-                    id="{{this.sophoraId}}"
-                {{/if}}
-            >
-        {{/unless}}    
-            <div class="js-voting-wrapper">
-                <form class="js-votingForm" 
-                    action="{{this.url}}" 
-                    method="post"
-                    enctype="application/x-www-form-urlencoded" 
-                    accept-charset="utf-8" 
-                    autocomplete="off"
+{{#>components/forms/components/backgroundBox  }}
+    {{#with this.form}}
+        {{#unless this.isVotingOver}}
+            {{#unless ../this.hasRedirect}}
+                <div class="js-load {{../_addClass}}"
+                    data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'
+                    data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
+                    {{#if this.isSimpleSecured}}
+                        data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
+                        id="{{this.sophoraId}}"
+                    {{/if}}
                 >
-                    {{> components/voting/components/voting_header _title=../this.title _topline=../this.topline}}
-                    
-                    <div class="c-voting-form__bottomWrapper">
-                        {{#if this.shorttext}}
-                            <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">{{this.shorttext}}</p>
-                        {{/if}}
-
-                        <div class="w-full mt-6 text-xs text-right sm:mt-12 font-headingSerif sm:text-sm text-gray-scorpion dark:text-text-dark">
-                            {{#if ../this.isMultipleChoice}}
-                                {{loca "votingform_open_answers_text" ../this.maxAnswerCount}}
-                            {{else}}
-                                {{loca "votingform_single_answer_text"}}
+            {{else}}
+                <div class="js-load {{../_addClass}}"
+                    {{#if this.is2FSecured}}data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'{{/if}}
+                    data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
+                    {{#if this.isSimpleSecured}}
+                        data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
+                        id="{{this.sophoraId}}"
+                    {{/if}}
+                >
+            {{/unless}}    
+                <div class="js-voting-wrapper">
+                    <form class="js-votingForm" 
+                        action="{{this.url}}" 
+                        method="post"
+                        enctype="application/x-www-form-urlencoded" 
+                        accept-charset="utf-8" 
+                        autocomplete="off"
+                    >
+                        {{> components/voting/components/voting_header _title=../this.title _topline=../this.topline}}
+                        
+                        <div class="c-voting-form__bottomWrapper">
+                            {{#if this.shorttext}}
+                                <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">{{this.shorttext}}</p>
                             {{/if}}
-                            <span class="block float-right w-8 js-voting-counter">(0/{{../this.maxAnswerCount}})</span>
+
+                            <div class="w-full mt-6 text-xs text-right sm:mt-12 font-headingSerif sm:text-sm text-gray-scorpion dark:text-text-dark">
+                                {{#if ../this.isMultipleChoice}}
+                                    {{loca "votingform_open_answers_text" ../this.maxAnswerCount}}
+                                {{else}}
+                                    {{loca "votingform_single_answer_text"}}
+                                {{/if}}
+                                <span class="block float-right w-8 js-voting-counter">(0/{{../this.maxAnswerCount}})</span>
+                            </div>
+                            {{> components/forms/components/fields 
+                                    _multipleChoice=../this.isMultipleChoice 
+                                    _addClassGroup="!flex-col mt-2" 
+                                    _addClassChoice="has-[input:checked]:outline outline-2 outline-blue-science-hex bg-white has-[input:disabled]:opacity-50 has-[input:disabled]:cursor-not-allowed" 
+                                    _addClassLabel="w-full !py-3 sm:!py-4 !pr-3 sm:!pr-4 !text-base sm:!text-lg md:!text-lg" 
+                                    _addClassLabelForDataPolicy="font-headingSerif !pt-0 !text-sm !text-gray-dark dark:!text-text-dark"
+                                    _addClassInput="!my-3 sm:!my-4 !ml-3 sm:!ml-4"
+                            }}
+                            {{#if this.is2FSecured}}
+                                <div class="float-left mt-1 text-xs text-gray-scorpion dark:text-text-dark font-headingSerif">{{loca "form_text_required"}}</div>
+                            {{/if}}                            
+                            {{> components/voting/components/voting_submit _label="Abstimmen" _addClass="-inactive js-voting-submit-button"}}
                         </div>
-                        {{> components/forms/components/fields 
-                                _multipleChoice=../this.isMultipleChoice 
-                                _addClassGroup="!flex-col mt-2" 
-                                _addClassChoice="has-[input:checked]:outline outline-2 outline-blue-science-hex bg-white has-[input:disabled]:opacity-50 has-[input:disabled]:cursor-not-allowed" 
-                                _addClassLabel="w-full !py-3 sm:!py-4 !pr-3 sm:!pr-4 !text-base sm:!text-lg md:!text-lg" 
-                                _addClassLabelForDataPolicy="font-headingSerif !pt-0 !text-sm !text-gray-dark dark:!text-text-dark"
-                                _addClassInput="!my-3 sm:!my-4 !ml-3 sm:!ml-4"
-                        }}
-                        {{#if this.is2FSecured}}
-                            <div class="float-left mt-1 text-xs text-gray-scorpion dark:text-text-dark font-headingSerif">{{loca "form_text_required"}}</div>
-                        {{/if}}                            
-                        {{> components/voting/components/voting_submit _label="Abstimmen" _addClass="-inactive js-voting-submit-button"}}
-                    </div>
-                </form>
+                        <script type="text/html" class="js-successMessage">
+                                {{#if this.is2FSecured}}
+                                    {{{include "components/voting/voting_success_2F" _isInline=true _statusDone=true _title=../this.title _topline=../this.topline}}}
+                                {{else}}
+                                    {{{include "components/voting/voting_success" _isInline=true _voteResults=../this.votingResult _statusDone=true _title=../this.title _topline=../this.topline}}}
+                                {{/if}}
+                        </script>
+                        <script type="text/html" class="js-errorMessage">
+                                {{#if this.is2FSecured}}
+                                    {{{include "components/voting/voting_error" _isInline=true _statusDone=error _title=../this.title _topline=../this.topline}}}
+                                {{else}}
+                                    {{{include "components/voting/voting_error" _isInline=true _statusDone=false _title=../this.title _topline=../this.topline}}}
+                                {{/if}}
+                        </script>
+                        {{#unless this.hideVotingResult}}
+                            <script type="text/html" class="js-result">
+                                    {{#unless this.is2FSecured}}
+                                        {{> components/voting/voting_result 
+                                                _resultBoxMessageText=(loca "votingform_already_voted_cookie_hint") 
+                                                _voteResults=../this.votingResult 
+                                                _isResultOnRedirectPage=_isResultOnRedirectPage 
+                                                _isSimpleSecured=../this.isSimpleSecured 
+                                                _statusDone=true 
+                                                _addClass=../_addClass 
+                                                _hideVotingResult=this.hideVotingResult 
+                                                _isVotingOver=this.isVotingOver 
+                                        }}
+                                    {{/unless}}
+                            </script>
+                        {{/unless}}                                                            
+                    </form>
+                </div>
             </div>
-        </div>
-    {{else}}
-        {{> components/voting/voting_result _isVotingOver=true _title=../this.title _topline=../this.topline}}
-    {{/unless}}
-{{/with}}
+        {{else}}
+            {{> components/voting/voting_result _isVotingOver=true _title=../this.title _topline=../this.topline}}
+        {{/unless}}
+    {{/with}}
+{{/components/forms/components/backgroundBox }}

package/dist/views/components/voting/voting_error.hbs

@@ -1,6 +1,6 @@
 {{> components/voting/voting_result
-            _title=this.title
-            _topline=this.topline
+            _title=_title
+            _topline=_topline
             _resultBoxMessageTitle=(loca "votingform_title_error")
             _resultBoxMessageText=(loca "votingform_text_error")
             _locaKeyText="votingform_text_error"

package/dist/views/components/voting/voting_result.hbs

@@ -1,62 +1,71 @@
-{{#unless _isResultOnRedirectPage}}
-    {{> components/voting/components/voting_header _title=_title _topline=_topline}}
-{{/unless}}
+<div class="{{#if this.isSimpleSecured}}js-load{{/if}}{{#if _addClass}} {{_addClass}}{{/if}}" 
+    {{#unless _isVotingOver}}
+        {{#if this.isSimpleSecured}}
+            data-hr-voting-result-cookie-ds='{"cookieLifetime":"{{this.cookieLifetime}}","votingId":"{{this.sophoraId}}"}'
+        {{/if}}
+    {{/unless}}
+>
 
-{{#if _hideVotingResult}}
-    {{#if _isVotingOver}}
-        <p class="mt-6 ml-8 text-base font-bold sm:ml-9 sm:text-lg font-heading sm:mt-12">{{{_resultBoxMessageText}}}</p>
+    {{#unless _isResultOnRedirectPage}}
+        {{> components/voting/components/voting_header _title=_title _topline=_topline}}
+    {{/unless}}
+
+    {{#if _hideVotingResult}}
+        {{#if _isVotingOver}}
+            <p class="mt-6 ml-8 text-base font-bold sm:ml-9 sm:text-lg font-heading sm:mt-12">{{{_resultBoxMessageText}}}</p>
+        {{else}}
+            {{~> components/base/image/icon _icon=(if _statusDone "status-done" "status-error") _iconmap="icons" _addClass=(if _statusDone "" "float-left w-6 h-6 text-error dark:text-error-dark fill-current mt-6 sm:mt-12")}}
+            <p class="mt-6 ml-8 text-base font-bold sm:ml-9 text-error sm:text-lg font-heading sm:mt-12 dark:text-error-dark">{{{_resultBoxMessageText}}}</p>
+        {{/if}}
     {{else}}
-        {{~> components/base/image/icon _icon=(if _statusDone "status-done" "status-error") _iconmap="icons" _addClass=(if _statusDone "" "float-left w-6 h-6 text-error dark:text-error-dark fill-current mt-6 sm:mt-12")}}
-        <p class="mt-6 ml-8 text-base font-bold sm:ml-9 text-error sm:text-lg font-heading sm:mt-12 dark:text-error-dark">{{{_resultBoxMessageText}}}</p>
-    {{/if}}
-{{else}}
-    <p class="mt-6 text-base font-bold sm:text-xl font-heading sm:mt-12">{{{_resultBoxMessageText}}}</p>
-    
-    {{#each _voteResults}}
-        <div class="flex">
-            <div class="grow">
-                <div class="{{#if @first}}mt-7 sm:mt-9{{else}}mt-3 sm:mt-4{{/if}} text-base sm:text-lg font-copy dark:text-text-dark">{{this.label}}</div>
-                <div class="mt-0.5 sm:mt-1 w-full bg-gray-alto rounded-full h-2">
-                    <div class="{{#if this.isWinner}}bg-orange-spicyCarrot-hex{{else}}bg-blue-congress-hex{{/if}} h-2 rounded-full" style="width:{{this.roundedPercentageCount}}%;animation: progressAnimationDS 5s"></div>
+        <p class="mt-6 text-base font-bold sm:text-xl font-heading sm:mt-12">{{{_resultBoxMessageText}}}</p>
+        
+        {{#each _voteResults}}
+            <div class="flex">
+                <div class="grow">
+                    <div class="{{#if @first}}mt-7 sm:mt-9{{else}}mt-3 sm:mt-4{{/if}} text-base sm:text-lg font-copy dark:text-text-dark">{{this.label}}</div>
+                    <div class="mt-0.5 sm:mt-1 w-full bg-gray-alto rounded-full h-2">
+                        <div class="{{#if this.isWinner}}bg-orange-spicyCarrot-hex{{else}}bg-blue-congress-hex{{/if}} h-2 rounded-full" style="width:{{this.roundedPercentageCount}}%;animation: progressAnimationDS 5s"></div>
+                    </div>
+                </div>
+                <div class="self-end flex-none w-16">
+                    <span class="float-right block mt-2 text-2xl font-bold font-headingSerif {{#if this.isWinner}}text-orange-spicyCarrot-hex{{else}}text-blue-congress-hex{{/if}}" style="animation: percentageAnimationDS 5s">
+                        {{#if ../this.showAbsoluteResult}}{{this.count}}{{else}}{{this.percentageCount}}%{{/if}}
+                    </span>
                 </div>
             </div>
-            <div class="self-end flex-none w-16">
-                <span class="float-right block mt-2 text-2xl font-bold font-headingSerif {{#if this.isWinner}}text-orange-spicyCarrot-hex{{else}}text-blue-congress-hex{{/if}}" style="animation: percentageAnimationDS 5s">
-                    {{#if ../this.showAbsoluteResult}}{{this.count}}{{else}}{{this.percentageCount}}%{{/if}}
-                </span>
-            </div>
-        </div>
-    {{/each}}
-    
-    {{#if this.isMultipleChoice}}
-        {{#unless this.showAbsoluteResult}}
+        {{/each}}
+        
+        {{#if this.isMultipleChoice}}
+            {{#unless this.showAbsoluteResult}}
+                {{#if this.showVoteResult}}
+                    <p class="clear-both text-xs pt-7 sm:pt-9 font-headingSerif sm:text-sm text-gray-scorpion">
+                        {{loca "votingform_vote_result"}}{{this.summarizedResult}}
+                    </p>
+                {{/if}}
+            {{/unless}}
+        {{else}}
             {{#if this.showVoteResult}}
                 <p class="clear-both text-xs pt-7 sm:pt-9 font-headingSerif sm:text-sm text-gray-scorpion">
                     {{loca "votingform_vote_result"}}{{this.summarizedResult}}
                 </p>
             {{/if}}
-        {{/unless}}
-    {{else}}
-        {{#if this.showVoteResult}}
-            <p class="clear-both text-xs pt-7 sm:pt-9 font-headingSerif sm:text-sm text-gray-scorpion">
-                {{loca "votingform_vote_result"}}{{this.summarizedResult}}
-            </p>
-        {{/if}}
-    {{/if}}    
-{{/if}}
+        {{/if}}    
+    {{/if}}
 
-{{#if _isVotingOver}}
-    <p class="mt-6 text-base font-bold sm:text-xl font-heading sm:mt-12 dark:text-text-dark">{{loca "votingform_voting_finished"}}</p>
-{{/if}}
+    {{#if _isVotingOver}}
+        <p class="mt-6 text-base font-bold sm:text-xl font-heading sm:mt-12 dark:text-text-dark">{{loca "votingform_voting_finished"}}</p>
+    {{/if}}
 
-{{#unless _isResultOnRedirectPage}}
-    {{#unless this.isSimpleSecured}}
-        {{#unless _isVotingOver}}
-            <div class="mt-6 sm:mt-12">
-                {{#> components/button/link_button _size="lg" _css="float-right"}}
-                    {{> components/button/components/button_label _label=(loca "votingform_form_back")}}
-                {{/components/button/link_button}}
-            </div>            
+    {{#unless _isResultOnRedirectPage}}
+        {{#unless this.isSimpleSecured}}
+            {{#unless _isVotingOver}}
+                <div class="mt-6 sm:mt-12">
+                    {{#> components/button/link_button _size="lg" _css="float-right"}}
+                        {{> components/button/components/button_label _label=(loca "votingform_form_back")}}
+                    {{/components/button/link_button}}
+                </div>            
+            {{/unless}}
         {{/unless}}
     {{/unless}}
-{{/unless}}
+</div>

package/dist/views/components/voting/voting_success.hbs

@@ -1,7 +1,7 @@
 {{#if this.votingSuccessText}}
     {{> components/voting/voting_result
-                _title=this.title
-                _topline=this.topline
+                _title=_title
+                _topline=_topline
                 _resultBoxMessageTitle=(loca "votingform_title_success")
                 _resultBoxMessageText=this.votingSuccessText.richtext
                 _isInline=_isInline
@@ -13,8 +13,8 @@
     }}
 {{else}}
     {{> components/voting/voting_result
-                _title=this.title
-                _topline=this.topline
+                _title=_title
+                _topline=_topline
                 _resultBoxMessageTitle=(loca "votingform_title_success")
                 _resultBoxMessageText=(loca "votingform_text_success")
                 _isInline=_isInline

package/dist/views/components/voting/voting_success_2F.hbs

@@ -1,6 +1,6 @@
 {{> components/voting/voting_result_2F
-            _title=this.title
-            _topline=this.topline
+            _title=_title
+            _topline=_topline
             _resultBoxMessageTitle=(loca "votingform2F_title_success")
             _resultBoxMessageText=(loca "votingform2F_text_success")
             _isInline=_isInline

package/dist/views_static/components/voting/voting.hbs

@@ -1,64 +1,96 @@
-{{#with this.form}}
-    {{#unless this.isVotingOver}}
-        {{#unless ../this.hasRedirect}}
-            <div class="js-load {{../_addClass}}"
-                data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'
-                data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
-                {{#if this.isSimpleSecured}}
-                    data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
-                    id="{{this.sophoraId}}"
-                {{/if}}
-            >
-        {{else}}
-            <div class="js-load {{../_addClass}}"
-                {{#if this.is2FSecured}}data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'{{/if}}
-                data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
-                {{#if this.isSimpleSecured}}
-                    data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
-                    id="{{this.sophoraId}}"
-                {{/if}}
-            >
-        {{/unless}}    
-            <div class="js-voting-wrapper">
-                <form class="js-votingForm" 
-                    action="{{this.url}}" 
-                    method="post"
-                    enctype="application/x-www-form-urlencoded" 
-                    accept-charset="utf-8" 
-                    autocomplete="off"
+{{#>components/forms/components/backgroundBox  }}
+    {{#with this.form}}
+        {{#unless this.isVotingOver}}
+            {{#unless ../this.hasRedirect}}
+                <div class="js-load {{../_addClass}}"
+                    data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'
+                    data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
+                    {{#if this.isSimpleSecured}}
+                        data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
+                        id="{{this.sophoraId}}"
+                    {{/if}}
                 >
-                    {{> components/voting/components/voting_header _title=../this.title _topline=../this.topline}}
-                    
-                    <div class="c-voting-form__bottomWrapper">
-                        {{#if this.shorttext}}
-                            <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">{{this.shorttext}}</p>
-                        {{/if}}
-
-                        <div class="w-full mt-6 text-xs text-right sm:mt-12 font-headingSerif sm:text-sm text-gray-scorpion dark:text-text-dark">
-                            {{#if ../this.isMultipleChoice}}
-                                {{loca "votingform_open_answers_text" ../this.maxAnswerCount}}
-                            {{else}}
-                                {{loca "votingform_single_answer_text"}}
+            {{else}}
+                <div class="js-load {{../_addClass}}"
+                    {{#if this.is2FSecured}}data-hr-voting-ds='{"jsonURL":"{{this.jsonUrl}}", "errorMessages": {{this.errorMessages}} }'{{/if}}
+                    data-hr-voting-validator-ds='{"isMultipleChoice": {{../this.isMultipleChoice}}, "minAnswerCount": 1, "maxAnswerCount": {{../this.maxAnswerCount}} }'
+                    {{#if this.isSimpleSecured}}
+                        data-hr-voting-cookie-checker-ds='{ "alreadyVotedHintText": "{{loca "votingform_already_voted_cookie_hint"}}" , "hideVotingResult": {{this.hideVotingResult}} , "votingId": "{{this.sophoraId}}" }'
+                        id="{{this.sophoraId}}"
+                    {{/if}}
+                >
+            {{/unless}}    
+                <div class="js-voting-wrapper">
+                    <form class="js-votingForm" 
+                        action="{{this.url}}" 
+                        method="post"
+                        enctype="application/x-www-form-urlencoded" 
+                        accept-charset="utf-8" 
+                        autocomplete="off"
+                    >
+                        {{> components/voting/components/voting_header _title=../this.title _topline=../this.topline}}
+                        
+                        <div class="c-voting-form__bottomWrapper">
+                            {{#if this.shorttext}}
+                                <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">{{this.shorttext}}</p>
                             {{/if}}
-                            <span class="block float-right w-8 js-voting-counter">(0/{{../this.maxAnswerCount}})</span>
+
+                            <div class="w-full mt-6 text-xs text-right sm:mt-12 font-headingSerif sm:text-sm text-gray-scorpion dark:text-text-dark">
+                                {{#if ../this.isMultipleChoice}}
+                                    {{loca "votingform_open_answers_text" ../this.maxAnswerCount}}
+                                {{else}}
+                                    {{loca "votingform_single_answer_text"}}
+                                {{/if}}
+                                <span class="block float-right w-8 js-voting-counter">(0/{{../this.maxAnswerCount}})</span>
+                            </div>
+                            {{> components/forms/components/fields 
+                                    _multipleChoice=../this.isMultipleChoice 
+                                    _addClassGroup="!flex-col mt-2" 
+                                    _addClassChoice="has-[input:checked]:outline outline-2 outline-blue-science-hex bg-white has-[input:disabled]:opacity-50 has-[input:disabled]:cursor-not-allowed" 
+                                    _addClassLabel="w-full !py-3 sm:!py-4 !pr-3 sm:!pr-4 !text-base sm:!text-lg md:!text-lg" 
+                                    _addClassLabelForDataPolicy="font-headingSerif !pt-0 !text-sm !text-gray-dark dark:!text-text-dark"
+                                    _addClassInput="!my-3 sm:!my-4 !ml-3 sm:!ml-4"
+                            }}
+                            {{#if this.is2FSecured}}
+                                <div class="float-left mt-1 text-xs text-gray-scorpion dark:text-text-dark font-headingSerif">{{loca "form_text_required"}}</div>
+                            {{/if}}                            
+                            {{> components/voting/components/voting_submit _label="Abstimmen" _addClass="-inactive js-voting-submit-button"}}
                         </div>
-                        {{> components/forms/components/fields 
-                                _multipleChoice=../this.isMultipleChoice 
-                                _addClassGroup="!flex-col mt-2" 
-                                _addClassChoice="has-[input:checked]:outline outline-2 outline-blue-science-hex bg-white has-[input:disabled]:opacity-50 has-[input:disabled]:cursor-not-allowed" 
-                                _addClassLabel="w-full !py-3 sm:!py-4 !pr-3 sm:!pr-4 !text-base sm:!text-lg md:!text-lg" 
-                                _addClassLabelForDataPolicy="font-headingSerif !pt-0 !text-sm !text-gray-dark dark:!text-text-dark"
-                                _addClassInput="!my-3 sm:!my-4 !ml-3 sm:!ml-4"
-                        }}
-                        {{#if this.is2FSecured}}
-                            <div class="float-left mt-1 text-xs text-gray-scorpion dark:text-text-dark font-headingSerif">{{loca "form_text_required"}}</div>
-                        {{/if}}                            
-                        {{> components/voting/components/voting_submit _label="Abstimmen" _addClass="-inactive js-voting-submit-button"}}
-                    </div>
-                </form>
+                        <script type="text/html" class="js-successMessage">
+                                {{#if this.is2FSecured}}
+                                    {{{include "components/voting/voting_success_2F" _isInline=true _statusDone=true _title=../this.title _topline=../this.topline}}}
+                                {{else}}
+                                    {{{include "components/voting/voting_success" _isInline=true _voteResults=../this.votingResult _statusDone=true _title=../this.title _topline=../this.topline}}}
+                                {{/if}}
+                        </script>
+                        <script type="text/html" class="js-errorMessage">
+                                {{#if this.is2FSecured}}
+                                    {{{include "components/voting/voting_error" _isInline=true _statusDone=error _title=../this.title _topline=../this.topline}}}
+                                {{else}}
+                                    {{{include "components/voting/voting_error" _isInline=true _statusDone=false _title=../this.title _topline=../this.topline}}}
+                                {{/if}}
+                        </script>
+                        {{#unless this.hideVotingResult}}
+                            <script type="text/html" class="js-result">
+                                    {{#unless this.is2FSecured}}
+                                        {{> components/voting/voting_result 
+                                                _resultBoxMessageText=(loca "votingform_already_voted_cookie_hint") 
+                                                _voteResults=../this.votingResult 
+                                                _isResultOnRedirectPage=_isResultOnRedirectPage 
+                                                _isSimpleSecured=../this.isSimpleSecured 
+                                                _statusDone=true 
+                                                _addClass=../_addClass 
+                                                _hideVotingResult=this.hideVotingResult 
+                                                _isVotingOver=this.isVotingOver 
+                                        }}
+                                    {{/unless}}
+                            </script>
+                        {{/unless}}                                                            
+                    </form>
+                </div>
             </div>
-        </div>
-    {{else}}
-        {{> components/voting/voting_result _isVotingOver=true _title=../this.title _topline=../this.topline}}
-    {{/unless}}
-{{/with}}
+        {{else}}
+            {{> components/voting/voting_result _isVotingOver=true _title=../this.title _topline=../this.topline}}
+        {{/unless}}
+    {{/with}}
+{{/components/forms/components/backgroundBox }}

package/dist/views_static/components/voting/voting_error.hbs

@@ -1,6 +1,6 @@
 {{> components/voting/voting_result
-            _title=this.title
-            _topline=this.topline
+            _title=_title
+            _topline=_topline
             _resultBoxMessageTitle=(loca "votingform_title_error")
             _resultBoxMessageText=(loca "votingform_text_error")
             _locaKeyText="votingform_text_error"