1<!DOCTYPE html> 2<html lang="en"> 3 4<head> 5 6<!-- Metadata --> 7 <meta charset="UTF-8"> 8 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 9 <meta name="apple-mobile-web-app-title" content="CodePen"> 10 <link rel="canonical" href="https://codepen.io/knyttneve/pen/eYdQbpN"> 11 <link rel="apple-touch-icon" type="image/png" href="https://cpwebassets.codepen.io/assets/favicon/apple-touch-icon-5ae1a0698dcc2402e9712f7d01ed509a57814f994c660df9f7a952f3060705ee.png"> 12 <link rel="shortcut icon" type="image/x-icon" href="static/images/img/analysis/icon.ico"> 13 <link rel="mask-icon" type="image/x-icon" href="https://cpwebassets.codepen.io/assets/favicon/logo-pin-b4b4269c16397ad2f0f7a01bcdf513a1994f4c94b8af2f191c09eb0d601762b1.svg" color="#111"> 14 15 <!-- Stylesheets --> 16 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> 17 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/> 18 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"> 19 <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 20 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css"> 21 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> 22 <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css"> 23 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> 24 <link rel="stylesheet" type="text/css" href="https://unpkg.com/@ag-grid-community/all-modules/dist/styles/ag-grid.css"> 25 <link rel="stylesheet" type="text/css" href="https://unpkg.com/@ag-grid-community/all-modules/dist/styles/ag-theme-alpine.css"> 26 <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> 27 <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4-4.5.2/jq-3.3.1/dt-1.11.5/b-2.2.2/sl-1.3.3/datatables.min.css"/> 28 <link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet"> 29 <link rel='stylesheet' href='static/css/style-template.css' /> 30 <link rel='stylesheet' href='static/css/style-file-analysis.css' /> 31 32 <!-- JavaScript Libraries --> 33
33<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
33 34
34<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
34 35
35<script src="https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js"></script>
35 36
36<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
36 37
37<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.6.0/d3.min.js" charset="utf-8"></script>
37 38
38<script src="https://d3js.org/d3-scale-chromatic.v1.min.js" charset="utf-8"></script>
38 39
39<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
39 40
40<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
40 41
41<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
41 42
42<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
42 43
43<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>
43 44
44<script type="text/javascript" src="https://cdn.datatables.net/v/bs4-4.5.2/jq-3.3.1/dt-1.11.5/b-2.2.2/sl-1.3.3/datatables.min.js"></script>
44 45
45<script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>
45 46
46<script src="static/js/script.js"></script>
46 47
47<script src="static/js/translations.js"></script>
47 48
48<script src="static/js/script2.js"></script>
48 49
49<script src="http://localhost:35729/livereload.js"></script>
49 50 <title>TestunRhydd/FreeTxt</title> 51<style> 52 .brands h3, .hero-unit .button-section a { 53 font-weight: 400; 54} 55 56.col-xs-12 { 57 width: 100%; 58} 59.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-13, .col-lg-14, .col-lg-15, .col-lg-16, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-13, .col-xl-14, .col-xl-15, .col-xl-16, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { 60 float: left; 61 padding-left: 10px; 62 padding-right: 10px; 63} 64 65ul, menu, dir { 66 display: block; 67 list-style-type: disc; 68 -webkit-margin-before: 1em; 69 -webkit-margin-after: 1em; 70 -webkit-margin-start: 0px; 71 -webkit-margin-end: 0px; 72 -webkit-padding-start: 40px; 73} 74 75.brand-logos { 76 margin: 0; 77 padding: 0; 78} 79 80ul { 81 list-style-type: none; 82} 83 84.brand-logos li { 85 display: inline-block; 86 padding: 19px 25px 0; 87 vertical-align: middle; 88} 89 90.brands { 91 padding-top: 63px; 92 padding-bottom: 63px; 93} 94 95.text-center { 96 text-align: center; 97} 98.language-switcher { 99 width: 80px; 100 height: 30px; 101 border-radius: 20px; 102 background-color: #222; 103 position: relative; 104 overflow: hidden; 105 cursor: pointer; 106} 107 108.slider { 109 width: 160px; /* double the width of the switcher */ 110 height: 30px; 111 display: flex; 112 align-items: center; 113 justify-content: space-between; 114 position: absolute; 115 transition: all 0.3s; 116} 117 118.lang-flag { 119 width: 40px; 120 height: 40px; 121 display: flex; 122 align-items: center; 123 justify-content: center; 124 flex-shrink: 0; 125} 126 127/* Start with English as the active language */ 128#englishFlag { 129 background-color: rgba(0, 128, 255, 0.1); /* Light blue for English */ 130} 131 132#welshFlag { 133 background-color: rgba(0, 128, 255, 0.1); /* Light black for Welsh */ 134} 135 136.lang-flag[data-active="true"] { 137 background-color: rgba(255, 255, 255, 0.3); /* Light overlay for the active flag */ 138} 139.lang-label { 140 position: absolute; 141 top: 50%; 142 transform: translateY(-50%); 143 font-weight: bold; 144 font-size: 14px; 145 color : white; 146} 147 148#enLabel { 149 left: 5px; 150} 151 152#cyLabel { 153 right: 5px; 154} 155 156#feedback-tab { 157 position: fixed; 158 right: 0; 159 top: 140px; 160 background: #0b0b0b; 161 padding: 0px; 162 border-top-left-radius: 5px; 163 border-bottom-left-radius: 5px; 164 z-index: 1000; /* Ensure it's on top */ 165} 166/* Feedback Form Styles */ 167#feedback-form { 168 display: none; 169 background: #fff; 170 padding: 20px; 171 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 172 margin-top: 10px; 173 width: 800px; 174 max-height: 500px; 175 z-index: 1001; /* Above the tab */ 176 overflow-y: auto; 177} 178 179/* Feedback Button Styles */ 180#feedback-button { 181 position: absolute; 182 left: -100px; /* Adjust as necessary */ 183 top: 10px; /* Adjust as necessary */ 184 padding: 5px 10px; 185 cursor: pointer; 186} 187 188/* Form Element Styles */ 189#feedback-form { 190 max-width: 850px; 191 margin: 20px auto; 192 background: #fff; 193 padding: 20px; 194 border-radius: 8px; 195 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 196} 197 198input[type="text"], 199textarea, 200select { 201 width: 100%; 202 padding: 8px; 203 box-sizing: border-box; 204 border: 1px solid #ccc; 205 border-radius: 4px; 206 margin-bottom: 20px; 207 font-size: 1em; 208} 209 210/* Label Styles */ 211label { 212 font-weight: bold; 213 display: block; 214 margin-bottom: 10px; 215} 216 217/* Textarea Styles */ 218textarea { 219 padding: 10px; 220 box-sizing: border-box; 221 border: 1px solid #ccc; 222 border-radius: 5px; 223} 224 225/* Modal Styles */ 226.modal { 227 position: fixed; 228 top: 0; left: 0; right: 0; bottom: 0; 229 background: rgba(0, 0, 0, 0.5); 230 display: flex; 231 align-items: center; 232 justify-content: center; 233} 234 235.modal button { 236 margin-top: 20px; 237} 238 239/* Range Slider Styles */ 240.range-container { 241 display: flex; 242 align-items: center; 243 position: relative; 244} 245 246.range-labels { 247 display: flex; 248 justify-content: space-between; 249 position: absolute; 250 width: 80%; 251 top: 10px; 252 left: 0px; 253} 254 255input[type=range] { 256 -webkit-appearance: none; 257 appearance: none; 258 width: 100%; 259 height: 5px; 260 border-radius: 5px; 261 background: #dcdcdc; 262 outline: none; 263 transition: opacity .2s; 264 margin: 20px 0; 265} 266 267/* Webkit (Chrome, Safari, etc.) Slider Thumb */
268input[type=range]::-webkit-slider-thumb { 269 -webkit-appearance: none; 270 appearance: none; 271 width: 20px; 272 height: 20px; 273 border-radius: 50%; 274 background: #007aff; 275 cursor: pointer; 276 transition: background .15s ease-in-out; 277} 278 279/* Firefox Slider Thumb */ 280input[type=range]::-moz-range-thumb { 281 width: 20px; 282 height: 20px; 283 border: none; 284 border-radius: 50%; 285 background: #007aff; 286 cursor: pointer; 287 transition: background .15s ease-in-out; 288} 289 290/* Firefox Range Track */ 291input[type=range]::-moz-range-track { 292 width: 100%; 293 height: 5px; 294 cursor: pointer; 295 animate: 0.2s; 296 border-radius: 5px; 297 background: #dcdcdc; 298} 299 300/* Question Container Styles */ 301.question-container { 302 margin-bottom: 20px; 303 padding-bottom: 20px; 304 border-bottom: 1px solid #eee; 305} 306 307/* Checkbox and Radio Group Styles */ 308.checkbox-group, 309.radio-group { 310 display: flex; 311 align-items: center; 312 margin-top: -2px; 313} 314 315.checkbox-group input[type="checkbox"], 316.radio-group input[type="radio"] { 317 margin-right: 5px; 318 margin-bottom: 8px; 319 width: 20px; /* Adjusted size */ 320 height: 20px; /* Adjusted size */ 321 vertical-align: middle; 322} 323 324.checkbox-group label, 325.radio-group label { 326 margin-left: 5px; 327 font-weight: normal; 328 display: flex; 329 align-items: center; 330} 331.range-container { 332 display: flex; 333 flex-direction: column; /* Stack elements vertically */ 334 align-items: center; 335 position: relative; 336 margin-bottom: 20px; /* Space below the entire container */ 337} 338 339/* Descriptive Labels Style */ 340.range-descriptive-labels { 341 display: flex; 342 justify-content: space-between; 343 width: 100%; /* Full width of the container */ 344 margin-bottom: 10px; /* Space above the slider */ 345} 346 347input[type=range] { 348 -webkit-appearance: none; 349 appearance: none; 350 width: 100%; /* Full width */ 351 /* ... other styles ... */ 352} 353 354/* Numeric Labels Style */ 355.range-labels { 356 display: flex; 357 justify-content: space-between; 358 width: 100%; /* Full width of the container */ 359 margin-top: 10px; /* Space below the slider */ 360} 361 362.menu-toggle { 363 display: none; /* Show the menu toggle button */ 364} 365 366.primary-menu { 367 display: flex; /* Hide the menu by default */ 368} 369 370@media screen and (max-width: 600px) { 371 .header-navigation-wrapper { 372 position: relative; /* Ensure positioning context */ 373 z-index: 2000; /* High z-index to bring header and its children to front */ 374 } 375 376 .menu-toggle { 377 display: block; /* Show the menu toggle button */ 378 cursor: pointer; 379 position: absolute; /* Position it within the header */ 380 top: 10px; 381 right: 10px; 382 z-index: 2001; /* Ensure it's above the .primary-menu */ 383 color: #fff; /* Ensure visibility */ 384 background: #2c2a2a; /* Contrast background */ 385 padding: 10px; 386 font-size: 20px; 387 } 388 389 .primary-menu { 390 display: none; /* Hide the menu by default */ 391 position: absolute; /* Absolute position */ 392 top: 40px; /* Position below the toggle button */ 393 left: 0; 394 width: 100%; /* Full width */ 395 background: #2c2a2a; /* Background color for the menu */ 396 box-shadow: 0 8px 16px rgb(7, 7, 7); /* Optional shadow for better visibility */ 397 z-index: 2000; /* High z-index to ensure it's above other page content */ 398 text-align: left; 399 } 400 401 .primary-menu li { 402 display: block; /* Stack the list items vertically */ 403 text-align: left; /* Right-align the text */ 404 } 405 406 .primary-menu a { 407 display: block; /* Block display for full-width links */ 408 padding: 10px; /* Padding for touch friendliness */ 409 color: #f3eaea; /* Text color */ 410 text-decoration: none; /* Removes underline from links */ 411 } 412 .primary-menu a:hover { 413 background-color: #010101; 414 color: #c0b9b9; 415 } 416 417} 418 419</style> 420 421<body> 422 <!-- Simplified Header --> 423 <div class="header-navigation-wrapper"> 424 425 <h1 style="color: white;"data-lang-en="FreeTxt" data-lang-cy="TestunRhydd">FreeTxt</h1> 426 <div class="menu-toggle">â° Menu</div> 427 <nav> 428 429 <ul class="primary-menu"> 430 <li><a href="/" data-lang-en="Home" data-lang-cy="Hafan">Home</a></li> 431 <li><a href="/fileanalysis" data-lang-en="Analyse" data-lang-cy="Dadansoddi">Analyse</a></li> 432 <li><a href="/userguide" data-lang-en="User Guide" data-lang-cy="Canllaw i Ddefnyddiwr">User Guide</a></li> 433 <li><a href="/about" data-lang-en="About" data-lang-cy="Amdanom">About</a></li> 434 <li><a href="http://digigrid.cymru/">GDC-WDG</a></li> 435 436 </ul> 437 </nav> 438 439 <div class="language-switcher"> 440 <div class="slider">
441 <span id="englishFlag" class="lang-flag" data-lang="en" data-active="true"></span> 442 <span id="welshFlag" class="lang-flag" data-lang="cy" data-active="false"></span> 443 </div> 444 <span class="lang-label" id="enLabel">CY</span> 445 <span class="lang-label" id="cyLabel">EN</span> 446 447 </div> 448 <div class="toggle-container"> 449 <input type="checkbox" id="darkModeToggleCheckbox" class="checkbox"> 450 <label for="darkModeToggleCheckbox" class="label"></label> 451 </div> 452 </div> 453 454 <div id="feedback-tab" > 455 <button id="feedback-button" class = 'analyze-btn' data-lang-en="Feedback" data-lang-cy="Adborth">Feedback</button> 456 457 458<form id = "feedback-form" method="post" action="/"> 459 <div class="question-container"> 460 <label for="role" data-lang-en="Role and affiliation:" data-lang-cy="Swydd a sefydliad:">Role and affiliation:</label><br> 461 <input type="text" id="role" name="role" required><br> 462</div> 463<div class="question-container"> 464 <label data-lang-en="Is this the first time you have used FreeTxt?" data-lang-cy="Ai dyma'r tro cyntaf i chi ddefnyddio TestunRhydd?">Is this the first time you have used FreeTxt?</label> 465 <div class="radio-group"> 466 <input type="radio" id="yes" name="first_time" value="Yes" required> 467 <label for="yes" data-lang-en="Yes" data-lang-cy="Ie">Yes</label> 468 </div> 469 <div class="radio-group"> 470 <input type="radio" id="no" name="first_time" value="No" required> 471 <label for="no" data-lang-en="No" data-lang-cy="Nage">No</label> 472 </div> 473</div> 474<div class="question-container"> 475 <label for="future_use" data-lang-en="How likely are you to use FreeTxt again in the future?" data-lang-cy="Pa mor debygol ydych chi o ddefnyddio TestunRhydd eto yn y dyfodol?">How likely are you to use FreeTxt again in the future?</label><br> 476 <div class="range-container"> 477 <div class="range-descriptive-labels"> 478 <span data-lang-en="Very unlikely" data-lang-cy="Annhebygol iawn">Very unlikely</span> 479 <span data-lang-en="Very likely" data-lang-cy="Tebygol iawn">Very likely</span> 480 </div> 481 <input type="range" id="future_use" name="future_use" min="1" max="5" required> 482 <div class="range-labels"> 483 <span>1</span> 484 <span>2</span> 485 <span>3</span> 486 <span>4</span> 487 <span>5</span> 488 </div> 489 </div> 490 491</div> 492<div class="question-container"> 493 <label data-lang-en="How easy did you find FreeTxt to use?" data-lang-cy="Pa mor hawdd oedd defnyddio TestunRhydd i chi?">How easy did you find FreeTxt to use?</label><br> 494 495 <div class="range-container"> 496 <div class="range-descriptive-labels"> 497 <span data-lang-en="Strongly Disagree" data-lang-cy="Anghytuno'n Gryf">Strongly Disagree</span> 498 499 <span data-lang-en="Strongly Agree" data-lang-cy="Cytuno'n Gryf">Strongly Agree</span> 500 501 </div> 502 <input type="range" id="ease_of_use" name="ease_of_use" min="1" max="5" required> 503 <div class="range-labels"> 504 <span>1</span> 505 <span>2</span> 506 <span>3</span> 507 <span>4</span> 508 <span>5</span> 509 </div> 510 </div> 511</div> 512<div class="question-container"> 513 <label data-lang-en="Which particular FreeTxt tool(s) do you most like, and why? (Select all that apply)" data-lang-cy="Pa offer(yn) penodol yn TestunRhydd ydych chi'n eu/ei hoffi fwyaf, a pham? (Dewiswch bob un sy'n gymwys)">Which particular FreeTxt tool(s) do you most like, and why? (Select all that apply)</label><br> 514 <div class="checkbox-group"> 515 <input type="checkbox" id="liked-sentimentAnalysis" name="likedTools" value="Sentiment Analysis"> 516 <label for="sentimentAnalysis" data-lang-en="Sentiment analysis (pie chart and bar graph)" data-lang-cy="Dadansoddi sentiment (siart cylch a graff bar)">Sentiment analysis (pie chart and bar graph)</label> 517 </div> 518 519 <div class="checkbox-group"> 520 <input type="checkbox" id="liked-reviewsKeywordScatter" name="likedTools" value="Reviews Keyword Scatter"> 521 <label for="reviewsKeywordScatter"data-lang-en="Positive and negative reviews: keyword scatter" data-lang-cy="Adolygiadau cadarnhaol a negyddol: gwasgariad allweddeiriau">Positive and negative reviews: keyword scatter</label> 522 </div> 523 524 <div class="checkbox-group"> 525 <input type="checkbox" id="liked-summariser" name="likedTools" value="Summariser"> 526 <label for="summariser"data-lang-en="Summariser" data-lang-cy="Crynodebu">Summariser</label> 527 </div> 528 529 <div class="checkbox-group"> 530 <input type="checkbox" id="liked-wordCloud" name="likedTools" value="Word Cloud"> 531 <label for="wordCloud"data-lang-en="Word cloud" data-lang-cy="Cwmwl Geiriau">Word cloud</label> 532 </div> 533 534 <div class="checkbox-group"> 535 <input type="checkbox" id="liked-wordUse" name="likedTools" value="Word Use and Relationships"> 536 <label for="wordUse" data-lang-en="Word use and relationships (keyword representation and network graph)" data-lang-cy="Defnydd a pherthnasoedd geiriau (cynrychioli allweddeiriau a graff rhwydweithiau)">Word use and relationships (keyword representation and network graph)</label> 537 </div> 538 539 <div class="checkbox-group"> 540 <input type="checkbox" id="liked-wordTree" name="likedTools" value="Word Tree"> 541 <label for="wordTree" data-lang-en="Word tree" data-lang-cy="Coeden Eiriau">Word tree</label> 542 </div> 543 544 <label for="likedTools"data-lang-en="Other:" data-lang-cy="Arall:">Other:</label> 545 <input type="text" id="likedToolsOther" name="likedToolsOther"> 546</div> 547 548<div class="question-container"> 549 <label data-lang-en="Which particular FreeTxt tool(s) do you least like, and why? (Select all that apply)" data-lang-cy="Pa offer(yn) penodol yn TestunRhydd ydych chi'n eu/ei hoffi leiaf, a pham? (Dewiswch bob un sy'n gymwys)">Which particular FreeTxt tool(s) do you least like, and why? (Select all that apply)</label><br> 550 <div class="checkbox-group"> 551 <input type="checkbox" id="leastLiked-sentimentAnalysis" name="least_liked_tools" value="Sentiment Analysis"> 552 <label for="sentimentAnalysis" data-lang-en="Sentiment analysis (pie chart and bar graph)" data-lang-cy="Dadansoddi sentiment (siart cylch a graff bar)">Sentiment analysis (pie chart and bar graph)</label> 553 </div> 554 555 <div class="checkbox-group"> 556 <input type="checkbox" id="leastLiked-reviewsKeywordScatter" name="least_liked_tools" value="Reviews Keyword Scatter"> 557 <label for="reviewsKeywordScatter"data-lang-en="Positive and negative reviews: keyword scatter" data-lang-cy="Adolygiadau cadarnhaol a negyddol: gwasgariad allweddeiriau">Positive and negative reviews: keyword scatter</label> 558 </div> 559 560 <div class="checkbox-group"> 561 <input type="checkbox" id="leastLiked-summariser" name="least_liked_tools" value="Summariser"> 562 <label for="summariser"data-lang-en="Summariser" data-lang-cy="Crynodebu">Summariser</label> 563 </div> 564 565 <div class="checkbox-group"> 566 <input type="checkbox" id="leastLiked-wordCloud" name="least_liked_tools" value="Word Cloud"> 567 <label for="wordCloud"data-lang-en="Word cloud" data-lang-cy="Cwmwl Geiriau">Word cloud</label> 568 </div> 569 570 <div class="checkbox-group"> 571 <input type="checkbox" id="leastLiked-wordUse" name="least_liked_tools" value="Word Use and Relationships"> 572 <label for="wordUse" data-lang-en="Word use and relationships (keyword representation and network graph)" data-lang-cy="Defnydd a pherthnasoedd geiriau (cynrychioli allweddeiriau a graff rhwydweithiau)">Word use and relationships (keyword representation and network graph)</label> 573 </div> 574 575 <div class="checkbox-group"> 576 <input type="checkbox" id="leastLiked-wordTree" name="least_liked_tools" value="Word Tree"> 577 <label for="wordTree" data-lang-en="Word tree" data-lang-cy="Coeden Eiriau">Word tree</label> 578 </div> 579 580 <label for="least_liked_tools"data-lang-en="Other:" data-lang-cy="Arall:">Other:</label> 581 <input type="text" id="leastLikedToolsOther" name="leastLikedToolsOther"> 582</div> 583 584 585 <div class="question-container"> 586 <label for="future_anticipation" data-lang-en="How do you anticipate that you or others will use FreeTxt in the future?" data-lang-cy="Sut ydych chi'n rhagweld y byddwch chi neu eraill yn defnyddio TestunRhydd yn y dyfodol?">How do you anticipate that you or others will use FreeTxt in the future?</label> 587 <textarea id="future_anticipation" name="future_anticipation" required></textarea> 588 </div> 589 <div class="question-container"> 590 <label for="additional_functionalities" data-lang-en="What additional functionalities/utilities would you like us to include in FreeTxt in the future?" data-lang-cy="Pa nodweddion/gwasanaethau ychwanegol hoffech chi i ni eu cynnwys yn TestunRhydd yn y dyfodol?">What additional functionalities/utilities would you like us to include in FreeTxt in the future?</label> 591 <textarea id="additional_functionalities" name="additional_functionalities" required></textarea> 592 </div> 593 <div class="question-container"> 594 <label for="additional_comments" data-lang-en="Add any additional comments or suggestions below:" data-lang-cy="Ychwanegwch unrhyw sylwadau neu awgrymiadau ychwanegol isod:">Add any additional comments or suggestions below:</label> 595 <textarea id="additional_comments" name="additional_comments" required></textarea> 596 </div> 597 598 <button class = 'analyze-btn' value="Submit" data-lang-en="Submit" data-lang-cy="Anfon">Submit</button> 599</form> 600 601 </div> 602 603 604 <main class="content-container"> 605 606<style> 607 body { 608 margin: 0; 609 padding: 0; 610 } 611 612 .content-container { 613 margin: 20px; /* Margin around the edges */ 614 padding: 20px; /* Padding inside the div */ 615 max-width: 90%; /* Maximum width of the div */ 616 margin-left: auto; /* Centering the div */ 617 margin-right: auto; /* Centering the div */ 618 } 619 h2 { 620 color: #333; 621 } 622 .color-boxes { 623 justify-content: center;
624 align-content: center; 625 display: flex; 626 gap: 20px; 627 margin-top: 20px; 628 margin-bottom: 20px; 629 } 630 .color-box { 631 padding: 20px; 632 border-radius: 10px; 633 color: white; 634 width: 150px; 635 text-align: center; 636 font-weight: bold; 637 } 638 .blue { 639 background: linear-gradient(to right, #003366, #0066cc, #0099cc, #00ccff); 640 } 641 .red { 642 background: linear-gradient(to right, #660000, #990000, #cc0000, #ff6666); 643 } 644 .yellow { 645 background: linear-gradient(to right, #ffcc00, #ffdd33f5, #ffee66, #ffff99); 646 color: black; 647 } 648 .orange { 649 background: linear-gradient(to right, #cc6600, #ff9933, #ffad33, #ffcc66); 650 } 651 .image-container { 652 display: flex; 653 justify-content: center; 654 align-items: center; 655 height: 100%; /* Adjust this value based on your needs */ 656 } 657 .hidden-checkbox { 658 display: none; 659 } 660 661 .checkbox-option { 662 cursor: pointer; 663 flex: 0 0 calc(50% - 30px); 664 box-sizing: border-box; 665 height: 150px; 666 border: 1px solid gray; 667 margin: 10px; 668 padding: 10px; 669 text-align: center; 670 vertical-align: middle; 671 float: left; 672 } 673 674 .checkbox-option.selected { 675 border: 3px solid #ffd700; /* Gold border to indicate selected state */ 676 } 677 .tab-content { 678 display: flex; 679 flex-wrap: wrap; 680 justify-content: space-between; /* Adjusts spacing between the grid and the button */ 681 } 682 /* Sample grid layout */ 683 .grid { 684 display: flex; 685 flex-wrap: wrap; 686 gap: 20px; /* Space between squares */ 687 flex-wrap: wrap; /* Allow the blocks to wrap to the next line if there's not enough space */ 688 flex: 1; /* Allows the grid to take the available space */ 689 margin-right: 20px; 690 } 691 692 .grid .square { 693 transition: transform 0.3s, box-shadow 0.3s; 694 /* Increased width */ 695 box-sizing: border-box; /* To ensure padding doesn't affect width */ 696 padding: 20px; 697 display: flex; 698 flex-direction: column; 699 align-items: center; 700 justify-content: center; /* This will center the content vertically */ 701 text-decoration: none; 702 color: white; 703 position: relative; 704 } 705 706 .flex-container { 707 display: flex; 708 align-items: center; /* This will vertically center the grid and the button */ 709 } 710 711 #generatePdfBtn { 712 background-color: #2e2e2f; /* Blue color */ 713 color: white; 714 border: none; 715 border-radius: 5px; 716 padding: 10px 20px; 717 font-size: 24px; 718 cursor: pointer; 719 display: flex; 720 align-items: center; 721 gap: 10px; /* Space between the icon and the text */ 722 transition: background-color 0.3s; 723 height: 550px; 724 } 725 726 #generatePdfBtn:hover { 727 background-color: #0c0c0c; /* Darker blue color on hover */ 728 } 729 /* Styling the file input */ 730 #file-to-analyze input[type="file"] { 731 padding: 10px; 732 border: 1px solid #d4d4d4; 733 margin-right: 10px; 734 cursor: pointer; 735 appearance: none; /* Remove the default browser styling */ 736 border-radius: 4px; 737 outline: none; 738 } 739 740 #file-to-analyze:hover input[type="file"] { 741 border-color: #050505; 742 } 743 744 .hover-content { 745 position: absolute; 746 top: 0; 747 left: 0; 748 width: 100%; 749 height: 100%; 750 display: flex; 751 align-items: center !important; 752 justify-content: center !important; 753 background-color: rgba(0, 0, 0, 0.8); /* semi-transparent black */ 754 color: white; /* text color */ 755 opacity: 0; /* hidden initially */ 756 transition: opacity 0.3s; 757 pointer-events: none; /* to make sure the hover-content doesn't interfere with the clickability of the square */ 758 } 759 .grid .square:hover { 760 transform: translateY(-10px); 761 box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); 762 } 763 .grid .square:hover .hover-content { 764 opacity: 1; /* show on hover */ 765 } 766 767 .generate-button-container { 768 flex-basis: auto; /* Adjusts the width of the button container */ 769 align-self: center; /* Vertically centers the button in case the grid is taller */ 770 } 771 772 .btn-list { 773 list-style-type: none; /* Remove bullet points */ 774 padding: 0; 775 display: flex; 776 justify-content: space-around; 777 } 778 779 .analyze-btnn { 780 display: inline-block; 781 font-weight: bold; 782 color: white; 783 padding: 12px 24px; 784 border: none; 785 border-radius: 25px; /* Gives a rounded corner */ 786 text-decoration: none; /* Remove underlines */ 787 transition: transform 0.2s, box-shadow 0.2s; /* Transition for smooth hover effect */ 788 box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* A subtle shadow for depth */ 789 cursor: pointer; /* Indicate it's clickable */ 790 } 791 792 .btn-gradient { 793 background: linear-gradient( 794 45deg, 795 #ff6b81, 796 #7754d7 797 ); /* Gradient background */ 798 } 799 800 .analyze-btnn:hover { 801 transform: translateY(-2px); /* Moves the button up slightly */ 802 box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1); /* Increase shadow on hover */ 803 } 804 .column-label { 805 display: inline-block; 806 border: 1px solid #ccc; 807 margin-right: 10px; 808 padding: 5px; 809 border-radius: 5px; 810 } 811 812 .column-label button { 813 background-color: red; 814 color: white; 815 border: none; 816 border-radius: 50%;
817 width: 20px; 818 height: 20px; 819 line-height: 20px; 820 text-align: center; 821 margin-left: 10px; 822 cursor: pointer; 823 } 824 #text-to-analyze { 825 width: 100%; 826 height: 300px; 827 min-width: 200px; 828 resize: vertical; /* This allows the user to resize the textarea vertically */ 829 } 830 .input-container { 831 width: 100%; 832 height: auto; 833 margin: auto; 834 } 835 836 #example-options { 837 background-color: #f7f7f7; /* Light grey background */ 838 padding: 20px; /* Padding around container */ 839 border-radius: 10px; /* Rounded corners */ 840 width: 100%; /* Fixed width */ 841 margin: 20px auto; /* Centered on the page with a top and bottom margin of 20px */ 842 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* A subtle shadow */ 843 display: none; /* Initially hidden as per your class "hidden" */ 844 } 845 846 /* Select box styles */ 847 #example-data { 848 width: 100%; /* Takes full width of container */ 849 padding: 10px; /* Padding inside the select box */ 850 border-radius: 5px; /* Rounded corners */ 851 border: 1px solid #ccc; /* Border color */ 852 margin-bottom: 10px; /* Space between select box and button */ 853 } 854 /* Styling for the custom file label */ 855 .custom-file-label { 856 display: inline-block; 857 padding: 10px; 858 border: 1px solid #d4d4d4; 859 cursor: pointer; 860 appearance: none; 861 border-radius: 4px; 862 outline: none; 863 background-color: #fff; 864 transition: background-color 0.2s ease; 865 } 866 867 .custom-file-label:hover { 868 background-color: #f5f5f5; 869 } 870 #file-to-analyze { 871 flex-direction: column; 872 gap: 20px; /* adjusts the space between the file input and button */ 873 align-items: flex-start; 874 padding: 15px; 875 border: 1px solid #e0e0e0; /* assuming there's a border on your example data section */ 876 border-radius: 5px; 877 background-color: #f9f9f9; /* assuming there's a light background on your example data section */ 878 width: 100%; 879 margin: 0 auto; 880 } 881 882 .file-upload { 883 display: flex; 884 align-items: center; 885 gap: 15px; /* adjusts the space between the label and file name */ 886 width: 100%; 887 position: relative; 888 } 889 890 .custom-file-upload { 891 background-color: #1b1b1c; /* using a blue color as an example, adjust if needed */ 892 color: #fff; 893 padding: 8px 15px; 894 border-radius: 4px; 895 cursor: pointer; 896 transition: background-color 0.3s; 897 } 898 899 .custom-file-upload:hover { 900 background-color: #4f5051; /* hover effect, a darker shade of blue */ 901 } 902 903 .file-name { 904 flex-grow: 1; /* allows the filename span to take available space */ 905 padding: 8px 10px; 906 border: 1px solid #d4d4d4; 907 border-radius: 4px; 908 background-color: #ffffff; 909 overflow: hidden; 910 white-space: nowrap; 911 text-overflow: ellipsis; 912 } 913 914 .input-hidden { 915 position: absolute; 916 opacity: 0; 917 top: 0; 918 left: 0; 919 width: 100%; 920 height: 100%; 921 cursor: pointer; 922 background-color: black; 923 } 924 925 /* Container Style */ 926 .column-selection-container { 927 width: 100%; /* Set to the full width of its parent container */ 928 padding: 10px 20px; 929 background-color: #f7f7f7; 930 border-bottom: 1px solid #e0e0e0; 931 } 932 933 /* Heading style */ 934 .column-selection-container h4 { 935 font-size: 1.2em; 936 color: #333; 937 margin-bottom: 15px; 938 border-bottom: 2px solid #ff4000; 939 padding-bottom: 10px; 940 } 941 942 /* Dropdown container style */ 943 .columns-dropdown-container { 944 width: 100%; 945 position: relative; /* This will help if you want to add any absolute positioned elements inside */ 946 } 947 948 /* Style for the dropdown */ 949 .styled-dropdown { 950 width: 100%; 951 min-height: 150px; 952 border: 1px solid #e0e0e0; 953 padding: 10px; 954 border-radius: 4px; 955 font-size: 1em; 956 background-color: #fff; 957 appearance: none; 958 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); 959 outline: none; 960 transition: border 0.2s; 961 } 962 963 .styled-dropdown:focus { 964 border-color: #007bff;
964 /* Accent color when focused */ 965 } 966 967 .styled-dropdown option { 968 padding: 5px 10px; 969 margin: 3px 0; 970 cursor: pointer; 971 transition: background-color 0.2s; 972 } 973 974 .styled-dropdown option:hover { 975 background-color: #e6f7ff; /* A light blue hover effect for options */ 976 } 977 978 /* Optional custom scrollbar */ 979 .styled-dropdown::-webkit-scrollbar { 980 width: 10px; 981 } 982 983 .styled-dropdown::-webkit-scrollbar-track { 984 background: #f1f1f1; 985 } 986 987 .styled-dropdown::-webkit-scrollbar-thumb { 988 background: #b0b0b0; 989 } 990 991 .styled-dropdown::-webkit-scrollbar-thumb:hover { 992 background: #808080; 993 } 994 995 /* General Slider Styles */ 996 input[type="range"] { 997 -webkit-appearance: none; 998 appearance: none; 999 width: 100%; 1000 height: 5px; 1001 border-radius: 5px; 1002 background: #dcdcdc; 1003 outline: none; 1004 transition: opacity 0.2s; 1005 margin: 20px 0; 1006 } 1007 1008 /* Style for Webkit (Chrome, Safari, etc.) */ 1009 input[type="range"]::-webkit-slider-thumb { 1010 -webkit-appearance: none; 1011 appearance: none; 1012 width: 20px; 1013 height: 20px; 1014 border-radius: 50%; 1015 background: #007aff; 1016 cursor: pointer; 1017 transition: background 0.15s ease-in-out; 1018 } 1019 1020 /* Style for Firefox */ 1021 input[type="range"]::-moz-range-thumb { 1022 width: 20px; 1023 height: 20px; 1024 border: none; 1025 border-radius: 50%; 1026 background: #007aff; 1027 cursor: pointer; 1028 transition: background 0.15s ease-in-out; 1029 } 1030 1031 /* Style for Firefox (range track) */ 1032 input[type="range"]::-moz-range-track { 1033 width: 100%; 1034 height: 5px; 1035 cursor: pointer; 1036 transition: all 0.2s; 1037 border-radius: 5px; 1038 background: #dcdcdc; 1039 } 1040 1041 /* Tooltip styles for displaying the value */ 1042 input[type="range"]::after { 1043 content: attr(value); 1044 position: absolute; 1045 top: -30px; 1046 left: 50%; 1047 transform: translateX(-50%); 1048 background-color: #007aff; 1049 color: white; 1050 padding: 4px 8px; 1051 border-radius: 8px; 1052 font-size: 14px; 1053 white-space: nowrap; 1054 } 1055 .file-instruction { 1056 font-size: 0.8em; 1057 color: #888; 1058 display: block; 1059 margin-top: 5px; 1060 } 1061 1062 #select-option-btn { 1063 font-weight: bold; 1064 margin-bottom: 15px; 1065 padding: 10px; 1066 border: 1px solid #ddd; 1067 border-radius: 5px; 1068 } 1069 1070 #select-option-btn:hover { 1071 color: #666; 1072 } 1073 1074 /* Style the container with class sentiment-option */ 1075 .sentiment-option { 1076 margin-bottom: 15px; 1077 padding: 10px; 1078 border: 1px solid #ddd; 1079 border-radius: 5px; 1080 } 1081 1082 /* Style for radio buttons within the sentiment-option class */ 1083 1084 .sentiment-option input[type="radio"], 1085 .sentiment-option label { 1086 display: inline-block; 1087 vertical-align: middle; /* Align them vertically to the middle */ 1088 } 1089 /* Style for labels within the sentiment-option class */ 1090 .sentiment-option label { 1091 font-weight: bold; 1092 color: #333; 1093 cursor: pointer; 1094 } 1095 .sentiment-option input[type="radio"] { 1096 margin-right: 5px; /* Space between radio button and label */ 1097 padding: 0; 1098 } 1099 1100 .sentiment-option label { 1101 margin: 0; 1102 padding: 0; 1103 } 1104 1105 /* Adding hover effect */ 1106 .sentiment-option label:hover { 1107 color: #666; 1108 } 1109 1110 /* Responsive adjustments */ 1111 @media screen and (max-width: 600px) { 1112 .sentiment-option label { 1113 font-size: 14px; 1114 } 1115 } 1116 /* Styles for smaller screens */ 1117 @media only screen and (max-width: 768px) { 1118 #text-to-analyze { 1119 width: 95%; 1120 } 1121 } 1122 @media (max-width: 480px) { 1123 .input-container { 1124 font-size: 0.8rem; /* Smaller font size for mobile devices */ 1125 padding: 0.5em; /* Smaller padding for mobile devices */ 1126 } 1127 } 1128 @media (max-width: 768px) { 1129 .square { 1130 min-width: calc(50% - 20px); /* Two items per row on smaller screens */ 1131 } 1132 .text-size-60 { 1133 font-size: 40px; /* Reduce the font size */ 1134 } 1135 .hover-content img { 1136 max-width: 70%; /* Reduce the image size */ 1137 } 1138 h3 { 1139 font-size: 1rem; /* Adjust heading size */ 1140 } 1141 } 1142 1143 /* Media query for very small screens (e.g., up to 480px width) */ 1144 @media (max-width: 480px) { 1145 .square { 1146 min-width: 100%; /* One item per row on very small screens */ 1147 } 1148 } 1149</style> 1150<!-- DataTables CSS --> 1151<link 1152 rel="stylesheet" 1153 type="text/css" 1154 href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css" 1155/> 1156 1157<!-- noUiSlider CSS --> 1158<link 1159 href="https://cdn.jsdelivr.net/npm/[email protected]/distribute/nouislider.min.css" 1160 rel="stylesheet" 1161/> 1162 1163<!-- Date Range Picker CSS --> 1164<link 1165 rel="stylesheet" 1166 type="text/css" 1167 href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" 1168/> 1169 1170 1171<h1 1172 data-lang-en="How would you like to start your analysis?" 1173 data-lang-cy="Sut hoffech chi ddechrau eich dadansoddiad?" 1174> 1175 How would you like to start your analysis? 1176</h1> 1177 1178<form 1179 id="text-analysis-form" 1180 method="POST" 1181 action="/fileanalysis" 1182 enctype="multipart/form-data" 1183> 1184 <!-- Radio buttons --> 1185 <label> 1186 <input 1187 type="radio" 1188 name="input-method" 1189 value="text" 1190 onclick="toggleInputOption('text')" 1191 checked 1192 data-lang-en="Past a text" 1193 data-lang-cy="Gludo testun" 1194 /> 1195 <span data-lang-en="Paste a text" data-lang-cy="Gludo testun" 1196 >Paste a text</span 1197 > 1198 </label> 1199 1200 <label> 1201 <input 1202 type="radio" 1203 name="input-method" 1204 value="example" 1205 onclick="toggleInputOption('example')" 1206 data-lang-en="Use example data" 1207 data-lang-cy="Defnyddio data enghreifftiol" 1208 /> 1209 <span 1210 data-lang-en="Use example data" 1211 data-lang-cy="Defnyddio data enghreifftiol" 1212 >Use example data</span 1213 > 1214 </label> 1215 <label> 1216 <input 1217 type="radio" 1218 name="input-method" 1219 value="upload" 1220 onclick="toggleInputOption('upload')" 1221 data-lang-en="Upload data file" 1222 data-lang-cy="Llwytho ffeil ddata i fyny" 1223 /> 1224 <span 1225 data-lang-en="Upload data file" 1226 data-lang-cy="Llwytho ffeil ddata i fyny" 1227 >Upload data file</span 1228 > 1229 </label> 1230 <div id="text-input" class="input-container mb-4"> 1231 <textarea 1232 class="data-input" 1233 name="text-to-analyze" 1234 id="text-to-analyze" 1235 value="text" 1236 ></textarea> 1237 <div class="options-container"> 1238 <label> 1239 <input 1240 type="radio" 1241 name="text-input-method" 1242 value="Split sentences" 1243 data-lang-en="Split sentences" 1244 data-lang-cy="Rhannu brawddegau" 1245 checked 1246 />
1247 <span data-lang-en="Split sentences" data-lang-cy="Rhannu brawddegau" 1248 >Split sentences</span 1249 > 1250 </label> 1251 <label> 1252 <input 1253 type="radio" 1254 name="text-input-method" 1255 value="Whole Text" 1256 data-lang-en="Whole text" 1257 data-lang-cy="Testun cyfan" 1258 /> 1259 <span data-lang-en="Whole text" data-lang-cy="Testun cyfan" 1260 >Whole text</span 1261 > 1262 </label> 1263 </div> 1264 1265 <button 1266 type="submit" 1267 class="analyze-btn" 1268 onclick="startAnalysisfile(event)" 1269 data-lang-en="View Data" 1270 data-lang-cy="Gweld Data" 1271 > 1272 View Data 1273 </button> 1274 </div> 1275 1276 <div id="example-options" class="hidden"> 1277 <select id="example-data" name="example-data" class="data-input"> 1278 <option 1279 value="" 1280 data-lang-en="Select example data file" 1281 data-lang-cy="Dewis ffeil ddata enghreifftiol" 1282 > 1283 Select example data file 1284 </option> 1285 1286 <!-- List example data files here --> 1287 </select> 1288 <button 1289 type="submit" 1290 class="analyze-btn" 1291 data-lang-en="View Data" 1292 data-lang-cy="Gweld Data" 1293 onclick="startAnalysisexample_uploaded(event)" 1294 > 1295 View Data 1296 </button> 1297 </div> 1298 1299 <div id="file-to-analyze" class="hidden"> 1300 <div class="file-upload"> 1301 <label 1302 for="file" 1303 class="custom-file-upload" 1304 data-lang-en="Choose File" 1305 data-lang-cy="Dewiswch Ffeil" 1306 >Choose File</label 1307 > 1308 <span 1309 class="file-name" 1310 data-lang-en="No file chosen (Allowed: .txt, .tsv, .xlsx)" 1311 data-lang-cy="Dim ffeil wedi'i ddewis (Caniateir: .txt, .tsv, .xlsx)" 1312 >No file chosen (Allowed: .txt, .tsv, .xlsx)</span 1313 > 1314 1315 <input 1316 id="file" 1317 class="input-hidden" 1318 type="file" 1319 name="file" 1320 accept=".txt,.csv,.xls,.xlsx" 1321 onchange="handleFileChange()" 1322 /> 1323 </div> 1324 <button 1325 type="submit" 1326 class="analyze-btn" 1327 data-lang-en="View Data" 1328 data-lang-cy="Gweld Data" 1329 onclick="startAnalysisfile_uploaded(event)" 1330 > 1331 View Data 1332 </button> 1333 </div> 1334 <div id="column-selection" class="column-selection-container hidden"> 1335 <h4 data-lang-en="Select columns" data-lang-cy="Dewis colofnau"> 1336 Select columns 1337 </h4> 1338 <div id="columns-container" class="columns-dropdown-container"> 1339 <select 1340 id="columns-dropdown" 1341 multiple="multiple" 1342 class="styled-dropdown" 1343 onchange="viewSelectedColumns(event)" 1344 ></select> 1345 1346 <div id="dateSlider"></div> 1347 <span id="dateRange"></span> 1348 </div> 1349 1350 <button 1351 class="analyze-btn" 1352 onclick="checkLanguage(event)" 1353 data-lang-en="Check Language" 1354 data-lang-cy="Gwirio iaith" 1355 > 1356 Check Language 1357 </button> 1358 <div id="download-buttons" class="hidden"> 1359 <ul class="btn-list"> 1360 <li> 1361 <a 1362 href="/download/english" 1363 class="analyze-btnn btn-gradient" 1364 id="download-english" 1365 data-lang-en="Download English Data" 1366 data-lang-cy="Lawrlwytho Data Saesneg" 1367 >Download English Data</a 1368 > 1369 </li> 1370 <li> 1371 <a 1372 href="/download/welsh" 1373 class="analyze-btnn btn-gradient" 1374 id="download-welsh" 1375 data-lang-en="Download Welsh Data" 1376 data-lang-cy="Lawrlwytho Data Cymraeg" 1377 >Download Welsh Data</a 1378 > 1379 </li> 1380 </ul> 1381 </div> 1382 <div id="data-table-container"></div> 1383 </div> 1384 1385 <div 1386 id="myGrid" 1387 style="height: 800px; width: 100%" 1388 class="ag-theme-alpine hidden" 1389 ></div> 1390 1391 <div id="columnLabelsContainer"> 1392 <!-- Column labels will be dynamically added here --> 1393 </div> 1394</form> 1395<div> 1396 1397</div> 1398<div id="Dataview" class="tab-buttons hidden"></div> 1399<!--<div> 1400 <button class="analyze-btn hidden " id="submit-sentences-btn" onclick="sendSelectedSentences()" style="margin-bottom: 20px; font-size: 24px;margin: 0 auto 20px;padding: 10px 20px;"> 1401 <i class="fas fa-file-alt"></i> 1402 <i class="fas fa-tree"></i> 1403 <i class="fas fa-link"></i> 1404 <i class="fas fa-chart-line"></i> 1405 <i class="fas fa-comments"></i> 1406 <i class="fas fa-cloud"></i> 1407 Start Analysis 1408 </button> 1409</div>--> 1410<div> 1411 <button 1412 class="analyze-btn hidden" 1413 id="submit-rows-btn" 1414 onclick="sendSelectedRows()" 1415 style=" 1416 margin-bottom: 20px; 1417 font-size: 24px; 1418 margin: 0 auto 20px; 1419 padding: 10px 20px; 1420 " 1421 > 1422 <i class="fas fa-file-alt"></i> 1423 <i class="fas fa-tree"></i> 1424 <i class="fas fa-link"></i> 1425 <i class="fas fa-chart-line"></i> 1426 <i class="fas fa-comments"></i> 1427 <i class="fas fa-cloud"></i> 1428 <span data-lang-en=" Start Analysis" data-lang-cy="Dechrau Dad
1428ansoddi"> 1429 Start Analysis</span 1430 > 1431 </button> 1432</div> 1433<div id="loading" style="display: none"> 1434 <img src="static/images/logo.png" /> 1435 <img src="static/images/loading4.gif" alt="Loading..." /> 1436</div> 1437 1438<div class="tab-container"> 1439 <div class="tab-buttons hidden" id="tab-buttons"> 1440 <button 1441 class="tab-btn background-red" 1442 onclick="showTab(0) ; reloadIframe()" 1443 > 1444 <i class="fas fa-chart-line text-size-14 text-white"></i> 1445 <span data-lang-en="Meaning Analysis" data-lang-cy="Dadansoddi Ystyr"> 1446 Meaning Analysis</span 1447 > 1448 </button> 1449 <button 1450 class="tab-btn background-blue" 1451 onclick="showTab(1) ; reloadIframe()" 1452 > 1453 <i class="fas fa-comments text-size-14 text-white"></i> 1454 1455 <span 1456 class="button-text" 1457 data-lang-en="Sentiment Chart" 1458 data-lang-cy="Siart Sentiment" 1459 > 1460 Sentiment Chart</span 1461 > 1462 </button> 1463 <button class="tab-btn background-green" onclick="showTab(2)"> 1464 <i class="fas fa-file-alt text-size-14 text-white"></i> 1465 <span 1466 class="button-text" 1467 data-lang-en="Summarisation" 1468 data-lang-cy="Crynodebu" 1469 > 1470 Summarisation</span 1471 > 1472 </button> 1473 <button class="tab-btn background-purple" onclick="showTab(3)"> 1474 <i class="fas fa-cloud text-size-14 text-white"></i> 1475 <span 1476 class="button-text" 1477 data-lang-en="Word Cloud" 1478 data-lang-cy="Cwmwl Geiriau" 1479 > 1480 Word Cloud</span 1481 > 1482 </button> 1483 <button class="tab-btn background-orange" onclick="showTab(4)"> 1484 <i class="fas fa-link text-size-14 text-white"></i> 1485 <span 1486 class="button-text" 1487 data-lang-en="Word Use & Relationships" 1488 data-lang-cy="Defnydd a Pherthnasoedd Geiriau" 1489 > 1490 Word Use & Relationships</span 1491 > 1492 </button> 1493 <button class="tab-btn background-aqua" onclick="showTab(5)"> 1494 <i class="fas fa-tree text-size-14 text-white"></i> 1495 <span 1496 class="button-text" 1497 data-lang-en="Word Tree" 1498 data-lang-cy="Coeden Eiriau" 1499 > 1500 Word Tree</span 1501 > 1502 </button> 1503 <button class="tab-btn background-pink" onclick="showTab(6)"> 1504 <i class="fas fa-file-pdf"></i> 1505 <span class="button-text" data-lang-en="PDF" data-lang-cy="PDF"> 1506 PDF</span 1507 > 1508 </button> 1509 </div> 1510 <div id="tabs" class="hidden"> 1511 <div id="tab0" class="tab-content"> 1512 <p 1513 data-lang-en='The sentiment analysis is performed using the "nlptown/bert-base-multilingual-uncased-sentiment" model from Hugging Face. This model is trained on product reviews in multiple languages and utilizes the BERT architecture.' 1514 data-lang-cy="Gwneir y dadansoddiad sentiment gan ddefnyddio model 'nlptown/bert-base-multilingual-uncased-sentiment' o Hugging Face. Hyfforddir y model gydag adolygiadau cynnyrch mewn nifer o ieithoedd ac mae'n defnyddio saernïaeth BERT." 1515 > 1516 The sentiment analysis is performed using the 1517 "nlptown/bert-base-multilingual-uncased-sentiment" model from Hugging 1518 Face. This model is trained on product reviews in multiple languages and 1519 utilizes the BERT architecture. 1520 </p> 1521 1522 <p 1523 data-lang-en="As per the information on the Hugging Face model page, the accuracy of this model for sentiment analysis on English text is approximately 95%. According to our previous experiments on manually annotated Welsh reviews, the accuracy for Welsh is approximately 73%." 1524 data-lang-cy="Yn unol â'r wybodaeth ar dudalen model Hugging Face, tua 95% yw manwl gywirdeb y model hwn ar gyfer dadansoddi sentiment ar destun Saesneg. Yn ôl ein harbrofion blaenorol ar adolygiadau Cymraeg a anodwyd â llaw, tua 73% yw'r manwl gywirdeb ar gyfer y Gymraeg." 1525 > 1526 As per the information on the Hugging Face model page, the accuracy of 1527 this model for sentiment analysis on English text is approximately 95%. 1528 According to our previous experiments on manually annotated Welsh 1529 reviews, the accuracy for Welsh is approximately 73%. 1530 </p> 1531 <h3 1532 data-lang-en="How do you want to categorise the sentiments?" 1533 data-lang-cy="Sut ydych chi eisiau categoreiddio'r sentimentau?" 1534 > 1535 How do you want to categorise the sentiments? 1536 </h3> 1537 <div class="sentiment-option"> 1538 <input 1539 type="radio" 1540 id="threeClass" 1541 name="sentimentOption" 1542 value="3" 1543 checked 1544 onchange="handleSentimentOptionChange()" 1545 /> 1546 <label 1547 for="threeClass" 1548 data-lang-en="3 Class Sentiments (Positive, Neutral, Negative)" 1549 data-lang-cy="Sentimentau 3 Dosbarth (Cadarnhaol, Niwtral, Negyddol)" 1550 >3 Class Sentiments (Positive, Neutral, Negative)</label 1551 > 1552 </div> 1553 <div class="sentiment-option"> 1554 <input 1555 type="radio" 1556 id="fiveClass" 1557 name="sentimentOption" 1558 value="5" 1559 onchange="handleSentimentOptionChange()" 1560 /> 1561 <label 1562 for="fiveClass" 1563 data-lang-en="5 Class Sentiments (Very Positive, Positive, Neutral, Negative, Ver
1563y Negative)" 1564 data-lang-cy="Sentimentau 5 Dosbarth (Cadarnhaol Iawn, Cadarnhaol, Niwtral, Negyddol, Negyddol Iawn)" 1565 >5 Class Sentiments (Very Positive, Positive, Neutral, Negative, Very 1566 Negative)</label 1567 > 1568 </div> 1569 <div class="sentiment-option" id="threeClassABSAOption"> 1570 <input 1571 type="radio" 1572 id="threeClassABSA" 1573 name="sentimentOption" 1574 value="3-absa" 1575 onchange="handleSentimentOptionChange()" 1576 /> 1577 <label 1578 for="threeClassABSA" 1579 data-lang-en="3 Class Aspect-Based Sentiment Analysis (Positive, 1580 Neutral, Negative)" 1581 data-lang-cy="Dadansoddiad Sentiment wediâi Seilio ar Agweddau 3 Dosbarth (Cadarnhaol, Niwtral, Negyddol)" 1582 >3 Class Aspect-Based Sentiment Analysis (Positive, Neutral, 1583 Negative)</label 1584 > 1585 </div> 1586 <div id="ABSAInputContainer" class="mt-4" style="display: none"> 1587 <h3 1588 data-lang-en="Enter aspects to analyse:" 1589 data-lang-cy="Rhowch agweddau i'w dadansoddi:" 1590 > 1591 Enter aspects to analyse: 1592 </h3> 1593 <textarea 1594 class="data-input m-0" 1595 name="absa-aspects-to-analyze" 1596 placeholder="Enter words separated by commas, e.g., example, words, here" 1597 id="absa-aspects-to-analyze" 1598 oninput="handleAspectInputChanges()" 1599 maxlength="500" 1600 ></textarea> 1601 <div id="enteredAspects" class="my-2"> 1602 <span 1603 id="aspects-bold-text" 1604 class="font-weight-bold" 1605 style="opacity: 0%" 1606 data-lang-en="Aspects:" 1607 data-lang-cy="Agweddau:" 1608 >Aspects:</span 1609 > 1610 <span 1611 id="aspects-input-list" 1612 class="text-primary font-weight-bold d-inline text-wrap" 1613 style="white-space: pre; word-wrap: break-word" 1614 ></span> 1615 </div> 1616 <div class="container-fluid m-0 p-0 d-flex"> 1617 <button 1618 type="button" 1619 class="btn btn-dark mr-3" 1620 data-lang-en="Fetch Results" 1621 data-lang-cy="Canlyniadau Ffetch" 1622 onclick="startABSA()" 1623 > 1624 Fetch Results 1625 </button> 1626 </div> 1627 </div> 1628 <div 1629 id="ABSAResultsContainer" 1630 class="container-fluid p-0 my-1 flex-column" 1631 style="display: none" 1632 ></div> 1633 <div id="SentimentAnalysisContainer" class="container-fluid p-0 m-0"> 1634 <div id="SentimentPlotViewPie"></div> 1635 <p 1636 data-lang-en="The figure displays the sentiment analysis of the data, you can press on any part of the graph to display the data" 1637 data-lang-cy="Mae'r ffigur yn dangos dadansoddiad sentiment y data, gallwch wasgu ar unrhyw ran o'r graff i arddangos y data" 1638 > 1639 The figure displays the sentiment analysis of the data, you can press 1640 on any part of the graph to display the data 1641 </p> 1642 <a href="/get-html-pie" download> 1643 <button 1644 class="analyze-btn" 1645 data-lang-en="Download Interactive Pie Chart" 1646 data-lang-cy="Lawrlwytho Siart Cylch Rhyngweithiol" 1647 > 1648 Download Interactive Pie Chart 1649 </button> 1650 </a> 1651 <div id="SentimentPlotViewBar"></div> 1652 <a href="/get-html-bar" download> 1653 <button 1654 class="analyze-btn" 1655 data-lang-en="Download Interactive Bar Chart" 1656 data-lang-cy="Lawrlwytho Siart Bar Rhyngweithiol" 1657 > 1658 Download Interactive Bar Chart 1659 </button> 1660 </a> 1661 <div id="SentimentView"></div> 1662 <div id="SentimentTable" class="mb-3"></div> 1663 <a href="/get-Sentimentdata" download> 1664 <button 1665 class="analyze-btn" 1666 data-lang-en="Download Sentiment Table" 1667 data-lang-cy="Lawrlwytho Tabl Sentiment" 1668 > 1669 Download Sentiment Table 1670 </button> 1671 </a> 1672 </div> 1673 </div> 1674 <div id="tab1" class="tab-content"> 1675 <h2 1676 data-lang-en="Scatter Plot Overview" 1677 data-lang-cy="Trosolwg Plot Gwasgariad" 1678 > 1679 Scatter Plot Overview 1680 </h2> 1681 <p 1682 data-lang-en="In a scatter plot, the single words with the highest sentiment association are displayed. The x- and y-axes show their usage in positive vs. negative and neutral sentiments, respectively." 1683 data-lang-cy="Mewn plot gwasgariad, caiff y geiriau sengl gyda'r cysylltiad sentiment uchaf eu dangos. Mae'r echelinau x- ac y- yn dangos eu defnydd mewn sentimentau cadarnhaol yn erbyn sentimentau negyd
1683dol a niwtral." 1684 > 1685 In a scatter plot, the single words with the highest sentiment 1686 association are displayed. The x- and y-axes show their usage in 1687 positive vs. negative and neutral sentiments, respectively. 1688 </p> 1689 1690 <h3 data-lang-en="Colour Coding:" data-lang-cy="Codio Lliw:"> 1691 Colour Coding: 1692 </h3> 1693 <div class="color-boxes"> 1694 <div 1695 class="color-box blue" 1696 data-lang-en="Blue: Positive Words" 1697 data-lang-cy="Glas: Geiriau Cadarnhaol" 1698 > 1699 Blue: Positive Words 1700 </div> 1701 <div 1702 class="color-box red" 1703 data-lang-en="Red: Negative Words" 1704 data-lang-cy="Coch: Geiriau Negyddol" 1705 > 1706 Red: Negative Words 1707 </div> 1708 <div 1709 class="color-box yellow" 1710 data-lang-en="Yellow: (Positive and Negative)" 1711 data-lang-cy="Melyn: (Cadarnhaol a Negyddol)" 1712 > 1713 Yellow: (Positive and Negative) 1714 </div> 1715 <div 1716 class="color-box orange" 1717 data-lang-en="Orange: (Positive and Negative)" 1718 data-lang-cy="Oren: (Cadarnhaol a Negyddol)" 1719 > 1720 Orange: (Positive and Negative) 1721 </div> 1722 </div> 1723 <p 1724 data-lang-en="Towards the top-right, the most frequently shared terms between the two sentiments are found, while the bottom-left has the least frequent shared terms." 1725 data-lang-cy="Tua'r dde uchaf, gellir dod o hyd i'r termau sy'n cael eu rhannu fwyaf aml rhwng y ddau sentiment, ac ar y chwith isaf ceir y termau sy'n cael eu rhannu leiaf aml." 1726 > 1727 Towards the top-right, the most frequently shared terms between the two 1728 sentiments are found, while the bottom-left has the least frequent 1729 shared terms. 1730 </p> 1731 1732 <h3 data-lang-en="Score Range:" data-lang-cy="Ystod Sgôr:"> 1733 Score Range: 1734 </h3> 1735 <p 1736 data-lang-en="The range is between -1 and 1, with scores near 0 representing words with similar frequencies in both classes (yellow and orange dots). Scores near 1 are for words more frequent in positive contexts (blue), and scores near -1 for negative contexts (red). Darker shades of blue or red indicate scores closer to their respective extremes." 1737 data-lang-cy="Mae'r ystod rhwng -1 ac 1, gyda sgorau yn agos at 0 yn cynrychioli geiriau gydag amlderau tebyg yn y ddau ddosbarth (dotiau melyn ac oren). Mae sgorau sy'n agos i 1 ar gyfer geiriau sy'n fwy aml mewn cyd-destunau cadarnhaol (glas), a sgorau sy'n agos i -1 ar gyfer cyd-detunau negyddol (coch). Mae arlliwiau mwy tywyll o las neu goch yn nodi sgorau sy'n fwy agos at eu heithafion priodol." 1738 > 1739 The range is between -1 and 1, with scores near 0 representing words 1740 with similar frequencies in both classes (yellow and orange dots). 1741 Scores near 1 are for words more frequent in positive contexts (blue), 1742 and scores near -1 for negative contexts (red). Darker shades of blue or 1743 red indicate scores closer to their respective extremes. 1744 </p> 1745 1746 <h3 1747 data-lang-en="Interactive Features:" 1748 data-lang-cy="Nodweddion Rhyngweithiol:" 1749 > 1750 Interactive Features: 1751 </h3> 1752 <p 1753 data-lang-en="Hovering over the dots on the plot reveals word frequency statistics per 25,000 words for both classes and a Scaled F-Score. This frequency determines each point's plot position. For instance, a given metric might be 195:71 per 25k words. Using the query box or clicking on a dot provides more details, like the frequency per 1,000 Reddit posts ('doc')." 1754 data-lang-cy="Mae hofran uwchben y dotiau ar y plot yn dangos ystadegau amlder geiriau fesul 25,000 gair ar gyfer dosbarthiadau a Sgôr-F Graddfa. Mae'r amlder yma yn pennu safle pob pwynt ar y plot. Er enghraifft, gellid bwrw metrig 195:71 fesul 25 mil o eiriau. Bydd defnyddio'r blwch ymholiadau neu glicio ar ddot yn rhoi mwy o fanylion, fel yr amlder fesul 1,000 post Reddir ('doc')." 1755 > 1756 Hovering over the dots on the plot reveals word frequency statistics per 1757 25,000 words for both classes and a Scaled F-Score. This frequency 1758 determines each point's plot position. For instance, a given metric 1759 might be 195:71 per 25k words. Using the query box or clicking on a dot 1760 provides more details, like the frequency per 1,000 Reddit posts 1761 ('doc'). 1762 </p> 1763 <div class="container-fluid mt-4 px-0"> 1764 <div class="form-check"> 1765 <input 1766 class="form-check-input" 1767 type="checkbox" 1768 id="regenerate-scatter-check" 1769 onchange="regenerateScatterPlot()" 1770 /> 1771 <label 1772 class="form-check-label" 1773 for="regenerate-scatter-check" 1774 data-lang-en="Exclude stopwords (Regenerates the plot)" 1775 data-lang-cy="Eithrio ataleiriau (Yn adfywio'r plot)" 1776 >Exclude stopwords (Regenerates the plot)</label 1777 > 1778 </div> 1779 </div> 1780 <iframe 1781 id="scattertextIframe" 1782 src="" 1783 width="100%" 1784 height="1000" 1785 frameborder="0" 1786 style="overflow: visible" 1787 ></iframe> 1788 <a href="/get-html-scatter" download> 1789 <button 1790 class="analyze-btn" 1791 data-lang-en="Download Interactive Scatter Text" 1792 data-lang-cy="Lawrlwytho Testun Gwasgariad Rhyngweithiol" 1793 > 1794 Download Interactive Scatter Text 1795 </button> 1796 </a> 1797 </div> 1798 <div id="tab2" class="tab-content"> 1799 <form id="summarize-form"> 1800 <h5
1801 data-lang-en="This tool, adapted from the Welsh Summarisation project, produces a basic extractive summary of the review text from the selected columns." 1802 data-lang-cy="Mae'r offeryn hwn a gafodd ei addasu o Brosiect Crynhoi Testunau Cymraeg yn creu crynodeb echdynnol sylfaenol o destun yr adolygiad o'r colofnau a ddewiswyd." 1803 > 1804 This tool, adapted from the Welsh Summarisation project, produces a 1805 basic extractive summary of the review text from the selected columns. 1806 </h5> 1807 1808 <input 1809 type="range" 1810 id="chosen_ratio" 1811 name="chosen_ratio" 1812 min="10" 1813 max="50" 1814 step="10" 1815 value="40" 1816 onchange="onSliderChange()" 1817 /> 1818 <span id="ratio-value">40%</span><br /> 1819 <div id="summary"></div> 1820 <button 1821 class="analyze-btn" 1822 type="button" 1823 onclick="downloadSummary()" 1824 data-lang-en="Download Summary" 1825 data-lang-cy="lawrlwytho crynodeb" 1826 > 1827 Download Summary 1828 </button> 1829 </form> 1830 </div> 1831 <div id="tab3" class="tab-content"> 1832 <div class="container mt-5"> 1833 <h2 1834 data-lang-en="Word Cloud Generator" 1835 data-lang-cy="Creu Cwmwl Geiriau" 1836 > 1837 Word Cloud generator 1838 </h2> 1839 <form id="wordCloudForm" method="post"> 1840 <div class="form-row"> 1841 <!-- Use form-row to place elements side by side --> 1842 <div class="form-group col-md-4"> 1843 <label 1844 class="form-label" 1845 data-lang-en="Select cloud type:" 1846 data-lang-cy="Dewiswch y math o gwmwl:" 1847 >Select cloud type:</label 1848 > 1849 <select name="cloud_type" class="form-control"> 1850 <option 1851 value="all_words" 1852 data-lang-en="All words" 1853 data-lang-cy="Pob gair" 1854 > 1855 All words 1856 </option> 1857 <option value="nouns" data-lang-en="Nouns" data-lang-cy="Enwau"> 1858 Nouns 1859 </option> 1860 <option 1861 value="proper_nouns" 1862 data-lang-en="Proper nouns" 1863 data-lang-cy="Enwau priod" 1864 > 1865 Proper nouns 1866 </option> 1867 <option 1868 value="verbs" 1869 data-lang-en="Verbs" 1870 data-lang-cy="Berfau" 1871 > 1872 Verbs 1873 </option> 1874 <option 1875 value="adjectives" 1876 data-lang-en="Adjectives" 1877 data-lang-cy="Ansoddeiriau" 1878 > 1879 Adjectives 1880 </option> 1881 <option 1882 value="adverbs" 1883 data-lang-en="Adverbs" 1884 data-lang-cy="Adferfau" 1885 > 1886 Adverbs 1887 </option> 1888 <option 1889 value="numbers" 1890 data-lang-en="Numbers" 1891 data-lang-cy="Rhifau" 1892 > 1893 Numbers 1894 </option> 1895 <option 1896 value="2_word_clusters" 1897 data-lang-en="2-word clusters" 1898 data-lang-cy="Clystyrau 2-gair" 1899 > 1900 2-word clusters 1901 </option> 1902 <option 1903 value="3_word_clusters" 1904 data-lang-en="3-word clusters" 1905 data-lang-cy="Clystyrau 3-gair" 1906 > 1907 3-word clusters 1908 </option> 1909 <option 1910 value="4_word_clusters" 1911 data-lang-en="4-word clusters" 1912 data-lang-cy="Clystyrau 4-gair" 1913 > 1914 4-word clusters 1915 </option> 1916 <option 1917 value="semantic_tags" 1918 data-lang-en="Semantic Tags" 1919 data-lang-cy="Tagiau Semantig" 1920 > 1921 Semantic Tags 1922 </option> 1923 </select> 1924 </div> 1925 <div class="form-group col-md-4"> 1926 <label 1927 class="form-label" 1928 data-lang-en="Select cloud shape:" 1929 data-lang-cy="Dewiswch siâp y cwmwl:" 1930 >Select cloud shape:</label 1931 > 1932 <select name="cloud_shape" class="form-control"> 1933 <option 1934 value="/freetxt/app/static/images/img/cloud.png" 1935 data-lang-en="Cloud" 1936 data-lang-cy="Cwmwl" 1937 > 1938 Cloud 1939 </option> 1940 1941 <option 1942 value="/freetxt/app/static/images/img/comments2.png" 1943 data-lang-en="Comment" 1944 data-lang-cy="Sylw" 1945 > 1946 Comment 1947 </option> 1948 <option 1949 value="/freetxt/app/static/images/img/lightbulb.png" 1950 data-lang-en="Light bulb" 1951 data-lang-cy="Bwlb golau" 1952 > 1953 Light Bulb 1954 </option> 1955 <option 1956 value="/freetxt/app/static/images/img/volumeup.png" 1957 data-lang-en="Volume up" 1958 data-lang-cy="Lefel sain i fyny" 1959 > 1960 Volume up 1961 </option> 1962 <option 1963 value="/freetxt/app/static/images/img/Mic.png" 1964 data-lang-en="Microphone" 1965 data-lang-cy="Meicroffon" 1966 > 1967 Microphone 1968 </option> 1969 <option 1970 value="/freetxt/app/static/images/img/welsh_flag.png" 1971 data-lang-en="Welsh Flag" 1972 data-lang-cy="Baner Cymru" 1973 > 1974 Welsh Flag 1975 </option> 1976 <option 1977 value="/freetxt/app/static/images/img/holmes_silhouette.png" 1978 data-lang-en="Sherlock Holmes" 1979 data-lang-cy="Sherlock Holmes" 1980 > 1981 Sherlock Holmes 1982 </option> 1983 <option 1984 value="/freetxt/app/static/images/img/national-trust-logo-black-on-white-silhouette.jpg" 1985 data-lang-en="National Trust" 1986 data-lang-cy="Ymddiriedolaeth Genedlaethol" 1987 > 1988 National Trust 1989 </option> 1990 <option 1991 value="/freetxt/app/static/images/img/cadw-clip.jpeg" 1992 data-lang-en="Cadw"
1993 data-lang-cy="Cadw" 1994 > 1995 Cadw 1996 </option> 1997 <option 1998 value="/freetxt/app/static/images/img/blue_rectangle.jpg" 1999 data-lang-en="Rectangle" 2000 data-lang-cy="Petryal" 2001 > 2002 Rectangle 2003 </option> 2004 <option 2005 value="/freetxt/app/static/images/img/circle.png" 2006 data-lang-en="Circle" 2007 data-lang-cy="Cylch" 2008 > 2009 Circle 2010 </option> 2011 <option 2012 value="/freetxt/app/static/images/img/CadwLogo.png" 2013 data-lang-en="Cadw2" 2014 data-lang-cy="Cadw2" 2015 > 2016 Cadw2 2017 </option> 2018 <option 2019 value="/freetxt/app/static/images/img/image-png.png" 2020 data-lang-en="Learn Welsh" 2021 data-lang-cy=" Dysgu Cymraeg" 2022 > 2023 Learn Welsh 2024 </option> 2025 </select> 2026 </div> 2027 2028 <div class="form-group col-md-4"> 2029 <label 2030 class="form-label" 2031 data-lang-en="Select cloud outline colour:" 2032 data-lang-cy="Dewiswch liw amlinell y cwmwl:" 2033 >Select cloud outline colour:</label 2034 > 2035 <select 2036 name="cloud_outline_color" 2037 class="form-control" 2038 title="Changing this will regenerate the word cloud" 2039 > 2040 <option value="white" data-lang-en="White" data-lang-cy="Gwyn"> 2041 White 2042 </option> 2043 <option value="grey" data-lang-en="Grey" data-lang-cy="Llwyd"> 2044 Grey 2045 </option> 2046 <option 2047 value="yellow" 2048 data-lang-en="Yellow" 2049 data-lang-cy="Melyn" 2050 > 2051 Yellow 2052 </option> 2053 2054 <option value="black" data-lang-en="Black" data-lang-cy="Du"> 2055 Black 2056 </option> 2057 <option 2058 value="green" 2059 data-lang-en="Green" 2060 data-lang-cy="Gwyrdd" 2061 > 2062 Green 2063 </option> 2064 <option value="blue" data-lang-en="Blue" data-lang-cy="Glas"> 2065 Blue 2066 </option> 2067 <option value="red" data-lang-en="Red" data-lang-cy="Coch"> 2068 Red 2069 </option> 2070 </select> 2071 </div> 2072 2073 <div class="form-group col-md-4"> 2074 <label 2075 class="form-label" 2076 data-lang-en="Select cloud measurement:" 2077 data-lang-cy="Dewiswch fesuriad y cwmwl:" 2078 >Select cloud measurement:</label 2079 > 2080 <select 2081 name="cloud_measure" 2082 class="form-control" 2083 title="Changing this will regenerate the word cloud" 2084 > 2085 <option 2086 value="KENESS" 2087 data-lang-en="Keyness" 2088 data-lang-cy="Allweddeirwydd" 2089 > 2090 Keyness 2091 </option> 2092 <option 2093 value="Frequency" 2094 data-lang-en="Frequency" 2095 data-lang-cy="Amlder" 2096 > 2097 Frequency 2098 </option> 2099 <option 2100 value="Log-Likelihood" 2101 data-lang-en="Log-Likelihood" 2102 data-lang-cy="Tebygolrwydd-Log" 2103 > 2104 Log-Likelihood 2105 </option> 2106 </select> 2107 </div> 2108 </div> 2109 </form> 2110 </div> 2111 <div id="word-cloud-error-handlers"> 2112 <div id="cloudLoading" class="container d-flex align-items-cente hidden-important"> 2113 <h1 2114 data-lang-en="Loading word cloud..." 2115 data-lang-cy="Yn llwytho cwmwl geiriau..." 2116 >Loading word cloud...</h1> 2117 <div class="spinner-border ml-auto" role="status" aria-hidden="true"></div> 2118 </div> 2119 <div id="word-cloud-retry" class="container d-flex flex-column align-items-center justify-content-center hidden-important"> 2120 <p class="mb-2 text-warning" 2121 data-lang-en="There was an issue generating the word cloud. This could be caused by a temporary disruption in the service. Please try again." 2122 data-lang-cy="Roedd problem yn creu'r cwmwl geiriau. Gallai hyn gael ei achosi gan amhariad dros dro yn y gwasanaeth. Ceisiwch eto". 2123 > 2124 </p> 2125 <button 2126 class="btn btn-primary" 2127 onclick="sendWordCloudRequest()" 2128 data-lang-en="Retry Word Cloud Generation" 2129 data-lang-cy="Ail-geisio Generu Cwmwl Geiriau" 2130 > 2131 Retry Word Cloud Generation 2132 </button> 2133 </div> 2134 </div> 2135 <div 2136 id="wordListOuterContainer" 2137 class="responsive-flex rounded border border-light shadow my-5 border border-primary" 2138 > 2139 <div 2140 id="responsive-flex-first" 2141 class="d-flex flex-column align-items-center search-container" 2142 > 2143 <div class="rounded p-4 w-100 border border-light bg-light"> 2144 <div class="pb-4 w-100"> 2145 <input 2146 id="cloud-search" 2147 class="p-2 form-control w-100" 2148 type="search" 2149 placeholder="Search in cloud..."
2150 oninput="handleWordCloudSearchChange(event)" 2151 /> 2152 </div> 2153 <div 2154 id="sem-tags-radio-selection" 2155 class="container-fluid responsive-flex-rev mb-4" 2156 style="display: none" 2157 > 2158 <div class="d-flex flex-column"> 2159 <div class="form-check"> 2160 <input 2161 id="show-semantic-tags" 2162 name="sem-tags-words-rad" 2163 type="radio" 2164 class="form-check-input" 2165 checked 2166 /> 2167 <label 2168 class="form-check-label" 2169 for="show-semantic-tags" 2170 data-lang-en="Show semantic tags" 2171 data-lang-cy="Dangos tagiau semantig" 2172 > 2173 Show Tags 2174 </label> 2175 </div> 2176 <div class="form-check"> 2177 <input 2178 id="show-words" 2179 name="sem-tags-words-rad" 2180 type="radio" 2181 class="form-check-input" 2182 /> 2183 <label 2184 class="form-check-label" 2185 for="show-words" 2186 data-lang-en="Show words with semantic tags" 2187 data-lang-cy="Dangos geiriau gyda thagiau semantig" 2188 > 2189 Show Words With Tags 2190 </label> 2191 </div> 2192 </div> 2193 </div> 2194 <div 2195 class="container align-items-center d-flex flex-column overflow-scroll-container p-0" 2196 > 2197 <div 2198 id="wordListContainer" 2199 class="word-checkbox-list w-100 d-flex flex-column" 2200 style="min-width: 100%" 2201 ></div> 2202 </div> 2203 <div class="w-100 d-flex justify-content-center pt-4"> 2204 <input 2205 id="word-changes-submit" 2206 class="p-2 btn btn-outline-primary w-100" 2207 type="submit" 2208 value="Submit selection" 2209 onclick="regenerateWordCloud()" 2210 /> 2211 </div> 2212 </div> 2213 </div> 2214 <div 2215 id="wordCloudImageContainer" 2216 class="container-fluid d-flex flex-column justify-content-center align-items-center mw-100 position-relative p-0 m-0" 2217 style="max-height: 100vh" 2218 > 2219 <div 2220 id="word-cloud-enlarge-reduce-icon" 2221 class="position-absolute p-2" 2222 style="top: 0; right: 0" 2223 > 2224 <label class="size-btn"> 2225 <input 2226 type="checkbox" 2227 class="hidden" 2228 onchange="handleWordCloudPosChange(event)" /><i 2229 id="word-cloud-control-icon" 2230 class="fa-solid fa-expand" 2231 style="font-size: 30px" 2232 ></i 2233 ></label> 2234 </div> 2235 <img id="wordCloudImage" src="" alt="Word Cloud Image" /> 2236 </div> 2237 </div> 2238 2239 <div 2240 id="tag-words-associations-container" 2241 class="container-fluid p-0" 2242 style="display: none" 2243 > 2244 <div 2245 class="flex-container align-items-center justify-content-center mb-5" 2246 > 2247 <h2 2248 class="mr-2" 2249 data-lang-en="Word and Tag Associations" 2250 data-lang-cy="Cysylltiadau gair a thag" 2251 > 2252 Word & Tag Associations 2253 </h2> 2254 <label class="form-check-label size-btn" style="width: 30px"> 2255 <input 2256 type="checkbox" 2257 class="hidden form-check-input" 2258 onchange="handleWordTagListVis(event)" 2259 /> 2260 <i 2261 id="word-tag-list-icon" 2262 class="fa-solid fa-eye-slash" 2263 style="font-size: 30px; min-width: 30px" 2264 ></i> 2265 </label> 2266 </div> 2267 2268 <div 2269 id="tag-words-associations-list" 2270 class="container-fluid w-100 row row-cols-1 row-cols-sm-2 row-cols-lg-4 m-0" 2271 ></div> 2272 </div> 2273 <a id="word-cloud-download-1" href="/get-word-cloud" download> 2274 <button 2275 class="analyze-btn" 2276 data-lang-en="Download Word Cloud image" 2277 data-lang-cy="Lawrlwytho delwedd Cwmwl Geiriau" 2278 > 2279 Download Word Cloud image 2280 </button> 2281 </a> 2282 <a 2283 id="word-cloud-download-2" 2284 href="/get-sec-word-cloud" 2285 style="display: none" 2286 download 2287 > 2288 <button 2289 class="analyze-btn mt-2" 2290 data-lang-en="Download Word Cloud image (2)" 2291 data-lang-cy="Lawrlwytho delwedd Cwmwl Geiriau (2)" 2292 > 2293 Download Word Cloud image (Semantic Tags) 2294 </button> 2295 </a> 2296 </div> 2297 <div id="tab4" class="tab-content"> 2298 <h2 2299 data-lang-en="Select a word for analysis" 2300 data-lang-cy="Dewiswch air i'w ddadansoddi" 2301 > 2302 Select a word for analysis 2303 </h2> 2304 <form action="/Keyword_collocation" method="post"> 2305 <div class="mb-4"> 2306 <!-- Initial Category Radio Buttons --> 2307 <label 2308 class="form-label" 2309 data-lang-en="Select Category" 2310 data-lang-cy="Dewiswch Gategori" 2311 >
2311Select Category</label 2312 > 2313 <div class="sentiment-option"> 2314 <input 2315 type="radio" 2316 id="wordRadio" 2317 name="category" 2318 value="word" 2319 onclick="handleCategoryChange()" 2320 checked 2321 /> 2322 <label for="wordRadio" data-lang-en="Word" data-lang-cy="Gair" 2323 >Word</label 2324 > 2325 </div> 2326 <div class="sentiment-option"> 2327 <input 2328 type="radio" 2329 id="posTagRadio" 2330 name="category" 2331 value="posTag" 2332 onclick="handleCategoryChange()" 2333 /> 2334 <label 2335 for="posTagRadio" 2336 data-lang-en="POS Tag" 2337 data-lang-cy="Tag POS" 2338 >POS Tag</label 2339 > 2340 </div> 2341 <div class="sentiment-option"> 2342 <input 2343 type="radio" 2344 id="semanticTagRadio" 2345 name="category" 2346 value="semanticTag" 2347 onclick="handleCategoryChange()" 2348 /> 2349 <label 2350 for="semanticTagRadio" 2351 data-lang-en="Semantic Tag" 2352 data-lang-cy="Tag Semantig" 2353 >Semantic Tag</label 2354 > 2355 </div> 2356 2357 <!-- Sub-category Dropdown --> 2358 <label 2359 class="form-label" 2360 data-lang-en="Select Option" 2361 data-lang-cy="Dewiswch Opsiwn" 2362 >Select Option</label 2363 > 2364 2365 <div 2366 class="container-fluid d-flex justify-content-start flex-column flex-sm-row p-0" 2367 > 2368 <div class="dropdown"> 2369 <button 2370 class="btn dropdown-toggle sentiment-option m-0" 2371 id="select-option-btn" 2372 type="button" 2373 id="dropdown-button" 2374 data-toggle="dropdown" 2375 aria-haspopup="true" 2376 aria-expanded="false" 2377 data-default 2378 > 2379 -- Select -- 2380 </button> 2381 <div class="dropdown-menu pb-0" aria-labelledby="dropdown-button"> 2382 <div class="form-group mx-3" style="min-width: 250px"> 2383 <input 2384 id="word-use-dd-search" 2385 type="search" 2386 class="form-control w-100" 2387 placeholder="Search in dropdown..." 2388 oninput="handleWordFreqSearchChange(event)" 2389 /> 2390 </div> 2391 <div class="dropdown-divider"></div> 2392 <div 2393 id="subCategoryDropdown" 2394 class="word-use-dropdown position-static" 2395 ></div> 2396 </div> 2397 </div> 2398 <!-- For including/excluding filtered data --> 2399 <div 2400 class="form-check ml-0 mt-3 ml-sm-3 mt-sm-0 d-flex justify-content-start justify-content-sm-center align-items-center" 2401 > 2402 <div 2403 id="include-all-data-check" 2404 class="container-fluid m-0 p-0" 2405 title="Includes words assigned with the following tags: Grammatical bin, Pronouns, Period, Being, Discourse Bin, Negative, Punctuation, Unmatched." 2406 > 2407 <input 2408 id="word-freq-include-all-check" 2409 class="form-check-input" 2410 type="checkbox" 2411 onchange="handleWordFreqDatasetChange(event)" 2412 /> 2413 <label 2414 class="form-check-label" 2415 for="word-freq-include-all-check" 2416 data-lang-en="Include all data (stopwords, misfiltered words, etc.)" 2417 data-lang-cy="Cynnwys yr holl ddata (ataleiriau, geiriau wedi'u hidlo'n anghywir, ac ati)" 2418 >Include all data (stopwords, misfiltered words, etc.)</label 2419 > 2420 </div> 2421 </div> 2422 </div> 2423 2424 <a href="/get-filtered-word-frequencies-data" download> 2425 <button 2426 type="button" 2427 class="analyze-btn hidden mt-5" 2428 data-lang-en="Download Filtered Word Frequency Results" 2429 data-lang-cy="Llwytho i lawr Ganlyniadau Amledd Geiriau wedi'u Hidlo" 2430 > 2431 Download Filtered Word Frequency Results 2432 </button> 2433 </a> 2434 <a href="/get-unfiltered-word-frequencies-data" download> 2435 <button 2436 type="button" 2437 class="analyze-btn hidden mt-2" 2438 data-lang-en="Download Unfiltered Word Frequency Results" 2439 data-lang-cy="Llwytho i lawr Ganlyniadau Amledd Geiriau heb eu Hidlo" 2440 > 2441 Download Unfiltered Word Frequency Results 2442 </button> 2443 </a> 2444 </div> 2445 <div 2446 id="window-size-range-container" 2447 class="my-5" 2448 style="display: none" 2449 > 2450 <label 2451 for="windowSizeRange" 2452 data-lang-en="Window Size:" 2453 data-lang-cy="Maint y Ffenestr:" 2454 >Window Size: 2455 </label> 2456 <input 2457 type="range" 2458 id="windowSizeRange" 2459 name="window_size" 2460 min="1" 2461 max="10" 2462 value="5" 2463 />
2464 <span id="windowSizeValue">5</span> 2465 </div> 2466 2467 <!-- KWIC Table --> 2468 <div id="kwicResults"> 2469 <table id="kwicTable" class="hidden"> 2470 <thead> 2471 <tr> 2472 <th 2473 data-lang-en="Left Context" 2474 data-lang-cy="Cyd-destun chwith" 2475 > 2476 Left Context 2477 </th> 2478 <th data-lang-en="Keyword" data-lang-cy="Allweddair"> 2479 Keyword 2480 </th> 2481 <th data-lang-en="Right Context" data-lang-cy="Cyd-destun de"> 2482 Right Context 2483 </th> 2484 </tr> 2485 </thead> 2486 <tbody> 2487 <!-- Filled by JavaScript --> 2488 </tbody> 2489 </table> 2490 </div> 2491 <a href="/get-keyword-data" download> 2492 <button 2493 type="button" 2494 class="analyze-btn hidden" 2495 data-lang-en="Download Keyword Results" 2496 data-lang-cy="Lawrlwytho Canlyniadau Allweddair" 2497 > 2498 Download Keyword Results 2499 </button> 2500 </a> 2501 <!-- Collocations Table --> 2502 <table id="collocsTable" class="hidden"> 2503 <thead> 2504 <tr> 2505 <th data-lang-en="Word" data-lang-cy="Geiriau">Word</th> 2506 <th data-lang-en="Frequency" data-lang-cy="Amlder">Frequency</th> 2507 <th>MI</th> 2508 <th>LL</th> 2509 </tr> 2510 </thead> 2511 <tbody> 2512 <!-- Filled by JavaScript --> 2513 </tbody> 2514 </table> 2515 <a href="/get-collos-data" download> 2516 <button 2517 type="button" 2518 class="analyze-btn hidden" 2519 data-lang-en="Download Collocations Results" 2520 data-lang-cy="Lawrlwytho Canlyniadau Cydleoliadau" 2521 > 2522 Download Collocations Results 2523 </button> 2524 </a> 2525 <!-- Display Network Visualization --> 2526 <label 2527 for="graphType" 2528 class="hidden" 2529 data-lang-en="Choose a Graph Type:" 2530 data-lang-cy="Dewiswch fath o graff" 2531 >Choose a Graph Type:</label 2532 > 2533 <select id="graphType" class="hidden"> 2534 <option 2535 value="frequency" 2536 data-lang-en="Frequency" 2537 data-lang-cy="Amlder" 2538 > 2539 Frequency 2540 </option> 2541 <option 2542 value="MI" 2543 data-lang-en="Mutual Information" 2544 data-lang-cy="Gwybodaeth gyffredin" 2545 > 2546 Mutual Information 2547 </option> 2548 <option 2549 value="LL" 2550 data-lang-en="Log Likelihood" 2551 data-lang-cy="Tebygolrwydd Log" 2552 > 2553 Log Likelihood 2554 </option> 2555 </select> 2556 <button 2557 type="button" 2558 class="analyze-btn hidden" 2559 id="generateGraph" 2560 data-lang-en="Regenerate Graph" 2561 data-lang-cy="Ail-greu Graff" 2562 > 2563 Regenerate Graph 2564 </button> 2565 <div id="graphContainer"></div> 2566 <a href="/get-graph-path" download> 2567 <button 2568 type="button" 2569 class="analyze-btn hidden" 2570 data-lang-en="Download Interactive Network Graph" 2571 data-lang-cy="Lawrlwytho Graff Rhwydwaith Rhyngweithiol" 2572 > 2573 Download Interactive Network Graph 2574 </button> 2575 </a> 2576 </form> 2577 </div> 2578 2579 <div id="tab5" class="tab-content"> 2580 <label 2581 for="search_word" 2582 data-lang-en="Search Word:" 2583 data-lang-cy="Gair Chwilio:" 2584 >Search Word:</label 2585 > 2586 <input type="text" id="search_word" name="search_word" /> 2587 <div id="puncSwitchDiv" class="custom-control custom-switch d-flex"> 2588 <input type="checkbox" class="custom-control-input" id="puncSwitch" /> 2589 <label 2590 class="custom-control-label" 2591 for="puncSwitch" 2592 data-lang-en="Show punctuation menu" 2593 data-lang-cy="Dangos y ddewislen atalnodi" 2594 >Show punctuation menu</label 2595 > 2596 </div> 2597 <div 2598 id="allPuncList" 2599 class="rounded container-fluid bg-light border border-light p-3 shadow mb-4 mt-2" 2600 style="display: none" 2601 > 2602 <div id="allPuncListInnerContainer" class="container-fluid"> 2603 <div id="SelectAllPuncContainer" class="row row-cols-auto"> 2604 <div class="col form-check"> 2605 <input 2606 class="form-check-input" 2607 type="checkbox" 2608 id="PSSelectAll" 2609 /> 2610 <label 2611 for="PSSelectAll" 2612 class="form-check-label" 2613 style="color: #8f2b2b" 2614 data-lang-en="All" 2615 data-lang-cy="Popeth" 2616 >All</label 2617 > 2618 </div> 2619 </div> 2620 </div> 2621 </div> 2622 <div id="puncKey" class="container-fluid" style="display: none"> 2623 <div> 2624 <div class="d-flex justify-content-center align-items-center"> 2625 <div class="mx-4"> 2626 <input class="form-check-input" type="checkbox" checked="" /> 2627 <p 2628 class="ml-1 font-weight-bold" 2629 data-lang-en="Included" 2630 data-lang-cy="Wedi’i gynnwys" 2631 > 2632 Included 2633 </p> 2634 </div> 2635 <div class="mx-4"> 2636 <input class="form-check-input" type="checkbox" /> 2637 <p 2638 class="ml-1 font-weight-bold" 2639 data-lang-en="Excluded" 2640 data-lang-cy="Wedi’i hepgor" 2641 > 2642 Excluded 2643 </p> 2644 </div> 2645 </div> 2646 </div> 2647 </div> 2648 <h5 2649 data-lang-en="This word tree shows the words which commonly occur before and after your searched word. The bigger the font size, the more often the word occurs. The number of times each word occurs is also shown when you scroll over the word (the number after âweightâ)" 2650 data-lang-cy="Mae'r goeden eiriau yma'n dangos y geiriau sy'n digwydd yn gyffredin cyn ac ar ôl y gair chwilioch chi amdano. Po fwyaf faint y ffont, mwyaf aml mae'r gair yn digwydd. Hefyd, dangosir y nifer o weithiau mae pob gair yn digwydd pan fyddwch yn sgrolio dros y gair (y rhif ar ôl 'pwysau')" 2651 > 2652 This word tree shows the words which commonly occur before and after 2653 your searched word. The bigger the font size, the more often the word 2654 occurs. The number of times each word occurs is also shown when you 2655 scroll over the word (the number after âweightâ) 2656 </h5> 2657 2658 <h5 2659 data-lang-en="The word frequency is represented by the weight in the tool tip"
2660 data-lang-cy="Cynrychiolir amlder y gair gan y pwysau yn yr awgrym offer" 2661 > 2662 The word frequency is represented by the weight in the tool tip 2663 </h5> 2664 <div id="wordtree_basic" style="width: 1200; height: 800"></div> 2665 <button 2666 type="button" 2667 class="analyze-btn" 2668 onclick="downloadWordTree()" 2669 data-lang-en="Download Interactive WordTree" 2670 data-lang-cy="Lawrlwytho Goeden Eiriau Rhyngweithiol" 2671 > 2672 Download Interactive WordTree 2673 </button> 2674 <iframe 2675 id="hiddenIframe" 2676 style="display: none; width: 0; height: 0" 2677 ></iframe> 2678 </div> 2679 <div id="tab6" class="tab-content"> 2680 <form 2681 id="pdfForm" 2682 action="/generate-pdf" 2683 method="post" 2684 enctype="multipart/form-data" 2685 target="_blank" 2686 > 2687 <div class="flex-container"> 2688 <section class="grid"> 2689 <!-- Sentiment Analysis--> 2690 <div 2691 class="square checkbox-option background-red" 2692 data-checkbox="sentimentData" 2693 > 2694 <i class="fas fa-chart-line text-size-60 text-white"></i> 2695 <h3 2696 class="text-strong text-uppercase" 2697 data-lang-en="Include Keyword Analysis" 2698 data-lang-cy="Cynnwys Dadansoddiad Allweddair" 2699 > 2700 Include Keyword Analysis 2701 </h3> 2702 </div> 2703 <!-- Sentiment Pie Plot --> 2704 <div 2705 class="square checkbox-option background-blue" 2706 data-checkbox="sentimentPlotPie" 2707 > 2708 <i class="fas fa-comments text-size-60 text-white"></i> 2709 <h3 2710 class="text-strong text-uppercase" 2711 data-lang-en="Include Sentiment Pie Chart" 2712 data-lang-cy="Cynnwys Siart Cylch" 2713 > 2714 Include Sentiment Pie Chart 2715 </h3> 2716 </div> 2717 <!-- Sentiment Bar Plot --> 2718 <div 2719 class="square checkbox-option background-green" 2720 data-checkbox="sentimentPlotBar" 2721 > 2722 <i class="fas fa-file-alt text-size-60 text-white"></i> 2723 <h3 2724 class="text-strong text-uppercase" 2725 data-lang-en="Include Sentiment Bar Chart" 2726 data-lang-cy="Cynnwys Siart Bar" 2727 > 2728 Include Sentiment Bar chart 2729 </h3> 2730 </div> 2731 <!-- Word Tree Data --> 2732 <div 2733 class="square checkbox-option background-purple" 2734 data-checkbox="wordTreeData" 2735 > 2736 <i class="fas fa-cloud text-size-60 text-white"></i> 2737 <h3 2738 class="text-strong text-uppercase" 2739 data-lang-en="Include Word Tree Data" 2740 data-lang-cy="Cynnwys Data'r Goeden Eiriau" 2741 > 2742 Include Word Tree Data 2743 </h3> 2744 </div> 2745 <!-- Summary --> 2746 <div 2747 class="square checkbox-option background-orange" 2748 data-checkbox="summarys" 2749 > 2750 <i class="fas fa-link text-size-60 text-white"></i> 2751 <h3 2752 class="text-strong text-uppercase" 2753 data-lang-en="Include Summary" 2754 data-lang-cy="Cynnwys Crynodeb" 2755 > 2756 Include Summary 2757 </h3> 2758 </div> 2759 <!-- Wordcloud --> 2760 <div 2761 class="square checkbox-option background-aqua" 2762 data-checkbox="wordCloud" 2763 > 2764 <i class="fas fa-tree text-size-60 text-white"></i> 2765 <h3 2766 class="text-strong text-uppercase" 2767 data-lang-en="Include Word Cloud" 2768 data-lang-cy="Cynnwys Cwmwl Geiriau" 2769 > 2770 Include Word Cloud 2771 </h3> 2772 </div> 2773 </section> 2774 <div class="generate-button-container"> 2775 <button 2776 type="button" 2777 id="generatePdfBtn" 2778 data-lang-en="Generate PDF" 2779 data-lang-cy="Creu PDF" 2780 > 2781 <i class="fas fa-file-pdf"></i> Generate PDF 2782 </button> 2783 </div> 2784 </div> 2785 <!-- Hidden checkboxes --> 2786 <input 2787 type="checkbox" 2788 name="sections" 2789 value="sentimentData" 2790 id="sentimentData" 2791 class="hidden-checkbox" 2792 /> 2793 <input 2794 type="checkbox" 2795 name="sections" 2796 value="sentimentPlotPie" 2797 id="sentimentPlotPie" 2798 class="hidden-checkbox" 2799 /> 2800 <input 2801 type="checkbox" 2802 name="sections" 2803 value="sentimentPlotBar" 2804 id="sentimentPlotBar" 2805 class="hidden-checkbox" 2806 /> 2807 <input 2808 type="checkbox" 2809 name="sections" 2810 value="wordTreeData" 2811 id="wordTreeData" 2812 class="hidden-checkbox" 2813 /> 2814 <input 2815 type="checkbox" 2816 name="sections" 2817 value="summary" 2818 id="summarys" 2819 class="hidden-checkbox" 2820 /> 2821 <input 2822 type="checkbox" 2823 name="sections" 2824 value="wordCloud" 2825 id="wordCloud" 2826 class="hidden-checkbox" 2827 /> 2828 2829 <input type="hidden" name="sentimentViewContent" id="sentimentField" /> 2830 2831 <input type="hidden" name="wordtree" id="wordtree" /> 2832 <input 2833 type="hidden" 2834 id="wordCloudImageSrcField" 2835 name="wordCloudImageSrc" 2836 /> 2837 <input type="hidden" id="summaryField" name="summaryField" /> 2838 <input 2839 type="hidden" 2840 name="sentiment_explanation" 2841 id="sentiment_explanation" 2842 /> 2843 <input type="hidden" name="Cloud_type" id="Cloud_type" /> 2844 <input type="hidden" name="Cloud_measure" id="Cloud_measure" /> 2845 </form> 2846 </div> 2847 </div> 2848 <!-- Moment.js (required for Date Range Picker) --> 2849
2849<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
2849 2850
2850<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.0/papaparse.min.js"></script>
2850 2851 <!-- DataTables JS --> 2852
2852<script 2853 type="text/javascript" 2854 charset="utf8" 2855 src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js" 2856 ></script>
2856 2857 2858 <!-- noUiSlider JS --> 2859
2859<script src="https://cdn.jsdelivr.net/npm/[email protected]/distribute/nouislider.min.js"></script>
2859 2860 2861 <!-- Date Range Picker JS --> 2862
2862<script 2863 type="text/javascript" 2864 src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js" 2865 ></script>
2865 2866 2867 <!-- AG-Grid JS --> 2868
2868<script src="https://unpkg.com/@ag-grid-community/all-modules/dist/ag-grid-community.min.noStyle.js"></script>
2868 2869
2869<script> 2870 // The JavaScript that manages the clickable grid items 2871 document.addEventListener("DOMContentLoaded", function () { 2872 const options = document.querySelectorAll(".checkbox-option"); 2873 2874 options.forEach((option) => { 2875 option.addEventListener("click", function () { 2876 const checkboxId = this.getAttribute("data-checkbox"); 2877 const checkbox = document.getElementById(checkboxId); 2878 2879 if (checkbox.checked) { 2880 checkbox.checked = false; 2881 this.classList.remove("selected"); 2882 } else { 2883 checkbox.checked = true; 2884 this.classList.add("selected"); 2885 } 2886 }); 2887 }); 2888 }); 2889 </script>
2889 2890 2891 </main> 2892 2893 <!-- Logos in Footer --> 2894 <footer> 2895 <div class="container"> 2896 2897 <div class="row"> 2898 2899 <div class="col-md-1 offset-md-2"> 2900 <a href="https://www.cardiff.ac.uk/"><img src="static/images/img/cardiff.png" class="footer-logo"></a></div> 2901 <div class="col-md-1"> 2902 <a href="https://www.lancaster.ac.uk/"> 2903 <img src="static/images/img/Lancaster.png" class="footer-logo"> 2904 </a> 2905 </div> 2906 <div class="col-md-1"> 2907 <a href="https://www.nationaltrust.org.uk/"> 2908 <img src="static/images/img/NTW.JPG" class="footer-logo"> </a></div> 2909 <div class="col-md-1"> 2910 <a href="https://museum.wales/"><img src="static/images/img/Amgueddfa_Cymru_logo.svg.png" class="footer-logo"> </a></div> 2911 <div class="col-md-1"> 2912 <a href="https://cadw.gov.wales/"> 2913 <img src="static/images/img/Cadw.png" class="footer-logo"></a></div> 2914 <div class="col-md-1"> 2915 <a href="https://learnwelsh.cymru/"> 2916 <img src="static/images/img/NCLW.jpg" class="footer-logo"></a></div> 2917 <div class="col-md-1"> 2918 <a href="https://www.wjec.co.uk/"> 2919 <img src="static/images/img/WJEC_CBAC_logo.svg.png" class="footer-logo"></a> 2920 </div> 2921 <div class="col-md-1"> 2922 <a href="https://www.ukri.org/"> 2923 <img src="static/images/img/ukri-ahrc-square-logo.png" class="footer-logo"> 2924 </a></div> 2925 </div> 2926 2927 </div> 2928 2929 </footer>
vendor: 69 bytes, lines 2929-2931
2929 2930 2931<script async src="https://www.googletagmanager.com/gtag/js?id=
2931G-D48BPF7LK0
vendor: 13 bytes, lines 2931-2932
2931"></script> 2932
2933<script> 2934 2935
vendor: 136 bytes, lines 2935-2941
2935window.dataLayer = window.dataLayer || []; 2936 2937 function gtag(){dataLayer.push(arguments);} 2938 2939 gtag('js', new Date()); 2940 2941 gtag('config', '
2941G-D48BPF7LK0
vendor: 5 bytes, lines 2941-2942
2941'); 2942
2943</script>
2943 2944</body> 2945</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.