cef/tests/cefclient/resources/dialogs.html

112 lines
3.6 KiB
HTML
Raw Normal View History

<html>
<head>
<title>Dialog Test</title>
<style>
#loading {
display: inline-block;
width: 10px;
height: 10px;
border: 3px solid rgba(0,0,0,.3);
border-radius: 50%;
border-top-color: #000;
animation: spin 1s ease-in-out infinite;
-webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
to { -webkit-transform: rotate(360deg); }
}
</style>
<script>
function show_alert() {
alert("I am an alert box!");
}
function show_confirm() {
var r = confirm("Press a button");
var msg = r ? "You pressed OK!" : "You pressed Cancel!";
document.getElementById('cm').innerText = msg;
}
function show_prompt() {
var name = prompt("Please enter your name" ,"Harry Potter");
if (name != null && name != "")
document.getElementById('pm').innerText = "Hello " + name + "!";
}
window.onbeforeunload = function() {
return 'This is an onbeforeunload message.';
}
function update_time() {
document.getElementById('time').innerText = new Date().toLocaleString();
}
function setup() {
update_time();
setInterval(update_time, 1000);
if (location.hostname != 'tests' && location.hostname != 'localhost') {
alert('Parts of this page can only be run from tests or localhost.');
return;
}
// Enable all elements.
var elements = document.getElementById("form").elements;
for (var i = 0, element; element = elements[i++]; ) {
element.disabled = false;
}
}
function show_file_dialog(element, test) {
var message = 'DialogTest.' + test;
var target = document.getElementById(element);
// Results in a call to the OnQuery method in dialog_test.cpp
window.cefQuery({
request: message,
onSuccess: function(response) {
target.innerText = response;
},
onFailure: function(error_code, error_message) {}
});
}
window.addEventListener('load', setup, false);
</script>
</head>
<body bgcolor="white">
<form id="form">
Click a button to show the associated dialog type.
<br/><input type="button" onclick="show_alert();" value="Show Alert">
<br/><input type="button" onclick="show_confirm();" value="Show Confirm"> <span id="cm"></span>
<br/><input type="button" onclick="show_prompt();" value="Show Prompt"> <span id="pm"></span>
Use Chrome file dialogs on all platforms and runtimes (fixes issue #3314) All file dialogs irrespective of source, platform and runtime will now be routed through CefFileDialogManager and trigger CefDialogHandler callbacks (see issue #3293). Adds Chrome runtime support for CefBrowserHost::RunFileDialog and CefDialogHandler callbacks. Adds Alloy runtime support for internal GTK file and print dialogs on Linux subject to the following limitations: 1. Internal GTK implementation: - Cannot be used with multi-threaded-message-loop because Chromium's internal GTK implementation is not thread-safe (does not use GDK threads). - Dialogs will not be modal to application windows when used with off-screen rendering due to lack of access to the client's top-level GtkWindow. 2. Cefclient CefDialogHandler implementation: - Cannot be used with Views because it requires a top-level GtkWindow. Due to the above limitations no dialog implementation is currently provided for Views + multi-threaded-message-loop on Linux. In cases where both implementations are supported the cefclient version is now behind an optional `--use-client-dialogs` command-line flag. Expressly forbids multiple simultaneous file dialogs with the internal platform implementation which uses modal dialogs. CefDialogHandler will still be notified and can optionally handle each request without a modal dialog (see issue #3154). Removes some RunFileDialog parameters that are not supported by the Chrome file dialog implementation (selected_accept_filter parameter, cef_file_dialog_mode_t overwrite/read-only flags).
2022-04-15 21:55:23 +02:00
<br/>input type="file" (.png): <input type="file" name="pic" accept=".png">
<br/>input type="file" (image/*): <input type="file" name="pic" accept="image/*">
<br/>input type="file" (multiple types): <input type="file" name="pic" accept="text/*,.js,.css,image/*">
<br/>input type="file" (directory): <input type="file" webkitdirectory accept="text/*,.js,.css,image/*">
Use Chrome file dialogs on all platforms and runtimes (fixes issue #3314) All file dialogs irrespective of source, platform and runtime will now be routed through CefFileDialogManager and trigger CefDialogHandler callbacks (see issue #3293). Adds Chrome runtime support for CefBrowserHost::RunFileDialog and CefDialogHandler callbacks. Adds Alloy runtime support for internal GTK file and print dialogs on Linux subject to the following limitations: 1. Internal GTK implementation: - Cannot be used with multi-threaded-message-loop because Chromium's internal GTK implementation is not thread-safe (does not use GDK threads). - Dialogs will not be modal to application windows when used with off-screen rendering due to lack of access to the client's top-level GtkWindow. 2. Cefclient CefDialogHandler implementation: - Cannot be used with Views because it requires a top-level GtkWindow. Due to the above limitations no dialog implementation is currently provided for Views + multi-threaded-message-loop on Linux. In cases where both implementations are supported the cefclient version is now behind an optional `--use-client-dialogs` command-line flag. Expressly forbids multiple simultaneous file dialogs with the internal platform implementation which uses modal dialogs. CefDialogHandler will still be notified and can optionally handle each request without a modal dialog (see issue #3154). Removes some RunFileDialog parameters that are not supported by the Chrome file dialog implementation (selected_accept_filter parameter, cef_file_dialog_mode_t overwrite/read-only flags).
2022-04-15 21:55:23 +02:00
<br/><input type="button" onclick="show_file_dialog('fop', 'FileOpenPng');" value="Show File Open (.png)" disabled="true"> <span id="fop"></span>
<br/><input type="button" onclick="show_file_dialog('foi', 'FileOpenImage');" value="Show File Open (image/*)" disabled="true"> <span id="foi"></span>
<br/><input type="button" onclick="show_file_dialog('fom', 'FileOpenMultiple');" value="Show File Open (multiple types/files)" disabled="true"> <span id="fom"></span>
<br/><input type="button" onclick="show_file_dialog('fof', 'FileOpenFolder');" value="Show File Open Folder" disabled="true"> <span id="fof"></span>
<br/><input type="button" onclick="show_file_dialog('fs', 'FileSave');" value="Show File Save" disabled="true"> <span id="fs"></span>
</form>
Observe page responsiveness:
<br/><br/>
<table><tr>
<td valign="top">
CSS:<br/><div id="loading"></div>
</td>
<td>&nbsp;</td>
<td valign="top">
JavaScript:<br/><div id="time"></div>
</td>
</tr></table>
(JavaScript will stop updating while alert/confirm/prompt is displayed)
</body>
</html>