2
   

Adding a JavaScript 'Copy to Clipboard'

Forums: Javascript, Web Development
Email this Topic • Print this Page
 
 
BobbyDouglas
 
Reply Mon 1 Mar, 2004 12:06 am
I am trying to add a button that will "Copy contents to clipboard".

Unfortunately I am not getting the result I want. Any ideas what I should modify/add?

Here is what I am currently working with:
Whoops. Forgot we can't post links, anyways, here is the code (sorry it is rather long) heh:
Code:var DQUOTE = '"';
var APOSTROPHE= "'";
var ATSIGN = "@";
var ANGLEO = "<";
var ANGLEC = ">";
var PLUS = "+";

var strEncrypt;
var txtEncrypt;
var typEncrypt;
var begEncrypt;
var lenEncrypt;
var javEncrypted;
var numArray;
var outLines;


function makeDisplayable(str)
{
i = str.indexOf(DQUOTE);
while (i >= 0)
{
str = str.substr(0,i) + """ + str.substr(i+1);
i = str.indexOf(DQUOTE);
}

i = str.indexOf(APOSTROPHE);
while (i >= 0)
{
str = str.substr(0,i) + "'" + str.substr(i+1);
i = str.indexOf(APOSTROPHE);
}

i = str.indexOf(ANGLEO);
while (i >= 0)
{
str = str.substr(0,i) + "<" + str.substr(i+1);
i = str.indexOf(ANGLEO);
}

i = str.indexOf(ANGLEC);
while (i >= 0)
{
str = str.substr(0,i) + ">" + str.substr(i+1);
i = str.indexOf(ANGLEC);
}

return str;
}

function isEmailChar(ch)
{
if (ch == '-') return 1;
if (ch == '.') return 1;
if (ch == ':') return 1;
if (ch < '0') return 0;
if (ch > 'z') return 0;
if (ch > '9' && ch < 'A') return 0;
if (ch > 'Z' && ch < 'a') return 0;
return 1;
}



function FindEncryptPoint(str)
{
var p1, p2, ln;

typEncrypt = 0;
p1 = str.indexOf(DQUOTE);
if (p1 >= 0)
{
p2 = str.indexOf(DQUOTE, ++p1);
if (p2)
{
ln = p2 - p1;
typEncrypt = 1;
}
else
{
ln = 0;
p1 = -1;
alert("Unpaired double quotes... ");
}
}
else
{
ln = 0;
}
begEncrypt = p1;
lenEncrypt= ln;

//*******************************************

p1 = str.indexOf(ATSIGN);
if (p1 >= 0)
{
p2 = p1;
do
{
p1--;
if (!isEmailChar(str.charAt(p1)))
{
p1++;
break;
}
} while (p1 >= 0);

p2++;
do
{
if (!isEmailChar(str.charAt(p2)))
{
break;
}
} while (++p2 < str.length);

ln = p2 - p1;
if ((begEncrypt < 0) || (begEncrypt > p1))
{
begEncrypt = p1;
lenEncrypt= ln;
typEncrypt = 2;
}
}

//*******************************************

p1 = str.indexOf(ANGLEC);
if (p1)
{
p1++;
p2 = str.indexOf(ANGLEO, p1);
if (p2) ln = p2 - p1;
else ln = str.length() - p1;
if (((begEncrypt < 0) || (begEncrypt > p1)) && ln > 0)
{
begEncrypt = p1;
lenEncrypt= ln;
typEncrypt = 3;
}
}
}



function Encrypt(strEncrypt)
{
javEncrypted = "<script language=\"javascript\" type=\"text/javascript\">\n<!--\n";
outLines = 10;

FindEncryptPoint(strEncrypt);
while (begEncrypt >= 0)
{
if (begEncrypt > 0)
{
javEncrypted += " document.write('" + strEncrypt.substr(0, begEncrypt) + "');\n";
outLines++;
}
txtEncrypt = strEncrypt.substr(begEncrypt, lenEncrypt);

javEncrypted += " var by" + numArray + " = new Array(";
for (i = 0; i < lenEncrypt; i++)
{
if (i > 0) javEncrypted += ",";
if ((i % 10) == 0)
{
javEncrypted += "\n ";
outLines++;
}
c = txtEncrypt.charCodeAt(i);
c = -(c ^ lenEncrypt);
javEncrypted += c;
}

javEncrypted += " );\n";
javEncrypted += " var ix;\n";
javEncrypted += " var ln = by" + numArray + ".length;\n";
javEncrypted += " for (ix = 0; ix < ln; ix++) \n";
javEncrypted += " { document.write('&');\n";
javEncrypted += " document.write('#' + (-by" + numArray + "[ix] ^ ln) + ';'); }\n";
outLines += 5;

strEncrypt = strEncrypt.substr(begEncrypt+ lenEncrypt);
if (typEncrypt == 1)
{
strEncrypt = strEncrypt.substr(1);
javEncrypted += " document.write('" + DQUOTE + "');\n";
outLines++;
}

FindEncryptPoint(strEncrypt);
}
if (strEncrypt.length > 0)
{
javEncrypted += " document.write('" + strEncrypt + "');\n";
outLines++;
}
javEncrypted += "// -->\n</script>\n";
outLines += 2;

if (outLines > 25) outLines = 25;
}


function ProcessEncryption()
{
qs = location.search.substring(1);

i = qs.indexOf("numarray=");
if (i >= 0)
{
numArray = parseInt(qs.substring(i+9));
}
else
{
numArray = 0;
}

i = qs.indexOf("encode=");
value = qs.substring(i+7);

i = value.indexOf("&");
if (i >= 0)
{
value = value.substring(0, i);
}

value = unescape(value);
i = value.indexOf(PLUS);
while (i >= 0)
{
value = value.substr(0,i) + " " + value.substr(i+1);
i = value.indexOf(PLUS);
}
valueDisplay = makeDisplayable(value);
i = value.indexOf(APOSTROPHE);
while (i >= 0)
{
value = value.substr(0,i) + "\\'" + value.substr(i+1);
i = value.indexOf(APOSTROPHE,i+2);
}
Encrypt(value);
numArray++;
document.write ("<table border='0' cellpadding='3' width='80%' align='center'>");
document.write (" <form action='email_encryption_test.php' method='get' name='emailencrypt'>");
document.write (" <tr><td valign='bottom'>");
document.write (" <input type='submit' class='input' name='submit' value='Submit' />");
document.write (" <input name='grab' value='Copy Code' onclick='form.encrypted.focus();form.encrypted.select()' type='button' class='input' />");
document.write (" </td>");
document.write (" <td>");
document.write (" <i>Enter info to encode</i> <br />");
document.write (" <input type='text' class='input' name='encode' size='55' value='");
document.write (valueDisplay);
document.write ("' />  ");
document.write (" <input type='text' class='input' name='numarray' size='3' value='");
document.write (numArray);
document.write ("' />");
document.write (" </td>");
document.write (" </tr>");
document.write (" </form>");
document.write (" <tr><td></td>");
document.write (" <td valign='bottom'>");
document.write (" <form name='encryptedemail'>");
document.write (" <textarea class='input' name='encrypted' rows='" + outLines + "' cols='64'>");
document.write (javEncrypted);
document.write ("</textarea>");
document.write (" </form>");
document.write (" </td>");
document.write (" </tr>");
document.write ("</table>");
}


And to display it:
Code:<html>
<head>
<script src="email.js" type="text/javascript"></script>
</head>

<body>
Please follow the following instructions for this method:
<br>
<script>
<!--
ProcessEncryption();
// -->
</script>
<p>Copy the generated info below and place it in the source code to display the text entered in the first box. Each encrypted piece placed on the same webpage should have a different array encryption name as shown by the var byX = new Array line where X is a numerical value. The numbered box above shows the next array to be created. The value may be modified if needed.</p>
</body>
</html>


Haven't been here for awhile. Sure hope Craven is still around Very Happy
  • Topic Stats
  • Top Replies
  • Link to this Topic
Type: Discussion • Score: 2 • Views: 27,356 • Replies: 21
No top replies

 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 12:25 am
I have a much shorter script for this. It will copy a form textarea to the clipboard.

Script. Place before the textarea.

Code:<SCRIPT language="JavaScript">
<!--
function highlightmetasearch() {
document.post.message.select(); document.FORMNAME.TEXTAREANAME.focus();
}
function copymetasearch() {
highlightmetasearch();
textRange = document.post.message.createTextRange();
textRange.execCommand("RemoveFormat");
textRange.execCommand("Copy");
alert("This post has been copied to your clipboard.\nIf this post is lost when you submit it you can easily repost it.\nAlways use this feature before posting! - \nwww.able2know.com");
}
// -->
</SCRIPT>


Text area that will be copied.

Code:<textarea name="TEXTAREANAME" rows="15" cols="35">Example text</textarea>



Button code.

Displays a button to copy the text for the supported browsers and for others that support highlighting the text it displays a button to highlight the text.

Code: <script language="JavaScript" type="text/javascript">
<!--
if ((navigator.appName=="Microsoft Internet Explorer")&&(parseInt(navigator.appVersion)>=4)) {
document.write('<INPUT type="button" class="button" value="COPY TO CLIPBOARD" onClick="copymetasearch();">');
} else {
document.write('<INPUT type="button" class="button" value="HIGHLIGHT TEXT" onClick="highlightmetasearch();">');
}
// -->
</script>
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 12:46 am
Thanks for the help. I am trying to incorporate that into the script I am already using, so it is making it somewhat complicated.

Code: numArray++;
document.write ("<table border='0' cellpadding='3' width='80%' align='center'>");
document.write (" <form action='email_encryption.php' method='get' name='emailencrypt'>");
document.write (" <tr><td valign='bottom'>");
document.write (" <input type='submit' class='input' name='submit' value='Submit' />");
if ((navigator.appName=="Microsoft Internet Explorer")&&(parseInt(navigator.appVersion)>=4)) {
document.write('<INPUT type="button" class="input" value="Copy" onClick="copymetasearch();">');
} else {
document.write('<INPUT type="button" class="input" value="Copy" onClick="highlightmetasearch();">');
}
document.write (" </td>");
document.write (" <td>");
document.write (" <i>Enter info to encode</i> <br />");
document.write (" <input type='text' class='input' name='encode' size='55' value='");
document.write (valueDisplay);
document.write ("' />  ");
document.write (" <input type='text' class='input' name='numarray' size='3' value='");
document.write (numArray);
document.write ("' />");
document.write (" </td>");
document.write (" </tr>");
document.write (" </form>");
document.write (" <tr><td></td>");
document.write (" <td valign='bottom'>");
document.write (" <form name='encryptedemail'>");
document.write (" <textarea class='input' name='encrypted' rows='" + outLines + "' cols='64'>");
document.write (javEncrypted);
document.write ("</textarea>");
document.write (" </form>");
document.write (" </td>");
document.write (" </tr>");
document.write ("</table>");


It is at mrbobdouglas-com/testing/email_encryption.php if that helps... Confused
0 Replies
 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 01:26 am
It looks like you are trying to do one of the following:

http://search.able2know.com/About/1232.html

http://search.able2know.com/About/1230.html
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 08:40 am
Well.. Basically I am trying to do something like that. But I already have a lot of the code completed- and would prefer to continue to use this method, but just add your nice copy code function.

Just not quite sure where or how to add it.
Maybe it would help if you saw the code I am using inside the preview mode. Any ideas?
0 Replies
 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 10:27 am
The code I posted above is quite simple. It copies a textarea. So as long as your code is using a textarea it doesn't need any script integration.

Just pop the script above the textarea (making sure to change the formname and textarea name in the script).

Then put the button below the textarea. That's it.
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 11:18 am
This is the function that I am trying to put the script(copy to clipboard one you showed) into. Here it is after I tried to add it..

Code:function ProcessEncryption()
{
qs = location.search.substring(1);

i = qs.indexOf("numarray=");
if (i >= 0)
{
numArray = parseInt(qs.substring(i+9));
}
else
{
numArray = 0;
}

i = qs.indexOf("encode=");
value = qs.substring(i+7);

i = value.indexOf("&");
if (i >= 0)
{
value = value.substring(0, i);
}

value = unescape(value);
i = value.indexOf(PLUS);
while (i >= 0)
{
value = value.substr(0,i) + " " + value.substr(i+1);
i = value.indexOf(PLUS);
}
valueDisplay = makeDisplayable(value);
i = value.indexOf(APOSTROPHE);
while (i >= 0)
{
value = value.substr(0,i) + "\\'" + value.substr(i+1);
i = value.indexOf(APOSTROPHE,i+2);
}
Encrypt(value);
numArray++;
document.write ("<table border='0' cellpadding='3' width='80%' align='center'>");
document.write (" <form action='email_encryption.php' method='get' name='emailencrypt'>");
document.write (" <tr><td valign='bottom'>");
document.write (" <input type='submit' class='input' name='submit' value='Submit' />");
document.write (" if ((navigator.appName=='Microsoft Internet Explorer')&&(parseInt(navigator.appVersion)>=4)) {");
document.write ("<INPUT type='button' class='input' value='Copy' onClick='copymetasearch();'>'");
document.write (" } else {
document.write ("<INPUT type="button" class='input' value='Copy' onClick='highlightmetasearch();'>");
document.write (" }
document.write (" </td>");
document.write (" <td>");
document.write (" <i>Enter info to encode</i> <br />");
document.write (" <input type='text' class='input' name='encode' size='55' value='");
document.write (valueDisplay);
document.write ("' /> ");
document.write (" <input type='text' class='input' name='numarray' size='3' value='");
document.write (numArray);
document.write ("' />");
document.write (" </td>");
document.write (" </tr>");
document.write (" </form>");
document.write (" <tr><td></td>");
document.write (" <td valign='bottom'>");
document.write (" <form name='encryptedemail'>");
document.write (" <textarea class='input' name='encrypted' rows='" + outLines + "' cols='64'>");
document.write (javEncrypted);
document.write ("</text>");
document.write (" </form>");
document.write (" </td>");
document.write (" </tr>");
document.write ("</table>");
}
0 Replies
 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 11:27 am
I've given you code above (feel free to take it from the URLs) that works much better so I'll not be working through the bloated code. <shrugs>
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 11:31 am
I would rather not just take it, for I am trying to get better at JavaScript. So far I have gone through a few tutorials on it in some books, learning a few different things here and there.

Thanks for the help. Hopefully someone else will be able to come along and help me try to add it into my code. Thanks again Smile
0 Replies
 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 11:31 am
Well here's one hint. Dynamically writing javascript onto the page with javascript won't work in most cases.

Hardcode the code I gave you above and below twhere that script will be written and it should work.
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 11:39 am
Ok, I will mess around with it some more when I get back home. Hopefully it will work Wink
0 Replies
 
Relative
 
  1  
Reply Mon 1 Mar, 2004 11:46 am
Uhh forgive my ignorance, but what is this encryption useful for?
I mean, if it is client-side script protection, how to use it? Do I paste the javascript I want to protect into the box, click encrypt, and then use the generated code as a _client script_ ?

Or how?
0 Replies
 
Relative
 
  1  
Reply Mon 1 Mar, 2004 12:25 pm
Well looks like it works as described. Nice, thanks.
0 Replies
 
BobbyDouglas
 
  1  
Reply Mon 1 Mar, 2004 02:13 pm
Glad you got it figured out.
If someone else can come help too, this is what I am trying to do...

I am trying to figure out how to include this:
Code:<script language="JavaScript" type="text/javascript">
<!--
if ((navigator.appName=="Microsoft Internet Explorer")&&(parseInt(navigator.appVersion)>=4)) {
document.write('<INPUT type="button" class="button" value="COPY TO CLIPBOARD" onClick="copymetasearch();">');
} else {
document.write('<INPUT type="button" class="button" value="HIGHLIGHT TEXT" onClick="highlightmetasearch();">');
}
// -->
</script>


Inside of this function:

Code: Encrypt(value);
numArray++;
document.write ("<table border='0' cellpadding='3' width='80%' align='center'>");
document.write (" <form action='email_encryption.php' method='get' name='emailencrypt'>");
document.write (" <tr><td valign='bottom'>");
document.write (" <input type='submit' class='input' name='submit' value='Submit' />");
document.write (" </td>");
document.write (" <td>");
document.write (" <i>Enter info to encode</i> <br />");
document.write (" <input type='text' class='input' name='encode' size='55' value='");
document.write (valueDisplay);
document.write ("' />  ");
document.write (" <input type='text' class='input' name='numarray' size='3' value='");
document.write (numArray);
document.write ("' />");
document.write (" </td>");
document.write (" </tr>");
document.write (" </form>");
document.write (" <tr><td></td>");
document.write (" <td valign='bottom'>");
document.write (" <form name='encryptedemail'>");
document.write (" <textarea class='input' name='encrypted' rows='" + outLines + "' cols='64'>");
document.write (javEncrypted);
document.write ("</textarea>");
document.write (" </form>");
document.write (" </td>");
document.write (" </tr>");
document.write ("</table>");
0 Replies
 
Craven de Kere
 
  1  
Reply Mon 1 Mar, 2004 02:40 pm
Don't put it in the same function. Put it in it's own function.

It needs to be called separately.
0 Replies
 
BobbyDouglas
 
  1  
Reply Tue 2 Mar, 2004 09:02 am
Well basically, I put the copy code inside an external js file.
Code:document.write (" <script src='copy.js'><\/script>");


It gives me an error now though saying:
Quote:
'document.post.message' is null or not an object


Is there an easier way to include a js file?
0 Replies
 
Monger
 
  1  
Reply Tue 2 Mar, 2004 10:29 am
BobbyDouglas wrote:
Is there an easier way to include a js file?

Yes:
Code:<script src="copy.js"></script>
0 Replies
 
Craven de Kere
 
  1  
Reply Tue 2 Mar, 2004 10:34 am
Is your form named post?

Is the texarea named message?

Nope. And that's why it's null. Change those values to the name of your form and the name of your textarea.
0 Replies
 
BobbyDouglas
 
  1  
Reply Tue 2 Mar, 2004 02:06 pm
Form name is emailencrypt
Textarea name is encrypted

I get a different error message this time though. Complaining about
1st one:
Line: 32
Char: 55
Error: Unterminated string constant
Code: 0

Line: 31
Char: 3
Error: Object expected
Code: 0

Code:<SCRIPT language="JavaScript">
<!--
function highlightmetasearch() {
document.emailencrypt.encrypted.select(); document.emailencrypt.encrypted.focus();
}
function copymetasearch() {
highlightmetasearch();
textRange = document.emailencrypt.encrypted.createTextRange();
textRange.execCommand("RemoveFormat");
textRange.execCommand("Copy");
alert("This post has been copied to your clipboard.");
}
// -->
</SCRIPT>
0 Replies
 
Craven de Kere
 
  1  
Reply Tue 2 Mar, 2004 06:12 pm
Bobby,

Why are you having the script write out the tables, form etc? What is the purpose of that?
0 Replies
 
 

Related Topics

Javascript language detection :: language based redirection - Discussion by Craven de Kere
Use of undefined functions in javascript - Question by wmstem
How does javascript handle numbers transmitted via POST? - Question by DrewDad
using onchange to a function ot change a form text box value - Question by kernowcoder
How does one uninstall a program? - Question by Woollcott
JavaScript: OnSelect question - Discussion by neocode
NoSpam email javascript link and other no spam tips - Discussion by Craven de Kere
Javascript - Control C textarea script - Discussion by Craven de Kere
Combinatorics - Question by millamber
Baseportal DBMS commands creating popup window using Perl and Javascript. - Question by barygold
 
  1. Forums
  2. » Adding a JavaScript 'Copy to Clipboard'
Copyright © 2024 MadLab, LLC :: Terms of Service :: Privacy Policy :: Page generated in 0.06 seconds on 11/21/2024 at 09:35:06
▲ ▼