Drag & Drop : liste bloquée et remplacements

Bonjour,

Je bloque sur une programmation Drag & Drop, pour la création d'emploi du temps. J'ai un ensemble de "briques" (séances avec des classes), et un tableau avec jours et horaires. Je souhaite intégrer les briques dans le tableau, jusque-là pas de souci. Par contre, je souhaite que l'ensemble des briques restent disponibles (je peux avoir deux fois une brique dans l'emploi du temps), là je ne trouve pas comment faire. Et je souhaite que le déplacement sur une cellule occupée entraîne le remplacement de l'ancienne brique par la nouvelle. Je parcours les forums depuis deux jours pour trouver comment faire, si jamais c'est possible, mais je ne vois rien.

Les parties concernées de mon code sont :

1. L'affichage des briques sur la droite de l'écran :

echo '<div id="edt_briques" ondrop="drop(event)" ondragover="allowDrop(event)">';
			// instructions SQL
<div class="cartouche" draggable="true" style="background-color:'.$bgcolor.';" name="'.$briksup['brik_id'].'" id="drag'.$briksup['brik_id'].'"><span>'.$briksup['division'].'';
				if($briksup['code']!="") {
					echo ' - '.$briksup['code'].'';
				}
				if($seq_nomaff!="") {
					echo '<br />'.$seq_nomaff.'';
					if($seq_nomaff!=$seq_info['seq_nom']) {
						echo '...';
					}
				}
				echo '</span></div><br />';
			}
			echo '</div>';

2. Le cœur du tableau avec la réception des briques :

// les plages horaires :
				for ($h = 0; $h < $hor_nb; $h++)
				{
					echo '<tr>
					<th class="heure" ';
					if($interH[$h]==1) {
						echo ' style="height:40px;"';
					}
					echo '>
						<div>'.$plageH[$h].'</div>
					</th>';
			 
					// les réceptions de briques :
						for ($j = 1; $j < $nbJour+1; $j++)
						{
							echo '<td class="recept" ondrop="drop(event)" ondragover="allowDrop(event)">
							</td>';
						}
						echo '</td>
						</tr>';
				}

3. Les fonctions :

<script>
		function handleDragStart(ev) {
			ev.dataTransfer.setData("text", ev.target.id);
		}
		var cols = document.querySelectorAll('#edt_briques .cartouche');
		[].forEach.call(cols, function(col) {
		  col.addEventListener('dragstart', handleDragStart, false);
		});
		function allowDrop(ev) {
			ev.preventDefault();
		}
		function drop(ev) {
			if (ev.stopPropagation) ev.stopPropagation();
			ev.preventDefault();
			var brik_id = ev.dataTransfer.getData("text");
			var theitem = document.getElementById(brik_id);
			// theitem.parentNode.removeChild(theitem);
			ev.target.appendChild(document.getElementById(brik_id));
			return false;
		}
        </script>