Updated index page + Added about and result pages

master
lkrsnik 5 months ago
parent 6d504394ef
commit e71d656d0e

5
.gitignore vendored

@ -1,7 +1,10 @@
internal_saves
media
*.sage.py
venv
venv*
.idea
__pycache__
static_old
build
data
*.egg-info

@ -0,0 +1,8 @@
FROM python:3.10.12
ADD . /stark-web
WORKDIR /stark-web
RUN pip install --upgrade pip
RUN pip install waitress
RUN pip install .
CMD ["waitress-serve", "--call", "app:app"]

@ -1,8 +1,13 @@
import configparser
import csv
import os
import random
import re
import string
import time
import requests
from flask import Flask, render_template, request, send_file
from flask import Flask, render_template, request, send_file, redirect, url_for
from werkzeug.utils import secure_filename
from stark import run
@ -10,6 +15,7 @@ from stark import run
app = Flask(__name__)
UPLOAD_FOLDER = 'uploads'
ALLOWED_EXTENSIONS = {'conllu'}
DAYS_BEFORE_DELETION = 1
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
@ -53,6 +59,7 @@ def allowed_file(filename):
return '.' in filename and \
filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS
@app.route('/upload')
def upload_file2():
return render_template('upload.html')
@ -66,14 +73,65 @@ def upload_file():
return 'file uploaded successfully'
@app.route('/about', methods=['GET'])
def about():
return render_template('about.html')
# @app.route('/result/<result_id>/download', methods=['GET'])
# def download_result(result_id):
# return
@app.route('/result/<result_id>', methods=['GET', 'POST'])
def result(result_id):
if request.method == 'POST':
for filename in os.listdir('media'):
file_path = os.path.join('media', filename)
f_t = os.path.getmtime(file_path)
c_t = time.time()
file_age_seconds = c_t - f_t
if file_age_seconds > DAYS_BEFORE_DELETION * 86400:
os.remove(file_path)
# TODO ADD LINKS
# TODO TEST VARYING SIZES OF TEXT IN TABLE
return send_file(os.path.join('media', result_id), as_attachment=True, download_name='results.tsv')
order_by = request.args.get('order_by')
order_type = request.args.get('order_type')
with open(os.path.join('media', result_id), 'r') as rf:
content = list(csv.reader(rf, delimiter='\t'))
head = content[0]
content_dict = {h: [] for h in head}
if order_by is not None and order_by[:-1] in head:
sort_id = head.index(order_by[:-1])
if order_type == 'asc':
# check if a number can be converted to float or int
ordered_content = sorted(content[1:], key=lambda x: -1 * float(x[sort_id]) if x[sort_id].isnumeric() or re.match(r'^-?\d+(?:\.\d+)$', x[sort_id]) is not None else x[sort_id], reverse=True)
else:
ordered_content = sorted(content[1:], key=lambda x: -1 * float(x[sort_id]) if x[sort_id].isnumeric() or re.match(r'^-?\d+(?:\.\d+)$', x[sort_id]) is not None else x[sort_id])
else:
ordered_content = content[1:]
for i, row in enumerate(ordered_content):
for j, v in enumerate(row):
content_dict[head[j]].append(v)
# content.sort(key=lambda x: x[1])
a = request
print(result_id)
return render_template('result.html', head_row=head, content=content_dict)
@app.route('/', methods=['GET', 'POST'])
def index():
if request.method == 'POST':
form = request.form
a = request
configs = {}
# mandatory parameters
configs['input_path'] = 'data/sl_ssj-ud_v2.4.conllu'
configs['input_path'] = ''
validation = {}
@ -93,7 +151,8 @@ def index():
# TODO OPTIONALLY ADD conllu FILE CHECK
elif 'input_url' in form and form['input_url']:
try:
input_path = os.path.join('media', 'input.conllu')
name = form['input_url'].split('/')[-1]
input_path = os.path.join('media', name)
response = requests.get(form['input_url'])
open(input_path, "wb").write(response.content)
configs['input_path'] = input_path
@ -138,10 +197,13 @@ def index():
return True
# TODO radio button (maybe checkbutton)
node_type = []
if 'node_type' in form:
node_type = form['node_type']
if 'node_type_upos' in form:
node_type.append('upos')
if 'node_type_form' in form:
node_type.append('form')
if 'node_type_lemma' in form:
node_type.append('lemma')
if validate_node_type(node_type):
configs['node_type'] = '+'.join(node_type)
@ -154,12 +216,13 @@ def index():
# TODO FINALIZE THIS!
configs['complete_tree_type'] = True
configs['dependency_type'] = True
configs['node_order'] = True
configs['association_measures'] = False
configs['dependency_type'] = 'labeled_trees' in form and form['labeled_trees'] == 'on'
configs['node_order'] = 'fixed_order' in form and form['fixed_order'] == 'on'
configs['label_whitelist'] = []
configs['root_whitelist'] = []
if 'root_restriction' in form and form['root_restriction']:
configs['root_whitelist'] = form['root_restriction'].split('|')
configs['query'] = None
@ -182,14 +245,16 @@ def index():
# configs = read_configs(config, args)
configs['output'] = os.path.join('media', 'result.tsv')
configs['complete_tree_type'] = form['complete'] == 'yes'
configs['association_measures'] = False
configs['grew_match'] = 'grewmatch_patterns' in form and form['grewmatch_patterns'] == 'on'
configs['depsearch'] = False
name = ''.join(random.choices(string.ascii_uppercase + string.digits, k=60))
configs['output'] = os.path.join('media', name)
run(configs)
# TODO DELETE STORED FILE AFTER PROCESSING
return send_file(configs['output'], as_attachment=True)
return redirect(url_for('result', result_id=name))
# return send_file(configs['output'], as_attachment=True)
# return render_template('index.html')
return render_template('index.html')

