Hugging Face's logo

Spaces:
Marthee
/
MeasurementTesting
Sleeping

App Files Community
Marthee commited on
Commit
b3468d1
·
1 Parent(s): 4fc5744

Update templates/proposed-GUI.html

Browse files
Files changed (1) hide show
  1. templates/proposed-GUI.html +1218 -362
templates/proposed-GUI.html CHANGED
@@ -2,99 +2,188 @@
2
  <!DOCTYPE html>
3
  <html lang="en" dir="ltr">
4
  <head>
 
 
5
  <link rel="stylesheet" href="static/style.css">
6
  <meta charset="utf-8">
7
  <title>ADR Console - V2</title>
8
 
9
  </head>
10
  <body>
11
- <ul>
 
 
 
 
 
12
  <label id="pagetitle">ADR Console</label>
13
- </ul>
14
-
 
 
 
15
 
16
- <button class="accordion">User Guide</button>
17
- <div class="panel">
18
- <p>will enter user guide here</p>
19
- </div>
20
- <div id="backgroundimg">
21
-
22
- <iframe id="pdfiframeid0" src="https://research.google.com/pubs/archive/44678.pdf" style=" visibility:hidden; width:700px; height: 400px;"> </iframe>
23
 
24
- </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
25
 
26
  <form method="post" onsubmit=getData() id="myForm" >
27
  <div id ="">
28
- <select name="selectproj" class="selectionsProj" oninput="getproj()" >
29
- <option value="" disabled selected hidden>Project</option>
 
 
 
 
 
 
 
 
30
  <option value="BMW job1">BMW job1</option>
31
- <option value="BMW job2">BMW job2</option>
32
  </select>
33
  </div>
34
 
35
  <div id ="projectpart">
36
- <select name="selectprojp" class="selectionsProjp" id="selectionsProjpid">
37
  <option value="" disabled selected hidden >Project Part</option>
38
 
39
  </select>
40
  </div>
41
 
42
  <div id ="projectsection">
43
- <select name="selectprojs" class="selectionsProjs">
44
- <option value="" disabled selected hidden>Project Section</option>
45
- <option value="NRM Section-A">NRM Section-A </option>
46
- <option value="NRM Section-B">NRM Section-B</option>
47
  </select>
48
  </div>
49
 
50
- <br>
51
  <div id ="tomeasurediv">
52
- <label id="measureLabel">To Measure</label> <br>
53
  <div id="measureCheckbox">
54
-
55
- <!-- {% for item in mylist %}
56
- <input type="checkbox" value= {{item}} name=tomeasure_{{item}} class=tomeasure{{item}}>
57
- <label for="tomeasure"> {{item}}</label>
58
- {% endfor %} -->
59
  </div>
60
  </div>
61
- <br>
62
  <div id ="relvDocdiv">
63
- <label id="relvDocLabel">Relevant Documents</label> <br>
64
  <div id ="relvdiv">
65
- <!-- {% for item in mylist %}
66
- <input type="checkbox" id="relvDoc" value= {{item}} name=relvname_{{item}} class=relv{{item}}>
67
- <label for="relvDoc">{{item}}</label>
68
- {% endfor %} -->
69
  </div>
 
 
 
70
  </div>
71
  <br>
72
- <div id="radiosColors">
73
- <input type="radio" id="radio" name="fullimage" value="0" oninput="colors()">
74
- <label id=radiolbl for="fullimage" > Measure full image </label>
75
-
76
- <input type="radio" id="radio" name="fullimage" value="220" oninput="colors()">
77
- <label id=radiolbl for="levelimage" > Measure specific regions (Levels) </label>
78
- <br><br>
79
- <label id=nLevels style="visibility:hidden" name="levelsnamelabel" >Number of levels found in this plan</label><br>
80
- <input id=lvlinput style="visibility:hidden" type="number" id="colornumber" name="levelsnameinput" oninput="generatecolorPickers()"><br>
81
  <div id="colorpickers">
82
  <!-- -->
83
  </div>
84
 
85
  </div>
86
- <br> <br> <br>
 
87
  <div id ="saveOPdiv">
88
- <input type="checkbox" id="saveOP" value="saveopv" name="name3">
89
- <label id="saveOPlabel" for="saveOP"> Save Output</label> <button id="measureADRbutton">Measure using ADR</button>
90
 
91
  </div>
92
- <br> <br>
93
- <div id="googlesheetLabeldiv">
94
-
95
- </div>
96
- <span id="audio"></span>
97
- <br> <br>
98
  </form>
99
  <script src="https://cdn.lordicon.com/bhenfmcm.js"></script>
100
  <lord-icon
@@ -102,44 +191,24 @@
102
  trigger="hover" colors="primary:black" id="addicon" onclick="duplicate({{mylist}})">
103
  </lord-icon>
104
 
105
- <form action="/forward/" method="post">
 
106
  <div id ="duplicater" class="duplicaterclass">
107
- <select name="measurementscripts" class="measurementselections" id="measurementselectionsid" >
108
- <!-- <option value="" disabled selected hidden>Ground Beams</option> -->
109
  <option value="ground beams" >Ground Beams </option>
110
  <option value="pile caps"> Pile Caps</option>
111
  </select>
112
- <br>
113
- <!-- <input type="checkbox" id="area" value="area" name="area" class="area">
114
- <label for="area" id="area"> Area</label>
115
-
116
- <input type="checkbox" id="pattern" value="pattern" name="pattern" class="pattern">
117
- <label for="pattern" id="pattern"> Pattern</label>
118
-
119
- <input type="checkbox" id="border" value="border" name="border" class="border">
120
- <label for="border" id="border" > Border</label>
121
-
122
- <input type="checkbox" id="length" value="length" name="length" class="length">
123
- <label for="length" id="length"> Length</label>
124
-
125
- <input type="checkbox" id="match" value="match" name="match" class="match">
126
- <label for="match" id="match"> Match</label>
127
- <br> -->
128
- <select name="measureitem" class="measureitems" oninput="get3rddropdown()" id="measureitemsid">
129
- <!-- <option value="" disabled selected hidden>Area</option> -->
130
- <option value="area" >Area </option>
131
- <option value="perimeter"> Perimeter</option>
132
- <option value="length" disabled> Length</option>
133
- <option value="count" disabled> Count</option>
134
  </select>
135
 
136
- <select name="select" class="selections" id="selectionsid">
137
- <!-- <option value="" disabled selected hidden>Choose value</option> -->
138
- <!-- <option value="hi">hi </option>
139
- <option value="11aaa"> 11</option> -->
140
- </select>
141
  <br>
142
- <div id="repeatforloop" class="repeatforloopclass00" name="repeatforloopname " onchange="getmctName()">
143
 
144
 
145
  <input type="text" id="text0" name="text1name" placeholder="GB-1" class=gb>
@@ -159,39 +228,39 @@
159
 
160
  </div>
161
 
162
- <button id="doneebackground">
163
- <script src="https://cdn.lordicon.com/bhenfmcm.js"></script>
164
  <lord-icon
165
  src="https://cdn.lordicon.com/egiwmiit.json"
166
  trigger="hover"
167
  colors="primary:black"
168
- id="donebutton"
169
- type="submit">
170
- </lord-icon>
171
  </button>
172
 
173
- </form>
174
 
175
  <div hidden id ="duplicaterhidden" class="duplicaterclasshidden">
176
- <select name="measurementscripts" class="measurementselections" id="measurementselectionsid" >
177
- <!-- <option value="" disabled selected hidden>Ground Beams</option> -->
178
  <option value="ground beams" >Ground Beams </option>
179
  <option value="pile caps"> Pile Caps</option>
180
  </select>
181
 
182
- <select name="measureitem" class="measureitems" oninput="get3rddropdown()" id="measureitemsid">
 
 
 
183
  <!-- <option value="" disabled selected hidden>Area</option> -->
184
- <option value="area" >Area </option>
185
  <option value="perimeter"> Perimeter</option>
186
  <option value="length" disabled> Length</option>
187
- <option value="count" disabled> Count</option>
188
  </select>
189
 
190
- <select name="select" class="selections" id="selectionsid">
191
-
192
- </select>
193
  <br>
194
- <div id="repeatforloophidden" class="repeatforloopclasshidden" name="repeatforloopnamehidden " onchange="getmctName()">
195
 
196
 
197
  <input type="text" id="text0" name="text1name" placeholder="GB-1" class=gb>
@@ -216,11 +285,85 @@
216
  </body>
217
 
218
  </html>
219
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
220
  <script >
221
  ////////////////////////////////////////////////////////////////////////////////
222
  /* link to dropbox to view pdfs */
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
223
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
224
  ////////////////////////////////////////////////////////////////////////////////
225
  var dupliatei = 0; // i
226
  var clonedDivId=0;
@@ -236,6 +379,12 @@
236
  // or clone.id = ""; if the divs don't need an ID
237
  clone.id = 'duplicater' + ++dupliatei;
238
  clonedDivId=clone.id;
 
 
 
 
 
 
239
  clone.removeAttribute("hidden");
240
  clone.setAttribute('class','duplicaterclass'+dupliatei);
241
 
@@ -250,9 +399,9 @@
250
  clone.getElementsByClassName('measureitems')[0].setAttribute('class', 'measureitems'+dupliatei);
251
 
252
  // for (let i = 0; i < mylist.length; i++) {
253
- clone.getElementsByClassName('gb')[0].setAttribute('name', 'gb'+dupliatei);
254
- clone.getElementsByClassName('a')[0].setAttribute('name', 'a'+dupliatei);
255
- clone.getElementsByClassName('depth')[0].setAttribute('name', 'depth'+dupliatei);
256
  // }
257
 
258
  clone.getElementsByClassName('selections')[0].setAttribute('name', 'select'+dupliatei);
@@ -268,11 +417,11 @@
268
 
269
  }
270
  //accordion funv
271
- var acc = document.getElementsByClassName("accordion");
272
  var i;
273
 
