PDA

View Full Version : Need a little help connecting Javascript & Flash


Raster
04-11-2001, 09:15 PM
ok here is the code I have.

<html><head>
<SCRIPT LANGUAGE="JavaScript">

function ClipBoard()
{
Copied = text1.createTextRange();
Copied.execCommand("Copy");
}

</SCRIPT>

</head>
<body>
<TEXTAREA ID="text1">
</TEXTAREA>
<BUTTON onClick="ClipBoard();">Send to clipboard</BUTTON>
</body>
</html>

if you use this code on an HTML page it works the way it is suppose to. but I need to know how I can instead of using the text box it makes, how I can tell the javascript to use a text field in flash. any info would be great.

Thanks

Late

drZoode
04-13-2001, 01:14 PM
execCommand methods are specific for IE 4 and above and they do not work with Netscape browsers. (Also they cause some security issues in IE)
When we copy a text from the HTML and we try to paste it into a text box in Flash we get a square [] or nothing at all. Because Flash movies are implemented as Active-X controls (in IE) or as a plug-in (in Netscape) and the cut and paste commands of the browsers will not work in Flash text boxes. (Flash format is not a *native* format for the browser, like html,txt...)
But I wonder if we can paste a copied text into a Flash text box when Flash movie is implemented as a behavior in IE 5.5? Maybe not.

Raster
04-13-2001, 01:30 PM
Yeah I don't know about that. I have done some checking with Macromedia. Here are two problems. First of all Flash can NOT recognize keystrokes command. I mean the can to a certain extent, but it can't recignize ^c. secondly there is nothing in flash that will send a text field to the clipboard. That's why I was wondering if there was some JavaScript that could do it. Well maybe that's something for the Macromedia Wish list.

Thanks

drZoode
04-14-2001, 01:42 PM
Thank you for the interesiong post Raster. I have read again this thread and I have checked Html Goodies site where there is a similar script and I have found out a solution for IE 4 and above browsers. Using the execCommand Methods, innerText properties and a hidden textarea you can copy the text from Flash to the clipboard.

Here is the url:

http://zoode-ds.hypermart.net/flash/zoodeExperiments/exp_flashToClipBoard.html

Here are the source files:

http://zoode-ds.hypermart.net/flash/zoodeExperiments/expZips/exp_flashToClipBoard.zip

Raster
04-14-2001, 06:25 PM
drZoode, You are the ****ing man. I have been try to figure this out for a long long time. I have even been in contact with Macromedia and they told this would not be possable, thank you very much for the help. One other thing, I don't know a whole lot about JavaScript, but I need to find out if this can be done with NS. not using this command but do you know if NS has a similar command that I can use to make this work???? Any info would be great.

and again thanks for the info.

drZoode
04-14-2001, 11:09 PM
As far as I know, Netscape requires a signed script to give permission to access to the clipboard (for security reasons, and it is the way it should be actually). I have a vague idea that this is done via a Java package, but I will try to gather some info. Flash to clipboard issue is quite interesting, and needs more experimentation.

Raster
04-16-2001, 04:31 PM
ok that code works great except one thing. The text field that I have in the flash module already has text in it, everytime I run the code it clears out my text and does not cpoy it to the clipboard. Do I have to have the other html text field on the page??? also does it make a difference where in the flash the text field is???

Thanks

drZoode
04-17-2001, 03:05 AM
I have found out that in order to copy a text from Flash to to the sytem clipboard we need a visible textarea, if we don't have it, we get an empty string. But in order to copy from clipboard to Flash we don't need a visible textarea (a hidden textarea is enough). This rule applies to the IE4 and above version, but I have written a IE 5 and above version which is much more simple and doesn't require any textareas.

Here is some background info for people interested in this subject.

In the Flash movie we have a dynamic text area with the variable name "text". We copy the clipboard content from and into it.
There is a button (copy) with that action:

on (release) {
var myText = _root.text;
getURL ("JavaScript:flashToClipBoard('"+myText+"'); void(0);");
}

When the button Copy is pressed the text in the dynamic textbox is passed as the argument of our JavaScript function.
I have posted the HTML code here:
//************************************IE4 and above version************************************//
<html>
<head>
<title>Flash To Clipboard</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="Javascript">
<!--
// Flash to Clipboard
// By drZoode ([email protected])
// IE 4 and above specific execCommand methods
// are used to get access to the clipboard
// the innerText property of a hidden textarea (id="hiddenBox")
// is used to manipulate the text range

function flashToClipBoard(flashInput) {
// the argument of this function is passed from Flash
myForm.hiddenBox.innerText = flashInput;
copiedText = myForm.hiddenBox.createTextRange();
copiedText.execCommand("Copy");
pastedText = myForm.pasteHere.createTextRange();
pastedText.execCommand("Paste");
}

function clipBoardToFlash() {
pastedText = myForm.pasteHere.createTextRange();
pastedText.execCommand("Paste");
var goToFlash = myForm.pasteHere.innerText;
// we use a Flash Method to *simulate* the pasting effect
// as this is a IE only exercise we do not care for Netscape friendly syntax
window.movie.SetVariable("_root.text", goToFlash);
}
//-->
</script>
</head>

<body bgcolor="#999999" text="#000000">

