According to issue 7731 on chromium, the cause of this problem is that Webkit is more strict — the onload event is only triggered the first time the image is loaded. So the issue was the onload event triggered immediately when the modal window was shown — it triggered before the image was displayed (except for the first time). This is a tricky thing to work around. I verified that this was my issue by appending to the image URL the current timestamp (so + ‘?’ + new Date().getTime()) in order to force the browser to reload the image each time. That did fix the problem but it also introduced UI lag as the image had to be fetched each time a crop was attempted.

I put in this short term fix: put my JCrop initialization code in a function named crop and then (still bound to the load event), attempt to initialize it. If the image isn’t loaded, try again in 25ms up to 5 times. I can tell if the image is loaded by checking for a height > 0. The code:

    $('#cropbox').load(function (event) {
        var boxHeight = Math.floor($('#crop').closest('.ui-dialog').height() * 0.8);

        var $img = $(event.target);
        var productDiv = $('div#' + id);
        var sku = $('div.sku', productDiv).text();
        var product = productsData[sku];
        var height, width;

        // put crop loading code into function -- see comment below about chrome hack
        var crop = function () {
            height = $img.height();
            width = $img.width();

            var jcrop = $.Jcrop(
                ...
                });

            ...
        }

        // Ugly hack for chrome -- the load event triggers before the image is actually displayed/in DOM
        // but only on crop attempts after the initial one. One way to detect this is to check if the image
        // height is 0 -- if so, retry.
        // Update: issue probably this: http://code.google.com/p/chromium/issues/detail?id=7731#c12

        var worked = false;
        var attempts = 0;
        var attempt = function () {
            if (worked) return;

            height = $img.height();
            if (typeof height === 'number' && height > 0) {
                crop();
                worked = true;
            }
            else {
                attempts++;
                if (attempts < 5) {
                    // try again in 25 milliseconds
                    setTimeout(attempt, 25);
                }
                else {
                    alert('Bug with cropping image.');
                }
            }
        }

        attempt();
    });

I reported this problem in issue 63 for the JCrop plugin. Hopefully, there is a better way to do this however if you need a quick work around now...

        public static int PercentComplete(this ModelStateDictionary modelStateDictionary, int? ScalePercentWithValueAsZero = null, int? MaxValue = 100)
        {
            int totalItems = 0;
            int validItems = 0;
            int percentComplete = 0;

            if (MaxValue.HasValue && (MaxValue.Value < 0 || MaxValue.Value > 100))
                throw new ArgumentOutOfRangeException("MaxValue must between 0 and 100!");

            if (modelStateDictionary.IsValid)
            {
                percentComplete = MaxValue.Value;
            }
            else
            {
                foreach (var item in modelStateDictionary)
                {
                    totalItems++;
                    if (item.Value.Errors.Count == 0)
                        validItems++;
                }

                if (totalItems > 0)
                    percentComplete = (100 * validItems) / totalItems;

                if (ScalePercentWithValueAsZero.HasValue)
                {
                    if (ScalePercentWithValueAsZero.Value >= percentComplete)
                    {
                        percentComplete = 0;
                    }
                    else
                    {
                        percentComplete = Convert.ToInt32(Math.Ceiling((double)(percentComplete - ScalePercentWithValueAsZero.Value) / (100 - ScalePercentWithValueAsZero.Value) * 100));
                    }
                }

                if (MaxValue.HasValue)
                {
                    percentComplete = percentComplete * MaxValue.Value / 100;
                }
            }

            return percentComplete;
        }

And if a model has a particularly complicated percentage complete calculation in which one needs to manually check some things and add to the total that can be done:

        public int CustomPercentComplete(Func<int?, int?, int> PercentComplete)
        {
            // scale percent complete 50-100% as 0-100%
            int basePercentAsZero = 50;

            // actually, scale 50-100% as 0-91%
            int max = 91;            

            // call default PercentComplete
            int percentComplete = PercentComplete(basePercentAsZero, max);

            // implement here your custom percente complete for the remaining 9%

            return percentComplete;
        }

An example of calling the custom percentage complete calculator on your model:

        myModelInstance.CustomPercentComplete(ModelState.PercentComplete);

And if you need to call either calculator but your controller action doesn’t bind to an instance of the model you need to calculate the percentage on, you can add a method in your controller like this one (hopefully there is a better way — let me know if you know of one):

        // Work around for getting percentage complete when in another action where the model is not the application
        // like so:
        // int percentComplete = MyPercentComplete(application);
        private int MyPercentComplete(MyApplication application)
        {
            return Convert.ToInt32(MyPercentCompleteAction(application).Content);
        }

        // Work around for getting percentage complete when in another action where the model is not the application
        // like so:
        // int percentComplete = Convert.ToInt32(MyPercentComplete(application).Content);
        private ContentResult MyPercentCompleteAction(MyApplication application)
        {
            return Content(application.CustomPercentComplete(ModelState.PercentComplete).ToString());
        }

The code is published on github as PHPGatewayInterface.

• The Regex Coach – windows desktop
• Regex Powertoy – windows desktop
• strfriend.com – web regex to graphical view (SVG)
• regex-graph – web regex to graphical view (PNG)
• quanetic.com/Regex – web regular expression tester
• regexpal.com – web
• jsregex.com – web

$error, $hash = function_a( ... );
if ( $error ) { error(); }    // never runs

Correction:

($error, $hash) = function_a( ... );
if ( $error ) { error(); }    // runs on error