comparison js/jquery.draganddrop.js @ 24:4f58fa0a9a6d

Cleaned up some library behavior, changed editor representation cache to track a title and a body for representations, to allow a little more dynamic composition.
author David Eads <eads@chicagotech.org>
date Wed, 11 Mar 2009 01:47:57 -0500
parents 89fe0aca43d4
children e71df38143d1
comparison
equal deleted inserted replaced
23:a72403cfa9a8 24:4f58fa0a9a6d
42 * A class to add to a draggable item if it can be dragged to an iframe. 42 * A class to add to a draggable item if it can be dragged to an iframe.
43 * 43 *
44 * textareaTargetClass: 44 * textareaTargetClass:
45 * A class to add to a draggable item if it can be dragged to a textarea. 45 * A class to add to a draggable item if it can be dragged to a textarea.
46 * 46 *
47 * processClass: 47 * processedClass:
48 * A class to add to draggable items processed by DnD. 48 * A class to add to draggable items processed by DnD.
49 *
50 * droppedClass:
51 * A class to add to images that are dropped (by default, this is used to
52 * ensure that a successful drop manifests the editor representation only
53 * once.)
49 * 54 *
50 * interval: 55 * interval:
51 * How often to check the iframe for a drop, in milliseconds. 56 * How often to check the iframe for a drop, in milliseconds.
52 * 57 *
53 * Usage notes: 58 * Usage notes:
98 } 103 }
99 return false; 104 return false;
100 }, 105 },
101 processIframeDrop: function(drop, id_selector) { 106 processIframeDrop: function(drop, id_selector) {
102 var representation_id = opt.idSelector(drop); 107 var representation_id = opt.idSelector(drop);
103 $(drop).replaceWith(representation_id).wrap('<p class="dnd-dropped"></p>'); 108 $(drop).replaceWith(representation_id).wrap('<p class="'+ opt.droppedClass +'"></p>');
104 }, 109 },
105 processTextAreaClick: function(target, clicked, representation_id) { 110 processTextAreaClick: function(target, clicked, representation_id) {
106 var snippet = '<div><img src="'+ representation_id +'" /></div>'; 111 var snippet = '<div><img src="'+ representation_id +'" /></div>';
107 $(target).replaceSelection(snippet, true); 112 $(target).replaceSelection(snippet, true);
108 e.preventDefault(); 113 e.preventDefault();
109 }, 114 },
110 processIframeClick: function (target, clicked, representation_id) { return true; }, 115 processIframeClick: function (target, clicked, representation_id) { return true; },
111 116
112 iframeTargetClass: 'dnd-iframe-target', 117 iframeTargetClass: 'dnd-iframe-target',
113 textareaTargetClass: 'dnd-textarea-target', 118 textareaTargetClass: 'dnd-textarea-target',
114 processedClass: 'dnd-processed' 119 processedClass: 'dnd-processed',
120 droppedClass: 'dnd-dropped'
115 121
116 }, opt); 122 }, opt);
117 123
118 // Initialize plugin 124 // Initialize plugin
119 var targets = opt.processTargets(opt.targets); 125 var targets = opt.processTargets(opt.targets);
120 126
121 // Watch iframes for changes 127 // Watch iframes for changes
122 $(targets).filter('iframe').each(function() { 128 $(targets).filter('iframe').each(function() {
123 var target = this; 129 var target = this;
124 var t = setInterval(function() { 130 var t = setInterval(function() {
125 $('img:not(.dnd-dropped)', $(target).contents()).each(function() { 131 $('img:not(.'+ opt.droppedClass +')', $(target).contents()).each(function() {
126 opt.processIframeDrop.call(target, this, opt.idSelector); 132 opt.processIframeDrop.call(target, this, opt.idSelector);
133 var data = {'drop': this, 'representation_id': opt.idSelector(this)};
134
135 // Trigger event in container window
136 $(target).trigger('dnd_drop', data);
137
138 // Trigger event in iframe
139 $(this).trigger('dnd_drop', data);
127 }); 140 });
128 }, opt.interval); 141 }, opt.interval);
129 142
130 // Track current active timers -- developers working with DnD 143 // Track current active timers -- developers working with DnD
131 // can implement their own garbage collection for specific 144 // can implement their own garbage collection for specific
138 151
139 // Process each draggable element 152 // Process each draggable element
140 return this.each(function() { 153 return this.each(function() {
141 if ($(this).is('img')) { 154 if ($(this).is('img')) {
142 var element = this, $element = $(element); 155 var element = this, $element = $(element);
143
144 var representation_id = opt.idSelector(element); 156 var representation_id = opt.idSelector(element);
145 157
146 if (!representation_id) { 158 if (!representation_id) {
147 return this; 159 return this;
148 }; 160 };