Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 10 additions & 6 deletions common/src/web/dragAndDropTest.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<style>
<!--
.dragme{position:relative;}
.hidden{visibility: hidden;}
-->
</style>
<script language="JavaScript1.2">
Expand Down Expand Up @@ -83,20 +84,23 @@
}
}

document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false");
document.onmousedown = selectmouse;
document.onmouseup = new Function("isdrag=false");
document.querySelectorAll('.hidden').forEach(item => {
item.classList.remove('hidden');
})

//-->
</script>



<img src="icon.gif" class="dragme" id="test1"><br>
<img src="icon.gif" class="dragme" id="test2"><br>
<img src="icon.gif" class="dragme hidden" id="test1"><br>
<img src="icon.gif" class="dragme hidden" id="test2"><br>
<b>"Hi there</b>
<div style="position: absolute; left: 210px; top: 80px; height: 400px; width: 100px; padding: 10em;">
<img src="icon.gif" class="dragme" id="test3"><br>
<img src="icon.gif" class="dragme" id="test4"><br>
<img src="icon.gif" class="dragme hidden" id="test3"><br>
<img src="icon.gif" class="dragme hidden" id="test4"><br>
</div>
</body>
</html>
43 changes: 22 additions & 21 deletions common/src/web/draggableLists.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,41 +14,42 @@
</style>
<script type="text/javascript">
$(function() {
$("#sortable1, #sortable2").sortable({
connectWith: '.connectedSortable'
}).disableSelection();
$("#sortable1, #sortable2").sortable({
connectWith: '.connectedSortable'
}).disableSelection();

var report_event = function(report_text) {
var reportElement = $("#dragging_reports");
var origText = reportElement.text();
reportElement.text(origText + " " + report_text);
}

$("#sortable2").droppable({
out: function(event, ui) {
report_event("DragOut");
}
});
var report_event = function(report_text) {
var reportElement = $("#dragging_reports");
var origText = reportElement.text();
reportElement.text(origText + " " + report_text);
}

$("#sortable1").droppable({
drop: function(event, ui) {
report_event("DropIn " + ui.draggable.text());
}
});
$("#sortable2").droppable({
out: function(event, ui) {
report_event("DragOut");
}
});

$("#sortable1").droppable({
drop: function(event, ui) {
report_event("DropIn " + ui.draggable.text());
}
});
$("#sortable1, #sortable2").show();
});
</script>
</head>
<body>
<div class="demo">
<ul id="sortable1" class="connectedSortable">
<ul id="sortable1" class="connectedSortable" style="display: none;">
<li id="leftitem-1" class="ui-state-default">LeftItem 1</li>
<li id="leftitem-2" class="ui-state-default">LeftItem 2</li>
<li id="leftitem-3" class="ui-state-default">LeftItem 3</li>
<li id="leftitem-4" class="ui-state-default">LeftItem 4</li>
<li id="leftitem-5" class="ui-state-default">LeftItem 5</li>
</ul>

<ul id="sortable2" class="connectedSortable">
<ul id="sortable2" class="connectedSortable" style="display: none;">
<li id="rightitem-1" class="ui-state-highlight">RightItem 1</li>
<li id="rightitem-2" class="ui-state-highlight">RightItem 2</li>
<li id="rightitem-3" class="ui-state-highlight">RightItem 3</li>
Expand Down
49 changes: 26 additions & 23 deletions common/src/web/droppableItems.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,42 +11,45 @@
#droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
</style>
<script type="text/javascript">
$(function() {
$("#draggable").draggable();
$("#droppable").droppable({
drop: function(event, ui) {
$(this).addClass('ui-state-highlight').find('p').html('Dropped!');
$(function () {
$("#draggable").draggable();
$("#droppable").droppable({
drop: function () {
$(this).addClass('ui-state-highlight').find('p').html('Dropped!');
}
});

const report_event = function (report_text) {
const reportElement = $("#drop_reports");
const origText = reportElement.text();
reportElement.text(origText + " " + report_text);
}
});

var report_event = function(report_text) {
var reportElement = $("#drop_reports");
var origText = reportElement.text();
reportElement.text(origText + " " + report_text);
}
$('body').mousedown(function () {
report_event('down');
});

$('body').mousedown(function() {
report_event('down');
});
$('body').mousemove(function () {
report_event('move');
});

$('body').mousemove(function() {
report_event('move');
});
$('body').mouseup(function () {
report_event('up');
});

$('body').mouseup(function() {
report_event('up');
});
});
$("#droppable").show();
$("#draggable").show();
});
</script>
</head>
<body>
<div class="demo">

<div id="draggable" class="ui-widget-content">
<div id="draggable" class="ui-widget-content" style="display: none;">
<p>Drag me to my target</p>
</div>

<div id="droppable" class="ui-widget-header">
<div id="droppable" class="ui-widget-header" style="display: none;">
<p>Drop here</p>
</div>

Expand Down
2 changes: 2 additions & 0 deletions common/src/web/macbeth.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@
</HEAD>
<body bgcolor="#ffffff" text="#000000">

<h1>The Tragedy of Macbeth</h1>

<!-- Originally from http://shakespeare.mit.edu/macbeth/full.html -->

<a href="#5.8.86">Quick link to last speech</a>
Expand Down
Loading
Loading