Filter HTML Content with Javascript 2

Tutorial/06 Filter HTML Content with Javascript/__main__.py

@@ -144,15 +144,15 @@ def write_prologue(self):
 """
 
 head = """
-<script src="mixitup.min.js"></script>
 <script src="jquery-3.2.1.min.js"></script>
 <script type="text/javascript">
 {javascript}
 </script>
 """
-#js = """
-#//empty
-#"""
+
+js = """
+//empty
+"""
 
 #js = """
 #$(function(){
@@ -166,43 +166,41 @@ def write_prologue(self):
 
 #js = """
 #$(function(){
-#	var mixer = mixitup('#content')
 #	search = $(".filter-input input[type='search']")
 #	search.keyup(function(){
 #		inputText = search.val().toLowerCase()
-#		matchings = []
 #		$('.mix').each(function() {
 #			if($(this).text().toLowerCase().match(inputText) ) {
-#				matchings.push(this)
+#				$(this).show()
+#			}
+#			else {
+#				$(this).hide()
 #			}
 #		});
-#		mixer.filter(matchings)
 #	})
 #})
 #"""
 
-js = """
-checkY = function(){
-	$('.year').each(function() {
-		if ($("."+$(this).text()+ ".mix").is(":visible")) $(this).show()
-		else $(this).hide()
-	});
-}
-$(function(){
-	var mixer = mixitup('#content')
-	search = $(".filter-input input[type='search']")
-	search.keyup(function(){
-		inputText = search.val().toLowerCase()
-		matchings = []
-		$('.mix').each(function() {
-			if($(this).text().toLowerCase().match(inputText) ) {
-				matchings.push(this)
-			}
-		});
-		mixer.filter(matchings,checkY)
-	})
-})
-"""
+#js = """
+#$(function(){
+#	search = $(".filter-input input[type='search']")
+#	search.keyup(function(){
+#		inputText = search.val().toLowerCase()
+#		$('.mix').each(function() {
+#			if($(this).text().toLowerCase().match(inputText) ) {
+#				$(this).show()
+#			}
+#			else {
+#				$(this).hide()
+#			}
+#		});
+#		$('.year').each(function() {
+#			if ($("."+$(this).text()+ ".mix").is(":visible")) $(this).show()
+#			else $(this).hide()
+#		});
+#	})
+#})
+#"""
 
 head = head.format(javascript= js)
 

Tutorial/06 Filter HTML Content with Javascript/out_1.html

@@ -4,7 +4,6 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 		<title>Bibliography</title>
 
-<script src="mixitup.min.js"></script>
 <script src="jquery-3.2.1.min.js"></script>
 <script type="text/javascript">
 

Tutorial/06 Filter HTML Content with Javascript/out_2.html

@@ -4,7 +4,6 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 		<title>Bibliography</title>
 
-<script src="mixitup.min.js"></script>
 <script src="jquery-3.2.1.min.js"></script>
 <script type="text/javascript">
 

Tutorial/06 Filter HTML Content with Javascript/out_3.html

@@ -4,22 +4,21 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 		<title>Bibliography</title>
 
-<script src="mixitup.min.js"></script>
 <script src="jquery-3.2.1.min.js"></script>
 <script type="text/javascript">
 
 $(function(){
-	var mixer = mixitup('#content')
 	search = $(".filter-input input[type='search']")
 	search.keyup(function(){
 		inputText = search.val().toLowerCase()
-		matchings = []
 		$('.mix').each(function() {
 			if($(this).text().toLowerCase().match(inputText) ) {
-				matchings.push(this)
+				$(this).show()
+			}
+			else {
+				$(this).hide()
 			}
 		});
-		mixer.filter(matchings)
 	})
 })
 

Tutorial/06 Filter HTML Content with Javascript/out_4.html

@@ -4,28 +4,25 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 		<title>Bibliography</title>
 
-<script src="mixitup.min.js"></script>
 <script src="jquery-3.2.1.min.js"></script>
 <script type="text/javascript">
 
-checkY = function(){
-	$('.year').each(function() {
-		if ($("."+$(this).text()+ ".mix").is(":visible")) $(this).show()
-		else $(this).hide()
-	});
-}
 $(function(){
-	var mixer = mixitup('#content')
 	search = $(".filter-input input[type='search']")
 	search.keyup(function(){
 		inputText = search.val().toLowerCase()
-		matchings = []
 		$('.mix').each(function() {
 			if($(this).text().toLowerCase().match(inputText) ) {
-				matchings.push(this)
+				$(this).show()
 			}
+			else {
+				$(this).hide()
+			}
+		});
+		$('.year').each(function() {
+			if ($("."+$(this).text()+ ".mix").is(":visible")) $(this).show()
+			else $(this).hide()
 		});
-		mixer.filter(matchings,checkY)
 	})
 })