274
- for (i = 0; i < acc.length; i++) {
275
- acc[i].addEventListener("click", function() {
276
  /* Toggle between adding and removing the "active" class,
277
  to highlight the button that controls the panel */
278
  this.classList.toggle("active");
@@ -281,197 +430,655 @@
281
  var panel = this.nextElementSibling;
282
  if (panel.style.display === "block") {
283
  panel.style.display = "none";
 
284
  } else {
285
  panel.style.display = "block";
 
286
  }
287
  });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
288
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
289
 
290
  function getproj(){
291
- $('#audio').html('<audio autoplay><source src="magic.mp3"></audio>');
292
-
 
 
 
 
293
  var proj = document.getElementsByClassName("selectionsProj")[0];
294
  var projectVal=proj.value.toString() //selected project
295
 
296
  var inputs = document.getElementsByTagName("select")[1]; //second dropdown(project part)
297
  var p=document.getElementById("selectionsProjpid") //project part
298
 
299
- //remove old dropdown options
 
300
  // var i, L = inputs.options.length - 1;
301
  // for(i = L; i >= 0; i--) {
302
  // inputs.remove(i);
303
  // }
304
 
305
  //send project name to python flask
306
- $.get( '/getmethod/'+projectVal);
307
- //get project name , parts (json file ) from python flask
308
- $.get("/getpythondata", function(data) {
 
 
 
309
 
310
 
311
- console.log(data)
312
- console.log(projectVal)
313
 
314
- var projectsfromname=data[1] // [0] name , [1] parts (array)
 
 
 
315
 
316
- var proj1 = document.getElementsByClassName("selectionsProjp")[0]
317
- var drp = document.getElementById("selectionsProjpid")
318
  //add a hidden option (not to be selected)
319
- var optn = document.createElement("OPTION")
320
- optn.text= 'Please Select a project part'
321
- optn.value= ""
322
- optn.hidden=true
323
- drp.add(optn)
324
-
325
- var meas = document.getElementById("measureCheckbox")
326
- var relv = document.getElementById("relvdiv")
327
- const measids=[]
328
  //add dropdown options== array
 
 
 
 
 
 
329
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
330
  for (i = 0; i < projectsfromname.length; i++) {
331
- var optn = document.createElement("OPTION")
332
-
333
- optn.text= projectsfromname[i]
334
- optn.value= projectsfromname[i]
335
- optn.id=data[0] + i
336
- drp.add(optn)
337
- /////////////////////////////////////
338
- var measCheckin= document.createElement("input")
339
- var measChecklbl= document.createElement("label")
340
-
341
- measCheckin.type='radio' /// checkbox
342
- measCheckin.value=projectsfromname[i]
343
- measCheckin.name='tomeasure'
344
- measChecklbl.id=projectsfromname[i].slice(0,projectsfromname[i].length-4)+'measID' +i
345
- measChecklbl.innerText=projectsfromname[i]
346
-
347
- meas.append(measCheckin)
348
- meas.append(measChecklbl)
349
- measids.push(measChecklbl)
350
- //////////////////////////////////////
351
- var relvCheckin= document.createElement("input")
352
- var relvChecklbl= document.createElement("label")
353
-
354
- relvCheckin.type='checkbox' //radio
355
- relvCheckin.value=projectsfromname[i]
356
- relvCheckin.name=projectsfromname[i] //'relvname'
357
- relvChecklbl.innerText=projectsfromname[i]
358
- relv.append(relvCheckin)
359
- relv.append(relvChecklbl)
360
-
361
 
362
  }
363
- console.log(measChecklbl)
364
-
365
- measids.forEach(function(elem) {
366
- elem.addEventListener("mouseover", function() {
367
- var panel = document.getElementById("pdfiframeid0");
368
- panel.style.visibility="visible";
369
- panel.style.display = "block";
370
-
371
- //panel.src= 'https://arxiv.org/pdf/2102.13468v1.pdf'
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
372
 
373
- console.log(elem)
374
- });
375
- elem.addEventListener("mouseout",function(){
376
- var panel = document.getElementById("pdfiframeid0");
377
- if (panel.style.display === "block") {
378
- panel.style.display = "none";
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
379
 
380
- }
381
- console.log('ouut')
382
- });
383
- // elem.addEventListener("click", function() {
384
- // var panel = document.getElementById("pdfiframeid0");
385
- // panel.style.visibility="visible";
386
- // panel.style.display = "block";
387
-
388
- // // panel.src= 'https://arxiv.org/pdf/2102.13468v1.pdf'
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
389
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
390
  // console.log(elem)
391
  // });
392
 
 
 
393
  });
394
 
395
  });
396
  }
397
-
398
  var spreadsheetId='';
 
 
 
 
 
 
 
399
  function getData(form) {
 
 
 
 
 
 
 
 
400
  var formData = new FormData(form);
 
 
 
401
  colorsarr=[];
402
  val=0;
403
  answers=[];
404
- // iterate through entries...
 
 
 
 
 
 
405
  for (var pair of formData.entries()) {
406
- console.log(pair[0] + ": " + pair[1]);
407
- if (pair[0]=='fullimage'){
408
- val=pair[1]; // 0 , 220
409
- console.log(val)
410
- // answers.push([val]);
411
- }
412
-
413
  if (pair[0].startsWith('color')){
414
  colorsarr.push(pair[1].substring(1));
415
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
416
 
417
- if (pair[0]=='tomeasure'){
418
- tomeasureproj=pair[1];
419
- // answers.push([tomeasureproj]);
 
 
420
 
421
- //send project name to python flask
422
- }}
423
- console.log([colorsarr]);
424
- answers.push(tomeasureproj, val,colorsarr);
425
- $.get('/projecttomeasure/'+ JSON.stringify(answers)).then( function(data) {
426
-
427
- console.log(data[0]);
428
- console.log(data[1]);
429
- console.log(data[2]);
430
- console.log(data[3]);
431
- spreadsheetId= data[3];
432
-
433
  var imgcanvas= document.createElement("img");
 
434
  imgcanvas.src= 'data:image/gif;base64,' +data[0];
435
  // imgcanvas.width=700;
436
  imgcanvas.height=600;
437
- imgcanvas.backgroundColor=(255,255,255);
438
-
439
  imgcanvas.alt="Larry";
440
  imgcanvas.style.zIndex=999;
441
- var backimg=document.getElementById('backgroundimg');
 
 
 
 
 
442
 
443
- backimg.append(imgcanvas);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
444
 
445
- var googlesheetLabel= document.createElement("a");
446
- var googlesheetLabeldivjs=document.getElementById('googlesheetLabeldiv');
447
-
448
- googlesheetLabel.href=data[2];
449
- googlesheetLabel.value=data[2];
450
- googlesheetLabel.text=data[2];
451
- googlesheetLabeldivjs.append(googlesheetLabel);
452
-
453
- })
454
 
 
 
 
 
 
 
455
 
 
 
 
 
456
 
457
-
458
- // }
459
- // }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
460
 
461
- }
462
 
 
 
 
 
463
  document.getElementById("myForm").addEventListener("submit", function (e) {
464
  e.preventDefault();
465
  getData(e.target);
466
  });
467
 
 
 
 
 
 
468
  ////////////////////////////////////////////
469
  var measitemVal=''
 
470
  function get3rddropdown(){
471
 
472
 
473
- var divduplicater= document.getElementsByClassName('duplicaterclass')[0].children;
474
 
 
 
475
  var inputs =divduplicater[0];// document.getElementsByClassName("measurementselections")[0]; //groundbeams
476
  console.log(inputs.value);
477
 
@@ -479,168 +1086,325 @@ function get3rddropdown(){
479
  measitemVal=measitem.value.toString() //selected project
480
  console.log(measitemVal);
481
 
482
- var selections = divduplicater[3]; //document.getElementsByClassName("selections")[0]; //second dropdown(project part)
483
-
484
 
 
485
  if (addciconval>0){
486
 
487
  for (let i =1 ; i <=addciconval ; i++){
488
  var inputs1 = document.getElementsByClassName("measurementselections"+i)[0]; //groundbeams
489
  console.log(inputs1.value);
490
 
491
- var measitem1 = document.getElementsByClassName("measureitems"+i)[0]; //area
 
 
492
  measitemVal1=measitem1.value.toString() //selected project
493
  console.log(measitemVal1);
494
 
495
  var selections1 = document.getElementsByClassName("selections"+i)[0]; //second dropdown(project part)
496
-
497
  // remove old dropdown options
498
- var q, L = selections1.options.length - 1;
499
- for(q = L; q >= 0; q--) {
500
- selections1.remove(q);
501
- }
502
- // var measCheckin= document.createElement("input")
503
- if (inputs1.value=='ground beams'){
504
- if (measitemVal1=='area'){
505
 
506
- var optn = document.createElement("OPTION") ;
507
- optn.text= 'Ground Beams:m2';
508
- optn.value= 'Ground Beams:m2';
509
- optn.id='gbA' ;
510
- selections1.add(optn);
511
- }
512
- else if (measitemVal1=='perimeter') {
513
- var optn = document.createElement("OPTION") ;
514
- optn.text= 'Ground Beams:m';
515
- optn.value= 'Ground Beams:m';
516
- optn.id='gbP';
517
- selections1.add(optn);
518
- }
519
- // else if (measitemVal=='length') {
520
- // var optn = document.createElement("OPTION") ;
521
- // optn.text= 'Ground Beams:m';
522
- // optn.value= 'Ground Beams:m';
523
- // optn.id='gbL0'
524
- // selections.add(optn);
525
- // var optn1 = document.createElement("OPTION") ;
526
- // optn1.text= 'Wall Subst:m';
527
- // optn1.value= 'Wall Subst:m';
528
- // optn1.id='gbL1' ;
529
- // selections.add(optn1);
530
  // }
 
 
 
 
 
 
 
 
531
  }
532
- else { //if (inputs.value=='pile caps')
533
- if (measitemVal1=='area'){
534
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
535
 
536
- var optn = document.createElement("OPTION") ;
537
- optn.text= 'Pile Caps:m2';
538
- optn.value= 'Pile Caps:m2';
539
- optn.id='pA' ;
540
- selections1.add(optn);
541
- }
542
- else if (measitemVal1=='perimeter') {
543
- var optn = document.createElement("OPTION") ;
544
- optn.text= 'Pile Caps:m';
545
- optn.value= 'Pile Caps:m';
546
- optn.id='pP';
547
- selections1.add(optn);
548
- }
549
- // else if (measitemVal=='length') {
550
- // var optn = document.createElement("OPTION") ;
551
- // optn.text= 'Ground Beams:m';
552
- // optn.value= 'Ground Beams:m';
553
- // optn.id='gbL0'
554
- // selections.add(optn);
555
- // var optn1 = document.createElement("OPTION") ;
556
- // optn1.text= 'Wall Subst:m';
557
- // optn1.value= 'Wall Subst:m';
558
- // optn1.id='gbL1' ;
559
- // selections.add(optn1);
560
- // }
561
  }
562
- }
563
- // console.log(arrmctNames[0][1]);
564
- }
565
 
 
 
 
 
 
 
 
566
 
567
- // remove old dropdown options
568
- var i, L = selections.options.length - 1;
569
- for(i = L; i >= 0; i--) {
570
- selections.remove(i);
571
- }
572
- // var measCheckin= document.createElement("input")
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
573
  if (inputs.value=='ground beams'){
574
- if (measitemVal=='area'){
 
 
575
 
576
  var optn = document.createElement("OPTION") ;
577
  optn.text= 'Ground Beams:m2';
578
  optn.value= 'Ground Beams:m2';
579
  optn.id='gbA' ;
580
  selections.add(optn);
581
- }
582
- else if (measitemVal=='perimeter') {
583
- var optn = document.createElement("OPTION") ;
584
- optn.text= 'Ground Beams:m';
585
- optn.value= 'Ground Beams:m';
586
- optn.id='gbP';
587
- selections.add(optn);
588
- }
589
- // else if (measitemVal=='length') {
590
- // var optn = document.createElement("OPTION") ;
591
- // optn.text= 'Ground Beams:m';
592
- // optn.value= 'Ground Beams:m';
593
- // optn.id='gbL0'
594
- // selections.add(optn);
595
- // var optn1 = document.createElement("OPTION") ;
596
- // optn1.text= 'Wall Subst:m';
597
- // optn1.value= 'Wall Subst:m';
598
- // optn1.id='gbL1' ;
599
- // selections.add(optn1);
600
  // }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
601
  }
602
- else { //if (inputs.value=='pile caps')
603
 
604
- if (measitemVal=='area'){
605
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
606
 
 
 
607
  var optn = document.createElement("OPTION") ;
608
  optn.text= 'Pile Caps:m2';
609
  optn.value= 'Pile Caps:m2';
610
- optn.id='pA' ;
611
- selections.add(optn);
612
- }
613
- else if (measitemVal=='perimeter') {
614
- var optn = document.createElement("OPTION") ;
615
- optn.text= 'Pile Caps:m';
616
- optn.value= 'Pile Caps:m';
617
- optn.id='pP';
618
  selections.add(optn);
619
- }
620
- // else if (measitemVal=='length') {
621
- // var optn = document.createElement("OPTION") ;
622
- // optn.text= 'Ground Beams:m';
623
- // optn.value= 'Ground Beams:m';
624
- // optn.id='gbL0'
625
- // selections.add(optn);
626
- // var optn1 = document.createElement("OPTION") ;
627
- // optn1.text= 'Wall Subst:m';
628
- // optn1.value= 'Wall Subst:m';
629
- // optn1.id='gbL1' ;
630
- // selections.add(optn1);
631
- // }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
632
  }
633
- }
634
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
635
 
636
  var repeatforloopI=0;
637
 
638
  function getmctName(){
639
-
640
- flag=0;
641
- arrall=[];
642
  arrmctNames=[];
643
  arrFinalMCNames=[];
 
 
 
 
 
 
 
644
  for (ii=0 ; ii<=addciconval; ii++){
645
 
646
 
@@ -648,27 +1412,31 @@ function getmctName(){
648
  if (ii==0){
649
  var divduplicater= document.getElementsByClassName('duplicaterclass')[0].children;
650
  console.log('divv ',divduplicater); //addicon .children[4]
651
- var selections = divduplicater[3][0];//document.getElementsByClassName("selections")[0];
652
- var div=divduplicater[5].children;//document.getElementById('repeatforloop').children
 
 
653
  var divValues=[div[0].value, div[1].value , div[2].value];
654
  mctname=[selections.value ,divValues , measitemVal ];
655
  console.log(mctname)
656
  if(div[0].value && div[1].value && div[2].value)
657
- { flag=1;
 
658
  arrmctNames.push( mctname);
659
  }
660
  }
661
  else if (ii>0){
662
  var divduplicater= document.getElementsByClassName('duplicaterclass'+ii)[0].children;
663
  console.log('dddd',divduplicater);
664
- selections = divduplicater[2][0];//document.getElementsByClassName("selections")[0];
665
- console.log(selections)
666
  div=divduplicater[4].children;
667
  var divValues=[div[0].value, div[1].value , div[2].value];
668
  mctname=[selections.value ,divValues , measitemVal ];
669
  console.log(mctname)
670
  if(div[0].value && div[1].value && div[2].value)
671
- { flag=1;
 
672
  arrmctNames.push( mctname);
673
  }
674
 
@@ -679,14 +1447,18 @@ function getmctName(){
679
  console.log(arrmctNames)
680
  // if (repeatforloopI>0){
681
  if (ii==0 ){
 
682
  count=0;
683
  var ii0selections='';
684
  var cc= (document.getElementsByClassName('repeatforloopclass'+ii.toString()+'0')[0]).parentNode.children;
 
685
  for (let o =0;o <=cc.length;o++)
686
  {
687
  if( cc[o] instanceof(HTMLDivElement) )
688
  count++;
689
- ii0selections=cc[3].value;
 
 
690
  }
691
  console.log(count);
692
  for (let i =1 ; i <count ; i++){
@@ -699,6 +1471,7 @@ if (ii==0 ){
699
  if(replicatedDivChildren[0].value && replicatedDivChildren[1].value && replicatedDivChildren[2].value)
700
  {
701
  // console.log(mctname1);
 
702
  arrmctNames.push(mctname1);
703
  }
704
  }
@@ -709,12 +1482,16 @@ if (ii==0 ){
709
  count=0;
710
  var ii0selections='';
711
  var cc= (document.getElementsByClassName('repeatforloopclass'+ii.toString()+'0')[0]).parentNode.children;
 
712
  for (let o =0;o <=cc.length;o++)
713
  {
714
  if( cc[o] instanceof(HTMLDivElement) )
715
  { count++;
716
  console.log('divvvv',cc[o])}
717
-
 
 
 
718
  // count++;
719
  // ii0selections=cc[3].value;
720
  }
@@ -727,11 +1504,12 @@ if (ii==0 ){
727
  // console.log(document.getElementsByClassName('repeatforloopclass'+ii.toString()+i.toString())[0].parentElement)
728
 
729
  var divValues2=[replicatedDivChildren[0].value, replicatedDivChildren[1].value , replicatedDivChildren[2].value];
730
- mctname1=[selections.value ,divValues2 , measitemVal];
731
  if(replicatedDivChildren[0].value && replicatedDivChildren[1].value && replicatedDivChildren[2].value)
732
  {
733
  // if (!(arrmctNames.includes(mctname1))){
734
  arrmctNames.push(mctname1);
 
735
  // console.log(arrmctNames)
736
  // }
737
  }
@@ -741,10 +1519,10 @@ if (ii==0 ){
741
 
742
  // }
743
 
744
- // else
745
- // {
746
- // //first entry only
747
- // arrFinalMCNames= arrmctNames.slice();
748
  // }
749
  console.log(arrmctNames)
750
 
@@ -764,6 +1542,7 @@ if(arrmctNames.length >1){
764
  // console.log('NAME = ' +name);
765
  if (arrmctNames[i][1][1] == arrmctNames[j][1][1] && arrmctNames[i][1][2] == arrmctNames[j][1][2])
766
  { var selectionsname=arrmctNames[i][0] ;
 
767
  console.log('foorrr',arrmctNames[i][1][1])
768
 
769
  if (allnames.includes(arrmctNames[i][1][0]) )
@@ -794,6 +1573,7 @@ if(arrmctNames.length >1){
794
  if (!name.includes(arrmctNames[i][1][1] ) ||!name.includes(arrmctNames[i][1][2] ) ){
795
  name.push( arrmctNames[i][1][1] , arrmctNames[i][1][2] );
796
  newarr.push(arrmctNames[i][1][1] , arrmctNames[i][1][2] );
 
797
  }
798
 
799
  }
@@ -802,6 +1582,7 @@ if(arrmctNames.length >1){
802
  console.log(measitemVal)
803
  // allnames.push(newarr );
804
  if (newarr.length >0){
 
805
  arrFinalMCNames.push([selectionsname , newarr, measitemVal ]);
806
 
807
 
@@ -809,14 +1590,42 @@ if(arrmctNames.length >1){
809
  }
810
 
811
  console.log('finals',arrFinalMCNames);
812
- arrall.push(arrFinalMCNames);
 
813
 
814
  }
 
815
  arrFinalMCNames.push([spreadsheetId]);
 
816
  }
 
817
  if (flag==1){
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
818
 
819
- $.get( '/mctnametoGoogleSheet/'+JSON.stringify(arrFinalMCNames));
 
 
 
 
 
 
820
  }
821
 
822
  }
@@ -843,9 +1652,13 @@ function addmctnameicon(){
843
  clone.id = 'repeatforloop'+ addciconval + ++jj;
844
  clone.setAttribute('class','repeatforloopclass'+addciconval+jj);
845
  clone.setAttribute('name','repeatforloopname'+addciconval+jj);
 
 
 
 
846
 
847
-
848
- dupDiv.appendChild(clone);//.insertBefore(document.getElementById('doneebackground'),null);
849
 
850
  console.log(dupDiv.children);
851
 
@@ -874,28 +1687,71 @@ function colors(){
874
  }
875
 
876
  }
877
-
 
878
  function generatecolorPickers(){
879
- var levelsin = document.getElementsByName('levelsnameinput')[0]; //number of colors -- color pickers
880
  var drp = document.getElementById("colorpickers");
 
 
 
881
  drp.innerHTML = '';
882
  console.log(levelsin.value)
883
  for (let i=0 ; i<levelsin.value ; i++)
884
  {
885
  var color = document.createElement("input");
886
  color.type='color';
887
- color.value='#000000';
888
  color.id= 'color';
889
  color.name='color'+i;
 
 
 
890
  drp.append(color);
 
891
  if (i==0)
892
  color.style.marginLeft='1%';
893
 
894
  }
895
  console.log(drp)
896
-
897
  }
 
 
898
 
899
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
900
  </script>
901
 
 
2
  <!DOCTYPE html>
3
  <html lang="en" dir="ltr">
4
  <head>
5
+ <link rel="stylesheet" href="https://use.typekit.net/zos0ars.css">
6
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
7
  <link rel="stylesheet" href="static/style.css">
8
  <meta charset="utf-8">
9
  <title>ADR Console - V2</title>
10
 
11
  </head>
12
  <body>
13
+ <!-- <ul>
14
+
15
+ <button class="accordion" >User Guide</button>
16
+
17
+ </ul> -->
18
+ <div class="navbar">
19
  <label id="pagetitle">ADR Console</label>
20
+ <div class="dropdown">
21
+ <p class="dropdownLinks"><a href="/templates/legendDirectory.html" target="_self">Legends History</a> </p>
22
+
23
+ <i class="fa fa-caret-down"></i>
24
+ <div class="dropbtnLinks-content">
25
 
26
+ </div>
27
+
28
+ <button class="dropbtn"> <i class="fa fa-info" aria-hidden="true"></i>
29
+ <i class="fa fa-caret-down"></i>
30
+ </button>
 
 
31
 
32
+ <div class="dropdown-content">
33
+ <div id="userguidetext">
34
+ <div id="textfirstpage">
35
+ <label style="font-style: oblique;"> <br>
36
+ Please read the following before you use this tool. </label>
37
+ <br><br>
38
+ <label style="font-style: oblique;" >Note : The algorithm is based on detecting shapes and colors from the plan. Some shapes such as tables and textboxes containing information about the plan may be seen as shapes as well, therefore inserted into the algorithm as well.
39
+ To avoid this, please clean up the plan before you choose to measure it
40
+ by erasing them or by drawing a white rectangle above them using any external tool. </label>
41
+ <br>
42
+
43
+ <br>
44
+ The tool is divided into two main parts:
45
+ <br>
46
+ <li id="userguideheadings"> First Part </li>
47
+ <br> You will find three dropdowns. Choose the name of the project you want to measure, along with the project part, and the project section.
48
+ <br > <br>
49
+ <label style="font-style: italic;"> Please double check the project section chosen as this chooses the code that will be applied to the plan. </label>
50
+ <br>
51
+ <br>
52
+ Mark the project you wish to meaure from the section labeled 'To measure'. You could also choose any relevant documents you wish to see (optional).
53
+ <br> <label style="font-style: italic;">Pixel to Metric conversion important notes : </label>When you choose to measure a specific plan, you will be provided with a pdf that has
54
+ a white rectangle drawn in it. Please open this pdf in Bluebeam and measure its area and perimeter and insert them in the textboxes that will be shown below.
55
+ When measuring this rectangle, you could consider it as the scale check done on Bluebeam.
56
+ <br> <br> <label style="font-style: italic;">Notes when measuring secion 1.0: </label>
57
+ <label id=info >Choose whether this project contains levels or not. If you wish to measure all of the plan, let the number of plans equal to one. If you wish to measure certain regions of the plan or have the plan divided into levels,
58
+ please type in a number greater than 1 (number of levels). </label>
59
+ <br> If you choose Measure specific regions, please draw shapes around the desired regions on Bluebeam or any external tool before choosing to measure this plan.
60
+ <br> You should also insert the colors of the levels in rgb format (Red-Green-Blue).
61
+
62
+ <br>
63
+
64
+ <i id="secondpage" class="fa fa-arrow-right" aria-hidden="true"></i>
65
+ <br>
66
+ </div>
67
+ <div id="textsecondpage" hidden=until-found>
68
+ <br>
69
+ <li id="userguideheadings" > Second part </li>
70
+ <br>
71
+ First, please open the google sheets link labeled 'Legend' and fill in the names of each shape.
72
+ <br>Ex. The first row shows the measurement of GB-1 , in the first column type in GB-1.
73
+ <br> After you are done with filling in the legend, go back to the ADR Console.
74
+ You will find three dropdowns and three textboxes.
75
+
76
+ <li style="list-style-type:square;"> The first dropdown will allow you to choose whether the shape is a ground beam or a pile cap. </li>
77
+ <li style="list-style-type:square;"> The second dropdown is the choice of (Area-perimeter-Length-Count).</li>
78
+ <li style="list-style-type:square;"> The third dropdown gives you the first part of the MC-T Name.</li>
79
+ <br> Then fill in the rows below the dropdowns with the corresponding detail and depth.
80
+ The plus button allows you to add more rows within this block.
81
+ <br>
82
+ There is another button above the dropdowns (to the right) that allows you to add another block and repeat the process for another item (Ground Beam or Pile Cap) or (Area-perimeter-Length-Count).
83
+ <br><br>
84
+ <i id="firstpage" class="fa fa-arrow-left" aria-hidden="true"></i>
85
+ <br>
86
+
87
+ </div>
88
+
89
+ </div>
90
+ </div>
91
+ <!-- <button class="dropbtnLinks">aa
92
+ <i class="fa fa-caret-down"></i>
93
+ </button> -->
94
+ </div>
95
+
96
+ </div>
97
+
98
+ <label hidden class=infotip >Choose whether this project contains levels or not. If you wish to measure all of the plan, let the number of plans equal to one. If you wish to measure certain regions of the plan or have the plan divided into levels,
99
+ please type in a number greater than 1 (number of levels). </label>
100
+ <div id="loading" hidden>
101
+
102
+ </div>
103
+ <div id="rightside">
104
+ <div id="backgroundimg" >
105
+
106
+ <!-- <iframe id="pdfiframeid0" src="https://research.google.com/pubs/archive/44678.pdf" style=" visibility:hidden; width:700px; height: 400px;"> </iframe>
107
+ -->
108
+ </div>
109
+ <div id="underimgbuttons"> </div>
110
+
111
+ </div>
112
 
113
  <form method="post" onsubmit=getData() id="myForm" >
114
  <div id ="">
115
+ <select name="selectproj" class="selectionsProj" required >
116
+
117
+ <!-- </select>onchange="getproj()" > -->
118
+ <option value="" disabled selected hidden >Project</option>
119
+ <option value="2340 United Living Low Rise Building">2340 United Living Low Rise Building</option>
120
+ <option value="2341 Bouygues-Cotswold">2341 Bouygues-Cotswold</option>
121
+ <option value="2342 GF Tomlinson - Hardingstone Primary School">2342 GF Tomlinson - Hardingstone Primary School</option>
122
+
123
+
124
+ <!--
125
  <option value="BMW job1">BMW job1</option>
126
+ <option value="BMW job2">BMW job2</option> -->
127
  </select>
128
  </div>
129
 
130
  <div id ="projectpart">
131
+ <select name="selectprojp" class="selectionsProjp" id="selectionsProjpid" required>
132
  <option value="" disabled selected hidden >Project Part</option>
133
 
134
  </select>
135
  </div>
136
 
137
  <div id ="projectsection">
138
+ <select name="selectprojs" class="selectionsProjs" onchange=getproj() required>
139
+ <option value="" disabled selected hidden>Section</option>
140
+ <!-- <option value="NRM Section-A">NRM Section-A </option>
141
+ <option value="NRM Section-B">NRM Section-B</option> -->
142
  </select>
143
  </div>
144
 
145
+
146
  <div id ="tomeasurediv">
147
+ <label id="measureLabel">Document To Measure</label> <br>
148
  <div id="measureCheckbox">
149
+ <select style="margin-left: -1%;" hidden name="measureselectname" id="measureselectid" required multiple size="5">
150
+ <!-- <option value="" disabled selected hidden>Measure this Document</option> -->
151
+ </select>
 
 
152
  </div>
153
  </div>
154
+
155
  <div id ="relvDocdiv">
156
+ <label id="relvDocLabel">Other Relevant Documents</label> <br>
157
  <div id ="relvdiv">
158
+ <select style="margin-left: -1%;" hidden name="relvselectname" id="relvselectid" multiple size="5">
159
+
160
+ </select>
161
+ </div>
162
  </div>
163
+
164
+ <div id="ratios">
165
+
166
  </div>
167
  <br>
168
+ <div id="radiosColors" >
169
+ <label id=nLevels name="levelsnamelabel" >Number of levels: </label>
170
+
171
+ <input id=lvlinput type="number" name="levelsnameinput" oninput="generatecolorPickers()" value="1"> <i class="fa fa-info-circle" id="infotool" > <span class="tooltiptext">Choose whether this project contains levels or not. If you wish to measure all of the plan, let the number of plans equal to one. If you wish to measure certain regions of the plan or have the plan divided into levels,
172
+ please type in a number greater than 1 (number of levels). </span> </i>
173
+
 
 
 
174
  <div id="colorpickers">
175
  <!-- -->
176
  </div>
177
 
178
  </div>
179
+ <br>
180
+
181
  <div id ="saveOPdiv">
182
+ <button id="measureADRbutton">Measure using ADR</button>
 
183
 
184
  </div>
185
+ <audio id="myAudio" autoplay></audio>
186
+ <br>
 
 
 
 
187
  </form>
188
  <script src="https://cdn.lordicon.com/bhenfmcm.js"></script>
189
  <lord-icon
 
191
  trigger="hover" colors="primary:black" id="addicon" onclick="duplicate({{mylist}})">
192
  </lord-icon>
193
 
194
+ <!-- <form action="/forward/" method="post"> -->
195
+ <!-- <form method="post" id="myFormsecond" > -->
196
  <div id ="duplicater" class="duplicaterclass">
197
+ <select name="measurementscripts" class="measurementselections" id="measurementselectionsid" oninput=get3rddropdown()>
198
+ <option value="" disabled selected hidden>Select </option>
199
  <option value="ground beams" >Ground Beams </option>
200
  <option value="pile caps"> Pile Caps</option>
201
  </select>
202
+
203
+ <select name="select" class="selections" id="selectionsid" oninput=get3rddropdown()>
204
+
205
+ </select>
206
+ <select name="measureitem" class="measureitems" id="measureitemsid">
207
+
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
208
  </select>
209
 
 
 
 
 
 
210
  <br>
211
+ <div id="repeatforloop" class="repeatforloopclass00" name="repeatforloopname " > <!-- onchange="getmctName()"> -->
212
 
213
 
214
  <input type="text" id="text0" name="text1name" placeholder="GB-1" class=gb>
 
228
 
229
  </div>
230
 
231
+ <button id="doneebackground" onclick="getSecondData()" > See Summary
232
+ <!-- <script src="https://cdn.lordicon.com/bhenfmcm.js"></script>
233
  <lord-icon
234
  src="https://cdn.lordicon.com/egiwmiit.json"
235
  trigger="hover"
236
  colors="primary:black"
237
+ onclick="getSecondData()"
238
+ id="donebutton" >
239
+ </lord-icon> -->
240
  </button>
241
 
242
+ <!-- </form> -->
243
 
244
  <div hidden id ="duplicaterhidden" class="duplicaterclasshidden">
245
+ <select name="measurementscripts" class="measurementselections" id="measurementselectionsid" oninput="get3rddropdown()">
246
+ <option value="" disabled selected hidden>Select</option>
247
  <option value="ground beams" >Ground Beams </option>
248
  <option value="pile caps"> Pile Caps</option>
249
  </select>
250
 
251
+ <select name="select" class="selections" id="selectionsid" oninput=get3rddropdown()>
252
+
253
+ </select>
254
+ <select name="measureitem" class="measureitems" id="measureitemsid">
255
  <!-- <option value="" disabled selected hidden>Area</option> -->
256
+ <!-- <option value="area" >Area </option>
257
  <option value="perimeter"> Perimeter</option>
258
  <option value="length" disabled> Length</option>
259
+ <option value="count" disabled> Count</option> -->
260
  </select>
261
 
 
 
 
262
  <br>
263
+ <div id="repeatforloophidden" class="repeatforloopclasshidden" name="repeatforloopnamehidden " > <!-- onchange="getmctName()"> -->
264
 
265
 
266
  <input type="text" id="text0" name="text1name" placeholder="GB-1" class=gb>
 
285
  </body>
286
 
287
  </html>
288
+ <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
289
  <script >
290
  ////////////////////////////////////////////////////////////////////////////////
291
  /* link to dropbox to view pdfs */
292
+ ////////////////////////////////////////////////////////////////////////////////
293
+ document.getElementById('secondpage').addEventListener('click',function(){
294
+ document.getElementById('textsecondpage').removeAttribute('hidden');
295
+ document.getElementById('textfirstpage').setAttribute('hidden',true)
296
+
297
+ });
298
+ document.getElementById('firstpage').addEventListener('click',function(){
299
+ document.getElementById('textfirstpage').removeAttribute('hidden');
300
+ document.getElementById('textsecondpage').setAttribute('hidden',true)
301
+
302
+ });
303
+ document.getElementById('measureADRbutton').addEventListener('click',function(){
304
+ if (!document.getElementsByClassName('selectionsProj')[0].value)
305
+ document.getElementsByClassName('selectionsProj')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
306
+ if (!document.getElementsByClassName('selectionsProjp')[0].value)
307
+ document.getElementsByClassName('selectionsProjp')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
308
+ if (!document.getElementsByClassName('selectionsProjs')[0].value)
309
+ document.getElementsByClassName('selectionsProjs')[0].style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
310
+ // if (!document.getElementById('measureselectid').value)
311
+ // document.getElementById('measureselectid').style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
312
+
313
+ // document.getElementById("loading").hidden = false;
314
+ var rightside=document.getElementById('rightside');
315
+ var rightchidren= rightside.children
316
+ for (let ch=0;ch<rightchidren.length; ch++)
317
+ {
318
+ if (rightchidren[ch].id == 'imgcanvas')
319
+ {
320
+ rightside.removeChild(rightchidren[ch])
321
+ document.getElementById('underimgbuttons').innerHTML=''
322
+ clearInterval()
323
+ clearTimeout()
324
+
325
+ }
326
+
327
+ }
328
+
329
+
330
+ });
331
+
332
+
333
+
334
 
335
+ ////////////////////////////////////////////////////////////////////////////////
336
+
337
+ var listoftitles=[];
338
+ var listofids=[];
339
+ // let interval0= setInterval( function() {
340
+ // const delay = ms => new Promise(res => setTimeout(res, ms));
341
+ function retrieveLinks(){
342
+ var linkscontent= document.getElementsByClassName('dropbtnLinks-content')[0]
343
+
344
+ $.get( '/getdrivelinks/'+'0').then (function(data){
345
+ for (let iter=0 ; iter <data[0].length ; iter++)
346
+ {
347
+
348
+ var optn = document.createElement("a")
349
+ console.log(data[1][iter])
350
+ optn.href= 'https://docs.google.com/spreadsheets/d/'+data[1][iter]
351
+ optn.target="_blank"
352
+
353
+ optn.textContent=data[0][iter]
354
+
355
+ if (listoftitles.includes(data[0][iter] )){
356
+ console.log('mwgod')
357
+ }
358
+ else{
359
+ linkscontent.append(optn)
360
+ listoftitles.push(data[0][iter])
361
+ }
362
+ }
363
+ });
364
+ }
365
+ // retrieveLinks()
366
+ // }, 500)
367
  ////////////////////////////////////////////////////////////////////////////////
368
  var dupliatei = 0; // i
369
  var clonedDivId=0;
 
379
  // or clone.id = ""; if the divs don't need an ID
380
  clone.id = 'duplicater' + ++dupliatei;
381
  clonedDivId=clone.id;
382
+ // clone.style.marginLeft='3px';
383
+
384
+ // console.log(clone.children)
385
+ clone.children[4].style.marginLeft='2px';
386
+ clone.children[0].style.marginBottom='10px';
387
+
388
  clone.removeAttribute("hidden");
389
  clone.setAttribute('class','duplicaterclass'+dupliatei);
390
 
 
399
  clone.getElementsByClassName('measureitems')[0].setAttribute('class', 'measureitems'+dupliatei);
400
 
401
  // for (let i = 0; i < mylist.length; i++) {
402
+ // clone.getElementsByClassName('gb')[0].setAttribute('name', 'gb'+dupliatei);
403
+ // clone.getElementsByClassName('a')[0].setAttribute('name', 'a'+dupliatei);
404
+ // clone.getElementsByClassName('depth')[0].setAttribute('name', 'depth'+dupliatei);
405
  // }
406
 
407
  clone.getElementsByClassName('selections')[0].setAttribute('name', 'select'+dupliatei);
 
417
 
418
  }
419
  //accordion funv
420
+ var acc = document.getElementsByClassName("dropbtn")[0];
421
  var i;
422
 
423
+ // for (i = 0; i < acc.length; i++) {
424
+ acc.addEventListener("click", function() {
425
  /* Toggle between adding and removing the "active" class,
426
  to highlight the button that controls the panel */
427
  this.classList.toggle("active");
 
430
  var panel = this.nextElementSibling;
431
  if (panel.style.display === "block") {
432
  panel.style.display = "none";
433
+
434
  } else {
435
  panel.style.display = "block";
436
+ acc.style.backgroundColor=(0, 153, 255);
437
  }
438
  });
439
+
440
+
441
+ var acc1 = document.getElementsByClassName("dropbtnLinks")[0];
442
+
443
+
444
+ // for (i = 0; i < acc.length; i++) {
445
+ acc1.addEventListener("click", function() {
446
+ /* Toggle between adding and removing the "active" class,
447
+ to highlight the button that controls the panel */
448
+ this.classList.toggle("active");
449
+
450
+ /* Toggle between hiding and showing the active panel */
451
+ var panel1 = document.getElementsByClassName('dropbtnLinks-content')[0]
452
+ if (panel1.style.display === "block") {
453
+ panel1.style.display = "none";
454
+
455
+ } else {
456
+ panel1.style.display = "block";
457
+ acc1.style.backgroundColor=(0, 153, 255);
458
+ }
459
+ });
460
+ // }
461
+
462
+ var areainpixels=0;
463
+ var prminpixels=0;
464
+
465
+ ///////////////
466
+ prjname1=['2340 United Living Low Rise Building','2341 Bouygues-Cotswold','2342 GF Tomlinson - Hardingstone Primary School']
467
+ prjname1parts=['Block O Pumphouse','Hawthorn','Ling','Red Oak']
468
+ prjname2parts=['Block B','Block G']
469
+ prjname1sec1=['1.0 Substructure','5.1 Sanitary','8.2 Roads, Paths, Pavings','8.4 Fencing, Railing, Walls','8.5 External Fixtures','8.6 External Drainage','8.7 External Services','8.8 Minor Buildings']
470
+ prjname1sec2=['1.0 Substructure','2.1 Frames','2.3 Roof','2.4 Stairs','2.5 External Walls','2.6 External Openings','2.7 Internal Walls','2.8 Internal Openings','3.1 Wall Finishes','3.2 Floor Finishes','3.3 Ceiling Finishes','4.0 Fittings, Furnishings and Equipments','7.0 Works to exisitng buildings','8.1 Site Preparation Works','8.2 Roads, Paths, Pavings','8.3 Soft Landscaping','8.5 External Fixtures','8.6 External Drainage','8.7 External Services','8.8 Minor Buildings']
471
+ prjname1sec3=['1.0 Substructure','2.3 Roof','2.4 Stairs','2.5 External Walls','2.6 External Openings','2.7 Internal Walls','3.1 Wall Finishes','3.2 Floor Finishes','3.3 Ceiling Finishes', '4.0 Fittings, Furnishings and Equipments','7.0 Works to existing buildings','8.1 Site Preparation Works','8.2 Roads, Paths, Pavings','8.3 Soft Landscaping','8.5 External Fixtures','8.6 External Drainage']
472
+ prjname1sec4=['1.0 Substructure','2.3 Roof','2.4 Stairs','2.5 External Walls','2.6 External Openings','2.7 Internal Walls','3.1 Wall Finishes','3.2 Floor Finishes','3.3 Ceiling Finishes', '4.0 Fittings, Furnishings and Equipments','7.0 Works to existing buildings','8.1 Site Preparation Works','8.2 Roads, Paths, Pavings','8.3 Soft Landscaping','8.5 External Fixtures','8.6 External Drainage']
473
+ prjname2parts=['Block B','Block G']
474
+ prjname2sec=['3.3 Ceiling Finishes']
475
+ prjname3parts=['Community Center building','External Works','Primary School']
476
+ prjname3sec1=['1.0 Substructure','2.3 Roof','3.1 Wall Finishes','3.2 Floor Finishes','3.3 Ceiling Finishes','4.0 Fittings, Furnishings and Equipments','5.1 Sanitary']
477
+ prjname3sec2=['8.1 Site Preparation Works','8.4 Fencing, Railing, Walls','8.5 External Fixtures', ' 8.6 External Drainage']
478
+ prjname3sec3=['1.0 Substructure','2.3 Roof','2.4 Stairs','3.2 Floor Finishes','3.3 Ceiling Finishes','4.0 Fittings, Furnishings and Equipments','5.1 Sanitary']
479
+
480
+
481
+ var proj = document.getElementsByClassName("selectionsProj")[0];
482
+ var proj1 = document.getElementsByClassName("selectionsProjp")[0];
483
+ var projsec = document.getElementsByClassName("selectionsProjs")[0];
484
+
485
+ proj.addEventListener('input',function(){
486
+ proj.style.boxShadow=( '2px 2px 2px gray')
487
+ proj1.innerHTML='';
488
+ projsec.innerHTML='';
489
+ var optn = document.createElement("OPTION");
490
+ optn.text= 'Project Part';
491
+ optn.value= "";
492
+ optn.hidden=true;
493
+ proj1.add(optn);
494
+ var opt = document.createElement("OPTION");
495
+ opt.text= 'Section';
496
+ opt.value= "";
497
+ opt.hidden=true;
498
+ projsec.add(opt);
499
+ if (proj.value==prjname1[0]){
500
+ for (let p=0 ; p<prjname1parts.length;p++)
501
+ {
502
+ var optn1 = document.createElement("OPTION");
503
+ optn1.text= prjname1parts[p];
504
+ optn1.value= prjname1parts[p];
505
+ optn1.id= prjname1parts[p]+p;
506
+ proj1.add(optn1);
507
+
508
+ }
509
+ }
510
+ if (proj.value==prjname1[1]){
511
+ for (let p=0 ; p<prjname2parts.length;p++)
512
+ {
513
+ var optn1 = document.createElement("OPTION");
514
+ optn1.text= prjname2parts[p];
515
+ optn1.value= prjname2parts[p];
516
+ optn1.id= prjname2parts[p]+p;
517
+ proj1.add(optn1);
518
+
519
+ }
520
+ }
521
+ if (proj.value==prjname1[2]){
522
+ for (let p=0 ; p<prjname3parts.length;p++)
523
+ {
524
+ var optn1 = document.createElement("OPTION");
525
+ optn1.text= prjname3parts[p];
526
+ optn1.value= prjname3parts[p];
527
+ optn1.id= prjname3parts[p]+p;
528
+ proj1.add(optn1);
529
+
530
+ }
531
+ }
532
+ })
533
+ proj1.addEventListener('input',function(){
534
+ proj1.style.boxShadow=( '2px 2px 2px gray')
535
+ projsec.innerHTML='';
536
+ var optn = document.createElement("OPTION");
537
+ optn.text= 'Section';
538
+ optn.value= "";
539
+ optn.hidden=true;
540
+ projsec.add(optn);
541
+ console.log(proj1.value,prjname1parts[0])
542
+
543
+ if (proj1.value==prjname1parts[0].toString())
544
+ {
545
+ for (let s=0;s<prjname1sec1.length;s++){
546
+ var optn2 = document.createElement("OPTION");
547
+ optn2.text= prjname1sec1[s];
548
+ optn2.value= prjname1sec1[s];
549
+ optn2.id= prjname1sec1[s]+s;
550
+ projsec.add(optn2);
551
+ }
552
  }
553
+ else if (proj1.value==prjname1parts[1])
554
+ {
555
+ for (let s=0;s<prjname1sec2.length;s++){
556
+ var optn2 = document.createElement("OPTION");
557
+ optn2.text= prjname1sec2[s];
558
+ optn2.value= prjname1sec2[s];
559
+ optn2.id= prjname1sec2[s]+s;
560
+ projsec.add(optn2);
561
+ }
562
+ }
563
+ else if (proj1.value==prjname1parts[2])
564
+ {
565
+ for (let s=0;s<prjname1sec3.length;s++){
566
+ var optn2 = document.createElement("OPTION");
567
+ optn2.text= prjname1sec3[s];
568
+ optn2.value= prjname1sec3[s];
569
+ optn2.id= prjname1sec3[s]+s;
570
+ projsec.add(optn2);
571
+ }
572
+ }
573
+ else if (proj1.value==prjname1parts[3])
574
+ {
575
+ for (let s=0;s<prjname1sec4.length;s++){
576
+ var optn2 = document.createElement("OPTION");
577
+ optn2.text= prjname1sec4[s];
578
+ optn2.value= prjname1sec4[s];
579
+ optn2.id= prjname1sec4[s]+s;
580
+ projsec.add(optn2);
581
+ }
582
+ }
583
+ else if (proj1.value==prjname2parts[0] || proj1.value==prjname2parts[1])
584
+ {
585
+ for (let s=0;s<prjname2sec.length;s++){
586
+ var optn2 = document.createElement("OPTION");
587
+ optn2.text= prjname2sec[s];
588
+ optn2.value= prjname2sec[s];
589
+ optn2.id= prjname2sec[s]+s;
590
+ projsec.add(optn2);
591
+ }
592
+ }
593
+ else if (proj1.value==prjname3parts[0])
594
+ {
595
+ for (let s=0;s<prjname3sec1.length;s++){
596
+ var optn2 = document.createElement("OPTION");
597
+ optn2.text= prjname3sec1[s];
598
+ optn2.value= prjname3sec1[s];
599
+ optn2.id= prjname3sec1[s]+s;
600
+ projsec.add(optn2);
601
+ }
602
+ }
603
+ else if (proj1.value==prjname3parts[1])
604
+ {
605
+ for (let s=0;s<prjname3sec2.length;s++){
606
+ var optn2 = document.createElement("OPTION");
607
+ optn2.text= prjname3sec2[s];
608
+ optn2.value= prjname3sec2[s];
609
+ optn2.id= prjname3sec2[s]+s;
610
+ projsec.add(optn2);
611
+ }
612
+ }
613
+ else if (proj1.value==prjname3parts[2])
614
+ {
615
+ for (let s=0;s<prjname3sec3.length;s++){
616
+ var optn2 = document.createElement("OPTION");
617
+ optn2.text= prjname3sec3[s];
618
+ optn2.value= prjname3sec3[s];
619
+ optn2.id= prjname3sec3[s]+s;
620
+ projsec.add(optn2);
621
+ }
622
+ }
623
+
624
+ // for (let p=0 ; p<=prjname1parts.length;p++)
625
+ // {
626
+ // var optn1 = document.createElement("OPTION");
627
+ // optn1.text= prjname1parts[p];
628
+ // optn1.value= prjname1parts[p];
629
+ // optn1.id= prjname1parts[p]+p;
630
+ // proj1.add(optn1);
631
+ // }
632
+
633
+ })
634
+
635
+ projsec.addEventListener('input',function(){
636
+ projsec.style.boxShadow=( '2px 2px 2px gray')
637
+ })
638
+
639
+
640
 
641
  function getproj(){
642
+
643
+ // var audio = new Audio('templates/x.mp3');
644
+
645
+ // audio.loop = false;
646
+ // audio.play();
647
+ // console.log('clicked')
648
  var proj = document.getElementsByClassName("selectionsProj")[0];
649
  var projectVal=proj.value.toString() //selected project
650
 
651
  var inputs = document.getElementsByTagName("select")[1]; //second dropdown(project part)
652
  var p=document.getElementById("selectionsProjpid") //project part
653
 
654
+ var sections = document.getElementsByClassName("selectionsProjs")[0];
655
+ // remove old dropdown options
656
  // var i, L = inputs.options.length - 1;
657
  // for(i = L; i >= 0; i--) {
658
  // inputs.remove(i);
659
  // }
660
 
661
  //send project name to python flask
662
+ // if(sections.value.startsWith('1.0'))
663
+ console.log(sections.value)
664
+ $.get( '/getmethod/'+sections.value).then (function(data){
665
+
666
+
667
+ console.log('daaaaaaaa ', data);
668
 
669
 
670
+ var projectsfromname=data; // [0] name , [1] parts (array)
 
671
 
672
+ var projname = document.getElementsByClassName("selectionsProj")[0];
673
+ var projpart = document.getElementsByClassName("selectionsProjp")[0];
674
+ var projsec = document.getElementsByClassName("selectionsProjs")[0];
675
+
676
 
677
+ // var drp = document.getElementById("selectionsProjpid");
 
678
  //add a hidden option (not to be selected)
679
+
680
+
681
+ var meas = document.getElementById("measureCheckbox") ;
682
+ var relv = document.getElementById("relvdiv") ;
683
+ const measids=[];
684
+ const relvids=[];
685
+ const measoptns=[];
 
 
686
  //add dropdown options== array
687
+ // meas.innerHTML='';
688
+ // relv.innerHTML='';
689
+ var measSelect = document.getElementById("measureselectid");
690
+
691
+ var relvSelect = document.getElementById("relvselectid");
692
+ console.log(relvSelect)
693
 
694
+ measSelect.removeAttribute("hidden");
695
+ relvSelect.removeAttribute("hidden");
696
+ measSelect.innerHTML='';
697
+ var optn2 = document.createElement("OPTION");
698
+ optn2.text= 'Select project to measure';
699
+ optn2.value=''
700
+ optn2.hidden=true;
701
+ optn2.id='hidden';
702
+
703
+ measSelect.add(optn2);
704
+ document.getElementById("hidden").required = true;
705
+ // console.log(measSelect)
706
+
707
+ relvSelect.innerHTML='';
708
  for (i = 0; i < projectsfromname.length; i++) {
709
+
710
+ //relevant documents
711
+ var optn1 = document.createElement("OPTION");
712
+ optn1.text= projectsfromname[i];
713
+ optn1.value= projectsfromname[i] ;
714
+ optn1.id=data[0] + i
715
+ relvSelect.add(optn1);
716
+
717
+ //to measure documents
718
+ var optn2 = document.createElement("OPTION");
719
+
720
+ optn2.text= projectsfromname[i];
721
+ optn2.value= projectsfromname[i] ;
722
+ optn2.id=data[0] ;
723
+ measSelect.add(optn2);
724
+ measoptns.push(optn2);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
725
 
726
  }
727
+
728
+
729
+ // console.log(measChecklbl);
730
+ relvids.push(relvSelect) ;
731
+ measids.push(measSelect);
732
+ //to open pdf in a new tab (relevant documents)
733
+ relvids.forEach(function(elem){
734
+ elem.addEventListener("change", function() {
735
+
736
+ console.log(projname.value, projpart.value,projsec.value, elem.value)
737
+ var pdfpatharr=[]
738
+ pdfpatharr.push(projname.value, projpart.value,projsec.value, elem.value)
739
+ $.get( '/getdropboxurl/'+JSON.stringify(pdfpatharr)).then (function(data){
740
+ console.log(data)
741
+ window.open( data)
742
+ });
743
+ // window.open( 'https://arxiv.org/pdf/2102.13468v1.pdf')
744
+ });
745
+ });
746
+
747
+
748
+ document.getElementById('measureADRbutton').onclick= function()
749
+ {
750
+ if (!measSelect.value)
751
+ measSelect.style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
752
+
753
+ }
754
+ measids.forEach(function(elem) {
755
+ elem.addEventListener("change", function() {
756
 
757
+ console.log(elem.value);
758
+ measSelect.style.boxShadow='none';
759
+ pixelArr=[elem.value,projsec.value]
760
+ $.get( '/pixelimg/'+JSON.stringify(pixelArr)) .then( function(data) {
761
+ alert('Measure the white square drawn in the pdf on Bluebeam, then enter its area and perimeter in ur desired scale.');
762
+
763
+ document.getElementById('measureADRbutton').onclick= function()
764
+ {
765
+ if (!areaRatio.value)
766
+ areaRatio.style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
767
+ if (!prmRatio.value)
768
+ prmRatio.style.boxShadow='0 0 8px 2px rgb(255, 0, 0)';
769
+
770
+ }
771
+
772
+ var scalelbl= document.createElement("label");
773
+ scalelbl.innerText='Scale Document';
774
+ scalelbl.id='measureLabel';
775
+ var br1= document.createElement("br");
776
+ var areaRatiolbl= document.createElement("label");
777
+ areaRatiolbl.innerText='Area:'
778
+ areaRatiolbl.id='radiolbl';
779
 
780
+
781
+ var areaRatio= document.createElement("input");
782
+ areaRatio.type='number';
783
+ areaRatio.id='lvlinput';
784
+ areaRatio.name='areaRatio';
785
+ areaRatio.style.marginLeft='78px';
786
+ areaRatio.style.textAlign='right';
787
+ areaRatio.step=".0000001";
788
+ areaRatio.addEventListener('change',function(){
789
+ areaRatio.value=(Number(areaRatio.value)).toFixed(7)
790
+ areaRatio.style.boxShadow='none';
791
+ })
792
+ areaRatio.required=true;
793
+
794
+ var br2= document.createElement("br");
795
+ var br3= document.createElement("br");
796
+ var prmRatiolbl= document.createElement("label");
797
+ prmRatiolbl.innerText='Perimeter:'
798
+ prmRatiolbl.id='radiolbl';
799
+
800
+ var prmRatio= document.createElement("input");
801
+ prmRatio.type='number';
802
+ prmRatio.id='lvlinput';
803
+ prmRatio.name='prmRatio';
804
+ prmRatio.style.textAlign='right';
805
+ // prmRatio.onchange=setNumberDecimal();
806
+ prmRatio.style.marginLeft='49px';
807
+ prmRatio.step=".0000001";
808
+ prmRatio.addEventListener('change',function(){
809
+ prmRatio.value=(Number(prmRatio.value)).toFixed(7)
810
+ prmRatio.style.boxShadow='none';
811
+ })
812
+ prmRatio.required=true;
813
 
814
+ var ratiosdiv= document.getElementById("ratios");
815
+ ratiosdiv.innerHTML='';
816
+ ratiosdiv.append(scalelbl);
817
+ ratiosdiv.append(br1);
818
+ ratiosdiv.append(areaRatiolbl);
819
+ ratiosdiv.append(areaRatio);
820
+ ratiosdiv.append(br2);
821
+ ratiosdiv.append(br3);
822
+
823
+ ratiosdiv.append(prmRatiolbl);
824
+ ratiosdiv.append(prmRatio);
825
+
826
+ areainpixels=data[0];
827
+ prminpixels=data[1];
828
+ console.log(data)
829
+
830
+
831
+
832
+ });
833
  // console.log(elem)
834
  // });
835
 
836
+ });
837
+
838
  });
839
 
840
  });
841
  }
842
+
843
  var spreadsheetId='';
844
+ var spreadsheetURL='';
845
+ var colorsUsed='';
846
+ var list1='';
847
+ var SimilarAreaDictionary='';
848
+ var tomeasureproj=''
849
+ var pdfpath=[];
850
+ var interval = null;
851
  function getData(form) {
852
+ document.getElementById("loading").hidden = false;
853
+
854
+ document.getElementById('measureADRbutton').setAttribute('disabled',true);
855
+ document.getElementById('measureADRbutton').style.cursor='not-allowed';
856
+ document.getElementById('measureADRbutton').style.boxShadow = 'none';
857
+ document.getElementById('measureADRbutton').style.color = 'white';
858
+ document.getElementById('measureADRbutton').style.backgroundColor="rgb(154,152,152)";
859
+
860
  var formData = new FormData(form);
861
+ clearInterval(interval)
862
+
863
+
864
  colorsarr=[];
865
  val=0;
866
  answers=[];
867
+ var ratio1=0;
868
+ var ratio2=0;
869
+ tomeasureproj='';
870
+ pdfpath=[];
871
+ formvalues=Object.fromEntries(formData);
872
+ console.log(formvalues);
873
+ // iterate through entries...
874
  for (var pair of formData.entries()) {
875
+
 
 
 
 
 
 
876
  if (pair[0].startsWith('color')){
877
  colorsarr.push(pair[1].substring(1));
878
  }
879
+ }
880
+ tomeasureproj=formvalues['measureselectname']; //proj name
881
+ ratio1=formvalues['areaRatio']/areainpixels;
882
+
883
+ ratio2=formvalues['prmRatio']/prminpixels;
884
+ pdfpath.push(formvalues['selectproj'],formvalues['selectprojp'] ,formvalues['selectprojs'])
885
+
886
+ if (colorsarr.length>0)
887
+ answers.push(tomeasureproj, 220,colorsarr , ratio1, ratio2 ,pdfpath);
888
+ else
889
+ answers.push(tomeasureproj, 0,colorsarr , ratio1, ratio2 ,pdfpath);
890
+ if (ratio1 >0)
891
+ $.get('/projecttomeasure/'+ JSON.stringify(answers)).then( function(data) {
892
+ var mp3_url = 'https://media.geeksforgeeks.org/wp-content/uploads/20190531135120/beep.mp3';
893
+ (new Audio(mp3_url)).play()
894
+ retrieveLinks()
895
+ var backimg=document.getElementById('backgroundimg');
896
+ var rightside=document.getElementById('rightside');
897
+ document.getElementById("loading").hidden = true;
898
+ // rightside.removeChild(0);
899
+ // clearInterval()
900
+ document.getElementById('measureADRbutton').removeAttribute('disabled');
901
+ document.getElementById('measureADRbutton').style.cursor='pointer';
902
+ document.getElementById('measureADRbutton').style.color = 'white';
903
+ document.getElementById('measureADRbutton').style.backgroundColor="#16c72e";
904
+ document.getElementById('measureADRbutton').addEventListener('mouseover',function(){
905
+ document.getElementById('measureADRbutton').style.color='black';
906
+ document.getElementById('measureADRbutton').style.boxShadow=' 0 0 8px 2px #16c72e';
907
+ })
908
+
909
+
910
+ document.getElementById('measureADRbutton').addEventListener('mouseout',function(){
911
+ document.getElementById('measureADRbutton').style.color='white';
912
+ document.getElementById('measureADRbutton').style.boxShadow='none';
913
+ });
914
 
915
+ SimilarAreaDictionary=data[1]
916
+ spreadsheetURL= data[2];
917
+ spreadsheetId= data[3];
918
+ colorsUsed = data[4];
919
+ list1 = data[5];
920
 
 
 
 
 
 
 
 
 
 
 
 
 
921
  var imgcanvas= document.createElement("img");
922
+
923
  imgcanvas.src= 'data:image/gif;base64,' +data[0];
924
  // imgcanvas.width=700;
925
  imgcanvas.height=600;
926
+ console.log(imgcanvas.width)
927
+ imgcanvas.id='imgcanvas';
928
  imgcanvas.alt="Larry";
929
  imgcanvas.style.zIndex=999;
930
+
931
+ var underimg=document.getElementById('underimgbuttons');
932
+
933
+
934
+ backimg.style.backgroundColor="transparent";
935
+ backimg.style.opacity="1";
936
 
937
+ // backimg.append(imgcanvas);
938
+ var legendbutton= document.createElement("button");
939
+ legendbutton.id='measureADRbutton2';
940
+ legendbutton.innerText='Legend and Data created';
941
+ legendbutton.style.backgroundColor='rgb(5, 43, 235)';
942
+ legendbutton.addEventListener('mouseover',function(){
943
+ legendbutton.style.boxShadow='0 0 8px 2px rgb(5, 43, 235)';
944
+ })
945
+ legendbutton.addEventListener('mouseout',function(){
946
+ legendbutton.style.boxShadow='none';
947
+ })
948
+
949
+
950
+ // legendbutton.margin.horizontal='0';
951
+ legendbutton.addEventListener('click',function(){
952
+ window.open( data[2].toString());
953
+
954
+ })
955
+
956
+ // legendbutton.style.display='flex';
957
+
958
+ var imgbutton= document.createElement("button");
959
+ imgbutton.id='measureADRbutton2';
960
+ imgbutton.innerText='Click to view as PDF';
961
+ imgbutton.style.backgroundColor='rgb(255,0,255)';
962
 
 
 
 
 
 
 
 
 
 
963
 
964
+ imgbutton.addEventListener('mouseover',function(){
965
+ imgbutton.style.boxShadow='0 0 8px 2px rgb(255,0,255)';
966
+ })
967
+ imgbutton.addEventListener('mouseout',function(){
968
+ imgbutton.style.boxShadow='none';
969
+ })
970
 
971
+ imgbutton.addEventListener('click',function(){
972
+ console.log('clickedsdd')
973
+ window.open( data[6].toString());
974
+ // $.get('/uploadtodropboxPath/'+ 'pp').then( function(data) {
975
 
976
+ // //
977
+ // // console.log(data)
978
+ // });
979
+ })
980
+
981
+ underimg.append(legendbutton);
982
+ underimg.append(imgbutton);
983
+ underimg.style.display='flex';
984
+ rightside.append(imgcanvas);
985
+ rightside.insertBefore(imgcanvas,underimg);
986
+
987
+ let delrows2 = {
988
+ content : {},
989
+ id : {},
990
+ subject :{}
991
+ };
992
+
993
+ var delrows1='';
994
+ var flag=0;
995
+ pdfpath=[];
996
+ pdfpath.push(formvalues['selectproj'],formvalues['selectprojp'] ,formvalues['selectprojs'])
997
+ var rightsideids=[];
998
+ interval= setInterval( function() {
999
+
1000
+ const delay = ms => new Promise(res => setTimeout(res, ms));
1001
+ delay(2000)
1002
+ $.getJSON('/_submission', {
1003
+
1004
+ // dict: JSON.stringify(SimilarAreaDictionary),
1005
+ dict1: JSON.stringify(list1),
1006
+ spreadsheetId:spreadsheetId,
1007
+ pdfpathpath:JSON.stringify(pdfpath),
1008
+ path:Object.fromEntries(formData)['measureselectname'],
1009
+
1010
+ },function(data1){
1011
+
1012
+ if(data1.length >0){
1013
+ delrows1=data1[0];
1014
+ console.log(data1, delrows1,delrows2)
1015
+ console.log(typeof delrows1)
1016
+ console.log(typeof delrows2)
1017
+ if (JSON.stringify(delrows1)=== JSON.stringify(delrows2))
1018
+ {
1019
+ console.log('same')
1020
+ }
1021
+ else{
1022
+ // if (data1[0]==1){
1023
+ // return data1[0];
1024
+ flag=1
1025
+ if (confirm("Changes have been made in the markups. Would you like to save and view them in the legend?")) {
1026
+
1027
+
1028
+ $.getJSON('/deletemarkupsroute', {
1029
+ dict: JSON.stringify(SimilarAreaDictionary),
1030
+ deletedrows: JSON.stringify(delrows1),
1031
+ path:Object.fromEntries(formData)['measureselectname'],
1032
+ spreadsheetId:spreadsheetId,
1033
+ areaPermArr: JSON.stringify(data[7]),
1034
+
1035
+
1036
+
1037
+ }, function(data2){
1038
+ console.log(data2)
1039
+ })
1040
+ }
1041
+ }
1042
+ }
1043
+ });
1044
+
1045
+ delay(6000);
1046
+ $.getJSON('/_submission', {
1047
+ // dict: JSON.stringify(SimilarAreaDictionary),
1048
+ dict1: JSON.stringify(list1),
1049
+ spreadsheetId:spreadsheetId,
1050
+ pdfpathpath:JSON.stringify(pdfpath),
1051
+ path:Object.fromEntries(formData)['measureselectname'],
1052
+ },function(data11){
1053
+ delrows2=data11[0];
1054
+
1055
+ })
1056
+ },9000)
1057
 
 
1058
 
1059
+
1060
+ /////////////////////////
1061
+ })
1062
+ }
1063
  document.getElementById("myForm").addEventListener("submit", function (e) {
1064
  e.preventDefault();
1065
  getData(e.target);
1066
  });
1067
 
1068
+ // document.getElementById("myFormsecond").addEventListener("submit", function (e) {
1069
+ // e.preventDefault();
1070
+ // getSecondData(e.target);
1071
+ // });
1072
+
1073
  ////////////////////////////////////////////
1074
  var measitemVal=''
1075
+
1076
  function get3rddropdown(){
1077
 
1078
 
 
1079
 
1080
+ var divduplicater= document.getElementsByClassName('duplicaterclass')[0].children;
1081
+ console.log(divduplicater)
1082
  var inputs =divduplicater[0];// document.getElementsByClassName("measurementselections")[0]; //groundbeams
1083
  console.log(inputs.value);
1084
 
 
1086
  measitemVal=measitem.value.toString() //selected project
1087
  console.log(measitemVal);
1088
 
1089
+ var selections = divduplicater[1]; //document.getElementsByClassName("selections")[0]; //second dropdown(project part)
 
1090
 
1091
+
1092
  if (addciconval>0){
1093
 
1094
  for (let i =1 ; i <=addciconval ; i++){
1095
  var inputs1 = document.getElementsByClassName("measurementselections"+i)[0]; //groundbeams
1096
  console.log(inputs1.value);
1097
 
1098
+ // 17:59 21/06/202317:59 21/06/2023//area
1099
+
1100
+ var measitem1 = document.getElementsByClassName("measureitems"+i)[0]; //groundbeams
1101
  measitemVal1=measitem1.value.toString() //selected project
1102
  console.log(measitemVal1);
1103
 
1104
  var selections1 = document.getElementsByClassName("selections"+i)[0]; //second dropdown(project part)
1105
+
1106
  // remove old dropdown options
 
 
 
 
 
 
 
1107
 
1108
+ ////////////////////////////////////////
1109
+ inputs1.addEventListener('click',function(){
1110
+ if (inputs1.value=='ground beams'){
1111
+
1112
+ selections1.innerHTML=''
1113
+ // if (measitemVal=='area'){
1114
+
1115
+ var opt0 = document.createElement("OPTION") ;
1116
+ opt0.text= 'Ground Beams:m2';
1117
+ opt0.value= 'Ground Beams:m2';
1118
+ opt0.id='gbA' ;
1119
+ selections1.add(opt0);
 
 
 
 
 
 
 
 
 
 
 
 
1120
  // }
1121
+ // else if (measitemVal=='perimeter') {
1122
+ var opt1 = document.createElement("OPTION") ;
1123
+ opt1.text= 'Ground Beams:m';
1124
+ opt1.value= 'Ground Beams:m';
1125
+ opt1.id='gbP';
1126
+ selections1.add(opt1);
1127
+
1128
+
1129
  }
1130
+ if (selections1.value=='Ground Beams:m'){
1131
+ measitem1.innerHTML='';
1132
+ var opt2= document.createElement("option");
1133
+ opt2.text= 'Length';
1134
+ opt2.value= 'Length';
1135
+ opt2.id= 'Length';
1136
+ measitem1.add(opt2);
1137
+
1138
+ var opt3= document.createElement("option");
1139
+ opt3.text= 'Perimeter';
1140
+ opt3.value= 'Perimeter';
1141
+ opt3.id= 'Perimeter';
1142
+ measitem1.add(opt3);
1143
+ }
1144
+
1145
+ if (selections1.value=='Ground Beams:m2'){
1146
+ measitem1.innerHTML='';
1147
+ var opt4= document.createElement("option");
1148
+ opt4.text= 'Area';
1149
+ opt4.value= 'Area';
1150
+ opt4.id= 'Area';
1151
+ measitem1.add(opt4);
1152
+
1153
+ }
1154
+
1155
+ });
1156
+ if (selections1.value=='Ground Beams:m'){
1157
+ measitem1.innerHTML='';
1158
+ var opt2= document.createElement("option");
1159
+ opt2.text= 'Length';
1160
+ opt2.value= 'Length';
1161
+ opt2.id= 'Length';
1162
+ measitem1.add(opt2);
1163
+
1164
+ var opt3= document.createElement("option");
1165
+ opt3.text= 'Perimeter';
1166
+ opt3.value= 'Perimeter';
1167
+ opt3.id= 'Perimeter';
1168
+ measitem1.add(opt3);
1169
+ }
1170
+
1171
+ if (selections1.value=='Ground Beams:m2'){
1172
+ measitem1.innerHTML='';
1173
+ var opt4= document.createElement("option");
1174
+ opt4.text= 'Area';
1175
+ opt4.value= 'Area';
1176
+ opt4.id= 'Area';
1177
+ measitem1.add(opt4);
1178
+
1179
+ }
1180
+ inputs1.addEventListener('click',function(){
1181
+ if (inputs1.value=='pile caps'){
1182
+ selections1.innerHTML='';
1183
+ var opt5 = document.createElement("OPTION") ;
1184
+ opt5.text= 'Pile Caps:m2';
1185
+ opt5.value= 'Pile Caps:m2';
1186
+ opt5.id='pcA' ;
1187
+ selections1.add(opt5);
1188
 
1189
+
1190
+ var opt6 = document.createElement("OPTION") ;
1191
+ opt6.text= 'Pile Caps:m';
1192
+ opt6.value= 'Pile Caps:m';
1193
+ opt6.id='pcP';
1194
+ selections1.add(opt6);
1195
+
1196
+ }
1197
+ if (selections1.value=='Pile Caps:m'){
1198
+ measitem1.innerHTML='';
1199
+ var opt7= document.createElement("option");
1200
+ opt7.text= 'Length';
1201
+ opt7.value= 'Length';
1202
+ opt7.id= 'Length';
1203
+ measitem1.add(opt7);
1204
+
1205
+ var opt8= document.createElement("option");
1206
+ opt8.text= 'Perimeter';
1207
+ opt8.value= 'Perimeter';
1208
+ opt8.id= 'Perimeter';
1209
+ measitem1.add(opt8);
 
 
 
 
1210
  }
 
 
 
1211
 
1212
+ if (selections1.value=='Pile Caps:m2'){
1213
+ measitem1.innerHTML='';
1214
+ var opt9= document.createElement("option");
1215
+ opt9.text= 'Area';
1216
+ opt9.value= 'Area';
1217
+ opt9.id= 'Area';
1218
+ measitem1.add(opt9);
1219
 
1220
+ }
1221
+
1222
+ });
1223
+ if (selections1.value=='Pile Caps:m'){
1224
+ measitem1.innerHTML='';
1225
+ var opt7= document.createElement("option");
1226
+ opt7.text= 'Length';
1227
+ opt7.value= 'Length';
1228
+ opt7.id= 'Length';
1229
+ measitem1.add(opt7);
1230
+
1231
+ var opt8= document.createElement("option");
1232
+ opt8.text= 'Perimeter';
1233
+ opt8.value= 'Perimeter';
1234
+ opt8.id= 'Perimeter';
1235
+ measitem1.add(opt8);
1236
+ }
1237
+
1238
+ if (selections1.value=='Pile Caps:m2'){
1239
+ measitem1.innerHTML='';
1240
+ var opt9= document.createElement("option");
1241
+ opt9.text= 'Area';
1242
+ opt9.value= 'Area';
1243
+ opt9.id= 'Area';
1244
+ measitem1.add(opt9);
1245
+
1246
+ }
1247
+
1248
+
1249
+ }
1250
+ }
1251
+ inputs.addEventListener('click',function(){
1252
+
1253
  if (inputs.value=='ground beams'){
1254
+ selections.innerHTML='';
1255
+ // if (measitemVal=='area'){
1256
+
1257
 
1258
  var optn = document.createElement("OPTION") ;
1259
  optn.text= 'Ground Beams:m2';
1260
  optn.value= 'Ground Beams:m2';
1261
  optn.id='gbA' ;
1262
  selections.add(optn);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1263
  // }
1264
+ // else if (measitemVal=='perimeter') {
1265
+ var opt = document.createElement("OPTION") ;
1266
+ opt.text= 'Ground Beams:m';
1267
+ opt.value= 'Ground Beams:m';
1268
+ opt.id='gbP';
1269
+ selections.add(opt);
1270
+
1271
+ }
1272
+ if (selections.value=='Ground Beams:m'){
1273
+ measitem.innerHTML='';
1274
+ var op2= document.createElement("option");
1275
+ op2.text= 'Length';
1276
+ op2.value= 'Length';
1277
+ op2.id= 'Length';
1278
+ measitem.add(op2);
1279
+
1280
+ var op3= document.createElement("option");
1281
+ op3.text= 'Perimeter';
1282
+ op3.value= 'Perimeter';
1283
+ op3.id= 'Perimeter';
1284
+ measitem.add(op3);
1285
  }
 
1286
 
1287
+ if (selections.value=='Ground Beams:m2'){
1288
+ measitem.innerHTML='';
1289
+ var op4= document.createElement("option");
1290
+ op4.text= 'Area';
1291
+ op4.value= 'Area';
1292
+ op4.id= 'Area';
1293
+ measitem.add(op4);
1294
+
1295
+ }
1296
+
1297
+ });
1298
+ if (selections.value=='Ground Beams:m'){
1299
+ measitem.innerHTML='';
1300
+ var op2= document.createElement("option");
1301
+ op2.text= 'Length';
1302
+ op2.value= 'Length';
1303
+ op2.id= 'Length';
1304
+ measitem.add(op2);
1305
+
1306
+ var op3= document.createElement("option");
1307
+ op3.text= 'Perimeter';
1308
+ op3.value= 'Perimeter';
1309
+ op3.id= 'Perimeter';
1310
+ measitem.add(op3);
1311
+ }
1312
+
1313
+ if (selections.value=='Ground Beams:m2'){
1314
+ measitem.innerHTML='';
1315
+ var op4= document.createElement("option");
1316
+ op4.text= 'Area';
1317
+ op4.value= 'Area';
1318
+ op4.id= 'Area';
1319
+ measitem.add(op4);
1320
+
1321
+ }
1322
+ inputs.addEventListener('click',function(){
1323
 
1324
+ if (inputs.value=='pile caps'){
1325
+ selections.innerHTML='';
1326
  var optn = document.createElement("OPTION") ;
1327
  optn.text= 'Pile Caps:m2';
1328
  optn.value= 'Pile Caps:m2';
1329
+ optn.id='pcA' ;
 
 
 
 
 
 
 
1330
  selections.add(optn);
1331
+
1332
+ var opt = document.createElement("OPTION") ;
1333
+ opt.text= 'Pile Caps:m';
1334
+ opt.value= 'Pile Caps:m';
1335
+ opt.id='pcP';
1336
+ selections.add(opt);
1337
+
1338
+ }
1339
+ if (selections.value=='Pile Caps:m'){
1340
+ measitem.innerHTML='';
1341
+ var op2= document.createElement("option");
1342
+ op2.text= 'Length';
1343
+ op2.value= 'Length';
1344
+ op2.id= 'Length';
1345
+ measitem.add(op2);
1346
+
1347
+ var op3= document.createElement("option");
1348
+ op3.text= 'Perimeter';
1349
+ op3.value= 'Perimeter';
1350
+ op3.id= 'Perimeter';
1351
+ measitem.add(op3);
1352
+ }
1353
+
1354
+ if (selections.value=='Pile Caps:m2'){
1355
+ measitem.innerHTML='';
1356
+ var op4= document.createElement("option");
1357
+ op4.text= 'Area';
1358
+ op4.value= 'Area';
1359
+ op4.id= 'Area';
1360
+ measitem.add(op4);
1361
+
1362
  }
1363
+
1364
+ });
1365
+ if (selections.value=='Pile Caps:m'){
1366
+ measitem.innerHTML='';
1367
+ var op2= document.createElement("option");
1368
+ op2.text= 'Length';
1369
+ op2.value= 'Length';
1370
+ op2.id= 'Length';
1371
+ measitem.add(op2);
1372
+
1373
+ var op3= document.createElement("option");
1374
+ op3.text= 'Perimeter';
1375
+ op3.value= 'Perimeter';
1376
+ op3.id= 'Perimeter';
1377
+ measitem.add(op3);
1378
+ }
1379
+
1380
+ if (selections.value=='Pile Caps:m2'){
1381
+ measitem.innerHTML='';
1382
+ var op4= document.createElement("option");
1383
+ op4.text= 'Area';
1384
+ op4.value= 'Area';
1385
+ op4.id= 'Area';
1386
+ measitem.add(op4);
1387
+
1388
+ }
1389
+
1390
+ }
1391
+
1392
 
1393
  var repeatforloopI=0;
1394
 
1395
  function getmctName(){
1396
+ var listofnames=[];
1397
+ var flag=0;
1398
+ arrallvalues=[];
1399
  arrmctNames=[];
1400
  arrFinalMCNames=[];
1401
+
1402
+ var allmcnamestext= document.querySelectorAll('input[name="text1name"]');
1403
+ allmcnamestext.forEach(function(elem){
1404
+ if (elem.value)
1405
+ arrallvalues.push(elem.value);
1406
+ })
1407
+
1408
  for (ii=0 ; ii<=addciconval; ii++){
1409
 
1410
 
 
1412
  if (ii==0){
1413
  var divduplicater= document.getElementsByClassName('duplicaterclass')[0].children;
1414
  console.log('divv ',divduplicater); //addicon .children[4]
1415
+
1416
+ var selections = divduplicater[1];//document.getElementsByClassName("selections")[0];
1417
+ measitemVal=divduplicater[2].value;
1418
+ var div=divduplicater[4].children;//document.getElementById('repeatforloop').children
1419
  var divValues=[div[0].value, div[1].value , div[2].value];
1420
  mctname=[selections.value ,divValues , measitemVal ];
1421
  console.log(mctname)
1422
  if(div[0].value && div[1].value && div[2].value)
1423
+ {
1424
+ flag=1;
1425
  arrmctNames.push( mctname);
1426
  }
1427
  }
1428
  else if (ii>0){
1429
  var divduplicater= document.getElementsByClassName('duplicaterclass'+ii)[0].children;
1430
  console.log('dddd',divduplicater);
1431
+ selections = divduplicater[1];//document.getElementsByClassName("selections")[0];
1432
+ measitemVal=divduplicater[2].value;
1433
  div=divduplicater[4].children;
1434
  var divValues=[div[0].value, div[1].value , div[2].value];
1435
  mctname=[selections.value ,divValues , measitemVal ];
1436
  console.log(mctname)
1437
  if(div[0].value && div[1].value && div[2].value)
1438
+ {
1439
+ flag=1;
1440
  arrmctNames.push( mctname);
1441
  }
1442
 
 
1447
  console.log(arrmctNames)
1448
  // if (repeatforloopI>0){
1449
  if (ii==0 ){
1450
+
1451
  count=0;
1452
  var ii0selections='';
1453
  var cc= (document.getElementsByClassName('repeatforloopclass'+ii.toString()+'0')[0]).parentNode.children;
1454
+ console.log('jjj',cc)
1455
  for (let o =0;o <=cc.length;o++)
1456
  {
1457
  if( cc[o] instanceof(HTMLDivElement) )
1458
  count++;
1459
+ ii0selections=cc[1].value;
1460
+ measitemVal=cc[2].value;
1461
+
1462
  }
1463
  console.log(count);
1464
  for (let i =1 ; i <count ; i++){
 
1471
  if(replicatedDivChildren[0].value && replicatedDivChildren[1].value && replicatedDivChildren[2].value)
1472
  {
1473
  // console.log(mctname1);
1474
+ flag=1;
1475
  arrmctNames.push(mctname1);
1476
  }
1477
  }
 
1482
  count=0;
1483
  var ii0selections='';
1484
  var cc= (document.getElementsByClassName('repeatforloopclass'+ii.toString()+'0')[0]).parentNode.children;
1485
+
1486
  for (let o =0;o <=cc.length;o++)
1487
  {
1488
  if( cc[o] instanceof(HTMLDivElement) )
1489
  { count++;
1490
  console.log('divvvv',cc[o])}
1491
+ // var selectionsval= cc[o][1];
1492
+ // console.log(cc[o].children[1]);
1493
+ ii0selections=cc[1].value;
1494
+ measitemVal=cc[2].value;
1495
  // count++;
1496
  // ii0selections=cc[3].value;
1497
  }
 
1504
  // console.log(document.getElementsByClassName('repeatforloopclass'+ii.toString()+i.toString())[0].parentElement)
1505
 
1506
  var divValues2=[replicatedDivChildren[0].value, replicatedDivChildren[1].value , replicatedDivChildren[2].value];
1507
+ mctname1=[ii0selections ,divValues2 , measitemVal];
1508
  if(replicatedDivChildren[0].value && replicatedDivChildren[1].value && replicatedDivChildren[2].value)
1509
  {
1510
  // if (!(arrmctNames.includes(mctname1))){
1511
  arrmctNames.push(mctname1);
1512
+ flag=1;
1513
  // console.log(arrmctNames)
1514
  // }
1515
  }
 
1519
 
1520
  // }
1521
 
1522
+ // else
1523
+ // {
1524
+ //first entry only
1525
+ arrFinalMCNames= arrmctNames.slice();
1526
  // }
1527
  console.log(arrmctNames)
1528
 
 
1542
  // console.log('NAME = ' +name);
1543
  if (arrmctNames[i][1][1] == arrmctNames[j][1][1] && arrmctNames[i][1][2] == arrmctNames[j][1][2])
1544
  { var selectionsname=arrmctNames[i][0] ;
1545
+ flag=1;
1546
  console.log('foorrr',arrmctNames[i][1][1])
1547
 
1548
  if (allnames.includes(arrmctNames[i][1][0]) )
 
1573
  if (!name.includes(arrmctNames[i][1][1] ) ||!name.includes(arrmctNames[i][1][2] ) ){
1574
  name.push( arrmctNames[i][1][1] , arrmctNames[i][1][2] );
1575
  newarr.push(arrmctNames[i][1][1] , arrmctNames[i][1][2] );
1576
+
1577
  }
1578
 
1579
  }
 
1582
  console.log(measitemVal)
1583
  // allnames.push(newarr );
1584
  if (newarr.length >0){
1585
+ flag=1;
1586
  arrFinalMCNames.push([selectionsname , newarr, measitemVal ]);
1587
 
1588
 
 
1590
  }
1591
 
1592
  console.log('finals',arrFinalMCNames);
1593
+ console.log('fl='+flag)
1594
+
1595
 
1596
  }
1597
+
1598
  arrFinalMCNames.push([spreadsheetId]);
1599
+
1600
  }
1601
+
1602
  if (flag==1){
1603
+ console.log('inifffffff');
1604
+ // $.get( '/mctnametoGoogleSheet/'+JSON.stringify(arrFinalMCNames)).then(function(){
1605
+ $.get( '/mctnametoGoogleSheet/'+ JSON.stringify(arrFinalMCNames)).then( function(data) {
1606
+ listofnames=data[1];
1607
+
1608
+ var is_same = listofnames.length == arrallvalues.length && listofnames.every(function(element, index) {
1609
+ //return element === array2[index];
1610
+ if(arrallvalues.indexOf(element)>-1){
1611
+ return element = arrallvalues[arrallvalues.indexOf(element)];
1612
+ }
1613
+ });
1614
+ console.log(is_same);
1615
+ if (is_same)
1616
+ {
1617
+
1618
+ spreadsheetURL=spreadsheetURL+ '/edit#gid='+data[0].toString()
1619
+ console.log(spreadsheetURL);
1620
+ window.open(spreadsheetURL.toString()) //sheetid
1621
 
1622
+ }
1623
+ else{
1624
+ alert('Guessed names in the legend do not match the names in the ADR Console. Please revise the inputs.');
1625
+
1626
+ }
1627
+
1628
+ });
1629
  }
1630
 
1631
  }
 
1652
  clone.id = 'repeatforloop'+ addciconval + ++jj;
1653
  clone.setAttribute('class','repeatforloopclass'+addciconval+jj);
1654
  clone.setAttribute('name','repeatforloopname'+addciconval+jj);
1655
+ if (clonedDivId==0)
1656
+ clone.style.marginLeft='5px';
1657
+ else
1658
+ clone.style.marginLeft='1px';
1659
 
1660
+ dupDiv.appendChild(clone)
1661
+ dupDiv.insertBefore(clone,document.getElementById('doneebackground'));
1662
 
1663
  console.log(dupDiv.children);
1664
 
 
1687
  }
1688
 
1689
  }
1690
+ var levelsin = document.getElementsByName('levelsnameinput')[0]; //number of colors -- color pickers
1691
+ console.log(levelsin.value)
1692
  function generatecolorPickers(){
 
1693
  var drp = document.getElementById("colorpickers");
1694
+ console.log('wdithhh', typeof drp.offsetWidth)
1695
+ if (levelsin.value>1)
1696
+ {
1697
  drp.innerHTML = '';
1698
  console.log(levelsin.value)
1699
  for (let i=0 ; i<levelsin.value ; i++)
1700
  {
1701
  var color = document.createElement("input");
1702
  color.type='color';
1703
+ color.value=getRandomColor();
1704
  color.id= 'color';
1705
  color.name='color'+i;
1706
+ if ( (drp.offsetWidth) >250)
1707
+ drp.style.display='block';
1708
+
1709
  drp.append(color);
1710
+
1711
  if (i==0)
1712
  color.style.marginLeft='1%';
1713
 
1714
  }
1715
  console.log(drp)
 
1716
  }
1717
+ else{
1718
+ drp.innerHTML = '';
1719
 
1720
+ }
1721
+ }
1722
+ // var tooltipelem = document.getElementById("tooltip");
1723
+ // console.log(tooltipelem)
1724
+ // tooltipelem.addEventListener('mouseover',function(){
1725
+ // tooltipelem.value='Choose whether this project contains levels or not. If you wish to measure all of the plan, let the number of plans equal to one. If you wish to measure certain regions of the plan or have the plan divided into levels, please type in a number greater than 1 (number of levels).'
1726
+
1727
+ // })
1728
+ // // tooltipelem.addEventListener('mouseout',function(){
1729
+ // // tooltipelem.outerText='';
1730
+
1731
+
1732
+ // // })
1733
+ function getRandomColor() {
1734
+ var letters = '0123456789ABCDEF';
1735
+ var color = '#';
1736
+ for (var i = 0; i < 6; i++) {
1737
+ color += letters[Math.floor(Math.random() * 16)];
1738
+ }
1739
+ return color;
1740
+ }
1741
+ function getSecondData(){
1742
+ // var formData = new FormData(form);
1743
+ // colorsarr=[];
1744
+ // val=0;
1745
+ // answers=[];
1746
+ // var ratio1=0;
1747
+ // var ratio2=0;
1748
+ // var tomeasureproj=''
1749
+ // // iterate through entries...
1750
+ // for (var pair of formData.entries()) {
1751
+ // console.log(pair[0] + ": " + pair[1]);
1752
+ // }
1753
+ getmctName()
1754
+
1755
+ }
1756
  </script>
1757