Source

htraf-packaging / demo / index.html

Full commit
<!DOCTYPE html>
<html>
  
<head>
    <title> HTRAF Demo </title>
    <script type="text/javascript" 
            src="../htraf/htraf.js"
            data-htsql-version="2"
            data-htsql-prefix="http://demo.htsql.org">
    </script>
    <link rel="stylesheet" type="text/css" href="css/htraf-02.css"/>
</head>

<body>

<h3>Select a School</h3>
<select id="school"
        data-htsql="/school{code, name}?exists(department)">
</select>
<div style="width: 500px; height: 350px;"
     data-htsql="/program{title, count(student)}
                         ?school_code=$school&count(student)>0"
     data-ref="school"
     data-type="pie"
     data-widget="chart"
     data-title="Percent of Students by Program">
</div>

<h3>Departments</h3>
<p>Filter by name: <input id="department_name"/></p>
<table id="department" data-hide-column-0="yes"
       data-htsql="/department{code, name, school.name}
                              ?school_code=$school&name~$department_name"
       data-ref="school department_name">
</table>
<p>
    The selected department:
    <em data-htsql="/department{name}?code=$department"
        data-ref="department">
    </em>
    <br/>
    The number of courses in the selected department:
    <strong data-htsql="/department{count(course)}?code=$department"
            data-ref="department">
    </strong>
</p>

</body>

</html>