Created
May 25, 2020 13:53
-
-
Save Misko-2083/227b53efa059f888f27bf6135b03b86b to your computer and use it in GitHub Desktop.
yad --html dialog example
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/bash | |
UI=$(cat <<EOF | |
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<style> | |
.body { | |
background-color: #CECECE; | |
} | |
.btn { | |
border: 2px solid black; | |
background-color: white; | |
color: black; | |
padding: 14px 28px; | |
font-size: 16px; | |
cursor: pointer; | |
} | |
/* Green */ | |
.bar { | |
border-color: #4CAF50; | |
color: green; | |
text-decoration: none; | |
} | |
.bar:hover { | |
background-color: #4CAF50; | |
color: white; | |
} | |
/* Blue */ | |
.bl { | |
border-color: #2196F3; | |
color: dodgerblue; | |
text-decoration: none; | |
} | |
.bl:hover { | |
background: #2196F3; | |
color: white; | |
text-decoration: none; | |
} | |
/* Orange */ | |
.bltop { | |
border-color: #ff9800; | |
color: orange; | |
text-decoration: none; | |
} | |
.bltop:hover { | |
background: #ff9800; | |
color: white; | |
text-decoration: none; | |
} | |
/* Red */ | |
.restart{ | |
border-color: #f44336; | |
color: red; | |
text-decoration: none; | |
} | |
.restart:hover { | |
background: #f44336; | |
color: white; | |
} | |
/* Gray */ | |
.default { | |
border-color: #000000; | |
color: black; | |
text-decoration: none; | |
} | |
.default:hover { | |
background: #000000; | |
color: white; | |
text-decoration: none; | |
} | |
</style> | |
<script type="text/javascript"> | |
if (document.addEventListener) { // IE >= 9; other browsers | |
document.addEventListener('contextmenu', function(e) { | |
//here you do nothing on right-click | |
e.preventDefault(); | |
}, false); | |
} else { // IE < 9 | |
document.attachEvent('oncontextmenu', function() { | |
alert("You've tried to open context menu"); | |
window.event.returnValue = false; | |
}); | |
} | |
</script> | |
</head> | |
<body class="body"> | |
<div | |
style="-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;-o-user-select:none;" | |
unselectable="on" | |
onselectstart="return false;" | |
onmousedown="return false;"> | |
<h1>HTML Example</h1> | |
<a href="gg" class="btn bar">About</a> | |
<a href="bb" class="btn bl">List</a> | |
<a href="ee" class="btn bltop">Hmm</a> | |
<br></br> | |
<br></br> | |
<a href="rodrigues" class="btn restart">Rodrigues</a> | |
<a href="txt" class="btn default">Txt</a> | |
</div> | |
</body> | |
</html> | |
EOF | |
) | |
echo "$UI" | stdbuf -oL -eL yad --title="HTML example" \ | |
--width=400 --height=250 \ | |
--html \ | |
--button=gtk-cancel:1 \ | |
--print-uri 2>&1 \ | |
| while read -r line; do | |
case ${line##*/} in | |
gg) | |
yad --about ;; | |
bb) | |
yad --list --column=column hello there ;; | |
ee) | |
yad --text=hmm ;; | |
rodrigues) | |
yad --text=rodrigues ;; | |
txt) | |
echo "text" | yad --text-info ;; | |
*) echo "unknown command" ;; | |
esac | |
done |
Yad needs to be compiled with webkit for HTML dialog to work. Some distros ship yad without html dialogs. There was a switch to webkit2 with yad at some point. I think the library used in compiling is libwebkit2gtk-3.0-dev in Debian.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I'm on yad 7.1. I tried this but just got a blank window

are there any added requirements for this to work?