ASF-Kata-Randomizer/index.html at master · tflucke/ASF-Kata-Randomizer · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE HTML>
<html>
  <head>
    <title>Random Kata Selector</title>
    <style type="text/css">
      li {
	  list-style-type: none;
      }
      .kataClass {
	  font-weight: bold;
      }
    </style>
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="cookie.js"></script>
    <script type="text/javascript">
      $.ajax("kata.json", {
	  success: function (kata) {
	      $(document).ready(function() {
		  printList($("#kataList"), kata);
	      });
	  },
	  error: function() {
	      alert("Error loading kata list.");
	  }
      });

      function printList(parent, list, prefix)
      {
	  for (var i = 0; i < list.length; i++)
	  {
	      if (list[i].isClass)
	      {
		  printKataClass(parent, list[i], prefix);
	      }
	      else
	      {
		  printKata(parent, list[i], prefix);
	      }
	  }
      }

      function printKataClass(parent, cls, prefix)
      {
	  var sublist = $("<ul>");
	  var label = $("<label>")
	      .addClass("kataClass")
	      .text(cls.name)
	      .on("click", function () {
		  var children = sublist.find(".kata");
		  var shouldBeChecked = children.length != sublist.find(".kata:checked").length;
		  children.each(function(index, child) {
		      $(child).prop("checked", shouldBeChecked);
		  });
	      });
	  printList(sublist, cls.kata, (prefix != null? prefix: "") + cls.name + " ");
	  parent.append($("<li>").append(label).append(sublist));
      }

      function printKata(parent, cur, prefix)
      {
	  var name = (prefix != null? prefix: "") + cur.name;
	  var id = nameToId(name);
	  var checkbox = $("<input>")
	      .attr("type", "checkbox")
	      .attr("id", id)
	      .addClass("kata")
	      .data("name", name)
	      .prop("checked", Cookies.get(name) == "true")
	      .on("change", function() {
		  checkLowerKata(name);
		  Cookies.set(name, checkbox.prop("checked"));
	      });
	  var label = $("<label>").text(name).attr("for", id);
	  parent.append($("<li>").append(checkbox).append(label));
      }

      function checkLowerKata(name)
      {
	  if ($("#autocheckLower").prop("checked") > 0 && $("#"+nameToId(name)).prop("checked"))
	  {
	      $(".kata").each(function(index, elm) {
		  if ($(elm).data("name") == name)
		  {
		      return false;
		  }
		  else
		  {
		      $(elm).prop("checked", true);
		      Cookies.set($(elm).data("name"), true);
		  }
	      });
	  }
      }

      function nameToId(name)
      {
	  return name.replace(/\s+/g, "_");
      }

      function pickKata()
      {
	  var known = $(".kata:checked");
	  var selected = $(known[Math.floor(Math.random() * known.length)]);
	  $("#choosenDisplay").text(selected.data("name"));
     }
    </script>
  </head>
  <body>
    <h1 id="choosenDisplay" style="width: 100%; text-align: center;"></h1>
    <input type="checkbox" id="autocheckLower" checked="checked" /><label for="autocheckLower">Auto-check Lower Kata</label>
    <ul id="kataList">
    </ul>
    <button type="button" onclick="pickKata();">Kata!</button>
  </body>
</html>