@ -1,14 +1,3 @@
blinker==1.6.2
certifi==2023.7.22
charset-normalizer==3.3.0
click==8.1.7
Flask==3.0.0
idna==3.4
itsdangerous==2.1.2
Jinja2==3.1.2
MarkupSafe==2.1.3
pyconll==3.2.0
requests==2.31.0
stark @ git+https://github.com/clarinsi/STARK@f6c7f810979c55f96b8dac111bf2017c0dd58429
urllib3==2.0.6
Werkzeug==3.0.0

@ -0,0 +1,23 @@
import re
from os import path
from setuptools import setup, find_packages
here = path.abspath(path.dirname(__file__))
# read the version from classla/_version.py
VERSION = '0.0.1'
setup(name='stark-api',
version=VERSION,
description=u"Stark web application",
author='CLARIN.SI',
author_email='info@clarin.si',
license='Apache 2',
packages=find_packages(),
install_requires=[
'Flask>=3.0.0',
'requests>=2.31.0',
'stark @ git+https://github.com/clarinsi/STARK@master'
],
)

@ -20,4 +20,58 @@
.noUi-target.noUi-horizontal .noUi-tooltip {
transform: scale(1) rotate(-45deg) translate(0px, 4px);
}
h4 {
font-size: 1.8rem;
}
label {
font-size: 1.2rem;
}
.input-field > label {
font-size: 1.2rem;
}
.table-wrapper {
overflow-x: scroll;
overflow-y: scroll;
height: 600px;
border: #555555;
}
.table-wrapper thead th {
position: sticky;
top: 0;
}
.table-wrapper thead th{
cursor: pointer;
}
.tr-link {
cursor: pointer;
}
table {
table-layout: fixed;
}
th {
width: 300px;
padding: 10px 0 10px;
background-color: #cccccc;
text-align: center;
border-left-radius: 2px;
border-right: solid 1px #bbbbbb;
border-left: solid 1px #bbbbbb;
}
td {
width: 300px;
padding: 10px 0 10px;
text-align: center;
border-right: solid 1px #bbbbbb;
border-left: solid 1px #bbbbbb;
}

