Get updates

Scott Scriptaculous Effect.Squish afterFinish callback fix

Previously as I was using Scriptaculous I ran into a problem with afterFinish on Effect.Squish. This is my solution.

Squirreling away a few minutes after chocolate frosted sugar bombs for breakfast, a few minutes before nighttime reading, I was able to determine the cause of the problem.

Callbacks such as afterFinish get passed to the effect constructor as property definitions. Most effects use Object.extend to copy these properties over to the newly created effect object. In the case of Effect.Squish this copying is simply not implemented and any callbacks passed to the constructor never make it into the new effect object.

Fortunately, implementation is easy. I’ll provide it here while finding out how I can submit it for inclusion to the Scriptaculous codebase. To mix in callbacks passed to the constructor we just need to wrap a portion of the code with Object.extend, just like many of the other effects do:

Effect.Squish = function(element) {
  return new Effect.Scale(element, window.opera ? 1 : 0,
    Object.extend({ restoreAfterFinish: true,
      beforeSetup: function(effect) {
        effect.element.makeClipping(effect.element); },
      afterFinishInternal: function(effect) {
        effect.element.hide(effect.element);
        effect.element.undoClipping(effect.element); }
    }, arguments[1] || {})
  );
}

14 Responses to “Scriptaculous Effect.Squish afterFinish callback fix”

  1. I’ve tried your fix, but it still doesn’t work for me. My afterFinish function call is executed before my effect is finished (in this case Squish as you exampled).

    :(

  2. Chris-

    My first suggestion would be to check your parentheses and brackets carefully. Since I wrote the above fix, the formatting of Effect.Squish code in Scriptaculous seems to have changed a bit.

    Upgrading to the current script.aculo.us 1.7.0 this morning, then applying the Object.extend fix above, I was able to get afterFinish to fire after Effect.Squish completed.

    Though it may be worth noting that, unlike Squish, Effect.Fold still fires afterFinish just before the element is completely gone.

    The other suggestion I can offer is to check your callbacks with simple alert() calls; I say this as the modal alert dialogs essentially freeze script execution while they’re up, and it might be a bit easier to pinpoint when the callback is firing.

    Hope that helps!

  3. Thanks for the fix, but i thinks the fix kills the other parameter, at least while using through rails, i.e. :duration => 1.5 and such are not evaluated anymore.

  4. Michael-

    I’ve been away from Rails for a long time (too long), sorry for the extreme delay in my response.

    If I get the chance I’ll take a look at the problem you describe.

  5. White OG Says:

    I am extremely impressed with your writing skills and also with the layout on your blog. Is this a paid theme or did you customize it yourself? Either way keep up the nice quality writing, it?s rare to see a nice blog like this one these days.. :)

  6. ???

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  7. garage door troubleshooting chamberlain

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  8. toronto garage door

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  9. experienced

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  10. visit my homepage

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  11. door safety month

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  12. garage door spring Pleasanton

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  13. baltimore garage door repair

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

  14. garage door repair Fremont

    Scriptaculous Effect.Squish afterFinish callback fix – Development – 3DM Design

Leave a Reply


Fatal error: Uncaught Error: Call to undefined function show_subscription_checkbox() in /home/dmetro/3dmdesign.com/wp-content/themes/hex_columns/comments.php:90 Stack trace: #0 /home/dmetro/3dmdesign.com/wp-includes/comment-template.php(1471): require() #1 /home/dmetro/3dmdesign.com/wp-content/themes/hex_columns/single.php(65): comments_template() #2 /home/dmetro/3dmdesign.com/wp-includes/template-loader.php(74): include('/home/dmetro/3d...') #3 /home/dmetro/3dmdesign.com/wp-blog-header.php(19): require_once('/home/dmetro/3d...') #4 /home/dmetro/3dmdesign.com/index.php(17): require('/home/dmetro/3d...') #5 {main} thrown in /home/dmetro/3dmdesign.com/wp-content/themes/hex_columns/comments.php on line 90