Disable right click on images?
|
pengi2
Joined: 2006-10-07
Posts: 19 |
Posted: Thu, 2006-10-12 02:58
|
|
I know disabling right click on images is a weak protection measure but anyways I have a request to implement it in gallery 2 integrated with drupal. I've searched the forums here and there were few discussions on the topic, and those that I did find were for gallery 1, lacked details as to where to put the script etc. Can anyone lay it out for me? Thanks |
|
Posts: 14
Hey Hi Pengi,
I've managed to disable right click for G2 which I'm running standalone using Mincel's Carbon theme. I don't know if you're using a theme pack or not, but I added javascript to the gallery2/themes/yourthemehere/templates/theme.tpl file and I did it in the following way:
First, in the theme.tpl file it asks you to make a duplicate of the file and add customizations to that, so I created the directory templates/local and copied theme.tpl to there.
Then, I created a javascript file rightclick.js which contains the following code gleaned freely from cgiscript.net: (The <scipt> tags are commented out for use in the rightclick.js file. If you're putting the javascript in the <head> section of the html, then uncomment those tags)
//<SCRIPT LANGUAGE="Javascript"><!--
// ***********************************************
// AUTHOR: WWW.CGISCRIPT.NET, LLC
// URL: http://www.cgiscript.net
// Use the script, just leave this message intact.
// Download your FREE CGI/Perl Scripts today!
// ( http://www.cgiscript.net/scripts.htm )
// ***********************************************
var isNS = (navigator.appName == "Netscape") ? 1 : 0;
var EnableRightClick = 0;
if(isNS)
document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);
function mischandler(){
if(EnableRightClick==1){ return true; }
else {return false; }
}
function mousehandler(e){
if(EnableRightClick==1){ return true; }
var myevent = (isNS) ? e : event;
var eventbutton = (isNS) ? myevent.which : myevent.button;
if((eventbutton==2)||(eventbutton==3)) return false;
}
function keyhandler(e) {
var myevent = (isNS) ? e : window.event;
if (myevent.keyCode==96)
EnableRightClick = 1;
return;
}
document.oncontextmenu = mischandler;
document.onkeypress = keyhandler;
document.onmousedown = mousehandler;
document.onmouseup = mousehandler;
////-->
//</script>
I placed rightclick.js in the gallery2/themes/yourtheme directory and chmod'd it to 644.
Then, in local/theme.tpl, I added the tag: <script type="text/javascript" src="{g->url href='themes/carbon/rightclick.js'}"></script> in the (* Include this theme's style sheet *) section so that it looks like this:
{* Include this theme's style sheet *}
<link rel="stylesheet" type="text/css" href="{g->theme url="theme.css"}"/>
<script type="text/javascript" src="{g->url href='themes/carbon/theme.js'}"></script>
<script type="text/javascript" src="{g->url href='themes/carbon/rightclick.js'}"></script>
As I said, I'm using the carbon theme so your path would look like: themes/yourthemehere/rightclick.js
Voila! No more right clicking!
Hope this helps,
- Jim de Geus
Posts: 7
This is great, but just one question... is there a way that a message can also pop up stating something to the effect that all images are copy written?
Posts: 4
Hi Jim
I tried to follow this tutorial and failed, I am not really clear with your explainations. the web site I am working on is http://www.jeancharlesgutner.com
I am using carbon, in themes/carbon/templates/local/theme.tpl I have the following code and I have added the line <script type="text/javascript" src="{g->url href='themes/carbon/rightclick.js'}"></script> under the one <script type="text/javascript" src="{g->url href='themes/carbon/theme.js'}"></script>
Rightclick.js is in carbon director and chmod to 644
What I am doing wrong ??
thanks in advance for support
THEME.TPL
{*
* $Revision: 17592 $
* Read this before changing templates! http://codex.gallery2.org/Gallery2:Editing_Templates
*}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="{g->language}" xmlns="http://www.w3.org/1999/xhtml">
<head>
{* Let Gallery print out anything it wants to put into the <head> element *}
{g->head}
{if $theme.pageType == 'album' || $theme.pageType == 'photo'}
<meta name="keywords" content="{$theme.item.keywords}" />
<meta name="description" content="{$theme.item.description|markup:strip}" />
{/if}
{if $theme.pageType != 'admin'}
<script type="text/javascript" src="{g->url href='themes/carbon/theme.js'}"></script>
<script type="text/javascript" src="{g->url href='themes/carbon/rightclick.js'}"></script>
{/if}
{* If Gallery doesn't provide a header, we use the album/photo title (or filename) *}
{if empty($head.title)}
<title>{$theme.item.title|default:$theme.item.pathComponent|markup:strip}</title>
{/if}
{* Include this theme's style sheet *}
<link rel="stylesheet" type="text/css" href="{g->theme url="theme.css"}"/>
</head>
<body class="gallery">
{if !empty($jsWarning)}
{include file="gallery:modules/core/templates/JavaScriptWarning.tpl" l10Domain="modules_core"}
{/if}
<div {g->mainDivAttributes}>
{*
* Some module views (eg slideshow) want the full screen. So for those, we don't draw
* a header, footer, navbar, etc. Those views are responsible for drawing everything.
*}
{if $theme.useFullScreen}
{include file="gallery:`$theme.moduleTemplate`" l10Domain=$theme.moduleL10Domain}
{elseif $theme.pageType == 'progressbar'}
<div id="gsHeader">
{if !empty($theme.params.logoImageLocation)}
<img src="{g->url href=$theme.params.logoImageLocation}" alt=""/>
{else}
<img src="{g->url href="themes/carbon/templates/local/galleryLogo_sm.png"}" width="317" height="88" alt=""/>
{/if}
</div>
{g->theme include="progressbar.tpl"}
{else}
<div id="gsHeader">
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="top" width="50%">
<a href="{g->url href="http://www.jeancharlesgutner.com/"}"...
{if !empty($theme.params.logoImageLocation)}
<img src="{g->url href=$theme.params.logoImageLocation}" alt=""/>
{else}
<img src="{g->url href="themes/carbon/templates/local/galleryLogo_sm.png"}" width="317" height="88" alt=""/>
{/if}
</a>
</td>
<td align="right" valign="top">
{g->theme include="ads.tpl"}
</td>
</tr>
</table>
</div>
<div id="gsNavBar" class="gcBorder1">
<div class="gbSystemLinks">
{if !empty($theme.params.extraLink) && !empty($theme.params.extraLinkUrl)}
<span class="block-core-SystemLink">
<a href="{$theme.params.extraLinkUrl}">{$theme.params.extraLink}</a>
</span>
«
{/if}
{g->block type="core.SystemLinks"
order="core.SiteAdmin core.YourAccount core.Login core.Logout"
separator="«"
othersAt=4}
{if $theme.pageType != 'admin'}
<span class="block-core-SystemLink">
<a href="{g->url params=$theme.pageUrl arg1="jsWarning=true"}"
onclick="toggleSidebar('sidebar'); return false;">{g->text text="Sidebar"}</a>
</span>
{/if}
</div>
<div class="gbBreadCrumb">
{g->block type="core.BreadCrumb" separator="»"}
</div>
</div>
{* Include the appropriate content type for the page we want to draw. *}
{if $theme.pageType == 'album'}
{g->theme include="album.tpl"}
{elseif $theme.pageType == 'photo'}
{g->theme include="photo.tpl"}
{elseif $theme.pageType == 'admin'}
{g->theme include="admin.tpl"}
{elseif $theme.pageType == 'module'}
{g->theme include="module.tpl"}
{/if}
<div id="gsFooter" class="gcBorder1">
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="left" width="50%">
{g->logoButton type="validation"}
{g->logoButton type="gallery2"}
{g->logoButton type="gallery2-version"}
{g->logoButton type="donate"}
</td>
<td align="right">
{strip}
{if !empty($theme.params.copyright)}
{$theme.params.copyright}
{/if}
{/strip}
{g->block type="core.GuestPreview"}
</td>
</tr>
</table>
</div>
{/if} {* end of full screen check *}
</div>
{*
* Give Gallery a chance to output any cleanup code, like javascript that needs to be run
* at the end of the <body> tag. If you take this out, some code won't work properly.
*}
{g->trailer}
{* Put any debugging output here, if debugging is enabled *}
{g->debug}
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-xxxx-x");
pageTracker._trackPageview();
</script>
</body>
</html>