@ -30,32 +30,43 @@ document.addEventListener("DOMContentLoaded", function(event) {
}); // end of document ready
$(document).ready(function(){
// slider
// var valuesForSlider = [2,3,4,5];
// var slider = document.getElementById('slider');
// var format = {
// to: function(value) {
// return valuesForSlider[Math.round(value)];
// },
// from: function (value) {
// return valuesForSlider.indexOf(Number(value));
// }
// };
//
// noUiSlider.create(slider, {
// start: [3, 4],
// connect: true,
// step: 1,
// orientation: 'horizontal', // 'horizontal' or 'vertical'
// range: {
// 'min': 0,
// 'max': valuesForSlider.length - 1
// },
// format: wNumb({
// decimals: 0
// })
// });
$('#advanced-tree').hide();
$('.input-field span.helper-text').hide();
$('.input-field').bind('mouseenter', function(e) {
$(this).find('span.helper-text').show('fast')
});
var advancedTreeExpanded = false;
$('#advanced-tree-expand').bind('click', function(e) {
if (!advancedTreeExpanded){
advancedTreeExpanded = true;
$('#advanced-tree').show('fast');
$('#advanced-tree-expand i').text('remove');
} else {
advancedTreeExpanded = false;
$('#advanced-tree').hide('fast');
$('#advanced-tree-expand i').text('add');
}
$(this).find('span.helper-text').show('fast')
});
$('.input-field').bind('mouseleave', function(e) {
$(this).find('span.helper-text').hide('fast')
});
});
$("#submit-form").submit( function(eventObj) {
var spans = $(".noUi-tooltip").find('span');
var tree_size_min = spans[0].innerText;
var tree_size_max = spans[1].innerText;
console.log('amm');
$("<input />").attr("type", "hidden")
.attr("name", "tree_size_min")
.attr("value", tree_size_min)
.appendTo("#submit-form");
$("<input />").attr("type", "hidden")
.attr("name", "tree_size_max")
.attr("value", tree_size_max)
.appendTo("#submit-form");
return true;
});
})(jQuery); // end of jQuery name space

@ -0,0 +1,52 @@
function addOrUpdateUrlParameter(url, key, value) {
var urlObject = new URL(url);
urlObject.searchParams.set(key, value);
return urlObject.href;
}
function getUrlParameters() {
var searchParams = new URLSearchParams(window.location.search);
var params = {};
// Iterate over each parameter and add to the 'params' object
searchParams.forEach(function(value, key) {
params[key] = value;
});
return params;
}
$(document).ready(function() {
var params = getUrlParameters();
// Make table rows clickable
$(".table-wrapper tbody tr").click(function() {
var url = $(this).data("href");
if (url) {
window.location.href = url;
}
});
$(".th-desc").hide();
$(".th-asc").hide();
if ('order_by' in params) {
if ('order_type' in params && params.order_type == 'desc') {
$('th:contains(' + params.order_by + ') .th-desc').show();
} else {
$('th:contains(' + params.order_by + ') .th-asc').show();
}
}
// Make table rows clickable
$(".table-wrapper thead th").click(function(e) {
var column_name = $(this).find('span:first').text();
var newUrl = addOrUpdateUrlParameter(window.location.href, 'order_by', column_name);
if ('order_by' in params && 'order_type' in params && params.order_by == column_name && params.order_type == 'desc') {
newUrl = addOrUpdateUrlParameter(newUrl, 'order_type', 'asc');
} else {
newUrl = addOrUpdateUrlParameter(newUrl, 'order_type', 'desc');
}
// Redirect to the modified URL
window.location.href = newUrl;
});
});

