diff --git a/flashfire.css b/flashfire.css index 9ca4a38..e739f70 100644 --- a/flashfire.css +++ b/flashfire.css @@ -97,4 +97,44 @@ } .flashfireBlocked .action:hover { opacity: 0.5 !important; +} + +.flashfireContextMenu { + position: absolute !important; + background-color: rgba(255, 255, 255, 0.9) !important; + -webkit-user-select: none !important; + color: #000 !important; + font-size: 14px !important; + z-index: 3 !important; + -webkit-box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3) !important; + list-style: none !important; + border-radius: 4px !important; + padding: 4px 0 !important; + -webkit-transition-property: opacity; + -webkit-transition-duration: 0.15s; + border: 1px solid rgba(0, 0, 0, 0.3); +} + +.flashfireMenuItem { + padding: 2px 16px !important; + -webkit-user-select: none !important; + cursor: default !important; + font-weight: normal !important; + font-family: "Lucida Grande", Helvetica, sans-serif !important; +} +.flashfireMenuItem:hover { + background: -webkit-gradient(linear, left top, left bottom, from(rgb(94, 121, 253)), to(rgb(29, 60, 252))) !important; + color: #fff !important; + padding-top: 1px !important; + padding-bottom: 1px !important; + border-top: 1px solid rgb(84, 122, 244) !important; + border-bottom: 1px solid rgb(16, 39, 242) !important; +} + +.flashfireMenuSeparator { + height: 0 !important; + padding: 0 !important; + margin: 3px 0 2px 0 !important; + border-top: 1px solid rgba(0, 0, 0, 0.1) !important; + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; } \ No newline at end of file diff --git a/flashfire.js b/flashfire.js index 80e8358..57288ee 100644 --- a/flashfire.js +++ b/flashfire.js @@ -36,6 +36,8 @@ function handleBeforeLoadEvent(event) { function unblockElement(event) { var element = event.target; + if (element.className=="action" || element.className=="flashfireContextMenu" || element.className=="flashfireMenuItem" || element.className=="flashfireMenuSeparator") + return; while (element.className!="flashfireBlocked") element = element.parentNode; @@ -50,6 +52,111 @@ function unblockElement(event) { event.preventDefault(); } +function unblockElementById(id) { + var element = document.getElementById("flasfire" + id); + if (element!=null) { + if (element.allowedToLoad) + return; + var blockedElement = elementsBlocked[id]; + blockedElement.allowedToLoad = true; + + element.parentNode.replaceChild(blockedElement, element); + + event.stopPropagation(); + event.preventDefault(); + } +} + +function unblockAllElements() { + for (i=0; i1) { + var loadALlElement = document.createElement("li"); + loadALlElement.className = "flashfireMenuItem"; + loadALlElement.innerHTML = "Load All Flash on this Page"; + loadALlElement.onclick = function() {unblockAllElements();} + menuElement.appendChild(loadALlElement); + } + + var hideElement = document.createElement("li"); + hideElement.className = "flashfireMenuItem"; + hideElement.innerHTML = "Hide Flash"; + hideElement.onclick = function() {hideElementById(elementID);} + menuElement.appendChild(hideElement); + + var separatorElement = document.createElement("li"); + separatorElement.className = "flashfireMenuSeparator"; + menuElement.appendChild(separatorElement); + + var autoLoadElement = document.createElement("li"); + autoLoadElement.className = "flashfireMenuItem"; + autoLoadElement.innerHTML = "Automatically Load Flash on "" + window.location.host + """; + menuElement.appendChild(autoLoadElement); + + document.body.appendChild(menuElement); + + var closeContentMenu = function(event) { + var removeMenuElement = function() { + document.body.removeChild(menuElement); + } + document.getElementsByTagName("body")[0].removeEventListener("mousedown", closeContentMenu, false); + menuElement.style.opacity = "0 !important"; + setTimeout(removeMenuElement, 150); + } + document.body.addEventListener("mousedown", closeContentMenu, false); + + var changePostition = function() { + if (menuElement.offsetWidth>0 && menuElement.offsetWidth>0) { + if ((left+menuElement.offsetWidth+20)>=window.innerWidth) { + menuElement.style.left = left-menuElement.offsetWidth-10 + "px !important"; + document.body.removeChild(menuElement); + document.body.appendChild(menuElement); + } + + if ((top+menuElement.offsetHeight+30)>=window.innerHeight) { + menuElement.style.top = top-menuElement.offsetHeight-10 + "px !important"; + document.body.removeChild(menuElement); + document.body.appendChild(menuElement); + } + } else { + setTimeout(changePostition, 100); + } + }; + changePostition(); + return false; +} + function blockElement(element) { if (element.getAttribute("elementID")!=null) return; @@ -61,11 +168,13 @@ function blockElement(element) { var flashfireBlockedDiv = document.createElement("div"); flashfireBlockedDiv.setAttribute("elementID", elementID); + flashfireBlockedDiv.id = "flasfire" + elementID; flashfireBlockedDiv.style = element.style; flashfireBlockedDiv.style.width = element.offsetWidth + "px"; flashfireBlockedDiv.style.height = element.offsetHeight + "px"; flashfireBlockedDiv.className = "flashfireBlocked"; flashfireBlockedDiv.onclick = unblockElement; + flashfireBlockedDiv.oncontextmenu = displayContextMenu; var flashfireContainerDiv = document.createElement("div"); flashfireContainerDiv.className = "container"; @@ -93,6 +202,7 @@ function blockElement(element) { var flashfireActionDiv = document.createElement("div"); flashfireActionDiv.className = "action"; + flashfireActionDiv.onclick = displayContextMenu; flashfireContainerDiv.appendChild(flashfireActionDiv); setTimeout(function(){element.parentNode.replaceChild(flashfireBlockedDiv, element);}, 5); @@ -107,8 +217,11 @@ function blockElement(element) { flashfireHDiv.style.width = 17; } if ((flashfireBlockedDiv.offsetWidth - 2) <= flashfireHDiv.offsetWidth || (flashfireBlockedDiv.offsetHeight - 17) <= flashfireTextDiv.offsetHeight) { - flashfireHDiv.style.width = "inherit"; flashfireTextContainerDiv.style.display = "none"; + flashfireHDiv.style.width = "inherit"; + } + if ((flashfireBlockedDiv.offsetWidth - 21) <= flashfireActionDiv.offsetWidth || (flashfireBlockedDiv.offsetHeight - 21) <= flashfireActionDiv.offsetHeight) { + flashfireActionDiv.style.display = "none"; } } else { setTimeout(changeSize, 100);