VisualStory/index.html at master · axnow/VisualStory · 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
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <title>Visual History Workbench</title>

    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/vis-history.css">
    <!--    <link rel="stylesheet" href="css/dashboard.css">-->
    <link rel="stylesheet" href="css/timeline-graph.css">


<!--    <script type="text/javascript" src="js/jquery/jquery-3.3.1.js"></script>-->
<!--    <script type="text/javascript" src="js/bootstrap.js"></script>-->
<!--    <script type="text/javascript" src="js/d3.js"></script>-->
</head>

<body>

<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
    <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">Visual History</a>
    <ul class="navbar-nav px-3">
        <li class="nav-item text-nowrap">
            <a class="nav-link" href="#">Sign out</a>
        </li>
    </ul>
</nav>

<div class="container-fluid h-100">
    <div class="row maxw">
        <nav class="col-md-3 col-lg-3 col-xl-2 d-none d-md-block bg-light sidebar">
          <div class="sidebar-sticky">
            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
              Nawigacja
            </h6>
            <ul class="nav flex-column">
              <li class="nav-item">
                <a class="nav-link" href="#" onclick="moveForward()">
                  <span data-feather="file"></span>
                  Do przodu
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#" onclick="moveBackward()">
                  <span data-feather="shopping-cart"></span>
                  Do tyłu
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#" onclick="moveBackward()">
                  <span data-feather="shopping-cart"></span>
                  Reset
                </a>
              </li>
            </ul>

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
              Szczegóły
            </h6>
            <div class="card" id="details-card" hidden="true">
              <div class="card-body">
                <h5 class="card-title" id="details-title">Card title</h5>
                <h6 class="card-subtitle mb-2 text-muted" id="details-subtitle">Card subtitle</h6>
                <p class="card-text" id="details-text">Some quick example text to build on the card title and make up the bulk of the
                  card's content.</p>
                <a href="#" class="card-link" target="_blank" id="details-wikipedia">Wikipedia</a>
              </div>
              </div>
            </div>
        </nav>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-9 col-xl-10 px-4 h-100">
<!--            <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">-->
<!--                <h1 class="h2">Dashboard</h1>-->
<!--                <div class="btn-toolbar mb-2 mb-md-0">-->
<!--                    <div class="btn-group mr-2">-->
<!--                        <button type="button" class="btn btn-sm btn-outline-secondary">Share</button>-->
<!--                        <button type="button" class="btn btn-sm btn-outline-secondary">Export</button>-->
<!--                    </div>-->
<!--                    <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle">-->
<!--                        <span data-feather="calendar"></span>-->
<!--                        This week-->
<!--                    </button>-->
<!--                </div>-->
<!--            </div>-->
            <div class="my-4 w-100" style="height: 100%">
                <svg id="myChart" width="100%" height="100%" style="border-style: solid; border-color:black">
                    <defs>
                        <filter id="shadow">
                            <feDropShadow dx="3" dy="3" stdDeviation="2"/>
                        </filter>
                        <filter id="glow">
                          <feGaussianBlur stdDeviation="2.5" result="coloredBlur"/>
                          <feMerge>
                            <feMergeNode in="coloredBlur"/>
                            <feMergeNode in="SourceGraphic"/>
                          </feMerge>
                        </filter>
                    </defs>
                    <g id="lanes"></g>
                    <g id="mainGroup">
                        <g id="events"></g>
                    </g>
                    <line id="timeAxis" class="timeAxis"></line>
                </svg>
            </div>
            <!--            <h2>Text content</h2>-->
            <!--            <div id="entries"></div>-->
        </main>
    </div>
</div>

<script type="text/javascript" src="dist/bundle.js"></script>
<!--<script type="text/javascript" src="src/vs-model.js"></script>-->
<!--<script type="text/ecmascript" src="src/vs-timeline.js"></script>-->


</body>
</html>