dragon_drop demo with dynamic popups

Basic demo of dragon_drop with popups generated in response to button press.

by Erin Nolan

HTML

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="https://rawgit.com/BluePigeons/dragon_drop/master/dragondrop.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="https://rawgit.com/BluePigeons/dragon_drop/master/dragondrop.js"></script>
<body>
<div data-role="main" class="ui-content">
  <div id="main page" class="container">

    <div class="row" id="test-min-bar">
  <!--minimising bar to go here-->
    </div>

    <div class="row">
      <button id="test_add_new">Test Add New Popup</button>
    </div>

    <div class="row" id="test-page-body">
  <!--popups to be added here-->
    </div>
    
  </div>
</div>
</body>

CSS

#test-min-bar {
  height: 20px;
}

JavaScript

$("#test_add_new").on("click", function() {
  add_dragondrop_pop("test", "<p>this</p>", "test-page-body", true);
});
var someoptions = {
  "minimise" : true,
  "initialise_min_bar" : "test-min-bar"
};
initialise_dragondrop("test-page-body", someoptions);