You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@kafka.apache.org by bb...@apache.org on 2022/08/24 14:57:05 UTC

[kafka] branch 3.3 updated: resolve merge conflict

This is an automated email from the ASF dual-hosted git repository.

bbejeck pushed a commit to branch 3.3
in repository https://gitbox.apache.org/repos/asf/kafka.git


The following commit(s) were added to refs/heads/3.3 by this push:
     new 7de861c9fcb resolve merge conflict
7de861c9fcb is described below

commit 7de861c9fcbab3f83e14a7d05ca04da21cff5d3e
Author: Bill Bejeck <bb...@gmail.com>
AuthorDate: Wed Aug 24 10:45:32 2022 -0400

    resolve merge conflict
---
 .../images/creating-streams-iframe-placeholder.png | Bin 0 -> 54371 bytes
 .../images/intro_to_streams-iframe-placeholder.png | Bin 0 -> 40352 bytes
 .../transforming_part_1-iframe-placeholder.png     | Bin 0 -> 47515 bytes
 .../transforming_part_2-iframe-placeholder.png     | Bin 0 -> 43720 bytes
 docs/streams/index.html                            | 101 +++++++++++++++------
 5 files changed, 73 insertions(+), 28 deletions(-)

diff --git a/docs/images/creating-streams-iframe-placeholder.png b/docs/images/creating-streams-iframe-placeholder.png
new file mode 100644
index 00000000000..479a830760d
Binary files /dev/null and b/docs/images/creating-streams-iframe-placeholder.png differ
diff --git a/docs/images/intro_to_streams-iframe-placeholder.png b/docs/images/intro_to_streams-iframe-placeholder.png
new file mode 100644
index 00000000000..462ec036e2d
Binary files /dev/null and b/docs/images/intro_to_streams-iframe-placeholder.png differ
diff --git a/docs/images/transforming_part_1-iframe-placeholder.png b/docs/images/transforming_part_1-iframe-placeholder.png
new file mode 100644
index 00000000000..e959f0e972f
Binary files /dev/null and b/docs/images/transforming_part_1-iframe-placeholder.png differ
diff --git a/docs/images/transforming_part_2-iframe-placeholder.png b/docs/images/transforming_part_2-iframe-placeholder.png
new file mode 100644
index 00000000000..008ec16bb46
Binary files /dev/null and b/docs/images/transforming_part_2-iframe-placeholder.png differ
diff --git a/docs/streams/index.html b/docs/streams/index.html
index e38b3890af9..5f4ac6a84f9 100644
--- a/docs/streams/index.html
+++ b/docs/streams/index.html
@@ -16,8 +16,24 @@
   <!--#include virtual="../js/templateData.js" -->
 </script>
 <style>
- .video__item{cursor:pointer;}
+    .video__item{cursor:pointer;}
+    .yt__placeholder{display: none;cursor: pointer;}
+    .third-party{display: none;}
 </style>
+<script type="text/javascript">
+    function loadVideo (divId, code, classToAdd) {
+        var videoPlaceholder = document.getElementById(divId);
+        var iframe = document.createElement('iframe');
+        iframe.src="https://www.youtube.com/embed/"+code;
+        iframe.frameborder="0";
+        iframe.allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture";
+        iframe.setAttribute('allowFullScreen', '');
+        iframe.setAttribute('class', 'yt_series yt__placeholder ' + classToAdd);
+        iframe.style="display:block";
+        videoPlaceholder.parentNode.replaceChild(iframe, videoPlaceholder);
+        document.getElementById(classToAdd+'_warn').remove();
+    }
+</script>
 <script id="streams-template" type="text/x-handlebars-template">
   <h1>Kafka Streams</h1>
     <div class="sub-nav-sticky">
@@ -35,33 +51,62 @@
     </div>
     <h3 class="streams_intro">The easiest way to write mission-critical real-time applications and microservices</h3>
        <p class="streams__description">Kafka Streams is a client library for building applications and microservices, where the input and output data are stored in Kafka clusters. It combines the simplicity of writing and deploying standard Java and Scala applications on the client side with the benefits of Kafka's server-side cluster technology.</p>
