Skip to content

Commit 88b9889

Browse files
mdmintzmdmintz
committed
Update the docs
1 parent 1e7af7c commit 88b9889

29 files changed

+4041
-0
lines changed

‎other/404.html‎

Lines changed: 982 additions & 0 deletions
Large diffs are not rendered by default.

‎other/broken_page.html‎

Lines changed: 202 additions & 0 deletions
Large diffs are not rendered by default.

‎other/canvas.html‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
<html lang="en">
2+
<head>
3+
<title>Canvas Testing Page</title>
4+
<meta property="og:site_name" content="Canvas Testing Page">
5+
<meta property="og:title" content="Canvas Testing Page">
6+
<meta name="Description" content="Canvas Testing Page.">
7+
<meta property="og:description" content="Canvas Testing Page.">
8+
<meta name="Keywords" content="Canvas">
9+
<meta property="og:keywords" content="Canvas">
10+
<meta property="og:image" content="https://seleniumbase.io/cdn/img/sb_logo_gs.png">
11+
<meta http-equiv="Content-Type" content="text/html, charset=utf-8">
12+
<meta charset="utf-8">
13+
<meta name="viewport" content="width=device-width, initial-scale=0.5, shrink-to-fit=no">
14+
<meta content="follow,index" name="robots">
15+
<style>canvas { background: teal;} </style>
16+
<style>
17+
#div1,#div2 {
18+
width: 401px;
19+
height: 65px;
20+
padding: 10px;
21+
border: 2px solid #aaaaaa;
22+
}
23+
img:active {
24+
box-shadow: 0px 2px 5px 1px rgba(105, 165, 155, 0.9),
25+
1px 2px 12px 0px rgba(105, 165, 155, 0.6) !important;
26+
}
27+
html {
28+
background-color: #9988ad;
29+
}
30+
html, body {
31+
font-size: 100%;
32+
box-sizing: border-box;
33+
}
34+
body {
35+
background-image: none;
36+
background-origin: padding-box;
37+
background-color: #c6d6f0;
38+
padding: 30;
39+
margin: 10;
40+
font-family: "Proxima Nova","proxima-nova",
41+
"Helvetica Neue",Helvetica,Arial,sans-serif !important;
42+
text-rendering: optimizelegibility;
43+
-moz-osx-font-smoothing: grayscale;
44+
box-shadow: 0px 2px 5px 1px rgba(0, 0, 0, 0.24),
45+
1px 2px 12px 0px rgba(0, 0, 0, 0.18) !important;
46+
}
47+
table {
48+
width: 100%;
49+
border-collapse: collapse;
50+
border-spacing: 0;
51+
}
52+
tbody {
53+
border: 1px solid #e1e1e1;
54+
background-color: #fefefe;
55+
}
56+
</style>
57+
<script async src="https://www.googletagmanager.com/gtag/js?id=G-P5KFWRNLRN"></script>
58+
<script>
59+
window.dataLayer = window.dataLayer || [];
60+
function gtag(){dataLayer.push(arguments);}
61+
gtag('js', new Date());
62+
gtag('config', 'G-P5KFWRNLRN', { cookie_flags: 'SameSite=None;Secure' });
63+
</script>
64+
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-167313767-1"></script>
65+
<script>
66+
window.dataLayer = window.dataLayer || [];
67+
function gtag(){dataLayer.push(arguments);}
68+
gtag('js', new Date());
69+
gtag('config', 'UA-167313767-1', { cookie_flags: 'SameSite=None;Secure' });
70+
</script>
71+
</head>
72+
<body contenteditable="false">
73+
<!-- Tested with SeleniumBase - https://seleniumbase.io -->
74+
<form id="myForm">
75+
<table id="myTable" style="width: 580px; padding: 10px;">
76+
<thead>
77+
<h1>Canvas Testing Page</h1>
78+
</thead>
79+
<tbody id="tbodyId">
80+
<h3>Click on the square in the rectangle:</h3>
81+
<div>
82+
<canvas id="myCanvas" width=600 height=400></canvas>
83+
</div>
84+
</tbody>
85+
</table>
86+
</form>
87+
<script>
88+
const canvas = document.getElementById("myCanvas")
89+
const context = canvas.getContext("2d")
90+
const path = new Path2D()
91+
path.rect(250,150,100,100)
92+
path.closePath()
93+
context.fillStyle = "#FFFFFF"
94+
context.fillStyle = "rgba(225,225,225,0.5)"
95+
context.fill(path)
96+
context.lineWidth = 2
97+
context.strokeStyle = "#000000"
98+
context.stroke(path)
99+
function getXY(canvas, event){
100+
const rect = canvas.getBoundingClientRect()
101+
const y = event.clientY - rect.top
102+
const x = event.clientX - rect.left
103+
return {x:x, y:y}
104+
}
105+
document.addEventListener("click", function (e) {
106+
const XY = getXY(canvas, e)
107+
if(context.isPointInPath(path, XY.x, XY.y)) {
108+
alert("You clicked on the square!")
109+
}
110+
}, false)
111+
</script>
112+
</body>
113+
</html>

‎other/chart_presentation.gif‎

1.31 MB
Loading

0 commit comments

Comments
 (0)