[annotator-dev] Annotator + Plugin in IE8

Tue Oct 22 22:38:17 UTC 2013

That's great news, Steph.  Thanks for the update.  If there is anything you
need from the community, please just ask.

Warmly,
Andrew

On Tue, Oct 22, 2013 at 3:27 PM, Steph Skardal <steph at endpoint.com> wrote:

>  After troubleshooting several issues, I've finally got my proof of
> concept working in IE8, FF, and Chrome. Note that several of my issues are
> related to the fact that I am using a custom plugin that requires fields to
> be added to the annotator form. It's possible the plugin works well in IE8
> if you aren't modifying the viewer, except for the first error described
> below.
>
> Here's a full list of the IE8 compatibility issues in case anyone wants to
> try to implement:
> * "Annotator.supported" is a method that examines if the getSelection
> method exists. From my experience, it is evalulated before ierange is
> loaded, so Annotator.supported evaluated as false and did not complete the
> annotator plugin initialization. I commented out the return to get this to
> work:
>        if (!Annotator.supported()) {
> +        //return this;
> -        return this;
>        }
>
> * wrappInner inside the _setupWrapper method failed on an article DOM
> element, but did not fail on a div DOM element. I can only conclude that
> wrapInner may not be compatible with HTML5 elements, but I didn't
> investigate further. I changed my markup to annotate a div instead of an
> article.
>
> * In the addField method, IE8 fails to set the "placeholder" attribute on
> the new field. I commented that out and it worked. I did not experiment
> with how that affected later data, but I'm sure there's a work-around, such
> as setting a data value.
>
> * Also in the addField method, IE8 dies on the call "input[0].type =
> 'checkbox';". I tried calling input.attr('type', 'checkbox'), which IE8
> still didn't like, so instead I modified the input creation logic so that I
> did not have to set the type:
> @@ -1408,19 +1408,19 @@
>            input = $('<textarea />');
>            break;
>          case 'input':
> +          input = $('<input type="text" />');
>          case 'checkbox':
> +          input = $('<input type="checkbox" />');
> -          input = $('<input />');
>            break;
>          case 'select':
>            input = $('<select />');
>        }
>        element.append(input);
>        input.attr({
> +        id: field.id //,
> +        //placeholder: field.label
> -        id: field.id,
> -        placeholder: field.label
>        });
>        if (field.type === 'checkbox') {
> -        input[0].type = 'checkbox';
>
> * Once I got through the above issues, the functionality was working as
> expected, except for some CSS incompatibility issues. rgba is not supported
> in IE8, so I made some modifications to the CSS to set the background and
> highlight color.
>
> The compareDocumentPosition didn't appear to be affect functionality,
> although IE9 in compatibility mode still reports it.
>
> Steph
>
>
>
>
> On 10/21/2013 12:29 PM, Randall Leeds wrote:
>
> The error about compareDocument Position is the first one to tackle. It
> could be causing the other failures.
>
> I would check whether that's supported by IE8 and, if not, what polyfill
> might provide it.
> On Oct 21, 2013 7:30 AM, "Steph Skardal" <steph at endpoint.com> wrote:
>
>>  Hi,
>>
>> I saw Nick's response regarding ierange, but I'm not sure how to verify
>> whether or not IERange is being pulled in. There was nothing in the IE
>> developer tools that indicates issues related to IERange. Can you elaborate
>> on what type of errors are expected if IERange is the source of the problem?
>>
>> Steph
>>
>>
>>
>> On 10/21/2013 09:40 AM, Andrew Magliozzi wrote:
>>
>> Hi Steph and Annotator-Devs,
>>
>>  If memory serves, @Randall offered to help a week or so back.  Also,
>> Nick had some suggestions, reproduced here:
>>
>>
>> Annotator should automatically pull in IERange [1] if it
>> detects a DOM without support for W3C Range [2].
>>
>> [1]: https://code.google.com/p/ierange/
>> [2]:
>>
>> https://github.com/okfn/annotator/blob/2fee8/src/annotator.coffee#L732-L733
>>
>>
>>  For the group, Steph is reporting the following:
>>
>>   In IE8. error "'compareDocumentPosition' is null or not an object".
>> When a user tries to highlight / annotate text in IE8, a number of errors
>> are reported that "'this.viewer.hide' is null or not an object" and
>> "'this.adder' is null or not an object".
>>
>>
>>  Any ideas what's going on or how we could help Steph?  Her plugin code
>> is here: https://github.com/stephskardal/h2o-annotator
>>
>>  Cheers,
>> Andrew
>>
>>
>>
>> On Fri, Oct 18, 2013 at 11:21 AM, Steph Skardal <steph at endpoint.com>wrote:
>>
>>>  Bump. Any help here?
>>>
>>> Thanks,
>>>
>>> Steph
>>>
>>>
>>>
>>>
>>>
>>>
>>> On 10/16/2013 10:50 AM, Steph Skardal wrote:
>>>
>>> Hi all,
>>>
>>> I'm trying to get annotator plus a plugin to work in IE8.
>>>
>>> I've got a proof of concept app up at:
>>> https://github.com/stephskardal/h2o-annotator. The proof of concept is
>>> built to emulate functionality that already exists, but on top of the
>>> annotator plugin. It works as expected in Chrome & Firefox (minus a few
>>> small CSS issues that I plan to fix later). The proof of concept plugin
>>> takes some functionality from the categories plugin in that it adds
>>> additional checkboxes.
>>>
>>> It doesn't work in IE8. When the page loads in IE8, developer tools
>>> reports an error "'compareDocumentPosition' is null or not an object". When
>>> a user tries to highlight / annotate text in IE8, a number of errors are
>>> reported that "'this.viewer.hide' is null or not an object" and
>>> "'this.adder' is null or not an object".
>>>
>>> I don't know if these errors are related to ierange not being pulled in.
>>> Can anyone provide guidance on how to get this working in IE8?
>>>
>>> Thanks,
>>>
>>> Steph
>>>
>>>
>>>
>>> _______________________________________________
>>> annotator-dev mailing list
>>> annotator-dev at lists.okfn.org
>>> http://lists.okfn.org/mailman/listinfo/annotator-dev
>>> Unsubscribe: http://lists.okfn.org/mailman/options/annotator-dev
>>>
>>>
>>
>>
>> _______________________________________________
>> annotator-dev mailing list
>> annotator-dev at lists.okfn.org
>> http://lists.okfn.org/mailman/listinfo/annotator-dev
>> Unsubscribe: http://lists.okfn.org/mailman/options/annotator-dev
>>
>>
>
> _______________________________________________
> annotator-dev mailing list
> annotator-dev at lists.okfn.org
> http://lists.okfn.org/mailman/listinfo/annotator-dev
> Unsubscribe: http://lists.okfn.org/mailman/options/annotator-dev
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.okfn.org/pipermail/annotator-dev/attachments/20131022/675e20df/attachment-0002.html>