Skip to content

Commit

Permalink
add matomo analytics
Browse files Browse the repository at this point in the history
  • Loading branch information
@deep-gaurav
deep-gaurav committed Jul 19, 2020
1 parent 3db40ea commit 91738fe
Showing 1 changed file with 202 additions and 153 deletions.
355 changes: 202 additions & 153 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bulma.min.css">
<script defer src="font_awesome.js"></script>
<title>Rusty Pipe Front</title>
<!-- <script type="module">

<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bulma.min.css">
<script defer src="font_awesome.js"></script>
<title>Rusty Pipe Front</title>
<!-- <script type="module">
import init, { run } from '/rusty_pipe_front.js';
const start = async() => {
Expand All @@ -16,168 +17,216 @@
start();
</script> -->
<style>
.loaderbg{
height: 100%;
width: 100%;
position: absolute;
}
.spinner{
display: block;
position: fixed;
z-index: 1031; /* High z-index so it is on top of the page */
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
<style>
.loaderbg {
height: 100%;
width: 100%;
position: absolute;
}

.sk-folding-cube {
margin: 20px auto;
width: 40px;
height: 40px;
position: relative;
-webkit-transform: rotateZ(45deg);
transform: rotateZ(45deg);
}
.spinner {
display: block;
position: fixed;
z-index: 1031;
/* High z-index so it is on top of the page */
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.sk-folding-cube .sk-cube {
float: left;
width: 50%;
height: 50%;
position: relative;
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
.sk-folding-cube .sk-cube:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
-webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
animation: sk-foldCubeAngle 2.4s infinite linear both;
-webkit-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
transform-origin: 100% 100%;
}
.sk-folding-cube .sk-cube2 {
-webkit-transform: scale(1.1) rotateZ(90deg);
transform: scale(1.1) rotateZ(90deg);
}
.sk-folding-cube .sk-cube3 {
-webkit-transform: scale(1.1) rotateZ(180deg);
transform: scale(1.1) rotateZ(180deg);
}
.sk-folding-cube .sk-cube4 {
-webkit-transform: scale(1.1) rotateZ(270deg);
transform: scale(1.1) rotateZ(270deg);
.sk-folding-cube {
margin: 20px auto;
width: 40px;
height: 40px;
position: relative;
-webkit-transform: rotateZ(45deg);
transform: rotateZ(45deg);
}

.sk-folding-cube .sk-cube {
float: left;
width: 50%;
height: 50%;
position: relative;
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}

.sk-folding-cube .sk-cube:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
-webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
animation: sk-foldCubeAngle 2.4s infinite linear both;
-webkit-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
transform-origin: 100% 100%;
}

.sk-folding-cube .sk-cube2 {
-webkit-transform: scale(1.1) rotateZ(90deg);
transform: scale(1.1) rotateZ(90deg);
}

.sk-folding-cube .sk-cube3 {
-webkit-transform: scale(1.1) rotateZ(180deg);
transform: scale(1.1) rotateZ(180deg);
}

.sk-folding-cube .sk-cube4 {
-webkit-transform: scale(1.1) rotateZ(270deg);
transform: scale(1.1) rotateZ(270deg);
}

.sk-folding-cube .sk-cube2:before {
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s;
}

.sk-folding-cube .sk-cube3:before {
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;
}

.sk-folding-cube .sk-cube4:before {
-webkit-animation-delay: 0.9s;
animation-delay: 0.9s;
}

@-webkit-keyframes sk-foldCubeAngle {

0%,
10% {
-webkit-transform: perspective(140px) rotateX(-180deg);
transform: perspective(140px) rotateX(-180deg);
opacity: 0;
}
.sk-folding-cube .sk-cube2:before {
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s;

25%,
75% {
-webkit-transform: perspective(140px) rotateX(0deg);
transform: perspective(140px) rotateX(0deg);
opacity: 1;
}
.sk-folding-cube .sk-cube3:before {
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;

90%,
100% {
-webkit-transform: perspective(140px) rotateY(180deg);
transform: perspective(140px) rotateY(180deg);
opacity: 0;
}
.sk-folding-cube .sk-cube4:before {
-webkit-animation-delay: 0.9s;
animation-delay: 0.9s;
}

@keyframes sk-foldCubeAngle {

0%,
10% {
-webkit-transform: perspective(140px) rotateX(-180deg);
transform: perspective(140px) rotateX(-180deg);
opacity: 0;
}
@-webkit-keyframes sk-foldCubeAngle {
0%, 10% {
-webkit-transform: perspective(140px) rotateX(-180deg);
transform: perspective(140px) rotateX(-180deg);
opacity: 0;
} 25%, 75% {
-webkit-transform: perspective(140px) rotateX(0deg);
transform: perspective(140px) rotateX(0deg);
opacity: 1;
} 90%, 100% {
-webkit-transform: perspective(140px) rotateY(180deg);
transform: perspective(140px) rotateY(180deg);
opacity: 0;
}

25%,
75% {
-webkit-transform: perspective(140px) rotateX(0deg);
transform: perspective(140px) rotateX(0deg);
opacity: 1;
}

@keyframes sk-foldCubeAngle {
0%, 10% {
-webkit-transform: perspective(140px) rotateX(-180deg);
transform: perspective(140px) rotateX(-180deg);
opacity: 0;
} 25%, 75% {
-webkit-transform: perspective(140px) rotateX(0deg);
transform: perspective(140px) rotateX(0deg);
opacity: 1;
} 90%, 100% {
-webkit-transform: perspective(140px) rotateY(180deg);
transform: perspective(140px) rotateY(180deg);
opacity: 0;
}
90%,
100% {
-webkit-transform: perspective(140px) rotateY(180deg);
transform: perspective(140px) rotateY(180deg);
opacity: 0;
}
</style>
<style>
/* .body {
}
</style>
<style>
/* .body {
position: relative;
width: 100%;
height: 100%;
} */

.centertag {
position: absolute;

top: 50%;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.toprighttag {
position: absolute;
top: 0%;
right: 0%;
-moz-transform: translateX(-50%) translateY(50%);
-webkit-transform: translateX(-50%) translateY(50%);
transform: translateX(-50%) translateY(50%);
}
.toplefttag {
position: absolute;
top: 0%;
left: 0%;
-moz-transform: translateX(50%) translateY(50%);
-webkit-transform: translateX(50%) translateY(50%);
transform: translateX(50%) translateY(50%);
}
.buffer {
position: absolute;
bottom: 0px;
height: 0.5em;
width: 100%;
}
.buffersegment {
position: absolute;
height: 100%;
}
.centertag {
position: absolute;

top: 50%;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}

.toprighttag {
position: absolute;
top: 0%;
right: 0%;
-moz-transform: translateX(-50%) translateY(50%);
-webkit-transform: translateX(-50%) translateY(50%);
transform: translateX(-50%) translateY(50%);
}

.toplefttag {
position: absolute;
top: 0%;
left: 0%;
-moz-transform: translateX(50%) translateY(50%);
-webkit-transform: translateX(50%) translateY(50%);
transform: translateX(50%) translateY(50%);
}

.buffer {
position: absolute;
bottom: 0px;
height: 0.5em;
width: 100%;
}

.buffersegment {
position: absolute;
height: 100%;
}
</style>

<script src="./native-shim.js"></script>
<script src="./player.ts"></script>
</head>
<body>
<div class="loaderbg has-background-primary">
<div class="spinner">
<div class="sk-folding-cube">
<div class="sk-cube1 sk-cube"></div>
<div class="sk-cube2 sk-cube"></div>
<div class="sk-cube4 sk-cube"></div>
<div class="sk-cube3 sk-cube"></div>
</div>
<script src="./native-shim.js"></script>
<script src="./player.ts"></script>
</head>

<body>
<div class="loaderbg has-background-primary">
<div class="spinner">
<div class="sk-folding-cube">
<div class="sk-cube1 sk-cube"></div>
<div class="sk-cube2 sk-cube"></div>
<div class="sk-cube4 sk-cube"></div>
<div class="sk-cube3 sk-cube"></div>
</div>
</div>
<script src="app/index.ts"></script>
</div>
<script src="app/index.ts"></script>

<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function () {
var u = "//analytics.deepraven.co/";
_paq.push(['setTrackerUrl', u + 'matomo.php']);
_paq.push(['setSiteId', '1']);
var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
g.type = 'text/javascript'; g.async = true; g.defer = true; g.src = u + 'matomo.js'; s.parentNode.insertBefore(g, s);
})();
</script>
<!-- End Matomo Code -->

</body>

</body>
</html>
</html>

1 comment on commit 91738fe

@vercel
Copy link

@vercel vercel bot commented on 91738fe Jul 19, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to following URLs:

Please sign in to comment.