The lightdom attr was removed a long time ago. That said, Polymer 0.8 will have an option to create elements without shadow dom.
On Thu, Feb 19, 2015, 5:19 AM null <[email protected]> wrote: > Hi Eric, > > I'm new to Polymer and I'm trying to get it to work with jQuery UI > draggable and resizable. Seems weird to me,but for some reason I can get > draggable to work straight away (without the helper override you propose), > but I can´t get resizable to work. I'm trying to use the lightdom attribute > as you suggest, but it still doesn't work and when I inspect the element > with Chrome Dev Tools I can still see the internal markup being posted as > shadow dom instead of light dom. I´ve searched the Polymer documentation > for the lightdom attribute and how to use it (thought maybe I'm just doing > something wrong), but I can't find anything. Could you point me in the > right direction here? > > Thank you, > > > > On Tuesday, 7 January 2014 20:55:01 UTC+1, Eric Bidelman wrote: > >> Found two ways to get things working: http://jsbin.com/ekIlAlAK/2/edit >> >> 1. use the lightdom attribute >> <http://www.polymer-project.org/polymer.html#createlightdom> on >> <polymer-element>. However, this exposes your internals to the outside >> world. >> 2. override the .helper in your draggable object: >> $( this.$.container ).draggable( "option", "helper", null); >> >> Be forewarned...I have no idea what the ramification of #2 is. There is >> some beastly mouse capture / node finding logic deep within jquery-ui. The >> culprit was 1047 in jquery-ui.js >> <https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.draggable.js#L94> >> returning >> early. >> > On Tue, Jan 7, 2014 at 10:17 AM, <[email protected]> wrote: >> > Hello Polymerizers, >>> >>> In my learning tests with Polymer, I am trying to create a draggable >>> component that moves a div around the screen. To do this, my approach is to >>> adapt the following simple but working code using jquery(-ui) >>> capabilities to the polymer architectural style. >>> >>> <div> >>> <style> >>> #container { >>> background-color:blue; >>> width: 100px; >>> height: 100px; >>> border:solid 1px; >>> color: white; >>> padding: 5px; >>> } >>> </style> >>> <div id="container"> >>> Drag me! >>> </div> >>> <script type="text/javascript"> >>> $(function() { >>> $( "#container" ).draggable(); >>> $( "#container" ).resizable(); >>> }); >>> </script> >>> </div> >>> >>> After reading several posts on the subject, my solution looks like this: >>> >>> 1. dragdrop.html: >>> <polymer-element name ="wc-dragdrop" > >>> <template> >>> <link rel="stylesheet" href="../styles/style.css"> >>> <div id="container"> >>> Drag me! >>> </div> >>> </template> >>> <script src="../scripts/dragdrop.js"></script> >>> </polymer-element> >>> >>> 2. dragdrop.css >>> #container { >>> background-color:blue; >>> width: 100px; >>> height: 100px; >>> border:solid 1px; >>> color: white; >>> padding: 5px; >>> } >>> >>> 3. dragdrop.js >>> Polymer ('wc-dragdrop', { >>> ready: function() { >>> $( this.$.container ).draggable(); >>> $( this.$.container ).resizable(); >>> } >>> }); >>> >>> 4. index.html >>> html> >>> <head> >>> <script src="general/scripts/polymer/polymer.min.js"></script> >>> <script src="http://code.jquery.com/jquery-1.10.2.min.js";></script> >>> >>> <script src="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.3/ >>> jquery-ui.min.js"></script> >>> <link rel="import" href="modules/wc-dragdrop/layout/dragdrop.html"> >>> </head> >>> ... >>> <wc-dragdrop></wc-dragdrop> >>> ... >>> >>> The observed outcome is that surprisingly the dragging effect stops >>> working after the first drop. Does anybody know what is going on? Any ideas >>> on how to fix it? >>> >>> Thanks a lot. >>> >>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>> --- >>> You received this message because you are subscribed to the Google >>> Groups "Polymer" group. >>> >> To unsubscribe from this group and stop receiving emails from it, send an >>> email to [email protected]. >> >> >>> For more options, visit https://groups.google.com/groups/opt_out. >>> >> Follow Polymer on Google+: plus.google.com/107187849809354688692 > --- > You received this message because you are subscribed to the Google Groups > "Polymer" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/polymer-dev/59099d4c-d574-4379-9cae-feea15a1604a%40googlegroups.com > <https://groups.google.com/d/msgid/polymer-dev/59099d4c-d574-4379-9cae-feea15a1604a%40googlegroups.com?utm_medium=email&utm_source=footer> > . > For more options, visit https://groups.google.com/d/optout. > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CACGqRCBje%2BL9dFq_Xu%3Dod-FDmKp1BL--ey6Z%2BSQN5g2PTM9E6A%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
