@ -58,12 +58,13 @@
var _ui2 = _interopRequireDefault ( _ui ) ;
var _hotfixes = _ _webpack _require _ _ ( 5 ) ;
var _hotfixes = _ _webpack _require _ _ ( 13 ) ;
var _hotfixes2 = _interopRequireDefault ( _hotfixes ) ;
function _interopRequireDefault ( obj ) { return obj && obj . _ _esModule ? obj : { default : obj } ; }
_ _webpack _require _ _ ( 5 ) ;
_ _webpack _require _ _ ( 6 ) ;
_ _webpack _require _ _ ( 7 ) ;
_ _webpack _require _ _ ( 8 ) ;
@ -71,7 +72,6 @@
_ _webpack _require _ _ ( 10 ) ;
_ _webpack _require _ _ ( 11 ) ;
_ _webpack _require _ _ ( 12 ) ;
_ _webpack _require _ _ ( 13 ) ;
var main = {
changeEvent : function changeEvent ( e ) {
@ -105,46 +105,22 @@
main . updateUI ( ) ;
} ,
// DEPRECATED? 161120
// getRounds: (eventKey) => {
// const rounds = {};
//
// main.json.tourneys[eventKey].games.forEach(game => {
// const name = UI.getRoundName(main.json.rounds[game.rId]);
// if (rounds[name] === undefined) {
// rounds[name] = [];
// }
//
// rounds[name].push({
// id: game.rId,
// name: name,
// });
// });
//
// return rounds;
// },
getDuplicates : function getDuplicates ( eventKey ) {
var games = { } ;
getRounds : function getRounds ( eventKey ) {
var rounds = { } ;
main . json . tourneys [ eventKey ] . games . forEach ( function ( game ) {
var teams = [ game . t1 , game . t2 ] . sort ( ) ;
var addr = teams [ 0 ] + '-' + teams [ 1 ] ;
if ( games [ addr ] === undefined ) {
games [ addr ] = [ ] ;
var name = _ui2 . default . getRoundName ( main . json . rounds [ game . rId ] ) ;
if ( rounds [ name ] === undefined ) {
rounds [ name ] = [ ] ;
}
games [ addr ] . push ( game ) ;
rounds [ name ] . push ( {
id : game . rId ,
name : name
} ) ;
} ) ;
return Object . keys ( games ) . reduce ( function ( acc , k ) {
if ( games [ k ] . length > 1 ) {
acc . push ( games [ k ] ) ;
}
return acc ;
} , [ ] ) ;
return rounds ;
} ,
generateUI : function generateUI ( ) {
@ -159,103 +135,10 @@
updateUI : function updateUI ( ) {
var state = main . getState ( ) ;
var eventKey = state . eventKey ;
var matrix = _matrices2 . default . buildMatrix ( main . json , eventKey ) ;
var duplicates = main . getDuplicates ( eventKey ) ;
var tmp = _diagram2 . default . buildChords ( {
data : main . json ,
sort : state . sort ,
eventKey : eventKey ,
matrix : matrix ,
SORT _TYPES : _ui2 . default . SORT _TYPES
} ) ;
var getScore = function getScore ( game ) {
var s1 = game . s1 ;
var s2 = game . s2 ;
if ( game . sp1 !== null ) {
s1 = game . sp1 ;
} else if ( game . se1 !== null ) {
s1 = game . se1 ;
}
if ( game . sp2 !== null ) {
s2 = game . sp2 ;
} else if ( game . se2 !== null ) {
s2 = game . se2 ;
}
return { s1 : s1 , s2 : s2 } ;
} ;
var chords = tmp . reduce ( function ( acc , d ) {
var tSrc = main . json . tourneys [ eventKey ] . teams [ d . source . index ] . tId ;
var tTgt = main . json . tourneys [ eventKey ] . teams [ d . target . index ] . tId ;
d . game = main . json . tourneys [ eventKey ] . games . find ( function ( g ) {
return g . t1 === tSrc && g . t2 === tTgt || g . t1 === tTgt && g . t2 === tSrc ;
} ) ;
duplicates . forEach ( function ( games ) {
if ( games [ 0 ] === d . game || games [ 1 ] === d . game ) {
var gameNew = games [ 0 ] === d . game ? games [ 1 ] : games [ 0 ] ;
var sourceNew = Object . assign ( { } , d . source ) ;
var targetNew = Object . assign ( { } , d . target ) ;
var sourceAngle = d . source . endAngle - d . source . startAngle ;
var targetAngle = d . target . endAngle - d . target . startAngle ;
var _getScore = getScore ( games [ 0 ] ) ,
s1g0 = _getScore . s1 ,
s2g0 = _getScore . s2 ;
var _getScore2 = getScore ( games [ 1 ] ) ,
s1g1 = _getScore2 . s1 ,
s2g1 = _getScore2 . s2 ;
var totals = { src : 0 , tgt : 0 } ;
var offset = { src : 0 , tgt : 0 } ;
totals . src += games [ 0 ] . t1 === tSrc ? s1g0 : s2g0 ;
totals . tgt += games [ 0 ] . t1 === tTgt ? s1g0 : s2g0 ;
totals . src += games [ 1 ] . t1 === tSrc ? s1g1 : s2g1 ;
totals . tgt += games [ 1 ] . t1 === tTgt ? s1g1 : s2g1 ;
offset . src = games [ 0 ] . t1 === tSrc ? s1g0 : s2g0 ;
offset . tgt = games [ 0 ] . t1 === tTgt ? totals . tgt - s1g0 : totals . tgt - s2g0 ;
sourceNew . startAngle = d . source . startAngle + sourceAngle * ( offset . src / totals . src ) ;
d . source . endAngle = d . source . startAngle + sourceAngle * ( offset . src / totals . src ) ;
targetNew . endAngle = d . target . startAngle + targetAngle * ( offset . tgt / totals . tgt ) ;
d . target . startAngle = d . target . startAngle + targetAngle * ( offset . tgt / totals . tgt ) ;
acc . push ( { source : sourceNew , target : targetNew , game : gameNew } ) ;
}
} ) ;
acc . push ( d ) ;
return acc ;
} , [ ] ) ;
chords . groups = tmp . groups ;
var matrix = _matrices2 . default . buildMatrix ( main . json , state . eventKey ) ;
_diagram2 . default . clear ( ) ;
var color = _diagram2 . default . buildColorScheme ( {
scheme : parseInt ( state . scheme ) ,
len : main . json . tourneys [ state . eventKey ] . teams . length
} ) ;
var container = _diagram2 . default . buildContainer ( chords ) ;
_diagram2 . default . buildArcs ( { container : container , color : color , eventKey : eventKey , data : main . json } ) ;
_diagram2 . default . buildRibbons ( { container : container , color : color , chords : chords , eventKey : eventKey , data : main . json } ) ;
_diagram2 . default . build ( main . json , state . eventKey , state . sort , state . scheme , _ui2 . default . SORT _TYPES , matrix ) ;
_ui2 . default . updateTourneyPane ( state . eventKey ) ;
_ui2 . default . updateEventsPane ( state . eventKey ) ;
@ -267,7 +150,7 @@
fetch : function fetch ( url ) {
return new Promise ( function ( resolve , reject ) {
var listener = function listener ( _ref ) {
var req = _ref . targe t;
var req = _ref . srcElemen t;
req . status === 200 ? resolve ( req . responseText ) : reject ( "busted" ) ;
} ;
@ -384,8 +267,8 @@
s2 += g . s2 ;
}
matrix [ i1 ] [ i2 ] = s 1;
matrix [ i2 ] [ i1 ] = s 2;
matrix [ i1 ] [ i2 ] = g . s1 + g . se1 + g . sp 1;
matrix [ i2 ] [ i1 ] = g . s2 + g . se2 + g . sp 2;
} , [ ] ) ;
return matrix ;
@ -412,8 +295,6 @@
value : true
} ) ;
var _typeof = typeof Symbol === "function" && typeof Symbol . iterator === "symbol" ? function ( obj ) { return typeof obj ; } : function ( obj ) { return obj && typeof Symbol === "function" && obj . constructor === Symbol && obj !== Symbol . prototype ? "symbol" : typeof obj ; } ;
var _sorter = _ _webpack _require _ _ ( 3 ) ;
var _sorter2 = _interopRequireDefault ( _sorter ) ;
@ -541,81 +422,82 @@
return team . ga ;
} ,
buildChords : function buildChords ( _ref ) {
var matrix = _ref . matrix ,
data = _ref . data ,
eventKey = _ref . eventKey ,
sort = _ref . sort ,
SORT _TYPES = _ref . SORT _TYPES ;
build : function build ( data , eventKey , sort , scheme , SORT _TYPES , matrix ) {
var svg = d3 . select ( "svg" ) ,
width = svg . attr ( "width" ) ,
height = svg . attr ( "height" ) ,
outerArcThickness = 5 ,
outerRadius = Math . min ( width , height ) * 0.5 - 130 ,
innerRadius = outerRadius - outerArcThickness ;
var chords = d3 . chord ( ) . padAngle ( 0.05 ) . call ( null , matrix ) ;
var sortedChords = chords ;
switch ( sort ) {
case SORT _TYPES . COUNTRY :
return _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getCountryName . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
sortedChords = _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getCountryName . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
break ;
case SORT _TYPES . GOALS :
return _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getGoalsFor . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
sortedChords = _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getGoalsFor . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
break ;
case SORT _TYPES . POPULATION :
return _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getPopulation . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
sortedChords = _sorter2 . default . sort ( chords , 0 , chords . groups . length - 1 , Diagram . getPopulation . bind ( null , data , eventKey ) , Diagram . swapGroups . bind ( null , data , eventKey ) ) ;
break ;
}
return chords ;
} ,
buildDimensions : function buildDimensions ( ) {
var svgW = d3 . select ( "svg" ) . attr ( "width" ) ;
var svgH = d3 . select ( "svg" ) . attr ( "height" ) ;
var arcT = 5 ;
var outerR = Math . min ( svgW , svgH ) * 0.5 - 130 ;
var innerR = outerR - arcT ;
var arc = d3 . arc ( ) . innerRadius ( innerRadius ) . outerRadius ( outerRadius ) ;
return { svgW : svgW , svgH : svgH , arcT : arcT , outerR : outerR , innerR : innerR } ;
} ,
var ribbon = d3 . ribbon ( ) . radius ( innerRadius ) ;
buildColorScheme : function buildColorScheme ( _ref2 ) {
var scheme = _ref2 . scheme ,
len = _ref2 . len ;
var len = data . tourneys [ eventKey ] . teams . length ;
var color = d3 . scaleOrdinal ( d3 . schemeCategory20 ) ;
if ( scheme === 1 ) {
return d3 . scaleLinear ( ) . domain ( [ 0 , len ] ) . range ( [ "#fff" , "green" ] ) . interpolate ( d3 . interpolateRgb ) ;
} else if ( scheme === 2 ) {
var _ret = function ( ) {
( function ( ) {
switch ( parseInt ( scheme ) ) {
case 1 :
color = d3 . scaleLinear ( ) . domain ( [ 0 , len ] ) . range ( [ "#fff" , "green" ] ) . interpolate ( d3 . interpolateRgb ) ;
break ;
case 2 :
var colors = [ "#ffffd9" , "#edf8b1" , "#c7e9b4" , "#7fcdbb" , "#41b6c4" , "#1d91c0" , "#225ea8" , "#253494" , "#081d58" ] ;
return {
v : function v ( i ) {
color = function color ( i ) {
return colors [ i % colors . length ] ;
}
} ;
} ( ) ;
if ( ( typeof _ret === 'undefined' ? 'undefined' : _typeof ( _ret ) ) === "object" ) return _ret . v ;
} else if ( scheme === 3 ) {
return d3 . scaleLinear ( ) . domain ( [ 0 , len ] ) . range ( [ "red" , "blue" ] ) . interpolate ( d3 . interpolateRgb ) ;
} else if ( scheme === 4 ) {
return d3 . scaleOrdinal ( d3 . schemeCategory10 ) ;
break ;
case 3 :
color = d3 . scaleLinear ( ) . domain ( [ 0 , len ] ) . range ( [ "red" , "blue" ] ) . interpolate ( d3 . interpolateRgb ) ;
break ;
case 4 :
color = d3 . scaleOrdinal ( d3 . schemeCategory10 ) ;
break ;
}
} ) ( ) ;
return d3 . scaleOrdinal ( d3 . schemeCategory20 ) ;
} ,
var g = svg . append ( "g" ) . attr ( "transform" , "translate(" + width / 2 + "," + height / 2 + ")" ) . datum ( sortedChords ) ;
buildRibbons : function buildRibbons ( _ref3 ) {
var container = _ref3 . container ,
color = _ref3 . color ,
chords = _ref3 . chords ,
data = _ref3 . data ,
eventKey = _ref3 . eventKey ;
var group = g . append ( "g" ) . attr ( "class" , "groups" ) . selectAll ( "g" ) . data ( function ( chords ) {
return chords . groups ;
} ) . enter ( ) . append ( "g" ) ;
var dimensions = Diagram . buildDimensions ( ) ;
var ribbon = d3 . ribbon ( ) . radius ( dimensions . innerR ) ;
group . append ( "path" ) . style ( "fill" , function ( d ) {
return color ( d . index ) ;
} ) . style ( "stroke" , function ( d ) {
return d3 . rgb ( color ( d . index ) ) . darker ( ) ;
} ) . attr ( "d" , arc ) ;
container . append ( "g" ) . attr ( "class" , "ribbons" ) . selectAll ( "path" ) . data ( function ( chords ) {
g . append ( "g" ) . attr ( "class" , "ribbons" ) . selectAll ( "path" ) . data ( function ( chords ) {
return chords ;
} ) . enter ( ) . append ( "path" ) . attr ( "d" , ribbon ) . attr ( 'data-round-id' , function ( d ) {
return d . game . rId ;
} ) . style ( 'fill' , function ( d ) {
} ) . enter ( ) . append ( "path" ) . attr ( "d" , ribbon ) . attr ( "data-round-id" , function ( d ) {
var t1 = data . tourneys [ eventKey ] . teams [ d . source . index ] ;
var t2 = data . tourneys [ eventKey ] . teams [ d . target . index ] ;
var game = data . tourneys [ eventKey ] . games . find ( function ( v ) {
return ( v . t1 === t1 . tId || v . t1 === t2 . tId ) && ( v . t2 === t1 . tId || v . t2 === t2 . tId ) ;
} ) ;
return game . rId ;
} ) . style ( "fill" , function ( d ) {
return color ( d . target . index ) ;
} ) . style ( 'stroke' , function ( d ) {
} ) . style ( "stroke" , function ( d ) {
return d3 . rgb ( color ( d . target . index ) ) . darker ( ) ;
} ) . classed ( "ribbon" , true ) . append ( "title" ) . text ( function ( d ) {
var t1 = data . tourneys [ eventKey ] . teams [ d . source . index ] ;
@ -624,74 +506,60 @@
var c1 = data . countries [ t1 . cId ] ;
var c2 = data . countries [ t2 . cId ] ;
var s1 = d . game . t1 === t1 . tId ? d . game . s1 : d . game . s2 ;
var s2 = d . game . t2 === t2 . tId ? d . game . s2 : d . game . s1 ;
var game = data . tourneys [ eventKey ] . games . find ( function ( v ) {
return ( v . t1 === t1 . tId || v . t1 === t2 . tId ) && ( v . t2 === t1 . tId || v . t2 === t2 . tId ) ;
} ) ;
var s1 = game . t1 === t1 . tId ? game . s1 : game . s2 ;
var s2 = game . t2 === t2 . tId ? game . s2 : game . s1 ;
if ( d . game . sp1 !== null && d . game . sp2 !== null ) {
s1 = d . game . t1 === t1 . tId ? d . game . sp1 : d . game . sp2 ;
s2 = d . game . t2 === t2 . tId ? d . game . sp2 : d . game . sp1 ;
if ( game . sp1 !== null && game . sp2 !== null ) {
s1 = game . t1 === t1 . tId ? game . sp1 : game . sp2 ;
s2 = game . t2 === t2 . tId ? game . sp2 : game . sp1 ;
s1 += " (Penalties)" ;
s2 += " (Penalties)" ;
} else if ( d . game . se1 !== null && d . game . se2 !== null ) {
s1 = d . game . t1 === t1 . tId ? d . game . se1 : d . game . se2 ;
s2 = d . game . t2 === t2 . tId ? d . game . se2 : d . game . se1 ;
} else if ( game . se1 !== null && game . se2 !== null ) {
s1 = game . t1 === t1 . tId ? game . se1 : game . se2 ;
s2 = game . t2 === t2 . tId ? game . se2 : game . se1 ;
s1 += " (Extended time)" ;
s2 += " (Extended time)" ;
}
return c1 + ': ' + s1 + '\n' + c2 + ': ' + s2 + '\n' + data . rounds [ d . game . rId ] ;
} ) ;
} ,
buildArcs : function buildArcs ( _ref4 ) {
var container = _ref4 . container ,
color = _ref4 . color ,
eventKey = _ref4 . eventKey ,
data = _ref4 . data ;
var dimensions = Diagram . buildDimensions ( ) ;
var arc = d3 . arc ( ) . innerRadius ( dimensions . innerR ) . outerRadius ( dimensions . outerR ) ;
var group = container . append ( "g" ) . attr ( "class" , "groups" ) . selectAll ( "g" ) . data ( function ( chords ) {
return chords . groups ;
} ) . enter ( ) . append ( "g" ) ;
// const s1 = game.t1 === t1.tId ? game.s1 : game.s2;
// const s2 = game.t2 === t2.tId ? game.s2 : game.s1;
//
// const e1 = game.se1 ? `(+${game.se1} in extended time)` : '';
// const e2 = game.se2 ? `(+${game.se2} in extended time)` : '';
//
// const p1 = game.sp1 ? `(+${game.sp1} in penalties)` : '';
// const p2 = game.sp2 ? `(+${game.sp2} in penalties)` : '';
group . append ( "path" ) . style ( "fill" , function ( d ) {
return color ( d . index ) ;
} ) . style ( "stroke" , function ( d ) {
return d3 . rgb ( color ( d . index ) ) . darker ( ) ;
} ) . attr ( "d" , arc ) ;
return c1 + ': ' + s1 + '\n' + c2 + ': ' + s2 + '\n' + data . rounds [ game . rId ] ;
} ) ;
group . append ( "text" ) . each ( function ( d ) {
d . angle = ( d . startAngle + d . endAngle ) / 2 ;
} ) . attr ( "dy" , ".35em" ) . attr ( "transform" , function ( d ) {
return "rotate(" + ( d . angle * 180 / Math . PI - 91 ) + ")" + "translate(" + ( dimensions . innerR + 26 ) + ")" + ( d . angle > Math . PI ? "rotate(180)" : "" ) ;
return "rotate(" + ( d . angle * 180 / Math . PI - 91 ) + ")" + "translate(" + ( innerRadius + 26 ) + ")" + ( d . angle > Math . PI ? "rotate(180)" : "" ) ;
} ) . style ( "text-anchor" , function ( d ) {
return d . angle > Math . PI ? "end" : null ;
} ) . text ( function ( d ) {
var team = data . tourneys [ eventKey ] . teams [ d . index ] ;
var metric = '' ;
// switch (sort) {
// case SORT_TYPES.GOALS:
// metric = `(${team.gf})`;
switch ( sort ) {
case SORT _TYPES . GOALS :
metric = '(' + team . gf + ')' ;
break ;
// case SORT_TYPES.POPULATION:
// metric = `(${Number(team.p).toLocaleString()})`;
// break;
// // case SORT_TYPES.POPULATION:
// // metric = `(${Number(team.p).toLocaleString()})`;
// // break;
// }
}
return data . countries [ team . cId ] + ' ' + metric ;
} ) ;
} ,
buildContainer : function buildContainer ( chords ) {
var svg = d3 . select ( "svg" ) ;
var dimensions = Diagram . buildDimensions ( ) ;
return svg . append ( "g" ) . attr ( "transform" , 'translate(' + dimensions . svgW / 2 + ',' + dimensions . svgH / 2 + ')' ) . datum ( chords ) ;
}
} ;
@ -1132,6 +1000,54 @@
/***/ } ,
/* 5 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 6 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 7 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 8 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 9 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 10 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 11 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 12 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 13 */
/***/ function ( module , exports ) {
"use strict" ;
@ -1206,53 +1122,5 @@
exports . default = hotfixes ;
/***/ } ,
/* 6 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 7 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 8 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 9 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 10 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 11 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 12 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ } ,
/* 13 */
/***/ function ( module , exports ) {
// removed by extract-text-webpack-plugin
/***/ }
/******/ ] ) ;