<form id="myForm">
<table width="600" border="0" cellspacing="5" cellpadding="5">
<tr>
<td>
<textarea rows="10" cols="50" id="hiddenBox" style="display:none" name="textarea">
</textarea>
</td>
</tr>
<tr>
<td>
<p>The text in the clipboard will appear here.
<br>You can open a text editor program (e.g. Notepad) and paste the text there.</p>
</td>
</tr>
<tr>
<td>
<textarea rows="6" cols="40" id="pasteHere" name="textarea2">
</textarea>
</td>
</tr>
</table>
<br>
<br>
</form>

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
WIDTH=500 HEIGHT=350 ID="movie">
<PARAM NAME=movie VALUE="clipboard.swf"> <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#999999> <EMBED src="clipboard.swf" quality=high bgcolor=#999999 WIDTH=500 HEIGHT=350 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></EMBED>
</OBJECT>
<p> NOTE: If the text you have copied in Flash has carriage returns you cannot copy it back to the clipboard.
<p><b>Here is some text that you can copy to the clipboard</b>
<br>(Choose Edit>Copy or right-click and copy).
<br>
<br>'Twas brillig, and the slithy toves
<br>Did gyre and gimble in the wabe:
<br>All mimsy were the borogoves,
<br>And the mome raths outgrabe.
<br><br>
<button onClick = "clipBoardToFlash()">Paste to Flash </button>
</p>
</body>
</html>
//************************************************** **********************//

If we don't use any form we can omit the id reference of the form in our scripts. The first form (id="pasteHere") is used to display the clipboard content, so you can do without it. flashToClipBoard function works fine when the textarea "hiddenBox" is not displayed.

function flashToClipBoard(flashInput) {
// the argument of this function is passed from Flash
hiddenBox.innerText = flashInput;
copiedText = hiddenBox.createTextRange();
copiedText.execCommand("Copy");
}

But the second function (flashToClipBoard) requires the textarea to be displayed (Style="display:none") will give us an empty string. (We cannot use a hidden textarea for that function)

But if we don't care for IE4.x browsers and we want to write a script for IE 5 and above browsers, things are much more easy for us. Here is the version for IE 5 and above:
(You can use the same Flash movie in that example)
//************************************IE5 and above version************************************//
<html>
<head>
<title>Flash To Clipboard</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="Javascript">
<!--
// Flash to Clipboard - IE 5 and above version
// By drZoode ([email protected])
// this version uses IE 5 and above specific clipboardData object

function flashToClipBoard(flashInput) {
// the argument of this function is passed from Flash
var fromFlash = window.clipboardData.setData('Text', flashInput);
}
function clipBoardToFlash() {
var goToFlash = window.clipboardData.getData('Text');
// we use a Flash Method to *simulate* the pasting effect
// as this is a IE only exercise we do not care for Netscape friendly syntax
window.movie.SetVariable("_root.text", goToFlash);
}
//-->
</script>
</head>

<body bgcolor="#999999" text="#000000">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
WIDTH=500 HEIGHT=350 ID="movie">
<PARAM NAME=movie VALUE="clipboard.swf"> <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#999999> <EMBED src="clipboard.swf" quality=high bgcolor=#999999 WIDTH=500 HEIGHT=350 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></EMBED>
</OBJECT>
<p> NOTE: If the text you have copied in Flash has carriage returns you cannot copy it back to the clipboard.
<p><b>Here is some text that you can copy to the clipboard</b>
<br>(Choose Edit>Copy or right-click and copy).
<br>
<br>'Twas brillig, and the slithy toves
<br>Did gyre and gimble in the wabe:
<br>All mimsy were the borogoves,
<br>And the mome raths outgrabe.
<br><br>
<button onClick = "clipBoardToFlash()">Paste to Flash </button>
</p>
</body>
</html>
//************************************************** **********************

Netscape requires a trusted script to give access to the system clipboard. I have figured out the basic structure of such a script but (as I am not a Java programmer) I couldn't find out the exact syntax to instantiate the Java object and use its methods. Probably it should look like this

<SCRIPT LANGUAGE="JavaScript" ARCHIVE="myArchive.jar" ID="myID">
function getMyClipboard() {
netscape.security.PrivilegeManager.enablePrivilege ("UniversalSystemClipboardAccess");
// **************
// instantiate the Java object and use its methods
// cb = new Packages.java.awt.datatransfer.Clipboard(String);
// myCb = cb.getContents(Object);
//document.write('My clipboard:<BR>'+myCb);
// **************
}
</SCRIPT>

If someone knows the JAVA syntax and can post it here, it would be nice.
It is also interesting that such a widely used browser as Internet Explorer 5.x has such a few security restrictions (regarding the clipboard access).

Raster
04-17-2001, 03:41 AM
I just have one thing to say.... Nice, I really am thankful for all the help with this problem. I have been working on it for a while. if I get the exact syntax I will post it for you. I have already figured out how to hide the text field in NS, and since the text is already being copied to the text field, wouldn't it make sence that all you really need is some javascript for NS to take it from there to the clipboard. Also something I don't know if I told you. The developers at Macromedia said that this couldn't be done. Always fun to prove 'em wrong. ha ha ha Thanks again for the help.

Late