I've my code for a custom right-click menu, HTML:
<div class="EnderPage--Menu">
<div action="RTPC">Reload</div>
<!--<div action="DBASC">Cast</div>-->
<div action="DBASP">Print</div>
<div action="VPS">View page source</div>
<!--<div action="EDT">EnderDevelopers Tools</div>-->
</div>
JS:
$(document).bind("contextmenu",function(event){
event.preventDefault();
if(!(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))){
$(".EnderPage--Menu").finish().toggle(100).css({top:event.pageY+"px",left:event.pageX+"px"});
}
});
$(document).bind("mousedown",function(e){
if (!$(e.target).parents(".EnderPage--Menu").length>0){
$(".EnderPage--Menu").hide(100);
}
});
$(".EnderPage--Menu div").click(function(){
$(document).on('keydown', function(event) {
if(event.key == "Escape"){
$(".EnderPage--Menu").hide(100);
}
});
$(".EnderPage--Menu").hide(100);
var EnderMenuACTION = $(this).attr("action");
if(EnderMenuACTION == "RTPC"){
RunURL(window["TheCurrentContent"]);
}
if(EnderMenuACTION == "DBASC"){//failed
//cast.framework.CastReceiverContext.getInstance().start();
}
if(EnderMenuACTION == "DBASP"){
setTimeout(function(){
window.print();
}, 100);
}
if(EnderMenuACTION == "VPS"){
var source = '<!DOCTYPE html>\n<html itemscope="" itemtype="http://schema.org/WebPage" lang="en-US">\n';
source += document.getElementsByTagName('html')[0].innerHTML;
source += "\n</html>";
source = source.replace(/</g, "<").replace(/>/g, ">");
source = "<pre>"+source+"</pre>";
sourceWindow = window.open('','_blank');
sourceWindow.document.write(source);
sourceWindow.document.close();
if(window.focus) sourceWindow.focus();
}
if(EnderMenuACTION == "EDT"){
//I don't know how to code that!
}
});
CSS:
.EnderSelect--Menu div{
padding: 10px;
margin: 8px;
border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
border-radius: 100px;
user-select: none;
}
.EnderSelect--Menu div:hover{
background-color: var(--EnderSelect-HoverColor);
}
.EnderSelect-selected{
background-color: var(--EnderSelect-HoverColor2);
}
.EnderSelect--Menu *{
padding: 0px;
}
.EnderPage--Menu {/* Add a mobile version in full-screen */
position: fixed;
z-index: 99999999999;
background-color: var(--EnderBar-BackgroundColor);
border: 2px solid var(--EnderBar-BorderColor);
border-radius: 15px;
-webkit-box-shadow: 0px 2px 20px 2px var(--EnderBar-ShadowBoxColor);
-moz-box-shadow: 0px 2px 20px 2px var(--EnderBar-ShadowBoxColor);
box-shadow: 0px 2px 20px 2px var(--EnderBar-ShadowBoxColor), 0px 0px 0px 4px var(--EnderBar-ShadowColor);
height: fit-content;
width: fit-content;
max-height: 60vh;
color: var(--EnderBar-TextColor);
overflow: hidden;
content: none;
display:none;
}
.EnderPage--Menu div {
padding: 14px 10px;
transition: all 0.1s ease-in;
user-select: none;
}
.EnderPage--Menu div:hover {
background-color: var(--EnderSelect-HoverColor);
}
I want to code all of the normal right-click menu functionalities in my own custom menu, But I don't seem to be able to get any code to open the developer console, to cast my website content, or to save the current opened page code in a file for the user. Are these things possible to code in JavaScript/jQuery or what?
Aucun commentaire:
Enregistrer un commentaire