UNPKG

jointjs

Version:

JavaScript diagramming library

47 lines (46 loc) 1.67 kB
<!DOCTYPE html> <html> <head> <meta charset="utf8"/> <title>Jigsaw Puzzle</title> <link rel="stylesheet" type="text/css" href="../../build/joint.css" /> <style> body { background: black; color: #ddd; } #paper { border: 1px solid #ddd; background: radial-gradient(ellipse at center, #45484d 0%,#000000 100%); margin: auto; } #controls { margin: auto; text-align: center; } </style> </head> <body> <div id="paper"></div> <div id="controls"> <label for="image-picker">Image:</label> <select id="image-picker"> <option value="./images/cow.jpg" selected>cow</option> <option value="./images/mountain.jpg">mountain</option> <option value="./images/tree.jpg">tree</option> </select> <label for="size-picker">Size:</label> <select id="size-picker"> <option value="[2,2,200]">small</option> <option value="[4,5,100]" selected>normal</option> <option value="[20,20,50]">large</option> </select> </div> <!-- Dependencies: --> <script src="../../node_modules/jquery/dist/jquery.js"></script> <script src="../../node_modules/lodash/lodash.js"></script> <script src="../../node_modules/backbone/backbone.js"></script> <script src="../../build/joint.js"></script> <script src="./src/puzzle.js"></script> </body> </html>