Skip to content

Enable to remove old logs on serverlog.html working-example #4996

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mehm8128 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Enable to remove old logs on serverlog.html working-example #4996

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 16 additions & 31 deletions working-examples/aria-role-log/serverlog.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,53 +5,38 @@
<link rel="stylesheet" type="text/css" href="sources.css">
<style>
.scrollable {
height: 10rem;
overflow-y: auto;
height: 10rem;
overflow-y: auto;
}
</style>
</head>
<body>
<script>


function ARIA_Append_Log() {
var d = new Date();
var list = document.createElement("li");
var logContent = document.getElementById('livelog1');
var txt = document.createTextNode([d] + ": Server was rebooted.");
list.appendChild(txt);
logContent.appendChild(list);
}

// function ARIA_Remove_Log() {
// var node = document.getElementById('livelog1');
// node.removeChild(node.firstChild);
// }

var logList = document.getElementById('livelog1');
var listItem = document.createElement("li");
var txt = document.createTextNode([d] + ": Server was rebooted.");
listItem.appendChild(txt);
logList.appendChild(listItem);
if (logList.children.length > 5) {
logList.removeChild(logList.firstChild);
}
}
</script>




<div role="main">
<h1>Using <code>role="log"</code> with server log</h1>
<p>This simple script demonstrates how a log file can have new content surfaced to ATs using the aria <code>log</code> role. The <code>aria-relevant</code> value of "additions" is specified so that entries removed due to log size limitations are ignored (however this is strictly for demonstration purposes since "additions" is the implicit default value). Pressing the Reboot server button causes a time-stamped log entry to be added. For each activation of the button, only the changes will be surfaced by the screen reader due to the implicit <code>aria-atomic="false"</code> value.</p>
<p>This simple script demonstrates how a log file can have new content surfaced to ATs using the aria <code>log</code> role. The <code>aria-relevant</code> value of "additions" is specified so that entries removed due to log size limitations are ignored (however this is strictly for demonstration purposes since "additions" is the implicit default value). Pressing the Reboot server button causes a time-stamped log entry to be added. For each activation of the button, only the changes will be surfaced by the screen reader due to the implicit <code>aria-atomic="false"</code> value.</p>
<hr>
<h2>Log</h2>
<div class="scrollable" role="log">
<ul id="livelog1" aria-relevant="additions">

</ul>

<ul id="livelog1" aria-relevant="additions"></ul>
</div>
<div>
<h2>Mock server action</h2>
<button onClick="ARIA_Append_Log();">Reboot server</button>
<!-- <button onClick="ARIA_Remove_Log();">Remove top log entry</button> -->


<button onClick="ARIA_Append_Log();">Reboot server</button>
</div>
</div>


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