Initial

b4oshany · Mar 20, 2017 · 75deb5c · 75deb5c
commit 75deb5c
Show file tree

Hide file tree

Showing 30 changed files with 1,733 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+bower_components
diff --git a/README.md b/README.md
@@ -0,0 +1,5 @@
+# fabricjs-polygon
+Draw polygon using mouse in fabricjs
+
+Demo URL:
+http://taqimustafa.com/demo/polygon/
diff --git a/css/fab-annotate.css b/css/fab-annotate.css
@@ -0,0 +1,35 @@
+.icon-trash {
+    width: 24px !important;
+    height: 24px !important;
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA70lEQVR42mNkoBAwYhNUVlLyEBUTswcy/8HEXr9+feXu3bvLcRrAxsYmoqurmwgUYFRUVPS6f//+UaDwN6g0s7yCgtvDBw82/QcaevHixdl//vz5iGIAPz+/lbu7+1FinL1161b9r1+/XkL3ArOAgICTjrZ2PQsrKwMbEDOzsIAl/v79y/D7928wvnbt2oR3796tg3kPJQyEBAXtHB0dD4I0AMOAAehMBnZ2djD9/v17BkZGRoZDBw+Gv3r9ehXWQBw1YNQAEODh5tbR0dWdyApMhSCNLLCUCDTg569fDL+B+Oq1a42fPn06hNUAcgAAgb/7Ef+L8wkAAAAASUVORK5CYII=);
+}
+
+.icon-edit {
+    width: 24px !important;
+    height: 24px !important;
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABVklEQVR42mNkIBGoaWvYMzEx/f729euTR/cePmIkRbO6tmYQIxNjHZB5BIjTv3z6LEW0AUDNwUDNjUDmBSCOAuKe////byXKAKDmEKDmJiDzChCHAvE8IDb9+/dvKkEDoJqbgcyrQBwMxMuA2PDfv38lt67e2MZIhOYWIPMaEAcC8QqQ5v///pfevHp9M0gNIwHNrUDmdSD2B+JVQKwP1FwO1LwRpo4Rh2ZQgLUhaV4DxHpQzRuQ1TJi0QyKqnYsmiuAmtejq2fEorkD6meQ5rVArAvUXAnUvA6baxmRNAcCNXdDQ9sPSXMVUPNaXGEFN0BDVwtmAyi0Qf7UIqQZwwtAQx4xQFKaBlBzDVDzKgYCgFFSRoqTX1BgN5CdeuPytesglwCT6JqbV64vI6QZbICyhmogKysryPkHgAY4EqMJ1QB1FRtGRibZ79++7Xz66Mk7Ug0AAAWgjeZ5lkmtAAAAAElFTkSuQmCC);
+}
+
+img.fab-hide{
+    display: none !important;
+}
+
+.fab-annotate-btn {
+    position: absolute;
+    width: 200px;
+    background: rgba(0,0,0,.3);
+    padding: 5px 10px;
+    left: 10px;
+    top: 10px;
+    z-index: 10000000;
+    color: white;
+    font-weight: bold;
+    border-radius: 20px;
+}
+
+dic.fab-canvas {
+}
diff --git a/css/materialize.min.css b/css/materialize.min.css
diff --git a/font/material-design-icons/LICENSE.txt b/font/material-design-icons/LICENSE.txt
diff --git a/font/material-design-icons/Material-Design-Icons.eot b/font/material-design-icons/Material-Design-Icons.eot
diff --git a/font/material-design-icons/Material-Design-Icons.svg b/font/material-design-icons/Material-Design-Icons.svg
diff --git a/font/material-design-icons/Material-Design-Icons.ttf b/font/material-design-icons/Material-Design-Icons.ttf
diff --git a/font/material-design-icons/Material-Design-Icons.woff b/font/material-design-icons/Material-Design-Icons.woff
diff --git a/font/material-design-icons/Material-Design-Icons.woff2 b/font/material-design-icons/Material-Design-Icons.woff2
diff --git a/font/roboto/Roboto-Bold.ttf b/font/roboto/Roboto-Bold.ttf
diff --git a/font/roboto/Roboto-Bold.woff b/font/roboto/Roboto-Bold.woff
diff --git a/font/roboto/Roboto-Bold.woff2 b/font/roboto/Roboto-Bold.woff2
diff --git a/font/roboto/Roboto-Light.ttf b/font/roboto/Roboto-Light.ttf
diff --git a/font/roboto/Roboto-Light.woff b/font/roboto/Roboto-Light.woff
diff --git a/font/roboto/Roboto-Light.woff2 b/font/roboto/Roboto-Light.woff2
diff --git a/font/roboto/Roboto-Medium.ttf b/font/roboto/Roboto-Medium.ttf
diff --git a/font/roboto/Roboto-Medium.woff b/font/roboto/Roboto-Medium.woff
diff --git a/font/roboto/Roboto-Medium.woff2 b/font/roboto/Roboto-Medium.woff2
diff --git a/font/roboto/Roboto-Regular.ttf b/font/roboto/Roboto-Regular.ttf
diff --git a/font/roboto/Roboto-Regular.woff b/font/roboto/Roboto-Regular.woff
diff --git a/font/roboto/Roboto-Regular.woff2 b/font/roboto/Roboto-Regular.woff2
diff --git a/font/roboto/Roboto-Thin.ttf b/font/roboto/Roboto-Thin.ttf
diff --git a/font/roboto/Roboto-Thin.woff b/font/roboto/Roboto-Thin.woff
diff --git a/font/roboto/Roboto-Thin.woff2 b/font/roboto/Roboto-Thin.woff2
diff --git a/index.html b/index.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Fabric Polygon</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
+    <!--        <link rel="stylesheet" href="css/materialize.min.css">-->
+    <link rel="stylesheet" href="css/fab-annotate.css">
+</head>
+<style type="text/css">
+    * {
+        font-family: "Roboto", sans-serif;
+        font-weight: 100;
+    }
+</style>
+
+<body style="overflow:hidden;">
+    <div class="section no-pad-bot no-pad-top">
+        <img class="fab-annotate" src="http://fabricjs.com/assets/jail_cell_bars.png" />
+    </div>
+
+    <div data-toggle="popover"
+         data-trigger="focus"
+         title="Dismissible popover"
+         id="fab-input-field"
+         data-html="true"
+         data-content="">
+        *
+    </div>
+
+    <script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
+    <script type="text/ecmascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
+    <script type="text/javascript" src="js/fabric.min.js"></script>
+    <script type="text/javascript" src="js/fab-annotate.js"></script>
+
+</body>
+
+</html>