@ -0,0 +1,137 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
<title>Starter Template - Materialize</title>
<!-- CSS -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="static/css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="static/css/nouislider.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="static/css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
</head>
<body>
<nav class="grey darken-2" role="navigation">
<div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">STARK</a>
<!-- <ul class="right hide-on-med-and-down">-->
<!-- <li><a href="#">Navbar Link</a></li>-->
<!-- </ul>-->
<!-- <ul id="nav-mobile" class="sidenav">-->
<!-- <li><a href="#">Navbar Link</a></li>-->
<!-- </ul>-->
<!-- <a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>-->
<ul id="nav-mobile" class="right hide-on-med-and-down">
<li><a href="/">Processing</a></li>
<li><a href="/about">About</a></li>
</ul>
</div>
</nav>
<!-- <div class="section no-pad-bot" id="index-banner">-->
<!-- <div class="container">-->
<!-- <br><br>-->
<!-- <h1 class="header center orange-text">Starter Template</h1>-->
<!-- <div class="row center">-->
<!-- <h5 class="header col s12 light">A modern responsive front-end framework based on Material Design</h5>-->
<!-- </div>-->
<!-- <div class="row center">-->
<!-- <a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light orange">Get Started</a>-->
<!-- </div>-->
<!-- <br><br>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="container">-->
<!-- <div class="section">-->
<!-- &lt;!&ndash; Icon Section &ndash;&gt;-->
<!-- <div class="row">-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">flash_on</i></h2>-->
<!-- <h5 class="center">Speeds up development</h5>-->
<!-- <p class="light">We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">group</i></h2>-->
<!-- <h5 class="center">User Experience Focused</h5>-->
<!-- <p class="light">By utilizing elements and principles of Material Design, we were able to create a framework that incorporates components and animations that provide more feedback to users. Additionally, a single underlying responsive system across all platforms allow for a more unified user experience.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">settings</i></h2>-->
<!-- <h5 class="center">Easy to work with</h5>-->
<!-- <p class="light">We have provided detailed documentation as well as specific code examples to help new users get started. We are also always open to feedback and can answer any questions a user may have about Materialize.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <br><br>-->
<div class="container">
<br>
<div class="row">
<div class="col s12">
<h4>About</h4>
<p class="caption">Welcome to the online demo interface for STARK - a highly-customizible tool designed to extract various types of syntactic trees from dependency-parsed corpora (treebanks). Unlike the original command-line version, this user-friendly interface offers a streamlined set of settings, which are described in more detail here. Simply upload your treebank and click SUBMIT to view the initial results!</p>
</div>
</div>
</div>
<footer class="page-footer light-blue">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">Credits</h5>
<p class="grey-text text-lighten-4">Add some logos here?</p>
</div>
<!-- <div class="col l3 s12">-->
<!-- <h5 class="white-text">Settings</h5>-->
<!-- <ul>-->
<!-- <li><a class="white-text" href="#!">Link 1</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 2</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 3</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 4</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div class="col l3 s12">-->
<!-- <h5 class="white-text">Connect</h5>-->
<!-- <ul>-->
<!-- <li><a class="white-text" href="#!">Link 1</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 2</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 3</a></li>-->
<!-- <li><a class="white-text" href="#!">Link 4</a></li>-->
<!-- </ul>-->
<!-- </div>-->
</div>
</div>
<div class="footer-copyright">
<div class="container">
Made by <a class="orange-text text-lighten-3" href="http://materializecss.com">Materialize</a>
</div>
</div>
</footer>
<!-- Scripts-->
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="static/js/materialize.js"></script>
<script src="static/js/wNumb.js"></script>
<script src="static/js/nouislider.min.js"></script>
<script src="static/js/init.js"></script>
</body>
</html>

