<TxtInput id={this.props.id+'-input'} name="Provider" placeholder="Put your provider here" tips="Add your own cost calculation here" onChange={this.handleProviderChange}
class={this.classtxt(this.state.ProviderError)} Prepend="" InvalidMessage="Please provide a Provider"/>
</div>
<div className="col-3">
<TxtInput id={this.props.id+'-input'} name="Service" placeholder="Put your service here" tips="Add your own cost calculation here" onChange={this.handleServiceChange}
class={this.classtxt(this.state.ServiceError)} Prepend="" InvalidMessage="Please provide a Service"/>
</div>
<div className="col-3">
<TxtInput id={this.props.id+'-input'} name="Cost" placeholder="Put your cost here" tips="Add your own cost calculation here" onChange={this.handleChange}
class={this.classtxt(this.state.CostError)} Prepend={MainData.Currency} InvalidMessage="Please provide a correct numerical value" />
</div>
</div>
);
}
}
// Combine plugins
// ---------------------
// ---------------------
class ProviderPluginsSelector extends React.Component {
This tool is divided by categories (for example Activate storage). Click
on the category name, and it will expand.
</dd>
</dl>
<dl className="row">
<dt className="col-sm-3">Providers</dt>
<dd className="col-sm-9">
<p>
Providers can be chosen from the <mark>Select a provider box</mark>. You can then tune your setting for this provider to fit your needs.
</p>
<p>
If the provider you want is not registered, you can add it manually with <mark>Provide your own provider</mark> and then enter your provider/service and cost.
</p>
</dd>
</dl>
<dl className="row">
<dt className="col-sm-3">Add or Remove Line</dt>
<dd className="col-sm-9">
<p>If you want to add a new provider use the <ButtonInput className="btn-success btn-sm" id="plugins-add-btn" name={<img className="img-fluid" src="icons\plus.png" width="20"/>}
tips={"Add a new category"} onClick={this.fctnull}/> button.
</p>
<p>
You can also remove a provider with <ButtonInput className="btn-danger btn-sm" id="plugins-add-btn"
<h1 className="display-4"> EPFL Library <br/>Cost Calculator for Data Management</h1>
</div>
<div className="col">
<p className="lead">
Welcome to our cost calculator this tool will help researcher/professor to have an
estimate of the cost of managing, storing and publishing data.
</p>
<p className="lead">
Many providers are included in the service and you will be able to calculate a cost
based on your needs. Total cost is calculated dynamically based on your inputs.
</p>
<p className="lead">
We hope you will enjoy this tool and it will be useful for you.
</p>
<ButtonInput class="btn btn-primary" id="head-howto" name="To Know More (HOWTO)" onClick={this.move2howto}/>
<a className="btn btn-danger" id="head-help" target="_blank" href={MainData.HelpUrl} ><img src="./icons/help.png" width="20"/> I need help with my DMP</a>
<p>This service has been developed by the <a href="https://researchdata.epfl.ch">Resarch Data Management Team</a> of the <a href="https://library.epfl.ch">EPFL Library</a> <br/>
This software is publish under CC0 and your are using <strong> Version {MainData.Version}</strong><br/>
Source code can be download <a href="https://c4science.ch/source/costcalc/">here</a></p>
<p><small>Icons are from the Noun Project (Book by Randi NI, Storage by I Pitu, Database by Novalyi, data cloud by Vectors Market, Information by Gregor Cresnar)</small></p>