simpla-article-toolbar.html

<link rel="import" href="../polymer/polymer.html"> <link rel="import" href="../simpla-styles/simpla-styles.html"> <link rel="import" href="../iron-iconset-svg/iron-iconset-svg.html"> <link rel="import" href="../iron-icon/iron-icon.html" async> <iron-iconset-svg name="simpla-article-toolbar"> <svg> <defs> <g id="format-bold"><path d="M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z"/></g> <g id="format-italic"><path d="M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z"/></g> <g id="format-quote"><path d="M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z"/></g> <g id="format-size"><path d="M9 4v3h5v12h3V7h5V4H9zm-6 8h3v7h3v-7h3V9H3v3z"/></g> <g id="insert-link"><path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/></g> <g id="add-a-photo"><path d="M3 4V1h2v3h3v2H5v3H3V6H0V4h3zm3 6V7h3V4h7l1.83 2H21c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H5c-1.1 0-2-.9-2-2V10h3zm7 9c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-3.2-5c0 1.77 1.43 3.2 3.2 3.2s3.2-1.43 3.2-3.2-1.43-3.2-3.2-3.2-3.2 1.43-3.2 3.2z"/></g> <g id="vertical-align-bottom"><path d="M16 13h-3V3h-2v10H8l4 4 4-4zM4 19v2h16v-2H4z"/></g> <g id="vertical-align-center"><path d="M8 19h3v4h2v-4h3l-4-4-4 4zm8-14h-3V1h-2v4H8l4 4 4-4zM4 11v2h16v-2H4z"/></g> <g id="vertical-align-top"><path d="M8 11h3v10h2V11h3l-4-4-4 4zM4 3v2h16V3H4z"/></g> </defs> </svg> </iron-iconset-svg> <dom-module id="simpla-article-toolbar"> <template> <style>*,::after,::before,:host{box-sizing:border-box}:host{--iron-icon-width:var(--simpla-scale-0);--iron-icon-height:var(--simpla-scale-0);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}.toolbar{display:none;font-size:var(--simpla-scale-0);z-index:var(--simpla-on-top)}.toolbar[visible]{display:flex}.bar{background:var(--simpla-grey-700);color:#fff;border-radius:var(--simpla-border-radius)}.bar__tool{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;padding:.4em .5em;border-bottom:2px solid transparent}.bar__tool:focus{outline:0}.bar__tool[active]{border-color:var(--simpla-primary-color);color:var(--simpla-primary-color)}.bar--range{overflow:hidden}.bar__tool--range{transition:margin-left 150ms var(--simpla-easing-standard),padding 150ms var(--simpla-easing-standard),opacity 50ms ease}.range__link{font-family:var(--simpla-font-family);font-size:var(--simpla-scale-000);color:#fff;outline:0;border:0;width:0;padding:0;background:0 0;transition:width 150ms var(--simpla-easing-standard),padding 150ms var(--simpla-easing-standard)}.range__link::-webkit-input-placeholder{color:var(--simpla-med-white)}.range__link:-ms-input-placeholder{color:var(--simpla-med-white)}.range__link::placeholder{color:var(--simpla-med-white)}.bar--range[data-link-active] .range__link{width:12em;padding:0 .5em}.bar--range[data-link-active] .bar__tool:not(.bar__tool--range-link){opacity:0;margin-left:-1em;padding-left:0;padding-right:0}.newline{color:var(--simpla-grey-700);transition:color .1s ease;margin-right:.5em;cursor:pointer;padding-bottom:.3em}.newline:hover{color:var(--simpla-text-color)}.bar__tool--image iron-icon{transform:rotate(-90deg)}iron-icon{pointer-events:none}[hidden]{display:none!important}</style> <div class="toolbar bar bar--range" data-context="range" visible$="[[_isContext(&apos;range&apos;, context)]]" data-link-active$="[[_rangeLinkActive]]"> <a data-format="bold" class="bar__tool bar__tool--range" on-tap="_format" active$="[[state.bold.applied]]" hidden$="[[!state.bold.applicable]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:format-bold"> </iron-icon> </a> <a data-format="italic" class="bar__tool bar__tool--range" on-tap="_format" active$="[[state.italic.applied]]" hidden$="[[!state.italic.applicable]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:format-italic"> </iron-icon> </a> <a data-format="heading" class="bar__tool bar__tool--range" on-tap="_formatHeading" active$="[[state.heading.applied]]" hidden$="[[!state.heading.applicable]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:format-size"> </iron-icon> </a> <a data-format="blockquote" class="bar__tool bar__tool--range" on-tap="_format" active$="[[state.blockquote.applied]]" hidden$="[[!state.blockquote.applicable]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:format-quote"> </iron-icon> </a> <a data-format="link" class="bar__tool bar__tool--range bar__tool--range-link" active$="[[state.link.applied]]" hidden$="[[!state.link.applicable]]" on-tap="_toggleLink" tabindex="0"> <iron-icon icon="simpla-article-toolbar:insert-link"> </iron-icon> </a> <input id="range-link-input" class="range__link" type="text" value="{{_linkHref::input}}" on-keydown="_exitLinkOnExitKeys" placeholder="Enter a URL..."> </div> <a class="toolbar newline" data-context="newLine" on-tap="_embed" data-embed="image" visible$="[[_isContext(&apos;newLine&apos;, context)]]"> <iron-icon icon="simpla-article-toolbar:add-a-photo"> </iron-icon> </a> <div class="toolbar bar" data-context="image" visible$="[[_isContext(&apos;image&apos;, context)]]"> <a data-align="left" class="bar__tool bar__tool--image" on-tap="_alignImage" active$="[[_equals(state.image.meta.alignment, &apos;left&apos;)]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:vertical-align-top"> </iron-icon> </a> <a data-align="center" class="bar__tool bar__tool--image" on-tap="_alignImage" active$="[[_equals(state.image.meta.alignment, &apos;center&apos;)]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:vertical-align-center"> </iron-icon> </a> <a data-align="right" class="bar__tool bar__tool--image" on-tap="_alignImage" active$="[[_equals(state.image.meta.alignment, &apos;right&apos;)]]" tabindex="0"> <iron-icon icon="simpla-article-toolbar:vertical-align-bottom"> </iron-icon> </a> </div> </template> <script>!function(){"use strict";function t(t){var e=!1,n=0,i=document.createElement("span"),o=new MutationObserver(function(){t(),e=!1});return o.observe(i,{attributes:!0}),function(){e||(e=!0,i.setAttribute("x-index",n),n+=1)}}function e(t){var e=!1;return function(){e||(e=!0,setTimeout(function(){e=!1,t()},ft))}}function n(t){return""!==t&&!isNaN(parseFloat(t))&&isFinite(t)}function i(t,e){Object.keys(e).forEach(function(i){var o="";["width","height","top","right","bottom","left"].indexOf(i)!==-1&&n(e[i])&&(o="px"),t.style[i]=e[i]+o})}function o(t){var e={};return t&&"[object Function]"===e.toString.call(t)}function r(t,e){if(1!==t.nodeType)return[];var n=window.getComputedStyle(t,null);return e?n[e]:n}function a(t){return"HTML"===t.nodeName?t:t.parentNode||t.host}function s(t){if(!t||["HTML","BODY","#document"].indexOf(t.nodeName)!==-1)return window.document.body;var e=r(t),n=e.overflow,i=e.overflowX,o=e.overflowY;return/(auto|scroll)/.test(n+o+i)?t:s(a(t))}function f(t){var e=t.nodeName;return"BODY"!==e&&("HTML"===e||t.firstElementChild.offsetParent===t)}function u(t){return null!==t.parentNode?u(t.parentNode):t}function p(t){var e=t&&t.offsetParent,n=e&&e.nodeName;return n&&"BODY"!==n&&"HTML"!==n?e:window.document.documentElement}function l(t,e){if(!(t&&t.nodeType&&e&&e.nodeType))return window.document.documentElement;var n=t.compareDocumentPosition(e)&Node.DOCUMENT_POSITION_FOLLOWING,i=n?t:e,o=n?e:t,r=document.createRange();r.setStart(i,0),r.setEnd(o,0);var a=r.commonAncestorContainer;if(t!==a&&e!==a||i.contains(o))return f(a)?a:p(a);var s=u(t);return s.host?l(s.host,e):l(t,u(e).host)}function d(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"top",n="top"===e?"scrollTop":"scrollLeft",i=t.nodeName;if("BODY"===i||"HTML"===i){var o=window.document.documentElement,r=window.document.scrollingElement||o;return r[n]}return t[n]}function c(t,e){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=d(e,"top"),o=d(e,"left"),r=n?-1:1;return t.top+=i*r,t.bottom+=i*r,t.left+=o*r,t.right+=o*r,t}function h(t,e){var n="x"===e?"Left":"Top",i="Left"===n?"Right":"Bottom";return+t["border"+n+"Width"].split("px")[0]+ +t["border"+i+"Width"].split("px")[0]}function m(t,e,n,i){return Math.max(e["offset"+t],n["client"+t],n["offset"+t],ct()?n["offset"+t]+i["margin"+("Height"===t?"Top":"Left")]+i["margin"+("Height"===t?"Bottom":"Right")]:0)}function g(){var t=window.document.body,e=window.document.documentElement,n=ct()&&window.getComputedStyle(e);return{height:m("Height",t,e,n),width:m("Width",t,e,n)}}function v(t){return vt({},t,{right:t.left+t.width,bottom:t.top+t.height})}function b(t){var e={};if(ct())try{e=t.getBoundingClientRect();var n=d(t,"top"),i=d(t,"left");e.top+=n,e.left+=i,e.bottom+=n,e.right+=i}catch(t){}else e=t.getBoundingClientRect();var o={left:e.left,top:e.top,width:e.right-e.left,height:e.bottom-e.top},a="HTML"===t.nodeName?g():{},s=a.width||t.clientWidth||o.right-o.left,f=a.height||t.clientHeight||o.bottom-o.top,u=t.offsetWidth-s,p=t.offsetHeight-f;if(u||p){var l=r(t);u-=h(l,"x"),p-=h(l,"y"),o.width-=u,o.height-=p}return v(o)}function w(t,e){var n=ct(),i="HTML"===e.nodeName,o=b(t),a=b(e),f=s(t),u=v({top:o.top-a.top,left:o.left-a.left,width:o.width,height:o.height});if(i||"BODY"===e.nodeName){var p=r(e),l=n&&i?0:+p.borderTopWidth.split("px")[0],d=n&&i?0:+p.borderLeftWidth.split("px")[0],h=n&&i?0:+p.marginTop.split("px")[0],m=n&&i?0:+p.marginLeft.split("px")[0];u.top-=l-h,u.bottom-=l-h,u.left-=d-m,u.right-=d-m,u.marginTop=h,u.marginLeft=m}return(n?e.contains(f):e===f&&"BODY"!==f.nodeName)&&(u=c(u,e)),u}function y(t){var e=window.document.documentElement,n=w(t,e),i=Math.max(e.clientWidth,window.innerWidth||0),o=Math.max(e.clientHeight,window.innerHeight||0),r=d(e),a=d(e,"left"),s={top:r-n.top+n.marginTop,left:a-n.left+n.marginLeft,width:i,height:o};return v(s)}function _(t){var e=t.nodeName;return"BODY"!==e&&"HTML"!==e&&("fixed"===r(t,"position")||_(a(t)))}function x(t,e,n,i){var o={top:0,left:0},r=l(t,e);if("viewport"===i)o=y(r);else{var f=void 0;"scrollParent"===i?(f=s(a(t)),"BODY"===f.nodeName&&(f=window.document.documentElement)):f="window"===i?window.document.documentElement:i;var u=w(f,r);if("HTML"!==f.nodeName||_(r))o=u;else{var p=g(),d=p.height,c=p.width;o.top+=u.top-u.marginTop,o.bottom=d+u.top,o.left+=u.left-u.marginLeft,o.right=c+u.left}}return o.left+=n,o.top+=n,o.right-=n,o.bottom-=n,o}function E(t){var e=t.width,n=t.height;return e*n}function O(t,e,n,i,o){var r=arguments.length>5&&void 0!==arguments[5]?arguments[5]:0;if(t.indexOf("auto")===-1)return t;var a=x(n,i,r,o),s={top:{width:a.width,height:e.top-a.top},right:{width:a.right-e.right,height:a.height},bottom:{width:a.width,height:a.bottom-e.bottom},left:{width:e.left-a.left,height:a.height}},f=Object.keys(s).map(function(t){return vt({key:t},s[t],{area:E(s[t])})}).sort(function(t,e){return e.area-t.area}),u=f.filter(function(t){var e=t.width,i=t.height;return e>=n.clientWidth&&i>=n.clientHeight}),p=u.length>0?u[0].key:f[0].key,l=t.split("-")[1];return p+(l?"-"+l:"")}function L(t,e,n){var i=l(e,n);return w(n,i)}function k(t){var e=window.getComputedStyle(t),n=parseFloat(e.marginTop)+parseFloat(e.marginBottom),i=parseFloat(e.marginLeft)+parseFloat(e.marginRight),o={width:t.offsetWidth+i,height:t.offsetHeight+n};return o}function T(t){var e={left:"right",right:"left",bottom:"top",top:"bottom"};return t.replace(/left|right|bottom|top/g,function(t){return e[t]})}function C(t,e,n){n=n.split("-")[0];var i=k(t),o={width:i.width,height:i.height},r=["right","left"].indexOf(n)!==-1,a=r?"top":"left",s=r?"left":"top",f=r?"height":"width",u=r?"width":"height";return o[a]=e[a]+e[f]/2-i[f]/2,n===s?o[s]=e[s]-i[u]:o[s]=e[T(s)],o}function P(t,e){return Array.prototype.find?t.find(e):t.filter(e)[0]}function A(t,e,n){if(Array.prototype.findIndex)return t.findIndex(function(t){return t[e]===n});var i=P(t,function(t){return t[e]===n});return t.indexOf(i)}function B(t,e,n){var i=void 0===n?t:t.slice(0,A(t,"name",n));return i.forEach(function(t){t.function&&console.warn("`modifier.function` is deprecated, use `modifier.fn`!");var n=t.function||t.fn;t.enabled&&o(n)&&(e=n(e,t))}),e}function N(){if(!this.state.isDestroyed){var t={instance:this,styles:{},attributes:{},flipped:!1,offsets:{}};t.offsets.reference=L(this.state,this.popper,this.reference),t.placement=O(this.options.placement,t.offsets.reference,this.popper,this.reference,this.options.modifiers.flip.boundariesElement,this.options.modifiers.flip.padding),t.originalPlacement=t.placement,t.offsets.popper=C(this.popper,t.offsets.reference,t.placement),t.offsets.popper.position="absolute",t=B(this.modifiers,t),this.state.isCreated?this.options.onUpdate(t):(this.state.isCreated=!0,this.options.onCreate(t))}}function M(t,e){return t.some(function(t){var n=t.name,i=t.enabled;return i&&n===e})}function D(t){for(var e=[!1,"ms","webkit","moz","o"],n=t.charAt(0).toUpperCase()+t.slice(1),i=0;i<e.length-1;i++){var o=e[i],r=o?""+o+n:t;if("undefined"!=typeof window.document.body.style[r])return r}return null}function H(){return this.state.isDestroyed=!0,M(this.modifiers,"applyStyle")&&(this.popper.removeAttribute("x-placement"),this.popper.style.left="",this.popper.style.position="",this.popper.style.top="",this.popper.style[D("transform")]=""),this.disableEventListeners(),this.options.removeOnDestroy&&this.popper.parentNode.removeChild(this.popper),this}function S(t,e,n,i){var o="BODY"===t.nodeName,r=o?window:t;r.addEventListener(e,n,{passive:!0}),o||S(s(r.parentNode),e,n,i),i.push(r)}function W(t,e,n,i){n.updateBound=i,window.addEventListener("resize",n.updateBound,{passive:!0});var o=s(t);return S(o,"scroll",n.updateBound,n.scrollParents),n.scrollElement=o,n.eventsEnabled=!0,n}function j(){this.state.eventsEnabled||(this.state=W(this.reference,this.options,this.state,this.scheduleUpdate))}function F(t,e){return window.removeEventListener("resize",e.updateBound),e.scrollParents.forEach(function(t){t.removeEventListener("scroll",e.updateBound)}),e.updateBound=null,e.scrollParents=[],e.scrollElement=null,e.eventsEnabled=!1,e}function R(){this.state.eventsEnabled&&(window.cancelAnimationFrame(this.scheduleUpdate),this.state=F(this.reference,this.state))}function I(t,e){Object.keys(e).forEach(function(n){var i=e[n];i!==!1?t.setAttribute(n,e[n]):t.removeAttribute(n)})}function U(t,e){var n={position:t.offsets.popper.position},o={"x-placement":t.placement},r=Math.round(t.offsets.popper.left),a=Math.round(t.offsets.popper.top),s=D("transform");return e.gpuAcceleration&&s?(n[s]="translate3d("+r+"px, "+a+"px, 0)",n.top=0,n.left=0,n.willChange="transform"):(n.left=r,n.top=a,n.willChange="top, left"),i(t.instance.popper,vt({},n,t.styles)),I(t.instance.popper,vt({},o,t.attributes)),t.offsets.arrow&&i(t.arrowElement,t.offsets.arrow),t}function Y(t,e,n,i,o){var r=L(o,e,t),a=O(n.placement,r,e,t,n.modifiers.flip.boundariesElement);return e.setAttribute("x-placement",a),n}function V(t,e,n){var i=P(t,function(t){var n=t.name;return n===e}),o=!!i&&t.some(function(t){return t.name===n&&t.enabled&&t.order<i.order});if(!o){var r="`"+e+"`",a="`"+n+"`";console.warn(a+" modifier is required by "+r+" modifier in order to work, be sure to include it before "+r+"!")}return o}function q(t,e){if(!V(t.instance.modifiers,"arrow","keepTogether"))return t;var n=e.element;if("string"==typeof n){if(n=t.instance.popper.querySelector(n),!n)return t}else if(!t.instance.popper.contains(n))return console.warn("WARNING: `arrow.element` must be child of its popper element!"),t;var i=t.placement.split("-")[0],o=v(t.offsets.popper),r=t.offsets.reference,a=["left","right"].indexOf(i)!==-1,s=a?"height":"width",f=a?"top":"left",u=a?"left":"top",p=a?"bottom":"right",l=k(n)[s];r[p]-l<o[f]&&(t.offsets.popper[f]-=o[f]-(r[p]-l)),r[f]+l>o[p]&&(t.offsets.popper[f]+=r[f]+l-o[p]);var d=r[f]+r[s]/2-l/2,c=d-v(t.offsets.popper)[f];return c=Math.max(Math.min(o[s]-l,c),0),t.arrowElement=n,t.offsets.arrow={},t.offsets.arrow[f]=Math.floor(c),t.offsets.arrow[u]="",t}function K(t){return"end"===t?"start":"start"===t?"end":t}function z(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=wt.indexOf(t),i=wt.slice(n+1).concat(wt.slice(0,n));return e?i.reverse():i}function G(t,e){if(M(t.instance.modifiers,"inner"))return t;if(t.flipped&&t.placement===t.originalPlacement)return t;var n=x(t.instance.popper,t.instance.reference,e.padding,e.boundariesElement),i=t.placement.split("-")[0],o=T(i),r=t.placement.split("-")[1]||"",a=[];switch(e.behavior){case yt.FLIP:a=[i,o];break;case yt.CLOCKWISE:a=z(i);break;case yt.COUNTERCLOCKWISE:a=z(i,!0);break;default:a=e.behavior}return a.forEach(function(s,f){if(i!==s||a.length===f+1)return t;i=t.placement.split("-")[0],o=T(i);var u=v(t.offsets.popper),p=t.offsets.reference,l=Math.floor,d="left"===i&&l(u.right)>l(p.left)||"right"===i&&l(u.left)<l(p.right)||"top"===i&&l(u.bottom)>l(p.top)||"bottom"===i&&l(u.top)<l(p.bottom),c=l(u.left)<l(n.left),h=l(u.right)>l(n.right),m=l(u.top)<l(n.top),g=l(u.bottom)>l(n.bottom),b="left"===i&&c||"right"===i&&h||"top"===i&&m||"bottom"===i&&g,w=["top","bottom"].indexOf(i)!==-1,y=!!e.flipVariations&&(w&&"start"===r&&c||w&&"end"===r&&h||!w&&"start"===r&&m||!w&&"end"===r&&g);(d||b||y)&&(t.flipped=!0,(d||b)&&(i=a[f+1]),y&&(r=K(r)),t.placement=i+(r?"-"+r:""),t.offsets.popper=vt({},t.offsets.popper,C(t.instance.popper,t.offsets.reference,t.placement)),t=B(t.instance.modifiers,t,"flip"))}),t}function X(t){var e=v(t.offsets.popper),n=t.offsets.reference,i=t.placement.split("-")[0],o=Math.floor,r=["top","bottom"].indexOf(i)!==-1,a=r?"right":"bottom",s=r?"left":"top",f=r?"width":"height";return e[a]<o(n[s])&&(t.offsets.popper[s]=o(n[s])-e[f]),e[s]>o(n[a])&&(t.offsets.popper[s]=o(n[a])),t}function $(t,e,n,i){var o=t.match(/((?:\-|\+)?\d*\.?\d*)(.*)/),r=+o[1],a=o[2];if(!r)return t;if(0===a.indexOf("%")){var s=void 0;switch(a){case"%p":s=n;break;case"%":case"%r":default:s=i}var f=v(s);return f[e]/100*r}if("vh"===a||"vw"===a){var u=void 0;return u="vh"===a?Math.max(document.documentElement.clientHeight,window.innerHeight||0):Math.max(document.documentElement.clientWidth,window.innerWidth||0),u/100*r}return r}function J(t,e,i,o){var r=[0,0],a=["right","left"].indexOf(o)!==-1,s=t.split(/(\+|\-)/).map(function(t){return t.trim()}),f=s.indexOf(P(s,function(t){return t.search(/,|\s/)!==-1}));s[f]&&s[f].indexOf(",")===-1&&console.warn("Offsets separated by white space(s) are deprecated, use a comma (,) instead.");var u=/\s*,\s*|\s+/,p=f!==-1?[s.slice(0,f).concat([s[f].split(u)[0]]),[s[f].split(u)[1]].concat(s.slice(f+1))]:[s];return p=p.map(function(t,n){var o=(1===n?!a:a)?"height":"width",r=!1;return t.reduce(function(t,e){return""===t[t.length-1]&&["+","-"].indexOf(e)!==-1?(t[t.length-1]=e,r=!0,t):r?(t[t.length-1]+=e,r=!1,t):t.concat(e)},[]).map(function(t){return $(t,o,e,i)})}),p.forEach(function(t,e){t.forEach(function(i,o){n(i)&&(r[e]+=i*("-"===t[o-1]?-1:1))})}),r}function Q(t,e){var i=e.offset,o=t.placement,r=t.offsets,a=r.popper,s=r.reference,f=o.split("-")[0],u=void 0;return u=n(+i)?[+i,0]:J(i,a,s,f),"left"===f?(a.top+=u[0],a.left-=u[1]):"right"===f?(a.top+=u[0],a.left+=u[1]):"top"===f?(a.left+=u[0],a.top-=u[1]):"bottom"===f&&(a.left+=u[0],a.top+=u[1]),t.popper=a,t}function Z(t,e){var n=e.boundariesElement||p(t.instance.popper),i=x(t.instance.popper,t.instance.reference,e.padding,n);e.boundaries=i;var o=e.priority,r=v(t.offsets.popper),a={primary:function(t){var n=r[t];return r[t]<i[t]&&!e.escapeWithReference&&(n=Math.max(r[t],i[t])),gt({},t,n)},secondary:function(t){var n="right"===t?"left":"top",o=r[n];return r[t]>i[t]&&!e.escapeWithReference&&(o=Math.min(r[n],i[t]-("right"===t?r.width:r.height))),gt({},n,o)}};return o.forEach(function(t){var e=["left","top"].indexOf(t)!==-1?"primary":"secondary";r=vt({},r,a[e](t))}),t.offsets.popper=r,t}function tt(t){var e=t.placement,n=e.split("-")[0],i=e.split("-")[1];if(i){var o=t.offsets.reference,r=v(t.offsets.popper),a=["bottom","top"].indexOf(n)!==-1,s=a?"left":"top",f=a?"width":"height",u={start:gt({},s,o[s]),end:gt({},s,o[s]+o[f]-r[f])};t.offsets.popper=vt({},r,u[i])}return t}function et(t){if(!V(t.instance.modifiers,"hide","preventOverflow"))return t;var e=t.offsets.reference,n=P(t.instance.modifiers,function(t){return"preventOverflow"===t.name}).boundaries;if(e.bottom<n.top||e.left>n.right||e.top>n.bottom||e.right<n.left){if(t.hide===!0)return t;t.hide=!0,t.attributes["x-out-of-boundaries"]=""}else{if(t.hide===!1)return t;t.hide=!1,t.attributes["x-out-of-boundaries"]=!1}return t}function nt(t){var e=t.placement,n=e.split("-")[0],i=v(t.offsets.popper),o=v(t.offsets.reference),r=["left","right"].indexOf(n)!==-1,a=["top","left"].indexOf(n)===-1;return i[r?"left":"top"]=o[e]-(a?i[r?"width":"height"]:0),t.placement=T(e),t.offsets.popper=v(i),t}function it(t){return{getBoundingClientRect:function(){return t.getBounds()||{top:0,left:0,bottom:0,right:0,width:0,height:0}},get clientWidth(){return this.getBoundingClientRect().width},get clientHeight(){return this.getBoundingClientRect().height}}}for(var ot=["native code","[object MutationObserverConstructor]"],rt=function(t){return ot.some(function(e){return(t||"").toString().indexOf(e)>-1})},at="undefined"!=typeof window,st=["Edge","Trident","Firefox"],ft=0,ut=0;ut<st.length;ut+=1)if(at&&navigator.userAgent.indexOf(st[ut])>=0){ft=1;break}var pt=at&&rt(window.MutationObserver),lt=pt?t:e,dt=void 0,ct=function(){return void 0===dt&&(dt=navigator.appVersion.indexOf("MSIE 10")!==-1),dt},ht=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},mt=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),gt=function(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t},vt=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},bt=["auto-start","auto","auto-end","top-start","top","top-end","right-start","right","right-end","bottom-end","bottom","bottom-start","left-end","left","left-start"],wt=bt.slice(3),yt={FLIP:"flip",CLOCKWISE:"clockwise",COUNTERCLOCKWISE:"counterclockwise"},_t={shift:{order:100,enabled:!0,fn:tt},offset:{order:200,enabled:!0,fn:Q,offset:0},preventOverflow:{order:300,enabled:!0,fn:Z,priority:["left","right","top","bottom"],padding:5,boundariesElement:"scrollParent"},keepTogether:{order:400,enabled:!0,fn:X},arrow:{order:500,enabled:!0,fn:q,element:"[x-arrow]"},flip:{order:600,enabled:!0,fn:G,behavior:"flip",padding:5,boundariesElement:"viewport"},inner:{order:700,enabled:!1,fn:nt},hide:{order:800,enabled:!0,fn:et},applyStyle:{order:900,enabled:!0,fn:U,onLoad:Y,gpuAcceleration:!0}},xt={placement:"bottom",eventsEnabled:!0,removeOnDestroy:!1,onCreate:function(){},onUpdate:function(){},modifiers:_t},Et=function(){function t(e,n){var r=this,a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};ht(this,t),this.scheduleUpdate=function(){return requestAnimationFrame(r.update)},this.update=lt(this.update.bind(this)),this.options=vt({},t.Defaults,a),this.state={isDestroyed:!1,isCreated:!1,scrollParents:[]},this.reference=e.jquery?e[0]:e,this.popper=n.jquery?n[0]:n,i(this.popper,{position:"absolute"}),this.modifiers=Object.keys(t.Defaults.modifiers).map(function(e){return vt({name:e},t.Defaults.modifiers[e])}),this.modifiers=this.modifiers.map(function(t){var e=a.modifiers&&a.modifiers[t.name]||{};return vt({},t,e)}),a.modifiers&&(this.options.modifiers=vt({},t.Defaults.modifiers,a.modifiers),Object.keys(a.modifiers).forEach(function(e){if(void 0===t.Defaults.modifiers[e]){var n=a.modifiers[e];n.name=e,r.modifiers.push(n)}})),this.modifiers=this.modifiers.sort(function(t,e){return t.order-e.order}),this.modifiers.forEach(function(t){t.enabled&&o(t.onLoad)&&t.onLoad(r.reference,r.popper,r.options,t,r.state)}),this.update();var s=this.options.eventsEnabled;s&&this.enableEventListeners(),this.state.eventsEnabled=s}return mt(t,[{key:"update",value:function(){return N.call(this)}},{key:"destroy",value:function(){return H.call(this)}},{key:"enableEventListeners",value:function(){return j.call(this)}},{key:"disableEventListeners",value:function(){return R.call(this)}}]),t}();Et.Utils=("undefined"!=typeof window?window:global).PopperUtils,Et.placements=bt,Et.Defaults=xt;var Ot=5,Lt={placement:"top",modifiers:{offset:{offset:"0,"+Ot},preventOverflow:{padding:Ot,boundariesElement:"scrollParent"}}},kt={created:function(){this.__poppers=[]},anchor:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=e.placement,i=void 0===n?"top":n;this.__poppers.push(new Et(it(this),t,Object.assign({},Lt,{placement:i})))},updateAnchors:function(){this.__poppers.forEach(function(t){return t.scheduleUpdate()})}},Tt={_alignImage:function(t){var e=Polymer.dom(t).rootTarget.dataset.align,n=this.editor.plugins.image;this.editor.embed("image",Object.assign({},n.meta,{alignment:e}))}},Ct=function(t,e,n){var i=function i(o){n(o),t.removeEventListener(e,i)};t.addEventListener(e,i)},Pt=function(t){var e=function(t){return new Promise(function(e){var n=new FileReader;Ct(n,"load",function(t){return e(t.target.result)}),n.readAsDataURL(t)})};return Promise.all([].map.call(t,e))},At=function(t){var e=document.createElement("input");return e.type="file",e.accept=t,e.multiple=!0,new Promise(function(t,n){Ct(e,"change",function(e){return t(e.target.files)}),e.click()})},Bt={_embed:function(t){var e=this,n=Polymer.dom(t).rootTarget.dataset.embed;At("image/*").then(Pt).then(function(t){t.forEach(function(t){return e.editor.embed(n,{src:t})})})}},Nt=function(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e<t.length;e++)n[e]=t[e];return n}return Array.from(t)},Mt=[13,27],Dt=2,Ht={properties:{_linkHref:{type:String,value:""},_rangeLinkActive:{type:Boolean,observer:"_updateLink"}},_focusThen:function(t){var e;this.editor.focus();for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;o<n;o++)i[o-1]=arguments[o];(e=this.editor)[t].apply(e,Nt(i))},_format:function(t){var e=Polymer.dom(t).rootTarget.dataset.format;this._focusThen("toggleFormat",e)},_formatHeading:function(){var t=this.editor.plugins.heading;t.applied&&t.meta.level<Dt?this._focusThen("format","heading",{level:t.meta.level+1}):t.applied&&t.meta.level===Dt?this._focusThen("removeFormat","heading"):this._focusThen("format","heading",{level:1})},_toggleLink:function(){this._rangeLinkActive=!this._rangeLinkActive},_updateLink:function(t){var e=this.editor.plugins.link.meta,n=this._linkHref.trim(),i=this.$["range-link-input"];t?(this._linkHref=e&&e.href?e.href:"",i.focus()):(this.editor.removeFormat("link"),i.blur(),n&&this._focusThen("format","link",{href:n}))},_exitLinkOnExitKeys:function(t){Mt.indexOf(t.keyCode)!==-1&&(this._rangeLinkActive=!1,t.preventDefault())}},St={newLine:{placement:"left"},image:{placement:"top"},range:{placement:"top"}};Polymer({is:"simpla-article-toolbar",properties:{context:{type:String,value:""},editor:{type:Object,observer:"_updateEditorBindings"},state:{type:Object,value:function(){return{}}},tabindex:{type:Number,value:0,reflectToAttribute:!0}},behaviors:[kt,Ht,Bt,Tt],listeners:{keyup:"_stopEvent",keydown:"_stopEvent",keypress:"_stopEvent",blur:"_updateVisibility"},attached:function(){this._setupToolbars()},_setupToolbars:function(){var t=this;Polymer.dom(this.root).querySelectorAll("[data-context]").forEach(function(e){t.anchor(e,St[e.dataset.context])})},getBounds:function(){return this.editor?this.editor.getSelectionBounds():null},_updateEditorBindings:function(t,e){var n=this;this.__updatePositions=this.__updatePositions||function(){n.updateAnchors()},this.__updateContext=this.__updateContext||function(){var t=n.editor,e=t.selection.empty,i=t.plugins.image;i.applied?n.context="image":i.applicable?n.context="newLine":e?n.context=null:n.context="range"},this.__updateState=this.__updateState||function(t){n.set("state."+t.name,t)},this.__updateVisibility=this.__updateVisibility||this._updateVisibility.bind(this),this.state={},this.context=null,e&&(t.off("select",this.__updatePositions),t.off("select",this.__updateContext),t.off("plugin",this.__updateContext),t.off("focus",this.__updateContext),t.off("plugin",this.__updateState),t.off("blur",this.__updateVisibility)),t&&(t.on("select",this.__updatePositions),t.on("select",this.__updateContext),t.on("plugin",this.__updateContext),t.on("focus",this.__updateContext),t.on("plugin",this.__updateState),t.on("blur",this.__updateVisibility),this.__updatePositions(),this.__updateContext(),this.state=t.plugins)},_isContext:function(t,e){return t===e},_stopEvent:function(t){t.stopPropagation()},_equals:function(t,e){return t===e},_updateVisibility:function(t){t.relatedTarget===this||this.contains(t.relatedTarget)||(this.context=null)}})}(); </script> </dom-module>