What's new in the Video Block V2?

1) The form tag block position is now above of the "epg-cards-container-outer" div. (In the current version it's insight)
    This form can be left out, if no tiles videos in a section and/or a user is logged in.

2) If no tiles videos are available in a section, the "epg-cards-container-outer" div can be left out.
    (Therefore no empty script is needed anymore, because the container is left out.)
    (The "epg-cards-container-outer" div is a new div around the "epg-cards-container" div after a litle bugfixing.)

3) If not tiles videos in a section, the "epg-video-block-overlay" div can be left out.

4) The new js files are:
    "epg_video_block_rendering_cards_alternative_v2.min-js"
    "epg_video_block_alternative_v2.min-js"

5) The code position of the js file "epg_video_block_alternative_v2.min-js" is now before the closing "</section>" tag.

You are welcome to decide to use this version 2 in the backend.
It works as well as the current version, but it is technically optimized and in the backend maybe better to handle.

General video block V2 section structure in the video block or in a page with a video section: <!-- Video section START --><!-- Insert this section, if a main video is available or/and tiles videos are available. --> <section class="epg-video-block"><!-- If the user is not logged in, please add the class "epg-blocking-video-playing" for showing auth walls. --> <!-- Video overlay START --> <div class="epg-video-block-overlay"><!-- Left out this div block, if no tiles videos are in this section --> ... Video overlay contents ... </div> <!-- Video overlay END--> <div class="epg-row"> <div class="epg-content-col"> <!-- H2 for the main video START --> <h2><!-- If the h2 has no value, please left out the <h2> block --> Video Page </h2> <!-- H2 for the main video END --> <!-- Main Video START --> <div class="epg-video-card epg-video-main"><!-- Left out this div block, if no main video is not in this section --> ... Main Video contents ... </div> <!-- Main Video END --> <!-- H2 for the tiles videos START --> <h2><!-- If the h2 has no value, please left out the <h2> block --> What's new in CSU? </h2> <!-- H2 for the tiles videos END --> <!-- Form set variables START --> <form class="epg-form-set-variables"><!-- The form must be only inserted, if tiles videos available in this section or/and the user is not logged in --> <!-- Fields for tiles videos START --> <input type="hidden" class="videoBlockShowingStartItems" value=""> <input type="hidden" class="videoBlockSeeMoreItems" value=""> <input type="hidden" class="videoBlockItemsAmount" value=""> <input type="hidden" class="videoBlockShowedItemsAmount" value=""> <!-- Fields for tiles videos END --> <!-- Field for the auth wall register button page START --><!-- Please set the url for the auth wall page --> <input type="hidden" class="videoBlockRegisterPageUrl" value="http://localhost:3000/auth_wall_video_block.html"> <!-- Field for the auth wall register button page END --> </form> <!-- Form set variables END --> <!-- Tiles cards START --> <div class="epg-cards-container-outer"><!-- If tiles videos in a section available, please insert the "epg-cards-container-outer" div block. --> <div class="epg-cards-container epg-cards-json"> <!-- JSON data script START --> <script class="videoBlockJsonData" type="application/json"> { ... JSON DATA ... } </script> <!-- JSON data script END --> <!-- Js file for rendering cards START --> <script src="./static/js/epg_video_block_rendering_cards_alternative_v2.min.js"></script> <!-- Js file for rendering cards END --> </div> <div class="epg-see-more-container"> <a class="epg-see-more"> See more </a> </div> </div> <!-- /Tiles cards END --> </div> </div> <!-- Js file for video playing functions START --> <script src="./static/js/epg_video_block_rendering_cards_alternative_v2.min.js"></script> <script src="./static/js/epg_video_block_alternative_v2.min.js"></script> <!-- Js file for video playing functions END --> </section> <!-- Video section END -->