近段时间在研究netvibes,准备写一些关于netvibes的系列文章,今天是第一篇。
[img]http://george-liu.iteye.com/upload/attachment/15851/31c30f37-e419-3ade-be98-9b71bf8759cf-thumb.jpg?1204474244[/img]
页面建的拖动最后停止的位置有两种情况:一是在同列中上下拖动,二是在不同列中拖动。
1) 同列中上下拖动:
我们如何记录他的位置,比如第一个模块放到第二个模块后面,和放到第三个模块后面,如果能记录到这种程度一般的想法是遍历这一列的模块,然后更新他们位置的信息,而netvibes是这样实现的。他给这一列中的每个模块都设置一个表示row,最初的数值是第一个为1000,后面依次在此基础上+1000,也就是第六个widget是row值是6000,
现在如果将第一个模块放到第二个模块后面,这时取出第二个和第三个模块的row值2000,3000,计算他的中间值为2500,然后在加上这个列号发送到服务器更新移动模块的信息就行了。传输数据如下:"id=509248621&col=1&row=2500" 当中间值差小于1时这时才重置也一列,将下面数据发送到服务器批量更新,"col=1&order=509248622:1000,509248620:2000,509248621:3000,509248623:4000,509248619:5000"
2) 在不同列中拖动:
这里使用了一个非常好的思想简化了这个问题,在这个过程中只有被拖动的模块的col值和row值被重置,按照这中方式(id=509248621&col=1&row=2500)标识widget位置,原来列和现在被插入的列的原有信息,都没有影响。
因此,采用这种方式模块移动信息基本上只要记录被拖动的模块就可以完成,大大简化了问题。
[img]http://george-liu.iteye.com/upload/attachment/15851/31c30f37-e419-3ade-be98-9b71bf8759cf-thumb.jpg?1204474244[/img]
页面建的拖动最后停止的位置有两种情况:一是在同列中上下拖动,二是在不同列中拖动。
1) 同列中上下拖动:
我们如何记录他的位置,比如第一个模块放到第二个模块后面,和放到第三个模块后面,如果能记录到这种程度一般的想法是遍历这一列的模块,然后更新他们位置的信息,而netvibes是这样实现的。他给这一列中的每个模块都设置一个表示row,最初的数值是第一个为1000,后面依次在此基础上+1000,也就是第六个widget是row值是6000,
现在如果将第一个模块放到第二个模块后面,这时取出第二个和第三个模块的row值2000,3000,计算他的中间值为2500,然后在加上这个列号发送到服务器更新移动模块的信息就行了。传输数据如下:"id=509248621&col=1&row=2500" 当中间值差小于1时这时才重置也一列,将下面数据发送到服务器批量更新,"col=1&order=509248622:1000,509248620:2000,509248621:3000,509248623:4000,509248619:5000"
2) 在不同列中拖动:
这里使用了一个非常好的思想简化了这个问题,在这个过程中只有被拖动的模块的col值和row值被重置,按照这中方式(id=509248621&col=1&row=2500)标识widget位置,原来列和现在被插入的列的原有信息,都没有影响。
因此,采用这种方式模块移动信息基本上只要记录被拖动的模块就可以完成,大大简化了问题。