Ignore:
Timestamp:
02/12/15 13:09:57 (9 years ago)
Author:
emanuel.dima@uni-tuebingen.de
Message:
  1. alpha 19: better UI for statistics, misc bugfixes
File:
1 edited

Legend:

Unmodified
Added
Removed

  • SRUAggregator/trunk/src/main/resources/assets/js/main.jsx

    r5960 r5971  
    22(function() {
    33"use strict";
     4
     5var VERSION = "VERSION 2.0.0.α19";
    46
    57var PT = React.PropTypes;
    … …  
    195197        },
    196198
    197         renderEndpoint: function(endpoint) {
     199        renderCollections: function(colls) {
     200                return  <div style={{marginLeft:40}}>
     201                                        { colls.length === 0 ?
     202                                                <div style={{color:"#a94442"}}>NO collections found</div>
     203                                                :
     204                                                <div>
     205                                                        {colls.length} root collection(s):
     206                                                        <ul className='list-unstyled' style={{marginLeft:40}}>
     207                                                                { colls.map(function(name) { return <div>{name}</div>; }) }
     208                                                        </ul>
     209                                                </div>
     210                                        }
     211                                </div>;
     212        },
     213
     214        renderDiagnostic: function(d) {
     215                return  <div key={d.diagnostic.uri}>
     216                                        <div className="inline alert alert-warning">
     217                                                <div>Diagnostic: {d.diagnostic.message}: {d.diagnostic.diagnostic}</div>
     218                                                <div>Context: <a href={d.context}>{d.context}</a></div>
     219                                        </div>
     220                                        {" "}
     221                                        <div className="inline"><span className="badge">x {d.counter}</span></div>
     222                                </div>;
     223        },
     224
     225        renderError: function(e) {
     226                var xc = e.exception;
     227                return  <div key={xc.message}>
     228                                        <div className="inline alert alert-danger" role="alert">
     229                                                <div>Exception: {xc.message}</div>
     230                                                <div>Context: <a href={e.context}>{e.context}</a></div>
     231                                                { xc.cause ? <div>Caused by: {xc.cause}</div> : false}
     232                                        </div>
     233                                        {" "}
     234                                        <div className="inline"><span className="badge">x {e.counter}</span></div>
     235                                </div>;
     236        },
     237
     238        renderEndpoint: function(isScan, endpoint) {
    198239                var stat = endpoint[1];
    199                 var errors = _.pairs(stat.errors);
     240                var errors = _.values(stat.errors);
    200241                var diagnostics = _.values(stat.diagnostics);
    201                 return <div>
    202                                         <ul className='list-inline list-unstyled'>
     242                return <div style={{marginTop:10}}>
     243                                        <ul className='list-inline list-unstyled' style={{marginBottom:0}}>
    203244                                                <li>
    204245                                                        { stat.version == "LEGACY" ?
    205246                                                                <span style={{color:'#a94442'}}>legacy <i className="glyphicon glyphicon-thumbs-down"></i> </span>
    206                                                                 : false}
     247                                                                : <span style={{color:'#3c763d'}}><i className="glyphicon glyphicon-thumbs-up"></i> </span>
     248                                                        }
    207249                                                        { " "+endpoint[0] }:
    208250                                                </li>
    … …  
    213255                                                </li>
    214256                                        </ul>
     257                                        { isScan ? this.renderCollections(stat.rootCollections) : false }
    215258                                        {       (errors && errors.length) ?
    216                                                 <ul className='list-unstyled inline' style={{marginLeft:40}}>
    217                                                         { errors.map(function(e) {
    218                                                                 return  <div >
    219                                                                                         <div className="inline alert alert-danger"> Exception: {e[0]}</div>
    220                                                                                         {" "}
    221                                                                                         <div className="inline"><span className="badge">x {e[1]}</span></div>
    222                                                                                 </div>;
    223                                                           }) }
    224                                                 </ul> : false
     259                                                <div className='inline' style={{marginLeft:40}}>
     260                                                        { errors.map(this.renderError) }
     261                                                </div> : false
    225262                                        }
    226263                                        {       (diagnostics && diagnostics.length) ?
    227                                                 <ul className='list-unstyled inline' style={{marginLeft:40}}>
    228                                                         { diagnostics.map(function(d) {
    229                                                                 return  <div >
    230                                                                                         <div className="inline alert alert-warning">
    231                                                                                                 Diagnostic: {d.diagnostic.dgnMessage}: {d.diagnostic.dgnDiagnostic}
    232                                                                                         </div>
    233                                                                                         {" "}
    234                                                                                         <div className="inline"><span className="badge">x {d.counter}</span></div>
    235                                                                                 </div>;
    236                                                           }) }
    237                                                 </ul> : false
     264                                                <div className='inline' style={{marginLeft:40}}>
     265                                                        { diagnostics.map(this.renderDiagnostic) }
     266                                                </div> : false
    238267                                        }
    239268                                </div>;
    240269        },
    241270
    242         renderInstitution: function(inst) {
     271        renderInstitution: function(isScan, inst) {
    243272                return  <div style={{marginBottom:30}}>
    244273                                        <h4>{inst[0]}</h4>
    245                                         <div style={{marginLeft:20}}> {_.pairs(inst[1]).map(this.renderEndpoint) }</div>
     274                                        <div style={{marginLeft:20}}> {_.pairs(inst[1]).map(this.renderEndpoint.bind(this, isScan)) }</div>
    246275                                </div>;
    247276        },
    248277
    249         renderStatistics: function(stats) {
     278        renderStatistics: function(isScan, stats) {
    250279                return  <div className="container">
    251280                                        <ul className='list-inline list-unstyled'>
    … …  
    262291                                                <li>timeout:{" "}<kbd>{stats.timeout} seconds</kbd></li>
    263292                                        </ul>
    264                                         <div> { _.pairs(stats.institutions).map(this.renderInstitution) } </div>
     293                                        <div> { _.pairs(stats.institutions).map(this.renderInstitution.bind(this, isScan)) } </div>
    265294                                </div>
    266295                                 ;
    … …  
    273302                                        <h1>Statistics</h1>
    274303                                        <h2>Last scan</h2>
    275                                         {this.renderStatistics(this.state.lastScanStats)}
     304                                        {this.renderStatistics(true, this.state.lastScanStats)}
    276305                                        <h2>Searches since last scan</h2>
    277                                         {this.renderStatistics(this.state.searchStats)}
     306                                        {this.renderStatistics(false, this.state.searchStats)}
    278307                                </div>
    279308                        </div>
    … …  
    414443                                                <a title="about" href="#" onClick={this.about}>
    415444                                                <span className="glyphicon glyphicon-info-sign"></span>
    416                                                 <span>VERSION 2.0.0.α16</span>
     445                                                <span>{VERSION}</span>
    417446                                        </a>
    418447                                </div>
Note: See TracChangeset for help on using the changeset viewer.