-
Notifications
You must be signed in to change notification settings - Fork 2
/
main.html
executable file
·106 lines (105 loc) · 7.22 KB
/
main.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="main.css">
<title>Black Board</title>
<link rel="icon" href="logoshort.jpg" type="image/jpg">
</head>
<body>
<div id="sidepanelin" onclick="toggle_sidepanel()"><img src="Double Chevron Right.svg" width="100%" height="100%"></div>
<div id="toolbox">
<div id="toolboxclose">
<div id="logoholder" onclick="toggle_sidepanel()"><!--<a href="https://contentcreator.netlify.app/">--><img id="logo" src="logo.jpg"><!--</a>--></div>
<div id="sidepanelout" onclick="toggle_sidepanel()"><img id="reverseimg" align="middle" src="Double Chevron Right.svg"></div>
</div>
<a href="https://forms.gle/Yvnn4JJyaKFxoQeK6"><marquee>Submit Your Feedback Please! (Click Me)</marquee></a>
<div id="toolscontainer">
<h5>Tools</h5>
<button class="tools" id="pencil" onclick="start_pencil()"><img id="icon" src="Pen.svg"></button>
<button class="tools" id="eraser" onclick="start_eraser()"><img id="icon" style="width:21px;height:21px" src="eraser.png"></button>
<button class="tools" onclick="document.body.requestFullscreen();full_screen=true"><img id="icon" src="Fullscreen.svg"></button>
<button class="tools" onclick="resize()"><img id="icon" src="Expand.svg"></button>
</div>
<div id="drawingtools">
<h5>Drawing Tools</h5>
<button class="tools" id="lines" onclick="start_line_drawing()" style="width:100%">Draw Lines</button>
<button class="tools" id="circle" onClick="start_circle_drawing()" style="width: 100%">Draw Circles</button>
<button class="tools" id="rectangle" onClick="start_rect_drawing()" style="width: 100%">Draw Rectangles</button>
<button class="tools" id="select" onClick="start_select_function()" style="width: 100%">Select</button>
<button class="tools" id="text" onClick="start_text_input()" style="width: 100%">Insert Text</button>
</div>
<div id="toolproperties">
<h5>Tool Properties</h5>
<div id="properties" style="width:85%">Stroke:<input id="strokewidth" value="5" type="range" min="1" max="100" placeholder="Example: 1"></input></div>
<div id="properties" style="width:45%">Pen:<input id="strokecolor" value="#ffffff" type="color"></div>
<div id="properties" style="width:45%">Board:<input id="boardcolor" value="#1F6953" type="color"></div>
</div>
<div id="actions">
<h5>Actions</h5>
<button class="action" id="action1" onclick="clear_page(cntx)"><span class="tooltiptext" style="bottom:115%;left: 0%;">Clear Page</span><img id="icon" src="Clear.svg"></button>
<button class="action" id="action4" onclick="download_img()" alt="Download as .jpg"><span class="tooltiptext" style="bottom:115%;left:-100%;">Dowload Image</span><img id="icon" src="Capture.svg"></button>
<button class="action" id="action7" onclick="to_pdf()"><span class="tooltiptext" style="bottom:115%;right:0%;">Dowload PDF</span><img id="icon" src="Document.svg"></button>
<button class="action" id="action2" onclick="start_recording()"><span class="tooltiptext" style="bottom:235%;left:0%;">Start Recording</span><img id="icon" src="Record.svg"></button>
<button class="action" id="action10" onclick="toggle_recording()" disabled="true"><span class="tooltiptext" style="bottom:235%;left:-100%;">Pause/Resume</span><img id="icon" src="Pause.svg"></i></button>
<button class="action" id="action3" onclick="stop_recording()"><span class="tooltiptext" style="bottom:235%;right:0%;">Stop Recording</span><img id="icon" src="Stop.svg"></button>
<button class="action" id="action8" onclick="undo()"><span class="tooltiptext" style="bottom:355%;left:0%;">Undo</span><img id="icon" src="Undo.svg"></button>
<button class="action" id="action9" onclick="redo()"><span class="tooltiptext" style="bottom:335%;left:-100%;">Redo</span><img id="icon" src="Redo.svg"></button>
<button class="action" id="action5" onclick="new_page()" style="width:100%">New Page</button>
<button class="action" id="action6" onclick="previous_page()" style="width:100%">Previous Page</button>
</div>
<div id="insertimage">
<h5>Insert Image:</h5>
<input id="furl" style="width:100%" type="file" onchange="previewImage(this);" accept="image/*">
</div>
<div id="linkholder">
<h5>Links</h5>
<button class="action" onclick="window.open('index.html')" style="width:100%">Home</button>
<button class="action" onclick="window.open('supportandtips.html')" style="width:100%">Support & Tips</button>
<button class="action" onclick="window.open('contactus.html')" style="width:100%">Contact Us</button>
<!--<video id="testv" height="1000px" width="100px" controls>
</video>-->
</div>
</br>
<div style="font-size:12px;display:block; width:100%;float:left">
</br>Attributions:</br>
Some icons made by <a href="https://www.flaticon.com/authors/kiranshastry" title="Kiranshastry">Kiranshastry</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a>
</br></br>
Many icons also from <a href="https://www.systemuicons.com">System UIcons</a>
</div>
</div>
<div id="pagecontainer">
<canvas id="canvas1">
<p>Your Browser is not supported by this web app. We regret the inconveniance caused.</p>
<p>Please try one of these supported browsers:</p>
<p><a href="www.mozilla.org">Mozilla Firefox</a></p>
<p><a href="www.google.com/chrome">Google Chrome</a></p>
<p><a href="#"></a></p>
</canvas>
<canvas id="canvas2" height="0" width="0"></canvas>
<canvas id="canvas3" height="0" width="0">
<p>Your Browser is not supported by this web app. We regret the inconveniance caused.</p>
<p>Please try one of these supported browsers:</p>
<p><a href="www.mozilla.org">Mozilla Firefox</a></p>
<p><a href="www.google.com/chrome">Google Chrome</a></p>
<p><a href="#"></a></p>
</canvas>
<div id="image_input_menu">
<label style="width:48%;float:left">Width:<input type="number" class="input_image_dimensions" id="input_image_width" name="input_image_width" value="300"></label>
<label style="width:48%;float:left">Height:<input type="number" class="input_image_dimensions" id="input_image_height" name="input_image_height" value="200"></label>
<h5>Preview:</h5>
<img id="preview" width="300" height="200">
<button class="action" style="width:100%" onclick="imgavailable()">Add Image to Board</button>
</div>
<div class="notifier" id="notifier1">
</div>
</div>
<!--<script src="https://www.webrtc-experiment.com/screenshot.js"></script>-->
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="main2.js"></script>
<script type="text/javascript" src="RecordRTC.min.js"></script>
<script type="text/javascript" src="videocapture.js"></script>
<script type="text/javascript" src="jspdf.min.js"></script>
</body>
</html>