-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
150 lines (128 loc) · 7.27 KB
/
index.html
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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="accessible">
<!--
***************************** Website Description ************************************
* This website can be used as a template/framework for websites that need to be ready for accessibility.
* Ensure all users feel catered for by using this frame work.
*
'***************************** Bug fixes ***********************************************
* Include web console debugger to easily test if the web browser console is working.
* Fix issue with the website warrior appearing below the main div
*
-->
<head data-session="0xFF31B8">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{{{Data_Placeholder}}}</title>
<script>
dynamicContent = true;
</script>
<!-- Call in the coulors to let people see things better with their eyes -->
<link rel="stylesheet" href="coloursandstuff.css" />
<!-- Please note: Change the year querystring value on New Years Day of each year to correspond with the correct year.
For Chinese people, please refer to documentation -->
<script src="assets/lib/bin/data/17.38/client/js/framework/classes/plugins/f50eb9dc-edb4-4aa9-82d1-24fd8f2d764c.js?mode=non-developer&instance=2019"></script>
<!-- For blind people load the brail framework. Use the bacon configset in da querystring -->
<script src="assets/lib/bin/data/17.38/client/js/framework/classes/plugins/brail.js?parse=true&configset=bacon"></script>
<!-- Load the config -->
<script src="assets/lib/bin/data/17.38/client/js/framework/classes/plugins/global.js"></script>
<!-- Load the config -->
<script src="config.js"></script>
<!-- Load the reference f50eb9dc-edb4-4aa9-82d1-24fd8f2d764c (see documentation) -->
<!-- Load some of the scripts -->
<script src="scriptz.js?id=2347623474632987612098569278">
</script>
</head>
<body>
<!-- Button to allow those with accessibility needs to see how the webpage is constructed -->
<button id="seehowpagemadebutton" class="button" style="float: left; padding: 1rem 3em;">See how the page is made <br> <span>(for advanced developers only)</span></button>
<div style="clear: both;"></div>
<div id="cc0a7c76-be20-446b-bf47-c4a6167b1d8c"></div>
<p id="accessibilitygreatness"></p>
<!-- Script to ensure users really want to visit the website -->
<script>
// Don't bully users into visiting the website, let them have the choice to view the content or not.
var do_you_wish_to_visit_this_website_everyone_should_have_a_choice;
if (ShowPleaseClickOkAcknowledgementMessageToVisitWebsite){
// Show the website if they want to see it
if (confirm("Palease click ok to visit this website")) {
do_you_wish_to_visit_this_website_everyone_should_have_a_choice = "Great, you are now visiting this website.";
//Let the user know they are now visiting the website
document.getElementById("accessibilitygreatness").innerHTML = do_you_wish_to_visit_this_website_everyone_should_have_a_choice;
} else {
// If the user doesnt wish to view the website then no problem, refresh the page to start the notices again to ensure they're not rushed into any rash decisions
window.location.href = window.location.href;
}
}
</script> -->
<!-- This is the main container -->
<div id="content02cOntainer" class="make-text-go-to-the-left-for-fantastic-accessibility">
<!-- This is the content of the main container -->
<h2 class="this-is-for-developer-use-only-dont-show-it active">Main container</h2>
<div id="content02cOntainer" class="make-text-go-to-the-left-for-fantastic-accessibility">
<h1 class="this-is-for-developer-use-only-dont-show-it active">Container</h1>
<div id="content02cOntainer" class="make-text-go-to-the-left-for-fantastic-accessibility">
<h1 class="this-is-for-developer-use-only-dont-show-it active">Another container</h1>
</div>
<div id="content02cOntainer" class="make-text-go-to-the-left-for-fantastic-accessibility">
<h1 class="this-is-for-developer-use-only-dont-show-it active">Another container</h1>
</div>
<div class="thecontent321">
<!-- Add all of your content here -->
<h1 id="pageIdentityManager_a15b644238fc4c06ba2728b3941fb94e">Welcome to the Website</h1>
<span><p class="make-text-go-to-the-left-for-fantastic-accessibility">Looking for a ready made accessible webpage? We know it's not easy to build an accessible website so i've put together this website template to speed up your development proccess.</p></span>
<!-- DO NOT ADD ANY CONTENT AFTER THIS LINE-->
</div>
<div id="content02cOntainer" class="make-text-go-to-the-left-for-fantastic-accessibility">
<h1 class="this-is-for-developer-use-only-dont-show-it active">Another container</h1>
</div>
</div>
</div>
<!-- Create a custom tag for enhanced accessibility -->
<optimise:multithread>
<span>
<div>
<span>
Use the "optimise:multithread" tag to enhance performance. This is quite simple and
increases loading speed for poor internets
</span>
</div>
</span>
</optimise:multithread>
<calibrate:data-protocol>
<!-- PLEASE LEAVE THIS EMPTY. This is required by this framework to initialise the port 80 web data -->
</calibrate:data-protocol>
<accessible-ize:accessibility-object>
<peanut>
<img class="ini-object-staircase" />
</peanut>
</accessible-ize:accessibility-object>
<accessible-ize:accessibility-object>
<peanut id="depression-peanut">
<img class="ini-object-depressed" />
</peanut>
</accessible-ize:accessibility-object>
<accessible-ize:accessibility-object-framework-component-gui-web-frontend-html5-textbox>
<span data-pair="accessible-ize:accessibility-object-framework-component-gui-web-frontend-html5-textbox" id="textbox1">
</span>
</accessible-ize:accessibility-object-framework-component-gui-web-frontend-html5-textbox>
<div class="warrior warrior-amend"><!-- Warrior amend class added to ensure warrior is always visible -->
<img src="https://forums.tomshardware.com/data/avatars/m/2171/2171721.jpg?1550146744"
alt="You are a website warrior, animation of a skeliton wearing a pink hat. The skeliton is blue and holds a sword in his right hand.
He has no left hand and many consider him to also be a website warrior.">
</div>
<script>
// code used to power the website structure button
var helptheblind = document.getElementsByClassName('this-is-for-developer-use-only-dont-show-it active')
var button = document.querySelector('.button')
if (helptheblind) {
button.addEventListener('click', _removeClasses)
}
function _removeClasses() {
helptheblind[0].classList.remove('active')
if (helptheblind[0]) _removeClasses()
}
</script>
</body>
</html>