Not working in Yosemite Safari (8.0.2)

[tambourine-man]

http://i.imgur.com/mYCOPEg.png

[Warning] platform.js is not the first script on the page. See http://www.polymer-project.org/docs/start/platform.html#setup for details. (platform.js, line 12)
[Error] TypeError: Attempted to assign to readonly property.
(anonymous function) (platform.js, line 16)
(anonymous function) (platform.js, line 16)
global code (platform.js, line 16)
[Warning] Invalid CSS property declaration at: * (foundation.min.css, line 1, x13)
[Error] Error: Attempted to assign to readonly property.
val@http://geelen.github.io/x-gif/demos/angular.min.js:137:424
http://geelen.github.io/x-gif/demos/angular.min.js:138:393
$render@http://geelen.github.io/x-gif/demos/angular.min.js:129:314
http://geelen.github.io/x-gif/demos/angular.min.js:178:431
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:245
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
http://geelen.github.io/x-gif/demos/angular.min.js:57:439
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:372
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
val@http://geelen.github.io/x-gif/demos/angular.min.js:137:424
http://geelen.github.io/x-gif/demos/angular.min.js:138:393
$render@http://geelen.github.io/x-gif/demos/angular.min.js:129:314
http://geelen.github.io/x-gif/demos/angular.min.js:178:431
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:245
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
http://geelen.github.io/x-gif/demos/angular.min.js:57:439
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:372
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
val@http://geelen.github.io/x-gif/demos/angular.min.js:137:424
http://geelen.github.io/x-gif/demos/angular.min.js:138:393
$render@http://geelen.github.io/x-gif/demos/angular.min.js:129:314
http://geelen.github.io/x-gif/demos/angular.min.js:178:431
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:245
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
http://geelen.github.io/x-gif/demos/angular.min.js:57:439
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:372
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
val@http://geelen.github.io/x-gif/demos/angular.min.js:137:424
http://geelen.github.io/x-gif/demos/angular.min.js:138:393
$render@http://geelen.github.io/x-gif/demos/angular.min.js:129:314
http://geelen.github.io/x-gif/demos/angular.min.js:178:431
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:245
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Error: Attempted to assign to readonly property.
http://geelen.github.io/x-gif/demos/angular.min.js:57:439
$digest@http://geelen.github.io/x-gif/demos/angular.min.js:102:372
$apply@http://geelen.github.io/x-gif/demos/angular.min.js:105:180
http://geelen.github.io/x-gif/demos/angular.min.js:18:29
d@http://geelen.github.io/x-gif/demos/angular.min.js:30:525
c@http://geelen.github.io/x-gif/demos/angular.min.js:17:445
Zb@http://geelen.github.io/x-gif/demos/angular.min.js:18:141
Uc@http://geelen.github.io/x-gif/demos/angular.min.js:17:216
http://geelen.github.io/x-gif/demos/angular.min.js:205:217
a@http://geelen.github.io/x-gif/demos/angular.min.js:134:263
http://geelen.github.io/x-gif/demos/angular.min.js:27:212
r@http://geelen.github.io/x-gif/demos/angular.min.js:7:390
c@http://geelen.github.io/x-gif/demos/angular.min.js:27:191
r@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:841
p@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:13:174
n@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:62290
m@https://cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js:12:61868
(anonymous function) (angular.min.js, line 86)
(anonymous function) (angular.min.js, line 63)
$digest (angular.min.js, line 103)
$apply (angular.min.js, line 105)
(anonymous function) (angular.min.js, line 18)
d (angular.min.js, line 30)
c (angular.min.js, line 17)
Zb (angular.min.js, line 18)
Uc (angular.min.js, line 17)
(anonymous function) (angular.min.js, line 205)
a (angular.min.js, line 134)
(anonymous function) (angular.min.js, line 27)
r (angular.min.js, line 7)
c (angular.min.js, line 27)
r (platform.js, line 13)
p (platform.js, line 13)
n (platform.js, line 12)
m (platform.js, line 12)
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (angular.min.js.map, line 0)

[thejae]

It looks like the demo page is having trouble to load in Safari. Seems polymer is broken but it shouldn't affect x-gif if you use it on its own.

[atomantic]

polymer is a deprecated project in favor of https://github.com/webcomponents/webcomponentsjs

I was able to get basic gif rendering support in https://github.com/atomantic/bespoke-theme-atomantic by changing this:

document.write('<script src="https:\/\/cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js"><\/script>')

to

var tag = document.createElement('script');
tag.src = "https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.7.22/webcomponents.min.js";
document.head.appendChild(tag);

however, some behaviors are not quite right. It looks like if the content is hidden when the gif is rendered, it will not play.

load this in Safari to see: http://adameivy.com/bespoke-theme-atomantic/