Still playing with it while you're lunching...
Found this:
http://tankut.googlepages.com/home
http://tanrikut.blogspot.com/search/label/scriptaculous
This code allows you to use
.emptyPlaceMarker {
border-right: red thin dashed;
border-top: red thin dashed;
border-left: red thin dashed;
border-bottom: red thin dashed;
background-color: Transparent;
}
To signify where an Item is going to be dropped. Combined with ghosting, and
constraint, i'm almost there.
The emptyPlaceMarker is appearing as the element it is going to replace (ie
the element that will move down) rather than a placeholder element that is
where the new element would be dropped though.
The guy hasn't put much detail on what he's patched in scripty to make this
happen either.
I have this (stripped down, wont work just like this but thought I better
give some context to my example)
*CSS*
.ZoneColumn { width:310px; padding-left:0px; padding-right:0px; height:100%;
background-color:#efefef; margin-right:10px; float:left; position:relative;
}
#Zones
{
position:relative;
clear:both;
height:100%;
}
.zone {
width:300px;
margin:15px;
display:block;
}
*HTML*
<div id="Zones">
<div id="ZoneAddLink"><a href='AddItemsToHome.aspx'>add new</a></div>
<div class='ZoneColumn' id='ZoneColumn_1'>
<div class='zone' id='Zone_c6cdfd9a-fab7-464d-ae93-bd8bfebcfeb9'
style='position:relative;' zonedataid='4'>Loading Content....</div>
<div class='zone' id='Zone_cf1016a0-1a04-48f4-905f-e7dd23037b72'
style='position:relative;' zonedataid='7'>Loading Content....</div>
<div class='zone' id='Zone_9c352d38-43e7-4ad2-ba00-3d0b03517587'
style='position:relative;' zonedataid='10'>Loading Content....</div>
<div class='zone' id='Zone_086d7527-2846-4568-9217-c6f8a4657530'
style='position:relative;' zonedataid='19'>Loading Content....</div>
<div class='zone' id='Zone_3552f386-52e3-4d9b-895a-72f89881e4d3'
style='position:relative;' zonedataid='24'>Loading Content....</div>
<div class='zone' id='Zone_af032da3-cbd6-484d-890b-600f11a96eff'
style='position:relative;' zonedataid='25'>Loading Content....</div>
<div class='zone' id='Zone_599dc938-b6db-4d3e-b1ac-1ce2dd35077e'
style='position:relative;' zonedataid='26'>Loading Content....</div>
</div>
<div class='ZoneColumn' id='ZoneColumn_2'></div>
<div class='ZoneColumn' id='ZoneColumn_3'></div>
</div>
*Javascript*
var ZoneColumns = $('Zones').getElementsBySelector('div.ZoneColumn').pluck(
'id');
$('Zones').getElementsBySelector('div.ZoneColumn').each(function (column) {
if ($F('UserId') != 0)
Sortable.create(column,{tag:'div',onChange:function(a,b,c) { },onUpdate:
function(a,b,c) { },dropOnEmpty:'true', containment:ZoneColumns, constraint:
false, ghosting: true});
column.getElementsBySelector('div.zone').each(function(node){
if (node.id != null){
if (node.getAttribute('ZoneDataId') != null)
{
var url = 'RenderZone.aspx';
var pars = 'ZoneDataId=' + node.getAttribute('ZoneDataId');
var myAjax = new Ajax.Updater(node.id, url, {method: 'post', parameters:
pars, onComplete:processCollapse });
}
}
});
});
This allows me to drop the items between the columns, and everything appears
to be working.
The ghosting option seems to not be what I want, but the containment:[...]
and constraint:false fixed the dropping between columns.
sabinfo- see, progress!
PS, how the hell does google keep the syntax highlighting in the text area
when I paste from my dev env?
Gareth
On 6/9/07, Christophe Porteneuve <[EMAIL PROTECTED]> wrote:
>
> About to lunch, replying in a moment ;-)
>
> Gareth Evans a écrit :
> > Wicked, i'll go steal the business credit card from my business partner
> :)
> >
> > Since you're here and all... trying to get this sortable thing working
> > (discussed in this thread)
> > I've currently got 3 floating divs with widths set.
> >
> > All 3 divs have been initialized as sortables, dropOnEmpty:true.
> > Only the first div contains items.
> > There has been no constraint set.
> >
> > $(
> >
> > 'Zones').getElementsBySelector('div.ZoneColumn').each( function (column)
> {
> > if ($F('UserId') != 0)
> > Sortable.create(column,{tag: 'div',onChange:function(a,b,c) {
> > },onUpdate:function (a,b,c) { },dropOnEmpty:'true'});
> > });
> >
> > I can sort the items within the first 'div.ZoneColumn' but am unable to
> > drag the items into the next column over horizontally...
> > I'm guessing this is a limitation of sorts, should I go for a new
> > Draggable and Droppables.add solution?
> >
> > How do I get a draggable/droppable solution to only allow items to be
> > dropped in the container droppables?
> >
> > Gareth
> >
> >
> >
> >
> >
> > On 6/9/07, *Christophe Porteneuve* <[EMAIL PROTECTED]
> > <mailto:[EMAIL PROTECTED]>> wrote:
> >
> >
> > Hey!
> >
> > Gareth Evans a écrit :
> > > Is your book available in NZ, or internet purchase only? i've
> been
> > > meaning to get a copy as soon as my credit card gets paid off a
> bit!
> >
> > It's currently in the Beta phase at Pragmatic Programmers [1], so
> it's
> > electronic only so far.
> >
> > When it does release in final form (sometime between July and
> October,
> > depending on when we at Prototype Core feature- and API-freeze 1.6),
> > it'll of course also be available in paper form, shipped anywhere in
> the
> > world.
> >
> > You can buy the Combo pack if shipment doesn't kill the usefulness
> of
> > it, or just buy the PDF for now (updated everytime I release a new
> Beta,
> > then final, then perhaps errata), and grab a paper copy in the
> > bookstores later in the year.
> >
> > My editor is currently going through a lot of catch-up work, but as
> > soon
> > as he gets a chance of editing the Scripty part, we'll release
> B1. In
> > the meantime, I keep the book up-to-date on the latest trunk
> additions,
> > and keep contributing to both Proto and Scripty ;-)
> >
> > [1] http://books.pragprog.com/titles/cppsu/
> >
> > --
> > Christophe Porteneuve aka TDD
> > [EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>
> >
> >
> > >
>
> --
> Christophe Porteneuve aka TDD
> [EMAIL PROTECTED]
>
> >
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