@ -22,6 +22,10 @@
<!-- <li><a href="#">Navbar Link</a></li>-->
<!-- </ul>-->
<!-- <a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>-->
<ul id="nav-mobile" class="right hide-on-med-and-down">
<li><a href="/">Processing</a></li>
<li><a href="/about">About</a></li>
</ul>
</div>
</nav>
<!-- <div class="section no-pad-bot" id="index-banner">-->
@ -79,159 +83,135 @@
<br>
<div class="row">
<div class="col s12">
<form>
<h4>General settings</h4>
<p class="caption">Welcome to the online demo interface for STARK - a highly-customizible tool designed to extract various types of syntactic trees from dependency-parsed corpora (treebanks). Unlike the original command-line version, this user-friendly interface offers a streamlined set of settings, which are described in more detail here. Simply upload your treebank and click SUBMIT to view the initial results!</p>
<form action="{{ url_for('index') }}" method="POST" enctype="multipart/form-data" id="submit-form">
<h4>Input data</h4>
<div class="card">
<div class="card-content">
<label>Treebank</label>
<label><b>Upload a treebank</b> in CONLL-U format</label>
<div class = "file-field input-field">
<div class = "btn">
<span>Browse</span>
<input type = "file" />
<input type = "file" name="file"/>
</div>
<div class = "file-path-wrapper">
<input class="file-path validate" type="text" placeholder="Upload"/>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Upload a treebank in CONLL-U format.</span>
</div>
<div class="row">
<div class="input-field col s12">
<input id="input_url" name="input_url" type="text" class="validate">
<label for="input_url">Treebank url</label>
<span class="helper-text" data-error="wrong" data-success="right">Insert a link to treebank in CONLL-U format.</span>
<label for="input_url"><u>Or</u> insert a URL link to a treebank in CONLL-U format</label>
<!-- <span class="helper-text" data-error="wrong" data-success="right">Insert a link to treebank in CONLL-U format.</span>-->
</div>
</div>
</div>
</div>
<br>
<h4>Tree specifications</h4>
<h4>Tree specification</h4>
<div class="card">
<div class="card-content">
<label>Tree size</label>
<label><b>Tree size</b>: number of tokens in the tree (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--size" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="row">
<div class="input-field col s12">
<br />
<div id="slider"></div>
<span class="helper-text" data-error="wrong" data-success="right">Specify the number of nodes in the trees to be extracted.</span>
</div>
</div>
<label>Node type</label>
<label><b>Node type</b>: token characteristics to consider (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--node_type" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="row">
<div class="input-field col s12">
<p>
<div class="input-field">
<div class="col s4">
<label>
<input type="checkbox" class="filled-in" checked="checked" />
<input type="checkbox" class="filled-in" name="node_type_upos" checked="checked" />
<span>UPOS</span>
</label>
</p>
<p>
</div>
<div class="col s4">
<label>
<input type="checkbox" class="filled-in" />
<input type="checkbox" class="filled-in" name="node_type_form"/>
<span>form</span>
</label>
</p>
<p>
</div>
<div class="col s4">
<label>
<input type="checkbox" class="filled-in" />
<input type="checkbox" class="filled-in" name="node_type_lemma"/>
<span>lemma</span>
</label>
</p>
<span class="helper-text" data-error="wrong" data-success="right">Should extracted trees be differentiated based on the surface word order?</span>
</div>
</div>
</div>
</div>
</div>
<br>
<h4>Advanced tree specifications</h4>
<div class="card">
<h4><a class="btn-floating btn-large waves-effect waves-light inline" id="advanced-tree-expand"><i class="material-icons">add</i></a> Advanced settings</h4>
<div class="card" id="advanced-tree">
<div class="card-content">
<label>Fixed order</label>
<div class="row">
<div class="input-field col s12">
<div class="switch">
<label>
No
<input type="checkbox" checked="checked">
<span class="lever"></span>
Yes
</label>
<div class="col s6">
<label><b>Labeled trees</b>: include names of dependency relations (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--labeled" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="input-field">
<div class="switch">
<label>
No
<input type="checkbox" name="labeled_trees" checked="checked">
<span class="lever"></span>
Yes
</label>
</div>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Should extracted trees be differentiated based on the surface word order?</span>
</div>
</div>
<label>Labeled trees</label>
<div class="row">
<div class="input-field col s12">
<div class="switch">
<label>
No
<input type="checkbox" checked="checked">
<span class="lever"></span>
Yes
</label>
<div class="col s6">
<label><b>Fixed order</b>: differentiate trees based on surface word order (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--fixed" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="input-field">
<div class="switch">
<label>
No
<input type="checkbox" name="fixed_order" checked="checked">
<span class="lever"></span>
Yes
</label>
</div>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Should the extracted trees contain names of dependency relations?</span>
</div>
</div>
<label>Complete trees</label>
<div class="row">
<div class="input-field col s12">
<div class="switch">
<label>
No
<input type="checkbox" checked="checked">
<span class="lever"></span>
Yes
</label>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Should only full subtrees be extracted (rather than all possible subtrees)?</span>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="root_restriction" name="root_restriction" type="text" class="validate">
<label for="root_restriction">Root restriction</label>
<span class="helper-text" data-error="wrong" data-success="right">Specify potential restrictions on the root of the trees to be extracted (e.g. upos=NOUN if you are interested in nominal trees only)</span>
<label for="root_restriction"><b>Head</b>: specify potential restrictions on the head node (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--head" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
</div>
</div>
</div>
</div>
<h4>Output settings</h4>
<div class="card">
<div class="card-content">
<label>Association measures</label>
<div class="row">
<div class="input-field col s12">
<div class="switch">
<label>
No
<input type="checkbox">
<span class="lever"></span>
Yes
</label>
<div class="col s6">
<label><b>Association measures</b>: print MI, MI3, Dice, logDice, t-score and simple-LL scores (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--association_measures" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="input-field">
<div class="switch">
<label>
No
<input type="checkbox" name="association_measures">
<span class="lever"></span>
Yes
</label>
</div>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Include measures of statistical association between nodes of the tree (MI, MI3, Dice, logDice, t-score, simple-LL) in the output?</span>
</div>
</div>
<label>Grew-match patterns</label>
<div class="row">
<div class="input-field col s12">
<div class="switch">
<label>
No
<input type="checkbox">
<span class="lever"></span>
Yes
</label>
<div class="col s6">
<label><b>Grew-match</b>: convert tree structures to Grew-match patterns (<a class="nav-link" href="https://github.com/clarinsi/STARK/blob/master/settings.md#--grew_match" title="Help"><span class="menu-title sr-only">Help</span></a>)</label>
<div class="input-field">
<div class="switch">
<label>
No
<input type="checkbox" name="grewmatch_patterns">
<span class="lever"></span>
Yes
</label>
</div>
</div>
<span class="helper-text" data-error="wrong" data-success="right">Map the structure of the trees to the grew-match formalism used by https://universal.grew.fr?</span>
</div>
</div>
</div>

@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
<title>Starter Template - Materialize</title>
<!-- CSS -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="/static/css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="/static/css/nouislider.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="/static/css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
</head>
<body>
<nav class="grey darken-2" role="navigation">
<div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">STARK</a>
<!-- <ul class="right hide-on-med-and-down">-->
<!-- <li><a href="#">Navbar Link</a></li>-->
<!-- </ul>-->
<!-- <ul id="nav-mobile" class="sidenav">-->
<!-- <li><a href="#">Navbar Link</a></li>-->
<!-- </ul>-->
<!-- <a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>-->
<ul id="nav-mobile" class="right hide-on-med-and-down">
<li><a href="/">Processing</a></li>
<li><a href="/about">About</a></li>
</ul>
</div>
</nav>
<div class="section no-pad-bot" id="index-banner">
<div class="container">
<!-- <br><br>-->
<!-- <h1 class="header center orange-text">Starter Template</h1>-->
<!-- <div class="row center">-->
<!-- <h5 class="header col s12 light">A modern responsive front-end framework based on Material Design</h5>-->
<!-- </div>-->
<!-- <div class="row center">-->
<!-- <a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light orange">Get Started</a>-->
<!-- </div>-->
<!-- <br><br>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="container">-->
<!-- <div class="section">-->
<!-- &lt;!&ndash; Icon Section &ndash;&gt;-->
<!-- <div class="row">-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">flash_on</i></h2>-->
<!-- <h5 class="center">Speeds up development</h5>-->
<!-- <p class="light">We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">group</i></h2>-->
<!-- <h5 class="center">User Experience Focused</h5>-->
<!-- <p class="light">By utilizing elements and principles of Material Design, we were able to create a framework that incorporates components and animations that provide more feedback to users. Additionally, a single underlying responsive system across all platforms allow for a more unified user experience.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col s12 m4">-->
<!-- <div class="icon-block">-->
<!-- <h2 class="center light-blue-text"><i class="material-icons">settings</i></h2>-->
<!-- <h5 class="center">Easy to work with</h5>-->
<!-- <p class="light">We have provided detailed documentation as well as specific code examples to help new users get started. We are also always open to feedback and can answer any questions a user may have about Materialize.</p>-->
<!-- </div>-->
<!-- </div>-->
</div>
</div>
<!-- <br><br>-->
<div class="container">
<br>
<div class="row">
<div class="col s12">
<form action="{{ url_for('result', result_id=request.view_args['result_id']) }}" method="POST" enctype="multipart/form-data" id="submit-form">
<button class="btn waves-effect waves-light btn-large" type="submit" name="action">Download complete results
<i class="material-icons right">download</i>
</button>
</form>
</div>
</div>
<!-- Your table with many columns -->
<div class="table-wrapper">
<table>
<thead>
<tr>
{% for head in head_row %}
{% if not head == 'Grew-match URL' %}
<th><span>{{ head }} </span><span class="th-desc">&#x25be;</span><span class="th-asc">&#x25b4;</span></th>
{% endif %}
{% endfor %}
</tr>
</thead>
<tbody>
{% for i in range(content['Tree']|length) %}
<tr {% if 'Grew-match URL' in content %} class="tr-link" data-href={{ content['Grew-match URL'][i] }} {% endif %}>
{% for col in content %}
{% if not col == 'Grew-match URL' %}
<td>{{ content[col][i] }}</td>
{% endif %}
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<footer class="page-footer light-blue">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">Credits</h5>
<p class="grey-text text-lighten-4">Add some logos here?</p>
</div>
</div>
</div>
<div class="footer-copyright">
<div class="container">
Made by <a class="orange-text text-lighten-3" href="http://materializecss.com">Materialize</a>
</div>
</div>
</footer>
<!-- Scripts-->
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="/static/js/materialize.js"></script>
<script src="/static/js/wNumb.js"></script>
<script src="/static/js/result.js"></script>
</body>
</html>
Loading…
Cancel
Save