Javascript returned inside Zone isn't executed (eval?)

[Stephen Nutbrown <st...@gmail.com>]

Hi,

Sorry for asking two questions in as many days but I have become stuck
again. I've done a fair bit of searching and I think I understand the
problem, but I don't know how to fix it.

I have a "DirectoryViewer" component and a "MediaViewer" component
which I created. The directory viewer will show a list of file names.
It has a MediaViewer component inside it which is responsible for
displaying the last selected file. This works fine.

The DirectoryViewer uses a zone for showing the MediaViewer like this:
<t:zone t:id="MediaViewZone" id="MediaViewZone">
    <t:MediaViewer fileToShow="fileToShow"/>
</t:zone>

When a user clicks on a filename link, the fileToShow is updated and
the zone is then also updated:
It looks like this:

Object onActionFromFileSelection(File file) {
    this.fileToShow = file;
    return MediaViewZone.getBody(); // AJAX request, return zone's own body
}

This is fine too. It is important that the whole page does not refresh
between selecting different files as this would be rather irritating.

The MediaViewer then has 3 blocks which are delegated to a method to
check the type of media. At the moment, this can be a text, a pdf or
an image (more later i'm sure). If it is text, it will be pretty
printed (It will be source code of some sort). If it is a pdf, it will
be displayed in an object tag and if it is an image, I would like to
use a javascript library to give zoom functionality etc.

Everything is good until this point, and it's going to get worse if I
don't understand how to fix it.
So when the block selected is a image, the block will be changed
depending on the media type, for an image it looks like this:

     <t:block id="image">

     <section id="focal">
     <h1>Use the mousewheel to zoom on a focal point</h1>
     <div class="parent">
       <div class="panzoom">
        <image src="${FileLink}"/>
       </div>
     </div>

 <div class="buttons">
       <button class="zoom-in">Zoom In</button>
       <button class="zoom-out">Zoom Out</button>
       <input type="range" class="zoom-range"></input>
       <button class="reset">Reset</button>
     </div>
     <script src="${context:layout/js/jquery.mousewheel.run.js}"></script>
   </section>

    </t:block>

That script which is inside the block is sent to the browser, but it
never runs. From what I understand, this is because eval() needs to be
called. If I hit ctrl F5, the script will be loaded and evaluated, and
other than some bugs in my javascript, it works. Looking further I
find links like this:
http://technify.me/user-experience/javascript/executing-javascript-in-an-ajax-response/
which suggest eval() needs to be called.

I see in the prototype documentation something about setting
evalScripts: true, but I have no idea where I would change this in my
application (http://api.prototypejs.org/ajax/Ajax/Updater/).

So I am a bit stuck. Perhaps it is my design (sending js via ajax)
which is bad, or perhaps there is some simple way to do it.

Any help is really appreciated, and, as I am still relatively new to
Tapestry  any comments on anything I have done which I shouldn't be
doing or am doing well, (probably in terms of nesting components like
that) would help massively.

Thanks,

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org

Re: Javascript returned inside Zone isn't executed (eval?)

[Thiago H de Paula Figueiredo <th...@gmail.com>]

On Thu, 22 May 2014 06:14:51 -0300, Stephen Nutbrown <st...@gmail.com>  
wrote:

> Hi,

Hi!

Use JavaScriptSupport.importJavaScriptLibrary(Asset asset) instead. To get  
an asset, use the AssetSource service methods.

-- 
Thiago H. de Paula Figueiredo
Tapestry, Java and Hibernate consultant and developer
http://machina.com.br

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org