interactive-mining/interactive-mining-madoap/madoap/src/templates/configure_profile.html

270 lines
20 KiB
HTML

{% extends "base_v2.html" %}
{% block configure_profile %} class="current" {% end %}
{% block content %}
<title>Configure profile</title>
<link rel="stylesheet" href="/static/animations.css"/>
<div class="uk-flex-inline cm-nav-container">
<div class="cm-left-box"><a href="/"><button id="cancel-main-btn" class="uk-close-large" type="button" uk-close></button></a></div>
<div class="cm-navigation cm-nav-toolbar">
<ul class="uk-subnav uk-subnav-line">
<li class="cm-nav-li">
<a class="cm-nav-a" href="upload-codes">
<div class="cm-nav-number-container"><span class="cm-nav-number uk-text-middle">1</span></div>
<span class="cm-nav-title uk-text-middle">Upload your<br>project codes</span>
</a>
</li>
<li class="cm-nav-li cm-nav-active">
<a class="cm-nav-a">
<div class="cm-nav-number-container"><span class="cm-nav-number uk-text-middle">2</span></div>
<span class="cm-nav-title uk-text-middle">Configure the<br>matching proccess</span>
</a>
</li>
<li class="cm-nav-li">
<a class="cm-nav-a" href="save-profile" id="save-profile-option">
<div class="cm-nav-number-container"><span class="cm-nav-number uk-text-middle">3</span></div>
<span class="cm-nav-title uk-text-middle">Save your<br>matching profile</span>
</a>
</li>
</ul>
</div>
</div>
<div class="uk-grid-collapse uk-child-width-expand@s" uk-grid>
<div class="uk-width-large cm-config-settings-section">
<div class="cm-easy-config-section">
<h4>Matching mode <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h4>
<div class="cm-config-options-container">
<div class="cm-config-options-connect-line"></div>
<div class="uk-child-width-expand@s uk-text-center" uk-grid>
<div>
<a class="cm-config-option cm-config-light" id="1-level">
<div class="cm-circle-button">
<div class="cm-circle-button-fill"></div>
</div>
<span>Light</span>
</a>
</div>
<div>
<a class="cm-config-option cm-config-medium" id="2-level">
<div class="cm-circle-button">
<div class="cm-circle-button-fill"></div>
</div>
<span>Medium</span>
</a>
</div>
<div>
<a class="cm-config-option cm-config-hard" id="3-level">
<div class="cm-circle-button">
<div class="cm-circle-button-fill"></div>
</div>
<span>Hard</span>
</a>
</div>
<div>
<a class="cm-config-option cm-config-advance" id="c-level">
<div class="cm-circle-button">
<div class="cm-circle-button-fill"></div>
</div>
<span>Advanced</span>
</a>
</div>
</div>
</div>
</div>
<hr>
<div class="cm-advanced-tools-section">
<label class="uk-form-label cm-advaned-tools-label" for="advaned-tools-label"><input id="advaned-tools-label" class="uk-checkbox" type="checkbox"> Show advanced tools <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
<div id="advaned-tools">
<div class="uk-accordion-content">
<div class="uk-grid-small uk-child-width-expand@s" uk-grid>
<div class="cm-prhases">
<h5>Positive phrases <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<div class="cm-phrases-container">
<header>
<form id="word-form-pos" class="uk-grid-collapse uk-child-width-expand@s uk-text-center" uk-grid>
<div class="cm-number-space uk-width-1-5@m">#</div>
<input class="uk-width-expand uk-text-left cm-text-input cm-text-input-phrase" type="text" id="text-pos" placeholder="Phrase"/>
<input class="uk-width-1-5@m uk-text-left cm-text-input cm-text-input-weight" type="number" name="weight" min="0" max="100" id="weight-pos" placeholder="Weight"/>
<input type="submit" class="btn uk-width-1-4@m cm-main-button cm-phases-button" value="Add"/>
</form>
<div class="scroll_holder">
<div class="scroller"></div>
</div>
</header>
<div style="position: relative;">
<div style="position: absolute; left: 0; top: 0; height: 100%; width: 40px; background-color: #f8d4c7;"></div>
<ul id="word-pos" class="uk-list uk-list-striped">
</ul>
</div>
<footer class="positive">
<div class="uk-grid-collapse uk-child-width-expand@s" uk-grid>
<div>
<span class="count" id="count-pos">0</span>
<span> positive word(s)</span>
</div>
<div class="uk-inline">
<button class="uk-float-right uk-button uk-button-default" disabled id="clear-all-pos">Delete All</button>
</div>
</div>
</footer>
</div>
</div>
<div class="cm-prhases">
<h5>Negative phrases <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<div class="word-container">
<div class="cm-phrases-container">
<header>
<form class="uk-grid-collapse uk-child-width-expand@s uk-text-center" id="word-form-neg" uk-grid>
<div class="cm-number-space uk-width-1-5@m">#</div>
<input class="uk-width-expand uk-text-left cm-text-input cm-text-input-phrase" type="text" id="text-pos" placeholder="Phrase"/>
<input class="uk-width-1-5@m uk-text-left cm-text-input cm-text-input-weight" type="number" name="weight" min="0" max="100" id="weight-pos" placeholder="Weight"/>
<input type="submit" class="btn uk-width-1-4@m cm-main-button cm-phases-button" value="Add"/>
</form>
<div class="scroll_holder">
<div class="scroller"></div>
</div>
</header>
<div style="position: relative;">
<div style="position: absolute; left: 0; top: 0; height: 100%; width: 40px; background-color: #f8d4c7;"></div>
<ul id="word-neg" class="uk-list uk-list-striped">
</ul>
</div>
<footer class="negative">
<div class="uk-grid-collapse uk-child-width-expand@s" uk-grid>
<div>
<span class="count" id="count-neg">0</span>
<span> positive word(s)</span>
</div>
<div class="uk-inline">
<button class="uk-float-right uk-button uk-button-default" disabled id="clear-all-neg">Delete All</button>
</div>
</div>
</footer>
</div>
</div>
</div>
</div>
<h5>Acknowledgement statement proccess <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<form class="uk-form-horizontal">
<div>
<label class="uk-form-label" for="word-split">Length of N-grams <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
<div class="uk-form-controls">
<input class="uk-input" type="number" name="word-split" min="0" max="10" id="word-split" placeholder="Word pairs" value="2"/>
</div>
</div>
</form>
<h5>Matching area size <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<form class="uk-form-horizontal">
<div class="cm-match-area left">
<label class="uk-form-label" for="context-prev-words">Words left of the match <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
<div class="uk-form-controls">
<input class="uk-input" type="number" name="context-prev-words" min="0" max="20" id="context-prev-words" placeholder="Prev words number" value="10"/>
</div>
</div>
<div class="cm-match-area middle">
<label class="uk-form-label" for="context-middle-words">Matched words <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
<div class="uk-form-controls">
<input class="uk-input" type="number" name="context-middle-words" min="1" max="10" id="context-middle-words" placeholder="Middle words number" value="1"/>
</div>
</div>
<div class="cm-match-area right">
<label class="uk-form-label" for="context-next-words">Words right of the match <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
<div class="uk-form-controls">
<input class="uk-input" type="number" name="context-next-words" min="0" max="20" id="context-next-words" placeholder="Next words number" value="5"/>
</div>
</div>
</form>
<h5>Text proccess <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<form class="uk-form-stacked">
<div class="uk-margin">
<label class="uk-form-label" for="stop-words-filter"><input id="stop-words-filter" class="uk-checkbox" type="checkbox"> Remove stop words <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
</div>
<div class="uk-margin">
<label class="uk-form-label" for="punctuation-filter"><input id="punctuation-filter" class="uk-checkbox" type="checkbox"> Remove punctuation <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></label>
</div>
</form>
<h5>Letter case <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h5>
<div class="uk-form-controls" id="letter-case-radio">
<label><input class="uk-radio none" type="radio" name="letter-case" value="none" checked="checked"> As it is</label><br>
<label><input class="uk-radio uppercase" type="radio" name="letter-case" value="uppercase"> UPPERCASE</label><br>
<label><input class="uk-radio lowercase" type="radio" name="letter-case" value="lowercase"> lowercase</label>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="cm-results-section uk-padding-medium-top">
<div class="uk-container uk-container-expand">
<div class="uk-grid-collapse uk-child-width-expand@s" uk-grid>
<div>
<h4>Matching results <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h4>
</div>
<div id="documents-section" class="uk-inline">
<div id="documents-change-btn" class="uk-float-right">
<span id="docs-number" class="uk-text">0 documents uploaded</span>
<span id="docs-more-btn" class="uk-margin-small-left" uk-icon="icon: more" style="display: none;"></span>
</div>
</div>
</div>
<button id="run-mining-btn" class="uk-button uk-button-primary uk-margin-top" disabled>Run mining</button>
</div>
<div id="initial-docs-upload-form" class="cm-docs-selection-form uk-container uk-container-small">
<h4>Load test documents <span class="cm-tooltip" uk-icon="icon: info" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom"></span></h4>
<div class="uk-container uk-container-small uk-margin-medium-top">
<div class="uk-text-center">
<button id="egi-sample" class="uk-button uk-width-extend cm-main-button uk-margin-small">test1 documents</button>
<button id="rcuk-sample" class="uk-button uk-width-extend cm-main-button uk-margin-small">test2 documents</button>
<button id="arxiv-sample" class="uk-button uk-width-extend cm-main-button uk-margin-small">test3 documents</button>
</div>
<div class="uk-heading-line uk-text-center uk-margin-small-top uk-margin-small-bottom"><span>or</span></div>
<div class="js-upload uk-placeholder cm-file-drop-area">
<div class="uk-flex uk-flex-middle uk-grid-collapse uk-child-width-expand@s" uk-grid>
<div>
<div class="cm-coloured-text">
<span uk-icon="icon: cloud-upload"></span>
<span class="uk-text-middle">Upload your documents</span>
<span class="cm-tooltip" title="If you want the tooltip to appear with a little delay, just add the delay option to the uk-tooltip attribute with your value in milliseconds." uk-tooltip="pos: bottom" uk-icon="icon: info"></span>
</div>
<div>
<span class="cm-label">JSON</span><span class="cm-label">PDF</span><span class="cm-label">TXT</span>
<span class="uk-text uk-text-small">file types, maximum 10MB</span>
</div>
</div>
<div uk-form-custom>
<input type="file" name="upload" id="docs-file-input" class="inputfile">
<button class="uk-button uk-button-default cm-main-button" type="button" tabindex="-1">Choose file</button>
</div>
</div>
</div>
<progress id="js-progressbar" class="uk-progress" value="0" max="100" hidden></progress>
</div>
</div>
<div id="results-count" class="uk-inline uk-margin-top">
<span id="results-number" class="uk-text-primary uk-margin-right"></span>
<span id="results-number-previous" class="uk-text-muted"></span>
</div>
<div id="results-section" class="uk-container uk-margin-top cm-results-rows" style="display: none;">
<ul id="docs-results" uk-accordion="multiple: true">
</ul>
</div>
<div class="cm-results-hide-pannel"></div>
</div>
<div class="uk-flex uk-flex-center@m uk-flex-right@l uk-margin-top uk-margin-right ">
<span class="uk-text-primary uk-text-middle">Satisfied with the results?</span>
<button id="next-button" class="uk-button uk-button-primary uk-margin-left">Save your profile</button>
</div>
</div>
</div>
<div id="wait-spinner-modal-center" class="uk-flex-top uk-modal" esc-close="false" bg-close="false" uk-modal>
<div class="uk-modal-dialog uk-modal-body uk-margin-auto-vertical">
<p class="uk-text-center uk-text-middle uk-text-large">Working on it, please wait... <span uk-spinner></span></p>
</div>
</div>
<script src="/static/configure-profile.js" type="text/javascript"></script>
{% end %}