-       <div class="video__series__grid">
-          <div class="yt__video__block">
-            <div class="yt__video__inner__block">
-                <iframe  class="yt_series video_1 active" style="display:block" src="https://www.youtube.com/embed/Z3JKCLG3VP4?rel=0&showinfo=0&end=602" frameborder="0" allowfullscreen></iframe>
-                <iframe  class="yt_series video_2" src="https://www.youtube.com/embed/LxxeXI1mPKo?rel=0&showinfo=0&end=622" frameborder="0" allowfullscreen></iframe>
-                <iframe  class="yt_series video_3" src="https://www.youtube.com/embed/7JYEEx7SBuE?rel=0&showinfo=0end=557" frameborder="0" allowfullscreen></iframe>
-                <iframe  class="yt_series video_4" src="https://www.youtube.com/embed/3kJgYIkAeHs?rel=0&showinfo=0&end=564" frameborder="0" allowfullscreen></iframe>
-             </div>
-            </div>
-            <div class="video__block">
-                <h3>TOUR OF THE STREAMS API</h3>
-                <div class="video__list">
-                   <p class="video__item video_list_1 active" onclick="$('.video__item').removeClass('active'); $(this).addClass('active');$('.yt_series').hide();$('.video_1').show();">
-                       <span class="video-number">1</span><span class="video__text">Intro to Streams</span>
-                   </p>
-                   <p class="video__item video_list_2" onclick="$('.video__item').removeClass('active'); $(this).addClass('active');$('.yt_series').hide();$('.video_2').show();">
-                       <span class="video-number">2</span><span class="video__text">Creating a Streams Application</span>
-                   </p>
-                   <p class="video__item video_list_3" onclick="$('.video__item').removeClass('active'); $(this).addClass('active');$('.yt_series').hide();$('.video_3').show();">
-                       <span class="video-number">3</span><span class="video__text">Transforming Data Pt. 1</span>
-                   </p>
-                   <p class="video__item video_list_4" onclick="$('.video__item').removeClass('active'); $(this).addClass('active');$('.yt_series').hide();$('.video_4').show();">
-                      <span class="video-number">4</span><span class="video__text">Transforming Data Pt. 11</span>
-                   </p>
-                </div>
-            </div>
-       </div>
+
+  <div class="video__series__grid">
+      <div class="yt__video__block">
+          <div class="yt__video__inner__block">
+              <img id="iframe-placeholder-intro"
+                   border="1px"
+                   class="yt__placeholder video_1"
+                   style="display:block"
+                   src="/{{version}}/images/intro_to_streams-iframe-placeholder.png"
+                   onclick="loadVideo('iframe-placeholder-intro', 'Z3JKCLG3VP4?rel=0&showinfo=0&end=602', 'video_1')"/>
+              <span class="third-party" style="display:block" id="video_1_warn">(Clicking the image will load a video from YouTube)</span>
+
+              <img id="iframe-placeholder-creating"
+                   border="1px"
+                   class="yt__placeholder video_2"
+                   src="/{{version}}/images/creating-streams-iframe-placeholder.png"
+                   onclick="loadVideo('iframe-placeholder-creating', 'LxxeXI1mPKo?rel=0&showinfo=0&end=622', 'video_2')"/>
+              <span class="third-party" id="video_2_warn">(Clicking the image will load a video from YouTube)</span>
+
+              <img id="iframe-placeholder-transforming"
+                   border="1px"
+                   class="yt__placeholder video_3"
+                   src="/{{version}}/images/transforming_part_1-iframe-placeholder.png"
+                   onclick="loadVideo('iframe-placeholder-transforming', '7JYEEx7SBuE?rel=0&showinfo=0end=557', 'video_3')"/>
+              <span class="third-party" id="video_3_warn">(Clicking the image will load a video from YouTube)</span>
+
+              <img id="iframe-placeholder-transforming-two" 
+                   border="1px"
+                   class="yt__placeholder video_4"
+                   src="/{{version}}/images/transforming_part_2-iframe-placeholder.png"
+                   onclick="loadVideo('iframe-placeholder-transforming-two', '3kJgYIkAeHs?rel=0&showinfo=0&end=564', 'video_4')"/>
+              <span class="third-party" id="video_4_warn">(Clicking the image will load a video from YouTube)</span>
+          </div>
+      </div>
+      <div class="video__block">
+          <h3>TOUR OF THE STREAMS API</h3>
+          <div class="video__list">
+              <p class="video__item video_list_1 active"
+                 onclick="$('.video__item').removeClass('active'); $(this).addClass('active');$('.yt__placeholder').hide();$('.video_1').show(); $('.third-party').hide(); $('#video_1_warn').show()">
+                  <span class="video-number">1</span><span class="video__text">Intro to Streams</span>
+              </p>
+              <p class="video__item video_list_2"
+                 onclick="$('.video__item').removeClass('active'); $(this).addClass('active'); $('.yt__placeholder').hide();$('.video_2').show();  $('.third-party').hide(); $('#video_2_warn').show()">
+                  <span class="video-number">2</span><span class="video__text">Creating a Streams Application</span>
+              </p>
+              <p class="video__item video_list_3"
+                 onclick="$('.video__item').removeClass('active'); $(this).addClass('active'); $('.yt__placeholder').hide();$('.video_3').show();  $('.third-party').hide(); $('#video_3_warn').show()">
+                  <span class="video-number">3</span><span class="video__text">Transforming Data Pt. 1</span>
+              </p>
+              <p class="video__item video_list_4"
+                 onclick="$('.video__item').removeClass('active'); $(this).addClass('active'); $('.yt__placeholder').hide();$('.video_4').show();  $('.third-party').hide(); $('#video_4_warn').show()">
+                  <span class="video-number">4</span><span class="video__text">Transforming Data Pt. 2</span>
+              </p>
+          </div>
+      </div>
+  </div>
        <hr class="separator">
        <div class="use-item-section">
            <div class="use__list__sec">