experimanting with youtube

This commit is contained in:
marko
2021-10-29 15:04:48 +02:00
parent f880aa4286
commit 51ec23913b
8 changed files with 72 additions and 5 deletions

View File

@@ -35,6 +35,14 @@ function getCurPagesUrl(){
return $pageURL;
}
function youtubeFrame($ytUrl, $from=NULL, $to=NULL){
// return "<iframe "
// ."src=\"".$ytUrl."\""
// .(!empty($from)?("start=\"".$from."\""):"")
// .(!empty($to)?("end=\"".$to."\""):"")
// ."></iframe>";
return "<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/TE992jTbkek\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>";
}
function htmlCardCode($article, $Parsedown){
if(
empty($article['yaml'])
@@ -63,16 +71,21 @@ return
:""
)
."</div>"
.(
array_key_exists( 'youtube', $article['yaml'])
?("<div class=\"materialboxed\">".youtubeFrame($article['yaml']['youtube']['url'])."</div>")
:""
)
."<div class=\"card-content white-text\">"
."<span class=\"card-title activator\">"
.$article['yaml']['title']
."<i class=\"right\">+</i>"
."<i class=\"material-icons right\">more_vert</i>"
."</span>"
."</div>"
."<div class=\"card-reveal\">"
."<span class=\"card-title\">"
.$article['yaml']['title']
."<i class=\"right\">X</i>"
."<i class=\"material-icons right\">close</i>"
."</span>"
.$Parsedown->text($article['mdText'])
."</div>"
@@ -80,7 +93,6 @@ return
."</div>";
}
?>
<!DOCTYPE html>
<html lang="de">
<head>
@@ -91,6 +103,9 @@ return
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@materializecss/materialize@1.1.0-alpha/dist/css/materialize.min.css">
<!-- Compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/@materializecss/materialize@1.1.0-alpha/dist/js/materialize.min.js"></script>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--- AutoInit -->
<script>
document.addEventListener('DOMContentLoaded', function() {
@@ -106,7 +121,18 @@ return
});
});
</script>
<style>
h1{
font-size: 2.5rem;
}
h2{
font-size: 2.25rem;
}
h3{
font-size: 2.0rem;
}
</style>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<style>
@@ -122,6 +148,7 @@ return
<li><a href="kyu.php?kyu=7">7. Kyu - gelb</a></li>
<li><a href="kyu.php?kyu=6">6. Kyu - gelb-orange</a></li>
<li><a href="kyu.php?kyu=5">5. Kyu - orange</a></li>
<li><a href="kyu.php?kyu=4">5. Kyu - orange-grün</a></li>
</ul>
<a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<?php
@@ -158,7 +185,7 @@ return
};
?>
<footer class="page-footer">
<footer class="page-footer blue-grey darken-1">
<div class="container">
<div class="col l4 offset-l2 s12">
<ul>