diff --git a/README.md b/README.md index 2fe7a26..61a8697 100644 --- a/README.md +++ b/README.md @@ -23,3 +23,23 @@ The files will be generated in the dist folder (iwmlib.js and iwmlib.pixi.js). I To build the 3rd party library type `npm run 3rdparty` + +## Docs + +To create the documentation in the folder ./doc/out type `npm run jsdoc` + +Afterwards you can view the documentation here: + +- The iwmlib [DocTests](./lib/index.html) +- The iwmlib [PixiJS DocTests](./lib/pixi/index.html) + +## Useful PixiJS Resources + +- The PixiJS [JavaScript API Docs](http://pixijs.download/dev/docs/index.html) +- The PixiJS [Examples](http://pixijs.github.io/examples/#/basics/basic.js) +- The PixiJS [GitHub Repository](https://github.com/pixijs/pixi.js) + +## List of 3rd party libraries included + +- [PixiJS](http://www.pixijs.com) +- [Greensock](https://greensock.com) with TweenLite diff --git a/css/doctest.css b/css/doctest.css new file mode 100644 index 0000000..db2f0eb --- /dev/null +++ b/css/doctest.css @@ -0,0 +1,71 @@ +html +{ + padding: 0px; + font-size: 16px; + background: white; + font-family: Arial,sans-serif; + color: #000; + max-width: 932px; + margin:0 auto; +} + +.grayBorder { + border: 1px solid lightgray; +} + +.insetPadding { + padding: 16px; +} + +.interactive { + /*** For regions observed by InteraktionDelegates and -Mappers ***/ + -ms-content-zooming: none; + touch-action: none; +} + +.unselectable { + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + user-select: none; +} + +body { + padding: 16px; +} + +canvas { + -ms-content-zooming: none; /** Crucial for MS Edge pointer events **/ + touch-action: none; /** Crucial for MS Edge? **/ +} + +#runtime-errors { + left: -8px; + margin-left: 8px; +} + + +.intrinsic-container { + position: relative; + height: 0; + overflow: hidden; +} + +/* 16x9 Aspect Ratio */ +.intrinsic-container-16x9 { + padding-bottom: 56.25%; +} + +/* 4x3 Aspect Ratio */ +.intrinsic-container-4x3 { + padding-bottom: 75%; +} + +.intrinsic-container iframe { + position: absolute; + border: 0; + top:0; + left: 0; + width: 100%; + height: 100%; +} diff --git a/doc/README.md b/doc/README.md new file mode 100644 index 0000000..247e578 --- /dev/null +++ b/doc/README.md @@ -0,0 +1,23 @@ +# IWM Browser JavaScript API + +## IWM Browser Classes + +This is the JavaScript API documentation of the IWM Browser JavaScript classes. + +## Useful IWM Browser Resources + +- The IWM Browser [Homepage](../../index.html) +- The IWM Browser [DocTests](../../lib/index.html) +- The IWM Browser [PixiJS DocTests](../../lib/pixi/index.html) + +## Useful PixiJS Resources + +- The PixiJS [JavaScript API Docs](http://pixijs.download/dev/docs/index.html) +- The PixiJS [Examples](http://pixijs.github.io/examples/#/basics/basic.js) +- The PixiJS [GitHub Repository](https://github.com/pixijs/pixi.js) + +## List of 3rd party libraries included + +- [PixiJS](http://www.pixijs.com) +- [Greensock](https://greensock.com) with all Plugins +- [D3](https://d3js.org) diff --git a/doc/ast.html b/doc/ast.html new file mode 100644 index 0000000..fc06f6d --- /dev/null +++ b/doc/ast.html @@ -0,0 +1,174 @@ + + + + + + + + + \ No newline at end of file diff --git a/doc/conf.json b/doc/conf.json new file mode 100644 index 0000000..ab4786b --- /dev/null +++ b/doc/conf.json @@ -0,0 +1,72 @@ +{ + "plugins": [ + "plugins/markdown", + "./jsdoc-fix" + ], + "recurseDepth": 10, + "opts": { + "template": "./node_modules/@pixi/jsdoc-template", + "encoding": "utf8", + "destination": "./doc/out/", + "recurse": true, + "readme": "./doc/README.md", + "private": false, + "lenient": true + }, + "source": { + "include": [ + "./lib/uitest.js", + "./lib/pixi/abstractpopup.js", + "./lib/pixi/app.js", + "./lib/pixi/badge.js", + "./lib/pixi/blurfilter.js", + "./lib/pixi/button.js", + "./lib/pixi/buttongroup.js", + "./lib/pixi/message.js", + "./lib/pixi/deepzoom/image.js", + "./lib/pixi/flippable.js", + "./lib/pixi/labeledgraphics.js", + "./lib/pixi/list.js", + "./lib/pixi/modal.js", + "./lib/pixi/popup.js", + "./lib/pixi/popupmenu.js", + "./lib/pixi/progress.js", + "./lib/pixi/slider.js", + "./lib/pixi/switch.js", + "./lib/pixi/theme.js", + "./lib/pixi/tooltip.js", + "./lib/pixi/volatile.js" + ], + "exclude": [], + "includePattern": ".+\\.js(doc|x)?$", + "excludePattern": "(^|\\/|\\\\)_" + }, + "sourceType": "module", + "tags": { + "allowUnknownTags": true, + "dictionaries": ["jsdoc", "closure"] + }, + "templates": { + "applicationName": "iwmlib", + "disqus": "", + "googleAnalytics": "", + "openGraph": { + "title": "iwmlib API Documentation", + "type": "website", + "image": "", + "site_name": "", + "url": "https://www.iwm-tuebingen.de" + }, + "meta": { + "title": "iwmlib API Documentation", + "description": "The IWM Browser: One Browser for all apps.", + "keyword": "" + }, + "linenums": true, + "cleverlinks": true, + "default": { + "outputSourceFiles": true, + "useLongnameInNav": false + } + } +} diff --git a/doc/events.json b/doc/events.json new file mode 100644 index 0000000..b8018dd --- /dev/null +++ b/doc/events.json @@ -0,0 +1,5192 @@ +{ + "type": "Program", + "start": 0, + "end": 5750, + "range": [0, 5750], + "body": [{ + "type": "ClassDeclaration", + "start": 1, + "end": 5682, + "range": [1, 5682], + "id": { + "type": "Identifier", + "start": 7, + "end": 13, + "range": [7, 13], + "name": "Events" + }, + "superClass": null, + "body": { + "type": "ClassBody", + "start": 14, + "end": 5682, + "range": [14, 5682], + "body": [{ + "type": "MethodDefinition", + "start": 21, + "end": 468, + "range": [21, 468], + "computed": false, + "key": { + "type": "Identifier", + "start": 28, + "end": 39, + "range": [28, 39], + "name": "isMouseDown" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 39, + "end": 468, + "range": [39, 468], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 40, + "end": 45, + "range": [40, 45], + "name": "event" + }], + "body": { + "type": "BlockStatement", + "start": 47, + "end": 468, + "range": [47, 468], + "body": [{ + "type": "IfStatement", + "start": 327, + "end": 418, + "range": [327, 418], + "test": { + "type": "CallExpression", + "start": 331, + "end": 372, + "range": [331, 372], + "callee": { + "type": "MemberExpression", + "start": 331, + "end": 342, + "range": [331, 342], + "object": { + "type": "Identifier", + "start": 331, + "end": 338, + "range": [331, 338], + "name": "Reflect" + }, + "property": { + "type": "Identifier", + "start": 339, + "end": 342, + "range": [339, 342], + "name": "has" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 343, + "end": 348, + "range": [343, 348], + "name": "event" + }, { + "type": "Literal", + "start": 350, + "end": 371, + "range": [350, 371], + "value": "mouseDownSubstitute", + "raw": "'mouseDownSubstitute'" + }] + }, + "consequent": { + "type": "ReturnStatement", + "start": 386, + "end": 418, + "range": [386, 418], + "argument": { + "type": "MemberExpression", + "start": 393, + "end": 418, + "range": [393, 418], + "object": { + "type": "Identifier", + "start": 393, + "end": 398, + "range": [393, 398], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 399, + "end": 418, + "range": [399, 418], + "name": "mouseDownSubstitute" + }, + "computed": false + } + }, + "alternate": null + }, { + "type": "ReturnStatement", + "start": 427, + "end": 462, + "range": [427, 462], + "argument": { + "type": "LogicalExpression", + "start": 434, + "end": 462, + "range": [434, 462], + "left": { + "type": "MemberExpression", + "start": 434, + "end": 447, + "range": [434, 447], + "object": { + "type": "Identifier", + "start": 434, + "end": 439, + "range": [434, 439], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 440, + "end": 447, + "range": [440, 447], + "name": "buttons" + }, + "computed": false + }, + "operator": "||", + "right": { + "type": "MemberExpression", + "start": 451, + "end": 462, + "range": [451, 462], + "object": { + "type": "Identifier", + "start": 451, + "end": 456, + "range": [451, 456], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 457, + "end": 462, + "range": [457, 462], + "name": "which" + }, + "computed": false + } + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 474, + "end": 996, + "range": [474, 996], + "computed": false, + "key": { + "type": "Identifier", + "start": 481, + "end": 495, + "range": [481, 495], + "name": "extractTouches" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 495, + "end": 996, + "range": [495, 996], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 496, + "end": 503, + "range": [496, 503], + "name": "targets" + }], + "body": { + "type": "BlockStatement", + "start": 505, + "end": 996, + "range": [505, 996], + "body": [{ + "type": "VariableDeclaration", + "start": 515, + "end": 531, + "range": [515, 531], + "declarations": [{ + "type": "VariableDeclarator", + "start": 519, + "end": 531, + "range": [519, 531], + "id": { + "type": "Identifier", + "start": 519, + "end": 526, + "range": [519, 526], + "name": "touches" + }, + "init": { + "type": "ArrayExpression", + "start": 529, + "end": 531, + "range": [529, 531], + "elements": [] + } + }], + "kind": "let" + }, { + "type": "ForStatement", + "start": 540, + "end": 967, + "range": [540, 967], + "init": { + "type": "VariableDeclaration", + "start": 545, + "end": 552, + "range": [545, 552], + "declarations": [{ + "type": "VariableDeclarator", + "start": 549, + "end": 552, + "range": [549, 552], + "id": { + "type": "Identifier", + "start": 549, + "end": 550, + "range": [549, 550], + "name": "i" + }, + "init": { + "type": "Literal", + "start": 551, + "end": 552, + "range": [551, 552], + "value": 0, + "raw": "0" + } + }], + "kind": "let" + }, + "test": { + "type": "BinaryExpression", + "start": 554, + "end": 570, + "range": [554, 570], + "left": { + "type": "Identifier", + "start": 554, + "end": 555, + "range": [554, 555], + "name": "i" + }, + "operator": "<", + "right": { + "type": "MemberExpression", + "start": 556, + "end": 570, + "range": [556, 570], + "object": { + "type": "Identifier", + "start": 556, + "end": 563, + "range": [556, 563], + "name": "targets" + }, + "property": { + "type": "Identifier", + "start": 564, + "end": 570, + "range": [564, 570], + "name": "length" + }, + "computed": false + } + }, + "update": { + "type": "UpdateExpression", + "start": 572, + "end": 575, + "range": [572, 575], + "operator": "++", + "prefix": false, + "argument": { + "type": "Identifier", + "start": 572, + "end": 573, + "range": [572, 573], + "name": "i" + } + }, + "body": { + "type": "BlockStatement", + "start": 577, + "end": 967, + "range": [577, 967], + "body": [{ + "type": "VariableDeclaration", + "start": 591, + "end": 609, + "range": [591, 609], + "declarations": [{ + "type": "VariableDeclarator", + "start": 595, + "end": 609, + "range": [595, 609], + "id": { + "type": "Identifier", + "start": 595, + "end": 596, + "range": [595, 596], + "name": "t" + }, + "init": { + "type": "MemberExpression", + "start": 599, + "end": 609, + "range": [599, 609], + "object": { + "type": "Identifier", + "start": 599, + "end": 606, + "range": [599, 606], + "name": "targets" + }, + "property": { + "type": "Identifier", + "start": 607, + "end": 608, + "range": [607, 608], + "name": "i" + }, + "computed": true + } + }], + "kind": "let" + }, { + "type": "ExpressionStatement", + "start": 622, + "end": 957, + "range": [622, 957], + "expression": { + "type": "CallExpression", + "start": 622, + "end": 957, + "range": [622, 957], + "callee": { + "type": "MemberExpression", + "start": 622, + "end": 634, + "range": [622, 634], + "object": { + "type": "Identifier", + "start": 622, + "end": 629, + "range": [622, 629], + "name": "touches" + }, + "property": { + "type": "Identifier", + "start": 630, + "end": 634, + "range": [630, 634], + "name": "push" + }, + "computed": false + }, + "arguments": [{ + "type": "ObjectExpression", + "start": 635, + "end": 956, + "range": [635, 956], + "properties": [{ + "type": "Property", + "start": 653, + "end": 692, + "range": [653, 692], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 653, + "end": 667, + "range": [653, 667], + "name": "targetSelector" + }, + "value": { + "type": "CallExpression", + "start": 669, + "end": 692, + "range": [669, 692], + "callee": { + "type": "MemberExpression", + "start": 669, + "end": 682, + "range": [669, 682], + "object": { + "type": "ThisExpression", + "start": 669, + "end": 673, + "range": [669, 673] + }, + "property": { + "type": "Identifier", + "start": 674, + "end": 682, + "range": [674, 682], + "name": "selector" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 683, + "end": 691, + "range": [683, 691], + "object": { + "type": "Identifier", + "start": 683, + "end": 684, + "range": [683, 684], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 685, + "end": 691, + "range": [685, 691], + "name": "target" + }, + "computed": false + }] + }, + "kind": "init" + }, { + "type": "Property", + "start": 710, + "end": 734, + "range": [710, 734], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 710, + "end": 720, + "range": [710, 720], + "name": "identifier" + }, + "value": { + "type": "MemberExpression", + "start": 722, + "end": 734, + "range": [722, 734], + "object": { + "type": "Identifier", + "start": 722, + "end": 723, + "range": [722, 723], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 724, + "end": 734, + "range": [724, 734], + "name": "identifier" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 752, + "end": 770, + "range": [752, 770], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 752, + "end": 759, + "range": [752, 759], + "name": "screenX" + }, + "value": { + "type": "MemberExpression", + "start": 761, + "end": 770, + "range": [761, 770], + "object": { + "type": "Identifier", + "start": 761, + "end": 762, + "range": [761, 762], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 763, + "end": 770, + "range": [763, 770], + "name": "screenX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 788, + "end": 806, + "range": [788, 806], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 788, + "end": 795, + "range": [788, 795], + "name": "screenY" + }, + "value": { + "type": "MemberExpression", + "start": 797, + "end": 806, + "range": [797, 806], + "object": { + "type": "Identifier", + "start": 797, + "end": 798, + "range": [797, 798], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 799, + "end": 806, + "range": [799, 806], + "name": "screenY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 824, + "end": 842, + "range": [824, 842], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 824, + "end": 831, + "range": [824, 831], + "name": "clientX" + }, + "value": { + "type": "MemberExpression", + "start": 833, + "end": 842, + "range": [833, 842], + "object": { + "type": "Identifier", + "start": 833, + "end": 834, + "range": [833, 834], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 835, + "end": 842, + "range": [835, 842], + "name": "clientX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 860, + "end": 878, + "range": [860, 878], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 860, + "end": 867, + "range": [860, 867], + "name": "clientY" + }, + "value": { + "type": "MemberExpression", + "start": 869, + "end": 878, + "range": [869, 878], + "object": { + "type": "Identifier", + "start": 869, + "end": 870, + "range": [869, 870], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 871, + "end": 878, + "range": [871, 878], + "name": "clientY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 896, + "end": 910, + "range": [896, 910], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 896, + "end": 901, + "range": [896, 901], + "name": "pageX" + }, + "value": { + "type": "MemberExpression", + "start": 903, + "end": 910, + "range": [903, 910], + "object": { + "type": "Identifier", + "start": 903, + "end": 904, + "range": [903, 904], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 905, + "end": 910, + "range": [905, 910], + "name": "pageX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 928, + "end": 942, + "range": [928, 942], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 928, + "end": 933, + "range": [928, 933], + "name": "pageY" + }, + "value": { + "type": "MemberExpression", + "start": 935, + "end": 942, + "range": [935, 942], + "object": { + "type": "Identifier", + "start": 935, + "end": 936, + "range": [935, 936], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 937, + "end": 942, + "range": [937, 942], + "name": "pageY" + }, + "computed": false + }, + "kind": "init" + }] + }] + } + }] + } + }, { + "type": "ReturnStatement", + "start": 976, + "end": 990, + "range": [976, 990], + "argument": { + "type": "Identifier", + "start": 983, + "end": 990, + "range": [983, 990], + "name": "touches" + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 1002, + "end": 1449, + "range": [1002, 1449], + "computed": false, + "key": { + "type": "Identifier", + "start": 1009, + "end": 1024, + "range": [1009, 1024], + "name": "createTouchList" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 1024, + "end": 1449, + "range": [1024, 1449], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 1025, + "end": 1032, + "range": [1025, 1032], + "name": "targets" + }], + "body": { + "type": "BlockStatement", + "start": 1034, + "end": 1449, + "range": [1034, 1449], + "body": [{ + "type": "VariableDeclaration", + "start": 1044, + "end": 1060, + "range": [1044, 1060], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1048, + "end": 1060, + "range": [1048, 1060], + "id": { + "type": "Identifier", + "start": 1048, + "end": 1055, + "range": [1048, 1055], + "name": "touches" + }, + "init": { + "type": "ArrayExpression", + "start": 1058, + "end": 1060, + "range": [1058, 1060], + "elements": [] + } + }], + "kind": "let" + }, { + "type": "ForStatement", + "start": 1069, + "end": 1402, + "range": [1069, 1402], + "init": { + "type": "VariableDeclaration", + "start": 1074, + "end": 1081, + "range": [1074, 1081], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1078, + "end": 1081, + "range": [1078, 1081], + "id": { + "type": "Identifier", + "start": 1078, + "end": 1079, + "range": [1078, 1079], + "name": "i" + }, + "init": { + "type": "Literal", + "start": 1080, + "end": 1081, + "range": [1080, 1081], + "value": 0, + "raw": "0" + } + }], + "kind": "let" + }, + "test": { + "type": "BinaryExpression", + "start": 1083, + "end": 1099, + "range": [1083, 1099], + "left": { + "type": "Identifier", + "start": 1083, + "end": 1084, + "range": [1083, 1084], + "name": "i" + }, + "operator": "<", + "right": { + "type": "MemberExpression", + "start": 1085, + "end": 1099, + "range": [1085, 1099], + "object": { + "type": "Identifier", + "start": 1085, + "end": 1092, + "range": [1085, 1092], + "name": "targets" + }, + "property": { + "type": "Identifier", + "start": 1093, + "end": 1099, + "range": [1093, 1099], + "name": "length" + }, + "computed": false + } + }, + "update": { + "type": "UpdateExpression", + "start": 1101, + "end": 1104, + "range": [1101, 1104], + "operator": "++", + "prefix": false, + "argument": { + "type": "Identifier", + "start": 1101, + "end": 1102, + "range": [1101, 1102], + "name": "i" + } + }, + "body": { + "type": "BlockStatement", + "start": 1106, + "end": 1402, + "range": [1106, 1402], + "body": [{ + "type": "VariableDeclaration", + "start": 1120, + "end": 1138, + "range": [1120, 1138], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1124, + "end": 1138, + "range": [1124, 1138], + "id": { + "type": "Identifier", + "start": 1124, + "end": 1125, + "range": [1124, 1125], + "name": "t" + }, + "init": { + "type": "MemberExpression", + "start": 1128, + "end": 1138, + "range": [1128, 1138], + "object": { + "type": "Identifier", + "start": 1128, + "end": 1135, + "range": [1128, 1135], + "name": "targets" + }, + "property": { + "type": "Identifier", + "start": 1136, + "end": 1137, + "range": [1136, 1137], + "name": "i" + }, + "computed": true + } + }], + "kind": "let" + }, { + "type": "VariableDeclaration", + "start": 1151, + "end": 1212, + "range": [1151, 1212], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1155, + "end": 1212, + "range": [1155, 1212], + "id": { + "type": "Identifier", + "start": 1155, + "end": 1166, + "range": [1155, 1166], + "name": "touchTarget" + }, + "init": { + "type": "CallExpression", + "start": 1169, + "end": 1212, + "range": [1169, 1212], + "callee": { + "type": "MemberExpression", + "start": 1169, + "end": 1194, + "range": [1169, 1194], + "object": { + "type": "Identifier", + "start": 1169, + "end": 1177, + "range": [1169, 1177], + "name": "document" + }, + "property": { + "type": "Identifier", + "start": 1178, + "end": 1194, + "range": [1178, 1194], + "name": "elementFromPoint" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 1195, + "end": 1202, + "range": [1195, 1202], + "object": { + "type": "Identifier", + "start": 1195, + "end": 1196, + "range": [1195, 1196], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1197, + "end": 1202, + "range": [1197, 1202], + "name": "pageX" + }, + "computed": false + }, { + "type": "MemberExpression", + "start": 1204, + "end": 1211, + "range": [1204, 1211], + "object": { + "type": "Identifier", + "start": 1204, + "end": 1205, + "range": [1204, 1205], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1206, + "end": 1211, + "range": [1206, 1211], + "name": "pageY" + }, + "computed": false + }] + } + }], + "kind": "let" + }, { + "type": "VariableDeclaration", + "start": 1225, + "end": 1360, + "range": [1225, 1360], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1229, + "end": 1360, + "range": [1229, 1360], + "id": { + "type": "Identifier", + "start": 1229, + "end": 1234, + "range": [1229, 1234], + "name": "touch" + }, + "init": { + "type": "NewExpression", + "start": 1237, + "end": 1360, + "range": [1237, 1360], + "callee": { + "type": "Identifier", + "start": 1241, + "end": 1246, + "range": [1241, 1246], + "name": "Touch" + }, + "arguments": [{ + "type": "Identifier", + "start": 1247, + "end": 1256, + "range": [1247, 1256], + "name": "undefined" + }, { + "type": "Identifier", + "start": 1258, + "end": 1269, + "range": [1258, 1269], + "name": "touchTarget" + }, { + "type": "MemberExpression", + "start": 1271, + "end": 1283, + "range": [1271, 1283], + "object": { + "type": "Identifier", + "start": 1271, + "end": 1272, + "range": [1271, 1272], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1273, + "end": 1283, + "range": [1273, 1283], + "name": "identifier" + }, + "computed": false + }, { + "type": "MemberExpression", + "start": 1321, + "end": 1328, + "range": [1321, 1328], + "object": { + "type": "Identifier", + "start": 1321, + "end": 1322, + "range": [1321, 1322], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1323, + "end": 1328, + "range": [1323, 1328], + "name": "pageX" + }, + "computed": false + }, { + "type": "MemberExpression", + "start": 1330, + "end": 1337, + "range": [1330, 1337], + "object": { + "type": "Identifier", + "start": 1330, + "end": 1331, + "range": [1330, 1331], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1332, + "end": 1337, + "range": [1332, 1337], + "name": "pageY" + }, + "computed": false + }, { + "type": "MemberExpression", + "start": 1339, + "end": 1348, + "range": [1339, 1348], + "object": { + "type": "Identifier", + "start": 1339, + "end": 1340, + "range": [1339, 1340], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1341, + "end": 1348, + "range": [1341, 1348], + "name": "screenX" + }, + "computed": false + }, { + "type": "MemberExpression", + "start": 1350, + "end": 1359, + "range": [1350, 1359], + "object": { + "type": "Identifier", + "start": 1350, + "end": 1351, + "range": [1350, 1351], + "name": "t" + }, + "property": { + "type": "Identifier", + "start": 1352, + "end": 1359, + "range": [1352, 1359], + "name": "screenY" + }, + "computed": false + }] + } + }], + "kind": "let" + }, { + "type": "ExpressionStatement", + "start": 1373, + "end": 1392, + "range": [1373, 1392], + "expression": { + "type": "CallExpression", + "start": 1373, + "end": 1392, + "range": [1373, 1392], + "callee": { + "type": "MemberExpression", + "start": 1373, + "end": 1385, + "range": [1373, 1385], + "object": { + "type": "Identifier", + "start": 1373, + "end": 1380, + "range": [1373, 1380], + "name": "touches" + }, + "property": { + "type": "Identifier", + "start": 1381, + "end": 1385, + "range": [1381, 1385], + "name": "push" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 1386, + "end": 1391, + "range": [1386, 1391], + "name": "touch" + }] + } + }] + } + }, { + "type": "ReturnStatement", + "start": 1411, + "end": 1443, + "range": [1411, 1443], + "argument": { + "type": "NewExpression", + "start": 1418, + "end": 1443, + "range": [1418, 1443], + "callee": { + "type": "Identifier", + "start": 1422, + "end": 1431, + "range": [1422, 1431], + "name": "TouchList" + }, + "arguments": [{ + "type": "SpreadElement", + "start": 1432, + "end": 1442, + "range": [1432, 1442], + "argument": { + "type": "Identifier", + "start": 1435, + "end": 1442, + "range": [1435, 1442], + "name": "touches" + } + }] + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 1455, + "end": 2891, + "range": [1455, 2891], + "computed": false, + "key": { + "type": "Identifier", + "start": 1462, + "end": 1474, + "range": [1462, 1474], + "name": "extractEvent" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 1474, + "end": 2891, + "range": [1474, 2891], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 1475, + "end": 1484, + "range": [1475, 1484], + "name": "timestamp" + }, { + "type": "Identifier", + "start": 1486, + "end": 1491, + "range": [1486, 1491], + "name": "event" + }], + "body": { + "type": "BlockStatement", + "start": 1493, + "end": 2891, + "range": [1493, 2891], + "body": [{ + "type": "VariableDeclaration", + "start": 1503, + "end": 2392, + "range": [1503, 2392], + "declarations": [{ + "type": "VariableDeclarator", + "start": 1507, + "end": 2392, + "range": [1507, 2392], + "id": { + "type": "Identifier", + "start": 1507, + "end": 1512, + "range": [1507, 1512], + "name": "infos" + }, + "init": { + "type": "ObjectExpression", + "start": 1515, + "end": 2392, + "range": [1515, 2392], + "properties": [{ + "type": "Property", + "start": 1517, + "end": 1533, + "range": [1517, 1533], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1517, + "end": 1521, + "range": [1517, 1521], + "name": "type" + }, + "value": { + "type": "MemberExpression", + "start": 1523, + "end": 1533, + "range": [1523, 1533], + "object": { + "type": "Identifier", + "start": 1523, + "end": 1528, + "range": [1523, 1528], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1529, + "end": 1533, + "range": [1529, 1533], + "name": "type" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1547, + "end": 1562, + "range": [1547, 1562], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1547, + "end": 1551, + "range": [1547, 1551], + "name": "time" + }, + "value": { + "type": "Identifier", + "start": 1553, + "end": 1562, + "range": [1553, 1562], + "name": "timestamp" + }, + "kind": "init" + }, { + "type": "Property", + "start": 1576, + "end": 1606, + "range": [1576, 1606], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1576, + "end": 1587, + "range": [1576, 1587], + "name": "constructor" + }, + "value": { + "type": "MemberExpression", + "start": 1589, + "end": 1606, + "range": [1589, 1606], + "object": { + "type": "Identifier", + "start": 1589, + "end": 1594, + "range": [1589, 1594], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1595, + "end": 1606, + "range": [1595, 1606], + "name": "constructor" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1620, + "end": 2378, + "range": [1620, 2378], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1620, + "end": 1624, + "range": [1620, 1624], + "name": "data" + }, + "value": { + "type": "ObjectExpression", + "start": 1626, + "end": 2378, + "range": [1626, 2378], + "properties": [{ + "type": "Property", + "start": 1644, + "end": 1687, + "range": [1644, 1687], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1644, + "end": 1658, + "range": [1644, 1658], + "name": "targetSelector" + }, + "value": { + "type": "CallExpression", + "start": 1660, + "end": 1687, + "range": [1660, 1687], + "callee": { + "type": "MemberExpression", + "start": 1660, + "end": 1673, + "range": [1660, 1673], + "object": { + "type": "ThisExpression", + "start": 1660, + "end": 1664, + "range": [1660, 1664] + }, + "property": { + "type": "Identifier", + "start": 1665, + "end": 1673, + "range": [1665, 1673], + "name": "selector" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 1674, + "end": 1686, + "range": [1674, 1686], + "object": { + "type": "Identifier", + "start": 1674, + "end": 1679, + "range": [1674, 1679], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1680, + "end": 1686, + "range": [1680, 1686], + "name": "target" + }, + "computed": false + }] + }, + "kind": "init" + }, { + "type": "Property", + "start": 1705, + "end": 1721, + "range": [1705, 1721], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1705, + "end": 1709, + "range": [1705, 1709], + "name": "view" + }, + "value": { + "type": "MemberExpression", + "start": 1711, + "end": 1721, + "range": [1711, 1721], + "object": { + "type": "Identifier", + "start": 1711, + "end": 1716, + "range": [1711, 1716], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1717, + "end": 1721, + "range": [1717, 1721], + "name": "view" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1739, + "end": 1788, + "range": [1739, 1788], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1739, + "end": 1758, + "range": [1739, 1758], + "name": "mouseDownSubstitute" + }, + "value": { + "type": "LogicalExpression", + "start": 1760, + "end": 1788, + "range": [1760, 1788], + "left": { + "type": "MemberExpression", + "start": 1760, + "end": 1773, + "range": [1760, 1773], + "object": { + "type": "Identifier", + "start": 1760, + "end": 1765, + "range": [1760, 1765], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1766, + "end": 1773, + "range": [1766, 1773], + "name": "buttons" + }, + "computed": false + }, + "operator": "||", + "right": { + "type": "MemberExpression", + "start": 1777, + "end": 1788, + "range": [1777, 1788], + "object": { + "type": "Identifier", + "start": 1777, + "end": 1782, + "range": [1777, 1782], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1783, + "end": 1788, + "range": [1783, 1788], + "name": "which" + }, + "computed": false + } + }, + "kind": "init" + }, { + "type": "Property", + "start": 1841, + "end": 1863, + "range": [1841, 1863], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1841, + "end": 1848, + "range": [1841, 1848], + "name": "bubbles" + }, + "value": { + "type": "MemberExpression", + "start": 1850, + "end": 1863, + "range": [1850, 1863], + "object": { + "type": "Identifier", + "start": 1850, + "end": 1855, + "range": [1850, 1855], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1856, + "end": 1863, + "range": [1856, 1863], + "name": "bubbles" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1881, + "end": 1909, + "range": [1881, 1909], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1881, + "end": 1891, + "range": [1881, 1891], + "name": "cancelable" + }, + "value": { + "type": "MemberExpression", + "start": 1893, + "end": 1909, + "range": [1893, 1909], + "object": { + "type": "Identifier", + "start": 1893, + "end": 1898, + "range": [1893, 1898], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1899, + "end": 1909, + "range": [1899, 1909], + "name": "cancelable" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1927, + "end": 1949, + "range": [1927, 1949], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1927, + "end": 1934, + "range": [1927, 1934], + "name": "screenX" + }, + "value": { + "type": "MemberExpression", + "start": 1936, + "end": 1949, + "range": [1936, 1949], + "object": { + "type": "Identifier", + "start": 1936, + "end": 1941, + "range": [1936, 1941], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1942, + "end": 1949, + "range": [1942, 1949], + "name": "screenX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 1967, + "end": 1989, + "range": [1967, 1989], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 1967, + "end": 1974, + "range": [1967, 1974], + "name": "screenY" + }, + "value": { + "type": "MemberExpression", + "start": 1976, + "end": 1989, + "range": [1976, 1989], + "object": { + "type": "Identifier", + "start": 1976, + "end": 1981, + "range": [1976, 1981], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 1982, + "end": 1989, + "range": [1982, 1989], + "name": "screenY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2007, + "end": 2029, + "range": [2007, 2029], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2007, + "end": 2014, + "range": [2007, 2014], + "name": "clientX" + }, + "value": { + "type": "MemberExpression", + "start": 2016, + "end": 2029, + "range": [2016, 2029], + "object": { + "type": "Identifier", + "start": 2016, + "end": 2021, + "range": [2016, 2021], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2022, + "end": 2029, + "range": [2022, 2029], + "name": "clientX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2047, + "end": 2069, + "range": [2047, 2069], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2047, + "end": 2054, + "range": [2047, 2054], + "name": "clientY" + }, + "value": { + "type": "MemberExpression", + "start": 2056, + "end": 2069, + "range": [2056, 2069], + "object": { + "type": "Identifier", + "start": 2056, + "end": 2061, + "range": [2056, 2061], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2062, + "end": 2069, + "range": [2062, 2069], + "name": "clientY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2087, + "end": 2107, + "range": [2087, 2107], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2087, + "end": 2093, + "range": [2087, 2093], + "name": "layerX" + }, + "value": { + "type": "MemberExpression", + "start": 2095, + "end": 2107, + "range": [2095, 2107], + "object": { + "type": "Identifier", + "start": 2095, + "end": 2100, + "range": [2095, 2100], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2101, + "end": 2107, + "range": [2101, 2107], + "name": "layerX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2125, + "end": 2145, + "range": [2125, 2145], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2125, + "end": 2131, + "range": [2125, 2131], + "name": "layerY" + }, + "value": { + "type": "MemberExpression", + "start": 2133, + "end": 2145, + "range": [2133, 2145], + "object": { + "type": "Identifier", + "start": 2133, + "end": 2138, + "range": [2133, 2138], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2139, + "end": 2145, + "range": [2139, 2145], + "name": "layerY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2163, + "end": 2181, + "range": [2163, 2181], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2163, + "end": 2168, + "range": [2163, 2168], + "name": "pageX" + }, + "value": { + "type": "MemberExpression", + "start": 2170, + "end": 2181, + "range": [2170, 2181], + "object": { + "type": "Identifier", + "start": 2170, + "end": 2175, + "range": [2170, 2175], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2176, + "end": 2181, + "range": [2176, 2181], + "name": "pageX" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2199, + "end": 2217, + "range": [2199, 2217], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2199, + "end": 2204, + "range": [2199, 2204], + "name": "pageY" + }, + "value": { + "type": "MemberExpression", + "start": 2206, + "end": 2217, + "range": [2206, 2217], + "object": { + "type": "Identifier", + "start": 2206, + "end": 2211, + "range": [2206, 2211], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2212, + "end": 2217, + "range": [2212, 2217], + "name": "pageY" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2235, + "end": 2257, + "range": [2235, 2257], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2235, + "end": 2242, + "range": [2235, 2242], + "name": "ctrlKey" + }, + "value": { + "type": "MemberExpression", + "start": 2244, + "end": 2257, + "range": [2244, 2257], + "object": { + "type": "Identifier", + "start": 2244, + "end": 2249, + "range": [2244, 2249], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2250, + "end": 2257, + "range": [2250, 2257], + "name": "ctrlKey" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2275, + "end": 2295, + "range": [2275, 2295], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2275, + "end": 2281, + "range": [2275, 2281], + "name": "altKey" + }, + "value": { + "type": "MemberExpression", + "start": 2283, + "end": 2295, + "range": [2283, 2295], + "object": { + "type": "Identifier", + "start": 2283, + "end": 2288, + "range": [2283, 2288], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2289, + "end": 2295, + "range": [2289, 2295], + "name": "altKey" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2313, + "end": 2337, + "range": [2313, 2337], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2313, + "end": 2321, + "range": [2313, 2321], + "name": "shiftKey" + }, + "value": { + "type": "MemberExpression", + "start": 2323, + "end": 2337, + "range": [2323, 2337], + "object": { + "type": "Identifier", + "start": 2323, + "end": 2328, + "range": [2323, 2328], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2329, + "end": 2337, + "range": [2329, 2337], + "name": "shiftKey" + }, + "computed": false + }, + "kind": "init" + }, { + "type": "Property", + "start": 2355, + "end": 2377, + "range": [2355, 2377], + "method": false, + "shorthand": false, + "computed": false, + "key": { + "type": "Identifier", + "start": 2355, + "end": 2362, + "range": [2355, 2362], + "name": "metaKey" + }, + "value": { + "type": "MemberExpression", + "start": 2364, + "end": 2377, + "range": [2364, 2377], + "object": { + "type": "Identifier", + "start": 2364, + "end": 2369, + "range": [2364, 2369], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2370, + "end": 2377, + "range": [2370, 2377], + "name": "metaKey" + }, + "computed": false + }, + "kind": "init" + }] + }, + "kind": "init" + }] + } + }], + "kind": "let" + }, { + "type": "IfStatement", + "start": 2401, + "end": 2772, + "range": [2401, 2772], + "test": { + "type": "CallExpression", + "start": 2405, + "end": 2435, + "range": [2405, 2435], + "callee": { + "type": "MemberExpression", + "start": 2405, + "end": 2426, + "range": [2405, 2426], + "object": { + "type": "MemberExpression", + "start": 2405, + "end": 2415, + "range": [2405, 2415], + "object": { + "type": "Identifier", + "start": 2405, + "end": 2410, + "range": [2405, 2410], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2411, + "end": 2415, + "range": [2411, 2415], + "name": "type" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 2416, + "end": 2426, + "range": [2416, 2426], + "name": "startsWith" + }, + "computed": false + }, + "arguments": [{ + "type": "Literal", + "start": 2427, + "end": 2434, + "range": [2427, 2434], + "value": "touch", + "raw": "'touch'" + }] + }, + "consequent": { + "type": "BlockStatement", + "start": 2437, + "end": 2772, + "range": [2437, 2772], + "body": [{ + "type": "VariableDeclaration", + "start": 2529, + "end": 2550, + "range": [2529, 2550], + "declarations": [{ + "type": "VariableDeclarator", + "start": 2533, + "end": 2550, + "range": [2533, 2550], + "id": { + "type": "Identifier", + "start": 2533, + "end": 2537, + "range": [2533, 2537], + "name": "data" + }, + "init": { + "type": "MemberExpression", + "start": 2540, + "end": 2550, + "range": [2540, 2550], + "object": { + "type": "Identifier", + "start": 2540, + "end": 2545, + "range": [2540, 2545], + "name": "infos" + }, + "property": { + "type": "Identifier", + "start": 2546, + "end": 2550, + "range": [2546, 2550], + "name": "data" + }, + "computed": false + } + }], + "kind": "let" + }, { + "type": "ExpressionStatement", + "start": 2563, + "end": 2624, + "range": [2563, 2624], + "expression": { + "type": "AssignmentExpression", + "start": 2563, + "end": 2624, + "range": [2563, 2624], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 2563, + "end": 2581, + "range": [2563, 2581], + "object": { + "type": "Identifier", + "start": 2563, + "end": 2567, + "range": [2563, 2567], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 2568, + "end": 2581, + "range": [2568, 2581], + "name": "targetTouches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 2584, + "end": 2624, + "range": [2584, 2624], + "callee": { + "type": "MemberExpression", + "start": 2584, + "end": 2603, + "range": [2584, 2603], + "object": { + "type": "ThisExpression", + "start": 2584, + "end": 2588, + "range": [2584, 2588] + }, + "property": { + "type": "Identifier", + "start": 2589, + "end": 2603, + "range": [2589, 2603], + "name": "extractTouches" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 2604, + "end": 2623, + "range": [2604, 2623], + "object": { + "type": "Identifier", + "start": 2604, + "end": 2609, + "range": [2604, 2609], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2610, + "end": 2623, + "range": [2610, 2623], + "name": "targetTouches" + }, + "computed": false + }] + } + } + }, { + "type": "ExpressionStatement", + "start": 2637, + "end": 2700, + "range": [2637, 2700], + "expression": { + "type": "AssignmentExpression", + "start": 2637, + "end": 2700, + "range": [2637, 2700], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 2637, + "end": 2656, + "range": [2637, 2656], + "object": { + "type": "Identifier", + "start": 2637, + "end": 2641, + "range": [2637, 2641], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 2642, + "end": 2656, + "range": [2642, 2656], + "name": "changedTouches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 2659, + "end": 2700, + "range": [2659, 2700], + "callee": { + "type": "MemberExpression", + "start": 2659, + "end": 2678, + "range": [2659, 2678], + "object": { + "type": "ThisExpression", + "start": 2659, + "end": 2663, + "range": [2659, 2663] + }, + "property": { + "type": "Identifier", + "start": 2664, + "end": 2678, + "range": [2664, 2678], + "name": "extractTouches" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 2679, + "end": 2699, + "range": [2679, 2699], + "object": { + "type": "Identifier", + "start": 2679, + "end": 2684, + "range": [2679, 2684], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2685, + "end": 2699, + "range": [2685, 2699], + "name": "changedTouches" + }, + "computed": false + }] + } + } + }, { + "type": "ExpressionStatement", + "start": 2713, + "end": 2762, + "range": [2713, 2762], + "expression": { + "type": "AssignmentExpression", + "start": 2713, + "end": 2762, + "range": [2713, 2762], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 2713, + "end": 2725, + "range": [2713, 2725], + "object": { + "type": "Identifier", + "start": 2713, + "end": 2717, + "range": [2713, 2717], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 2718, + "end": 2725, + "range": [2718, 2725], + "name": "touches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 2728, + "end": 2762, + "range": [2728, 2762], + "callee": { + "type": "MemberExpression", + "start": 2728, + "end": 2747, + "range": [2728, 2747], + "object": { + "type": "ThisExpression", + "start": 2728, + "end": 2732, + "range": [2728, 2732] + }, + "property": { + "type": "Identifier", + "start": 2733, + "end": 2747, + "range": [2733, 2747], + "name": "extractTouches" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 2748, + "end": 2761, + "range": [2748, 2761], + "object": { + "type": "Identifier", + "start": 2748, + "end": 2753, + "range": [2748, 2753], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 2754, + "end": 2761, + "range": [2754, 2761], + "name": "touches" + }, + "computed": false + }] + } + } + }] + }, + "alternate": null + }, { + "type": "IfStatement", + "start": 2781, + "end": 2864, + "range": [2781, 2864], + "test": { + "type": "MemberExpression", + "start": 2785, + "end": 2797, + "range": [2785, 2797], + "object": { + "type": "Identifier", + "start": 2785, + "end": 2791, + "range": [2785, 2791], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 2792, + "end": 2797, + "range": [2792, 2797], + "name": "debug" + }, + "computed": false + }, + "consequent": { + "type": "BlockStatement", + "start": 2799, + "end": 2864, + "range": [2799, 2864], + "body": [{ + "type": "ExpressionStatement", + "start": 2813, + "end": 2854, + "range": [2813, 2854], + "expression": { + "type": "CallExpression", + "start": 2813, + "end": 2854, + "range": [2813, 2854], + "callee": { + "type": "MemberExpression", + "start": 2813, + "end": 2834, + "range": [2813, 2834], + "object": { + "type": "MemberExpression", + "start": 2813, + "end": 2829, + "range": [2813, 2829], + "object": { + "type": "Identifier", + "start": 2813, + "end": 2819, + "range": [2813, 2819], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 2820, + "end": 2829, + "range": [2820, 2829], + "name": "extracted" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 2830, + "end": 2834, + "range": [2830, 2834], + "name": "push" + }, + "computed": false + }, + "arguments": [{ + "type": "CallExpression", + "start": 2835, + "end": 2853, + "range": [2835, 2853], + "callee": { + "type": "MemberExpression", + "start": 2835, + "end": 2846, + "range": [2835, 2846], + "object": { + "type": "ThisExpression", + "start": 2835, + "end": 2839, + "range": [2835, 2839] + }, + "property": { + "type": "Identifier", + "start": 2840, + "end": 2846, + "range": [2840, 2846], + "name": "toLine" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 2847, + "end": 2852, + "range": [2847, 2852], + "name": "event" + }] + }] + } + }] + }, + "alternate": null + }, { + "type": "ReturnStatement", + "start": 2873, + "end": 2885, + "range": [2873, 2885], + "argument": { + "type": "Identifier", + "start": 2880, + "end": 2885, + "range": [2880, 2885], + "name": "infos" + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 2897, + "end": 3714, + "range": [2897, 3714], + "computed": false, + "key": { + "type": "Identifier", + "start": 2904, + "end": 2914, + "range": [2904, 2914], + "name": "cloneEvent" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 2914, + "end": 3714, + "range": [2914, 3714], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 2915, + "end": 2919, + "range": [2915, 2919], + "name": "type" + }, { + "type": "Identifier", + "start": 2921, + "end": 2932, + "range": [2921, 2932], + "name": "constructor" + }, { + "type": "Identifier", + "start": 2934, + "end": 2938, + "range": [2934, 2938], + "name": "data" + }], + "body": { + "type": "BlockStatement", + "start": 2940, + "end": 3714, + "range": [2940, 3714], + "body": [{ + "type": "IfStatement", + "start": 2950, + "end": 3425, + "range": [2950, 3425], + "test": { + "type": "CallExpression", + "start": 2954, + "end": 2978, + "range": [2954, 2978], + "callee": { + "type": "MemberExpression", + "start": 2954, + "end": 2969, + "range": [2954, 2969], + "object": { + "type": "Identifier", + "start": 2954, + "end": 2958, + "range": [2954, 2958], + "name": "type" + }, + "property": { + "type": "Identifier", + "start": 2959, + "end": 2969, + "range": [2959, 2969], + "name": "startsWith" + }, + "computed": false + }, + "arguments": [{ + "type": "Literal", + "start": 2970, + "end": 2977, + "range": [2970, 2977], + "value": "touch", + "raw": "'touch'" + }] + }, + "consequent": { + "type": "BlockStatement", + "start": 2980, + "end": 3425, + "range": [2980, 3425], + "body": [{ + "type": "ExpressionStatement", + "start": 3216, + "end": 3277, + "range": [3216, 3277], + "expression": { + "type": "AssignmentExpression", + "start": 3216, + "end": 3277, + "range": [3216, 3277], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 3216, + "end": 3234, + "range": [3216, 3234], + "object": { + "type": "Identifier", + "start": 3216, + "end": 3220, + "range": [3216, 3220], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3221, + "end": 3234, + "range": [3221, 3234], + "name": "targetTouches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 3237, + "end": 3277, + "range": [3237, 3277], + "callee": { + "type": "MemberExpression", + "start": 3237, + "end": 3257, + "range": [3237, 3257], + "object": { + "type": "ThisExpression", + "start": 3237, + "end": 3241, + "range": [3237, 3241] + }, + "property": { + "type": "Identifier", + "start": 3242, + "end": 3257, + "range": [3242, 3257], + "name": "createTouchList" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 3258, + "end": 3276, + "range": [3258, 3276], + "object": { + "type": "Identifier", + "start": 3258, + "end": 3262, + "range": [3258, 3262], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3263, + "end": 3276, + "range": [3263, 3276], + "name": "targetTouches" + }, + "computed": false + }] + } + } + }, { + "type": "ExpressionStatement", + "start": 3290, + "end": 3353, + "range": [3290, 3353], + "expression": { + "type": "AssignmentExpression", + "start": 3290, + "end": 3353, + "range": [3290, 3353], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 3290, + "end": 3309, + "range": [3290, 3309], + "object": { + "type": "Identifier", + "start": 3290, + "end": 3294, + "range": [3290, 3294], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3295, + "end": 3309, + "range": [3295, 3309], + "name": "changedTouches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 3312, + "end": 3353, + "range": [3312, 3353], + "callee": { + "type": "MemberExpression", + "start": 3312, + "end": 3332, + "range": [3312, 3332], + "object": { + "type": "ThisExpression", + "start": 3312, + "end": 3316, + "range": [3312, 3316] + }, + "property": { + "type": "Identifier", + "start": 3317, + "end": 3332, + "range": [3317, 3332], + "name": "createTouchList" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 3333, + "end": 3352, + "range": [3333, 3352], + "object": { + "type": "Identifier", + "start": 3333, + "end": 3337, + "range": [3333, 3337], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3338, + "end": 3352, + "range": [3338, 3352], + "name": "changedTouches" + }, + "computed": false + }] + } + } + }, { + "type": "ExpressionStatement", + "start": 3366, + "end": 3415, + "range": [3366, 3415], + "expression": { + "type": "AssignmentExpression", + "start": 3366, + "end": 3415, + "range": [3366, 3415], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 3366, + "end": 3378, + "range": [3366, 3378], + "object": { + "type": "Identifier", + "start": 3366, + "end": 3370, + "range": [3366, 3370], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3371, + "end": 3378, + "range": [3371, 3378], + "name": "touches" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 3381, + "end": 3415, + "range": [3381, 3415], + "callee": { + "type": "MemberExpression", + "start": 3381, + "end": 3401, + "range": [3381, 3401], + "object": { + "type": "ThisExpression", + "start": 3381, + "end": 3385, + "range": [3381, 3385] + }, + "property": { + "type": "Identifier", + "start": 3386, + "end": 3401, + "range": [3386, 3401], + "name": "createTouchList" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 3402, + "end": 3414, + "range": [3402, 3414], + "object": { + "type": "Identifier", + "start": 3402, + "end": 3406, + "range": [3402, 3406], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3407, + "end": 3414, + "range": [3407, 3414], + "name": "touches" + }, + "computed": false + }] + } + } + }] + }, + "alternate": null + }, { + "type": "VariableDeclaration", + "start": 3570, + "end": 3626, + "range": [3570, 3626], + "declarations": [{ + "type": "VariableDeclarator", + "start": 3574, + "end": 3626, + "range": [3574, 3626], + "id": { + "type": "Identifier", + "start": 3574, + "end": 3579, + "range": [3574, 3579], + "name": "clone" + }, + "init": { + "type": "CallExpression", + "start": 3582, + "end": 3626, + "range": [3582, 3626], + "callee": { + "type": "MemberExpression", + "start": 3582, + "end": 3599, + "range": [3582, 3599], + "object": { + "type": "Identifier", + "start": 3582, + "end": 3589, + "range": [3582, 3589], + "name": "Reflect" + }, + "property": { + "type": "Identifier", + "start": 3590, + "end": 3599, + "range": [3590, 3599], + "name": "construct" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 3600, + "end": 3611, + "range": [3600, 3611], + "name": "constructor" + }, { + "type": "ArrayExpression", + "start": 3613, + "end": 3625, + "range": [3613, 3625], + "elements": [{ + "type": "Identifier", + "start": 3614, + "end": 3618, + "range": [3614, 3618], + "name": "type" + }, { + "type": "Identifier", + "start": 3620, + "end": 3624, + "range": [3620, 3624], + "name": "data" + }] + }] + } + }], + "kind": "let" + }, { + "type": "ExpressionStatement", + "start": 3635, + "end": 3687, + "range": [3635, 3687], + "expression": { + "type": "AssignmentExpression", + "start": 3635, + "end": 3687, + "range": [3635, 3687], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 3635, + "end": 3660, + "range": [3635, 3660], + "object": { + "type": "Identifier", + "start": 3635, + "end": 3640, + "range": [3635, 3640], + "name": "clone" + }, + "property": { + "type": "Identifier", + "start": 3641, + "end": 3660, + "range": [3641, 3660], + "name": "mouseDownSubstitute" + }, + "computed": false + }, + "right": { + "type": "MemberExpression", + "start": 3663, + "end": 3687, + "range": [3663, 3687], + "object": { + "type": "Identifier", + "start": 3663, + "end": 3667, + "range": [3663, 3667], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3668, + "end": 3687, + "range": [3668, 3687], + "name": "mouseDownSubstitute" + }, + "computed": false + } + } + }, { + "type": "ReturnStatement", + "start": 3696, + "end": 3708, + "range": [3696, 3708], + "argument": { + "type": "Identifier", + "start": 3703, + "end": 3708, + "range": [3703, 3708], + "name": "clone" + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 3720, + "end": 4082, + "range": [3720, 4082], + "computed": false, + "key": { + "type": "Identifier", + "start": 3727, + "end": 3740, + "range": [3727, 3740], + "name": "simulateEvent" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 3740, + "end": 4082, + "range": [3740, 4082], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 3741, + "end": 3745, + "range": [3741, 3745], + "name": "type" + }, { + "type": "Identifier", + "start": 3747, + "end": 3758, + "range": [3747, 3758], + "name": "constructor" + }, { + "type": "Identifier", + "start": 3760, + "end": 3764, + "range": [3760, 3764], + "name": "data" + }], + "body": { + "type": "BlockStatement", + "start": 3766, + "end": 4082, + "range": [3766, 4082], + "body": [{ + "type": "ExpressionStatement", + "start": 3776, + "end": 3833, + "range": [3776, 3833], + "expression": { + "type": "AssignmentExpression", + "start": 3776, + "end": 3833, + "range": [3776, 3833], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 3776, + "end": 3787, + "range": [3776, 3787], + "object": { + "type": "Identifier", + "start": 3776, + "end": 3780, + "range": [3776, 3780], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3781, + "end": 3787, + "range": [3781, 3787], + "name": "target" + }, + "computed": false + }, + "right": { + "type": "CallExpression", + "start": 3790, + "end": 3833, + "range": [3790, 3833], + "callee": { + "type": "MemberExpression", + "start": 3790, + "end": 3812, + "range": [3790, 3812], + "object": { + "type": "Identifier", + "start": 3790, + "end": 3798, + "range": [3790, 3798], + "name": "document" + }, + "property": { + "type": "Identifier", + "start": 3799, + "end": 3812, + "range": [3799, 3812], + "name": "querySelector" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 3813, + "end": 3832, + "range": [3813, 3832], + "object": { + "type": "Identifier", + "start": 3813, + "end": 3817, + "range": [3813, 3817], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3818, + "end": 3832, + "range": [3818, 3832], + "name": "targetSelector" + }, + "computed": false + }] + } + } + }, { + "type": "VariableDeclaration", + "start": 3842, + "end": 3894, + "range": [3842, 3894], + "declarations": [{ + "type": "VariableDeclarator", + "start": 3846, + "end": 3894, + "range": [3846, 3894], + "id": { + "type": "Identifier", + "start": 3846, + "end": 3851, + "range": [3846, 3851], + "name": "clone" + }, + "init": { + "type": "CallExpression", + "start": 3854, + "end": 3894, + "range": [3854, 3894], + "callee": { + "type": "MemberExpression", + "start": 3854, + "end": 3869, + "range": [3854, 3869], + "object": { + "type": "ThisExpression", + "start": 3854, + "end": 3858, + "range": [3854, 3858] + }, + "property": { + "type": "Identifier", + "start": 3859, + "end": 3869, + "range": [3859, 3869], + "name": "cloneEvent" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 3870, + "end": 3874, + "range": [3870, 3874], + "name": "type" + }, { + "type": "Identifier", + "start": 3876, + "end": 3887, + "range": [3876, 3887], + "name": "constructor" + }, { + "type": "Identifier", + "start": 3889, + "end": 3893, + "range": [3889, 3893], + "name": "data" + }] + } + }], + "kind": "let" + }, { + "type": "IfStatement", + "start": 3903, + "end": 3984, + "range": [3903, 3984], + "test": { + "type": "BinaryExpression", + "start": 3907, + "end": 3926, + "range": [3907, 3926], + "left": { + "type": "MemberExpression", + "start": 3907, + "end": 3918, + "range": [3907, 3918], + "object": { + "type": "Identifier", + "start": 3907, + "end": 3911, + "range": [3907, 3911], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3912, + "end": 3918, + "range": [3912, 3918], + "name": "target" + }, + "computed": false + }, + "operator": "!=", + "right": { + "type": "Literal", + "start": 3922, + "end": 3926, + "range": [3922, 3926], + "value": null, + "raw": "null" + } + }, + "consequent": { + "type": "BlockStatement", + "start": 3928, + "end": 3984, + "range": [3928, 3984], + "body": [{ + "type": "ExpressionStatement", + "start": 3942, + "end": 3974, + "range": [3942, 3974], + "expression": { + "type": "CallExpression", + "start": 3942, + "end": 3974, + "range": [3942, 3974], + "callee": { + "type": "MemberExpression", + "start": 3942, + "end": 3967, + "range": [3942, 3967], + "object": { + "type": "MemberExpression", + "start": 3942, + "end": 3953, + "range": [3942, 3953], + "object": { + "type": "Identifier", + "start": 3942, + "end": 3946, + "range": [3942, 3946], + "name": "data" + }, + "property": { + "type": "Identifier", + "start": 3947, + "end": 3953, + "range": [3947, 3953], + "name": "target" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 3954, + "end": 3967, + "range": [3954, 3967], + "name": "dispatchEvent" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 3968, + "end": 3973, + "range": [3968, 3973], + "name": "clone" + }] + } + }] + }, + "alternate": null + }, { + "type": "IfStatement", + "start": 3993, + "end": 4076, + "range": [3993, 4076], + "test": { + "type": "MemberExpression", + "start": 3997, + "end": 4009, + "range": [3997, 4009], + "object": { + "type": "Identifier", + "start": 3997, + "end": 4003, + "range": [3997, 4003], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 4004, + "end": 4009, + "range": [4004, 4009], + "name": "debug" + }, + "computed": false + }, + "consequent": { + "type": "BlockStatement", + "start": 4011, + "end": 4076, + "range": [4011, 4076], + "body": [{ + "type": "ExpressionStatement", + "start": 4025, + "end": 4066, + "range": [4025, 4066], + "expression": { + "type": "CallExpression", + "start": 4025, + "end": 4066, + "range": [4025, 4066], + "callee": { + "type": "MemberExpression", + "start": 4025, + "end": 4046, + "range": [4025, 4046], + "object": { + "type": "MemberExpression", + "start": 4025, + "end": 4041, + "range": [4025, 4041], + "object": { + "type": "Identifier", + "start": 4025, + "end": 4031, + "range": [4025, 4031], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 4032, + "end": 4041, + "range": [4032, 4041], + "name": "simulated" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 4042, + "end": 4046, + "range": [4042, 4046], + "name": "push" + }, + "computed": false + }, + "arguments": [{ + "type": "CallExpression", + "start": 4047, + "end": 4065, + "range": [4047, 4065], + "callee": { + "type": "MemberExpression", + "start": 4047, + "end": 4058, + "range": [4047, 4058], + "object": { + "type": "ThisExpression", + "start": 4047, + "end": 4051, + "range": [4047, 4051] + }, + "property": { + "type": "Identifier", + "start": 4052, + "end": 4058, + "range": [4052, 4058], + "name": "toLine" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 4059, + "end": 4064, + "range": [4059, 4064], + "name": "clone" + }] + }] + } + }] + }, + "alternate": null + }] + } + } + }, { + "type": "MethodDefinition", + "start": 4088, + "end": 4704, + "range": [4088, 4704], + "computed": false, + "key": { + "type": "Identifier", + "start": 4095, + "end": 4101, + "range": [4095, 4101], + "name": "toLine" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 4101, + "end": 4704, + "range": [4101, 4704], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 4102, + "end": 4107, + "range": [4102, 4107], + "name": "event" + }], + "body": { + "type": "BlockStatement", + "start": 4109, + "end": 4704, + "range": [4109, 4704], + "body": [{ + "type": "VariableDeclaration", + "start": 4119, + "end": 4142, + "range": [4119, 4142], + "declarations": [{ + "type": "VariableDeclarator", + "start": 4123, + "end": 4142, + "range": [4123, 4142], + "id": { + "type": "Identifier", + "start": 4123, + "end": 4129, + "range": [4123, 4129], + "name": "result" + }, + "init": { + "type": "MemberExpression", + "start": 4132, + "end": 4142, + "range": [4132, 4142], + "object": { + "type": "Identifier", + "start": 4132, + "end": 4137, + "range": [4132, 4137], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 4138, + "end": 4142, + "range": [4138, 4142], + "name": "type" + }, + "computed": false + } + }], + "kind": "let" + }, { + "type": "VariableDeclaration", + "start": 4151, + "end": 4193, + "range": [4151, 4193], + "declarations": [{ + "type": "VariableDeclarator", + "start": 4155, + "end": 4193, + "range": [4155, 4193], + "id": { + "type": "Identifier", + "start": 4155, + "end": 4163, + "range": [4155, 4163], + "name": "selector" + }, + "init": { + "type": "CallExpression", + "start": 4166, + "end": 4193, + "range": [4166, 4193], + "callee": { + "type": "MemberExpression", + "start": 4166, + "end": 4179, + "range": [4166, 4179], + "object": { + "type": "ThisExpression", + "start": 4166, + "end": 4170, + "range": [4166, 4170] + }, + "property": { + "type": "Identifier", + "start": 4171, + "end": 4179, + "range": [4171, 4179], + "name": "selector" + }, + "computed": false + }, + "arguments": [{ + "type": "MemberExpression", + "start": 4180, + "end": 4192, + "range": [4180, 4192], + "object": { + "type": "Identifier", + "start": 4180, + "end": 4185, + "range": [4180, 4185], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 4186, + "end": 4192, + "range": [4186, 4192], + "name": "target" + }, + "computed": false + }] + } + }], + "kind": "let" + }, { + "type": "ExpressionStatement", + "start": 4202, + "end": 4236, + "range": [4202, 4236], + "expression": { + "type": "AssignmentExpression", + "start": 4202, + "end": 4236, + "range": [4202, 4236], + "operator": "+=", + "left": { + "type": "Identifier", + "start": 4202, + "end": 4208, + "range": [4202, 4208], + "name": "result" + }, + "right": { + "type": "BinaryExpression", + "start": 4212, + "end": 4236, + "range": [4212, 4236], + "left": { + "type": "Literal", + "start": 4212, + "end": 4225, + "range": [4212, 4225], + "value": " selector: ", + "raw": "\" selector: \"" + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 4228, + "end": 4236, + "range": [4228, 4236], + "name": "selector" + } + } + } + }, { + "type": "IfStatement", + "start": 4245, + "end": 4350, + "range": [4245, 4350], + "test": { + "type": "BinaryExpression", + "start": 4249, + "end": 4297, + "range": [4249, 4297], + "left": { + "type": "MemberExpression", + "start": 4249, + "end": 4261, + "range": [4249, 4261], + "object": { + "type": "Identifier", + "start": 4249, + "end": 4254, + "range": [4249, 4254], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 4255, + "end": 4261, + "range": [4255, 4261], + "name": "target" + }, + "computed": false + }, + "operator": "!=", + "right": { + "type": "CallExpression", + "start": 4265, + "end": 4297, + "range": [4265, 4297], + "callee": { + "type": "MemberExpression", + "start": 4265, + "end": 4287, + "range": [4265, 4287], + "object": { + "type": "Identifier", + "start": 4265, + "end": 4273, + "range": [4265, 4273], + "name": "document" + }, + "property": { + "type": "Identifier", + "start": 4274, + "end": 4287, + "range": [4274, 4287], + "name": "querySelector" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 4288, + "end": 4296, + "range": [4288, 4296], + "name": "selector" + }] + } + }, + "consequent": { + "type": "ExpressionStatement", + "start": 4311, + "end": 4350, + "range": [4311, 4350], + "expression": { + "type": "CallExpression", + "start": 4311, + "end": 4350, + "range": [4311, 4350], + "callee": { + "type": "MemberExpression", + "start": 4311, + "end": 4322, + "range": [4311, 4322], + "object": { + "type": "Identifier", + "start": 4311, + "end": 4318, + "range": [4311, 4318], + "name": "console" + }, + "property": { + "type": "Identifier", + "start": 4319, + "end": 4322, + "range": [4319, 4322], + "name": "log" + }, + "computed": false + }, + "arguments": [{ + "type": "Literal", + "start": 4323, + "end": 4339, + "range": [4323, 4339], + "value": "Cannot resolve", + "raw": "\"Cannot resolve\"" + }, { + "type": "Identifier", + "start": 4341, + "end": 4349, + "range": [4341, 4349], + "name": "selector" + }] + } + }, + "alternate": null + }, { + "type": "VariableDeclaration", + "start": 4359, + "end": 4430, + "range": [4359, 4430], + "declarations": [{ + "type": "VariableDeclarator", + "start": 4363, + "end": 4430, + "range": [4363, 4430], + "id": { + "type": "Identifier", + "start": 4363, + "end": 4367, + "range": [4363, 4367], + "name": "keys" + }, + "init": { + "type": "ArrayExpression", + "start": 4370, + "end": 4430, + "range": [4370, 4430], + "elements": [{ + "type": "Literal", + "start": 4371, + "end": 4379, + "range": [4371, 4379], + "value": "layerX", + "raw": "'layerX'" + }, { + "type": "Literal", + "start": 4381, + "end": 4389, + "range": [4381, 4389], + "value": "layerY", + "raw": "'layerY'" + }, { + "type": "Literal", + "start": 4391, + "end": 4398, + "range": [4391, 4398], + "value": "pageX", + "raw": "'pageX'" + }, { + "type": "Literal", + "start": 4400, + "end": 4407, + "range": [4400, 4407], + "value": "pageY", + "raw": "'pageY'" + }, { + "type": "Literal", + "start": 4409, + "end": 4418, + "range": [4409, 4418], + "value": "clientX", + "raw": "'clientX'" + }, { + "type": "Literal", + "start": 4420, + "end": 4429, + "range": [4420, 4429], + "value": "clientY", + "raw": "'clientY'" + }] + } + }], + "kind": "let" + }, { + "type": "ForOfStatement", + "start": 4439, + "end": 4646, + "range": [4439, 4646], + "left": { + "type": "VariableDeclaration", + "start": 4443, + "end": 4450, + "range": [4443, 4450], + "declarations": [{ + "type": "VariableDeclarator", + "start": 4447, + "end": 4450, + "range": [4447, 4450], + "id": { + "type": "Identifier", + "start": 4447, + "end": 4450, + "range": [4447, 4450], + "name": "key" + }, + "init": null + }], + "kind": "let" + }, + "right": { + "type": "Identifier", + "start": 4454, + "end": 4458, + "range": [4454, 4458], + "name": "keys" + }, + "body": { + "type": "BlockStatement", + "start": 4460, + "end": 4646, + "range": [4460, 4646], + "body": [{ + "type": "TryStatement", + "start": 4474, + "end": 4636, + "range": [4474, 4636], + "block": { + "type": "BlockStatement", + "start": 4478, + "end": 4548, + "range": [4478, 4548], + "body": [{ + "type": "ExpressionStatement", + "start": 4496, + "end": 4534, + "range": [4496, 4534], + "expression": { + "type": "AssignmentExpression", + "start": 4496, + "end": 4534, + "range": [4496, 4534], + "operator": "+=", + "left": { + "type": "Identifier", + "start": 4496, + "end": 4502, + "range": [4496, 4502], + "name": "result" + }, + "right": { + "type": "BinaryExpression", + "start": 4506, + "end": 4534, + "range": [4506, 4534], + "left": { + "type": "BinaryExpression", + "start": 4506, + "end": 4521, + "range": [4506, 4521], + "left": { + "type": "BinaryExpression", + "start": 4506, + "end": 4515, + "range": [4506, 4515], + "left": { + "type": "Literal", + "start": 4506, + "end": 4509, + "range": [4506, 4509], + "value": " ", + "raw": "\" \"" + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 4512, + "end": 4515, + "range": [4512, 4515], + "name": "key" + } + }, + "operator": "+", + "right": { + "type": "Literal", + "start": 4518, + "end": 4521, + "range": [4518, 4521], + "value": ":", + "raw": "\":\"" + } + }, + "operator": "+", + "right": { + "type": "MemberExpression", + "start": 4524, + "end": 4534, + "range": [4524, 4534], + "object": { + "type": "Identifier", + "start": 4524, + "end": 4529, + "range": [4524, 4529], + "name": "event" + }, + "property": { + "type": "Identifier", + "start": 4530, + "end": 4533, + "range": [4530, 4533], + "name": "key" + }, + "computed": true + } + } + } + }] + }, + "handler": { + "type": "CatchClause", + "start": 4561, + "end": 4636, + "range": [4561, 4636], + "param": { + "type": "Identifier", + "start": 4567, + "end": 4568, + "range": [4567, 4568], + "name": "e" + }, + "body": { + "type": "BlockStatement", + "start": 4570, + "end": 4636, + "range": [4570, 4636], + "body": [{ + "type": "ExpressionStatement", + "start": 4588, + "end": 4622, + "range": [4588, 4622], + "expression": { + "type": "CallExpression", + "start": 4588, + "end": 4622, + "range": [4588, 4622], + "callee": { + "type": "MemberExpression", + "start": 4588, + "end": 4599, + "range": [4588, 4599], + "object": { + "type": "Identifier", + "start": 4588, + "end": 4595, + "range": [4588, 4595], + "name": "console" + }, + "property": { + "type": "Identifier", + "start": 4596, + "end": 4599, + "range": [4596, 4599], + "name": "log" + }, + "computed": false + }, + "arguments": [{ + "type": "BinaryExpression", + "start": 4600, + "end": 4621, + "range": [4600, 4621], + "left": { + "type": "Literal", + "start": 4600, + "end": 4615, + "range": [4600, 4615], + "value": "Invalid key: ", + "raw": "\"Invalid key: \"" + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 4618, + "end": 4621, + "range": [4618, 4621], + "name": "key" + } + }] + } + }] + } + }, + "finalizer": null + }] + } + }, { + "type": "ReturnStatement", + "start": 4685, + "end": 4698, + "range": [4685, 4698], + "argument": { + "type": "Identifier", + "start": 4692, + "end": 4698, + "range": [4692, 4698], + "name": "result" + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 4710, + "end": 5448, + "range": [4710, 5448], + "computed": false, + "key": { + "type": "Identifier", + "start": 4717, + "end": 4746, + "range": [4717, 4746], + "name": "compareExtractedWithSimulated" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 4746, + "end": 5448, + "range": [4746, 5448], + "id": null, + "generator": false, + "expression": false, + "params": [], + "body": { + "type": "BlockStatement", + "start": 4749, + "end": 5448, + "range": [4749, 5448], + "body": [{ + "type": "VariableDeclaration", + "start": 4759, + "end": 4772, + "range": [4759, 4772], + "declarations": [{ + "type": "VariableDeclarator", + "start": 4763, + "end": 4772, + "range": [4763, 4772], + "id": { + "type": "Identifier", + "start": 4763, + "end": 4768, + "range": [4763, 4768], + "name": "diffs" + }, + "init": { + "type": "Literal", + "start": 4771, + "end": 4772, + "range": [4771, 4772], + "value": 0, + "raw": "0" + } + }], + "kind": "var" + }, { + "type": "IfStatement", + "start": 4781, + "end": 5393, + "range": [4781, 5393], + "test": { + "type": "BinaryExpression", + "start": 4785, + "end": 4831, + "range": [4785, 4831], + "left": { + "type": "MemberExpression", + "start": 4785, + "end": 4806, + "range": [4785, 4806], + "object": { + "type": "MemberExpression", + "start": 4785, + "end": 4799, + "range": [4785, 4799], + "object": { + "type": "ThisExpression", + "start": 4785, + "end": 4789, + "range": [4785, 4789] + }, + "property": { + "type": "Identifier", + "start": 4790, + "end": 4799, + "range": [4790, 4799], + "name": "extracted" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 4800, + "end": 4806, + "range": [4800, 4806], + "name": "length" + }, + "computed": false + }, + "operator": "!=", + "right": { + "type": "MemberExpression", + "start": 4810, + "end": 4831, + "range": [4810, 4831], + "object": { + "type": "MemberExpression", + "start": 4810, + "end": 4824, + "range": [4810, 4824], + "object": { + "type": "ThisExpression", + "start": 4810, + "end": 4814, + "range": [4810, 4814] + }, + "property": { + "type": "Identifier", + "start": 4815, + "end": 4824, + "range": [4815, 4824], + "name": "simulated" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 4825, + "end": 4831, + "range": [4825, 4831], + "name": "length" + }, + "computed": false + } + }, + "consequent": { + "type": "BlockStatement", + "start": 4833, + "end": 5022, + "range": [4833, 5022], + "body": [{ + "type": "ExpressionStatement", + "start": 4847, + "end": 4989, + "range": [4847, 4989], + "expression": { + "type": "CallExpression", + "start": 4847, + "end": 4989, + "range": [4847, 4989], + "callee": { + "type": "Identifier", + "start": 4847, + "end": 4852, + "range": [4847, 4852], + "name": "alert" + }, + "arguments": [{ + "type": "BinaryExpression", + "start": 4853, + "end": 4988, + "range": [4853, 4988], + "left": { + "type": "BinaryExpression", + "start": 4853, + "end": 4981, + "range": [4853, 4981], + "left": { + "type": "BinaryExpression", + "start": 4853, + "end": 4957, + "range": [4853, 4957], + "left": { + "type": "BinaryExpression", + "start": 4853, + "end": 4908, + "range": [4853, 4908], + "left": { + "type": "Literal", + "start": 4853, + "end": 4884, + "range": [4853, 4884], + "value": "Unequal length of extracted [", + "raw": "\"Unequal length of extracted [\"" + }, + "operator": "+", + "right": { + "type": "MemberExpression", + "start": 4887, + "end": 4908, + "range": [4887, 4908], + "object": { + "type": "MemberExpression", + "start": 4887, + "end": 4901, + "range": [4887, 4901], + "object": { + "type": "ThisExpression", + "start": 4887, + "end": 4891, + "range": [4887, 4891] + }, + "property": { + "type": "Identifier", + "start": 4892, + "end": 4901, + "range": [4892, 4901], + "name": "extracted" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 4902, + "end": 4908, + "range": [4902, 4908], + "name": "length" + }, + "computed": false + } + }, + "operator": "+", + "right": { + "type": "Literal", + "start": 4931, + "end": 4957, + "range": [4931, 4957], + "value": "] and simulated events [", + "raw": "\"] and simulated events [\"" + } + }, + "operator": "+", + "right": { + "type": "MemberExpression", + "start": 4960, + "end": 4981, + "range": [4960, 4981], + "object": { + "type": "MemberExpression", + "start": 4960, + "end": 4974, + "range": [4960, 4974], + "object": { + "type": "ThisExpression", + "start": 4960, + "end": 4964, + "range": [4960, 4964] + }, + "property": { + "type": "Identifier", + "start": 4965, + "end": 4974, + "range": [4965, 4974], + "name": "simulated" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 4975, + "end": 4981, + "range": [4975, 4981], + "name": "length" + }, + "computed": false + } + }, + "operator": "+", + "right": { + "type": "Literal", + "start": 4984, + "end": 4988, + "range": [4984, 4988], + "value": "].", + "raw": "\"].\"" + } + }] + } + }, { + "type": "ExpressionStatement", + "start": 5002, + "end": 5012, + "range": [5002, 5012], + "expression": { + "type": "AssignmentExpression", + "start": 5002, + "end": 5012, + "range": [5002, 5012], + "operator": "+=", + "left": { + "type": "Identifier", + "start": 5002, + "end": 5007, + "range": [5002, 5007], + "name": "diffs" + }, + "right": { + "type": "Literal", + "start": 5011, + "end": 5012, + "range": [5011, 5012], + "value": 1, + "raw": "1" + } + } + }] + }, + "alternate": { + "type": "BlockStatement", + "start": 5036, + "end": 5393, + "range": [5036, 5393], + "body": [{ + "type": "ForStatement", + "start": 5050, + "end": 5383, + "range": [5050, 5383], + "init": { + "type": "VariableDeclaration", + "start": 5054, + "end": 5061, + "range": [5054, 5061], + "declarations": [{ + "type": "VariableDeclarator", + "start": 5058, + "end": 5061, + "range": [5058, 5061], + "id": { + "type": "Identifier", + "start": 5058, + "end": 5059, + "range": [5058, 5059], + "name": "i" + }, + "init": { + "type": "Literal", + "start": 5060, + "end": 5061, + "range": [5060, 5061], + "value": 0, + "raw": "0" + } + }], + "kind": "let" + }, + "test": { + "type": "BinaryExpression", + "start": 5063, + "end": 5086, + "range": [5063, 5086], + "left": { + "type": "Identifier", + "start": 5063, + "end": 5064, + "range": [5063, 5064], + "name": "i" + }, + "operator": "<", + "right": { + "type": "MemberExpression", + "start": 5065, + "end": 5086, + "range": [5065, 5086], + "object": { + "type": "MemberExpression", + "start": 5065, + "end": 5079, + "range": [5065, 5079], + "object": { + "type": "ThisExpression", + "start": 5065, + "end": 5069, + "range": [5065, 5069] + }, + "property": { + "type": "Identifier", + "start": 5070, + "end": 5079, + "range": [5070, 5079], + "name": "extracted" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 5080, + "end": 5086, + "range": [5080, 5086], + "name": "length" + }, + "computed": false + } + }, + "update": { + "type": "UpdateExpression", + "start": 5088, + "end": 5091, + "range": [5088, 5091], + "operator": "++", + "prefix": false, + "argument": { + "type": "Identifier", + "start": 5088, + "end": 5089, + "range": [5088, 5089], + "name": "i" + } + }, + "body": { + "type": "BlockStatement", + "start": 5093, + "end": 5383, + "range": [5093, 5383], + "body": [{ + "type": "VariableDeclaration", + "start": 5111, + "end": 5144, + "range": [5111, 5144], + "declarations": [{ + "type": "VariableDeclarator", + "start": 5115, + "end": 5144, + "range": [5115, 5144], + "id": { + "type": "Identifier", + "start": 5115, + "end": 5124, + "range": [5115, 5124], + "name": "extracted" + }, + "init": { + "type": "MemberExpression", + "start": 5127, + "end": 5144, + "range": [5127, 5144], + "object": { + "type": "MemberExpression", + "start": 5127, + "end": 5141, + "range": [5127, 5141], + "object": { + "type": "ThisExpression", + "start": 5127, + "end": 5131, + "range": [5127, 5131] + }, + "property": { + "type": "Identifier", + "start": 5132, + "end": 5141, + "range": [5132, 5141], + "name": "extracted" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 5142, + "end": 5143, + "range": [5142, 5143], + "name": "i" + }, + "computed": true + } + }], + "kind": "var" + }, { + "type": "VariableDeclaration", + "start": 5161, + "end": 5194, + "range": [5161, 5194], + "declarations": [{ + "type": "VariableDeclarator", + "start": 5165, + "end": 5194, + "range": [5165, 5194], + "id": { + "type": "Identifier", + "start": 5165, + "end": 5174, + "range": [5165, 5174], + "name": "simulated" + }, + "init": { + "type": "MemberExpression", + "start": 5177, + "end": 5194, + "range": [5177, 5194], + "object": { + "type": "MemberExpression", + "start": 5177, + "end": 5191, + "range": [5177, 5191], + "object": { + "type": "ThisExpression", + "start": 5177, + "end": 5181, + "range": [5177, 5181] + }, + "property": { + "type": "Identifier", + "start": 5182, + "end": 5191, + "range": [5182, 5191], + "name": "simulated" + }, + "computed": false + }, + "property": { + "type": "Identifier", + "start": 5192, + "end": 5193, + "range": [5192, 5193], + "name": "i" + }, + "computed": true + } + }], + "kind": "var" + }, { + "type": "IfStatement", + "start": 5211, + "end": 5369, + "range": [5211, 5369], + "test": { + "type": "BinaryExpression", + "start": 5215, + "end": 5237, + "range": [5215, 5237], + "left": { + "type": "Identifier", + "start": 5215, + "end": 5224, + "range": [5215, 5224], + "name": "extracted" + }, + "operator": "!=", + "right": { + "type": "Identifier", + "start": 5228, + "end": 5237, + "range": [5228, 5237], + "name": "simulated" + } + }, + "consequent": { + "type": "BlockStatement", + "start": 5239, + "end": 5369, + "range": [5239, 5369], + "body": [{ + "type": "ExpressionStatement", + "start": 5261, + "end": 5320, + "range": [5261, 5320], + "expression": { + "type": "CallExpression", + "start": 5261, + "end": 5320, + "range": [5261, 5320], + "callee": { + "type": "MemberExpression", + "start": 5261, + "end": 5272, + "range": [5261, 5272], + "object": { + "type": "Identifier", + "start": 5261, + "end": 5268, + "range": [5261, 5268], + "name": "console" + }, + "property": { + "type": "Identifier", + "start": 5269, + "end": 5272, + "range": [5269, 5272], + "name": "log" + }, + "computed": false + }, + "arguments": [{ + "type": "BinaryExpression", + "start": 5273, + "end": 5319, + "range": [5273, 5319], + "left": { + "type": "BinaryExpression", + "start": 5273, + "end": 5307, + "range": [5273, 5307], + "left": { + "type": "BinaryExpression", + "start": 5273, + "end": 5301, + "range": [5273, 5301], + "left": { + "type": "Literal", + "start": 5273, + "end": 5289, + "range": [5273, 5289], + "value": "Events differ:", + "raw": "\"Events differ:\"" + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 5292, + "end": 5301, + "range": [5292, 5301], + "name": "extracted" + } + }, + "operator": "+", + "right": { + "type": "Literal", + "start": 5304, + "end": 5307, + "range": [5304, 5307], + "value": "|", + "raw": "\"|\"" + } + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 5310, + "end": 5319, + "range": [5310, 5319], + "name": "simulated" + } + }] + } + }, { + "type": "ExpressionStatement", + "start": 5341, + "end": 5351, + "range": [5341, 5351], + "expression": { + "type": "AssignmentExpression", + "start": 5341, + "end": 5351, + "range": [5341, 5351], + "operator": "+=", + "left": { + "type": "Identifier", + "start": 5341, + "end": 5346, + "range": [5341, 5346], + "name": "diffs" + }, + "right": { + "type": "Literal", + "start": 5350, + "end": 5351, + "range": [5350, 5351], + "value": 1, + "raw": "1" + } + } + }] + }, + "alternate": null + }] + } + }] + } + }, { + "type": "ExpressionStatement", + "start": 5402, + "end": 5442, + "range": [5402, 5442], + "expression": { + "type": "CallExpression", + "start": 5402, + "end": 5442, + "range": [5402, 5442], + "callee": { + "type": "MemberExpression", + "start": 5402, + "end": 5413, + "range": [5402, 5413], + "object": { + "type": "Identifier", + "start": 5402, + "end": 5409, + "range": [5402, 5409], + "name": "console" + }, + "property": { + "type": "Identifier", + "start": 5410, + "end": 5413, + "range": [5410, 5413], + "name": "log" + }, + "computed": false + }, + "arguments": [{ + "type": "BinaryExpression", + "start": 5414, + "end": 5441, + "range": [5414, 5441], + "left": { + "type": "BinaryExpression", + "start": 5414, + "end": 5430, + "range": [5414, 5430], + "left": { + "type": "Literal", + "start": 5414, + "end": 5422, + "range": [5414, 5422], + "value": "Found ", + "raw": "\"Found \"" + }, + "operator": "+", + "right": { + "type": "Identifier", + "start": 5425, + "end": 5430, + "range": [5425, 5430], + "name": "diffs" + } + }, + "operator": "+", + "right": { + "type": "Literal", + "start": 5433, + "end": 5441, + "range": [5433, 5441], + "value": " diffs", + "raw": "\" diffs\"" + } + }] + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 5454, + "end": 5531, + "range": [5454, 5531], + "computed": false, + "key": { + "type": "Identifier", + "start": 5461, + "end": 5469, + "range": [5461, 5469], + "name": "selector" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 5469, + "end": 5531, + "range": [5469, 5531], + "id": null, + "generator": false, + "expression": false, + "params": [{ + "type": "Identifier", + "start": 5470, + "end": 5477, + "range": [5470, 5477], + "name": "context" + }], + "body": { + "type": "BlockStatement", + "start": 5479, + "end": 5531, + "range": [5479, 5531], + "body": [{ + "type": "ReturnStatement", + "start": 5489, + "end": 5525, + "range": [5489, 5525], + "argument": { + "type": "CallExpression", + "start": 5496, + "end": 5525, + "range": [5496, 5525], + "callee": { + "type": "MemberExpression", + "start": 5496, + "end": 5516, + "range": [5496, 5516], + "object": { + "type": "Identifier", + "start": 5496, + "end": 5509, + "range": [5496, 5509], + "name": "OptimalSelect" + }, + "property": { + "type": "Identifier", + "start": 5510, + "end": 5516, + "range": [5510, 5516], + "name": "select" + }, + "computed": false + }, + "arguments": [{ + "type": "Identifier", + "start": 5517, + "end": 5524, + "range": [5517, 5524], + "name": "context" + }] + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 5537, + "end": 5615, + "range": [5537, 5615], + "computed": false, + "key": { + "type": "Identifier", + "start": 5544, + "end": 5549, + "range": [5544, 5549], + "name": "reset" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 5549, + "end": 5615, + "range": [5549, 5615], + "id": null, + "generator": false, + "expression": false, + "params": [], + "body": { + "type": "BlockStatement", + "start": 5552, + "end": 5615, + "range": [5552, 5615], + "body": [{ + "type": "ExpressionStatement", + "start": 5562, + "end": 5581, + "range": [5562, 5581], + "expression": { + "type": "AssignmentExpression", + "start": 5562, + "end": 5581, + "range": [5562, 5581], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5562, + "end": 5576, + "range": [5562, 5576], + "object": { + "type": "ThisExpression", + "start": 5562, + "end": 5566, + "range": [5562, 5566] + }, + "property": { + "type": "Identifier", + "start": 5567, + "end": 5576, + "range": [5567, 5576], + "name": "extracted" + }, + "computed": false + }, + "right": { + "type": "ArrayExpression", + "start": 5579, + "end": 5581, + "range": [5579, 5581], + "elements": [] + } + } + }, { + "type": "ExpressionStatement", + "start": 5590, + "end": 5609, + "range": [5590, 5609], + "expression": { + "type": "AssignmentExpression", + "start": 5590, + "end": 5609, + "range": [5590, 5609], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5590, + "end": 5604, + "range": [5590, 5604], + "object": { + "type": "ThisExpression", + "start": 5590, + "end": 5594, + "range": [5590, 5594] + }, + "property": { + "type": "Identifier", + "start": 5595, + "end": 5604, + "range": [5595, 5604], + "name": "simulated" + }, + "computed": false + }, + "right": { + "type": "ArrayExpression", + "start": 5607, + "end": 5609, + "range": [5607, 5609], + "elements": [] + } + } + }] + } + } + }, { + "type": "MethodDefinition", + "start": 5621, + "end": 5680, + "range": [5621, 5680], + "computed": false, + "key": { + "type": "Identifier", + "start": 5628, + "end": 5642, + "range": [5628, 5642], + "name": "resetSimulated" + }, + "static": true, + "kind": "method", + "value": { + "type": "FunctionExpression", + "start": 5642, + "end": 5680, + "range": [5642, 5680], + "id": null, + "generator": false, + "expression": false, + "params": [], + "body": { + "type": "BlockStatement", + "start": 5645, + "end": 5680, + "range": [5645, 5680], + "body": [{ + "type": "ExpressionStatement", + "start": 5655, + "end": 5674, + "range": [5655, 5674], + "expression": { + "type": "AssignmentExpression", + "start": 5655, + "end": 5674, + "range": [5655, 5674], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5655, + "end": 5669, + "range": [5655, 5669], + "object": { + "type": "ThisExpression", + "start": 5655, + "end": 5659, + "range": [5655, 5659] + }, + "property": { + "type": "Identifier", + "start": 5660, + "end": 5669, + "range": [5660, 5669], + "name": "simulated" + }, + "computed": false + }, + "right": { + "type": "ArrayExpression", + "start": 5672, + "end": 5674, + "range": [5672, 5674], + "elements": [] + } + } + }] + } + } + }] + } + }, { + "type": "ExpressionStatement", + "start": 5684, + "end": 5704, + "range": [5684, 5704], + "expression": { + "type": "AssignmentExpression", + "start": 5684, + "end": 5704, + "range": [5684, 5704], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5684, + "end": 5696, + "range": [5684, 5696], + "object": { + "type": "Identifier", + "start": 5684, + "end": 5690, + "range": [5684, 5690], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 5691, + "end": 5696, + "range": [5691, 5696], + "name": "debug" + }, + "computed": false + }, + "right": { + "type": "Literal", + "start": 5699, + "end": 5704, + "range": [5699, 5704], + "value": false, + "raw": "false" + } + } + }, { + "type": "ExpressionStatement", + "start": 5705, + "end": 5726, + "range": [5705, 5726], + "expression": { + "type": "AssignmentExpression", + "start": 5705, + "end": 5726, + "range": [5705, 5726], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5705, + "end": 5721, + "range": [5705, 5721], + "object": { + "type": "Identifier", + "start": 5705, + "end": 5711, + "range": [5705, 5711], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 5712, + "end": 5721, + "range": [5712, 5721], + "name": "extracted" + }, + "computed": false + }, + "right": { + "type": "ArrayExpression", + "start": 5724, + "end": 5726, + "range": [5724, 5726], + "elements": [] + } + } + }, { + "type": "ExpressionStatement", + "start": 5727, + "end": 5748, + "range": [5727, 5748], + "expression": { + "type": "AssignmentExpression", + "start": 5727, + "end": 5748, + "range": [5727, 5748], + "operator": "=", + "left": { + "type": "MemberExpression", + "start": 5727, + "end": 5743, + "range": [5727, 5743], + "object": { + "type": "Identifier", + "start": 5727, + "end": 5733, + "range": [5727, 5733], + "name": "Events" + }, + "property": { + "type": "Identifier", + "start": 5734, + "end": 5743, + "range": [5734, 5743], + "name": "simulated" + }, + "computed": false + }, + "right": { + "type": "ArrayExpression", + "start": 5746, + "end": 5748, + "range": [5746, 5748], + "elements": [] + } + } + }], + "sourceType": "script" +} \ No newline at end of file diff --git a/doc/flare.csv b/doc/flare.csv new file mode 100644 index 0000000..93bcd85 --- /dev/null +++ b/doc/flare.csv @@ -0,0 +1,253 @@ +id,value +flare, +flare.analytics, +flare.analytics.cluster, +flare.analytics.cluster.AgglomerativeCluster,3938 +flare.analytics.cluster.CommunityStructure,3812 +flare.analytics.cluster.HierarchicalCluster,6714 +flare.analytics.cluster.MergeEdge,743 +flare.analytics.graph, +flare.analytics.graph.BetweennessCentrality,3534 +flare.analytics.graph.LinkDistance,5731 +flare.analytics.graph.MaxFlowMinCut,7840 +flare.analytics.graph.ShortestPaths,5914 +flare.analytics.graph.SpanningTree,3416 +flare.analytics.optimization, +flare.analytics.optimization.AspectRatioBanker,7074 +flare.animate, +flare.animate.Easing,17010 +flare.animate.FunctionSequence,5842 +flare.animate.interpolate, +flare.animate.interpolate.ArrayInterpolator,1983 +flare.animate.interpolate.ColorInterpolator,2047 +flare.animate.interpolate.DateInterpolator,1375 +flare.animate.interpolate.Interpolator,8746 +flare.animate.interpolate.MatrixInterpolator,2202 +flare.animate.interpolate.NumberInterpolator,1382 +flare.animate.interpolate.ObjectInterpolator,1629 +flare.animate.interpolate.PointInterpolator,1675 +flare.animate.interpolate.RectangleInterpolator,2042 +flare.animate.ISchedulable,1041 +flare.animate.Parallel,5176 +flare.animate.Pause,449 +flare.animate.Scheduler,5593 +flare.animate.Sequence,5534 +flare.animate.Transition,9201 +flare.animate.Transitioner,19975 +flare.animate.TransitionEvent,1116 +flare.animate.Tween,6006 +flare.data, +flare.data.converters, +flare.data.converters.Converters,721 +flare.data.converters.DelimitedTextConverter,4294 +flare.data.converters.GraphMLConverter,9800 +flare.data.converters.IDataConverter,1314 +flare.data.converters.JSONConverter,2220 +flare.data.DataField,1759 +flare.data.DataSchema,2165 +flare.data.DataSet,586 +flare.data.DataSource,3331 +flare.data.DataTable,772 +flare.data.DataUtil,3322 +flare.display, +flare.display.DirtySprite,8833 +flare.display.LineSprite,1732 +flare.display.RectSprite,3623 +flare.display.TextSprite,10066 +flare.flex, +flare.flex.FlareVis,4116 +flare.physics, +flare.physics.DragForce,1082 +flare.physics.GravityForce,1336 +flare.physics.IForce,319 +flare.physics.NBodyForce,10498 +flare.physics.Particle,2822 +flare.physics.Simulation,9983 +flare.physics.Spring,2213 +flare.physics.SpringForce,1681 +flare.query, +flare.query.AggregateExpression,1616 +flare.query.And,1027 +flare.query.Arithmetic,3891 +flare.query.Average,891 +flare.query.BinaryExpression,2893 +flare.query.Comparison,5103 +flare.query.CompositeExpression,3677 +flare.query.Count,781 +flare.query.DateUtil,4141 +flare.query.Distinct,933 +flare.query.Expression,5130 +flare.query.ExpressionIterator,3617 +flare.query.Fn,3240 +flare.query.If,2732 +flare.query.IsA,2039 +flare.query.Literal,1214 +flare.query.Match,3748 +flare.query.Maximum,843 +flare.query.methods, +flare.query.methods.add,593 +flare.query.methods.and,330 +flare.query.methods.average,287 +flare.query.methods.count,277 +flare.query.methods.distinct,292 +flare.query.methods.div,595 +flare.query.methods.eq,594 +flare.query.methods.fn,460 +flare.query.methods.gt,603 +flare.query.methods.gte,625 +flare.query.methods.iff,748 +flare.query.methods.isa,461 +flare.query.methods.lt,597 +flare.query.methods.lte,619 +flare.query.methods.max,283 +flare.query.methods.min,283 +flare.query.methods.mod,591 +flare.query.methods.mul,603 +flare.query.methods.neq,599 +flare.query.methods.not,386 +flare.query.methods.or,323 +flare.query.methods.orderby,307 +flare.query.methods.range,772 +flare.query.methods.select,296 +flare.query.methods.stddev,363 +flare.query.methods.sub,600 +flare.query.methods.sum,280 +flare.query.methods.update,307 +flare.query.methods.variance,335 +flare.query.methods.where,299 +flare.query.methods.xor,354 +flare.query.methods._,264 +flare.query.Minimum,843 +flare.query.Not,1554 +flare.query.Or,970 +flare.query.Query,13896 +flare.query.Range,1594 +flare.query.StringUtil,4130 +flare.query.Sum,791 +flare.query.Variable,1124 +flare.query.Variance,1876 +flare.query.Xor,1101 +flare.scale, +flare.scale.IScaleMap,2105 +flare.scale.LinearScale,1316 +flare.scale.LogScale,3151 +flare.scale.OrdinalScale,3770 +flare.scale.QuantileScale,2435 +flare.scale.QuantitativeScale,4839 +flare.scale.RootScale,1756 +flare.scale.Scale,4268 +flare.scale.ScaleType,1821 +flare.scale.TimeScale,5833 +flare.util, +flare.util.Arrays,8258 +flare.util.Colors,10001 +flare.util.Dates,8217 +flare.util.Displays,12555 +flare.util.Filter,2324 +flare.util.Geometry,10993 +flare.util.heap, +flare.util.heap.FibonacciHeap,9354 +flare.util.heap.HeapNode,1233 +flare.util.IEvaluable,335 +flare.util.IPredicate,383 +flare.util.IValueProxy,874 +flare.util.math, +flare.util.math.DenseMatrix,3165 +flare.util.math.IMatrix,2815 +flare.util.math.SparseMatrix,3366 +flare.util.Maths,17705 +flare.util.Orientation,1486 +flare.util.palette, +flare.util.palette.ColorPalette,6367 +flare.util.palette.Palette,1229 +flare.util.palette.ShapePalette,2059 +flare.util.palette.SizePalette,2291 +flare.util.Property,5559 +flare.util.Shapes,19118 +flare.util.Sort,6887 +flare.util.Stats,6557 +flare.util.Strings,22026 +flare.vis, +flare.vis.axis, +flare.vis.axis.Axes,1302 +flare.vis.axis.Axis,24593 +flare.vis.axis.AxisGridLine,652 +flare.vis.axis.AxisLabel,636 +flare.vis.axis.CartesianAxes,6703 +flare.vis.controls, +flare.vis.controls.AnchorControl,2138 +flare.vis.controls.ClickControl,3824 +flare.vis.controls.Control,1353 +flare.vis.controls.ControlList,4665 +flare.vis.controls.DragControl,2649 +flare.vis.controls.ExpandControl,2832 +flare.vis.controls.HoverControl,4896 +flare.vis.controls.IControl,763 +flare.vis.controls.PanZoomControl,5222 +flare.vis.controls.SelectionControl,7862 +flare.vis.controls.TooltipControl,8435 +flare.vis.data, +flare.vis.data.Data,20544 +flare.vis.data.DataList,19788 +flare.vis.data.DataSprite,10349 +flare.vis.data.EdgeSprite,3301 +flare.vis.data.NodeSprite,19382 +flare.vis.data.render, +flare.vis.data.render.ArrowType,698 +flare.vis.data.render.EdgeRenderer,5569 +flare.vis.data.render.IRenderer,353 +flare.vis.data.render.ShapeRenderer,2247 +flare.vis.data.ScaleBinding,11275 +flare.vis.data.Tree,7147 +flare.vis.data.TreeBuilder,9930 +flare.vis.events, +flare.vis.events.DataEvent,2313 +flare.vis.events.SelectionEvent,1880 +flare.vis.events.TooltipEvent,1701 +flare.vis.events.VisualizationEvent,1117 +flare.vis.legend, +flare.vis.legend.Legend,20859 +flare.vis.legend.LegendItem,4614 +flare.vis.legend.LegendRange,10530 +flare.vis.operator, +flare.vis.operator.distortion, +flare.vis.operator.distortion.BifocalDistortion,4461 +flare.vis.operator.distortion.Distortion,6314 +flare.vis.operator.distortion.FisheyeDistortion,3444 +flare.vis.operator.encoder, +flare.vis.operator.encoder.ColorEncoder,3179 +flare.vis.operator.encoder.Encoder,4060 +flare.vis.operator.encoder.PropertyEncoder,4138 +flare.vis.operator.encoder.ShapeEncoder,1690 +flare.vis.operator.encoder.SizeEncoder,1830 +flare.vis.operator.filter, +flare.vis.operator.filter.FisheyeTreeFilter,5219 +flare.vis.operator.filter.GraphDistanceFilter,3165 +flare.vis.operator.filter.VisibilityFilter,3509 +flare.vis.operator.IOperator,1286 +flare.vis.operator.label, +flare.vis.operator.label.Labeler,9956 +flare.vis.operator.label.RadialLabeler,3899 +flare.vis.operator.label.StackedAreaLabeler,3202 +flare.vis.operator.layout, +flare.vis.operator.layout.AxisLayout,6725 +flare.vis.operator.layout.BundledEdgeRouter,3727 +flare.vis.operator.layout.CircleLayout,9317 +flare.vis.operator.layout.CirclePackingLayout,12003 +flare.vis.operator.layout.DendrogramLayout,4853 +flare.vis.operator.layout.ForceDirectedLayout,8411 +flare.vis.operator.layout.IcicleTreeLayout,4864 +flare.vis.operator.layout.IndentedTreeLayout,3174 +flare.vis.operator.layout.Layout,7881 +flare.vis.operator.layout.NodeLinkTreeLayout,12870 +flare.vis.operator.layout.PieLayout,2728 +flare.vis.operator.layout.RadialTreeLayout,12348 +flare.vis.operator.layout.RandomLayout,870 +flare.vis.operator.layout.StackedAreaLayout,9121 +flare.vis.operator.layout.TreeMapLayout,9191 +flare.vis.operator.Operator,2490 +flare.vis.operator.OperatorList,5248 +flare.vis.operator.OperatorSequence,4190 +flare.vis.operator.OperatorSwitch,2581 +flare.vis.operator.SortOperator,2023 +flare.vis.Visualization,16540 \ No newline at end of file diff --git a/doc/jsdoc-fix.js b/doc/jsdoc-fix.js new file mode 100755 index 0000000..b189ae0 --- /dev/null +++ b/doc/jsdoc-fix.js @@ -0,0 +1,41 @@ +'use strict'; + +// JSDoc has issues getting the name of `export default class NAME {}` +// this gross regex hacks around that issue until it is fixed. +// See: https://github.com/jsdoc3/jsdoc/issues/1137#issuecomment-174829004 + +const rgxGross = /(\/\*{2}[\W\w]+?\*\/)\s*export\s+default\s+class\s+([^\s]*)/g; +const grossReplace = 'export default $2;\n\n$1\nclass $2'; + +// JSDoc has issues with expressing member properties within a class +// this is another terrible hack to address this issue. +// See: https://github.com/jsdoc3/jsdoc/issues/1301 + +// eslint-disable-next-line no-useless-escape +const rgxMember = /(\@member \{[^\}]+\})(\n[^\/]+\/[\b\s]+)(this\.([^\s]+))/g; +const rgxClassName = /export (default )?class (.+?)\s/; +// eslint-disable-next-line no-useless-escape +const rgxNamespace = /\@memberof ([\.a-zA-Z0-9]+)\s/; + +exports.handlers = { + /** + * Called before parsing a file, giving us a change to replace the source. + * + * @param {*} e - The `beforeParse` event data. + * @param {string} e.filename - The name of the file being parsed. + * @param {string} e.source - The source of the file being parsed. + */ + beforeParse(e) { + const namespace = e.source.match(rgxNamespace); + const className = e.source.match(rgxClassName); + + // Fix members not showing up attached to class + if (namespace && className) { + // console.log(`${namespace[1]}.${className[2]}`); + // Replaces "@member {Type}"" with "@member {Type} PIXI.ClassName#prop" + e.source = e.source.replace(rgxMember, `$1 ${namespace[1]}.${className[2]}#$4$2$3`); + } + + e.source = e.source.replace(rgxGross, grossReplace); + }, +}; \ No newline at end of file diff --git a/doc/out/AbstractPopup.html b/doc/out/AbstractPopup.html new file mode 100644 index 0000000..99a7c7b --- /dev/null +++ b/doc/out/AbstractPopup.html @@ -0,0 +1,2669 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: AbstractPopup

+ + + + +
+ +
+
+

AbstractPopup +

+ +

Class that represents a PixiJS AbstractPopup. +The class is used for various other Popup-like classes +like Popup, Message, Tooltip...

+ +
+
+ +
+
+ + + + +
+
+

+ + + new AbstractPopup + + (opts) + + abstract + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of an AbstractPopup (only for internal use).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the popup.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the popup.

x + + +number + + + + + + 0 + + + + + optional + + + + + +

The x position of the popup. Can be also set after creation with popup.x = 0.

y + + +number + + + + + + 0 + + + + + optional + + + + + +

The y position of the popup. Can be also set after creation with popup.y = 0.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this popup. Possible values are dark, light, red + or a Theme object.

header + + +string +| + +number +| + +PIXI.Text + + + + + + + + + optional + + + + + +

The heading inside the popup as a string, a number (will be + converted to a text) or as a PIXI.Text object.

content + + +string +| + +number +| + +PIXI.DisplayObject + + + + + + + + + optional + + + + + +

A text, a number (will be converted to a text) or + an PIXI.DisplayObject as the content of the popup.

minWidth + + +number + + + + + + 320 + + + + + optional + + + + + +

The minimum width of the popup.

minHeight + + +number + + + + + + 130 + + + + + optional + + + + + +

The minimum height of the popup.

padding + + +number + + + + + + Theme.padding + + + + + optional + + + + + +

The inner spacing (distance from header and content) the the border.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

The color of the button background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

The alpha value of the background.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + Theme.strokeWidth + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

headerStyle + + +object + + + + + + Theme.textStyleLarge + + + + + optional + + + + + +

A textstyle object for the styling of the header. See PIXI.TextStyle + for possible options.

textStyle + + +object + + + + + + Theme.textStyleSmall + + + + + optional + + + + + +

A textstyle object for the styling of the text. See PIXI.TextStyle + for possible options.

radius + + +number + + + + + + Theme.radius + + + + + optional + + + + + +

The radius of the four corners of the popup (which is a rounded rectangle).

onHidden + + +hiddenCallback + + + + + + + + + optional + + + + + +

Executed when the popup gets hidden.

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the popup initially visible (property visible)?

orientation + + +string + + + + + + + + + optional + + + + + +

When set to portrait, the popup cannot be displayed in landscape mode. When set + to landscape, the popup cannot be displayed in portrait mode.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Graphics
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Badge.html b/doc/out/Badge.html new file mode 100644 index 0000000..65fa067 --- /dev/null +++ b/doc/out/Badge.html @@ -0,0 +1,2117 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Badge

+ + + + +
+ +
+
+

Badge +

+ +

Class that represents a PixiJS Badge.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Badge + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Badge.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the badge.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
minWidth + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum width of the badge.

minHeight + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum height of the badge.

padding + + +number + + + + + + Theme.padding / 2 + + + + + optional + + + + + +

The inner spacing of the badge.

tooltip + + +string +| + +object + + + + + + + + + optional + + + + + +

A string for the label of the tooltip or an object to configure the tooltip + to display.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+// Add an DisplayObject to the app
+const circle = new PIXI.Graphics()
+circle.beginFill(0x5251a3)
+circle.drawCircle(50, 50, 40)
+app.scene.addChild(circle)
+
+const badge1 = new Badge({
+    object: circle,
+    container: app.scene,
+    content: 'Das Gesetz ist der Freund des Schwachen.'
+})
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + inherited + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + inherited + + + overrides + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/BlurFilter.html b/doc/out/BlurFilter.html new file mode 100644 index 0000000..31ab95c --- /dev/null +++ b/doc/out/BlurFilter.html @@ -0,0 +1,1549 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: BlurFilter

+ + + + +
+ +
+
+

BlurFilter +

+ +

A Gaussian blur filter. With this filter, you can blur an area of a PIXI.DisplayObject. This cannot +be done with the PIXI.filters.BlurFilter (when you use the PIXI.filters.BlurFilter with +an filter area, all pixels outside of the area are not displayed). Attention: The area of +the filter is always in global scope, NOT relative to the PIXI.DisplayObject the filter +is assigned to!

+ +
+
+ +
+
+ + + + +
+
+

+ + + new BlurFilter + + (shape, blur) + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
shape + + +PIXI.Rectangle +| + +PIXI.Circle +| + +PIXI.DisplayObject + + + + + + + + + + + + +

The area where the blur effect should be applied to. Relative to the + canvas, NOT relative to the PIXI.DisplayObject where the blur effect is assigned to!

blur + + +number + + + + + + 50 + + + + + optional + + + + + +

The strength of the blur.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 480,
+    height: 270,
+    transparent: false
+}).setup().run()
+
+// Add a video sprite
+const sprite = new PIXI.Sprite(PIXI.Texture.fromVideo("assets/blurfilter.mp4"))
+sprite.width = app.size.width
+sprite.height = app.size.height
+app.scene.addChild(sprite)
+
+// Create the filter and assign it to the scene
+const blurFilter = new BlurFilter(new PIXI.Rectangle(20, 20, 80, 60))
+app.scene.filters = [blurFilter]
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Filter
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + blur + number + + + + +

+
+ + +
+
+ +
+

The strength of the blur.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + shape + PIXI.Rectangle | PIXI.Circle | PIXI.DisplayObject + + + + +

+
+ + +
+
+ +
+

The blur shape.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Button.html b/doc/out/Button.html new file mode 100644 index 0000000..11bd946 --- /dev/null +++ b/doc/out/Button.html @@ -0,0 +1,3567 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Button

+ + + + +
+ +
+
+

Button +

+ +

Class that represents a PixiJS Button.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Button + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Button.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the button.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the button.

label + + +string + + + + + + + + + optional + + + + + +

The label of the button.

x + + +number + + + + + + 0 + + + + + optional + + + + + +

The x position of the button. Can be also set after creation with button.x = 0.

y + + +number + + + + + + 0 + + + + + optional + + + + + +

The y position of the button. Can be also set after creation with button.y = 0.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this button. Possible values are dark, light, red + or a Theme object.

minWidth + + +number + + + + + + 44 + + + + + optional + + + + + +

The minimum width of the button.

minHeight + + +number + + + + + + 44 + + + + + optional + + + + + +

The minimum height of the button.

padding + + +number + + + + + + Theme.padding + + + + + optional + + + + + +

The inner spacing (distance from icon and/or label) to the border.

icon + + +string +| + +PIXI.DisplayObject + + + + + + + + + optional + + + + + +

The icon of the button. Can be a predefined one, an URL or an PIXI.DisplayObject.

iconActive + + +string +| + +PIXI.DisplayObject + + + + + + icon + + + + + optional + + + + + +

The icon of the button when activated. Can be a predefined one, an URL or an PIXI.DisplayObject.

iconPosition + + +string + + + + + + left + + + + + optional + + + + + +

The position of the icon in relation to the label. Can be left or right.

iconColor + + +number + + + + + + Theme.iconColor + + + + + optional + + + + + +

The color of the icon (set by the tint property) as a hex value.

iconColorActive + + +number + + + + + + Theme.iconColorActive + + + + + optional + + + + + +

The color of the icon when activated.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

The color of the button background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

The alpha value of the background.

fillActive + + +number + + + + + + Theme.fillActive + + + + + optional + + + + + +

The color of the button background when activated.

fillActiveAlpha + + +number + + + + + + Theme.fillActiveAlpha + + + + + optional + + + + + +

The alpha value of the background when activated.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + Theme.strokeWidth + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

strokeActive + + +number + + + + + + Theme.strokeActive + + + + + optional + + + + + +

The color of the border when activated.

strokeActiveWidth + + +number + + + + + + Theme.strokeActiveWidth + + + + + optional + + + + + +

The width of the border in pixel when activated.

strokeActiveAlpha + + +number + + + + + + Theme.strokeActiveAlpha + + + + + optional + + + + + +

The alpha value of the border when activated.

textStyle + + +object + + + + + + Theme.textStyle + + + + + optional + + + + + +

A textstyle object for the styling of the label. See PIXI.TextStyle + for possible options.

textStyleActive + + +number + + + + + + Theme.textStyleActive + + + + + optional + + + + + +

A textstyle object for the styling of the label when the + button is activated. See PIXI.TextStyle for possible options.

style + + +string + + + + + + default + + + + + optional + + + + + +

A shortcut for styling options. Possible values are default, link.

radius + + +number + + + + + + Theme.radius + + + + + optional + + + + + +

The radius of the four corners of the button (which is a rounded rectangle).

disabled + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the button disabled? When disabled, the button has a lower alpha value + and cannot be clicked (interactive is set to false).

active + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the button initially active?

action + + +actionCallback + + + + + + + + + optional + + + + + +

Executed when the button was triggered (by pointerup).

beforeAction + + +beforeActionCallback + + + + + + + + + optional + + + + + +

Executed before the main action is triggered.

afterAction + + +afterActionCallback + + + + + + + + + optional + + + + + +

Executed after the main action was triggered.

type + + +string + + + + + + default + + + + + optional + + + + + +

The type of the button. Can be default or checkbox. When the type is + checkbox, the active state is toggled automatically.

align + + +string + + + + + + center + + + + + optional + + + + + +

The horizontal position of the label and the icon. Possible values are + left, center and right. Only affects the style when the minWidth is bigger than the width of the icon and label.

verticalAlign + + +string + + + + + + middle + + + + + optional + + + + + +

The vertical position of the label and the icon. Possible values are + top, middle and button. Only affects the style when the minHeight is bigger than the height of the icon and label.

tooltip + + +string +| + +object + + + + + + + + + optional + + + + + +

A string for the label of the tooltip or an object to configure the tooltip + to display.

badge + + +string +| + +object + + + + + + + + + optional + + + + + +

A string for the label of the badge or an object to configure the badge to display. + If the parameter is an object, all badge options can be set plus the following:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
align + + +string + + + + + + right + + + + + optional + + + + + +

The horizontal alignment of the badge. Possible values: left, center, right

verticalAlign + + +string + + + + + + top + + + + + optional + + + + + +

The vertical alignment of the badge. Possible values: top, middle, bottom

offsetLeft + + +number + + + + + + 0 + + + + + optional + + + + + +

The horizontal shift of the badge.

offsetTop + + +number + + + + + + 0 + + + + + optional + + + + + +

The vertical shift of the badge.

+
visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the button initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the button
+const button = new Button({
+    label: 'My Button',
+    action: () => console.log('Button was clicked')
+})
+
+// Add the button to a DisplayObject
+app.scene.addChild(button)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Container
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + active + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the active state.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + disabled + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the disabled state. When disabled, the button cannot be clicked.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + iconColor + number + + + + +

+
+ + +
+
+ +
+

Gets or sets the color of the current icon (no matter how the status is). Changing the color, changes +the tint property of the icon sprite.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + capture + + (event) + + + + +

+ + + + +
+ + +
+
+ + +
+

Captures an event to inform InteractionMapper about processed events.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +event +| + +PIXI.InteractionEvent + + + + + +

The PIXI event to capture.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + hide + + ()Button + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the button (sets his alpha values to 0).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Button + + + A reference to the button for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()Button + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the button. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Button + + + A reference to the button for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()Button + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the button (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Button + + + A reference to the button for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/ButtonGroup.html b/doc/out/ButtonGroup.html new file mode 100644 index 0000000..d7de39a --- /dev/null +++ b/doc/out/ButtonGroup.html @@ -0,0 +1,2963 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: ButtonGroup

+ + + + +
+ +
+
+

ButtonGroup +

+ +

Class that represents a PixiJS ButtonGroup.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new ButtonGroup + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a ButtonGroup.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the button group.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the button group.

x + + +number + + + + + + 0 + + + + + optional + + + + + +

The x position of the button group. Can be also set after creation with buttonGroup.x = 0.

y + + +number + + + + + + 0 + + + + + optional + + + + + +

The y position of the button group. Can be also set after creation with buttonGroup.y = 0.

buttons + + +Array.<object> + + + + + + [] + + + + + optional + + + + + +

An array of the buttons of the button group. One item of the array (one object) + can have exactly the same properties as an Button object when instantiating a Button. If a property of the button group + conflicts with a property of a button object, the value from the button object will be used.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this button group. Possible values are dark, light, red + or a Theme object.

minWidth + + +number + + + + + + 44 + + + + + optional + + + + + +

Button: The minimum width of one button.

minHeight + + +number + + + + + + 44 + + + + + optional + + + + + +

Button: The minimum height of one button.

padding + + +number + + + + + + Theme.padding + + + + + optional + + + + + +

Button: The inner spacing (distance from icon and/or label) the the border.

margin + + +number + + + + + + Theme.margin + + + + + optional + + + + + +

The outer spacing (distance from one button to the previous/next button).

iconPosition + + +string + + + + + + left + + + + + optional + + + + + +

Button: The position of the icon in relation to the label. Can be left or right.

iconColor + + +number + + + + + + Theme.iconColor + + + + + optional + + + + + +

Button: The color of the icon (set by the tint property) as a hex value.

iconColorActive + + +number + + + + + + Theme.iconColorActive + + + + + optional + + + + + +

Button: The color of the icon when activated.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

Button: The color of the button background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

Button: The alpha value of the background.

fillActive + + +number + + + + + + Theme.fillActive + + + + + optional + + + + + +

Button: The color of the button background when activated.

fillActiveAlpha + + +number + + + + + + Theme.fillActiveAlpha + + + + + optional + + + + + +

Button: The alpha value of the background when activated.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

Button: The color of the border as a hex value.

strokeWidth + + +number + + + + + + Theme.strokeWidth + + + + + optional + + + + + +

Button: The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

Button: The alpha value of the border.

strokeActive + + +number + + + + + + Theme.strokeActive + + + + + optional + + + + + +

Button: The color of the border when activated.

strokeActiveWidth + + +number + + + + + + Theme.strokeActiveWidth + + + + + optional + + + + + +

Button: The width of the border in pixel when activated.

strokeActiveAlpha + + +number + + + + + + Theme.strokeActiveAlpha + + + + + optional + + + + + +

Button: The alpha value of the border when activated.

textStyle + + +object + + + + + + Theme.textStyle + + + + + optional + + + + + +

Button: A textstyle object for the styling of the label. See PIXI.TextStyle + for possible options.

textStyleActive + + +number + + + + + + Theme.textStyleActive + + + + + optional + + + + + +

Button: A textstyle object for the styling of the label when the + button is activated. See PIXI.TextStyle for possible options.

style + + +string + + + + + + default + + + + + optional + + + + + +

A shortcut for styling options. Possible values are default, link.

radius + + +number + + + + + + Theme.radius + + + + + optional + + + + + +

Button: The radius of the four corners of the button (which is a rounded rectangle).

disabled + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the button group disabled? When disabled, the button group has a lower alpha value + and cannot be clicked (interactive of every button is set to false).

type + + +string + + + + + + default + + + + + optional + + + + + +

The type of the button group. Can be default, checkbox or radio. When the type is + checkbox, the active state is toggled for each button automatically. When the type is radio, only one button can + be activated at the same time.

orientation + + +string + + + + + + horizontal + + + + + optional + + + + + +

The orientation of the button group. Can be horizontal or vertical.

align + + +string + + + + + + center + + + + + optional + + + + + +

Button: The horizontal position of the label and the icon. Possible values are + left, center and right. Only affects the style when the minWidth is bigger than the width of the icon and label.

verticalAlign + + +string + + + + + + middle + + + + + optional + + + + + +

Button: The vertical position of the label and the icon. Possible values are + top, middle and bottom. Only affects the style when the minHeight is bigger than the height of the icon and label.

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the button group initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the button group
+const buttonGroup = new ButtonGroup({
+    buttons: [
+        {label: 'Button 1', action: event => console.log(event)},
+        {label: 'Button 2', action: event => console.log(event)},
+        {label: 'Button 3', action: event => console.log(event)}
+    ],
+    minWidth: 100
+})
+
+// Add the button group to a DisplayObject
+app.scene.addChild(buttonGroup)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Graphics
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + disabled + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the disabled state. When disabled, no button of the button group can be clicked.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + ()ButtonGroup + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the button group (sets his alpha value to 0).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + ButtonGroup + + + A reference to the button group for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()ButtonGroup + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the button group. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + ButtonGroup + + + A reference to the button group for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()ButtonGroup + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the button group (sets his alpha value to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + ButtonGroup + + + A reference to the button group for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/DeepZoomImage.html b/doc/out/DeepZoomImage.html new file mode 100644 index 0000000..979a6c3 --- /dev/null +++ b/doc/out/DeepZoomImage.html @@ -0,0 +1,4840 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: DeepZoomImage

+ + + + +
+ +
+
+

DeepZoomImage +

+ +

The main class of a deeply zoomable image that is represented by a hierarchy +of tile layers for each zoom level. This gives the user the impression that +even huge pictures (up to gigapixel-images) can be zoomed instantaneously, +since the tiles at smaller levels are scaled immediately and overloaded by +more detailed tiles at the larger level as fast as possible.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new DeepZoomImage + + (deepZoomInfo) + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
deepZoomInfo + + +DeepZoomInfo + + + + + +

Information extracted from a JSON-Object

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + baseSize + + + + + +

+
+ + +
+
+ +
+

Getter for the DeepZoomInfo base level size.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + foreground + + + + + +

+
+ + +
+
+ +
+

Getter for PIXI.Container foreground layer. +Adds a PIXI.Container if necessary.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + height + + + + + +

+
+ + +
+
+ +
+

Getter for the current height.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + maxScale + + + + + +

+
+ + +
+
+ +
+

Getter for the max scale factor.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + pixelSize + + + + + +

+
+ + +
+
+ +
+

Getter for the current scaled size in pixels.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + width + + + + + +

+
+ + +
+
+ +
+

Getter for the current width.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + _calculateBounds + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Overrides PIXI.Container._calculateBounds() +Only considers the base size and reduces the calculation to a single +rect.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + _createTiles + + (level)Tiles + + + + +

+ + + + +
+ + +
+
+ + +
+

Private method: creates all tiles for a given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Tiles + + +
    +
  • tiles
  • +
+ + + + +
+ + + +
+
+

+ + + activate + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Activates the textures on the DeepZoomImage.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + addTiles + + (key, tiles) + + + + +

+ + + + +
+ + +
+
+ + +
+

Adds a tile layer to the DeepZoomImage.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
key + + +string + + + + + +

the access key

tiles + + +Tiles + + + + + +

the tile layer object

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + allTiles + + (tiles, level)Array.<Array> + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns a list of all tiles of a given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
tiles + + +Tiles + + + + + +

the grid of tiles

level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Array.<Array> + + +
    +
  • An array of [url, col, row] arrays
  • +
+ + + + +
+ + + +
+
+

+ + + bringTilesToFront + + (tiles) + + + + +

+ + + + +
+ + +
+
+ + +
+

Ensure that the given tiles layer is the topmost one and visible.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
tiles + + +* + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + calculateBounds + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Overrides PIXI.Container.calculateBounds() +Skips the children and only considers the deep zoom base size. Calls +the also overwritten _calculateBounds method.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + changedTiles + + (tiles, level)object + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns all changed tiles for a given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
tiles + + +Tiles + + + + + +

the grid of tiles

level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + object + + +
    +
  • An object with the keys added and removed which values are [url, col, row] arrays
  • +
+ + + + +
+ + + +
+
+

+ + + deactivate + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Dectivates the textures on the DeepZoomImage.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + destroyObsoleteTiles + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Destroy tiles in all layers that are no longer needed

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + destroyTiles + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Destroy tiles in all layers that are not part of the +visible quadTrees

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + destroyTilesAboveLevel + + (level) + + + + +

+ + + + +
+ + +
+
+ + +
+

Destroys all tiles above a given level to ensure that the memory can +be reused.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + destroyUnneededTiles + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Destroy tiles in all layers that are no longer needed

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + ensureAllTiles + + (level) + + + + +

+ + + + +
+ + +
+
+ + +
+

Ensures that all tiles of a given level are loaded.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + ensureTiles + + (level)Tiles + + + + +

+ + + + +
+ + +
+
+ + +
+

Ensures that all needed tiles of a given level are loaded. Creates +a new Tiles layer if necessary

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Tiles + + + tiles
+ + + + +
+ + + +
+
+

+ + + levelAndAlphaForScale + + (scale) + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns the tile layer level that corresponds to the given scale.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
scale + + +number + + + + + +

the scale factor

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + levelForScale + + (scale) + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns the tile layer level that corresponds to the given scale.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
scale + + +number + + + + + +

the scale factor

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + neededTiles + + (tiles, level, debug)Array.<Array> + + + + +

+ + + + +
+ + +
+
+ + +
+

Loads all tiles that are needed to fill the app bounds.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
tiles + + +Tiles + + + + + + + +

the grid of tiles

level + + +number + + + + + + + +

The zoom level of the grid

debug + + +boolean + + + + + + false + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Array.<Array> + + +
    +
  • An array of [url, col, row] arrays
  • +
+ + + + +
+ + + +
+
+

+ + + populateAllTiles + + (tiles, level) + + + + +

+ + + + +
+ + +
+
+ + +
+

Populates all tiles for a given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
tiles + + +Tiles + + + + + +

the grid of tiles

level + + +number + + + + + +

The zoom level of the grid

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + populateTiles + + (tiles, level, onlyone, about) + + + + +

+ + + + +
+ + +
+
+ + +
+

Loads all tiles that are needed to fill the browser window. +If the optional about parameter is provided (as a point with col as x, +and row as y attr) the tiles are sorted by the distance to this point.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
tiles + + +Tiles + + + + + +

the grid of tiles

level + + +number + + + + + +

The zoom level of the grid +Optional parameter:

onlyone + + +boolean + + + + + +

if true only one tile is loaded

about + + +PIXI.Point + + + + + +

point of interaction

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + setup + + (deepZoomInfo, center) + + + + +

+ + + + +
+ + +
+
+ + +
+

Reads the DeepZoomInfo object and initializes all tile layers. +Called by the constructor. +Creates the sprite for the loaded texture and add the sprite to the tile +layer.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
deepZoomInfo + + +Object + + + + + +

the DeepZoomInfo instance

center + + +boolean + + + + + +

If true ensures that the pivot is set to the center

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + setupTiles + + (center) + + + + +

+ + + + +
+ + +
+
+ + +
+

Default setup method for tiles. Loads all tiles of the current level. + Can be overwritten in subclasses.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
center + + +boolean + + + + + + false + + + +

If true ensures that the pivot is set to the center

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + thumbnail + + ()Sprite + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns a single sprite that can be used a thumbnail representation of +large images.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Sprite + + + sprite - A sprite with a single tile texture
+ + + + +
+ + + +
+
+

+ + + tintObsoleteTiles + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Tint tiles in all layers that are no longer needed

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + transformed + + (translated, scale, about, fast, debug) + + + + +

+ + + + +
+ + +
+
+ + +
+

A callback function that can be used by a Scatter view to inform +the zoomable image that it has been moved, rotated or scaled, and should +load tiles accordingly.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
translated + + +PIXI.Point + + + + + +

the movement of the scatter

scale + + +number + + + + + +

the zoom factor

about + + +PIXI.Point + + + + + +

the anchor point of the zoom

fast + + +boolean + + + + + +

informs the callback to return as fast as possible, + i.e. after loading a single tile

debug + + +boolean + + + + + +

log debug infos

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/DeepZoomInfo.html b/doc/out/DeepZoomInfo.html new file mode 100644 index 0000000..a7ba186 --- /dev/null +++ b/doc/out/DeepZoomInfo.html @@ -0,0 +1,2353 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: DeepZoomInfo

+ + + + +
+ +
+
+

DeepZoomInfo +

+ +

A utility class that holds information typically provided by DZI files, i.e. +height and width of the overall image, overlap, and image type.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new DeepZoomInfo + + (attrs) + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
attrs + + +obj + + + + + +

A JSON-Object holding the listed keys and values

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
Example
+ + + +
{
+        "tileSize": 1024,
+        "format": "jpeg",
+        "overlap": 1,
+        "height": 4794,
+        "width": 4095,
+        "clip": { "minLevel": 12, "maxLevel": 20, "startCol": 301436, "startRow": 354060 },
+                  // optional: minLevel and maxLevel define the level bounds
+                  // startCol: first col at maxLevel
+                  // startRow: first row at maxLevel
+        "path": "var/Vermeer/Vermeer_files",
+        "type": "dzi",  // optional: dzi (default) or map
+        "urlTileTemplate": "{path}/{level}/{column}/{row}.{format}"
+          // optional: {path}/{level}/{column}_{row}.{format} (default) or
+          // a template String with the format of the URL
+    }
+ + + +
+ + +
+ + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+

+ + + dimensions + + (level)array + + + + +

+ + + + +
+ + +
+
+ + +
+

Computes the columns and rows as well as scaled width and height.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The level of the wanted layer

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + array + + + [cols, rows, width, height]
+ + + + +
+ + + +
+
+

+ + + getDimensions + + (level)array + + + + +

+ + + + +
+ + +
+
+ + +
+

Computes the scaled width and height of the given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The level of the wanted layer

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + array + + + size - The width and height
+ + + + +
+ + + +
+
+

+ + + getNumTiles + + (level)array + + + + +

+ + + + +
+ + +
+
+ + +
+

Computes the number of cols and rows of tiles.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The level of the wanted layer

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + array + + + size - The cols and rows
+ + + + +
+ + + +
+
+

+ + + getScale + + (level)number + + + + +

+ + + + +
+ + +
+
+ + +
+

Computes the scale at the given level.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The level of the wanted layer

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + number + + + scale
+ + + + +
+ + + +
+
+

+ + + imageForURL + + (url, complete)Image + + + + +

+ + + + +
+ + +
+
+ + +
+

Loads the image for the given url and executes a callback function + on completion.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
url + + +string + + + + + +

The url of the tile

complete + + +function + + + + + +

The callback function

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Image + + + obj
+ + + + +
+ + + +
+
+

+ + + urlForTile + + (level, column, row)string + + + + +

+ + + + +
+ + +
+
+ + +
+

Computes the url for the given level, column and and row.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
level + + +number + + + + + +

The level of the wanted layer

column + + +number + + + + + +

The column of the tile

row + + +number + + + + + +

The row of the tile

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + string + + + url
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Flippable.html b/doc/out/Flippable.html new file mode 100644 index 0000000..9e8f72e --- /dev/null +++ b/doc/out/Flippable.html @@ -0,0 +1,2263 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Flippable

+ + + + +
+ +
+
+

Flippable +

+ +

Class that represents a PixiJS Flippable.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Flippable + + (front, back, renderer, opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Flippable.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
front + + +PIXI.DisplayObject + + + + + + + + + + +

The object to show initially. Should have been added to the scene.

back + + +PIXI.DisplayObject + + + + + + + + + + +

The object to show on the backside. Should have not been added to the scene.

renderer + + +PIXI.WebGLRenderer +| + +PIXI.CanvasRenderer + + + + + + + + + + +

The renderer of the application.

opts + + +object + + + + + + + optional + + + + + +

An options object which can contain the following properties.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
duration + + +number + + + + + + 1 + + + + + optional + + + + + +

The duration of the flip animation in seconds.

ease + + +GSAP.Ease + + + + + + Power2.easeOut + + + + + optional + + + + + +

The ease of the flip animation.

shadow + + +boolean + + + + + + false + + + + + optional + + + + + +

Should be a shadow been display during the animation?

eulerX + + +numer + + + + + + 0 + + + + + optional + + + + + +

The shift of the x-axis during the animation.

eulerY + + +numer + + + + + + 0 + + + + + optional + + + + + +

The shift of the y-axis during the animation.

eulerEase + + +GSAP.Ease + + + + + + Sine.easeOut + + + + + optional + + + + + +

The ease of the shift.

useBackTransforms + + +boolean + + + + + + false + + + + + optional + + + + + +

When set to true, the flip animation also animates to the transform parameters of the back-object.

transformEase + + +GSAP.Ease + + + + + + Power2.easeOut + + + + + optional + + + + + +

The ease of the transform.

focus + + +numer + + + + + + 800 + + + + + optional + + + + + +

The value of the focus of the 3D camera (see pixi-projection).

near + + +numer + + + + + + 10 + + + + + optional + + + + + +

The near value of the 3D camera (see pixi-projection).

far + + +numer + + + + + + 10000 + + + + + optional + + + + + +

The far value of the 3D camera (see pixi-projection).

orthographic + + +boolean + + + + + + false + + + + + optional + + + + + +

Should the flip animation be an orthographic animation?

onStart + + +function + + + + + + null + + + + + optional + + + + + +

A callback executed on start of the flip animation.

onUpdate + + +function + + + + + + null + + + + + optional + + + + + +

A callback executed on each step of the flip animation.

onComplete + + +function + + + + + + null + + + + + optional + + + + + +

A callback executed when the flip animation is finished.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
const front = PIXI.Sprite.fromImage('./assets/front.jpg')
+const back = PIXI.Sprite.fromImage('./assets/back.jpg')
+app.scene.addChild(front)
+
+// Create the flippable
+const flippable = new Flippable(front, back, app.renderer)
+
+front.interactive = true
+front.on('click', event => flippable.toggle())
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.projection.Camera3d
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + flipped + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the flipped state.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + frontSideInFront + boolean + + + + +

+
+ + +
+
+ +
+

Gets the alignment state. true if the front side is in front, false otherwise.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + layout + + ()Flippable + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the camera.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Flippable + + + A reference to the flippable for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/FontInfo.html b/doc/out/FontInfo.html new file mode 100644 index 0000000..8049414 --- /dev/null +++ b/doc/out/FontInfo.html @@ -0,0 +1,1310 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: FontInfo

+ + + + +
+ +
+
+

FontInfo +

+ +

Defines usefull default text styles.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new FontInfo + + () + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Hypenate.html b/doc/out/Hypenate.html new file mode 100644 index 0000000..9ce1d00 --- /dev/null +++ b/doc/out/Hypenate.html @@ -0,0 +1,1512 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Hypenate

+ + + + +
+ +
+
+

Hypenate +

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Hypenate + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Static methods to support hyphenation of lines.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+

+ + + Hypenate.splitLines + + (text, style, width)string + + static + + +

+ + + + +
+ + +
+
+ + +
+

Main method and entry point for text hyphenation

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
text + + +* + + + + + +
style + + +* + + + + + +
width + + +* + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + string + + +
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/InteractivePopup.html b/doc/out/InteractivePopup.html new file mode 100644 index 0000000..02ca997 --- /dev/null +++ b/doc/out/InteractivePopup.html @@ -0,0 +1,2079 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: InteractivePopup

+ + + + +
+ +
+
+

InteractivePopup +

+ +

Class that represents a PixiJS InteractivePopup. +The class is used for various other Popup-like classes +like Popup, Message...

+ +
+
+ +
+
+ + + + +
+
+

+ + + new InteractivePopup + + (opts) + + abstract + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of an InteractivePopup (only for internal use).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the popup.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
closeOnPopup + + +boolean + + + + + + false + + + + + optional + + + + + +

Should the popup be closed when the user clicks on the popup?

closeButton + + +boolean + + + + + + true + + + + + optional + + + + + +

Should a close button be displayed on the upper right corner?

button + + +object + + + + + + + + + optional + + + + + +

A Button object to be display on the lower right corner.

buttonGroup + + +object + + + + + + + + + optional + + + + + +

A ButtonGroup object to be displayed on the lower right corner.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + inherited + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + + overrides + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/LabeledGraphics.exports.LabeledGraphics.html b/doc/out/LabeledGraphics.exports.LabeledGraphics.html new file mode 100644 index 0000000..b289513 --- /dev/null +++ b/doc/out/LabeledGraphics.exports.LabeledGraphics.html @@ -0,0 +1,1312 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: exports.LabeledGraphics

+ + + + +
+ +
+
+

LabeledGraphics.exports.LabeledGraphics +

+ +
+
+ +
+
+ + + + +
+
+

+ + + new LabeledGraphics.exports.LabeledGraphics + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of LabeledGraphics and defines a local label cache.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/LabeledGraphics.html b/doc/out/LabeledGraphics.html new file mode 100644 index 0000000..8a8eeda --- /dev/null +++ b/doc/out/LabeledGraphics.html @@ -0,0 +1,2377 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: LabeledGraphics

+ + + + +
+ +
+
+

LabeledGraphics +

+ +
+
+ +
+
+ + + + +
+
+

+ + + new LabeledGraphics + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

A specialization of the PIXI.Graphics class that allows to +resuse and place labels across different layout variants

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Graphics
  • +
+ + + + + + + +

Classes

+ +
+
exports.LabeledGraphics
+ +
+ + + + + + + +

Methods

+ +
+ +
+
+

+ + + clear + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Ensures that labels are hidden on clear.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + debugInfos + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Logs debugging infos

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + ensureLabel + + (key, label, attrs, fontInfo)PIXI.Text + + + + +

+ + + + +
+ + +
+
+ + +
+

Main additional method. Ensures that a text object is created that is cached +under the given key.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
key + + +* + + + + + + + + + + + + +

The cache key

label + + +* + + + + + + + + + + + + +

The label to show

attrs + + +* + + + + + + {} + + + + + optional + + + + + +

Defines attributes of the text object. + align: 'right', 'left', or 'center' + justify: 'top', 'bottom', or 'center' + maxLines: {integer} truncates the text and adds ellipsis + maxHeight: {number} truncates text that needs more space and adds ellipsis + maxWidth: {number} word wraps text using hyphenation if possible

fontInfo + + +* + + + + + + FontInfo.normal + + + + + optional + + + + + +

Defines PIXI.TextStyle attributes

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXI.Text + + +
    +
  • instance
  • +
+ + + + +
+ + + +
+
+

+ + + getLabel + + (key)Object + + + + +

+ + + + +
+ + +
+
+ + +
+

Returns the label for the given key.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
key + + +* + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Object + + +
+ + + + +
+ + + +
+
+

+ + + hideLabel + + (key) + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the label with the given key.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
key + + +* + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + removeLabel + + (key) + + + + +

+ + + + +
+ + +
+
+ + +
+

Removes the label with the given key.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
key + + +* + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + truncateLabel + + (text, style, maxLines)string + + + + +

+ + + + +
+ + +
+
+ + +
+

Private method that truncates the text and adds an ellipsis if there are more lines +than wanted

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
text + + +* + + + + + + + + + + + + +
style + + +* + + + + + + + + + + + + +
maxLines + + +* + + + + + + Infinity + + + + + optional + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + string + + +
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/List.html b/doc/out/List.html new file mode 100644 index 0000000..54c7f98 --- /dev/null +++ b/doc/out/List.html @@ -0,0 +1,2301 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: List

+ + + + +
+ +
+
+

List +

+ +

Class that represents a PixiJS List.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new List + + (items, opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Flippable.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
items + + +Array.<PIXI.DisplayObject> + + + + + + + + + + +

An array of PIXI.DisplayObjects.

opts + + +object + + + + + + + optional + + + + + +

An options object which can contain the following properties.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
width + + +number + + + + + + + + + optional + + + + + +

The width of the list. If the items are larger than this width, the overflow + will be hidden.

height + + +number + + + + + + + + + optional + + + + + +

The height of the list. If the items are larger than this height, the overflow + will be hidden.

padding + + +number + + + + + + 10 + + + + + optional + + + + + +

The inner spacing (distance from one item to the previous/next item).

margin + + +number + + + + + + 10 + + + + + optional + + + + + +

The outer spacing (distance from one item to the border).

orientation + + +string + + + + + + vertical + + + + + optional + + + + + +

The orientation of the button group. Can be horizontal or vertical.

align + + +string + + + + + + left + + + + + optional + + + + + +

The horizontal position of the items. Possible values are + left, center and right.

verticalAlign + + +string + + + + + + middle + + + + + optional + + + + + +

The vertical position of the items. Possible values are + top, middle and bottom.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
const elephant1 = PIXI.Sprite.fromImage('./assets/elephant-1.jpg')
+const elephant2 = PIXI.Sprite.fromImage('./assets/elephant-2.jpg')
+
+// Create the list
+const list = new List([elephant1, elephant2])
+
+app.scene.addChild(list)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Container
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + innerHeight + + + + + +

+
+ + +
+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + innerWidth + + + + + +

+
+ + +
+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + capture + + (event) + + + + +

+ + + + +
+ + +
+
+ + +
+

Captures an event to inform InteractionMapper about processed events.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +event +| + +PIXI.InteractionEvent + + + + + +

The PIXI event to capture.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + layout + + ()List + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the list (the width or the height).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + List + + + A reference to the list for chaining.
+ + + + +
+ + + +
+
+

+ + + resize + + (widthOrHeight) + + + + +

+ + + + +
+ + +
+
+ + +
+

Resizes the list.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
widthOrHeight + + +number + + + + + +

The new width (if orientation is horizontal) or height (if orientation is vertical) of the list.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + setItems + + (items)List + + + + +

+ + + + +
+ + +
+
+ + +
+

Replaces the existing items and relayouts the list.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
items + + +Array.<PIXI.DisplayObject> + + + + + +

An array of PIXI.DisplayObjects.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + List + + + A reference to the list for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Message.html b/doc/out/Message.html new file mode 100644 index 0000000..f55322a --- /dev/null +++ b/doc/out/Message.html @@ -0,0 +1,1905 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Message

+ + + + +
+ +
+
+

Message +

+ +

Class that represents a Message. A message pops up and disappears after a specific amount of time.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Message + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Message.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the message.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
app + + +PIXIApp + + + + + + window.app + + + + + optional + + + + + +

The PIXIApp where this message belongs to.

closeButton + + +boolean + + + + + + false + + + + + optional + + + + + +

Should a close button be displayed in the upper right corner?

minWidth + + +number + + + + + + 280 + + + + + optional + + + + + +

The minimum width of the message box. Automatically expands with the content.

minHeight + + +number + + + + + + 100 + + + + + optional + + + + + +

The minimum height of the message box. Automatically expands with the content.

margin + + +number + + + + + + Theme.margin + + + + + optional + + + + + +

The outer spacing of the message box.

align + + +string + + + + + + right + + + + + optional + + + + + +

The horizontal position of the message box relative to the app. Possible + values are left, center, right.

verticalAlign + + +string + + + + + + top + + + + + optional + + + + + +

The vertical position of the message box relative to the app. Possible + values are top, middle, bottom.

duration + + +number + + + + + + 5 + + + + + optional + + + + + +

The duration in seconds when the message box should disappear.

autoClose + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the message box be closed automatically?

closeDuration + + +number + + + + + + Theme.fast + + + + + optional + + + + + +

The duration in seconds of the closing of the message box.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the PixiJS App
+const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+// Create a button
+let button = new Button({
+    label: 'Click me',
+    action: e => {
+        const message = new Message({
+            app: app,
+            header: 'Header',
+            content: 'Text.'
+        })
+        app.scene.addChild(message)
+    }
+})
+
+// Add the button to the scene
+app.scene.addChild(button)
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+

+ + + layout + + ()Message + + + + + overrides + +

+ + + + +
+ + +
+
+ + +
+

Relayouts the position of the message box.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Message + + + Returns the message box for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Modal.html b/doc/out/Modal.html new file mode 100644 index 0000000..5f120ce --- /dev/null +++ b/doc/out/Modal.html @@ -0,0 +1,2075 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Modal

+ + + + +
+ +
+
+

Modal +

+ +

Class that represents a PixiJS Modal.

+ +
+
+ +
+
+ + + + +
+
+ + + + + +
+ + +
+
+ + +
+

Creates an instance of a Modal.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the modal.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the modal.

app + + +PIXIApp + + + + + + window.app + + + + + optional + + + + + +

The app where the modal belongs to.

backgroundFill + + +number + + + + + + Theme.background + + + + + optional + + + + + +

The color of the background.

backgroundFillAlpha + + +number + + + + + + 0.6 + + + + + optional + + + + + +

The opacity of the background.

closeOnBackground + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the modal be closed when the user clicks the + background?

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the modal initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the button and the modal when clicked
+const button = new Button({
+    label: 'Show Modal',
+    action: e => {
+        const modal = new Modal({
+            app: app,
+            header: 'This is the header',
+            content: 'This is the text.'
+        })
+        app.scene.addChild(modal)
+    }
+})
+
+// Add the button to a DisplayObject
+app.scene.addChild(button)
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | PIXI.DisplayObject + + + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + ()Modal + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the modal (sets his alpha values to 0).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Modal + + + A reference to the modal for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()Modal + + + + + overrides + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the modal. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Modal + + + A reference to the modal for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()Modal + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the modal (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Modal + + + A reference to the modal for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/PIXIApp.html b/doc/out/PIXIApp.html new file mode 100644 index 0000000..12a5b0e --- /dev/null +++ b/doc/out/PIXIApp.html @@ -0,0 +1,5494 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: PIXIApp

+ + + + +
+ +
+
+

PIXIApp +

+ +

The class PixiApp extends the class PIXI.Application +by several functions and makes meaningful pre-assumptions.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new PIXIApp + + (opts) + + + + +

+ + +
+ app.js:67 +
+ +
+ + +
+
+ + +
+

Creates an instance of a PixiApp.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
opts + + +object + + + + + + {} + + + + + optional + + + + + +

An options object. The following options can be set:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
width + + +number + + + + + + + + + optional + + + + + +

The width of the renderer. If no set, the application will run in fullscreen.

height + + +number + + + + + + + + + optional + + + + + +

The height of the renderer. If no set, the application will run in fullscreen.

view + + +HTMLElement + + + + + + + + + optional + + + + + +

The canvas HTML element. If not set, a render-element is added inside the body.

transparent + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the render view be transparent?

antialias + + +boolean + + + + + + true + + + + + optional + + + + + +

Sets antialias (only applicable in chrome at the moment).

resolution + + +number + + + + + + window.devicePixelRatio | 1 + + + + + optional + + + + + +

The resolution / device pixel ratio of the renderer, retina would be 2.

autoResize + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the canvas-element be resized automatically if the resolution was set?

backgroundColor + + +number + + + + + + 0x282828 + + + + + optional + + + + + +

The color of the background.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The name of the theme (dark, light, red) or a Theme object to use for styling.

fpsLogging + + +boolean + + + + + + false + + + + + optional + + + + + +

If set to true, the current frames per second are displayed in the upper left corner.

progress + + +object + + + + + + {} + + + + + optional + + + + + +

Can be used to add options to the progress bar. See class Progress for more informations.

forceCanvas + + +boolean + + + + + + false + + + + + optional + + + + + +

Prevents selection of WebGL renderer, even if such is present.

roundPixels + + +boolean + + + + + + true + + + + + optional + + + + + +

Align PIXI.DisplayObject coordinates to screen resolution.

monkeyPatchMapping + + +boolean + + + + + + true + + + + + optional + + + + + +

Monkey patch for canvas fullscreen support on large displays.

adaptive + + +boolean + + + + + + true + + + + + optional + + + + + +

Adds Graphics adaptive calculation of quadratic curve and arc subdivision.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 450,
+    height: 150,
+    fpsLogging: true,
+    theme: 'light',
+    transparent: false
+}).setup().run()
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Application
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + center + object + + readonly + + +

+
+ + +
+
+ +
+

Returns the center of the renderer as an object with the keys x and y.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + size + object + + readonly + + +

+
+ + +
+
+ +
+

Returns the size of the renderer as an object with the keys width and height.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + addFpsDisplay + + ()PIXIApp + + + + +

+ + + + +
+ + +
+
+ + +
+

Adds the display of the frames per second to the renderer in the upper left corner.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + + +
    +
  • Returns the PIXIApp for chaining.
  • +
+ + + + +
+ + + +
+
+

+ + + checkOrientation + + (event) + + + + +

+ + + + +
+ + +
+
+ + +
+

Checks orientation and adapts view size if necessary. Implements a +handler for the orientationchange event.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +event + + + + + + + optional + + + + + +

orientationchange event

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + convertPointFromNodeToPage + + (displayObject, x, y)Point + + + + +

+ + + + +
+ + +
+
+ + +
+

Supports the page as a global coordinate system and converts local DisplayObject coordinates +to browser page coordinates.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
displayObject + + +DisplayObject + + + + + +

The PIXI displayObject.

x + + +number + + + + + +

The x coordinate.

y + + +number + + + + + +

The y coordinate.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Point + + + Returns a DOM Point.
+ + + + +
+ + + +
+
+

+ + + convertPointFromPageToNode + + (displayObject, x, y)PIXI.Point + + + + +

+ + + + +
+ + +
+
+ + +
+

Supports the page as a global coordinate system and converts browser page coordinates +to local DisplayObject coordinates.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
displayObject + + +DisplayObject + + + + + +

The PIXI displayObject.

x + + +number + + + + + +

The x coordinate.

y + + +number + + + + + +

The y coordinate.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXI.Point + + + Returns a PIXI.Point.
+ + + + +
+ + + +
+
+

+ + + draw + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Draws the display tree of the app. Typically this can be delegated +to the layout method.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + expandRenderer + + (expand)boolean + + + + +

+ + + + +
+ + +
+
+ + +
+

Expand the renderer step-wise on resize.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
expand + + +number + + + + + + 256 + + + + + optional + + + + + +

The amount of additional space for the renderer [px].

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + boolean + + + true if the renderer was resized.
+ + + + +
+ + + +
+
+

+ + + layout + + (width, height) + + + + +

+ + + + +
+ + +
+
+ + +
+

Called after a resize. Empty method but can be overwritten to +adapt their layout to the new app size.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
width + + +number + + + + + + + optional + + + + + +

The width of the app.

height + + +number + + + + + + + optional + + + + + +

The height of the app.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + loadSprites + + (resources, loaded, opts)PIXIApp + + + + +

+ + + + +
+ + +
+
+ + +
+

Loads sprites, e.g. images into the PIXI TextureCache.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
resources + + +string +| + +Array.<string> + + + + + + + + + + + + +

A String or an Array of urls to the images to load.

loaded + + +function + + + + + + null + + + + + optional + + + + + +

A callback which is executed after all resources has been loaded. + Receives one paramter, a Map of sprites where the key is the path of the image which was + loaded and the value is the PIXI.Sprite object.

opts + + +object + + + + + + + + + optional + + + + + +

An options object for more specific parameters.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
resolutionDependent + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the sprites be loaded dependent of the + renderer resolution?

progress + + +boolean + + + + + + false + + + + + optional + + + + + +

Should a progress bar display the loading status?

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + + + The PIXIApp object for chaining.
+ + + + +
+ + + +
+
+

+ + + loadTextures + + (resources, loaded, opts)PIXIApp + + + + +

+ + + + +
+ + +
+
+ + +
+

Loads textures, e.g. images into the PIXI TextureCache.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
resources + + +string +| + +Array.<string> + + + + + + + + + + + + +

A String or an Array of urls to the images to load.

loaded + + +function + + + + + + null + + + + + optional + + + + + +

A callback which is executed after all resources has been loaded. + Receives one paramter, a Map of textures where the key is the path of the image which was + loaded and the value is the PIXI.Texture object.

opts + + +object + + + + + + + + + optional + + + + + +

An options object for more specific parameters.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
resolutionDependent + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the textures be loaded dependent of the + renderer resolution?

progress + + +boolean + + + + + + false + + + + + optional + + + + + +

Should a progress bar display the loading status?

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + + + The PIXIApp object for chaining.
+ + + + +
+ + + +
+
+

+ + + message + + (opts)Message + + + + +

+ + + + +
+ + +
+
+ + +
+

Opens a new Message object binded to this app.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object for the Message object.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Message + + + Returns the Message object.
+ + + + +
+ + + +
+
+ + + + + +
+ + +
+
+ + +
+

Opens a new Modal object binded to this app.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object for the Modal object.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Modal + + + Returns the Modal object.
+ + + + +
+ + + +
+
+

+ + + mutate + + (mutation, opts)Promise + + + + +

+ + + + +
+ + +
+
+ + +
+

Mutate the GraphQL endpoint.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
mutation + + +string + + + + + + + + + optional + + + + + +

The GraphQL mutation string.

opts + + +object + + + + + + {} + + + + + optional + + + + + +

An options object. The following options can be set: + http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.mutate

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Promise + + + Returns a Promise which is either resolved with the resulting data or + rejected with an error.
+ + + + +
+ + + +
+
+

+ + + orientation + + ()boolean + + + + +

+ + + + +
+ + +
+
+ + +
+

Tests whether the width is larger than the height of the application.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + boolean + + + Returns true if app is in landscape mode.
+ + + + +
+ + + +
+
+

+ + + orientationChanged + + (force) + + + + +

+ + + + +
+ + +
+
+ + +
+

Called if checkOrientation detects an orientation change event.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
force + + +boolean + + + + + + false + + + + + optional + + + + + +

Called if checkOrientation detects an orientation change event.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + progress + + (value)PIXIApp | Progress + + + + +

+ + + + +
+ + +
+
+ + +
+

Set the loading progress of the application. If called for the first time, display the progress bar.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
value + + +number + + + + + + + optional + + + + + +

Should be a value between 0 and 100. If 100, the progress bar will disappear.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + | + + Progress + + + The PixiApp object for chaining or the Progress object when the method was + called without a parameter.
+ + + + +
+ + + +
+
+

+ + + query + + (query, opts)Promise + + + + +

+ + + + +
+ + +
+
+ + +
+

Queries the GraphQL endpoint.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
query + + +string + + + + + + + + + optional + + + + + +

The GraphQL query string.

opts + + +object + + + + + + {} + + + + + optional + + + + + +

An options object. The following options can be set: + http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.query

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Promise + + + Returns a Promise which is either resolved with the resulting data or + rejected with an error.
+ + + + +
+ + + +
+
+

+ + + resize + + (event, opts)PIXIApp + + + + +

+ + + + +
+ + +
+
+ + +
+

Resizes the renderer to fit into the window or given width and height.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
event + + +object + + + + + + + + + optional + + + + + +

The event.

opts + + +object + + + + + + {} + + + + + optional + + + + + +

The event.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
width + + +number + + + + + + window.innerWidth + + + + + optional + + + + + +

The width of the app to resize to.

height + + +number + + + + + + window.innerHeight + + + + + optional + + + + + +

The height of the app to resize to.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + + +
    +
  • Returns the PIXIApp for chaining.
  • +
+ + + + +
+ + + +
+
+

+ + + setup + + ()PIXIApp + + + + +

+ + + + +
+ + +
+
+ + +
+

Extra setup method to construct complex scenes, etc... +Overwrite this method if you need additonal views and components.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + PIXIApp + + + A reference to the PIXIApp for chaining.
+ + + + +
+ + + +
+
+

+ + + subscribe + + (subscription, opts)Promise + + + + +

+ + + + +
+ + +
+
+ + +
+

Subscribe the GraphQL endpoint.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
subscription + + +string + + + + + + + + + optional + + + + + +

The GraphQL subscription.

opts + + +object + + + + + + {} + + + + + optional + + + + + +

An options object. The following options can be set: + http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.query

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Promise + + + Returns a Promise which is either resolved with the resulting data or + rejected with an error.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Popup.html b/doc/out/Popup.html new file mode 100644 index 0000000..3f3b6fc --- /dev/null +++ b/doc/out/Popup.html @@ -0,0 +1,2067 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Popup

+ + + + +
+ +
+
+

Popup +

+ +

Class that represents a PixiJS Popup.

+ +
+
+ +
+
+ + + + +
+
+ + + + + +
+ + +
+
+ + +
+

Creates an instance of a Popup.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the popup.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
closeButton + + +boolean + + + + + + false + + + + + optional + + + + + +

Should a close button be displayed on the upper right corner?

minWidth + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum width of the popup.

minHeight + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum height of the popup.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the popup
+const popup = new Popup({
+    header: 'Goethe',
+    content: 'Man kann die Erfahrung nicht früh genug machen, wie entbehrlich man in der Welt ist.'
+})
+
+// Add the popup to a DisplayObject
+app.scene.addChild(popup)
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + inherited + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/PopupMenu.html b/doc/out/PopupMenu.html new file mode 100644 index 0000000..ba57f5b --- /dev/null +++ b/doc/out/PopupMenu.html @@ -0,0 +1,2115 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: PopupMenu

+ + + + +
+ +
+
+

PopupMenu +

+ +

Class that represents a PixiJS PopupMenu.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new PopupMenu + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a PopupMenu.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the modal.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
items + + +Array.<object> + + + + + + [] + + + + + optional + + + + + +

A list of the menu items. Each item must be of type object. + If an object has a label property, a PIXI.Text object is created (using the textStyle property). + If an object hasn't a label property, it must contain a content property which has to be a + PIXI.DisplayObject.

margin + + +number + + + + + + Theme.margin / 2 + + + + + optional + + + + + +

The app where the modal belongs to.

textStyle + + +object + + + + + + Theme.textStyle + + + + + optional + + + + + +

The color of the background.

closeOnPopup + + +boolean + + + + + + true + + + + + optional + + + + + +

The opacity of the background.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the button and the modal when clicked
+const button = new Button({
+    label: 'Show PopupMenu',
+    action: e => {
+        const popupmenu = new PopupMenu({
+            items: [
+                {label: 'Save', action: () => alert('Saved')},
+                {label: 'Edit', action: () => alert('Edited')},
+                {label: 'Delete', action: () => alert('Deleted')}
+            ]
+        })
+        app.scene.addChild(popupmenu)
+    }
+})
+
+// Add the button to a DisplayObject
+app.scene.addChild(button)
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + inherited + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Progress.html b/doc/out/Progress.html new file mode 100644 index 0000000..c3acab4 --- /dev/null +++ b/doc/out/Progress.html @@ -0,0 +1,2626 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Progress

+ + + + +
+ +
+
+

Progress +

+ +

Class that represents a PixiJS Progress.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Progress + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Progress.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the progress.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the progress.

app + + +PIXIApp + + + + + + window.app + + + + + optional + + + + + +

The app where the progress belongs to.

width + + +number + + + + + + + + + optional + + + + + +

The width of the progress bar. When not set, the width is the size of the app + minus 2 * opts.margin.

height + + +number + + + + + + 2 + + + + + optional + + + + + +

The height of the progress bar.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this progress. Possible values are dark, light, red + or a Theme object.

margin + + +number + + + + + + 100 + + + + + optional + + + + + +

The outer spacing to the edges of the app.

padding + + +number + + + + + + 0 + + + + + optional + + + + + +

The inner spacing (distance from icon and/or label) to the border.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

The color of the progress background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

The alpha value of the background.

fillActive + + +number + + + + + + Theme.primaryColor + + + + + optional + + + + + +

The color of the progress background when activated.

fillActiveAlpha + + +number + + + + + + Theme.fillActiveAlpha + + + + + optional + + + + + +

The alpha value of the background when activated.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + 0 + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

strokeActive + + +number + + + + + + Theme.strokeActive + + + + + optional + + + + + +

The color of the border when activated.

strokeActiveWidth + + +number + + + + + + 0 + + + + + optional + + + + + +

The width of the border in pixel when activated.

strokeActiveAlpha + + +number + + + + + + Theme.strokeActiveAlpha + + + + + optional + + + + + +

The alpha value of the border when activated.

background + + +boolean + + + + + + false + + + + + optional + + + + + +

The alpha value of the border when activated.

backgroundFill + + +number + + + + + + Theme.background + + + + + optional + + + + + +

A textstyle object for the styling of the label. See PIXI.TextStyle + for possible options.

backgroundFillAlpha + + +number + + + + + + 1 + + + + + optional + + + + + +

A textstyle object for the styling of the label when the + progress is activated. See PIXI.TextStyle for possible options.

radius + + +number + + + + + + Theme.radius + + + + + optional + + + + + +

The radius of the four corners of the progress (which is a rounded rectangle).

destroyOnComplete + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the progress bar destroy itself after reaching 100 %?

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the progress initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the progress
+const progress = new Progress({
+    app: app
+})
+
+// Add the progress to a DisplayObject
+app.scene.addChild(progress)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Container
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + progress + number + + + + +

+
+ + +
+
+ +
+

Gets or sets the progress. Has to be a number between 0 and 100.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + ()Progress + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the progress (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Progress + + + A reference to the progress for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()Progress + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the progress. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Progress + + + A reference to the progress for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()Progress + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the progress (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Progress + + + A reference to the progress for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Slider.html b/doc/out/Slider.html new file mode 100644 index 0000000..2335bf2 --- /dev/null +++ b/doc/out/Slider.html @@ -0,0 +1,2717 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Slider

+ + + + +
+ +
+
+

Slider +

+ +

Class that represents a PixiJS Slider.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Slider + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Slider.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the slider.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the slider.

x + + +number + + + + + + 0 + + + + + optional + + + + + +

The x position of the slider. Can be also set after creation with slider.x = 0.

y + + +number + + + + + + 0 + + + + + optional + + + + + +

The y position of the slider. Can be also set after creation with slider.y = 0.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this slider. Possible values are dark, light, red + or a Theme object.

width + + +number + + + + + + 250 + + + + + optional + + + + + +

The width of the slider.

height + + +number + + + + + + 2 + + + + + optional + + + + + +

The height of the slider.

container + + +PIXI.DisplayObject + + + + + + window.app|object + + + + + optional + + + + + +

The container where the slider events should be attached to.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

The color of the slider background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

The alpha value of the background.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + Theme.strokeWidth + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

controlFill + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the slider control background as a hex value.

controlFillAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the background.

controlStroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

controlStrokeWidth + + +number + + + + + + Theme.strokeWidth * 0.8 + + + + + optional + + + + + +

The width of the border in pixel.

controlStrokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

controlRadius + + +number + + + + + + 16 + + + + + optional + + + + + +

The radius of the slider control.

disabled + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the slider disabled? When disabled, the slider has a lower alpha value + and cannot be clicked (interactive is set to false).

onStart + + +onStartCallback + + + + + + + + + optional + + + + + +

Executed when the slider control starts to move.

onUpdate + + +onUpdateCallback + + + + + + + + + optional + + + + + +

Executed when the slider control is moved.

onComplete + + +onCompleteCallback + + + + + + + + + optional + + + + + +

Executed when the slider control was dropped.

tooltip + + +string +| + +object + + + + + + + + + optional + + + + + +

A string for the label of the tooltip or an object to configure the tooltip + to display.

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the slider initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+// Create the slider
+const slider = new Slider({
+    x: 10,
+    y: 20
+})
+
+// Add the slider to a DisplayObject
+app.scene.addChild(slider)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Container
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + disabled + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the disabled state. When disabled, the slider cannot be clicked.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + value + number + + + + +

+
+ + +
+
+ +
+

Gets or sets the value.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + ()Slider + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the slider (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Slider + + + A reference to the slider for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()Slider + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the slider. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Slider + + + A reference to the slider for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()Slider + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the slider (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Slider + + + A reference to the slider for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Switch.html b/doc/out/Switch.html new file mode 100644 index 0000000..7fabbd7 --- /dev/null +++ b/doc/out/Switch.html @@ -0,0 +1,3147 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Switch

+ + + + +
+ +
+
+

Switch +

+ +

Class that represents a PixiJS Switch.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Switch + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Switch.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the switch.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the switch.

x + + +number + + + + + + 0 + + + + + optional + + + + + +

The x position of the switch. Can be also set after creation with switch.x = 0.

y + + +number + + + + + + 0 + + + + + optional + + + + + +

The y position of the switch. Can be also set after creation with switch.y = 0.

theme + + +string +| + +Theme + + + + + + dark + + + + + optional + + + + + +

The theme to use for this switch. Possible values are dark, light, red + or a Theme object.

width + + +number + + + + + + 44 + + + + + optional + + + + + +

The width of the switch.

height + + +number + + + + + + 28 + + + + + optional + + + + + +

The height of the switch.

fill + + +number + + + + + + Theme.fill + + + + + optional + + + + + +

The color of the switch background as a hex value.

fillAlpha + + +number + + + + + + Theme.fillAlpha + + + + + optional + + + + + +

The alpha value of the background.

fillActive + + +number + + + + + + Theme.fillActive + + + + + optional + + + + + +

The color of the switch background when activated.

fillActiveAlpha + + +number + + + + + + Theme.fillActiveAlpha + + + + + optional + + + + + +

The alpha value of the background when activated.

stroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + Theme.strokeWidth + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

strokeActive + + +number + + + + + + Theme.strokeActive + + + + + optional + + + + + +

The color of the border when activated.

strokeActiveWidth + + +number + + + + + + Theme.strokeActiveWidth + + + + + optional + + + + + +

The width of the border in pixel when activated.

strokeActiveAlpha + + +number + + + + + + Theme.strokeActiveAlpha + + + + + optional + + + + + +

The alpha value of the border when activated.

controlFill + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the switch control background as a hex value.

controlFillAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the background.

controlFillActive + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the switch control background when activated.

controlFillActiveAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the background when activated.

controlStroke + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border as a hex value.

controlStrokeWidth + + +number + + + + + + Theme.strokeWidth * 0.8 + + + + + optional + + + + + +

The width of the border in pixel.

controlStrokeAlpha + + +number + + + + + + Theme.strokeAlpha + + + + + optional + + + + + +

The alpha value of the border.

controlStrokeActive + + +number + + + + + + Theme.stroke + + + + + optional + + + + + +

The color of the border when activated.

controlStrokeActiveWidth + + +number + + + + + + Theme.strokeActiveWidth * 0.8 + + + + + optional + + + + + +

The width of the border in pixel when activated.

controlStrokeActiveAlpha + + +number + + + + + + Theme.strokeActiveAlpha + + + + + optional + + + + + +

The alpha value of the border when activated.

duration + + +number + + + + + + Theme.fast + + + + + optional + + + + + +

The duration of the animation when the switch gets activated in seconds.

durationActive + + +number + + + + + + Theme.fast + + + + + optional + + + + + +

The duration of the animation when the switch gets deactivated in seconds.

disabled + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the switch disabled? When disabled, the switch has a lower alpha value + and cannot be clicked (interactive is set to false).

active + + +boolean + + + + + + false + + + + + optional + + + + + +

Is the button initially active?

action + + +actionCallback + + + + + + + + + optional + + + + + +

Executed when the switch was triggered in inactive state (by pointerup).

actionActive + + +actionActiveCallback + + + + + + + + + optional + + + + + +

Executed when the button was triggered in active state (by pointerup).

beforeAction + + +beforeActionCallback + + + + + + + + + optional + + + + + +

Executed before an action is triggered.

afterAction + + +afterActionCallback + + + + + + + + + optional + + + + + +

Executed after an action was triggered.

tooltip + + +string +| + +object + + + + + + + + + optional + + + + + +

A string for the label of the tooltip or an object to configure the tooltip + to display.

visible + + +boolean + + + + + + true + + + + + optional + + + + + +

Is the switch initially visible (property visible)?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+// Create the switch
+const switch1 = new Switch({
+    x: 10,
+    y: 20
+})
+
+// Add the switch to a DisplayObject
+app.scene.addChild(switch1)
+ + + +
+ + +
+ + +

Extends

+ +
    +
  • PIXI.Container
  • +
+ + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + active + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the active state.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+

+ + disabled + boolean + + + + +

+
+ + +
+
+ +
+

Gets or sets the disabled state. When disabled, the switch cannot be clicked.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + ()Switch + + + + +

+ + + + +
+ + +
+
+ + +
+

Hides the switch (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Switch + + + A reference to the switch for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()Switch + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the switch. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Switch + + + A reference to the switch for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + ()Switch + + + + +

+ + + + +
+ + +
+
+ + +
+

Shows the switch (sets his alpha values to 1).

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Switch + + + A reference to the switch for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/TextLabel.TextLabel.html b/doc/out/TextLabel.TextLabel.html new file mode 100644 index 0000000..49ecd87 --- /dev/null +++ b/doc/out/TextLabel.TextLabel.html @@ -0,0 +1,1441 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: TextLabel

+ + + + +
+ +
+
+

TextLabel +

+ +
+
+ +
+
+ + + + +
+
+

+ + + new TextLabel.TextLabel + + (text, style, canvas) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of TextLabel.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
text + + +string + + + + + + + + + + + + +

The string that you would like the text to display

style + + +object +| + +PIXI.TextStyle + + + + + + null + + + + + optional + + + + + +

The style parameters

canvas + + +canvas + + + + + + null + + + + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Theme.html b/doc/out/Theme.html new file mode 100644 index 0000000..870a7e4 --- /dev/null +++ b/doc/out/Theme.html @@ -0,0 +1,2916 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Theme

+ + + + +
+ +
+
+

Theme +

+ +

Class that represents a PixiJS Theme.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Theme + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Theme.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the theme.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
margin + + +number + + + + + + 10 + + + + + optional + + + + + +

The outer spacing (distance to other objects) from the border.

padding + + +number + + + + + + 10 + + + + + optional + + + + + +

The inner spacing (distance from icon and/or label) to the border.

radius + + +number + + + + + + 4 + + + + + optional + + + + + +

The radius used when drawing a rounded rectangle.

fast + + +number + + + + + + 0.25 + + + + + optional + + + + + +

The duration of time when it has to be fast.

normal + + +number + + + + + + 0.5 + + + + + optional + + + + + +

The duration of time when it has to be normal.

slow + + +number + + + + + + 1 + + + + + optional + + + + + +

The duration of time when it has to be slow.

primaryColor + + +number + + + + + + 0x5ec7f8 + + + + + optional + + + + + +

The primary color of the theme.

color1 + + +number + + + + + + 0x282828 + + + + + optional + + + + + +

The first color of the theme. For example used for the background.

color2 + + +number + + + + + + 0xf6f6f6 + + + + + optional + + + + + +

The second color of the theme. For example used for the border.

fill + + +number + + + + + + color1 + + + + + optional + + + + + +

The color of the background as a hex value.

fillAlpha + + +number + + + + + + 1 + + + + + optional + + + + + +

The alpha value of the background.

fillActive + + +number + + + + + + color1 + + + + + optional + + + + + +

The color of the background when activated.

fillActiveAlpha + + +number + + + + + + 1 + + + + + optional + + + + + +

The alpha value of the background when activated.

stroke + + +number + + + + + + color2 + + + + + optional + + + + + +

The color of the border as a hex value.

strokeWidth + + +number + + + + + + 0.6 + + + + + optional + + + + + +

The width of the border in pixel.

strokeAlpha + + +number + + + + + + 1 + + + + + optional + + + + + +

The alpha value of the border.

strokeActive + + +number + + + + + + color2 + + + + + optional + + + + + +

The color of the border when activated.

strokeActiveWidth + + +number + + + + + + 0.6 + + + + + optional + + + + + +

The width of the border in pixel when activated.

strokeActiveAlpha + + +number + + + + + + 1 + + + + + optional + + + + + +

The alpha value of the border when activated.

iconColor + + +number + + + + + + color2 + + + + + optional + + + + + +

The color of the icon (set by the tint property) as a hex value.

iconColorActive + + +number + + + + + + colorPrimary + + + + + optional + + + + + +

The color of the icon when activated.

background + + +number + + + + + + color1 + + + + + optional + + + + + +

The color of a background for a component (e.g. at the Modal class).

textStyle + + +object + + + + + + {} + + + + + optional + + + + + +

A textstyle object for the styling of text. See PIXI.TextStyle + for possible options. Default object:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
fontFamily + + +string + + + + + + "Avenir Next", "Open Sans", "Segoe UI", ... + + + + + optional + + + + + +

The font family.

fontWeight + + +string + + + + + + 400 + + + + + optional + + + + + +

The font weight.

fontSize + + +number + + + + + + 16 + + + + + optional + + + + + +

The font size.

fill + + +number + + + + + + color2 + + + + + optional + + + + + +

The fill color.

stroke + + +number + + + + + + color1 + + + + + optional + + + + + +

The stroke color.

strokeThickness + + +number + + + + + + 0 + + + + + optional + + + + + +

The thickness of the stroke.

miterLimit + + +number + + + + + + 1 + + + + + optional + + + + + +

The meter limit.

lineJoin + + +string + + + + + + round + + + + + optional + + + + + +

The line join.

+
textStyleActive + + +object + + + + + + textStyle + {fill: primaryColor} + + + + + optional + + + + + +

A textstyle object which is used + for actived text.

textStyleSmall + + +object + + + + + + textStyle + {fontSize: -= 3} + + + + + optional + + + + + +

A textstyle object which is used for + small text.

textStyleSmallActive + + +object + + + + + + textStyleSmall + {fill: primaryColor} + + + + + optional + + + + + +

A textstyle object which + is used for small actived text.

textStyleLarge + + +object + + + + + + textStyle + {fontSize: += 3} + + + + + optional + + + + + +

A textstyle object which is used for + large text.

textStyleLargeActive + + +object + + + + + + textStyleLarge + {fill: primaryColor} + + + + + optional + + + + + +

A textstyle object which + is used for large actived text.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the theme
+const yellow = new Theme({
+    fill: 0xfecd2d,
+    fillActive: 0xfe9727,
+    strokeActive: 0xfecd2d,
+    strokeActiveWidth: 4,
+    textStyle: {
+        fill: 0x5ec7f8
+    },
+    textStyleActive: {
+        fill: 0x5954d3
+    },
+    textStyleLarge: {
+        fontSize: 36
+    }
+})
+
+// Create the app and apply the new theme to it
+const app = new PIXIApp({
+    view: canvas,
+    width: 450,
+    height: 150,
+    theme: yellow
+}).setup().run()
+ + + +
+ + +
+ + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+

+ + + Theme.fromString + + (theme)Theme + + static + + +

+ + + + +
+ + +
+
+ + +
+

Factory function

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
theme + + +string + + + + + + dark + + + +

The name of the theme to load.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Theme + + + Returns a newly created Theme object.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/ThemeDark.html b/doc/out/ThemeDark.html new file mode 100644 index 0000000..767e615 --- /dev/null +++ b/doc/out/ThemeDark.html @@ -0,0 +1,1337 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: ThemeDark

+ + + + +
+ +
+
+

ThemeDark +

+ +

Class that represents a PixiJS ThemeDark.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new ThemeDark + + () + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app with a new dark theme
+const app = new PIXIApp({
+    view: canvas,
+    width: 450,
+    height: 150,
+    theme: new ThemeDark()
+}).setup().run()
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/ThemeLight.html b/doc/out/ThemeLight.html new file mode 100644 index 0000000..8360079 --- /dev/null +++ b/doc/out/ThemeLight.html @@ -0,0 +1,1342 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: ThemeLight

+ + + + +
+ +
+
+

ThemeLight +

+ +

Class that represents a PixiJS ThemeLight. +The color1 is set to 0xf6f6f6, color2 to 0x282828.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new ThemeLight + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a ThemeLight.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app with a new light theme
+const app = new PIXIApp({
+    view: canvas,
+    width: 450,
+    height: 150,
+    theme: new ThemeLight()
+}).setup().run()
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/ThemeRed.html b/doc/out/ThemeRed.html new file mode 100644 index 0000000..e44ad96 --- /dev/null +++ b/doc/out/ThemeRed.html @@ -0,0 +1,1342 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: ThemeRed

+ + + + +
+ +
+
+

ThemeRed +

+ +

Class that represents a PixiJS ThemeRed. +The primaryColor is set to 0xd92f31.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new ThemeRed + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a ThemeRed.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app with a new red theme
+const app = new PIXIApp({
+    view: canvas,
+    width: 450,
+    height: 150,
+    theme: new ThemeRed()
+}).setup().run()
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/TileQuadNode.html b/doc/out/TileQuadNode.html new file mode 100644 index 0000000..6cc997a --- /dev/null +++ b/doc/out/TileQuadNode.html @@ -0,0 +1,1801 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: TileQuadNode

+ + + + +
+ +
+
+

TileQuadNode +

+ +

A utility class that describes a quad tree of tiles. Each tile on a given +level has up to four corresponding tiles on the next level. A TileQuadNode +uses the attributes nw (i.e. northwest), ne, sw, se to link to the +quad nodes on the next level. The previous attributes links to the quad +one level below that holds the given quad as nw, ne, sw, or se. +We use this node class because we need a representation of tiles that are +needed but not loaded yet to compute tiles which can be abandoned to reduce +the memory pressure.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new TileQuadNode + + (Number, Number, Number, String) + + + + +

+ + + + +
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
Number + + +level + + + + + +

The level the quad node belongs to

Number + + +col + + + + + +

The col of the quad

Number + + +row + + + + + +

The level the quad node belongs to

String + + +url + + + + + +

The level the quad node belongs to

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+ + + + + +
+ + +
+
+ + +
+

Link this quad node to the given previous node. Use the north +and west flags to address nw, ne, sw, and se.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
TileQuadNode + + +node + + + + + +

The TileQuadNode to remove

Boolean + + +north + + + + + +

Link to north (true) or south (false)

Boolean + + +west + + + + + +

Link to west (true) or east (false)

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + noQuads + + () + + + + +

+ + + + +
+ + +
+
+ + +
+

Return True if this node has no successors and can be used as + an indicator of tiles to free.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+ + + + + +
+ + +
+
+ + +
+

Unlink the given quad node

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
TileQuadNode + + +node + + + + + +

The TileQuadNode to remove

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Tooltip.html b/doc/out/Tooltip.html new file mode 100644 index 0000000..d9be409 --- /dev/null +++ b/doc/out/Tooltip.html @@ -0,0 +1,2253 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Tooltip

+ + + + +
+ +
+
+

Tooltip +

+ +

Class that represents a PixiJS Tooltip.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Tooltip + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Tooltip.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the tooltip.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
minWidth + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum width of the tooltip.

minHeight + + +number + + + + + + 0 + + + + + optional + + + + + +

The minimum height of the tooltip.

padding + + +number + + + + + + Theme.padding / 2 + + + + + optional + + + + + +

The inner spacing of the tooltip.

object + + +PIXI.DisplayObject + + + + + + + + + + + + +

The object, where the tooltip should be displayed.

container + + +PIXI.DisplayObject + + + + + + object + + + + + optional + + + + + +

The container where the tooltip should be attached to.

offsetLeft + + +number + + + + + + 8 + + + + + optional + + + + + +

The horizontal shift of the tooltip.

offsetTop + + +number + + + + + + -8 + + + + + optional + + + + + +

The vertical shift of the tooltip.

delay + + +number + + + + + + 0 + + + + + optional + + + + + +

A delay, after which the tooltip should be opened.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the app
+const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+// Add an DisplayObject to the app
+const circle = new PIXI.Graphics()
+circle.beginFill(0x5251a3)
+circle.drawCircle(50, 50, 40)
+app.scene.addChild(circle)
+
+const tooltip = new Tooltip({
+    object: circle,
+    container: app.scene,
+    content: 'Das Gesetz ist der Freund des Schwachen.'
+})
+ + + +
+ + +
+ + +

Extends

+ + + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + content + string | number | PIXI.DisplayObject + + + + inherited + + +

+
+ + +
+
+ +
+

Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive +a string, a number or a PIXI.DisplayObject.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ + + +
+
+ +
+ + +
+
+ +
+

Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive +a string, a number or a PIXI.Text object.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + hide + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Hides the popup (sets his alpha values to 0).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when hide animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + layout + + ()AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the popup. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ + + +
+
+

+ + + show + + (cb)AbstractPopup + + + + inherited + + +

+ + + + +
+ + +
+
+ + +
+

Shows the popup (sets his alpha values to 1).

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
cb + + +callback + + + + + + + optional + + + + + +

Executed when show animation was completed.

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + AbstractPopup + + + A reference to the popup for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/UITest.html b/doc/out/UITest.html new file mode 100644 index 0000000..339fac1 --- /dev/null +++ b/doc/out/UITest.html @@ -0,0 +1,3934 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: UITest

+ + + + +
+ +
+
+

UITest +

+ +

A class that can be used to perform automated user interface tests.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new UITest + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of an UITest.

+

In the background, the class UITest uses the Greensock TimelineMax class. The opts object is passed directly to the TimelineMax class, so it can use any key that uses the TimelineMax class.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify the behaviour of the test case.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
timeScale + + +number + + + + + + 1 + + + + + optional + + + + + +

The speed at which the test should run, see https://greensock.com/docs/TimelineMax/timeScale().

eventType + + +string + + + + + + auto + + + + + optional + + + + + +

The type of events which should be used. Possible values: pointer, touch, mouse, auto. If set to auto, the eventType is set depending on the support of the browser used.

debug + + +boolean + + + + + + false + + + + + optional + + + + + +

If set to true, multiple informations will be print to the console.

defaultInterval + + +number + + + + + + + + + optional + + + + + +

The interval used when no action is specified for an action.

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
// Create the UITest object
+const test = new UITest({
+    timeScale: 2
+})
+
+// Add an action to the test case
+test.tap(button, {eventType: 'click'})
+
+// Start the test case
+test.start()
+ + + +
+ + +
+ + + + + + + + + + + + +

Members

+ +
+ +
+
+

+ + timeline + TimelineMax + + + + +

+
+ + +
+
+ +
+

Gets the Greensock TimelineMax object, used in the background of UITest.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ + + +

Methods

+ +
+ +
+
+

+ + + clear + + ()UITest + + + + +

+ + + + +
+ + +
+
+ + +
+

Clears all instructions of the test case.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + UITest + + + A reference to the UITest for chaining.
+ + + + +
+ + + +
+
+

+ + + pan + + (element, position, timelinePosition, opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Executes a pan event (pointerdown, pointermove, pointerup) on a specific element.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
element + + +HTMLElement +| + +string + + + + + + + + + + + + +

The HTML element on which the event is to be executed, e.g. button, document, h2, canvas, etc. or an selector string. If a selector has been specified, it is evaluated immediately before the event is called using the querySelector method.

position + + +Array.<number> +| + +object +| + +PIXI.DisplayObject + + + + + + The center of the element. + + + + + optional + + + + + +

The local position of the event in the context of the specified HTML element. If no position is specified, the center of the HTML element is used. The position can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object.

timelinePosition + + +number + + + + + + One second after the last action. + + + + + optional + + + + + +

The position in seconds when the event should be triggered, see shttps://greensock.com/docs/TimelineMax/addCallback().

opts + + +object + + + + + + + + + optional + + + + + +

An options object to specify the behaviour of the action.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
onStart + + +function + + + + + + + + + optional + + + + + +

A function that runs after the first event is fired. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

onUpdate + + +function + + + + + + + + + optional + + + + + +

A function that runs after each execution of the second event. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

onComplete + + +function + + + + + + + + + optional + + + + + +

A function that runs after the third event is fired. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

to + + +Array.<number> +| + +object +| + +PIXI.DisplayObject + + + + + + {x: 0, y: 0} + + + + + optional + + + + + +

The target of the pan process. The position can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object.

duration + + +number + + + + + + 1 + + + + + optional + + + + + +

The duration of the pan animation in seconds, see https://greensock.com/docs/TweenLite/duration().

ease + + +Ease + + + + + + Power0.easeNone + + + + + optional + + + + + +

The easing of the pan animation, see https://greensock.com/docs/Easing.

eventTypes + + +Array.<string> + + + + + + ['pointerdown', 'pointermove', 'pointerup'] + + + + + optional + + + + + +

The event types to use. If no types are specified, the event types specified in the UITest constructor are used (or auto if not specified).

context + + +Window +| + +Frame + + + + + + window + + + + + optional + + + + + +

The context within which the optionally specified element selector should be executed.

bubbles + + +boolean + + + + + + true + + + + + optional + + + + + +

The Event property bubbles indicates whether the event bubbles up through the DOM or not.

cancelable + + +boolean + + + + + + true + + + + + optional + + + + + +

Events' cancelable property indicates if the event can be canceled, and therefore prevented as if the event never happened. If the event is not cancelable, then its cancelable property will be false and the event listener cannot stop the event from occurring.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + pinch + + (element, position, timelinePosition, opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Executes a pinch event (pointerdown, pointermove, pointerup) on a specific element with two "fingers" simultaneously.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
element + + +HTMLElement +| + +string + + + + + + + + + + + + +

The HTML element on which the event is to be executed, e.g. button, document, h2, canvas, etc. or an selector string. If a selector has been specified, it is evaluated immediately before the event is called using the querySelector method.

position + + +Array.<number> +| + +object +| + +PIXI.DisplayObject + + + + + + The center of the element. + + + + + optional + + + + + +

The local position of the event in the context of the specified HTML element. If no position is specified, the center of the HTML element is used. The position can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object.

timelinePosition + + +number + + + + + + One second after the last action. + + + + + optional + + + + + +

The position in seconds when the event should be triggered, see shttps://greensock.com/docs/TimelineMax/addCallback().

opts + + +object + + + + + + + + + optional + + + + + +

An options object to specify the behaviour of the action.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
onStart + + +function + + + + + + + + + optional + + + + + +

A function that runs after the first events are fired. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

onUpdate + + +function + + + + + + + + + optional + + + + + +

A function that runs after each execution of the second events. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

onComplete + + +function + + + + + + + + + optional + + + + + +

A function that runs after the third events are fired. Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

doubleCallbacks + + +boolean + + + + + + false + + + + + optional + + + + + +

The callbacks onStart, onUpdate and onComplete will be fired only for one finger. If set to true, the events will be fired for both fingers.

distance + + +number + + + + + + 100 + + + + + optional + + + + + +

The distance in pixels, how far the two "fingers" should move apart. If to or bezier specified, distance is ignored.

to + + +Array.<Array.<number>> +| + +Array.<object> +| + +Array.<PIXI.DisplayObject> + + + + + + + + + optional + + + + + +

The targets of the pinch process. The position must be an array with two entries. An entry can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object. If bezier is specified, to is ignored.

bezier + + +Array.<Array.<number>> +| + +Array.<object> +| + +Array.<PIXI.DisplayObject> + + + + + + + + + optional + + + + + +

The targets of the pinch process. The position must be an array with two entries. An entry may be an array of positions or a bezier object (https://greensock.com/docs/Plugins/BezierPlugin). A position in the array or the values array of the bezier object can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object. If bezier is specified, to is ignored.

duration + + +number + + + + + + 1 + + + + + optional + + + + + +

The duration of the pan animation in seconds, see https://greensock.com/docs/TweenLite/duration().

ease + + +Ease + + + + + + Power0.easeNone + + + + + optional + + + + + +

The easing of the pan animation, see https://greensock.com/docs/Easing.

eventTypes + + +Array.<string> + + + + + + ['pointerdown', 'pointermove', 'pointerup'] + + + + + optional + + + + + +

The event types to use. If no types are specified, the event types specified in the UITest constructor are used (or auto if not specified).

context + + +Window +| + +Frame + + + + + + window + + + + + optional + + + + + +

The context within which the optionally specified element selector should be executed.

bubbles + + +boolean + + + + + + true + + + + + optional + + + + + +

The Event property bubbles indicates whether the event bubbles up through the DOM or not.

cancelable + + +boolean + + + + + + true + + + + + optional + + + + + +

Events' cancelable property indicates if the event can be canceled, and therefore prevented as if the event never happened. If the event is not cancelable, then its cancelable property will be false and the event listener cannot stop the event from occurring.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + restart + + ()UITest + + + + +

+ + + + +
+ + +
+
+ + +
+

Restarts the test case.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + UITest + + + A reference to the UITest for chaining.
+ + + + +
+ + + +
+
+

+ + + start + + ()UITest + + + + +

+ + + + +
+ + +
+
+ + +
+

Starts the test case and executes the corresponding statements in the specified order.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + UITest + + + A reference to the UITest for chaining.
+ + + + +
+ + + +
+
+

+ + + stop + + ()UITest + + + + +

+ + + + +
+ + +
+
+ + +
+

Stops the test case and stops executing any further instructions.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + UITest + + + A reference to the UITest for chaining.
+ + + + +
+ + + +
+
+

+ + + tap + + (element, position, timelinePosition, opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Executes a tap event (pointerdown, pointerup) on a specific element.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
element + + +HTMLElement +| + +string + + + + + + + + + + + + +

The HTML element on which the event is to be executed, e.g. button, document, h2, canvas, etc. or an selector string. If a selector has been specified, it is evaluated immediately before the event is called using the querySelector method.

position + + +Array.<number> +| + +object +| + +PIXI.DisplayObject + + + + + + The center of the element. + + + + + optional + + + + + +

The local position of the event in the context of the specified HTML element. If no position is specified, the center of the HTML element is used. The position can be specified as an array of numbers, as an object with the two properties x and y, or as a PIXI.Display object.

timelinePosition + + +number + + + + + + One second after the last action. + + + + + optional + + + + + +

The position in seconds when the event should be triggered, see shttps://greensock.com/docs/TimelineMax/addCallback().

opts + + +object + + + + + + + + + optional + + + + + +

An options object to specify the behaviour of the action.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
onStart + + +function + + + + + + + + + optional + + + + + +

A function that runs after the first event is fired. Will not be fired if only one event is running (for example, a click event). Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

onComplete + + +function + + + + + + + + + optional + + + + + +

A function that runs after the second event is fired. Always fired, even if only one event is running (for example, a click event). Receives the fired event object as the first parameter. The test case (UITest) is bound to this.

eventTypes + + +Array.<string> + + + + + + ['pointerdown', 'pointerup'] + + + + + optional + + + + + +

The event types to use. If no types are specified, the event types specified in the UITest constructor are used (or auto if not specified).

eventType + + +string + + + + + + + + + optional + + + + + +

If you want the tap method to fire only one event (for example, a click event), you can specify the opts.eventType parameter. If eventType is not null, the parameter opts.eventTypes is ignored.

context + + +Window +| + +Frame + + + + + + window + + + + + optional + + + + + +

The context within which the optionally specified element selector should be executed.

bubbles + + +boolean + + + + + + true + + + + + optional + + + + + +

The Event property bubbles indicates whether the event bubbles up through the DOM or not.

cancelable + + +boolean + + + + + + true + + + + + optional + + + + + +

Events' cancelable property indicates if the event can be canceled, and therefore prevented as if the event never happened. If the event is not cancelable, then its cancelable property will be false and the event listener cannot stop the event from occurring.

+
+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/Volatile.html b/doc/out/Volatile.html new file mode 100644 index 0000000..469edf0 --- /dev/null +++ b/doc/out/Volatile.html @@ -0,0 +1,1850 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Class: Volatile

+ + + + +
+ +
+
+

Volatile +

+ +

Class that represents a PixiJS Volatile.

+ +
+
+ +
+
+ + + + +
+
+

+ + + new Volatile + + (opts) + + + + +

+ + + + +
+ + +
+
+ + +
+

Creates an instance of a Volatile.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
opts + + +object + + + + + + + optional + + + + + +

An options object to specify to style and behaviour of the modal.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDefaultDescription
id + + +number + + + + + + auto generated + + + + + optional + + + + + +

The id of the tooltip.

object + + +PIXI.DisplayObject +| + +Array.<PIXI.DisplayObject> + + + + + + + + + + + + +

The object where the volatile should be applied to.

direction + + +string + + + + + + top + + + + + optional + + + + + +

The animation direction. Possible values: top, right, bottom, left.

onStart + + +function + + + + + + + + + optional + + + + + +

A function which is executed when the volatile animation starts.

onComplete + + +function + + + + + + + + + optional + + + + + +

A function which is executed when the volatile animation finishes.

distance + + +number + + + + + + 160 + + + + + optional + + + + + +

The animation distance.

duration + + +number + + + + + + 1.5 + + + + + optional + + + + + +

The duration of the animation in seconds.

ease + + +object + + + + + + Quad.easeOut + + + + + optional + + + + + +

The easing of the animation, see https://greensock.com/docs/Easing

destroyOnComplete + + +boolean + + + + + + true + + + + + optional + + + + + +

Should the object be destroyed after the volatile animation?

+
+ + + +
+ + + + + + + + + + + + + + + + + +
See:
+
+ +
+ + + +
+ + + + + + + + + + + + + +
Example
+ + + +
const app = new PIXIApp({
+    view: canvas,
+    width: 900,
+    height: 250
+}).setup().run()
+
+const button = new Button({
+    label: 'Volatile!',
+    action: () => {
+        new Volatile({
+            object: button,
+            direction: 'right',
+            destroyOnComplete: false
+        })
+    }
+})
+
+app.scene.addChild(button)
+ + + +
+ + +
+ + + + + + + + + + + + + + +

Methods

+ +
+ +
+
+

+ + + layout + + ()Volatile + + + + +

+ + + + +
+ + +
+
+ + +
+

Should be called to refresh the layout of the volatile. Can be used after resizing.

+
+ + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + +
Returns:
+ + + + + + + + + + + + + + + + + + + + +
TypeDescription
+ + Volatile + + + A reference to the volatile for chaining.
+ + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/fonts/glyphicons-halflings-regular.eot b/doc/out/fonts/glyphicons-halflings-regular.eot new file mode 100644 index 0000000..b93a495 Binary files /dev/null and b/doc/out/fonts/glyphicons-halflings-regular.eot differ diff --git a/doc/out/fonts/glyphicons-halflings-regular.svg b/doc/out/fonts/glyphicons-halflings-regular.svg new file mode 100644 index 0000000..94fb549 --- /dev/null +++ b/doc/out/fonts/glyphicons-halflings-regular.svg @@ -0,0 +1,288 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/doc/out/fonts/glyphicons-halflings-regular.ttf b/doc/out/fonts/glyphicons-halflings-regular.ttf new file mode 100644 index 0000000..1413fc6 Binary files /dev/null and b/doc/out/fonts/glyphicons-halflings-regular.ttf differ diff --git a/doc/out/fonts/glyphicons-halflings-regular.woff b/doc/out/fonts/glyphicons-halflings-regular.woff new file mode 100644 index 0000000..9e61285 Binary files /dev/null and b/doc/out/fonts/glyphicons-halflings-regular.woff differ diff --git a/doc/out/fonts/glyphicons-halflings-regular.woff2 b/doc/out/fonts/glyphicons-halflings-regular.woff2 new file mode 100644 index 0000000..64539b5 Binary files /dev/null and b/doc/out/fonts/glyphicons-halflings-regular.woff2 differ diff --git a/doc/out/global.html b/doc/out/global.html new file mode 100644 index 0000000..c9e27eb --- /dev/null +++ b/doc/out/global.html @@ -0,0 +1,3071 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Global

+ + + + +
+ +
+
+

Global +

+ +
+
+ +
+
+ + + + + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + +

Type Definitions

+ +
+ +
+
+

+ + + actionActiveCallback + + (event, switch) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the switch action.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

switch + + +Switch + + + + + +

A reference to the switch (also this refers to the switch).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + actionCallback + + (event, button) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the button action.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

button + + +Button + + + + + +

A reference to the button (also this refers to the button).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + actionCallback + + (event, switch) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the switch action.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

switch + + +Switch + + + + + +

A reference to the switch (also this refers to the switch).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + afterActionCallback + + (event, button) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the button afterAction.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

button + + +Button + + + + + +

A reference to the button (also this refers to the button).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + afterActionCallback + + (event, switch) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the switch afterAction.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

switch + + +Switch + + + + + +

A reference to the switch (also this refers to the switch).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + beforeActionCallback + + (event, button) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the button beforeAction.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

button + + +Button + + + + + +

A reference to the button (also this refers to the button).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + beforeActionCallback + + (event, switch) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the switch beforeAction.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

switch + + +Switch + + + + + +

A reference to the switch (also this refers to the switch).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onCompleteCallback + + (flippable) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the flippable onComplete function.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
flippable + + +Flippable + + + + + +

A reference to the flippable (also this refers to the flippable).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onCompleteCallback + + (event, slider) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the slider action onComplete.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

slider + + +Slider + + + + + +

A reference to the slider (also this refers to the slider).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onStartCallback + + (flippable) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the flippable onStart function.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
flippable + + +Flippable + + + + + +

A reference to the flippable (also this refers to the flippable).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onStartCallback + + (event, slider) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the slider action onStart.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

slider + + +Slider + + + + + +

A reference to the slider (also this refers to the slider).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onUpdateCallback + + (flippable) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the flippable onUpdate function.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
flippable + + +Flippable + + + + + +

A reference to the flippable (also this refers to the flippable).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ + + +
+
+

+ + + onUpdateCallback + + (event, slider) + + + + +

+ + + + +
+ + +
+
+ + +
+

Callback for the slider action onUpdate.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
event + + +object + + + + + +

The event object.

slider + + +Slider + + + + + +

A reference to the slider (also this refers to the slider).

+ + + +
+ + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + +
+ +
+ + + + + +
+ +
+ + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/index.html b/doc/out/index.html new file mode 100644 index 0000000..506907d --- /dev/null +++ b/doc/out/index.html @@ -0,0 +1,1232 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Index

+ + + + + + +

+ + + + + + + + + + + + + +
+ +
+ + + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/doc/out/pixi_abstractpopup.js.html b/doc/out/pixi_abstractpopup.js.html new file mode 100644 index 0000000..2c63eed --- /dev/null +++ b/doc/out/pixi_abstractpopup.js.html @@ -0,0 +1,1565 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/abstractpopup.js

+ + + + +
+
+
+

pixi/abstractpopup.js

+
+
+
+
import Theme from './theme.js'
+
+/**
+ * Class that represents a PixiJS AbstractPopup.
+ * The class is used for various other Popup-like classes
+ * like Popup, Message, Tooltip...
+ *
+ * @class
+ * @abstract
+ * @extends PIXI.Graphics
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Graphics.html|PIXI.Graphics}
+ */
+export default class AbstractPopup extends PIXI.Graphics {
+    
+    /**
+     * Creates an instance of an AbstractPopup (only for internal use).
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the popup.
+     * @param {number} [opts.id=auto generated] - The id of the popup.
+     * @param {number} [opts.x=0] - The x position of the popup. Can be also set after creation with popup.x = 0.
+     * @param {number} [opts.y=0] - The y position of the popup. Can be also set after creation with popup.y = 0.
+     * @param {string|Theme} [opts.theme=dark] - The theme to use for this popup. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {string|number|PIXI.Text} [opts.header] - The heading inside the popup as a string, a number (will be
+     *     converted to a text) or as a PIXI.Text object.
+     * @param {string|number|PIXI.DisplayObject} [opts.content] - A text, a number (will be converted to a text) or
+     *     an PIXI.DisplayObject as the content of the popup.
+     * @param {number} [opts.minWidth=320] - The minimum width of the popup.
+     * @param {number} [opts.minHeight=130] - The minimum height of the popup.
+     * @param {number} [opts.padding=Theme.padding] - The inner spacing (distance from header and content) the the border.
+     * @param {number} [opts.fill=Theme.fill] - The color of the button background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - The alpha value of the background.
+     * @param {number} [opts.stroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=Theme.strokeWidth] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {object} [opts.headerStyle=Theme.textStyleLarge] - A textstyle object for the styling of the header. See PIXI.TextStyle
+     *     for possible options.
+     * @param {object} [opts.textStyle=Theme.textStyleSmall] - A textstyle object for the styling of the text. See PIXI.TextStyle
+     *     for possible options.
+     * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the popup (which is a rounded rectangle).
+     * @param {hiddenCallback} [opts.onHidden] - Executed when the popup gets hidden.
+     * @param {boolean} [opts.visible=true] - Is the popup initially visible (property visible)?
+     * @param {string} [opts.orientation] - When set to portrait, the popup cannot be displayed in landscape mode. When set
+     *     to landscape, the popup cannot be displayed in portrait mode.
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            x: 0,
+            y: 0,
+            header: null,                       // null or null
+            content: null,                      // null or String or PIXI.DisplayObject
+            minWidth: 320,
+            minHeight: 130,
+            maxWidth: null,
+            padding: theme.padding,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            stroke: theme.stroke,
+            strokeWidth: theme.strokeWidth,
+            strokeAlpha: theme.strokeAlpha,
+            headerStyle: theme.textStyleLarge,
+            textStyle: theme.textStyleSmall,
+            radius: theme.radius,
+            onHidden: null,
+            visible: true,
+            orientation: null
+        }, opts)
+
+        this.id = this.opts.id
+
+        this.headerStyle = new PIXI.TextStyle(this.opts.headerStyle)
+        this.textStyle = new PIXI.TextStyle(this.opts.textStyle)
+
+        if (this.opts.maxWidth) {
+            this.headerStyle.wordWrap = true
+            this.headerStyle.wordWrapWidth = this.opts.maxWidth - (2 * this.opts.padding)
+
+            this.textStyle.wordWrap = true
+            this.textStyle.wordWrapWidth = this.opts.maxWidth - (2 * this.opts.padding)
+        }
+
+        this.alpha = 0
+        this.visible = this.opts.visible
+
+        this._header = null
+        this._content = null
+
+        // position
+        this.x = this.opts.x
+        this.y = this.opts.y
+
+        // padding
+        this.innerPadding = this.opts.padding * 1.5
+        
+        // interaction
+        //-----------------
+        this.interactive = true
+        this.on('added', e => {
+            this.show()
+        })
+    }
+    
+    /**
+     * Creates the framework and instantiates everything.
+     * 
+     * @private
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    setup() {
+
+        // position
+        //-----------------
+        this.sy = this.opts.padding
+
+        // header
+        //-----------------
+        if (this.opts.header != null) {
+
+            let header = null
+
+            if (this.opts.header instanceof PIXI.Text) {
+                header = this.opts.header
+            } else if (typeof this.opts.header === 'number') {
+                header =  new PIXI.Text(this.opts.header.toString(), this.headerStyle)
+            } else {
+                header =  new PIXI.Text(this.opts.header, this.headerStyle)
+            }
+
+            header.x = this.opts.padding
+            header.y = this.sy
+
+            this.addChild(header)
+
+            this.sy += header.height
+
+            this._header = header
+        }
+
+        if (this.opts.header && this.opts.content) {
+            this.sy += this.innerPadding
+        }
+
+        // content
+        //-----------------
+        if (this.opts.content != null) {
+
+            let content = null
+
+            if (typeof this.opts.content === 'string') {
+                content = new PIXI.Text(this.opts.content, this.textStyle)
+            } else if (typeof this.opts.content === 'number') {
+                content = new PIXI.Text(this.opts.content.toString(), this.textStyle)
+            } else {
+                content = this.opts.content
+            }
+
+            content.x = this.opts.padding
+            content.y = this.sy
+
+            this.sy += content.height
+
+            this.addChild(content)
+
+            this._content = content
+        }
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the popup. Can be used after resizing.
+     * 
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    layout() {
+        
+        // wanted width & wanted height
+        //-----------------
+        const padding = this.opts.padding
+        const size = this.getInnerSize()
+        const width = size.width + (2 * padding)
+        const height = size.height + (2 * padding)
+
+        this.wantedWidth = Math.max(width, this.opts.minWidth)
+        this.wantedHeight = Math.max(height, this.opts.minHeight)
+        
+        if (this.opts.maxWidth) {
+            this.wantedWidth = Math.min(this.wantedWidth, this.opts.maxWidth)
+        }
+
+        if (this.opts.radius * 2 > this.wantedWidth) {
+            this.wantedWidth = this.opts.radius * 2
+        }
+
+        if (this.opts.radius * 2 > this.wantedHeight) {
+            this.wantedHeight = this.opts.radius * 2
+        }
+
+        switch (this.opts.orientation) {
+            case 'portrait':
+                if (this.wantedWidth > this.wantedHeight) {
+                    this.wantedHeight = this.wantedWidth
+                }
+                break
+            case 'landscape':
+                if (this.wantedHeight > this.wantedWidth) {
+                    this.wantedWidth = this.wantedHeight
+                }
+                break
+        }
+
+        this.draw()
+
+        return this
+    }
+    
+    /**
+     * Draws the canvas.
+     * 
+     * @private
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    draw() {
+
+        const square = Math.round(this.wantedWidth) === Math.round(this.wantedHeight)
+        const diameter = Math.round(this.opts.radius * 2)
+
+        this.clear()
+        this.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+        this.beginFill(this.opts.fill, this.opts.fillAlpha)
+        if (square && diameter === this.wantedWidth) {
+            this.drawCircle(this.wantedWidth / 2, this.wantedHeight / 2, this.opts.radius)
+        } else {
+            this.drawRoundedRect(0, 0, this.wantedWidth, this.wantedHeight, this.opts.radius)
+        }
+        this.endFill()
+
+        return this
+    }
+    
+    /**
+     * Calculates the size of the children of the AbstractPopup.
+     * Cannot use getBounds() because it is not updated when children
+     * are removed.
+     * 
+     * @private
+     * @returns {object} An JavaScript object width the keys width and height.
+     */
+    getInnerSize() {
+
+        let width = 0
+        let height = 0
+
+        if (this._header) {
+            width = this._header.width
+            height = this._header.height
+        }
+
+        if (this._header && this._content) {
+            height += this.innerPadding
+        }
+
+        if (this._content) {
+            width = Math.max(width, this._content.width)
+            height += this._content.height
+        }
+
+        return {width, height}
+    }
+    
+    /**
+     * Shows the popup (sets his alpha values to 1).
+     * 
+     * @param {callback} [cb] - Executed when show animation was completed.
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    show(cb) {
+
+        TweenLite.to(this, this.theme.fast, {
+            alpha: 1,
+            onComplete: () => {
+                if (cb) {
+                    cb.call(this)
+                }
+            }
+        })
+
+        return this
+    }
+    
+    /**
+     * Hides the popup (sets his alpha values to 0).
+     * 
+     * @param {callback} [cb] - Executed when hide animation was completed.
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    hide(cb) {
+
+        TweenLite.to(this, this.theme.fast, {
+            alpha: 0,
+            onComplete: () => {
+                this.visible = false
+                if (cb) {
+                    cb.call(this)
+                }
+            }
+        })
+
+        if (this.opts.onHidden) {
+            this.opts.onHidden.call(this, this)
+        }
+
+        return this
+    }
+
+    /**
+     * Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive
+     * a string, a number or a PIXI.Text object.
+     * 
+     * @member {string|number|PIXI.Text}
+     */
+    get header() {
+        return this._header
+    }
+    set header(value) {
+        if (this._header) {
+            this._header.destroy()
+        }
+        this.opts.header = value
+        this.setup().layout()
+    }
+    
+    /**
+     * Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive
+     * a string, a number or a PIXI.DisplayObject.
+     * 
+     * @member {string|number|PIXI.DisplayObject}
+     */
+    get content() {
+        return this._content
+    }
+    set content(value) {
+        if (this._content) {
+            this._content.destroy()
+        }
+        this.opts.content = value
+        this.setup().layout()
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_app.js.html b/doc/out/pixi_app.js.html new file mode 100644 index 0000000..9952a60 --- /dev/null +++ b/doc/out/pixi_app.js.html @@ -0,0 +1,1931 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/app.js

+ + + + +
+
+
+

pixi/app.js

+
+
+
+
/* global apollo, subscriptions, gql */
+
+import Theme from './theme.js'
+import Progress from './progress.js'
+import Modal from './modal.js'
+import Message from './message.js'
+import {debounce} from '../utils.js'
+
+/**
+ * A special InteractionManager for fullscreen apps, which may
+ * go beyond the limits of WebGL drawing buffers. On Safari and Chrome
+ * the drawing buffers are limited to 4096 in width (Safari) or 4096x4096
+ * in total buffer size (Chrome). The original InteractionManager.mapPositionToPoint
+ * does not work with these extreme sizes which mainly occur if large
+ * retina displays (>= 4K) are used with devicePixelRatio > 1.
+ *
+ * @private
+ * @class
+ * @extends PIXI.interaction.InteractionManager
+ * @see {@link http://pixijs.download/dev/docs/PIXI.interaction.InteractionManager.html|PIXI.interaction.InteractionManager}
+ * @see {@link https://stackoverflow.com/questions/29710696/webgl-drawing-buffer-size-does-not-equal-canvas-size}
+ */
+class FullscreenInteractionManager extends PIXI.interaction.InteractionManager {
+
+    mapPositionToPoint(point, x, y) {
+        let resolution = this.renderer.resolution
+        let extendWidth = 1.0
+        let extendHeight = 1.0
+        let dy = 0
+        let canvas = this.renderer.view
+        let context = canvas.getContext('webgl')
+        if (context.drawingBufferWidth < canvas.width ||
+            context.drawingBufferHeight < canvas.height) {
+            extendWidth = context.drawingBufferWidth / canvas.width
+            extendHeight = context.drawingBufferHeight / canvas.height
+            //dx = wantedWidth - context.drawingBufferWidth
+            dy = (canvas.height - context.drawingBufferHeight) / resolution
+        }
+        x *= extendWidth
+        y *= extendHeight
+
+        super.mapPositionToPoint(point, x, y + dy)
+    }
+}
+
+/**
+ * The class PixiApp extends the class PIXI.Application
+ * by several functions and makes meaningful pre-assumptions.
+ *
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 450,
+ *     height: 150,
+ *     fpsLogging: true,
+ *     theme: 'light',
+ *     transparent: false
+ * }).setup().run()
+ *
+ * @class
+ * @extends PIXI.Application
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Application.html|PIXI.Application}
+ */
+export default class PIXIApp extends PIXI.Application {
+
+    /**
+     * Creates an instance of a PixiApp.
+     *
+     * @constructor
+     * @param {object} [opts={}] - An options object. The following options can be set:
+     * @param {number} [opts.width] - The width of the renderer. If no set, the application will run in fullscreen.
+     * @param {number} [opts.height] - The height of the renderer. If no set, the application will run in fullscreen.
+     * @param {HTMLElement} [opts.view] - The canvas HTML element. If not set, a render-element is added inside the body.
+     * @param {boolean} [opts.transparent=true] - Should the render view be transparent?
+     * @param {boolean} [opts.antialias=true] - Sets antialias (only applicable in chrome at the moment).
+     * @param {number} [opts.resolution=window.devicePixelRatio | 1] - The resolution / device pixel ratio of the renderer, retina would be 2.
+     * @param {boolean} [opts.autoResize=true] - Should the canvas-element be resized automatically if the resolution was set?
+     * @param {number} [opts.backgroundColor=0x282828] - The color of the background.
+     * @param {string|Theme} [opts.theme=dark] - The name of the theme (dark, light, red) or a Theme object to use for styling.
+     * @param {boolean} [opts.fpsLogging=false] - If set to true, the current frames per second are displayed in the upper left corner.
+     * @param {object} [opts.progress={}] - Can be used to add options to the progress bar. See class Progress for more informations.
+     * @param {boolean} [opts.forceCanvas=false] - Prevents selection of WebGL renderer, even if such is present.
+     * @param {boolean} [opts.roundPixels=true] - Align PIXI.DisplayObject coordinates to screen resolution.
+     * @param {boolean} [opts.monkeyPatchMapping=true] - Monkey patch for canvas fullscreen support on large displays.
+     * @param {boolean} [opts.adaptive=true] - Adds Graphics adaptive calculation of quadratic curve and arc subdivision.
+     */
+    constructor({
+        width = null, height = null, view = null,
+        transparent = true, backgroundColor = 0x282828, theme = 'dark',
+        antialias = true, resolution = window.devicePixelRatio || 1, autoResize = true,
+        fpsLogging = false, progress = {}, forceCanvas = false, roundPixels = true, monkeyPatchMapping = true, adaptive = true,
+        graphql = false }) {
+
+        const fullScreen = !width || !height
+
+        if (fullScreen) {
+            width = window.innerWidth
+            height = window.innerHeight
+        }
+
+        super({
+            view: view,
+            width: width,
+            height: height,
+            transparent: transparent,
+            antialias: antialias,
+            resolution: resolution,
+            autoResize: autoResize,
+            backgroundColor: backgroundColor,
+            roundPixels: roundPixels,
+            forceCanvas: forceCanvas
+        })
+
+        this.width = width
+        this.height = height
+        this.theme = Theme.fromString(theme)
+        this.fpsLogging = fpsLogging
+        this.progressOpts = progress
+        this.fullScreen = fullScreen
+        this.orient = null
+        this.originalMapPositionToPoint = null
+        this.monkeyPatchMapping = monkeyPatchMapping
+        PIXI.Graphics.CURVES.adaptive = adaptive
+        this.graphql = graphql
+        if (fullScreen || autoResize) {
+            console.log('App is in fullScreen mode or autoResize mode')
+            const resizeDebounced = debounce(event => this.resize(event), 50)
+            window.addEventListener('resize', resizeDebounced)
+            document.body.addEventListener('orientationchange', this.checkOrientation.bind(this))
+        }
+        if (monkeyPatchMapping) {
+            console.log('Using monkey patched coordinate mapping')
+            // Pluggin the specializtion does not work. Monkey patching does
+            // this.renderer.plugins.interaction = new FullscreenInteractionManager(this.renderer)
+            this.monkeyPatchPixiMapping()
+        }
+    }
+
+    /**
+     * Extra setup method to construct complex scenes, etc...
+     * Overwrite this method if you need additonal views and components.
+     *
+     * @return {PIXIApp} A reference to the PIXIApp for chaining.
+     */
+    setup() {
+        this.scene = this.sceneFactory()
+        this.stage.addChild(this.scene)
+
+        // fpsLogging
+        if (this.fpsLogging) {
+            this.addFpsDisplay()
+        }
+
+        // GraphQL
+        if (this.graphql && typeof apollo !== 'undefined') {
+
+            const networkInterface = apollo.createNetworkInterface({
+                uri: '/graphql'
+            })
+
+            const wsClient = new subscriptions.SubscriptionClient(`wss://${location.hostname}/subscriptions`, {
+                reconnect: true,
+                connectionParams: {}
+            })
+
+            const networkInterfaceWithSubscriptions = subscriptions.addGraphQLSubscriptions(
+                networkInterface,
+                wsClient
+            )
+
+            this.apolloClient = new apollo.ApolloClient({
+                networkInterface: networkInterfaceWithSubscriptions
+            })
+        }
+
+        // progress
+        this._progress = new Progress(Object.assign({ theme: this.theme }, this.progressOpts, { app: this }))
+        this._progress.visible = false
+        this.stage.addChild(this._progress)
+
+        return this
+    }
+
+    /**
+     * Tests whether the width is larger than the height of the application.
+     *
+     * @return {boolean} Returns true if app is in landscape mode.
+     */
+    orientation() {
+        return this.width > this.height
+    }
+
+    /**
+     * Checks orientation and adapts view size if necessary. Implements a
+     * handler for the orientationchange event.
+     *
+     * @param {event=} - orientationchange event
+     */
+    checkOrientation(event) {
+        var value = this.orientation()
+        if (value != this.orient) {
+            setTimeout(100, function () {
+                this.orientationChanged(true)
+            }.bind(this))
+            this.orient = value
+        }
+    }
+
+    /**
+     * Called if checkOrientation detects an orientation change event.
+     *
+     * @param {boolean=} [force=false] - Called if checkOrientation detects an orientation change event.
+     */
+    orientationChanged(force = false) {
+        if (this.expandRenderer() || force) {
+            this.layout()
+        }
+    }
+
+    /**
+     * Called after a resize. Empty method but can be overwritten to
+     * adapt their layout to the new app size.
+     *
+     * @param {number} [width] - The width of the app.
+     * @param {number} [height] - The height of the app.
+     */
+    layout(width, height) {
+
+    }
+
+    /**
+     * Draws the display tree of the app. Typically this can be delegated
+     * to the layout method.
+     *
+     */
+    draw() {
+        this.layout(this.width, this.height)
+    }
+
+    /*
+     * Run the application. Override this method with everything
+     * that is needed to maintain your App, e.g. setup calls, main loops, etc.
+     *
+     */
+    run() {
+        return this
+    }
+
+    /*
+     * Overwrite this factory method if your application needs a special
+     * scene object.
+     *
+     * @returns {PIXI.Container} - A new PIXI Container for use as a scene.
+     */
+    sceneFactory() {
+        return new PIXI.Container()
+    }
+
+    /**
+     * Adds the display of the frames per second to the renderer in the upper left corner.
+     *
+     * @return {PIXIApp} - Returns the PIXIApp for chaining.
+     */
+    addFpsDisplay() {
+        const fpsDisplay = new FpsDisplay(this)
+        this.stage.addChild(fpsDisplay)
+
+        return this
+    }
+
+    /**
+     * Returns the size of the renderer as an object with the keys width and height.
+     *
+     * @readonly
+     * @member {object}
+     */
+    get size() {
+        return { width: this.width, height: this.height }
+    }
+
+    /**
+     * Returns the center of the renderer as an object with the keys x and y.
+     *
+     * @readonly
+     * @member {object}
+     */
+    get center() {
+        return { x: this.width / 2, y: this.height / 2 }
+    }
+
+    /**
+     * Resizes the renderer to fit into the window or given width and height.
+     *
+     * @param {object} [event] - The event.
+     * @param {object=} [opts={}] - The event.
+     * @param {number} [opts.width=window.innerWidth] - The width of the app to resize to.
+     * @param {number} [opts.height=window.innerHeight] - The height of the app to resize to.
+     * @return {PIXIApp} - Returns the PIXIApp for chaining.
+     */
+    resize(event, { width = window.innerWidth, height = window.innerHeight } = {}) {
+        this.width = width
+        this.height = height
+        this.expandRenderer()
+        this.layout(width, height)
+        //console.log("App.resize", width, height, window.innerWidth, window.innerHeight )
+        // if (this.scene) {
+        // console.log("gl.drawingBufferWidth", this.renderer.view.getContext('webgl').drawingBufferWidth)
+        // console.log("scene", this.scene.scale, this.renderer, this.renderer.autoResize, this.renderer.resolution)
+        // }
+        return this
+    }
+
+    /**
+     * @todo Write the documentation.
+     *
+     * @private
+     */
+    monkeyPatchPixiMapping() {
+        if (this.originalMapPositionToPoint === null) {
+            let interactionManager = this.renderer.plugins.interaction
+            this.originalMapPositionToPoint = interactionManager.mapPositionToPoint
+            interactionManager.mapPositionToPoint = (point, x, y) => {
+                return this.fixedMapPositionToPoint(point, x, y)
+            }
+        }
+    }
+
+    /**
+     * In some browsers the canvas is distorted if the screen resolution and 
+     * overall size of the canvas exceeds the internal limits (e.g. 4096 x 4096 pixels).
+     * To compensate these distortions we need to fix the mapping to the actual
+     * drawing buffer coordinates.
+     * @private
+     * @param {any} local
+     * @param {number} x
+     * @param {number} y
+     * @return {} interactionManager.mapPositionToPoint
+     */
+    fixedMapPositionToPoint(local, x, y) {
+        let resolution = this.renderer.resolution
+        let interactionManager = this.renderer.plugins.interaction
+        let extendWidth = 1.0
+        let extendHeight = 1.0
+        let dy = 0
+        let canvas = this.renderer.view
+        let context = canvas.getContext('webgl')
+
+        if (context !== null && (context.drawingBufferWidth < canvas.width ||
+            context.drawingBufferHeight < canvas.height)) {
+            extendWidth = context.drawingBufferWidth / canvas.width
+            extendHeight = context.drawingBufferHeight / canvas.height
+            //dx = wantedWidth - context.drawingBufferWidth
+            dy = (canvas.height - context.drawingBufferHeight) / resolution
+        }
+        x *= extendWidth
+        y *= extendHeight
+        return this.originalMapPositionToPoint.call(interactionManager, local, x, y + dy)
+    }
+
+    /**
+     * Expand the renderer step-wise on resize.
+     *
+     * @param {number} [expand] - The amount of additional space for the renderer [px].
+     * @return {boolean} true if the renderer was resized.
+     */
+    expandRenderer(expand = 256) {
+        let renderer = this.renderer
+        let resolution = this.renderer.resolution
+        let ww = this.width
+        let hh = this.height
+        let sw = this.screen.width
+        let sh = this.screen.height
+        if (ww > sw || hh > sh) {
+            //console.log('App.expandRenderer')
+            renderer.resize(ww + expand, hh + expand)
+            return true
+        }
+
+        renderer.resize(ww, hh)
+        return false
+    }
+
+    /**
+     * Set the loading progress of the application. If called for the first time, display the progress bar.
+     *
+     * @param {number} [value] - Should be a value between 0 and 100. If 100, the progress bar will disappear.
+     * @return {PIXIApp|Progress} The PixiApp object for chaining or the Progress object when the method was
+     *     called without a parameter.
+     */
+    progress(value) {
+
+        if (typeof value === 'undefined') {
+            return this._progress
+        }
+
+        this._progress.visible = true
+        this._progress.progress = value
+
+        return this
+    }
+
+    /**
+     * Opens a new Modal object binded to this app.
+     *
+     * @param {object} [opts] - An options object for the Modal object.
+     * @return {Modal} Returns the Modal object.
+     */
+    modal(opts = {}) {
+
+        let modal = new Modal(Object.assign({ theme: this.theme }, opts, { app: this }))
+        this.scene.addChild(modal)
+
+        return modal
+    }
+
+    /**
+     * Opens a new Message object binded to this app.
+     *
+     * @param {object} [opts] - An options object for the Message object.
+     * @return {Message} Returns the Message object.
+     */
+    message(opts = {}) {
+
+        let message = new Message(Object.assign({ theme: this.theme }, opts, { app: this }))
+        this.scene.addChild(message)
+
+        return message
+    }
+
+    /**
+     * Loads sprites, e.g. images into the PIXI TextureCache.
+     *
+     * @param {string|string[]} resources - A String or an Array of urls to the images to load.
+     * @param {function} [loaded] - A callback which is executed after all resources has been loaded.
+     *     Receives one paramter, a Map of sprites where the key is the path of the image which was
+     *     loaded and the value is the PIXI.Sprite object.
+     * @param {object} [opts] - An options object for more specific parameters.
+     * @param {boolean} [opts.resolutionDependent=true] - Should the sprites be loaded dependent of the
+     *     renderer resolution?
+     * @param {boolean} [opts.progress=false] - Should a progress bar display the loading status?
+     * @return {PIXIApp} The PIXIApp object for chaining.
+     */
+    loadSprites(resources, loaded = null, { resolutionDependent = true, progress = false } = {}) {
+
+        this.loadTextures(resources, textures => {
+
+            let sprites = new Map()
+
+            for (let [key, texture] of textures) {
+                sprites.set(key, new PIXI.Sprite(texture))
+            }
+
+            if (loaded) {
+                loaded.call(this, sprites)
+            }
+
+        }, { resolutionDependent, progress })
+
+        return this
+    }
+
+    /**
+     * Loads textures, e.g. images into the PIXI TextureCache.
+     *
+     * @param {string|string[]} resources - A String or an Array of urls to the images to load.
+     * @param {function} [loaded] - A callback which is executed after all resources has been loaded.
+     *     Receives one paramter, a Map of textures where the key is the path of the image which was
+     *     loaded and the value is the PIXI.Texture object.
+     * @param {object} [opts] - An options object for more specific parameters.
+     * @param {boolean} [opts.resolutionDependent=true] - Should the textures be loaded dependent of the
+     *     renderer resolution?
+     * @param {boolean} [opts.progress=false] - Should a progress bar display the loading status?
+     * @return {PIXIApp} The PIXIApp object for chaining.
+     */
+    loadTextures(resources, loaded = null, { resolutionDependent = true, progress = false } = {}) {
+
+        if (!Array.isArray(resources)) {
+            resources = [resources]
+        }
+
+        const loader = this.loader
+
+        for (let resource of resources) {
+
+            if (!loader.resources[resource]) {
+
+                if (resolutionDependent) {
+                    let resolution = Math.round(this.renderer.resolution)
+                    switch (resolution) {
+                        case 2:
+                            loader.add(resource, resource.replace(/\.([^.]*)$/, '@2x.$1'))
+                            break
+                        case 3:
+                            loader.add(resource, resource.replace(/\.([^.]*)$/, '@3x.$1'))
+                            break
+                        default:
+                            loader.add(resource)
+                            break
+                    }
+                } else {
+                    loader.add(resource)
+                }
+            }
+        }
+
+        if (progress) {
+            loader.on('progress', e => {
+                this.progress(e.progress)
+            })
+        }
+
+        loader.load((loader, resources) => {
+            const textures = new Map()
+
+            for (let key in resources) {
+                textures.set(key, resources[key].texture)
+            }
+
+            if (loaded) {
+                loaded.call(this, textures)
+            }
+        })
+
+        return this
+    }
+
+    /**
+     * Queries the GraphQL endpoint.
+     *
+     * @param {string} [query] - The GraphQL query string.
+     * @param {object} [opts={}] - An options object. The following options can be set:
+     *     http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.query
+     * @return {Promise} Returns a Promise which is either resolved with the resulting data or
+     *     rejected with an error.
+     */
+    query(query, opts = {}) {
+
+        if (typeof query === 'string') {
+            opts = Object.assign({}, opts, { query })
+        } else {
+            opts = Object.assign({}, query)
+        }
+
+        opts.query = opts.query.trim()
+
+        if (!opts.query.startsWith('query')) {
+            if (opts.query.startsWith('{')) {
+                opts.query = `query ${opts.query}`
+            } else {
+                opts.query = `query {${opts.query}}`
+            }
+        }
+
+        opts.query = gql(opts.query)
+
+        return this.apolloClient.query(opts)
+    }
+
+    /**
+     * Mutate the GraphQL endpoint.
+     *
+     * @param {string} [mutation] - The GraphQL mutation string.
+     * @param {object} [opts={}] - An options object. The following options can be set:
+     *     http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.mutate
+     * @return {Promise} Returns a Promise which is either resolved with the resulting data or
+     *     rejected with an error.
+     */
+    mutate(mutation, opts = {}) {
+
+        if (typeof mutation === 'string') {
+            opts = Object.assign({}, opts, { mutation })
+        } else {
+            opts = Object.assign({}, mutation)
+        }
+
+        opts.mutation = opts.mutation.trim()
+
+        if (!opts.mutation.startsWith('mutation')) {
+            if (opts.mutation.startsWith('{')) {
+                opts.mutation = `mutation ${opts.mutation}`
+            } else {
+                opts.mutation = `mutation {${opts.mutation}}`
+            }
+        }
+
+        opts.mutation = gql(opts.mutation)
+
+        return this.apolloClient.mutate(opts)
+    }
+
+    /**
+     * Subscribe the GraphQL endpoint.
+     *
+     * @param {string} [subscription] - The GraphQL subscription.
+     * @param {object} [opts={}] - An options object. The following options can be set:
+     *     http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient.query
+     * @return {Promise} Returns a Promise which is either resolved with the resulting data or
+     *     rejected with an error.
+     */
+    subscribe(subscription, opts = {}) {
+
+        if (typeof subscription === 'string') {
+            opts = Object.assign({}, opts, { subscription })
+        } else {
+            opts = Object.assign({}, subscription)
+        }
+
+        opts.subscription = opts.subscription.trim()
+
+        if (!opts.subscription.startsWith('subscription')) {
+            if (opts.subscription.startsWith('{')) {
+                opts.subscription = `subscription ${opts.subscription}`
+            } else {
+                opts.subscription = `subscription {${opts.subscription}}`
+            }
+        }
+
+        opts.query = gql(opts.subscription)
+
+        delete opts.subscription
+
+        return this.apolloClient.subscribe(opts)
+    }
+
+    /**
+     * Supports the page as a global coordinate system and converts browser page coordinates
+     * to local DisplayObject coordinates.
+     *
+     * @param {DisplayObject} displayObject - The PIXI displayObject.
+     * @param {number} x - The x coordinate.
+     * @param {number} y - The y coordinate.
+     *  
+     * @return {PIXI.Point} Returns a PIXI.Point.
+     */
+
+    convertPointFromPageToNode(displayObject, x, y) {
+        let resolution = this.renderer.resolution
+        console.log("resolution", resolution)
+        let pixiGlobal = window.convertPointFromPageToNode(app.view, x, y)
+        pixiGlobal.x /= resolution
+        pixiGlobal.y /= resolution
+        return displayObject.toLocal(new PIXI.Point(pixiGlobal.x, pixiGlobal.y))
+    }
+
+    /**
+     * Supports the page as a global coordinate system and converts local DisplayObject coordinates
+     * to browser page coordinates.
+     *
+     * @param {DisplayObject} displayObject - The PIXI displayObject.
+     * @param {number} x - The x coordinate.
+     * @param {number} y - The y coordinate.
+     *  
+     * @return {Point} Returns a DOM Point.
+     */
+
+    convertPointFromNodeToPage(displayObject, x, y) {
+        let resolution = this.renderer.resolution
+        let pixiGlobal = displayObject.toGlobal(new PIXI.Point(x, y))
+        pixiGlobal.x *= resolution
+        pixiGlobal.y *= resolution
+        // console.log("app.convertPointFromNodeToPage", pixiGlobal)
+        return window.convertPointFromNodeToPage(app.view, pixiGlobal.x, pixiGlobal.y)
+    }
+}
+
+/**
+ * The class fpsdisplay shows in the upper left corner
+ * of the renderer the current image refresh rate.
+ *
+ * @private
+ * @class
+ * @extends PIXI.Graphics
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Graphics.html|PIXI.Graphics}
+ */
+class FpsDisplay extends PIXI.Graphics {
+
+    /**
+     * Creates an instance of a FpsDisplay.
+     *
+     * @constructor
+     * @param {PIXIApp} app - The PIXIApp where the frames per second should be displayed.
+     */
+    constructor(app) {
+
+        super()
+
+        this.app = app
+
+        this.lineStyle(3, 0x434f4f, 1)
+            .beginFill(0x434f4f, .6)
+            .drawRoundedRect(0, 0, 68, 32, 5)
+            .endFill()
+            .position.set(20, 20)
+
+        this.text = new PIXI.Text(this.fps, new PIXI.TextStyle({
+            fontFamily: 'Arial',
+            fontSize: 14,
+            fontWeight: 'bold',
+            fill: '#f6f6f6',
+            stroke: '#434f4f',
+            strokeThickness: 3
+        }))
+        this.text.position.set(6, 6)
+
+        this.addChild(this.text)
+
+        this.refreshFps()
+
+        window.setInterval(this.refreshFps.bind(this), 1000)
+    }
+
+    /**
+     * Refreshes fps numer.
+     *
+     * @return {PIXIApp} Returns the PIXIApp object for chaining.
+     */
+    refreshFps() {
+        this.text.text = `${(this.app.ticker.FPS).toFixed(1)} fps`
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_badge.js.html b/doc/out/pixi_badge.js.html new file mode 100644 index 0000000..032b697 --- /dev/null +++ b/doc/out/pixi_badge.js.html @@ -0,0 +1,1317 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/badge.js

+ + + + +
+
+
+

pixi/badge.js

+
+
+
+
import Theme from './theme.js'
+import AbstractPopup from './abstractpopup.js'
+import Tooltip from './tooltip.js'
+
+/**
+ * Class that represents a PixiJS Badge.
+ * 
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * // Add an DisplayObject to the app
+ * const circle = new PIXI.Graphics()
+ * circle.beginFill(0x5251a3)
+ * circle.drawCircle(50, 50, 40)
+ * app.scene.addChild(circle)
+ * 
+ * const badge1 = new Badge({
+ *     object: circle,
+ *     container: app.scene,
+ *     content: 'Das Gesetz ist der Freund des Schwachen.'
+ * })
+ *
+ * @class
+ * @extends AbstractPopup
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/badge.html|DocTest}
+ */
+export default class Badge extends AbstractPopup {
+    
+    /**
+     * Creates an instance of a Badge.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the badge.
+     * @param {number} [opts.minWidth=0] - The minimum width of the badge.
+     * @param {number} [opts.minHeight=0] - The minimum height of the badge.
+     * @param {number} [opts.padding=Theme.padding / 2] - The inner spacing of the badge.
+     * @param {string|object} [opts.tooltip] - A string for the label of the tooltip or an object to configure the tooltip
+     *     to display.
+     */
+    constructor(opts = {}) {
+        
+        const theme = Theme.fromString(opts.theme)
+        
+        opts = Object.assign({}, {
+            minWidth: 0,
+            minHeight: 0,
+            padding: theme.padding / 2,
+            tooltip: null
+        }, opts)
+
+        super(opts)
+
+        this.tooltip = null
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     *
+     * @private
+     * @override
+     * @return {Badge} A reference to the badge for chaining.
+     */
+    setup() {
+
+        super.setup()
+
+        // tooltip
+        //-----------------
+        if (this.opts.tooltip) {
+            if (typeof this.opts.tooltip === 'string') {
+                this.tooltip = new Tooltip({object: this, content: this.opts.tooltip})
+            } else {
+                this.opts.tooltip = Object.assign({}, {object: this}, this.opts.tooltip)
+                this.tooltip = new Tooltip(this.opts.tooltip)
+            }
+        }
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the badge. Can be used after resizing.
+     * 
+     * @override
+     * @return {Badge} A reference to the badge for chaining.
+     */
+    layout() {
+
+        super.layout()
+
+        this.content.x = this.width / 2 - this.content.width / 2 - this.opts.strokeWidth / 2
+        this.content.y = this.height / 2 - this.content.height / 2 - this.opts.strokeWidth / 2
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_blurfilter.js.html b/doc/out/pixi_blurfilter.js.html new file mode 100644 index 0000000..0731094 --- /dev/null +++ b/doc/out/pixi_blurfilter.js.html @@ -0,0 +1,1471 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/blurfilter.js

+ + + + +
+
+
+

pixi/blurfilter.js

+
+
+
+
/**
+ * A Gaussian blur filter. With this filter, you can blur an area of a PIXI.DisplayObject. This cannot
+ * be done with the PIXI.filters.BlurFilter (when you use the PIXI.filters.BlurFilter with
+ * an filter area, all pixels outside of the area are not displayed). Attention: The area of
+ * the filter is always in global scope, NOT relative to the PIXI.DisplayObject the filter
+ * is assigned to!
+ *
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 480,
+ *     height: 270,
+ *     transparent: false
+ * }).setup().run()
+ * 
+ * // Add a video sprite
+ * const sprite = new PIXI.Sprite(PIXI.Texture.fromVideo("assets/blurfilter.mp4"))
+ * sprite.width = app.size.width
+ * sprite.height = app.size.height
+ * app.scene.addChild(sprite)
+ * 
+ * // Create the filter and assign it to the scene
+ * const blurFilter = new BlurFilter(new PIXI.Rectangle(20, 20, 80, 60))
+ * app.scene.filters = [blurFilter]
+ * 
+ * @class
+ * @extends PIXI.Filter
+ * @param {PIXI.Rectangle|PIXI.Circle|PIXI.DisplayObject} shape The area where the blur effect should be applied to. Relative to the
+ *     canvas, NOT relative to the PIXI.DisplayObject where the blur effect is assigned to!
+ * @param {number} [blur=50] The strength of the blur.
+ */
+export default class BlurFilter extends PIXI.Filter {
+    
+    constructor(shape, blur = 50) {
+        super()
+
+        const normalized = this.normalize(shape)
+
+        this.tiltShiftXFilter = new TiltShiftXFilter(normalized, blur)
+        this.tiltShiftYFilter = new TiltShiftYFilter(normalized, blur)
+    }
+
+    apply(filterManager, input, output) {
+        let renderTarget = filterManager.getRenderTarget(true)
+        this.tiltShiftXFilter.apply(filterManager, input, renderTarget)
+        this.tiltShiftYFilter.apply(filterManager, renderTarget, output)
+        filterManager.returnRenderTarget(renderTarget)
+    }
+
+    /**
+     * The strength of the blur.
+     *
+     * @member {number}
+     */
+    get blur() {
+        return this.tiltShiftXFilter.blur
+    }
+    set blur(value) {
+        this.tiltShiftXFilter.blur = this.tiltShiftYFilter.blur = value
+    }
+    
+    /**
+     * The blur shape.
+     *
+     * @member {PIXI.Rectangle|PIXI.Circle|PIXI.DisplayObject}
+     */
+    get shape() {
+        return this.tiltShiftXFilter.shape
+    }
+    set shape(value) {
+        this.tiltShiftXFilter.shape = this.tiltShiftYFilter.shape = this.normalize(value)
+    }
+
+    /**
+     * 
+     * @private
+     * @param {PIXI.Rectangle|PIXI.Circle|PIXI.DisplayObject} value
+     * @returns {Object}
+     */
+    normalize(value) {
+
+        let shape = null
+
+        if (value instanceof PIXI.Circle) {
+            shape = {type: 'circle', x: value.x, y: value.y, r: value.radius}
+        } else if (value instanceof PIXI.Rectangle) {
+            shape = {type: 'rectangle', x: value.x, y: value.y, width: value.width, height: value.height}
+        } else {
+            const bounds = value.getBounds()
+            shape = {type: 'rectangle', x: bounds.x, y: bounds.y, width: bounds.width, height: bounds.height}
+        }
+
+        return shape
+    }
+}
+
+/**
+ * A TiltShiftAxisFilter.
+ *
+ * @class
+ * @extends PIXI.Filter
+ * @abstract
+ * @private
+ */
+class TiltShiftAxisFilter extends PIXI.Filter {
+
+    constructor(shape, blur){
+
+        const vertex = `
+            attribute vec2 aVertexPosition;
+            attribute vec2 aTextureCoord;
+
+            uniform mat3 projectionMatrix;
+
+            varying vec2 vTextureCoord;
+
+            void main(void) {
+                gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0);
+                vTextureCoord = aTextureCoord;
+            }
+        `
+
+        const fragment = `
+            varying vec2 vTextureCoord;
+
+            uniform vec4 filterArea;
+            uniform sampler2D uSampler;
+            uniform int shape;
+            uniform vec4 rectangle;
+            uniform vec3 circle;
+            uniform float blur;
+            uniform vec2 delta;
+            uniform vec2 texSize;
+
+            float random(vec3 scale, float seed) {
+                return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);
+            }
+
+            void main(void) {
+                // textureCoord to pixelCoord
+                vec2 pixelCoord = vTextureCoord * filterArea.xy - vec2(4.0, 4.0);   // FIXME: There's a shift of 4 * 4 pixels, don't know why...
+
+                bool inside = false;
+
+                if (shape == 1) {
+                    inside = distance(pixelCoord, circle.xy) <= circle.z;
+                } else if (shape == 2) {
+                    inside = pixelCoord.x >= rectangle.x && pixelCoord.x <= rectangle.z && pixelCoord.y >= rectangle.y && pixelCoord.y <= rectangle.w;
+                }
+
+                if (inside) {
+                    vec4 color = vec4(0.0);
+                    float total = 0.0;
+
+                    float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);
+
+                    for (float t = -30.0; t <= 30.0; t++) {
+                        float percent = (t + offset - 0.5) / 30.0;
+                        float weight = 1.0 - abs(percent);
+                        vec4 sample = texture2D(uSampler, vTextureCoord + delta / texSize * percent * blur);
+                        sample.rgb *= sample.a;
+                        color += sample * weight;
+                        total += weight;
+                    }
+
+                    gl_FragColor = color / total;
+                    gl_FragColor.rgb /= gl_FragColor.a + 0.00001;
+                } else {
+                    gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t));
+                }
+            }
+        `
+
+        super(vertex, fragment)
+        
+        if (shape.type === 'circle') {
+            this.uniforms.shape = 1
+            this.uniforms.circle = [shape.x, shape.y, shape.r]
+        } else {
+            this.uniforms.shape = 2
+            this.uniforms.rectangle = [shape.x, shape.y, shape.x + shape.width, shape.y + shape.height]
+        }
+        this.uniforms.blur = blur
+        this.uniforms.delta = new PIXI.Point(0, 0)
+        this.uniforms.texSize = new PIXI.Point(480, 270)
+
+        this.updateDelta()
+    }
+
+    /**
+     * The strength of the blur.
+     *
+     * @member {number}
+     * @memberof PIXI.filters.TiltShiftAxisFilter#
+     */
+    get blur() {
+        return this.uniforms.blur
+    }
+    set blur(value) {
+        this.uniforms.blur = value
+    }
+    
+    /**
+     * The blur shape.
+     *
+     * @member {PIXI.Rectangle}
+     * @memberof PIXI.filters.TiltShiftAxisFilter#
+     */
+    get shape() {
+        if (this.uniforms.shape === 1) {
+            const circle = this.uniforms.circle
+            return new PIXI.Circle(circle[0], circle[1], circle[2])
+        } else {
+            const rectangle = this.uniforms.rectangle
+            return new PIXI.Rectangle(rectangle[0], rectangle[1], rectangle[2], rectangle[3])
+        }
+    }
+    set shape(value) {
+        if (value.type === 'circle') {
+            this.uniforms.shape = 1
+            this.uniforms.circle = [value.x, value.y, value.r]
+        } else {
+            this.uniforms.shape = 2
+            this.uniforms.rectangle = [value.x, value.y, value.x + value.width, value.y + value.height]
+        }
+    }
+}
+
+/**
+ * A TiltShiftXFilter.
+ *
+ * @class
+ * @extends PIXI.TiltShiftAxisFilter
+ * @private
+ */
+class TiltShiftXFilter extends TiltShiftAxisFilter {
+    /**
+     * Updates the filter delta values.
+     */
+    updateDelta() {
+        this.uniforms.delta.x = 0.1
+        this.uniforms.delta.y = 0
+    }
+}
+
+/**
+ * A TiltShiftYFilter.
+ *
+ * @class
+ * @extends PIXI.TiltShiftAxisFilter
+ * @private
+ */
+class TiltShiftYFilter extends TiltShiftAxisFilter {
+    /**
+     * Updates the filter delta values.
+     */
+    updateDelta() {
+        this.uniforms.delta.x = 0
+        this.uniforms.delta.y = 0.1
+    }
+}
+
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_button.js.html b/doc/out/pixi_button.js.html new file mode 100644 index 0000000..2d3ac27 --- /dev/null +++ b/doc/out/pixi_button.js.html @@ -0,0 +1,1875 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/button.js

+ + + + +
+
+
+

pixi/button.js

+
+
+
+
import Theme from './theme.js'
+import Tooltip from './tooltip.js'
+import Badge from './badge.js'
+import Events from '../events.js'
+
+/**
+ * Callback for the button action.
+ *
+ * @callback actionCallback
+ * @param {object} event - The event object.
+ * @param {Button} button - A reference to the button (also this refers to the button).
+ */
+
+/**
+ * Callback for the button beforeAction.
+ *
+ * @callback beforeActionCallback
+ * @param {object} event - The event object.
+ * @param {Button} button - A reference to the button (also this refers to the button).
+ */
+
+/**
+ * Callback for the button afterAction.
+ *
+ * @callback afterActionCallback
+ * @param {object} event - The event object.
+ * @param {Button} button - A reference to the button (also this refers to the button).
+ */
+
+/**
+ * Class that represents a PixiJS Button.
+ *
+ * @example
+ * // Create the button
+ * const button = new Button({
+ *     label: 'My Button',
+ *     action: () => console.log('Button was clicked')
+ * })
+ *
+ * // Add the button to a DisplayObject
+ * app.scene.addChild(button)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PIXI.Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/button.html|DocTest}
+ */
+export default class Button extends PIXI.Container {
+
+    /**
+     * Creates an instance of a Button.
+     *
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the button.
+     * @param {number} [opts.id=auto generated] - The id of the button.
+     * @param {string} [opts.label] - The label of the button.
+     * @param {number} [opts.x=0] - The x position of the button. Can be also set after creation with button.x = 0.
+     * @param {number} [opts.y=0] - The y position of the button. Can be also set after creation with button.y = 0.
+     * @param {string|Theme} [opts.theme=dark] - The theme to use for this button. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {number} [opts.minWidth=44] - The minimum width of the button.
+     * @param {number} [opts.minHeight=44] - The minimum height of the button.
+     * @param {number} [opts.padding=Theme.padding] - The inner spacing (distance from icon and/or label) to the border.
+     * @param {string|PIXI.DisplayObject} [opts.icon] - The icon of the button. Can be a predefined one, an URL or an PIXI.DisplayObject.
+     * @param {string|PIXI.DisplayObject} [opts.iconActive=icon] - The icon of the button when activated. Can be a predefined one, an URL or an PIXI.DisplayObject.
+     * @param {string} [opts.iconPosition=left] - The position of the icon in relation to the label. Can be left or right.
+     * @param {number} [opts.iconColor=Theme.iconColor] - The color of the icon (set by the tint property) as a hex value.
+     * @param {number} [opts.iconColorActive=Theme.iconColorActive] - The color of the icon when activated.
+     * @param {number} [opts.fill=Theme.fill] - The color of the button background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - The alpha value of the background.
+     * @param {number} [opts.fillActive=Theme.fillActive] - The color of the button background when activated.
+     * @param {number} [opts.fillActiveAlpha=Theme.fillActiveAlpha] - The alpha value of the background when activated.
+     * @param {number} [opts.stroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=Theme.strokeWidth] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.strokeActive=Theme.strokeActive] - The color of the border when activated.
+     * @param {number} [opts.strokeActiveWidth=Theme.strokeActiveWidth] - The width of the border in pixel when activated.
+     * @param {number} [opts.strokeActiveAlpha=Theme.strokeActiveAlpha] - The alpha value of the border when activated.
+     * @param {object} [opts.textStyle=Theme.textStyle] - A textstyle object for the styling of the label. See PIXI.TextStyle
+     *     for possible options.
+     * @param {number} [opts.textStyleActive=Theme.textStyleActive] - A textstyle object for the styling of the label when the
+     *     button is activated. See PIXI.TextStyle for possible options.
+     * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link.
+     * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the button (which is a rounded rectangle).
+     * @param {boolean} [opts.disabled=false] - Is the button disabled? When disabled, the button has a lower alpha value
+     *     and cannot be clicked (interactive is set to false).
+     * @param {boolean} [opts.active=false] - Is the button initially active?
+     * @param {actionCallback} [opts.action] - Executed when the button was triggered (by pointerup).
+     * @param {beforeActionCallback} [opts.beforeAction] - Executed before the main action is triggered.
+     * @param {afterActionCallback} [opts.afterAction] - Executed after the main action was triggered.
+     * @param {string} [opts.type=default] - The type of the button. Can be default or checkbox. When the type is
+     *     checkbox, the active state is toggled automatically.
+     * @param {string} [opts.align=center] - The horizontal position of the label and the icon. Possible values are
+     *     left, center and right. Only affects the style when the minWidth is bigger than the width of the icon and label.
+     * @param {string} [opts.verticalAlign=middle] - The vertical position of the label and the icon. Possible values are
+     *     top, middle and button. Only affects the style when the minHeight is bigger than the height of the icon and label.
+     * @param {string|object} [opts.tooltip] - A string for the label of the tooltip or an object to configure the tooltip
+     *     to display.
+     * @param {string|object} [opts.badge] - A string for the label of the badge or an object to configure the badge to display.
+     *     If the parameter is an object, all badge options can be set plus the following:
+     * @param {string} [opts.badge.align=right] - The horizontal alignment of the badge. Possible values: left, center, right
+     * @param {string} [opts.badge.verticalAlign=top] - The vertical alignment of the badge. Possible values: top, middle, bottom
+     * @param {number} [opts.badge.offsetLeft=0] - The horizontal shift of the badge.
+     * @param {number} [opts.badge.offsetTop=0] - The vertical shift of the badge.
+     * @param {boolean} [opts.visible=true] - Is the button initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            label: null,
+            x: 0,
+            y: 0,
+            minWidth: 44,
+            minHeight: 44,
+            padding: theme.padding,
+            icon: undefined,
+            iconActive: undefined,
+            iconPosition: 'left',
+            iconColor: theme.iconColor,
+            iconColorActive: theme.iconColorActive,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            fillActive: theme.fillActive,
+            fillActiveAlpha: theme.fillActiveAlpha,
+            stroke: theme.stroke,
+            strokeWidth: theme.strokeWidth,
+            strokeAlpha: theme.strokeAlpha,
+            strokeActive: theme.strokeActive,
+            strokeActiveWidth: theme.strokeActiveWidth,
+            strokeActiveAlpha: theme.strokeActiveAlpha,
+            textStyle: theme.textStyle,
+            textStyleActive: theme.textStyleActive,
+            style: 'default',
+            radius: theme.radius,
+            disabled: false,
+            active: false,
+            action: null,
+            beforeAction: null,
+            afterAction: null,
+            type: 'default',
+            align: 'center',
+            verticalAlign: 'middle',
+            tooltip: null,
+            badge: null,
+            visible: true
+        }, opts)
+
+        this.id = this.opts.id
+
+        if (typeof this.opts.icon === 'undefined' && typeof this.opts.iconActive !== 'undefined') {
+            this.opts.icon = this.opts.iconActive
+        } else if (typeof this.opts.icon !== 'undefined' && typeof this.opts.iconActive === 'undefined') {
+            this.opts.iconActive = this.opts.icon
+        }
+
+        if (this.opts.style === 'link') {
+            Object.assign(this.opts, {strokeAlpha: 0, strokeActiveAlpha: 0, fillAlpha: 0, fillActiveAlpha: 0})
+        }
+
+        this._active = null
+        this._disabled = null
+
+        this.iconInactive = null
+        this.iconActive = null
+        this.text = null
+
+        this.button = null
+        this.content = null
+
+        this.tooltip = null
+        this.badge = null
+
+        this.visible = this.opts.visible
+
+        // setup
+        //-----------------
+        this.setup()
+    }
+
+    /**
+     * Captures an event to inform InteractionMapper about processed events.
+     *
+     * @param {event|PIXI.InteractionEvent} event - The PIXI event to capture.
+     */
+    capture(event) {
+        Events.capturedBy(event.data.originalEvent, this)
+    }
+
+    /**
+     * Creates children and instantiates everything.
+     *
+     * @private
+     * @return {Button} A reference to the button for chaining.
+     */
+    setup() {
+
+        // Button
+        //-----------------
+        let button = new PIXI.Graphics()
+        this.button = button
+        this.addChild(button)
+
+        // Content
+        //-----------------
+        let content = new PIXI.Container()
+        this.content = content
+        this.addChild(content)
+
+        // Text
+        //-----------------
+        if (this.opts.label) {
+            this.text = new PIXI.Text(this.opts.label, this.opts.textStyle)
+        }
+
+        // Icon
+        //-----------------
+        if (this.opts.icon) {
+            this.iconInactive = this.loadIcon(this.opts.icon, this.opts.iconColor)
+        }
+
+        if (this.opts.iconActive) {
+            this.iconActive = this.loadIcon(this.opts.iconActive, this.opts.iconColorActive)
+        }
+
+        // interaction
+        //-----------------
+        this.button.on('pointerover', e => {
+            this.capture(e)
+            TweenLite.to([this.button, this.content], this.theme.fast, {alpha: .83, overwrite: 'none'})
+        })
+
+        this.button.on('pointermove', e => {
+            this.capture(e)
+        })
+
+        this.button.on('pointerout', e => {
+            this.capture(e)
+            TweenLite.to([this.button, this.content], this.theme.fast, {alpha: 1, overwrite: 'none'})
+        })
+
+        this.button.on('pointerdown', e => {
+            //this.capture(e)
+            TweenLite.to([this.button, this.content], this.theme.fast, {alpha: .7, overwrite: 'none'})
+        })
+
+        this.button.on('pointerup', e => {
+            this.capture(e)
+            if (this.opts.beforeAction) {
+                this.opts.beforeAction.call(this, e, this)
+            }
+
+            if (this.opts.action) {
+                this.opts.action.call(this, e, this)
+            }
+
+            TweenLite.to([this.button, this.content], this.theme.fast, {alpha: .83, overwrite: 'none'})
+
+            if (this.opts.type === 'checkbox') {
+                this.active = !this.active
+            }
+
+            if (this.opts.afterAction) {
+                this.opts.afterAction.call(this, e, this)
+            }
+        })
+
+        // disabled
+        //-----------------
+        this.disabled = this.opts.disabled
+
+        // active
+        //-----------------
+        this.active = this.opts.active      // calls .layout()
+
+        // tooltip
+        //-----------------
+        if (this.opts.tooltip) {
+            if (typeof this.opts.tooltip === 'string') {
+                this.tooltip = new Tooltip({object: this, content: this.opts.tooltip})
+            } else {
+                this.opts.tooltip = Object.assign({}, {object: this}, this.opts.tooltip)
+                this.tooltip = new Tooltip(this.opts.tooltip)
+            }
+        }
+
+        // badge
+        //-----------------
+        if (this.opts.badge) {
+            let opts = Object.assign({}, {
+                align: 'right',
+                verticalAlign: 'top',
+                offsetLeft: 0,
+                offsetTop: 0
+            })
+            if (typeof this.opts.badge === 'string') {
+                opts = Object.assign(opts, {content: this.opts.badge})
+            } else {
+                opts = Object.assign(opts, this.opts.badge)
+            }
+
+            const badge = new Badge(opts)
+
+            switch (opts.align) {
+                case 'left':
+                    badge.x = this.x - badge.width / 2 + opts.offsetLeft
+                    break
+                case 'center':
+                    badge.x = this.x + this.width / 2 - badge.width / 2 + opts.offsetLeft
+                    break
+                case 'right':
+                    badge.x = this.x + this.width - badge.width / 2 + opts.offsetLeft
+            }
+
+            switch (opts.verticalAlign) {
+                case 'top':
+                    badge.y = this.y - badge.height / 2 + opts.offsetTop
+                    break
+                case 'middle':
+                    badge.y = this.y + this.height / 2 - badge.height / 2 + opts.offsetTop
+                    break
+                case 'bottom':
+                    badge.y = this.y + this.height - badge.height / 2 + opts.offsetTop
+            }
+
+            this.addChild(badge)
+
+            this.badge = badge
+        }
+
+        // set position
+        //-----------------
+        this.position.set(this.opts.x, this.opts.y)
+
+        return this
+    }
+
+    /**
+     * Should be called to refresh the layout of the button. Can be used after resizing.
+     *
+     * @return {Button} A reference to the button for chaining.
+     */
+    layout() {
+
+        // Clear content
+        //-----------------
+        this.removeChild(this.content)
+        this.content = new PIXI.Container()
+        this.addChild(this.content)
+
+        // Set the icon
+        //-----------------
+        let icon = null
+
+        if (!this.active && this.iconInactive) {
+            icon = this.iconInactive
+        } else if (this.active && this.iconActive) {
+            icon = this.iconActive
+        }
+
+        // Set the text
+        //-----------------
+        if (this.text) {
+            this.text.position.set(0, 0)
+        }
+
+        // Width and Height
+        //-----------------
+        let width = 0
+        if (icon && this.text) {
+            width = icon.width + this.text.width + 3 * this.opts.padding
+        } else if (icon) {
+            width = icon.width + 2 * this.opts.padding
+        } else if (this.text) {
+            width = this.text.width + 2 * this.opts.padding
+        }
+
+        if (width < this.opts.minWidth) {
+            width = this.opts.minWidth
+        }
+
+        let height = 0
+        if (icon) {
+            height = icon.height + 2 * this.opts.padding
+        } else if (this.text) {
+            height = this.text.height + 2 * this.opts.padding
+        }
+
+        if (height < this.opts.minHeight) {
+            height = this.opts.minHeight
+        }
+
+        this._width = width
+        this._height = height
+
+        // Position icon and text
+        //-----------------
+        if (icon && this.text) {
+            if (this.opts.iconPosition === 'right') {
+                icon.x = this.text.width + this.opts.padding
+            } else {
+                this.text.x = icon.width + this.opts.padding
+            }
+            this.content.addChild(icon, this.text)
+        } else if (icon) {
+            this.content.addChild(icon)
+        } else if (this.text) {
+            this.content.addChild(this.text)
+        }
+
+        this.layoutInnerContent()
+        this.layoutContent()
+
+        this.icon = icon
+
+        // draw
+        //-----------------
+        this.draw()
+
+        return this
+    }
+
+    /**
+     * Calculates the positions of the content children (icon and/or text).
+     *
+     * @private
+     * @return {Button} A reference to the button for chaining.
+     */
+    layoutInnerContent() {
+
+        for (let child of this.content.children) {
+            switch (this.opts.verticalAlign) {
+                case 'top':
+                    child.y = 0
+                    break
+                case 'middle':
+                    child.y = this.content.height / 2 - child.height / 2
+                    break
+                case 'bottom':
+                    child.y = this.content.height - child.height
+                    break
+            }
+        }
+
+        return this
+    }
+
+    /**
+     * Sets the horizontal and vertical position of the content.
+     * Uses the option keys "align" and "verticalAlign".
+     *
+     * @private
+     * @return {Button} A reference to the button for chaining.
+     */
+    layoutContent() {
+
+        switch (this.opts.align) {
+            case 'left':
+                this.content.x = this.opts.padding
+                break
+            case 'center':
+                this.content.x = ((this._width - this.content.width) / 2)
+                break
+            case 'right':
+                this.content.x = this._width - this.opts.padding - this.content.width
+                break
+        }
+
+        switch (this.opts.verticalAlign) {
+            case 'top':
+                this.content.y = this.opts.padding
+                break
+            case 'middle':
+                this.content.y = (this._height - this.content.height) / 2
+                break
+            case 'bottom':
+                this.content.y = this._height - this.opts.padding - this.content.height
+                break
+        }
+
+        return this
+    }
+
+    /**
+     * Draws the canvas.
+     *
+     * @private
+     * @return {Button} A reference to the button for chaining.
+     */
+    draw() {
+
+        this.button.clear()
+        if (this.active) {
+            this.button.lineStyle(this.opts.strokeActiveWidth, this.opts.strokeActive, this.opts.strokeActiveAlpha)
+            this.button.beginFill(this.opts.fillActive, this.opts.fillActiveAlpha)
+        } else {
+            this.button.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+            this.button.beginFill(this.opts.fill, this.opts.fillAlpha)
+        }
+        this.button.drawRoundedRect(0, 0, this._width, this._height, this.opts.radius)
+        this.button.endFill()
+
+        return this
+    }
+
+    /**
+     * Gets or sets the active state.
+     *
+     * @member {boolean}
+     */
+    get active() {
+        return this._active
+    }
+    set active(value) {
+
+        this._active = value
+
+        if (this._active) {
+            if (this.text) {
+                this.text.style = this.opts.textStyleActive
+            }
+        } else {
+            if (this.text) {
+                this.text.style = this.opts.textStyle
+            }
+        }
+
+        this.layout()
+    }
+
+    /**
+     * Gets or sets the disabled state. When disabled, the button cannot be clicked.
+     *
+     * @member {boolean}
+     */
+    get disabled() {
+        return this._disabled
+    }
+    set disabled(value) {
+
+        this._disabled = value
+
+        if (this._disabled) {
+            this.button.interactive = false
+            this.button.buttonMode = false
+            this.button.alpha = .5
+            if (this.icon) {
+                this.icon.alpha = .5
+            }
+            if (this.text) {
+                this.text.alpha = .5
+            }
+        } else {
+            this.button.interactive = true
+            this.button.buttonMode = true
+            this.button.alpha = 1
+            if (this.icon) {
+                this.icon.alpha = 1
+            }
+            if (this.text) {
+                this.text.alpha = 1
+            }
+        }
+    }
+
+    /**
+     * Shows the button (sets his alpha values to 1).
+     *
+     * @return {Button} A reference to the button for chaining.
+     */
+    show() {
+
+        this.opts.strokeAlpha = 1
+        this.opts.strokeActiveAlpha = 1
+        this.opts.fillAlpha = 1
+        this.opts.fillActiveAlpha = 1
+
+        this.layout()
+
+        return this
+    }
+
+    /**
+     * Hides the button (sets his alpha values to 0).
+     *
+     * @return {Button} A reference to the button for chaining.
+     */
+    hide() {
+
+        this.opts.strokeAlpha = 0
+        this.opts.strokeActiveAlpha = 0
+        this.opts.fillAlpha = 0
+        this.opts.fillActiveAlpha = 0
+
+        this.layout()
+
+        return this
+    }
+
+    /**
+     * Loads an icon
+     *
+     * @private
+     * @param {string|PIXI.DisplayObject} icon - The icon to load.
+     * @param {number} color - The color of the icon (if not an PIXI.DisplayObject).
+     * @return {PIXI.DisplayObject} Return the icon as an PIXI.DisplayObject.
+     */
+    loadIcon(icon, color) {
+
+        let displayObject = null
+
+        if (icon instanceof PIXI.DisplayObject) {
+            displayObject = icon
+        } else {
+            let size = 17
+            if (this.text) {
+                size = this.text.height
+            } else if (this.opts.minHeight) {
+                size = this.opts.minHeight - (2 * this.opts.padding)
+            }
+
+            const url = Button.iconIsUrl(icon) ? icon : `../../assets/icons/png/flat/${icon}.png`
+            const iconTexture = PIXI.Texture.fromImage(url, true)
+
+            const sprite = new PIXI.Sprite(iconTexture)
+            sprite.tint = color
+            sprite.width = size
+            sprite.height = size
+
+            displayObject = sprite
+        }
+
+        return displayObject
+    }
+
+    /**
+     * Tests if an icon string is an url.
+     *
+     * @private
+     * @static
+     * @param {string} url - The url to test.
+     * @return {boolean} true if the url is an url to an image.
+     */
+    static iconIsUrl(url) {
+        return /\.(png|svg|gif|jpg|jpeg|tif|tiff)$/i.test(url)
+    }
+
+    /**
+     * Gets or sets the color of the current icon (no matter how the status is). Changing the color, changes
+     * the tint property of the icon sprite.
+     *
+     * @member {number}
+     */
+    get iconColor() {
+        return this.icon ? this.icon.tint : null
+    }
+    set iconColor(value) {
+        if (this.icon) {
+            this.icon.tint = value
+        }
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_buttongroup.js.html b/doc/out/pixi_buttongroup.js.html new file mode 100644 index 0000000..0c2b78f --- /dev/null +++ b/doc/out/pixi_buttongroup.js.html @@ -0,0 +1,1554 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/buttongroup.js

+ + + + +
+
+
+

pixi/buttongroup.js

+
+
+
+
import Theme from './theme.js'
+import Button from './button.js'
+
+/**
+ * Class that represents a PixiJS ButtonGroup.
+ * 
+ * @example
+ * // Create the button group
+ * const buttonGroup = new ButtonGroup({
+ *     buttons: [
+ *         {label: 'Button 1', action: event => console.log(event)},
+ *         {label: 'Button 2', action: event => console.log(event)},
+ *         {label: 'Button 3', action: event => console.log(event)}
+ *     ],
+ *     minWidth: 100
+ * })
+ *
+ * // Add the button group to a DisplayObject
+ * app.scene.addChild(buttonGroup)
+ *
+ * @class
+ * @extends PIXI.Graphics
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Graphics.html|PIXI.Graphics}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/buttongroup.html|DocTest}
+ */
+export default class ButtonGroup extends PIXI.Graphics {
+
+    /**
+     * Creates an instance of a ButtonGroup.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the button group.
+     * @param {number} [opts.id=auto generated] - The id of the button group.
+     * @param {number} [opts.x=0] - The x position of the button group. Can be also set after creation with buttonGroup.x = 0.
+     * @param {number} [opts.y=0] - The y position of the button group. Can be also set after creation with buttonGroup.y = 0.
+     * @param {object[]} [opts.buttons=[]] - An array of the buttons of the button group. One item of the array (one object)
+     *     can have exactly the same properties as an Button object when instantiating a Button. If a property of the button group
+     *     conflicts with a property of a button object, the value from the button object will be used.
+     * @param {string|Theme=} [opts.theme=dark] - The theme to use for this button group. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {number} [opts.minWidth=44] - Button: The minimum width of one button.
+     * @param {number} [opts.minHeight=44] - Button: The minimum height of one button.
+     * @param {number} [opts.padding=Theme.padding] - Button: The inner spacing (distance from icon and/or label) the the border.
+     * @param {number} [opts.margin=Theme.margin] - The outer spacing (distance from one button to the previous/next button).
+     * @param {string} [opts.iconPosition=left] - Button: The position of the icon in relation to the label. Can be left or right.
+     * @param {number} [opts.iconColor=Theme.iconColor] - Button: The color of the icon (set by the tint property) as a hex value.
+     * @param {number} [opts.iconColorActive=Theme.iconColorActive] - Button: The color of the icon when activated.
+     * @param {number} [opts.fill=Theme.fill] - Button: The color of the button background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - Button: The alpha value of the background.
+     * @param {number} [opts.fillActive=Theme.fillActive] - Button: The color of the button background when activated.
+     * @param {number} [opts.fillActiveAlpha=Theme.fillActiveAlpha] - Button: The alpha value of the background when activated.
+     * @param {number} [opts.stroke=Theme.stroke] - Button: The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=Theme.strokeWidth] - Button: The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - Button: The alpha value of the border.
+     * @param {number} [opts.strokeActive=Theme.strokeActive] - Button: The color of the border when activated.
+     * @param {number} [opts.strokeActiveWidth=Theme.strokeActiveWidth] - Button: The width of the border in pixel when activated.
+     * @param {number} [opts.strokeActiveAlpha=Theme.strokeActiveAlpha] - Button: The alpha value of the border when activated.
+     * @param {object} [opts.textStyle=Theme.textStyle] - Button: A textstyle object for the styling of the label. See PIXI.TextStyle
+     *     for possible options.
+     * @param {number} [opts.textStyleActive=Theme.textStyleActive] - Button: A textstyle object for the styling of the label when the
+     *     button is activated. See PIXI.TextStyle for possible options.
+     * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link.
+     * @param {number} [opts.radius=Theme.radius] - Button: The radius of the four corners of the button (which is a rounded rectangle).
+     * @param {boolean} [opts.disabled=false] - Is the button group disabled? When disabled, the button group has a lower alpha value
+     *     and cannot be clicked (interactive of every button is set to false).
+     * @param {string} [opts.type=default] - The type of the button group. Can be default, checkbox or radio. When the type is
+     *     checkbox, the active state is toggled for each button automatically. When the type is radio, only one button can
+     *     be activated at the same time.
+     * @param {string} [opts.orientation=horizontal] - The orientation of the button group. Can be horizontal or vertical.
+     * @param {string} [opts.align=center] - Button: The horizontal position of the label and the icon. Possible values are
+     *     left, center and right. Only affects the style when the minWidth is bigger than the width of the icon and label.
+     * @param {string} [opts.verticalAlign=middle] - Button: The vertical position of the label and the icon. Possible values are
+     *     top, middle and bottom. Only affects the style when the minHeight is bigger than the height of the icon and label.
+     * @param {boolean} [opts.visible=true] - Is the button group initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            x: 0,
+            y: 0,
+            buttons: [],
+            minWidth: 44,
+            minHeight: 44,
+            padding: theme.padding,
+            margin: theme.margin,
+            iconPosition: 'left',             // left, right
+            iconColor: theme.iconColor,
+            iconColorActive: theme.iconColorActive,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            fillActive: theme.fillActive,
+            fillActiveAlpha: theme.fillActiveAlpha,
+            stroke: theme.stroke,
+            strokeWidth: theme.strokeWidth,
+            strokeAlpha: theme.strokeAlpha,
+            strokeActive: theme.strokeActive,
+            strokeActiveWidth: theme.strokeActiveWidth,
+            strokeActiveAlpha: theme.strokeActiveAlpha,
+            textStyle: theme.textStyle,
+            textStyleActive: theme.textStyleActive,
+            style: 'default',
+            radius: theme.radius,
+            disabled: null,
+            type: 'default',                   // default, checkbox, radio
+            orientation: 'horizontal',
+            align: 'center',                   // left, center, right
+            verticalAlign: 'middle',           // top, middle, bottom
+            visible: true
+        }, opts)
+
+        this.buttons = []
+
+        this._disabled = null
+        
+        this.visible = this.opts.visible
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {ButtonGroup} A reference to the button group for chaining.
+     */
+    setup() {
+
+        // Buttons
+        //-----------------
+        let position = 0
+
+        for (let it of this.opts.buttons) {
+
+            delete it.x
+            delete it.y
+
+            if (this.opts.orientation === 'horizontal') {
+                it.x = position
+            } else {
+                it.y = position
+            }
+
+            it.theme = it.theme || this.opts.theme
+            it.minWidth = it.minWidth || this.opts.minWidth
+            it.minHeight = it.minHeight || this.opts.minHeight
+            it.padding = it.padding || this.opts.padding
+            it.iconPosition = it.iconPosition || this.opts.iconPosition
+            it.iconColor = it.iconColor || this.opts.iconColor
+            it.iconColorActive = it.iconColorActive || this.opts.iconColorActive
+            it.fill = it.fill || this.opts.fill
+            it.fillAlpha = it.fillAlpha || this.opts.fillAlpha
+            it.fillActive = it.fillActive || this.opts.fillActive
+            it.fillActiveAlpha = it.fillActiveAlpha || this.opts.fillActiveAlpha
+            it.stroke = it.stroke || this.opts.stroke
+            it.strokeWidth = it.strokeWidth != null ? it.strokeWidth : this.opts.strokeWidth
+            it.strokeAlpha = it.strokeAlpha != null ? it.strokeAlpha : this.opts.strokeAlpha
+            it.strokeActive = it.strokeActive || this.opts.strokeActive
+            it.strokeActiveWidth = it.strokeActiveWidth != null ? it.strokeActiveWidth : this.opts.strokeActiveWidth
+            it.strokeActiveAlpha = it.strokeActiveAlpha != null ? it.strokeActiveAlpha : this.opts.strokeActiveAlpha
+            it.textStyle = it.textStyle || this.opts.textStyle
+            it.textStyleActive = it.textStyleActive || this.opts.textStyleActive
+            it.style = it.style || this.opts.style
+            it.radius = it.radius != null ? it.radius : this.opts.radius
+            if (!it.type) {
+                switch (this.opts.type) {
+                    case 'checkbox':
+                        it.type = this.opts.type
+                        break
+                    default:
+                        it.type = 'default'
+                        break
+                }
+            }
+            //it.type = it.type || this.opts.type || 'default'
+            it.align = it.align || this.opts.align
+            it.verticalAlign = it.verticalAlign || this.opts.verticalAlign
+            it.afterAction = (event, button) => {
+                if (this.opts.type === 'radio' && button.opts.type === 'default') {
+                    this.buttons.forEach(it => {
+                        if (it.opts.type === 'default') {
+                            it.active = false
+                        }
+                    })
+
+                    if (button.opts.type === 'default') {
+                        button.active = true
+                    }
+                }
+            }
+
+            if (it.tooltip) {
+                if (typeof it.tooltip === 'string') {
+                    it.tooltip = {content: it.tooltip, container: this}
+                } else {
+                    it.tooltip = Object.assign({}, {container: this}, it.tooltip)
+                }
+            }
+            
+            let button = new Button(it)
+
+            this.addChild(button)
+            this.buttons.push(button)
+
+            position += (this.opts.orientation === 'horizontal' ? button.width : button.height) + this.opts.margin
+        }
+
+        if (this.opts.orientation === 'vertical') {
+            const maxWidth = this.getMaxButtonWidth()
+
+            this.buttons.forEach(it => {
+                it.opts.minWidth = maxWidth
+                it.layout()
+            })
+        }
+
+        // disabled
+        //-----------------
+        if (this.opts.disabled != null) {
+            this.disabled = this.opts.disabled
+        }
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the button group. Can be used after resizing.
+     * 
+     * @return {ButtonGroup} A reference to the button group for chaining.
+     */
+    layout() {
+        
+        // set position
+        //-----------------
+        this.position.set(this.opts.x, this.opts.y)
+
+        // draw
+        //-----------------
+        this.draw()
+
+        return this
+    }
+    
+    /**
+     * Draws the canvas.
+     * 
+     * @private
+     * @return {ButtonGroup} A reference to the button group for chaining.
+     */
+    draw() {
+
+        if (this.opts.margin === 0) {
+
+            this.buttons.forEach(it => it.hide())
+
+            this.clear()
+            this.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+            this.beginFill(this.opts.fill, this.opts.fillAlpha)
+            this.drawRoundedRect(0, 0, this.width, this.height, this.opts.radius)
+
+            // Draw borders
+            this.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha / 2)
+
+            this.buttons.forEach((it, i) => {
+                if (i > 0) {
+                    this.moveTo(it.x, it.y)
+
+                    if (this.opts.orientation === 'horizontal') {
+                        this.lineTo(it.x, it.height)
+                    } else {
+                        this.lineTo(it.width, it.y)
+                    }
+                    
+                }
+            })
+
+            this.endFill()
+        }
+
+        return this
+    }
+    
+    /**
+     * Gets or sets the disabled state. When disabled, no button of the button group can be clicked.
+     * 
+     * @member {boolean}
+     */
+    get disabled() {
+        return this._disabled
+    }
+
+    set disabled(value) {
+
+        this._disabled = value
+
+        this.buttons.forEach(it => it.disabled = value)
+    }
+    
+    /**
+     * Searches all buttons of the button group and returns the maximum width of one button.
+     * 
+     * @private
+     * @return {number} The maximum with of a button of the button group.
+     */
+    getMaxButtonWidth() {
+
+        let widths = this.buttons.map(it => it.width)
+
+        return Math.max(...widths)
+    }
+    
+    /**
+     * Shows the button group (sets his alpha value to 1).
+     * 
+     * @return {ButtonGroup} A reference to the button group for chaining.
+     */
+    show() {
+
+        this.alpha = 1
+
+        return this
+    }
+
+    /**
+     * Hides the button group (sets his alpha value to 0).
+     * 
+     * @return {ButtonGroup} A reference to the button group for chaining.
+     */
+    hide() {
+
+        this.alpha = 0
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_deepzoom_image.js.html b/doc/out/pixi_deepzoom_image.js.html new file mode 100644 index 0000000..5dc95ba --- /dev/null +++ b/doc/out/pixi_deepzoom_image.js.html @@ -0,0 +1,2326 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/deepzoom/image.js

+ + + + +
+
+
+

pixi/deepzoom/image.js

+
+
+
+
import { Capabilities } from '../../capabilities.js'
+import { Points } from '../../utils.js'
+import { deepZoomTileCache } from './tile.js'
+import { Tiles } from './tiles.js'
+
+function isEven(n) {
+    return n % 2 == 0
+}
+
+
+function printTileCacheInfos() {
+    let references = new Map()
+    let multiples = 0
+    for (let [url, tiles] of deepZoomTileCache.entries()) {
+        let count = tiles.size
+        references.set(url, count)
+        if (count > 1) {
+            multiples += 1
+        }
+    }
+    console.log({ multiples, references })
+}
+/**
+ * A utility class that holds information typically provided by DZI files, i.e.
+ * height and width of the overall image, overlap, and image type.
+ *
+ * @constructor
+ * @param {obj} attrs - A JSON-Object holding the listed keys and values
+ * @example
+ *     {
+ *         "tileSize": 1024,
+ *         "format": "jpeg",
+ *         "overlap": 1,
+ *         "height": 4794,
+ *         "width": 4095,
+ *         "clip": { "minLevel": 12, "maxLevel": 20, "startCol": 301436, "startRow": 354060 },
+ *                   // optional: minLevel and maxLevel define the level bounds
+ *                   // startCol: first col at maxLevel
+ *                   // startRow: first row at maxLevel
+ *         "path": "var/Vermeer/Vermeer_files",
+ *         "type": "dzi",  // optional: dzi (default) or map
+ *         "urlTileTemplate": "{path}/{level}/{column}/{row}.{format}"
+ *           // optional: {path}/{level}/{column}_{row}.{format} (default) or
+ *           // a template String with the format of the URL
+ *     }
+ */
+export class DeepZoomInfo {
+    constructor(attrs) {
+        for (let key in attrs) {
+            this[key] = attrs[key]
+        }
+        this.maxLevel = 0 // The highest level number, typically corresponds to the
+        // number in the file system for the folder with tiles
+        this.clip = this.clip || null // e.g. { level: 12, col: 301436, row: 354060 }
+        this.type = this.type || 'dzi'
+        this.urlTileTemplate =
+            this.urlTileTemplate || '{path}/{level}/{column}_{row}.{format}'
+        this.setupDimensions()
+    }
+
+    /* Computes the needed number of layers from the width and height
+    *  of the image. Note that this includes the level 0, i.e. 0 ... 4
+    * means that 5 levels exist.
+    **/
+    numLevels() {
+        let maxDimension = Math.max(this.width, this.height)
+        let boundary = this.type === 'dzi' ? 1 : this.tileSize
+        let numLevels = 0
+        while (maxDimension >= boundary) {
+            maxDimension /= 2
+            numLevels++
+        }
+        return numLevels
+    }
+
+    /** Computes the scale at the given level.
+     * @param {number} level - The level of the wanted layer
+     * @returns {number} scale
+     **/
+    getScale(level) {
+        let scale = 1
+        if (this.type === 'dzi') {
+            scale = Math.pow(0.5, this.maxLevel - level + 1)
+        } else {
+            scale = Math.pow(0.5, this.maxLevel - level)
+        }
+        return scale
+    }
+
+    /** Computes the scaled width and height of the given level.
+     * @param {number} level - The level of the wanted layer
+     * @returns {array} size - The width and height
+     **/
+    getDimensions(level) {
+        let scale = this.getScale(level)
+        let w = Math.ceil(this.width * scale)
+        let h = Math.ceil(this.height * scale)
+        return [w, h]
+    }
+
+    /** Computes the number of cols and rows of tiles.
+     * @param {number} level - The level of the wanted layer
+     * @returns {array} size - The cols and rows
+     **/
+    getNumTiles(level) {
+        let dim = this.getDimensions(level)
+        let cols = Math.ceil(dim[0] / this.tileSize)
+        let rows = Math.ceil(dim[1] / this.tileSize)
+        if (this.clip) {
+            let rest = this.rests[level]
+            if (rest) {
+                if (rest.restCol) {
+                    cols += 1
+                }
+                if (rest.restRows) {
+                    rows += 1
+                }
+            }
+        }
+        return [cols, rows]
+    }
+
+    setupDimensions(loadBaseImage = false) {
+        /** Setup instance variables and load the base image, i.e. the largest
+        image that can be represented as a single tile.
+        @private
+        **/
+        let ww = this.width
+        let hh = this.height
+        let scale = 1.0
+        let level = 0
+        let single = 0
+        const tsize = this.tileSize
+
+        if (this.clip) {
+            this.baseLevel = this.clip.minLevel
+            this.maxLevel = this.clip.maxLevel
+            this.baseImage = null
+            this.size = this.getDimensions(this.baseLevel)
+            this.offsets = {}
+            this.rests = {}
+            let startCol = this.clip.startCol
+            let startRow = this.clip.startRow
+            let floatStartCol = startCol
+            let floatStartRow = startRow
+            for (let i = this.maxLevel; i >= this.baseLevel; i--) {
+                this.offsets[i] = { startCol, startRow }
+                let restCol = floatStartCol % 1
+                let restRow = floatStartRow % 1
+                this.rests[i] = { restCol, restRow }
+                startCol = Math.floor(startCol / 2)
+                startRow = Math.floor(startRow / 2)
+                floatStartCol /= 2
+                floatStartRow /= 2
+            }
+        } else {
+            const boundary = this.type === 'dzi' ? 1.0 : tsize
+            while (ww > boundary && hh > boundary) {
+                if (ww >= tsize && hh >= tsize) {
+                    single += 1
+                }
+                scale = scale / 2.0
+                ww = Math.ceil(this.width * scale)
+                hh = Math.ceil(this.height * scale)
+                level += 1
+            }
+            this.baseLevel = level - single
+            this.maxLevel = this.numLevels() - 1
+            this.baseURL = this.urlForTile(this.baseLevel, 0, 0, false)
+
+            if (loadBaseImage) {
+                this.imageForURL(this.baseURL, e => {
+                    this.size = [e.target.naturalWidth, e.target.naturalHeight]
+                    this.baseImage = e.target
+                })
+            } else {
+                this.baseImage = null
+                this.size = this.getDimensions(this.baseLevel)
+            }
+        }
+    }
+
+    get maxLoadableLevel() {
+        if (this.clip) {
+            return this.maxLevel
+        }
+        return this.type === 'dzi' ? this.maxLevel : this.maxLevel
+    }
+
+    /** Computes the url for the given level, column and and row.
+     * @param {number} level - The level of the wanted layer
+     * @param {number} column - The column of the tile
+     * @param {number} row - The row of the tile
+     * @returns {string} url
+     **/
+    urlForTile(level, column, row, compressed = true) {
+        let format = this.format
+        if (compressed && this.compression) {
+            let supported = Capabilities.isIOS ? 'pvr' : 'dds'
+            if (this.compression.indexOf(supported) >= 0) {
+                format = supported
+            }
+        }
+        if (this.clip) {
+            let offset = this.offsets[level]
+            if (offset) {
+                let { startCol, startRow } = offset
+                column += startCol
+                row += startRow
+            }
+        }
+        let url = this.urlTileTemplate
+            .replace(/\{path\}/g, this.path)
+            .replace(/\{level\}/g, level)
+            .replace(/\{row\}/g, row)
+            .replace(/\{column\}/g, column)
+            .replace(/\{format\}/g, format)
+        return url
+    }
+
+    /** Loads the image for the given url and executes a callback function
+    on completion.
+    * @param {string} url - The url of the tile
+    * @param {function} complete - The callback function
+    * @returns {Image} obj
+    **/
+    imageForURL(url, complete) {
+        let img = new Image()
+        img.onload = complete.bind(this)
+        img.src = url
+        return img
+    }
+
+    /** Computes the columns and rows as well as scaled width and height.
+     * @param {number} level - The level of the wanted layer
+     * @returns {array} [cols, rows, width, height]
+     **/
+    dimensions(level) {
+        let dim = this.getDimensions(level)
+        let tiles = this.getNumTiles(level)
+        return [tiles[0], tiles[1], dim[0], dim[1]]
+    }
+
+    test() {
+        //console.log("w=" + this.width + " h=" + this.height + " maxlevel=" + this.maxLevel + " base=" + this.baseLevel)
+        for (let i = 0; i <= this.maxLevel; i++) {
+            console.log(
+                ' ' +
+                i +
+                ' -> ' +
+                this.getScale(i) +
+                ' [' +
+                this.dimensions(i) +
+                ']'
+            )
+        }
+        console.log(this.urlForTile(this.baseLevel, 0, 0))
+    }
+}
+
+/**
+ * A utility class that describes a quad tree of tiles. Each tile on a given
+ * level has up to four corresponding tiles on the next level. A TileQuadNode
+ * uses the attributes nw (i.e. northwest), ne, sw, se to link to the
+ * quad nodes on the next level. The previous attributes links to the quad
+ * one level below that holds the given quad as nw, ne, sw, or se.
+ * We use this node class because we need a representation of tiles that are
+ * needed but not loaded yet to compute tiles which can be abandoned to reduce
+ * the memory pressure.
+ *
+ * @constructor
+ * @param {level} Number - The level the quad node belongs to
+ * @param {col} Number - The col of the quad
+ * @param {row} Number - The level the quad node belongs to
+ * @param {url} String - The level the quad node belongs to
+ */
+class TileQuadNode {
+    constructor(level, col, row, url) {
+        this.level = level
+        this.col = col
+        this.row = row
+        this.url = url
+        this.nw = null
+        this.ne = null
+        this.sw = null
+        this.se = null
+        this.previous = null
+    }
+
+    /** Return True if this node has no successors and can be used as
+    an indicator of tiles to free.
+    **/
+    noQuads() {
+        if (this.previous === null) return false
+        return (
+            this.nw === null &&
+            this.ne === null &&
+            this.sw === null &&
+            this.se === null
+        )
+    }
+
+    /** Unlink the given quad node
+
+    * @param {node} TileQuadNode - The TileQuadNode to remove
+    **/
+    unlink(node) {
+        if (this.nw === node) this.nw = null
+        if (this.ne === node) this.ne = null
+        if (this.sw === node) this.sw = null
+        if (this.se === node) this.se = null
+    }
+
+    /** Link this quad node to the given previous node. Use the north
+    * and west flags to address nw, ne, sw, and se.
+
+    * @param {node} TileQuadNode - The TileQuadNode to remove
+    * @param {north} Boolean - Link to north (true) or south (false)
+    * @param {west} Boolean - Link to west (true) or east (false)
+    **/
+    link(north, west, previous) {
+        this.previous = previous
+        if (north) {
+            if (west) {
+                previous.nw = this
+            } else {
+                previous.ne = this
+            }
+        } else {
+            if (west) {
+                previous.sw = this
+            } else {
+                previous.se = this
+            }
+        }
+    }
+}
+
+
+/**
+ * The main class of a deeply zoomable image that is represented by a hierarchy
+ * of tile layers for each zoom level. This gives the user the impression that
+ * even huge pictures (up to gigapixel-images) can be zoomed instantaneously,
+ * since the tiles at smaller levels are scaled immediately and overloaded by
+ * more detailed tiles at the larger level as fast as possible.
+
+ * @constructor
+ * @param {DeepZoomInfo} deepZoomInfo - Information extracted from a JSON-Object
+ */
+export class DeepZoomImage extends PIXI.Container {
+    constructor(
+        deepZoomInfo,
+        {
+            debug = false,
+            shadow = false,
+            center = false,
+            world = null,               // Defines the world bounds the images lives in
+            highResolution = true,
+            autoLoadTiles = true,
+            preferWorker = false,
+            minimumLevel = 0,
+            alpha = 1,
+            app = window.app
+        } = {}
+    ) {
+        super()
+        this.app = app
+        this.debug = debug
+        this.shadow = shadow
+        this.world = world
+        this.preferWorker = preferWorker
+        this.resolution = highResolution
+            ? Math.round(window.devicePixelRatio)
+            : 1
+        this.alpha = alpha
+        this.fastLoads = 0
+        this.autoLoadTiles = autoLoadTiles
+        this.minimumLevel = minimumLevel
+        this.quadTrees = new Map() // url as keys, TileQuadNodes as values
+        this.setup(deepZoomInfo, center)
+    }
+
+    get point() {
+        if (this._point == null) {
+            let graphics = new PIXI.Graphics()
+            graphics.lineStyle(2, 0x00ff00)
+            graphics.drawCircle(0, 0, 2)
+            graphics.interactive = false
+            this._point = graphics
+        }
+        return this._point
+    }
+
+    /** Reads the DeepZoomInfo object and initializes all tile layers.
+     * Called by the constructor.
+     * Creates the sprite for the loaded texture and add the sprite to the tile
+     * layer.
+     * @param {Object} deepZoomInfo - the DeepZoomInfo instance
+     * @param {boolean} center - If true ensures that the pivot is set to the center
+     **/
+    setup(deepZoomInfo, center) {
+        this.info = deepZoomInfo
+        this.interactive = true
+        this.tileLayers = {}
+
+        this._foreground = null
+        this.tileContainer = new PIXI.Container()
+        this.tileContainer.interactive = false
+
+        let [w, h] = this.baseSize
+        if (this.shadow) {
+            this.filters = [new PIXI.filters.DropShadowFilter(45, 3)]
+        }
+        this.addChild(this.tileContainer)
+
+        if (deepZoomInfo.clip) {
+            let mask = new PIXI.Graphics()
+            mask.beginFill(1, 1)
+            mask.drawRect(0, 0, w, h)
+            mask.endFill()
+            this.mask = mask
+            mask.alpha = 0
+            this.addChild(mask)
+            this.minimumLevel = deepZoomInfo.baseLevel
+        }
+        this.currentLevel = Math.max(this.minimumLevel, deepZoomInfo.baseLevel)
+        console.log("autoLoadTiles", this.autoLoadTiles)
+        if (this.autoLoadTiles) {
+            this.setupTiles(center)
+        }
+    }
+
+    /** Default setup method for tiles. Loads all tiles of the current level.
+    Can be overwritten in subclasses.
+    @param {boolean} center - If true ensures that the pivot is set to the center
+    **/
+    setupTiles(center = false) {
+        // First load background tile
+        let tiles = this.ensureAllTiles(this.currentLevel)
+        if (center) {
+            this.pivot.set(w / 2, h / 2)
+        }
+        let scaleLevel = this.levelForScale(1)
+        this.ensureAllTiles(scaleLevel)
+    }
+
+    removeTileQuadNode(level, col, row, url) {
+        if (this.quadTrees.has(url)) {
+            let quad = this.quadTrees.get(url)
+            this.tileQuadRemoved(quad)
+            this.quadTrees.delete(url)
+        }
+    }
+
+    addTileQuadNode(level, col, row, url) {
+        if (this.quadTrees.has(url)) return this.quadTrees.get(url)
+        let quad = new TileQuadNode(level, col, row, url)
+        this.quadTrees.set(url, quad)
+        this.tileQuadAdded(quad)
+        return quad
+    }
+
+    tileQuadRemoved(quad) {
+        let below = quad.previous
+        // if (this.debug) console.log("tileQuadRemoved", quad)
+        if (below) {
+            below.unlink(quad)
+            if (below.noQuads()) {
+                if (this.debug) console.log('Removed tile below')
+                let levelBelow = quad.level - 1
+                if (levelBelow < this.minimumLevel) return
+                let c = Math.floor(quad.col / 2)
+                let r = Math.floor(quad.row / 2)
+                let urlBelow = this.info.urlForTile(levelBelow, c, r)
+                if (this.quadTrees.has(urlBelow)) {
+                    this.removeTileQuadNode(levelBelow, c, r, urlBelow)
+                }
+            }
+        }
+    }
+
+    tileQuadAdded(quad) {
+        let levelBelow = quad.level - 1
+        if (levelBelow < this.minimumLevel) return
+        //if (this.debug) console.log("tileQuadAdded", quad)
+        let c = Math.floor(quad.col / 2)
+        let r = Math.floor(quad.row / 2)
+        let urlBelow = this.info.urlForTile(levelBelow, c, r)
+        let below = null
+        if (!this.quadTrees.has(urlBelow)) {
+            below = this.addTileQuadNode(levelBelow, c, r, urlBelow)
+            quad.link(isEven(quad.row), isEven(quad.col), below)
+        }
+    }
+
+    /** Returns the tile layer level that corresponds to the given scale.
+     * @param {number} scale - the scale factor
+     **/
+    levelForScale(scale) {
+        let level = Math.round(Math.log2(scale * this.resolution)) // Math.floor(Math.log2(event.scale))+1
+        let newLevel = this.info.baseLevel + Math.max(level, 0)
+        return Math.min(newLevel, this.info.maxLoadableLevel)
+    }
+
+    /** Returns the tile layer level that corresponds to the given scale.
+     * @param {number} scale - the scale factor
+     **/
+    levelAndAlphaForScale(scale) {
+        let value = Math.log2(scale * this.resolution)
+        let level = Math.round(value)
+        let newLevel = this.info.baseLevel + Math.max(level, 0)
+
+        return { level: Math.min(newLevel, this.info.maxLoadableLevel), alpha: value - level }
+    }
+
+    /** Adds a tile layer to the DeepZoomImage.
+     * @param {string} key - the access key
+     * @param {Tiles} tiles - the tile layer object
+     **/
+    addTiles(key, tiles) {
+        if (key in this.tileLayers) {
+            console.warn('Tiles already availabl', key)
+        }
+        this.tileContainer.addChild(tiles)
+        this.tileLayers[key] = tiles
+    }
+
+    destroyTiles(key) {
+        let tiles = this.tileLayers[key]
+        this.tileContainer.removeChild(tiles)
+        tiles.destroy()
+        delete this.tileLayers[key]
+    }
+
+    /** Getter for PIXI.Container foreground layer.
+     * Adds a PIXI.Container if necessary.
+     **/
+    get foreground() {
+        if (this._foreground == null) {
+            this._foreground = new PIXI.Container()
+            this.addChild(this._foreground)
+        }
+        return this._foreground
+    }
+
+    /** Getter for the DeepZoomInfo base level size.
+     **/
+    get baseSize() {
+        return this.info.getDimensions(this.info.baseLevel)
+    }
+
+    /** Getter for the current scaled size in pixels.
+     **/
+    get pixelSize() {
+        let [w, h] = this.baseSize
+        return [w * this.scale.x, h * this.scale.y]
+    }
+
+    /** Getter for the max scale factor.
+     **/
+    get maxScale() {
+        let delta = this.info.maxLevel - this.info.baseLevel
+        return Math.pow(2, delta) / this.resolution * 2
+    }
+
+    /** Getter for the current width.
+     **/
+    get width() {
+        return this.pixelSize[0]
+    }
+
+    /** Getter for the current height.
+     **/
+    get height() {
+        return this.pixelSize[1]
+    }
+
+
+    /* Overrides PIXI.Container.hitArea()
+     * Allows to optimize the hit testing. Container with hit areas are directly
+     * hit tested without consideration of children.
+     */
+    get hitArea() {
+        // Defining the hitArea resulted hitting the scatter in masked area
+        // when a mask was used (@Tüsch[submaps]). Removing the hitArea() altogether
+        // broke the interaction in other projects (@googleart).
+        // Fix: When masked, the hitArea is ignored by returning null.
+        // TODO: test if childs are hittested, without setting interactiveChildren.
+        // Opel, 03-05-2018
+        if (this.mask) {
+            return null
+        }
+        return this
+    }
+
+    /* Overrides PIXI.Container.contains()
+     * Allows to optimize the hit testing.
+     */
+    contains(x, y) {
+        let [w, h] = this.baseSize
+        return x >= 0 && x <= w && y >= 0 && y <= h
+    }
+
+    /** Overrides PIXI.Container._calculateBounds()
+     * Only considers the base size and reduces the calculation to a single
+     * rect.
+     */
+    _calculateBounds() {
+        let [w, h] = this.baseSize
+        this._bounds.addFrame(this.transform, 0, 0, w, h)
+    }
+
+    /** Overrides PIXI.Container.calculateBounds()
+     * Skips the children and only considers the deep zoom base size. Calls
+     * the also overwritten _calculateBounds method.
+     */
+    calculateBounds() {
+        this._bounds.clear()
+        this._calculateBounds()
+        this._lastBoundsID = this._boundsID
+    }
+
+    /** Returns a single sprite that can be used a thumbnail representation of
+     * large images.
+     * @return {Sprite} sprite - A sprite with a single tile texture
+     */
+    thumbnail() {
+        return new PIXI.Sprite.fromImage(this.info.baseURL)
+    }
+
+    /** Returns a list of all tiles of a given level.
+     * @param {Tiles} tiles - the grid of tiles
+     * @param {number} level - The zoom level of the grid
+     * @return {Array[]} - An array of [url, col, row] arrays
+     **/
+    allTiles(tiles, level) {
+        let result = []
+        for (let col = 0; col < tiles.cols; col++) {
+            for (let row = 0; row < tiles.rows; row++) {
+                let url = this.info.urlForTile(level, col, row)
+                result.push([url, col, row])
+            }
+        }
+        return result
+    }
+
+    worldBounds() {
+        let viewBounds = this.app.scene.bounds
+        // Using getBounds extends visible scope after loading tiles and leads
+        // to excessive loading
+        if (this.world != null) {
+            let bounds = this.world.bounds
+            let x = Math.max(-bounds.width, bounds.x)
+            let y = Math.max(-bounds.height, bounds.y)
+            let width = Math.min(viewBounds.width, bounds.width)
+            let height = Math.min(viewBounds.height, bounds.height)
+            //console.log("worldBounds new", { x, y, width, height })
+            return { x, y, width, height }
+        }
+        //console.log("worldBounds old", viewBounds)
+        return viewBounds
+    }
+
+    /** Loads all tiles that are needed to fill the app bounds.
+     * @param {Tiles} tiles - the grid of tiles
+     * @param {number} level - The zoom level of the grid
+     * @param {boolean} debug
+     * @return {Array[]} - An array of [url, col, row] arrays
+     */
+    neededTiles(tiles, level, debug = false) {
+        let needed = []
+        let tsize = tiles.tileSize
+        let worldBounds = this.worldBounds()
+        let maxWidth = worldBounds.width
+        let maxHeight = worldBounds.height
+
+        let pointInWindow = new PIXI.Point()
+        let worldTopLeft = new PIXI.Point(worldBounds.x, worldBounds.y)
+        let worldBottomRight = new PIXI.Point(worldBounds.x + maxWidth, worldBounds.y + maxHeight)
+        let worldCenter = new PIXI.Point(worldBounds.x + maxWidth / 2, worldBounds.y + maxHeight / 2)
+        let tilesCenter = tiles.toLocal(worldCenter)
+
+        let topLeft = tiles.toLocal(worldTopLeft)
+        let bottomRight = tiles.toLocal(worldBottomRight)
+        tiles._centerPoint = tilesCenter
+        let bounds = new PIXI.Rectangle(
+            topLeft.x,
+            topLeft.y,
+            bottomRight.x - topLeft.x,
+            bottomRight.y - topLeft.y)
+
+        tiles._boundsRect = bounds
+
+        /* UO: we need a toLocal call here since the transform may need an update
+        which is guaranteed by the toLocal method. */
+        let centerCol = Math.floor(tilesCenter.x / tsize)
+        let centerRow = Math.floor(tilesCenter.y / tsize)
+
+        // Expand because we want to test for included centers
+        bounds.x -= tsize / 2
+        bounds.y -= tsize / 2
+        bounds.width += tsize
+        bounds.height += tsize
+
+        try {
+            let maxTilesWidth = Math.ceil(maxWidth / tsize)
+            let maxTilesHeight = Math.ceil(maxHeight / tsize)
+
+            maxTilesWidth += 2
+            maxTilesHeight += 2
+
+            let startCol = Math.max(0, centerCol - maxTilesWidth)
+            let endCol = Math.min(tiles.cols, centerCol + maxTilesWidth)
+
+            let startRow = Math.max(0, centerRow - maxTilesHeight)
+            let endRow = Math.min(tiles.rows, centerRow + maxTilesHeight)
+
+            for (let col = startCol; col < endCol; col++) {
+                let cx = (col + 0.5) * tsize
+                for (let row = startRow; row < endRow; row++) {
+                    let cy = (row + 0.5) * tsize
+                    let tileCenter = new PIXI.Point(cx, cy)
+                    if (bounds.contains(tileCenter.x, tileCenter.y)) {
+                        let url = this.info.urlForTile(level, col, row)
+                        needed.push([url, col, row])
+                    }
+                }
+            }
+        } catch (error) {
+            console.warn(error.message)
+        }
+        return { centerCol, centerRow, needed }
+    }
+
+
+
+
+    /** Returns all changed tiles for a given level.
+     * @param {Tiles} tiles - the grid of tiles
+     * @param {number} level - The zoom level of the grid
+     * @return {object} - An object with the keys added and removed which values are [url, col, row] arrays
+     */
+    changedTiles(tiles, level) {
+        if (this.debug) console.time('changedTiles')
+        let changed = { added: [], removed: [] }
+        let newNeeded = new Map()
+        let { centerCol, centerRow, needed } = this.neededTiles(tiles, level)
+        needed.forEach(d => {
+            let [url, col, row] = d
+            newNeeded.set(url, [col, row])
+            if (!tiles.requested.has(url)) {
+                changed.added.push(d)
+            }
+        })
+        for (let url of tiles.needed.keys()) {
+            if (!newNeeded.has(url)) {
+                let [col, row] = tiles.needed.get(url)
+                changed.removed.push([url, col, row])
+            }
+        }
+        tiles.needed = newNeeded
+        if (this.debug) console.log(newNeeded)
+        if (this.debug) console.timeEnd('changedTiles')
+        return { centerCol, centerRow, changed }
+    }
+
+    /** Populates all tiles for a given level.
+     * @param {Tiles} tiles - the grid of tiles
+     * @param {number} level - The zoom level of the grid
+     */
+    populateAllTiles(tiles, level) {
+        let all = this.allTiles(tiles, level)
+        for (let [url, col, row] of all) {
+            this.addTileQuadNode(level, col, row, url)
+        }
+        tiles.loadTiles(all, false, 0, 0)
+    }
+
+    /** Loads all tiles that are needed to fill the browser window.
+     * If the optional about parameter is provided (as a point with col as x,
+     * and row as y attr) the tiles are sorted by the distance to this point.
+     *
+     * @param {Tiles} tiles - the grid of tiles
+     * @param {number} level - The zoom level of the grid
+     * Optional parameter:
+     * @param {boolean} onlyone - if true only one tile is loaded
+     * @param {PIXI.Point} about - point of interaction
+     */
+    populateTiles(tiles, level, { onlyone = false, about = null } = {}) {
+        if (tiles.isComplete())
+            return
+        let referenceCol = -1
+        let referenceRow = -1
+        let { centerCol, centerRow, changed } = this.changedTiles(tiles, level)
+        if (about != null) {
+            // We want to load tiles in the focus of the user first, therefore
+            // we sort according to the distance of the focus of interaction
+            let refPoint = this.toLocal(about)
+            let scaledTileSize = tiles.tileSize * tiles.tileScale
+            referenceCol = Math.floor(refPoint.x / scaledTileSize)
+            referenceRow = Math.floor(refPoint.y / scaledTileSize)
+        }
+        else {
+            referenceCol = centerCol
+            referenceRow = centerRow
+        }
+        referenceCol = centerCol
+        referenceRow = centerRow
+
+        let removed = changed.removed
+        for (let [url, col, row] of removed) {
+            this.removeTileQuadNode(level, col, row, url)
+        }
+        let added = changed.added
+        if (added.length == 0) return
+        for (let [url, col, row] of added) {
+            this.addTileQuadNode(level, col, row, url)
+        }
+        let ref = new PIXI.Point(referenceCol, referenceRow)
+        // Note: The array must be sorted in a way that the nearest tiles
+        // are at the end of the array since the load queue uses Array.push
+        // Array.pop
+        added.sort((a, b) => {
+            let aa = new PIXI.Point(a[1], a[2])
+            let bb = new PIXI.Point(b[1], b[2])
+            let da = Points.distance(aa, ref)
+            let db = Points.distance(bb, ref)
+            return db - da
+        })
+        tiles.loadTiles(added, onlyone, referenceCol, referenceRow)
+    }
+
+    /** Private method: creates all tiles for a given level.
+     * @param {number} level - The zoom level of the grid
+     * @return {Tiles} - tiles
+     */
+    _createTiles(key, level) {
+        let [cols, rows, w, h] = this.info.dimensions(level)
+        let increasedLevels = level - this.info.baseLevel
+        let invScale = Math.pow(0.5, increasedLevels)
+        let tiles = new Tiles(
+            level,
+            this,
+            invScale,
+            cols,
+            rows,
+            w,
+            h,
+            this.info.tileSize,
+            this.info.overlap
+        )
+        this.addTiles(key, tiles)
+        if (this.info.clip) {
+            let rest = this.info.rests[level]
+            if (rest) {
+                let x = rest.restCol * this.info.tileSize * invScale
+                let y = rest.restRow * this.info.tileSize * invScale
+                tiles.x = -x
+                tiles.y = -y
+            }
+        }
+        return tiles
+    }
+
+    /** Ensures that all needed tiles of a given level are loaded. Creates
+     * a new Tiles layer if necessary
+     * @param {number} level - The zoom level of the grid
+     * @return {Tiles} tiles
+     */
+    ensureTiles(level, about) {
+        let key = level.toString()
+        if (key in this.tileLayers) {
+            let tiles = this.tileLayers[key]
+            this.populateTiles(tiles, level, { about: about })
+            return tiles
+        }
+        let tiles = this._createTiles(key, level)
+        this.populateTiles(tiles, level, { about: about })
+        //console.log("ensureTiles", level)
+        return tiles
+    }
+
+    untintTiles(level) {
+        let key = level.toString()
+        if (key in this.tileLayers) {
+            let tiles = this.tileLayers[key]
+        }
+    }
+
+    /** Ensures that all tiles of a given level are loaded.
+     * @param {number} level - The zoom level of the grid
+     */
+    ensureAllTiles(level) {
+        let key = level.toString()
+        if (key in this.tileLayers) {
+            let tiles = this.tileLayers[key]
+            this.populateAllTiles(tiles, level)
+            tiles.keep = true
+            return
+        }
+        let tiles = this._createTiles(key, level)
+        this.populateAllTiles(tiles, level)
+        tiles.keep = true
+        return tiles
+    }
+
+    hideTilesAboveLevel(level) {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (tiles.level > level) {
+                tiles.visible = false
+            }
+        })
+    }
+
+    /** Destroys all tiles above a given level to ensure that the memory can
+     * be reused.
+     * @param {number} level - The zoom level of the grid
+     */
+    destroyTilesAboveLevel(level) {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (tiles.level > level && !tiles.keep) {
+                for (let url of tiles.available.keys()) {
+                    let quad = this.quadTrees.get(url)
+                    if (quad) this.removeTileQuadNode(quad)
+                }
+                this.destroyTiles(key)
+            }
+        })
+    }
+
+    destroyAllTiles() {
+        Object.keys(this.tileLayers).forEach(key => {
+            this.destroyTiles(key)
+        })
+    }
+
+    /**
+     * Tint tiles in all layers that are no longer needed
+     *
+     * @memberof DeepZoomImage
+     */
+    tintObsoleteTiles() {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            tiles.untintTiles()
+            if (!tiles.keep) {
+                tiles.tintObsoleteTiles()
+            }
+        })
+    }
+
+
+    /**
+     * Destroy tiles in all layers that are no longer needed
+     *
+     * @memberof DeepZoomImage
+     */
+    destroyUnneededTiles() {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (!tiles.keep) {
+                tiles.destroyUnneededTiles()
+            }
+        })
+    }
+
+    /**
+     * Destroy tiles in all layers that are no longer needed
+     *
+     * @memberof DeepZoomImage
+     */
+    destroyObsoleteTiles() {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (!tiles.keep) {
+                tiles.destroyObsoleteTiles()
+            }
+        })
+    }
+
+    /**
+     * Destroy tiles in all layers that are not part of the
+     * visible quadTrees
+     *
+     * @memberof DeepZoomImage
+     */
+    destroyTiles() {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (!tiles.keep) {
+                tiles.destroyTiles(this.quadTrees)
+            }
+        })
+    }
+
+    /* Tint all tiles
+    * @param {number} level - The zoom level of the grid
+    */
+    tintTilesBelowLevel(level) {
+        Object.keys(this.tileLayers).forEach(key => {
+            let tiles = this.tileLayers[key]
+            if (tiles.level < level) {
+                tiles.tintTiles(this.quadTrees)
+            }
+        })
+    }
+
+    /**
+     * Ensure that the given tiles layer is the topmost one and visible.
+     * @param {*} tiles 
+     */
+    bringTilesToFront(tiles) {
+        this.tileContainer.addChild(tiles)
+        tiles.visible = true
+    }
+
+    /** A callback function that can be used by a Scatter view to inform
+     * the zoomable image that it has been moved, rotated or scaled, and should
+     * load tiles accordingly.
+     * @param {PIXI.Point} translated - the movement of the scatter
+     * @param {number} scale - the zoom factor
+     * @param {PIXI.Point} about - the anchor point of the zoom
+     * @param {boolean} fast - informs the callback to return as fast as possible,
+     *  i.e. after loading a single tile
+     * @param {boolean} debug - log debug infos
+     */
+    transformed(event) {
+        let key = this.currentLevel.toString()
+        let currentTiles = this.tileLayers[key]
+        if (typeof currentTiles == 'undefined') {
+            return
+        }
+        if (event.fast) {
+            this.fastLoads += 1
+            this.populateTiles(currentTiles, this.currentLevel, {
+                onlyone: false,
+                about: event.about
+            })
+            if (this.fastLoads == 3) {
+                this.fastLoads = 0
+            }
+            else {
+                return
+            }
+        }
+        if (event.scale == null) {
+            this.ensureTiles(this.currentLevel, event.about)
+            return
+        }
+        
+        let level = this.levelForScale(event.scale)
+        let newLevel = Math.max(level, this.minimumLevel)
+        if (newLevel != this.currentLevel) {
+            if (!currentTiles.keep) {
+                currentTiles.loader.cancel()
+            }
+            this.hideTilesAboveLevel(newLevel)
+            currentTiles = this.ensureTiles(newLevel, event.about)
+            this.currentLevel = newLevel
+        } else {
+            this.ensureTiles(this.currentLevel, event.about)
+        }
+        this.bringTilesToFront(currentTiles)
+        if (this._foreground) {
+            this.addChild(this._foreground)
+        }
+    }
+
+    /**
+   *Activates the textures on the DeepZoomImage.
+   *
+   * @memberof DeepZoomImage
+   */
+    activate() {
+        this.destroyTilesAboveLevel(this.currentLevel)
+        this.ensureTiles(this.currentLevel, null)
+        //console.log("Activate Textures!", this.currentLevel)
+    }
+
+    /**
+   *Dectivates the textures on the DeepZoomImage.
+   *
+   * @memberof DeepZoomImage
+   */
+    deactivate() {
+        this.destroyAllTiles()
+        Object.keys(this.tileLayers).forEach(key => {
+            this.destroyTiles(key)
+        })
+        this.tileContainer.destroy({ children: true })
+        printTileCacheInfos()
+    }
+
+    throwFinished() {
+        console.log("throwFinished")
+        let key = this.currentLevel.toString()
+        let currentTiles = this.tileLayers[key]
+        if (typeof currentTiles == 'undefined') {
+            return
+        }
+
+        this.ensureTiles(this.currentLevel)
+        // let all = new Set()
+        // for (let tile of currentTiles.children) {
+        //     all.add(tile.url)
+        // }
+        // let { centerCol, centerRow, needed } = this.neededTiles(currentTiles, this.currentLevel)
+        // for (let [url, col, row] of needed) {
+        //     all.delete(url)
+        // }
+        // for (let url of all) {
+        //     currentTiles.destroyTileByUrl(url)
+        // }
+        // currentTiles.loader.loader.reset()
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_flippable.js.html b/doc/out/pixi_flippable.js.html new file mode 100644 index 0000000..83fb413 --- /dev/null +++ b/doc/out/pixi_flippable.js.html @@ -0,0 +1,1649 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/flippable.js

+ + + + +
+
+
+

pixi/flippable.js

+
+
+
+
/* globals Power2, Sine */
+/*eslint no-console: ["error", { allow: ["log", "info", "error"] }]*/
+
+/**
+ * Callback for the flippable onStart function.
+ *
+ * @callback onStartCallback
+ * @param {Flippable} flippable - A reference to the flippable (also this refers to the flippable).
+ */
+
+/**
+ * Callback for the flippable onUpdate function.
+ *
+ * @callback onUpdateCallback
+ * @param {Flippable} flippable - A reference to the flippable (also this refers to the flippable).
+ */
+
+/**
+ * Callback for the flippable onComplete function.
+ *
+ * @callback onCompleteCallback
+ * @param {Flippable} flippable - A reference to the flippable (also this refers to the flippable).
+ */
+
+/**
+ * Class that represents a PixiJS Flippable.
+ *
+ * @example
+ * const front = PIXI.Sprite.fromImage('./assets/front.jpg')
+ * const back = PIXI.Sprite.fromImage('./assets/back.jpg')
+ * app.scene.addChild(front)
+ * 
+ * // Create the flippable
+ * const flippable = new Flippable(front, back, app.renderer)
+ * 
+ * front.interactive = true
+ * front.on('click', event => flippable.toggle())
+ *
+ * @class
+ * @extends PIXI.projection.Camera3d
+ * @see {@link https://github.com/pixijs/pixi-projection|PixiJS Projection}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/flippable.html|DocTest}
+ */
+export default class Flippable extends PIXI.projection.Camera3d {
+
+    /**
+     * Creates an instance of a Flippable.
+     *
+     * @constructor
+     * @param {PIXI.DisplayObject} front - The object to show initially. Should have been added to the scene.
+     * @param {PIXI.DisplayObject} back - The object to show on the backside. Should have not been added to the scene.
+     * @param {PIXI.WebGLRenderer|PIXI.CanvasRenderer} renderer - The renderer of the application.
+     * @param {object} [opts] - An options object which can contain the following properties.
+     * @param {number} [opts.duration=1] - The duration of the flip animation in seconds.
+     * @param {GSAP.Ease} [opts.ease=Power2.easeOut] - The ease of the flip animation.
+     * @param {boolean} [opts.shadow=false] - Should be a shadow been display during the animation?
+     * @param {numer} [opts.eulerX=0] - The shift of the x-axis during the animation.
+     * @param {numer} [opts.eulerY=0] - The shift of the y-axis during the animation.
+     * @param {GSAP.Ease} [opts.eulerEase=Sine.easeOut] - The ease of the shift.
+     * @param {boolean} [opts.useBackTransforms=false] - When set to true, the flip animation also animates to the transform parameters of the back-object.
+     * @param {GSAP.Ease} [opts.transformEase=Power2.easeOut] - The ease of the transform.
+     * @param {numer} [opts.focus=800] - The value of the focus of the 3D camera (see pixi-projection).
+     * @param {numer} [opts.near=10] - The near value of the 3D camera (see pixi-projection).
+     * @param {numer} [opts.far=10000] - The far value of the 3D camera (see pixi-projection).
+     * @param {boolean} [opts.orthographic=false] - Should the flip animation be an orthographic animation?
+     * @param {function} [opts.onStart=null] - A callback executed on start of the flip animation.
+     * @param {function} [opts.onUpdate=null] - A callback executed on each step of the flip animation.
+     * @param {function} [opts.onComplete=null] - A callback executed when the flip animation is finished.
+     */
+    constructor(front, back, renderer, opts = {}) {
+
+        super()
+
+        this.opts = Object.assign({}, {
+            front,
+            back,
+            renderer,
+            duration: 1,
+            ease: Power2.easeOut,
+            shadow: false,
+            eulerX: 0,
+            eulerY: 0,
+            eulerEase: Sine.easeOut,
+            useBackTransforms: false,
+            transformEase: Power2.easeOut,
+            focus: 800,
+            near: 10,
+            far: 10000,
+            orthographic: false
+        }, opts)
+
+        // planes
+        //--------------------
+        this.setPlanes(this.opts.focus, this.opts.near, this.opts.far, this.opts.orthographic)
+
+        // flipped
+        //--------------------
+        this._flipped = false
+
+        // objects
+        //--------------------
+        this.objects = {}
+
+        // setup
+        //--------------------
+        this.setup()
+    }
+
+    /**
+     * Creates children and instantiates everything.
+     *
+     * @private
+     * @return {Flippable} A reference to the flippable for chaining.
+     */
+    setup() {
+
+        const scale = .5
+
+        // filters
+        //--------------------
+        const blurFilter = new PIXI.filters.BlurFilter()
+        blurFilter.blur = 0.2
+        this.objects.blurFilter = blurFilter
+
+        // outer
+        //--------------------
+        const outer = new PIXI.projection.Container3d()
+        outer.scale3d.set(scale)
+        this.addChild(outer)
+        this.objects.outer = outer
+
+        // shadow
+        //--------------------
+        const shadow = new PIXI.projection.Sprite3d(PIXI.Texture.fromImage('../../assets/images/shadow.png'))
+        shadow.renderable = false
+        shadow.anchor.set(0.5)
+        shadow.scale3d.set(.98)
+        shadow.alpha = 0.7
+        shadow.filters = [blurFilter]
+        shadow.visible = this.opts.shadow
+        outer.addChild(shadow)
+        this.objects.shadow = shadow
+        
+        // inner
+        //--------------------
+        const inner = new PIXI.projection.Container3d()
+        inner.euler.y = Math.PI
+        outer.addChild(inner)
+        this.objects.inner = inner
+
+        // front
+        //--------------------
+        const front = new PIXI.projection.Sprite3d(PIXI.Texture.EMPTY)
+        front.scale.set(-1 / scale, 1 / scale)
+        front.renderable = true
+        front.anchor.set(.5)
+        inner.addChild(front)
+        this.objects.front = front
+
+        // back
+        //--------------------
+        const back = new PIXI.projection.Sprite3d(PIXI.Texture.EMPTY)
+        back.scale.set(1 / scale, 1 / scale)
+        back.renderable = false
+        back.anchor.set(.5)
+        inner.addChild(back)
+        this.objects.back = back
+
+        return this
+    }
+
+    /**
+     * Gets or sets the flipped state.
+     *
+     * @member {boolean}
+     */
+    get flipped() {
+        return this._flipped
+    }
+    set flipped(toBack) {
+
+        this._flipped = toBack
+
+        // references
+        //--------------------
+        const front = this.objects.front
+        const back = this.objects.back
+        const inner = this.objects.inner
+        const shadow = this.objects.shadow
+        const blurFilter = this.objects.blurFilter
+
+        const half = this.opts.duration / 2
+        const ease = this.opts.eulerEase
+
+        const fromObject = toBack ? this.opts.front : this.opts.back
+        const toObject = toBack ? this.opts.back : this.opts.front
+
+        // set textures for virtual front and virtual back
+        //--------------------
+        front.texture = this.generateTexture(this.opts.front)
+        back.texture = this.generateTexture(this.opts.back)
+        
+        // switch objects and set params for virtual objects
+        //--------------------
+        const fromCenter = this.anchorToCenter(fromObject)
+        const toCenter = this.anchorToCenter(toObject)
+
+        // from values
+        //--------------------
+        this.x = fromCenter.x
+        this.y = fromCenter.y
+        front.width = fromObject.width * 2
+        front.height = fromObject.height * 2
+        back.width = fromObject.width * 2
+        back.height = fromObject.height * 2
+        this.rotation = fromObject.rotation
+        this.skew.x = fromObject.skew.x
+        this.skew.y = fromObject.skew.y
+
+        // calculate to values
+        //--------------------
+        const to = {
+            x: this.opts.useBackTransforms ? toCenter.x : fromCenter.x,
+            y: this.opts.useBackTransforms ? toCenter.y : fromCenter.y,
+            anchorX: this.opts.useBackTransforms ? toObject.x : fromObject.x,
+            anchorY: this.opts.useBackTransforms ? toObject.y : fromObject.y,
+            width: this.opts.useBackTransforms ? toObject.width * 2 : fromObject.width * 2,
+            height: this.opts.useBackTransforms ? toObject.height * 2 : fromObject.height * 2,
+            rotation: this.opts.useBackTransforms ? toObject.rotation : fromObject.rotation,
+            skewX: this.opts.useBackTransforms ? toObject.skew.x : fromObject.skew.x,
+            skewY: this.opts.useBackTransforms ? toObject.skew.y : fromObject.skew.y
+        }
+
+        // set toObject end values
+        //--------------------
+        toObject.x = to.anchorX
+        toObject.y = to.anchorY
+        toObject.width = to.width / 2
+        toObject.height = to.height / 2
+        toObject.rotation = to.rotation
+        toObject.skew.x = to.skewX
+        toObject.skew.y = to.skewY
+
+        // flip
+        //--------------------
+        TweenLite.to(inner.euler, this.opts.duration, {
+            y: toBack ? 0 : Math.PI,
+            ease: this.opts.ease,
+            onStart: () => {
+                this.switchDisplayObject(fromObject, this)
+                shadow.renderable = true
+                if (this.opts.onStart) {
+                    this.opts.onStart(this, this)
+                }
+            },
+            onUpdate: () => {
+                this.layout()
+                if (this.opts.onUpdate) {
+                    this.opts.onUpdate(this, this)
+                }
+            },
+            onComplete: () => {
+                this.switchDisplayObject(this, toObject)
+                shadow.renderable = false
+                if (this.opts.onComplete) {
+                    this.opts.onComplete(this, this)
+                }
+            }
+        })
+
+        // x & y
+        //--------------------
+        TweenLite.to(this, this.opts.duration, {
+            x: to.x,
+            y: to.y,
+            ease: this.opts.transformEase
+        })
+
+        // width & height
+        //--------------------
+        TweenLite.to([front, back], this.opts.duration, {
+            width: to.width,
+            height: to.height,
+            ease: this.opts.transformEase
+        })
+
+        // rotation
+        //--------------------
+        TweenLite.to(this, this.opts.duration, {
+            directionalRotation: {
+                rotation: `${to.rotation}_short`,
+                useRadians: true
+            },
+            ease: this.opts.transformEase
+        })
+
+        // skewX & skewY
+        //--------------------
+        TweenLite.to(this.skew, this.opts.duration, {
+            x: to.skewX,
+            y: to.skewY,
+            ease: this.opts.transformEase
+        })
+
+        // camera
+        //--------------------
+        new TimelineMax()
+            .to(this.euler, half, {x: this.opts.eulerX, y: this.opts.eulerY, ease})
+            .to(this.euler, half, {x: 0, y: 0, ease})
+
+        // shadow
+        //--------------------
+        new TimelineMax()
+            .to(shadow, half, {alpha: .3, ease})
+            .to(shadow, half, {alpha: .7, ease})
+        
+        // blurfilter
+        //--------------------
+        new TimelineMax()
+            .to(blurFilter, half, {blur: 6, ease})
+            .to(blurFilter, half, {blur: .2, ease})
+    }
+
+    /**
+     * Should be called to refresh the layout of the camera.
+     *
+     * @return {Flippable} A reference to the flippable for chaining.
+     */
+    layout() {
+
+        const front = this.objects.front
+        const back = this.objects.back
+        const shadow = this.objects.shadow
+        const inner = this.objects.inner
+        
+        inner.position3d.z = -Math.sin(inner.euler.y) * front.texture.baseTexture.width * 2
+
+        //this.objects.shadow.euler = this.objects.inner.euler
+        shadow.euler.x = -inner.euler.x
+        shadow.euler.y = -inner.euler.y
+        
+        if (this.frontSideInFront) {
+            front.renderable = true
+            back.renderable = false
+            shadow.width = front.width
+            shadow.height = front.height
+        } else {
+            front.renderable = false
+            back.renderable = true
+            shadow.width = back.width
+            shadow.height = back.height
+        }
+
+        return this
+    }
+
+    /**
+     * Toggles the flippable. Switches the sides.
+     *
+     * @private
+     * @return {Flippable} A reference to the flippable for chaining.
+     */
+    toggle() {
+        this.flipped = !this.flipped
+
+        return this
+    }
+
+    /**
+     * Gets the alignment state. true if the front side is in front, false otherwise.
+     *
+     * @member {boolean}
+     */
+    get frontSideInFront() {
+        return !this.objects.inner.isFrontFace()
+    }
+
+    /**
+     * Calculates the center point of an PIXI.DisplayObject.
+     *
+     * @private
+     * @param {PIXI.DisplayObject} displayObject - The DisplayObject from which to calculate the center.
+     * @return {object} Return an object with x and y.
+     */
+    anchorToCenter(displayObject) {
+        const bounds = displayObject.getBounds()
+        return {
+            x: bounds.x + bounds.width / 2,
+            y: bounds.y + bounds.height / 2
+        }
+    }
+
+    /**
+     * Creates children and instantiates everything.
+     *
+     * @private
+     * @param {PIXI.DisplayObject} displayObject - The DisplayObject from which to generate the texture.
+     * @return {PIXI.Texture} The generated PIXI.Texture.
+     */
+    generateTexture(displayObject) {
+
+        // renderTexture
+        //--------------------
+        const renderTexture = PIXI.RenderTexture.create(displayObject.width, displayObject.height)
+
+        // save position
+        const transform = [displayObject.x, displayObject.y, displayObject.scale.x, displayObject.scale.y, displayObject.rotation, displayObject.skew.x, displayObject.skew.y, displayObject.pivot.x, displayObject.pivot.y]
+
+        displayObject.position.set(0, 0)
+        displayObject.skew.set(0, 0)
+        displayObject.rotation = 0
+
+        // render
+        //--------------------
+        this.opts.renderer.render(displayObject, renderTexture)
+        
+        // restore position
+        displayObject.setTransform(...transform)
+
+        return renderTexture
+    }
+
+    /**
+     * Removed the first DisplayObject and adds the second one at the exactly same position.
+     *
+     * @private
+     * @param {PIXI.DisplayObject} first - The old DisplayObject.
+     * @param {PIXI.DisplayObject} second - The new DisplayObject.
+     * @return {Flippable} A reference to the flippable for chaining.
+     */
+    switchDisplayObject(first, second) {
+        if (first && second && first.parent) {
+            const parent = first.parent
+            const index = parent.getChildIndex(first)
+            parent.addChildAt(second, index)
+            parent.removeChild(first)
+        }
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_labeledgraphics.js.html b/doc/out/pixi_labeledgraphics.js.html new file mode 100644 index 0000000..8da3d72 --- /dev/null +++ b/doc/out/pixi_labeledgraphics.js.html @@ -0,0 +1,1622 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/labeledgraphics.js

+ + + + +
+
+
+

pixi/labeledgraphics.js

+
+
+
+

+
+/**
+ * Defines usefull default text styles.
+ */
+export class FontInfo {
+
+    static get small() {
+        return app.theme.textStyleSmall
+    }
+
+    static get normal() {
+        return app.theme.textStyle
+    }
+
+    static get centered() {
+        return Object.assign({}, app.theme.textStyle, { align: 'center' })
+    }
+}
+
+/**
+ * Static methods to support hyphenation of lines.
+ * 
+ * @class Hypenate
+ */
+export class Hypenate {
+
+    static splitPart(part) {
+        let parts = part.split('-')
+        if (parts.length == 1)
+            return [part]
+        let result = []
+        let last = parts.pop()
+        for (let p of parts) {
+            result.push(p + '-')
+        }
+        result.push(last)
+        return result.filter(p => p.length > 0)
+    }
+
+    static splitWord(word) {
+        if (typeof (language) == 'undefined') {
+            if (word.indexOf('-') > -1) {
+                return word.split('-')
+            }
+            return [word]
+        }
+        let parts = language.hyphenate(word)
+        let result = []
+        for (let part of parts) {
+            for (let splitted of this.splitPart(part)) {
+                result.push(splitted)
+            }
+        }
+        return result
+    }
+
+    static abbreviateLine(label, style, width) {
+        const pixiStyle = new PIXI.TextStyle(style)   
+        let metrics = PIXI.TextMetrics.measureText(label, pixiStyle)
+        while(metrics.width > width && label.length > 3) {
+            label = label.slice(0, label.length-1)
+            metrics = PIXI.TextMetrics.measureText(label, pixiStyle)
+        }
+        label = label.slice(0, label.length-1)
+        return label + '…'
+    }
+
+    static splitLine(line, pixiStyle, width, space, minus) {
+        let x = 0
+        let result = ''
+        let words = line.split(' ')
+        for (let word of words) {
+            let wordMetrics = PIXI.TextMetrics.measureText(word, pixiStyle)
+            if (x + wordMetrics.width >= width) {
+                let parts = this.splitWord(word)
+                let newWord = ''
+                if (parts.length == 1) {
+                    newWord += '\n' + word + ' '
+                    x = wordMetrics.width + space.width
+                }
+                else {
+                    let first = true
+                    let lastPart = ''
+                    for (let part of parts) {
+                        let partMetrics = PIXI.TextMetrics.measureText(part, pixiStyle)
+                        if (x + partMetrics.width + space.width > width) {
+                            newWord += ((first || lastPart.endsWith('-')) ? '\n' : '-\n') + part
+                            x = partMetrics.width
+                        }
+                        else {
+                            newWord += part
+                            x += partMetrics.width
+                        }
+                        lastPart = part
+                        first = false
+                    }
+                    x += space.width
+                }
+                result += newWord + ' '
+            }
+            else {
+                result += word + ' '
+                x += wordMetrics.width + space.width
+            }
+        }
+        return result
+    }
+
+    /**
+     *  Main method and entry point for text hyphenation 
+     *
+     * @static
+     * @param {*} text
+     * @param {*} style
+     * @param {*} width
+     * @memberof Hypenate
+     * @returns {string}
+     */
+    static splitLines(text, style, width) {
+        const pixiStyle = new PIXI.TextStyle(style)
+        const lines = text.split('\n')
+        const space = PIXI.TextMetrics.measureText(' ', pixiStyle)
+        const minus = PIXI.TextMetrics.measureText('-', pixiStyle)
+        let result = []
+        for (let line of lines) {
+            result.push(this.splitLine(line, pixiStyle, width, space, minus))
+        }
+        return result.join('\n')
+    }
+}
+
+class TextLabel extends PIXI.Text {
+
+    /**
+     *Creates an instance of TextLabel.
+     * @param {string} text - The string that you would like the text to display
+     * @param {object|PIXI.TextStyle} [style] - The style parameters 
+     * @param {canvas} 
+     * @memberof TextLabel
+     */
+    constructor(text, style=null, canvas=null, { minZoom = 0.1, maxZoom = 10} = {}) {
+        super(text, style, canvas )
+        this.normFontSize = this.style.fontSize 
+        this.minZoom = minZoom
+        this.maxZoom = maxZoom
+    }
+
+    zoom(factor) {
+        let oldValue = parseFloat(this.style.fontSize) / this.normFontSize
+        let value = oldValue * factor
+        this.setZoom(value)
+    }
+
+    setZoom(value) {
+        let oldValue = parseFloat(this.style.fontSize) / this.normFontSize
+        if (value > this.maxZoom) {
+            value = this.maxZoom
+        }
+        if (value < this.minZoom) {
+            value = this.minZoom
+        }
+        if (value != oldValue) {
+            this.style.fontSize = Math.max(value * this.normFontSize, 1)
+        }
+    }
+
+    setZoomAndScale(scale) {
+        this.scale.set(1 / scale)
+        this.setZoom(scale)
+    }
+}
+
+/**
+ * A specialization of the PIXI.Graphics class that allows to
+ * resuse and place labels across different layout variants
+ *
+ * @export
+ * @class LabeledGraphics
+ * @extends {PIXI.Graphics}
+ */
+export class LabeledGraphics extends PIXI.Graphics {
+
+    /**
+     * Creates an instance of LabeledGraphics and defines a local label cache.
+     * 
+     * @memberof LabeledGraphics
+     */
+    constructor() {
+        super()
+        this.labels = new Map()
+    }
+
+    _createText(label, fontInfo) {
+        return new TextLabel(label, fontInfo)
+    }
+
+    
+    /**
+     * Main additional method. Ensures that a text object is created that is cached
+     * under the given key.
+     *
+     * @param {*} key - The cache key
+     * @param {*} label - The label to show
+     * @param {*} [attrs={}] - Defines attributes of the text object. 
+     *                               align: 'right', 'left', or 'center'
+     *                               justify: 'top', 'bottom', or 'center'
+     *                               maxLines: {integer} truncates the text and adds ellipsis
+     *                               maxHeight: {number} truncates text that needs more space and adds ellipsis
+     *                               maxWidth: {number} word wraps text using hyphenation if possible
+     * @param {*} [fontInfo=FontInfo.normal] - Defines PIXI.TextStyle attributes
+     * @returns {PIXI.Text} - instance
+     * @memberof LabeledGraphics
+     */
+    ensureLabel(key, label, attrs = {}, fontInfo = FontInfo.normal) {
+
+        if (attrs.maxWidth && attrs.maxLines == 1) {
+            label = Hypenate.abbreviateLine(label, fontInfo, attrs.maxWidth)
+        }
+        else {
+            if (attrs.maxWidth) {
+                label = Hypenate.splitLines(label, fontInfo, attrs.maxWidth)
+            }
+            if (attrs.maxLines) {
+                label = this.truncateLabel(label, fontInfo, attrs.maxLines)
+            }
+            if (attrs.maxHeight) {
+                let styleInfo = new PIXI.TextStyle(fontInfo)
+                let metrics = PIXI.TextMetrics.measureText(label, styleInfo)
+                let maxLines = Math.max(attrs.maxHeight / metrics.lineHeight, 1)
+                label = this.truncateLabel(label, fontInfo, maxLines)
+            }
+        }
+       
+        if (!this.labels.has(key)) {
+            let text = this._createText(label, fontInfo)
+            this.labels.set(key, text)
+            this.addChild(text)
+        }
+        let text = this.labels.get(key)
+        for (let k in attrs) {
+            text[k] = attrs[k]
+        }
+        if (label != text.text)
+            text.text = label
+        // We do not follow the flexbox jargon and use align for x and justify for y axis
+        // This deviation is needed to ensure backward compatability
+        switch (attrs.justify || null) {
+            case 'top':
+                text.anchor.y = 0
+                break
+            case 'bottom':
+                text.anchor.x = 1
+                break
+            default:
+                text.anchor.y = 0.5
+                break
+        }
+        switch (attrs.align) {
+            case 'right':
+                text.anchor.x = 1
+                break
+            case 'center':
+                text.anchor.x = 0.5
+                break
+            default:
+                text.anchor.x = 0
+                break
+        }
+        text.visible = true
+        return text
+    }
+
+    /**
+     * Private method that truncates the text and adds an ellipsis if there are more lines
+     * than wanted
+     *
+     * @param {*} text
+     * @param {*} style
+     * @param {*} [maxLines=Infinity]
+     * @returns {string}
+     * @memberof LabeledGraphics
+     */
+    truncateLabel(text, style, maxLines = Infinity) {
+        if (maxLines === Infinity) {
+            return text
+        }
+        const { wordWrapWidth } = style
+        const pixiStyle = new PIXI.TextStyle(style)
+        const { lines } = PIXI.TextMetrics.measureText(text, pixiStyle)
+        let newText = text
+        if (lines.length > maxLines) {
+            const truncatedLines = lines.slice(0, maxLines)
+            const lastLine = truncatedLines[truncatedLines.length - 1]
+            const words = lastLine.split(' ')
+            const wordMetrics = PIXI.TextMetrics.measureText(`\u00A0\n...\n${words.join('\n')}`, pixiStyle)
+            const [spaceLength, dotsLength, ...wordLengths] = wordMetrics.lineWidths
+            const { text: newLastLine } = wordLengths.reduce((data, wordLength, i) => {
+                if (data.length + wordLength + spaceLength >= wordWrapWidth) {
+                    return { ...data, length: wordWrapWidth }
+                }
+                return {
+                    text: `${data.text}${i > 0 ? ' ' : ''}${words[i]}`,
+                    length: data.length + wordLength + spaceLength,
+                };
+            }, { text: '', length: dotsLength })
+            truncatedLines[truncatedLines.length - 1] = `${newLastLine}...`
+            newText = truncatedLines.join('\n')
+        }
+        return newText
+    }
+
+    /**
+     * Returns the label for the given key.
+     *
+     * @param {*} key
+     * @returns {Object}
+     * @memberof LabeledGraphics
+     */
+    getLabel(key) {
+        return this.labels.get(key)
+    }
+
+    /** 
+     * Hides the label with the given key.
+     * @param {*} key
+     * @memberof LabeledGraphics
+     */
+    hideLabel(key) {
+        let label = this.labels.get(key)
+        if (label) {
+            label.visible = false
+        }
+    }
+
+    /** 
+     * Removes the label with the given key.
+     * @param {*} key
+     * @memberof LabeledGraphics
+     */
+    removeLabel(key) {
+        let label = this.labels.get(key)
+        this.labels.delete(key)
+        label.destroy()
+    }
+
+   
+    /**
+     * Ensures that labels are hidden on clear.
+     *
+     * @memberof LabeledGraphics
+     */
+    clear() {
+        super.clear()
+        for (let key of this.labels.keys()) {
+            this.hideLabel(key)
+        }
+    }
+
+    /**
+     * Logs debugging infos
+     *
+     * @memberof LabeledGraphics
+     */
+    debugInfos() {
+        console.log({ size: this.labels.size, labels: this.labels })
+    }
+}
+
+
+const labelCache = new Map()
+
+function getTexture(label, fontInfo = FontInfo.normal) {
+    let key = label + fontInfo.fontFamily + fontInfo.fontSize
+
+    if (labelCache.has(key)) {
+        return labelCache.get(key)
+    }
+    let expandedFont = Object.assign({}, fontInfo)
+    expandedFont.fontSize *= window.devicePixelRatio
+    let text = new PIXI.Text(label, expandedFont)
+    text.updateText()
+    labelCache.set(key, text.texture)
+    return text.texture
+}
+
+class SpriteLabel extends PIXI.Sprite {
+
+    constructor(label, fontInfo) {
+        let texture = getTexture(label, fontInfo)
+        super(texture)
+        this.label = label
+        this.fontInfo = fontInfo
+        this.scale.set(0.8 / window.devicePixelRatio)
+    }
+
+    set text(label) {
+        this.label = label
+        this.texture = getTexture(label, this.fontInfo)
+    }
+
+    get text() {
+        return this.label
+    }
+}
+
+export class BitmapLabeledGraphics extends LabeledGraphics {
+
+    _createText(label, fontInfo) {
+        let texture = getTexture(label, fontInfo)
+        return new SpriteLabel(texture)
+    }
+
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_list.js.html b/doc/out/pixi_list.js.html new file mode 100644 index 0000000..042ec12 --- /dev/null +++ b/doc/out/pixi_list.js.html @@ -0,0 +1,1539 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/list.js

+ + + + +
+
+
+

pixi/list.js

+
+
+
+
/* globals */
+
+/* Imports */
+import Events from '../events.js'
+
+/**
+ * Class that represents a PixiJS List.
+ *
+ * @example
+ * const elephant1 = PIXI.Sprite.fromImage('./assets/elephant-1.jpg')
+ * const elephant2 = PIXI.Sprite.fromImage('./assets/elephant-2.jpg')
+ * 
+ * // Create the list
+ * const list = new List([elephant1, elephant2])
+ * 
+ * app.scene.addChild(list)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PixiJS Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/list.html|DocTest}
+ */
+export default class List extends PIXI.Container {
+
+    /**
+     * Creates an instance of a Flippable.
+     *
+     * @constructor
+     * @param {PIXI.DisplayObject[]} items - An array of PIXI.DisplayObjects.
+     * @param {object} [opts] - An options object which can contain the following properties.
+     * @param {number} [opts.width] - The width of the list. If the items are larger than this width, the overflow
+     *     will be hidden.
+     * @param {number} [opts.height] - The height of the list. If the items are larger than this height, the overflow
+     *     will be hidden.
+     * @param {number} [opts.padding=10] - The inner spacing (distance from one item to the previous/next item).
+     * @param {number} [opts.margin=10] - The outer spacing (distance from one item to the border).
+     * @param {string} [opts.orientation=vertical] - The orientation of the button group. Can be horizontal or vertical.
+     * @param {string} [opts.align=left] - The horizontal position of the items. Possible values are
+     *     left, center and right.
+     * @param {string} [opts.verticalAlign=middle] - The vertical position of the items. Possible values are
+     *     top, middle and bottom.
+     */
+    constructor(items = [], opts = {}) {
+
+        super()
+
+        this.opts = Object.assign({}, {
+            padding: 10,
+            margin: 10,
+            orientation: 'vertical',
+            align: 'left',
+            verticalAlign: 'middle',
+            width: null,
+            height: null
+        }, opts)
+
+        this.__items = items
+        this.__dragging = false
+
+        // setup
+        //--------------------
+        this.setup()
+    }
+
+    /**
+     * Creates children and instantiates everything.
+     *
+     * @private
+     * @return {List} A reference to the list for chaining.
+     */
+    setup() {
+
+        // inner container
+        //--------------------
+        const container = new PIXI.Container()
+        this.addChild(container)
+        this.container = container
+
+        // mask
+        //--------------------
+        const mask = new PIXI.Graphics()
+        this.addChild(mask)
+        this.__mask = mask
+
+        // add items
+        //--------------------
+        for(let item of this.__items) {
+            container.addChild(item)
+        }
+
+        // interaction
+        //--------------------
+        this.interactive = this.opts.width || this.opts.height
+        this.on('pointerdown', this.onStart.bind(this))
+        this.on('pointermove', this.onMove.bind(this))
+        this.on('pointerup', this.onEnd.bind(this))
+        this.on('pointercancel', this.onEnd.bind(this))
+        this.on('pointerout', this.onEnd.bind(this))
+        this.on('pointerupoutside', this.onEnd.bind(this))
+
+        this.layout()
+
+        return this
+    }
+
+    /**
+     * Replaces the existing items and relayouts the list.
+     *
+     * @param {PIXI.DisplayObject[]} items - An array of PIXI.DisplayObjects.
+     * @return {List} A reference to the list for chaining.
+     */
+    setItems(items) {
+        this.container.removeChildren()
+        this.__items = items
+        for(let item of this.__items) {
+            this.container.addChild(item)
+        }
+        this.layout()
+    }
+
+    /**
+     * Should be called to refresh the layout of the list (the width or the height).
+     *
+     * @return {List} A reference to the list for chaining.
+     */
+    layout() {
+
+        const margin = this.opts.margin
+
+        let x = margin
+        let y = margin
+
+        for (let item of this.__items) {
+
+            item.x = x
+            item.y = y
+
+            if (this.opts.orientation === 'vertical') {
+                y += item.height + this.opts.padding
+            } else {
+                x += item.width + this.opts.padding
+            }
+        }
+
+        // vertical
+        //--------------------
+        if (this.opts.orientation === 'vertical') {
+            switch (this.opts.align) {
+                case 'center':
+                    this.__items.forEach(it => it.x = margin + this.width / 2 - it.width / 2)
+                    break
+                case 'right':
+                    this.__items.forEach(it => it.x = margin + this.width - it.width)
+                    break
+                default:
+                    this.__items.forEach(it => it.x = margin)
+                    break
+            }
+
+            if (this.opts.height) {
+                const mask = this.__mask
+                mask.clear()
+                mask.beginFill(0x000)
+                mask.drawRect(0, 0, this.width + 2 * margin, this.opts.height)
+                this.mask = mask
+
+                this.interactive = this.innerHeight > this.opts.height
+            }
+        }
+
+        // horizontal
+        //--------------------
+        if (this.opts.orientation === 'horizontal') {
+            switch (this.opts.verticalAlign) {
+                case 'top':
+                    this.__items.forEach(it => it.y = margin)
+                    break
+                case 'bottom':
+                    this.__items.forEach(it => it.y = margin + this.height - it.height)
+                    break
+                default:
+                    this.__items.forEach(it => it.y = margin + this.height / 2 - it.height / 2)
+                    break
+            }
+
+            if (this.opts.width) {
+                const mask = this.__mask
+                mask.clear()
+                mask.beginFill(0x000)
+                mask.drawRect(0, 0, this.opts.width, this.height + 2 * margin)
+                this.mask = mask
+
+                this.interactive = this.innerWidth > this.opts.width
+            }
+        }
+
+        return this
+    }
+
+    /**
+     * 
+     */
+    get innerWidth() {
+
+        let size = 0
+
+        this.__items.forEach(it => size += it.width)
+        size += this.opts.padding * (this.__items.length - 1)
+        size += 2 * this.opts.margin
+
+        return size
+    }
+
+    /**
+     * 
+     */
+    get innerHeight() {
+
+        let size = 0
+
+        this.__items.forEach(it => size += it.height)
+        size += this.opts.padding * (this.__items.length - 1)
+        size += 2 * this.opts.margin
+
+        return size
+    }
+
+    /**
+     * Resizes the list.
+     * 
+     * @param {number} widthOrHeight - The new width (if orientation is horizontal) or height (if orientation is vertical) of the list.
+     */
+    resize(widthOrHeight) {
+
+        if (this.opts.orientation === 'horizontal') {
+            this.opts.width = widthOrHeight
+        } else {
+            this.opts.height = widthOrHeight
+        }
+
+        this.layout()
+    }
+
+    /**
+     * 
+     * @private
+     * @param {*} event 
+     */
+    onStart(event) {
+
+        this.__dragging = true
+
+        this.capture(event)
+
+        this.__delta = {
+            x: this.container.position.x - event.data.global.x,
+            y: this.container.position.y - event.data.global.y
+        }
+
+        TweenLite.killTweensOf(this.container.position, {x: true, y: true})
+        ThrowPropsPlugin.track(this.container.position, 'x,y')
+    }
+
+    /**
+     * 
+     * @private
+     * @param {*} event 
+     */
+    onMove(event) {
+
+        if (this.__dragging) {
+        
+            this.capture(event)
+
+            if (this.opts.orientation === 'horizontal') {
+                this.container.position.x = event.data.global.x + this.__delta.x
+            } else {
+                this.container.position.y = event.data.global.y + this.__delta.y
+            }
+        }
+    }
+
+    /**
+     * 
+     * @private
+     * @param {*} event 
+     */
+    onEnd(event) {
+
+        if (this.__dragging) {
+            this.__dragging = false
+
+            this.capture(event)
+
+            const throwProps = {}
+            
+            if (this.opts.orientation === 'horizontal') {
+                let min = this.opts.width - this.innerWidth
+                min = min > 0 ? 0 : min
+                throwProps.x = {
+                    velocity: 'auto',
+                    min,
+                    max: 0
+                }
+            } else {
+                let min = this.opts.height - this.innerHeight
+                min = min > 0 ? 0 : min
+                throwProps.y = {
+                    velocity: 'auto',
+                    min,
+                    max: 0
+                }
+            }
+
+            ThrowPropsPlugin.to(this.container.position, {
+                throwProps,
+                ease: Strong.easeOut,
+                onComplete: () => ThrowPropsPlugin.untrack(this.container.position)
+            }, .8, .4)
+        }
+    }
+
+    /**
+     * Captures an event to inform InteractionMapper about processed events.
+     *
+     * @param {event|PIXI.InteractionEvent} event - The PIXI event to capture.
+     */
+    capture(event) {
+        Events.capturedBy(event.data.originalEvent, this)
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_message.js.html b/doc/out/pixi_message.js.html new file mode 100644 index 0000000..0ec1a19 --- /dev/null +++ b/doc/out/pixi_message.js.html @@ -0,0 +1,1334 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/message.js

+ + + + +
+
+
+

pixi/message.js

+
+
+
+
import Theme from './theme.js'
+import {InteractivePopup} from './popup.js'
+
+/**
+ * Class that represents a Message. A message pops up and disappears after a specific amount of time.
+ * 
+ * @example
+ * // Create the PixiJS App
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * // Create a button
+ * let button = new Button({
+ *     label: 'Click me',
+ *     action: e => {
+ *         const message = new Message({
+ *             app: app,
+ *             header: 'Header',
+ *             content: 'Text.'
+ *         })
+ *         app.scene.addChild(message)
+ *     }
+ * })
+ * 
+ * // Add the button to the scene
+ * app.scene.addChild(button)
+ *
+ * @class
+ * @extends InteractivePopup
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/message.html|DocTest}
+ */
+export default class Message extends InteractivePopup {
+
+    /**
+     * Creates an instance of a Message.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the message.
+     * @param {PIXIApp} [opts.app=window.app] - The PIXIApp where this message belongs to.
+     * @param {boolean} [opts.closeButton=false] - Should a close button be displayed in the upper right corner?
+     * @param {number} [opts.minWidth=280] - The minimum width of the message box. Automatically expands with the content.
+     * @param {number} [opts.minHeight=100] - The minimum height of the message box. Automatically expands with the content.
+     * @param {number} [opts.margin=Theme.margin] - The outer spacing of the message box.
+     * @param {string} [opts.align=right] - The horizontal position of the message box relative to the app. Possible
+     *     values are left, center, right.
+     * @param {string} [opts.verticalAlign=top] - The vertical position of the message box relative to the app. Possible
+     *     values are top, middle, bottom.
+     * @param {number} [opts.duration=5] - The duration in seconds when the message box should disappear.
+     * @param {boolean} [opts.autoClose=true] - Should the message box be closed automatically?
+     * @param {number} [opts.closeDuration=Theme.fast] - The duration in seconds of the closing of the message box.
+     */
+    constructor(opts = {}) {
+        
+        const theme = Theme.fromString(opts.theme)
+
+        opts = Object.assign({}, {
+            app: window.app,
+            closeButton: false,
+            minWidth: 280,
+            minHeight: 100,
+            margin: theme.margin,
+            align: 'right',                     // left, center, right
+            verticalAlign: 'top',               // top, middle, bottom
+            duration: 5,
+            autoClose: true,
+            closeDuration: theme.fast
+        }, opts)
+
+        super(opts)
+    }
+
+    /**
+     * Relayouts the position of the message box.
+     * 
+     * @return {Message} Returns the message box for chaining.
+     */
+    layout() {
+
+        super.layout()
+
+        // horizontal
+        switch (this.opts.align) {
+            case 'left':
+                this.x = this.opts.margin
+                break
+            case 'center':
+                this.x = (this.opts.app.size.width / 2) - (this.width / 2)
+                break
+            case 'right':
+                this.x = this.opts.app.size.width - this.opts.margin - this.width
+                break
+        }
+
+        // vertical
+        switch (this.opts.verticalAlign) {
+            case 'top':
+                this.y = this.opts.margin
+                break
+            case 'middle':
+                this.y = (this.opts.app.size.height / 2) - (this.height / 2)
+                break
+            case 'bottom':
+                this.y = this.opts.app.size.height - this.opts.margin - this.height
+                break
+        }
+    }
+
+    /**
+     * Shows the message box.
+     * 
+     * @private
+     */
+    show() {
+
+        super.show()
+
+        if (this.opts.autoClose) {
+            window.setTimeout(() => {
+                this.hide()
+            }, this.opts.duration * 1000)
+        }
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_modal.js.html b/doc/out/pixi_modal.js.html new file mode 100644 index 0000000..6f6c5f8 --- /dev/null +++ b/doc/out/pixi_modal.js.html @@ -0,0 +1,1409 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/modal.js

+ + + + +
+
+
+

pixi/modal.js

+
+
+
+
import Theme from './theme.js'
+import {InteractivePopup} from './popup.js'
+
+/**
+ * Class that represents a PixiJS Modal.
+ * 
+ * @example
+ * // Create the button and the modal when clicked
+ * const button = new Button({
+ *     label: 'Show Modal',
+ *     action: e => {
+ *         const modal = new Modal({
+ *             app: app,
+ *             header: 'This is the header',
+ *             content: 'This is the text.'
+ *         })
+ *         app.scene.addChild(modal)
+ *     }
+ * })
+ *
+ * // Add the button to a DisplayObject
+ * app.scene.addChild(button)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @extends InteractivePopup
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PIXI.Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/modal.html|DocTest}
+ */
+export default class Modal extends PIXI.Container {
+
+    /**
+     * Creates an instance of a Modal.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the modal.
+     * @param {number} [opts.id=auto generated] - The id of the modal.
+     * @param {PIXIApp} [opts.app=window.app] - The app where the modal belongs to.
+     * @param {number} [opts.backgroundFill=Theme.background] - The color of the background.
+     * @param {number} [opts.backgroundFillAlpha=0.6] - The opacity of the background.
+     * @param {boolean} [opts.closeOnBackground=true] - Should the modal be closed when the user clicks the
+     *     background?
+     * @param {boolean} [opts.visible=true] - Is the modal initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            app: window.app,
+            backgroundFill: theme.background,
+            backgroundFillAlpha: .6,
+            closeOnBackground: true,
+            visible: true
+        }, opts)
+
+        this.id = this.opts.id
+
+        this.background = null
+        this.popup = null
+
+        this.alpha = 0
+        this.visible = this.opts.visible
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Modal} A reference to the modal for chaining.
+     */
+    setup() {
+
+        // interaction
+        //-----------------
+        this.interactive = true
+        this.on('added', e => {
+            if (this.visible) {
+                this.show()
+            }
+        })
+
+        // background
+        //-----------------
+        let background = new PIXI.Graphics()
+        this.background = background
+        this.addChild(this.background)
+
+        if (this.opts.closeOnBackground) {
+            background.interactive = true
+            background.on('pointerup', e => {
+                this.hide()
+            })
+        }
+
+        // popup
+        //-----------------
+        const popupOpts = Object.assign({}, this.opts, {
+            visible: true,
+            onHidden: () => {
+                this.hide()
+            }
+        })
+        let popup = new InteractivePopup(popupOpts)
+        this.popup = popup
+        this.addChild(popup)
+        popup.show()
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the modal. Can be used after resizing.
+     * 
+     * @return {Modal} A reference to the modal for chaining.
+     */
+    layout() {
+
+        const width = this.opts.app.size.width
+        const height = this.opts.app.size.height
+
+        // background
+        //-----------------
+        this.background.clear()
+        this.background.beginFill(this.opts.backgroundFill, this.opts.backgroundFillAlpha)
+        this.background.drawRect(0, 0, width, height)
+        this.background.endFill()
+
+        // position
+        this.popup.x = width / 2 - this.popup.width / 2
+        this.popup.y = height / 2 - this.popup.height / 2
+
+        return this
+    }
+    
+    /**
+     * Shows the modal (sets his alpha values to 1).
+     * 
+     * @return {Modal} A reference to the modal for chaining.
+     */
+    show() {
+        TweenLite.to(this, this.theme.fast, {alpha: 1, onStart: () => this.visible = true})
+
+        return this
+    }
+    
+    /**
+     * Hides the modal (sets his alpha values to 0).
+     * 
+     * @return {Modal} A reference to the modal for chaining.
+     */
+    hide() {
+        TweenLite.to(this, this.theme.fast, {alpha: 0, onComplete: () => this.visible = false})
+
+        return this
+    }
+    
+    /**
+     * Sets or gets the header. The getter always returns a PIXI.Text object. The setter can receive
+     * a string or a PIXI.Text object.
+     * 
+     * @member {string|PIXI.Text}
+     */
+    get header() {
+        return this.popup.header
+    }
+    set header(value) {
+        this.opts.header = value
+        this.background.destroy()
+        this.popup.destroy()
+        this.setup().layout()
+    }
+    
+    /**
+     * Sets or gets the content. The getter always returns an PIXI.DisplayObject. The setter can receive
+     * a string or a PIXI.DisplayObject.
+     * 
+     * @member {string|PIXI.DisplayObject}
+     */
+    get content() {
+        return this.popup.content
+    }
+    set content(value) {
+        this.opts.content = value
+        this.background.destroy()
+        this.popup.destroy()
+        this.setup().layout()
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_popup.js.html b/doc/out/pixi_popup.js.html new file mode 100644 index 0000000..b97070b --- /dev/null +++ b/doc/out/pixi_popup.js.html @@ -0,0 +1,1421 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/popup.js

+ + + + +
+
+
+

pixi/popup.js

+
+
+
+
import AbstractPopup from './abstractpopup.js'
+import Button from './button.js'
+import ButtonGroup from './buttongroup.js'
+
+/**
+ * Class that represents a PixiJS InteractivePopup.
+ * The class is used for various other Popup-like classes
+ * like Popup, Message...
+ *
+ * @class
+ * @abstract
+ * @extends AbstractPopup
+ */
+export class InteractivePopup extends AbstractPopup {
+
+    /**
+     * Creates an instance of an InteractivePopup (only for internal use).
+     *
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the popup.
+     * @param {boolean} [opts.closeOnPopup=false] - Should the popup be closed when the user clicks on the popup?
+     * @param {boolean} [opts.closeButton=true] - Should a close button be displayed on the upper right corner?
+     * @param {object} [opts.button] - A Button object to be display on the lower right corner.
+     * @param {object} [opts.buttonGroup] - A ButtonGroup object to be displayed on the lower right corner.
+     */
+    constructor(opts = {}) {
+
+        opts = Object.assign({}, {
+            closeOnPopup: false,
+            closeButton: true,
+            button: null,
+            buttonGroup: null
+        }, opts)
+
+        super(opts)
+
+        this._closeButton = null
+        this._buttons = null
+
+        // padding
+        this.smallPadding = this.opts.padding / 2
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+
+    /**
+     * Creates the framework and instantiates everything.
+     *
+     * @private
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    setup() {
+
+        super.setup()
+
+        // interaction
+        //-----------------
+        this.on('pointerup', e => {
+            if (this.opts.closeOnPopup) {
+                this.hide()
+            } else {
+                e.stopPropagation()
+            }
+        })
+
+        // closeButton
+        //-----------------
+        if (this.opts.closeButton) {
+            let closeButton = PIXI.Sprite.fromImage('../../assets/icons/png/flat/close.png', true)
+            closeButton.width = this.headerStyle.fontSize
+            closeButton.height = closeButton.width
+            closeButton.tint = this.theme.color2
+            // This is needed, because the closeButton belongs to the content. The popup must resize with the closeButton.
+            if (this._header) {
+                closeButton.x = this._header.width + this.innerPadding
+            } else if (this._content) {
+                closeButton.x = this._content.width + this.innerPadding
+            }
+
+            closeButton.interactive = true
+            closeButton.buttonMode = true
+            closeButton.on('pointerdown', e => {
+                this.hide()
+            })
+
+            this._closeButton = closeButton
+            this.addChild(closeButton)
+
+            // maxWidth is set and a closeButton should be displayed
+            //-----------------
+            if (this.opts.maxWidth) {
+                const wordWrapWidth = this.opts.maxWidth - (2 * this.opts.padding) - this.smallPadding - this._closeButton.width
+                if (this._header) {
+                    this.headerStyle.wordWrapWidth = wordWrapWidth
+                } else if (this._content) {
+                    this.textStyle.wordWrapWidth = wordWrapWidth
+                }
+            }
+        }
+
+        // buttons
+        //-----------------
+        if (this.opts.button || this.opts.buttonGroup) {
+            if (this.opts.button) {
+                this._buttons = new Button(Object.assign({textStyle: this.theme.textStyleSmall}, this.opts.button))
+            } else {
+                this._buttons = new ButtonGroup(Object.assign({textStyle: this.theme.textStyleSmall}, this.opts.buttonGroup))
+            }
+            this.addChild(this._buttons)
+
+            this._buttons.y = this.innerPadding + this.sy
+        }
+
+        return this
+    }
+
+    /**
+     * Should be called to refresh the layout of the popup. Can be used after resizing.
+     *
+     * @return {AbstractPopup} A reference to the popup for chaining.
+     */
+    layout() {
+
+        super.layout()
+        
+        // closeButton
+        //-----------------
+        if (this.opts.closeButton) {
+            this._closeButton.x = this.wantedWidth - this.smallPadding - this._closeButton.width
+            this._closeButton.y = this.smallPadding
+        }
+
+        // buttons
+        //-----------------
+        if (this._buttons) {
+            this._buttons.x = this.wantedWidth - this.opts.padding - this._buttons.width
+            this._buttons.y = this.wantedHeight - this.opts.padding - this._buttons.height
+        }
+
+        return this
+    }
+
+    /**
+     * Calculates the size of the children of the AbstractPopup.
+     * Cannot use getBounds() because it is not updated when children
+     * are removed.
+     * 
+     * @private
+     * @override
+     * @returns {object} An JavaScript object width the keys width and height.
+     */
+    getInnerSize() {
+
+        let size = super.getInnerSize()
+
+        if (this._closeButton) {
+            size.width += this.smallPadding + this._closeButton.width
+        }
+
+        if (this._buttons) {
+            size.width = Math.max(size.width, this._buttons.x + this._buttons.width)
+            size.height += this.innerPadding + this._buttons.height
+        }
+
+        return size
+    }
+}
+
+/**
+ * Class that represents a PixiJS Popup.
+ *
+ * @example
+ * // Create the popup
+ * const popup = new Popup({
+ *     header: 'Goethe',
+ *     content: 'Man kann die Erfahrung nicht früh genug machen, wie entbehrlich man in der Welt ist.'
+ * })
+ *
+ * // Add the popup to a DisplayObject
+ * app.scene.addChild(popup)
+ *
+ * @class
+ * @extends InteractivePopup
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/popup.html|DocTest}
+ */
+export default class Popup extends InteractivePopup {
+
+    /**
+     * Creates an instance of a Popup.
+     *
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the popup.
+     * @param {boolean} [opts.closeButton=false] - Should a close button be displayed on the upper right corner?
+     * @param {number} [opts.minWidth=0] - The minimum width of the popup.
+     * @param {number} [opts.minHeight=0] - The minimum height of the popup.
+     */
+    constructor(opts = {}) {
+
+        opts = Object.assign({}, {
+            closeButton: false,
+            minWidth: 0,
+            minHeight: 0
+        }, opts)
+
+        super(opts)
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_popupmenu.js.html b/doc/out/pixi_popupmenu.js.html new file mode 100644 index 0000000..457c76d --- /dev/null +++ b/doc/out/pixi_popupmenu.js.html @@ -0,0 +1,1322 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/popupmenu.js

+ + + + +
+
+
+

pixi/popupmenu.js

+
+
+
+
import Theme from './theme.js'
+import Popup from './popup.js'
+
+/**
+ * Class that represents a PixiJS PopupMenu.
+ * 
+ * @example
+ * // Create the button and the modal when clicked
+ * const button = new Button({
+ *     label: 'Show PopupMenu',
+ *     action: e => {
+ *         const popupmenu = new PopupMenu({
+ *             items: [
+ *                 {label: 'Save', action: () => alert('Saved')},
+ *                 {label: 'Edit', action: () => alert('Edited')},
+ *                 {label: 'Delete', action: () => alert('Deleted')}
+ *             ]
+ *         })
+ *         app.scene.addChild(popupmenu)
+ *     }
+ * })
+ *
+ * // Add the button to a DisplayObject
+ * app.scene.addChild(button)
+ *
+ * @class
+ * @extends Popup
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/popupmenu.html|DocTest}
+ */
+export default class PopupMenu extends Popup {
+    
+    /**
+     * Creates an instance of a PopupMenu.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the modal.
+     * @param {object[]} [opts.items=[]] - A list of the menu items. Each item must be of type object.
+     *     If an object has a label property, a PIXI.Text object is created (using the textStyle property).
+     *     If an object hasn't a label property, it must contain a content property which has to be a
+     *     PIXI.DisplayObject.
+     * @param {number} [opts.margin=Theme.margin / 2] - The app where the modal belongs to.
+     * @param {object} [opts.textStyle=Theme.textStyle] - The color of the background.
+     * @param {boolean} [opts.closeOnPopup=true] - The opacity of the background.
+     */
+    constructor(opts = {}) {
+        
+        const theme = Theme.fromString(opts.theme)
+        
+        opts = Object.assign({}, {
+            items: [],
+            margin: theme.margin / 2,
+            textStyle: theme.textStyle,
+            closeOnPopup: true
+        }, opts)
+
+        super(opts)
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {PopupMenu} A reference to the popupmenu for chaining.
+     */
+    setup() {
+
+        // content
+        //-----------------
+        const content = new PIXI.Container()
+        
+        let y = 0
+        for (let item of this.opts.items) {
+
+            let object = null
+
+            if (item.label) {
+                object = new PIXI.Text(item.label, item.textStyle || this.opts.textStyle)
+            } else {
+                object = item.content
+            }
+
+            object.y = y
+
+            if (item.action) {
+                if (item.disabled) {
+                    object.alpha = .5
+                } else {
+                    object.interactive = true
+                    object.buttonMode = true
+                }
+                object.on('pointerover', e => {
+                    TweenLite.to(object, this.theme.fast, {alpha: .83, overwrite: 'none'})
+                })
+                object.on('pointerout', e => {
+                    TweenLite.to(object, this.theme.fast, {alpha: 1, overwrite: 'none'})
+                })
+                object.on('pointerup', e => {
+                    item.action.call(object, e, object)
+                    if (this.opts.closeOnAction) {
+                        this.hide()
+                    }
+                })
+            }
+
+            content.addChild(object)
+
+            y += object.height + this.opts.margin
+        }
+
+        this.opts.content = content
+
+        super.setup()
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_progress.js.html b/doc/out/pixi_progress.js.html new file mode 100644 index 0000000..750d379 --- /dev/null +++ b/doc/out/pixi_progress.js.html @@ -0,0 +1,1511 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/progress.js

+ + + + +
+
+
+

pixi/progress.js

+
+
+
+
import Theme from './theme.js'
+
+/**
+ * Class that represents a PixiJS Progress.
+ * 
+ * @example
+ * // Create the progress
+ * const progress = new Progress({
+ *     app: app
+ * })
+ *
+ * // Add the progress to a DisplayObject
+ * app.scene.addChild(progress)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PIXI.Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/progress.html|DocTest}
+ */
+export default class Progress extends PIXI.Container {
+    
+    /**
+     * Creates an instance of a Progress.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the progress.
+     * @param {number} [opts.id=auto generated] - The id of the progress.
+     * @param {PIXIApp} [opts.app=window.app] - The app where the progress belongs to.
+     * @param {number} [opts.width] - The width of the progress bar. When not set, the width is the size of the app
+     *     minus 2 * opts.margin.
+     * @param {number} [opts.height=2] - The height of the progress bar.
+     * @param {string|Theme} [opts.theme=dark] - The theme to use for this progress. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {number} [opts.margin=100] - The outer spacing to the edges of the app.
+     * @param {number} [opts.padding=0] - The inner spacing (distance from icon and/or label) to the border.
+     * @param {number} [opts.fill=Theme.fill] - The color of the progress background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - The alpha value of the background.
+     * @param {number} [opts.fillActive=Theme.primaryColor] - The color of the progress background when activated.
+     * @param {number} [opts.fillActiveAlpha=Theme.fillActiveAlpha] - The alpha value of the background when activated.
+     * @param {number} [opts.stroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=0] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.strokeActive=Theme.strokeActive] - The color of the border when activated.
+     * @param {number} [opts.strokeActiveWidth=0] - The width of the border in pixel when activated.
+     * @param {number} [opts.strokeActiveAlpha=Theme.strokeActiveAlpha] - The alpha value of the border when activated.
+     * @param {boolean} [opts.background=false] - The alpha value of the border when activated.
+     * @param {number} [opts.backgroundFill=Theme.background] - A textstyle object for the styling of the label. See PIXI.TextStyle
+     *     for possible options.
+     * @param {number} [opts.backgroundFillAlpha=1] - A textstyle object for the styling of the label when the
+     *     progress is activated. See PIXI.TextStyle for possible options.
+     * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the progress (which is a rounded rectangle).
+     * @param {boolean} [opts.destroyOnComplete=true] - Should the progress bar destroy itself after reaching 100 %?
+     * @param {boolean} [opts.visible=true] - Is the progress initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            app: window.app,
+            width: null,
+            height: 2,
+            margin: 100,
+            padding: 0,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            fillActive: theme.primaryColor,
+            fillActiveAlpha: theme.fillActiveAlpha,
+            stroke: theme.stroke,
+            strokeWidth: 0,
+            strokeAlpha: theme.strokeAlpha,
+            strokeActive: theme.strokeActive,
+            strokeActiveWidth: 0,
+            strokeActiveAlpha: theme.strokeActiveAlpha,
+            background: false,
+            backgroundFill: theme.background,
+            backgroundFillAlpha: 1,
+            radius: theme.radius,
+            destroyOnComplete: true,
+            visible: true
+        }, opts)
+
+        this.id = this.opts.id
+
+        this.background = null
+        this.bar = null
+        this.barActive = null
+
+        this.alpha = 0
+        
+        this.visible = this.opts.visible
+
+        this._progress = 0
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    setup() {
+
+        // interaction
+        //-----------------
+        this.on('added', e => {
+            this.show()
+        })
+
+        // background
+        //-----------------
+        if (this.opts.background) {
+            const background = new PIXI.Graphics()
+            this.background = background
+            this.addChild(background)
+        }
+
+        // bar
+        //-----------------
+        const bar = new PIXI.Graphics()
+        this.bar = bar
+        this.addChild(bar)
+
+        const barActive = new PIXI.Graphics()
+        this.barActive = barActive
+        this.bar.addChild(barActive)
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the progress. Can be used after resizing.
+     * 
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    layout() {
+
+        const width = this.opts.app.size.width
+        const height = this.opts.app.size.height
+
+        // background
+        //-----------------
+        if (this.opts.background) {
+            this.background.clear()
+            this.background.beginFill(this.opts.backgroundFill, this.opts.backgroundFillAlpha)
+            this.background.drawRect(0, 0, width, height)
+            this.background.endFill()
+        }
+
+        this.draw()
+
+        return this
+    }
+    
+    /**
+     * Draws the canvas.
+     * 
+     * @private
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    draw() {
+
+        this.bar.clear()
+        this.barActive.clear()
+
+        this.drawBar()
+        this.drawBarActive()
+
+        return this
+    }
+    
+    /**
+     * Draws the bar.
+     * 
+     * @private
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    drawBar() {
+
+        const width = this.opts.app.size.width
+        const height = this.opts.app.size.height
+
+        this.radius = this.opts.radius
+        if ((this.radius * 2) > this.opts.height) {
+            this.radius = this.opts.height / 2
+        }
+
+        const wantedWidth = this.opts.width || (width - (2 * this.opts.margin))
+        const wantedHeight = this.opts.height
+
+        this.bar.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+        this.bar.beginFill(this.opts.fill, this.opts.fillAlpha)
+        if (this.radius > 1) {
+            this.bar.drawRoundedRect(0, 0, wantedWidth, wantedHeight, this.radius)
+        } else {
+            this.bar.drawRect(0, 0, wantedWidth, wantedHeight)
+        }
+        this.bar.endFill()
+        
+        this.bar.x = width / 2 - this.bar.width / 2
+        this.bar.y = height / 2 - this.bar.height / 2
+
+        return this
+    }
+    
+    /**
+     * Draws the active bar.
+     * 
+     * @private
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    drawBarActive() {
+
+        const wantedWidth = this.bar.width - (2 * this.opts.padding)
+        const wantedHeight = this.bar.height - (2 * this.opts.padding)
+        
+        const barActiveWidth = wantedWidth * this._progress / 100
+
+        this.barActive.lineStyle(this.opts.strokeActiveWidth, this.opts.strokeActive, this.opts.strokeActiveAlpha)
+        this.barActive.beginFill(this.opts.fillActive, this.opts.fillActiveAlpha)
+        if (barActiveWidth > 0) {
+            if (this.radius > 1) {
+                this.barActive.drawRoundedRect(0, 0, barActiveWidth, wantedHeight, this.radius)
+            } else {
+                this.barActive.drawRect(0, 0, barActiveWidth, wantedHeight)
+            }
+        }
+        this.barActive.endFill()
+
+        this.barActive.x = this.opts.padding
+        this.barActive.y = this.opts.padding
+
+        return this
+    }
+    
+    /**
+     * Shows the progress (sets his alpha values to 1).
+     * 
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    show() {
+        TweenLite.to(this, this.theme.fast, {alpha: 1})
+
+        return this
+    }
+    
+    /**
+     * Hides the progress (sets his alpha values to 1).
+     * 
+     * @return {Progress} A reference to the progress for chaining.
+     */
+    hide() {
+        TweenLite.to(this, this.theme.fast, {alpha: 0, onComplete: () => this.visible = false})
+
+        return this
+    }
+    
+    /**
+     * Gets or sets the progress. Has to be a number between 0 and 100.
+     * 
+     * @member {number}
+     */
+    get progress() {
+        return this._progress
+    }
+    set progress(value) {
+
+        value = Math.round(value)
+
+        if (value < 0) {
+            value = 0
+        }
+
+        if (value > 100) {
+            value = 100
+        }
+
+        TweenLite.to(this, this.theme.normal, {
+            _progress: value,
+            onUpdate: () => this.draw(),
+            onComplete: () => {
+                if (value === 100 && this.opts.destroyOnComplete) {
+                    TweenLite.to(this, this.theme.fast, {
+                        alpha: 0,
+                        onComplete: () => this.destroy({children: true})
+                    })
+                }
+            }
+        })
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_slider.js.html b/doc/out/pixi_slider.js.html new file mode 100644 index 0000000..74ad355 --- /dev/null +++ b/doc/out/pixi_slider.js.html @@ -0,0 +1,1679 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/slider.js

+ + + + +
+
+
+

pixi/slider.js

+
+
+
+
import Theme from './theme.js'
+import Tooltip from './tooltip.js'
+
+/**
+ * Callback for the slider action onStart.
+ *
+ * @callback onStartCallback
+ * @param {object} event - The event object.
+ * @param {Slider} slider - A reference to the slider (also this refers to the slider).
+ */
+
+/**
+ * Callback for the slider action onUpdate.
+ *
+ * @callback onUpdateCallback
+ * @param {object} event - The event object.
+ * @param {Slider} slider - A reference to the slider (also this refers to the slider).
+ */
+
+/**
+ * Callback for the slider action onComplete.
+ *
+ * @callback onCompleteCallback
+ * @param {object} event - The event object.
+ * @param {Slider} slider - A reference to the slider (also this refers to the slider).
+ */
+
+/**
+ * Class that represents a PixiJS Slider.
+ * 
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * // Create the slider
+ * const slider = new Slider({
+ *     x: 10,
+ *     y: 20
+ * })
+ *
+ * // Add the slider to a DisplayObject
+ * app.scene.addChild(slider)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PIXI.Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/slider.html|DocTest}
+ */
+export default class Slider extends PIXI.Container {
+    
+    /**
+     * Creates an instance of a Slider.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the slider.
+     * @param {number} [opts.id=auto generated] - The id of the slider.
+     * @param {number} [opts.x=0] - The x position of the slider. Can be also set after creation with slider.x = 0.
+     * @param {number} [opts.y=0] - The y position of the slider. Can be also set after creation with slider.y = 0.
+     * @param {string|Theme} [opts.theme=dark] - The theme to use for this slider. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {number} [opts.width=250] - The width of the slider.
+     * @param {number} [opts.height=2] - The height of the slider.
+     * @param {PIXI.DisplayObject} [opts.container=window.app|object] - The container where the slider events should be attached to.
+     * @param {number} [opts.fill=Theme.fill] - The color of the slider background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - The alpha value of the background.
+     * @param {number} [opts.stroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=Theme.strokeWidth] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.controlFill=Theme.stroke] - The color of the slider control background as a hex value.
+     * @param {number} [opts.controlFillAlpha=Theme.strokeAlpha] - The alpha value of the background.
+     * @param {number} [opts.controlStroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.controlStrokeWidth=Theme.strokeWidth * 0.8] - The width of the border in pixel.
+     * @param {number} [opts.controlStrokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.controlRadius=16] - The radius of the slider control.
+     * @param {boolean} [opts.disabled=false] - Is the slider disabled? When disabled, the slider has a lower alpha value
+     *     and cannot be clicked (interactive is set to false).
+     * @param {onStartCallback} [opts.onStart] - Executed when the slider control starts to move.
+     * @param {onUpdateCallback} [opts.onUpdate] - Executed when the slider control is moved.
+     * @param {onCompleteCallback} [opts.onComplete] - Executed when the slider control was dropped.
+     * @param {string|object} [opts.tooltip] - A string for the label of the tooltip or an object to configure the tooltip
+     *     to display. 
+     * @param {boolean} [opts.visible=true] - Is the slider initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            x: 0,
+            y: 0,
+            width: 250,
+            height: 2,
+            container: null,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            stroke: theme.stroke,
+            strokeWidth: theme.strokeWidth,
+            strokeAlpha: theme.strokeAlpha,
+            controlFill: theme.fill,
+            controlFillAlpha: .5,
+            controlStroke: theme.primaryColor,
+            controlStrokeWidth: 2,
+            controlStrokeAlpha: theme.strokeAlpha,
+            controlRadius: 16,
+            orientation: 'horizontal',
+            min: 0,
+            max: 100,
+            value: 0,
+            disabled: false,
+            onStart: null,
+            onUpdate: null,
+            onComplete: null,
+            tooltip: null,
+            visible: true
+        }, opts)
+        
+        this.opts.container = this.opts.container || this
+
+        // Validation
+        //-----------------
+        if (this.opts.height > this.opts.width) {
+            this.opts.height = this.opts.width
+        }
+
+        if (this.opts.value < this.opts.min) {
+            this.opts.value = this.opts.min
+        }
+
+        if (this.opts.value > this.opts.max) {
+            this.opts.value = this.opts.max
+        }
+
+        // Properties
+        //-----------------
+        this.id = this.opts.id
+        this.radius = this.opts.height / 2
+
+        this._value = this.opts.value
+        this._disabled = null
+
+        this.sliderObj = null
+        this.control = null
+        this.tooltip = null
+        
+        this.visible = this.opts.visible
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    setup() {
+
+        // Container events
+        //-----------------
+        const container = this.opts.container
+
+        this.on('pointermove', e => {
+            if (this.control.dragging) {
+                const moveX = this.control.event.data.getLocalPosition(this.control.parent).x
+                this._value = this.pixelToValue(moveX - this.control.delta - this.opts.controlRadius)
+                let x = this.valueToPixel(this._value) + this.opts.controlRadius
+                this.control.x = x
+
+                if (this.opts.onUpdate) {
+                    this.opts.onUpdate.call(this, e, this)
+                }
+            }
+        })
+
+        if (container instanceof Element) {
+            container.addEventListener('pointerup', e => this.onEnd(e), false)
+            container.addEventListener('pointercancel', e => this.onEnd(e), false)
+            container.addEventListener('pointerleave', e => this.onEnd(e), false)
+            container.addEventListener('pointerout', e => this.onEnd(e), false)
+            container.addEventListener('mouseup', e => this.onEnd(e), false)
+            container.addEventListener('mousecancel', e => this.onEnd(e), false)
+            container.addEventListener('mouseleave', e => this.onEnd(e), false)
+            container.addEventListener('mouseout', e => this.onEnd(e), false)
+        } else {
+            container.interactive = true
+            container.on('pointerup', e => this.onEnd(e))
+            container.on('pointercancel', e => this.onEnd(e))
+            container.on('pointerleave', e => this.onEnd(e))
+            container.on('pointerout', e => this.onEnd(e))
+        }
+
+        // Slider
+        //-----------------
+        let sliderObj = new PIXI.Graphics()
+        this.sliderObj = sliderObj
+        this.addChild(sliderObj)
+
+        // Control
+        //-----------------
+        let control = new PIXI.Graphics()
+        control.x = this.opts.controlRadius + this.valueToPixel(this.opts.value)
+        control.y = this.opts.controlRadius
+
+        // pointerdown on the control for dragndrop
+        control.on('pointerdown', e => {
+            control.event = e
+            control.delta = e.data.getLocalPosition(this.control).x
+            control.dragging = true
+            
+            if (this.opts.onStart) {
+                this.opts.onStart.call(this, e, this)
+            }
+        })
+
+        this.control = control
+
+        this.addChild(this.control)
+        
+        // interaction
+        //-----------------
+        this.sliderObj.on('pointerover', e => {
+            TweenLite.to(this.control, this.theme.fast, {alpha: .83})
+        })
+
+        this.sliderObj.on('pointerout', e => {
+            TweenLite.to(this.control, this.theme.fast, {alpha: 1})
+        })
+
+        this.sliderObj.on('pointerdown', e => {
+            this.sliderObj.pointerdowned = true
+            TweenLite.to(this.control, this.theme.fast, {alpha: .7})
+        })
+
+        // Click on the slider bar
+        this.sliderObj.on('pointerup', e => {
+            if (this.sliderObj.pointerdowned) {
+                this.sliderObj.pointerdowned = false
+                const position = e.data.getLocalPosition(this.control.parent)
+                this.value = this.pixelToValue(position.x - this.opts.controlRadius)
+                TweenLite.to(this.control, this.theme.fast, {alpha: .83})
+            }
+        })
+
+        // disabled
+        //-----------------
+        this.disabled = this.opts.disabled
+        
+        // tooltip
+        //-----------------
+        if (this.opts.tooltip) {
+            if (typeof this.opts.tooltip === 'string') {
+                this.tooltip = new Tooltip({
+                    object: this,
+                    content: this.opts.tooltip
+                })
+            } else {
+                this.opts.tooltip.object = this
+                this.tooltip = new Tooltip(this.opts.tooltip)
+            }
+        }
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the slider. Can be used after resizing.
+     * 
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    layout() {
+        
+        // set position
+        //-----------------
+        this.position.set(this.opts.x, this.opts.y)
+
+        // draw
+        //-----------------
+        this.draw()
+
+        return this
+    }
+    
+    /**
+     * Draws the slider to the canvas.
+     * 
+     * @private
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    draw() {
+
+        const r = this.radius
+        const cr = this.opts.controlRadius
+        const w = this.opts.width
+        const h = this.opts.height
+        const x = cr + r
+        const y = cr + r - h
+
+        this.sliderObj.clear()
+        this.sliderObj.beginFill(0xffffff, 0)
+        this.sliderObj.drawRect(0, 0, x + w + cr, cr * 2)
+        this.sliderObj.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+        this.sliderObj.beginFill(this.opts.fill, this.opts.fillAlpha)
+        this.sliderObj.moveTo(x, y)
+        this.sliderObj.lineTo(x + w, y)
+        this.sliderObj.arcTo(x + w + r, y, x + w + r, y + r, r)
+        this.sliderObj.lineTo(x + w + r, y + r + 1)                     // BUGFIX: If not specified, there is a small area without a stroke.
+        this.sliderObj.arcTo(x + w + r, y + h, x + w, y + h, r)
+        this.sliderObj.lineTo(x, y + h)
+        this.sliderObj.arcTo(x - r, y + h, x - r, y + r, r)
+        this.sliderObj.arcTo(x - r, y, x, y, r)
+        this.sliderObj.endFill()
+
+        // Draw control
+        this.control.clear()
+        this.control.lineStyle(this.opts.controlStrokeWidth, this.opts.controlStroke, this.opts.controlStrokeAlpha)
+        this.control.beginFill(this.opts.controlFill, this.opts.controlFillAlpha)
+        this.control.drawCircle(0, 0, cr - 1)
+        this.control.beginFill(this.opts.controlStroke, this.opts.controlStrokeAlpha)
+        this.control.drawCircle(0, 0, cr / 6)
+        this.control.endFill()
+
+        return this
+    }
+
+    /**
+     * Executed, when the slider control movement ended.
+     * 
+     * @private
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    onEnd(e) {
+
+        if (this.control.dragging) {
+            this.control.event = null
+            this.control.dragging = false
+            if (this.opts.onComplete) {
+                this.opts.onComplete.call(this, e, this)
+            }
+        }
+
+        return this
+    }
+
+    /**
+     * Calculates the value for a given pixel.
+     * 
+     * @private
+     * @param {number} value 
+     * @returns  {number} The calucalted pixel.
+     */
+    valueToPixel(value) {
+        if (value < this.opts.min) {
+            value = this.opts.min
+        } else if (value > this.opts.max) {
+            value = this.opts.max
+        }
+        return this.opts.width * (value - this.opts.min) / (this.opts.max - this.opts.min)
+    }
+
+    /**
+     * Calculates the pixel for a given value.
+     * 
+     * @private
+     * @param {number} pixel 
+     * @returns {number} The calucalted value.
+     */
+    pixelToValue(pixel) {
+        if (pixel < 0) {
+            pixel = 0
+        } else if (pixel > this.opts.width) {
+            pixel = this.opts.width
+        }
+        return this.opts.min + ((this.opts.max - this.opts.min) * pixel / this.opts.width)
+    }
+    
+    /**
+     * Gets or sets the value.
+     * 
+     * @member {number}
+     */
+    get value() {
+        return Math.round(this._value)
+    }
+    set value(value) {
+        if (value < this.opts.min) {
+            value = this.opts.min
+        } else if (value > this.opts.max) {
+            value = this.opts.max
+        }
+        this._value = value
+
+        const x = this.valueToPixel(value) + this.opts.controlRadius
+
+        TweenLite.to(this.control, this.theme.fast, {x})
+    }
+    
+    /**
+     * Gets or sets the disabled state. When disabled, the slider cannot be clicked.
+     * 
+     * @member {boolean}
+     */
+    get disabled() {
+        return this._disabled
+    }
+    set disabled(value) {
+
+        this._disabled = value
+        
+        if (this._disabled) {
+            this.interactive = false
+            this.sliderObj.interactive = false
+            this.control.interactive = false
+            this.control.buttonMode = false
+            this.alpha = .5
+        } else {
+            this.interactive = true
+            this.sliderObj.interactive = true
+            this.control.interactive = true
+            this.control.buttonMode = true
+            this.alpha = 1
+        }
+    }
+
+    /**
+     * Shows the slider (sets his alpha values to 1).
+     * 
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    show() {
+
+        this.opts.strokeAlpha = 1
+        this.opts.fillAlpha = 1
+        this.opts.controlStrokeAlpha = 1
+        this.opts.controlFillAlpha = 1
+
+        this.layout()
+
+        return this
+    }
+    
+    /**
+     * Hides the slider (sets his alpha values to 1).
+     * 
+     * @return {Slider} A reference to the slider for chaining.
+     */
+    hide() {
+
+        this.opts.strokeAlpha = 0
+        this.opts.fillAlpha = 0
+        this.opts.controlStrokeAlpha = 0
+        this.opts.controlFillAlpha = 0
+
+        this.layout()
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_switch.js.html b/doc/out/pixi_switch.js.html new file mode 100644 index 0000000..f614fdd --- /dev/null +++ b/doc/out/pixi_switch.js.html @@ -0,0 +1,1716 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/switch.js

+ + + + +
+
+
+

pixi/switch.js

+
+
+
+
import Theme from './theme.js'
+import Tooltip from './tooltip.js'
+
+/**
+ * Callback for the switch action.
+ *
+ * @callback actionCallback
+ * @param {object} event - The event object.
+ * @param {Switch} switch - A reference to the switch (also this refers to the switch).
+ */
+
+/**
+ * Callback for the switch action.
+ *
+ * @callback actionActiveCallback
+ * @param {object} event - The event object.
+ * @param {Switch} switch - A reference to the switch (also this refers to the switch).
+ */
+
+/**
+ * Callback for the switch beforeAction.
+ *
+ * @callback beforeActionCallback
+ * @param {object} event - The event object.
+ * @param {Switch} switch - A reference to the switch (also this refers to the switch).
+ */
+
+/**
+ * Callback for the switch afterAction.
+ *
+ * @callback afterActionCallback
+ * @param {object} event - The event object.
+ * @param {Switch} switch - A reference to the switch (also this refers to the switch).
+ */
+
+/**
+ * Class that represents a PixiJS Switch.
+ * 
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * // Create the switch
+ * const switch1 = new Switch({
+ *     x: 10,
+ *     y: 20
+ * })
+ *
+ * // Add the switch to a DisplayObject
+ * app.scene.addChild(switch1)
+ *
+ * @class
+ * @extends PIXI.Container
+ * @see {@link http://pixijs.download/dev/docs/PIXI.Container.html|PIXI.Container}
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/switch.html|DocTest}
+ */
+export default class Switch extends PIXI.Container {
+    
+    /**
+     * Creates an instance of a Switch.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the switch.
+     * @param {number} [opts.id=auto generated] - The id of the switch.
+     * @param {number} [opts.x=0] - The x position of the switch. Can be also set after creation with switch.x = 0.
+     * @param {number} [opts.y=0] - The y position of the switch. Can be also set after creation with switch.y = 0.
+     * @param {string|Theme} [opts.theme=dark] - The theme to use for this switch. Possible values are dark, light, red
+     *     or a Theme object.
+     * @param {number} [opts.width=44] - The width of the switch.
+     * @param {number} [opts.height=28] - The height of the switch.
+     * @param {number} [opts.fill=Theme.fill] - The color of the switch background as a hex value.
+     * @param {number} [opts.fillAlpha=Theme.fillAlpha] - The alpha value of the background.
+     * @param {number} [opts.fillActive=Theme.fillActive] - The color of the switch background when activated.
+     * @param {number} [opts.fillActiveAlpha=Theme.fillActiveAlpha] - The alpha value of the background when activated.
+     * @param {number} [opts.stroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=Theme.strokeWidth] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.strokeActive=Theme.strokeActive] - The color of the border when activated.
+     * @param {number} [opts.strokeActiveWidth=Theme.strokeActiveWidth] - The width of the border in pixel when activated.
+     * @param {number} [opts.strokeActiveAlpha=Theme.strokeActiveAlpha] - The alpha value of the border when activated.
+     * @param {number} [opts.controlFill=Theme.stroke] - The color of the switch control background as a hex value.
+     * @param {number} [opts.controlFillAlpha=Theme.strokeAlpha] - The alpha value of the background.
+     * @param {number} [opts.controlFillActive=Theme.stroke] - The color of the switch control background when activated.
+     * @param {number} [opts.controlFillActiveAlpha=Theme.strokeAlpha] - The alpha value of the background when activated.
+     * @param {number} [opts.controlStroke=Theme.stroke] - The color of the border as a hex value.
+     * @param {number} [opts.controlStrokeWidth=Theme.strokeWidth * 0.8] - The width of the border in pixel.
+     * @param {number} [opts.controlStrokeAlpha=Theme.strokeAlpha] - The alpha value of the border.
+     * @param {number} [opts.controlStrokeActive=Theme.stroke] - The color of the border when activated.
+     * @param {number} [opts.controlStrokeActiveWidth=Theme.strokeActiveWidth * 0.8] - The width of the border in pixel when activated.
+     * @param {number} [opts.controlStrokeActiveAlpha=Theme.strokeActiveAlpha] - The alpha value of the border when activated.
+     * @param {number} [opts.duration=Theme.fast] - The duration of the animation when the switch gets activated in seconds.
+     * @param {number} [opts.durationActive=Theme.fast] - The duration of the animation when the switch gets deactivated in seconds.
+     * @param {boolean} [opts.disabled=false] - Is the switch disabled? When disabled, the switch has a lower alpha value
+     *     and cannot be clicked (interactive is set to false).
+     * @param {boolean} [opts.active=false] - Is the button initially active?
+     * @param {actionCallback} [opts.action] - Executed when the switch was triggered in inactive state (by pointerup).
+     * @param {actionActiveCallback} [opts.actionActive] - Executed when the button was triggered in active state (by pointerup).
+     * @param {beforeActionCallback} [opts.beforeAction] - Executed before an action is triggered.
+     * @param {afterActionCallback} [opts.afterAction] - Executed after an action was triggered.
+     * @param {string|object} [opts.tooltip] - A string for the label of the tooltip or an object to configure the tooltip
+     *     to display. 
+     * @param {boolean} [opts.visible=true] - Is the switch initially visible (property visible)?
+     */
+    constructor(opts = {}) {
+
+        super()
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            x: 0,
+            y: 0,
+            width: 44,
+            height: 28,
+            fill: theme.fill,
+            fillAlpha: theme.fillAlpha,
+            fillActive: theme.primaryColor,
+            fillActiveAlpha: theme.fillActiveAlpha,
+            stroke: theme.stroke,
+            strokeWidth: theme.strokeWidth,
+            strokeAlpha: theme.strokeAlpha,
+            strokeActive: theme.primaryColor,
+            strokeActiveWidth: theme.strokeActiveWidth,
+            strokeActiveAlpha: theme.strokeActiveAlpha,
+            controlFill: theme.stroke,
+            controlFillAlpha: theme.strokeAlpha,
+            controlFillActive: theme.stroke,
+            controlFillActiveAlpha: theme.strokeAlpha,
+            controlStroke: theme.stroke,
+            controlStrokeWidth: theme.strokeWidth * .8,
+            controlStrokeAlpha: theme.strokeAlpha,
+            controlStrokeActive: theme.stroke,
+            controlStrokeActiveWidth: theme.strokeActiveWidth * .8,
+            controlStrokeActiveAlpha: theme.strokeActiveAlpha,
+            duration: theme.fast,
+            durationActive: theme.fast,
+            disabled: false,
+            active: false,
+            action: null,
+            actionActive: null,
+            beforeAction: null,
+            afterAction: null,
+            tooltip: null,
+            visible: true
+        }, opts)
+
+        this.opts.controlRadius = this.opts.controlRadius || (this.opts.height / 2)
+        this.opts.controlRadiusActive = this.opts.controlRadiusActive || this.opts.controlRadius
+
+        // Validation
+        //-----------------
+        if (this.opts.height > this.opts.width) {
+            this.opts.height = this.opts.width
+        }
+
+        // Properties
+        //-----------------
+        this.id = this.opts.id
+        this.radius = this.opts.height / 2
+
+        this._active = null
+        this._disabled = null
+
+        this.switchObj = null
+        this.control = null
+        this.tooltip = null
+        
+        this.visible = this.opts.visible
+
+        // animated
+        //-----------------
+        this.tempAnimated = {
+            fill: this.opts.fill,
+            fillAlpha: this.opts.fillAlpha,
+            stroke: this.opts.stroke,
+            strokeWidth: this.opts.strokeWidth,
+            strokeAlpha: this.opts.strokeAlpha,
+            controlFill: this.opts.controlFill,
+            controlFillAlpha: this.opts.controlFillAlpha,
+            controlStroke: this.opts.controlStroke,
+            controlStrokeWidth: this.opts.controlStrokeWidth,
+            controlStrokeAlpha: this.opts.controlStrokeAlpha,
+            controlRadius: this.opts.controlRadius
+        }
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    setup() {
+
+        // Switch
+        //-----------------
+        let switchObj = new PIXI.Graphics()
+        this.switchObj = switchObj
+        this.addChild(switchObj)
+
+        // Control
+        //-----------------
+        this.xInactive = this.opts.controlRadius
+        this.xActive = this.opts.width - this.opts.controlRadiusActive
+        
+        let control = new PIXI.Graphics()
+        control.x = this.opts.active ? this.xActive : this.xInactive
+        control.y = this.opts.height / 2
+
+        this.control = control
+
+        this.addChild(this.control)
+        
+        // interaction
+        //-----------------
+        this.switchObj.on('pointerover', e => {
+            TweenLite.to(this.control, this.theme.fast, {alpha: .83})
+        })
+
+        this.switchObj.on('pointerout', e => {
+            TweenLite.to(this.control, this.theme.fast, {alpha: 1})
+        })
+
+        this.switchObj.on('pointerdown', e => {
+            TweenLite.to(this.control, this.theme.fast, {alpha: .7})
+        })
+
+        this.switchObj.on('pointerup', e => {
+
+            if (this.opts.beforeAction) {
+                this.opts.beforeAction.call(this, e, this)
+            }
+
+            this.active = !this.active
+
+            if (this.active) {
+                if (this.opts.action) {
+                    this.opts.action.call(this, e, this)
+                }
+            } else {
+                if (this.opts.actionActive) {
+                    this.opts.actionActive.call(this, e, this)
+                }
+            }
+
+            TweenLite.to(this.control, this.theme.fast, {alpha: .83})
+
+            if (this.opts.afterAction) {
+                this.opts.afterAction.call(this, e, this)
+            }
+        })
+
+        // disabled
+        //-----------------
+        this.disabled = this.opts.disabled
+
+        // active
+        //-----------------
+        this.active = this.opts.active
+        
+        // tooltip
+        //-----------------
+        if (this.opts.tooltip) {
+            if (typeof this.opts.tooltip === 'string') {
+                this.tooltip = new Tooltip({
+                    object: this,
+                    content: this.opts.tooltip
+                })
+            } else {
+                this.opts.tooltip.object = this
+                this.tooltip = new Tooltip(this.opts.tooltip)
+            }
+        }
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the switch. Can be used after resizing.
+     * 
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    layout() {
+        
+        // set position
+        //-----------------
+        this.position.set(this.opts.x, this.opts.y)
+
+        // draw
+        //-----------------
+        this.draw()
+
+        return this
+    }
+    
+    /**
+     * Draws the switch to the canvas.
+     * 
+     * @private
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    draw() {
+
+        this.switchObj.clear()
+        if (this.active) {
+            this.switchObj.lineStyle(this.opts.strokeActiveWidth, this.opts.strokeActive, this.opts.strokeActiveAlpha)
+            this.switchObj.beginFill(this.opts.fillActive, this.opts.fillActiveAlpha)
+        } else {
+            this.switchObj.lineStyle(this.opts.strokeWidth, this.opts.stroke, this.opts.strokeAlpha)
+            this.switchObj.beginFill(this.opts.fill, this.opts.fillAlpha)
+        }
+        this.switchObj.moveTo(this.radius, 0)
+        this.switchObj.lineTo(this.opts.width - this.radius, 0)
+        this.switchObj.arcTo(this.opts.width, 0, this.opts.width, this.radius, this.radius)
+        this.switchObj.lineTo(this.opts.width, this.radius + 1)                                   // BUGFIX: If not specified, there is a small area without a stroke.
+        this.switchObj.arcTo(this.opts.width, this.opts.height, this.opts.width - this.radius, this.opts.height, this.radius)
+        this.switchObj.lineTo(this.radius, this.opts.height)
+        this.switchObj.arcTo(0, this.opts.height, 0, this.radius, this.radius)
+        this.switchObj.arcTo(0, 0, this.radius, 0, this.radius)
+        this.switchObj.endFill()
+
+        // Draw control
+        this.control.clear()
+        if (this.active) {
+            this.control.lineStyle(this.opts.controlStrokeActiveWidth, this.opts.controlStrokeActive, this.opts.controlStrokeActiveAlpha)
+            this.control.beginFill(this.opts.controlFillActive, this.opts.controlFillActiveAlpha)
+            this.control.drawCircle(0, 0, this.opts.controlRadiusActive - 1)
+        } else {
+            this.control.lineStyle(this.opts.controlStrokeWidth, this.opts.controlStroke, this.opts.controlStrokeAlpha)
+            this.control.beginFill(this.opts.controlFill, this.opts.controlFillAlpha)
+            this.control.drawCircle(0, 0, this.opts.controlRadius - 1)
+        }
+        this.control.endFill()
+
+        return this
+    }
+    
+    /**
+     * Draws the animation.
+     * 
+     * @private
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    drawAnimated() {
+
+        this.switchObj.clear()
+        this.switchObj.lineStyle(this.tempAnimated.strokeWidth, this.tempAnimated.stroke, this.tempAnimated.strokeAlpha)
+        this.switchObj.beginFill(this.tempAnimated.fill, this.tempAnimated.fillAlpha)
+        this.switchObj.moveTo(this.radius, 0)
+        this.switchObj.lineTo(this.opts.width - this.radius, 0)
+        this.switchObj.arcTo(this.opts.width, 0, this.opts.width, this.radius, this.radius)
+        this.switchObj.lineTo(this.opts.width, this.radius + 1)                                   // BUGFIX: If not specified, there is a small area without a stroke.
+        this.switchObj.arcTo(this.opts.width, this.opts.height, this.opts.width - this.radius, this.opts.height, this.radius)
+        this.switchObj.lineTo(this.radius, this.opts.height)
+        this.switchObj.arcTo(0, this.opts.height, 0, this.radius, this.radius)
+        this.switchObj.arcTo(0, 0, this.radius, 0, this.radius)
+        this.switchObj.endFill()
+
+        this.control.clear()
+        this.control.lineStyle(this.tempAnimated.controlStrokeWidth, this.tempAnimated.controlStroke, this.tempAnimated.controlStrokeAlpha)
+        this.control.beginFill(this.tempAnimated.controlFill, this.tempAnimated.controlFillAlpha)
+        this.control.drawCircle(0, 0, this.tempAnimated.controlRadius - 1)
+        this.control.endFill()
+
+        return this
+    }
+    
+    /**
+     * Gets or sets the active state.
+     * 
+     * @member {boolean}
+     */
+    get active() {
+        return this._active
+    }
+
+    set active(value) {
+
+        this._active = value
+
+        if (this._active) {
+
+            TweenLite.to(this.control, this.opts.duration, {x: this.xActive})
+            TweenLite.to(this.tempAnimated, this.opts.duration, {
+                colorProps: {
+                    fill: this.opts.fillActive,
+                    stroke: this.opts.strokeActive,
+                    controlFill: this.opts.controlFillActive,
+                    controlStroke: this.opts.controlStrokeActive,
+                    format: 'number'
+                },
+                fillAlpha: this.opts.fillActiveAlpha,
+                strokeWidth: this.opts.strokeActiveWidth,
+                strokeAlpha: this.opts.strokeActiveAlpha,
+                controlFillAlpha: this.opts.controlFillActiveAlpha,
+                controlStrokeWidth: this.opts.controlStrokeActiveWidth,
+                controlStrokeAlpha: this.opts.controlStrokeActiveAlpha,
+                controlRadius: this.opts.controlRadiusActive,
+                onUpdate: () => this.drawAnimated(),
+                onComplete: () => this.draw()
+            })
+
+
+        } else {
+            TweenLite.to(this.control, this.opts.durationActive, {x: this.xInactive})
+            TweenLite.to(this.tempAnimated, this.opts.durationActive, {
+                colorProps: {
+                    fill: this.opts.fill,
+                    stroke: this.opts.stroke,
+                    controlFill: this.opts.controlFill,
+                    controlStroke: this.opts.controlStroke,
+                    format: 'number'
+                },
+                fillAlpha: this.opts.fillAlpha,
+                strokeWidth: this.opts.strokeWidth,
+                strokeAlpha: this.opts.strokeAlpha,
+                controlFillAlpha: this.opts.controlFillAlpha,
+                controlStrokeWidth: this.opts.controlStrokeWidth,
+                controlStrokeAlpha: this.opts.controlStrokeAlpha,
+                controlRadius: this.opts.controlRadius,
+                onUpdate: () => this.drawAnimated(),
+                onComplete: () => this.draw()
+            })
+        }
+    }
+    
+    /**
+     * Gets or sets the disabled state. When disabled, the switch cannot be clicked.
+     * 
+     * @member {boolean}
+     */
+    get disabled() {
+        return this._disabled
+    }
+
+    set disabled(value) {
+
+        this._disabled = value
+        
+        if (this._disabled) {
+            this.switchObj.interactive = false
+            this.switchObj.buttonMode = false
+            this.switchObj.alpha = .5
+            this.control.alpha = .5
+        } else {
+            this.switchObj.interactive = true
+            this.switchObj.buttonMode = true
+            this.switchObj.alpha = 1
+            this.control.alpha = 1
+        }
+    }
+
+    /**
+     * Shows the switch (sets his alpha values to 1).
+     * 
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    show() {
+
+        this.opts.strokeAlpha = 1
+        this.opts.strokeActiveAlpha = 1
+        this.opts.fillAlpha = 1
+        this.opts.fillActiveAlpha = 1
+        this.opts.controlStrokeAlpha = 1
+        this.opts.controlStrokeActiveAlpha = 1
+        this.opts.controlFillAlpha = 1
+        this.opts.controlFillActiveAlpha = 1
+
+        this.layout()
+
+        return this
+    }
+    
+    /**
+     * Hides the switch (sets his alpha values to 1).
+     * 
+     * @return {Switch} A reference to the switch for chaining.
+     */
+    hide() {
+
+        this.opts.strokeAlpha = 0
+        this.opts.strokeActiveAlpha = 0
+        this.opts.fillAlpha = 0
+        this.opts.fillActiveAlpha = 0
+        this.opts.controlStrokeAlpha = 0
+        this.opts.controlStrokeActiveAlpha = 0
+        this.opts.controlFillAlpha = 0
+        this.opts.controlFillActiveAlpha = 0
+
+        this.layout()
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_theme.js.html b/doc/out/pixi_theme.js.html new file mode 100644 index 0000000..9aaa837 --- /dev/null +++ b/doc/out/pixi_theme.js.html @@ -0,0 +1,1444 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/theme.js

+ + + + +
+
+
+

pixi/theme.js

+
+
+
+
/**
+ * Class that represents a PixiJS Theme.
+ *
+ * @example
+ * // Create the theme
+ * const yellow = new Theme({
+ *     fill: 0xfecd2d,
+ *     fillActive: 0xfe9727,
+ *     strokeActive: 0xfecd2d,
+ *     strokeActiveWidth: 4,
+ *     textStyle: {
+ *         fill: 0x5ec7f8
+ *     },
+ *     textStyleActive: {
+ *         fill: 0x5954d3
+ *     },
+ *     textStyleLarge: {
+ *         fontSize: 36
+ *     }
+ * })
+ *
+ * // Create the app and apply the new theme to it
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 450,
+ *     height: 150,
+ *     theme: yellow
+ * }).setup().run()
+ *
+ * @class
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/theme.html|DocTest}
+ */
+export default class Theme {
+
+    /**
+     * Creates an instance of a Theme.
+     *
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the theme.
+     * @param {number} [opts.margin=10] - The outer spacing (distance to other objects) from the border.
+     * @param {number} [opts.padding=10] - The inner spacing (distance from icon and/or label) to the border.
+     * @param {number} [opts.radius=4] - The radius used when drawing a rounded rectangle.
+     * @param {number} [opts.fast=0.25] - The duration of time when it has to be fast.
+     * @param {number} [opts.normal=0.5] - The duration of time when it has to be normal.
+     * @param {number} [opts.slow=1] - The duration of time when it has to be slow.
+     * @param {number} [opts.primaryColor=0x5ec7f8] - The primary color of the theme.
+     * @param {number} [opts.color1=0x282828] - The first color of the theme. For example used for the background.
+     * @param {number} [opts.color2=0xf6f6f6] - The second color of the theme. For example used for the border.
+     * @param {number} [opts.fill=color1] - The color of the background as a hex value.
+     * @param {number} [opts.fillAlpha=1] - The alpha value of the background.
+     * @param {number} [opts.fillActive=color1] - The color of the background when activated.
+     * @param {number} [opts.fillActiveAlpha=1] - The alpha value of the background when activated.
+     * @param {number} [opts.stroke=color2] - The color of the border as a hex value.
+     * @param {number} [opts.strokeWidth=0.6] - The width of the border in pixel.
+     * @param {number} [opts.strokeAlpha=1] - The alpha value of the border.
+     * @param {number} [opts.strokeActive=color2] - The color of the border when activated.
+     * @param {number} [opts.strokeActiveWidth=0.6] - The width of the border in pixel when activated.
+     * @param {number} [opts.strokeActiveAlpha=1] - The alpha value of the border when activated.
+     * @param {number} [opts.iconColor=color2] - The color of the icon (set by the tint property) as a hex value.
+     * @param {number} [opts.iconColorActive=colorPrimary] - The color of the icon when activated.
+     * @param {number} [opts.background=color1] - The color of a background for a component (e.g. at the Modal class).
+     * @param {object} [opts.textStyle={}] - A textstyle object for the styling of text. See PIXI.TextStyle
+     *     for possible options. Default object:
+     * @param {string} [opts.textStyle.fontFamily="Avenir Next", "Open Sans", "Segoe UI", ...] - The font family.
+     * @param {string} [opts.textStyle.fontWeight=400] - The font weight.
+     * @param {number} [opts.textStyle.fontSize=16] - The font size.
+     * @param {number} [opts.textStyle.fill=color2] - The fill color.
+     * @param {number} [opts.textStyle.stroke=color1] - The stroke color.
+     * @param {number} [opts.textStyle.strokeThickness=0] - The thickness of the stroke.
+     * @param {number} [opts.textStyle.miterLimit=1] - The meter limit.
+     * @param {string} [opts.textStyle.lineJoin=round] - The line join.
+     * @param {object} [opts.textStyleActive=textStyle + {fill: primaryColor}] - A textstyle object which is used
+     *     for actived text.
+     * @param {object} [opts.textStyleSmall=textStyle + {fontSize: -= 3}] - A textstyle object which is used for
+     *     small text.
+     * @param {object} [opts.textStyleSmallActive=textStyleSmall + {fill: primaryColor}] - A textstyle object which
+     *     is used for small actived text.
+     * @param {object} [opts.textStyleLarge=textStyle + {fontSize: += 3}] - A textstyle object which is used for
+     *     large text.
+     * @param {object} [opts.textStyleLargeActive=textStyleLarge + {fill: primaryColor}] - A textstyle object which
+     *     is used for large actived text.
+     */
+    constructor(opts = {}) {
+
+        const colorPrimary = opts.primaryColor != null ? opts.primaryColor : 0x5ec7f8               // blue
+        const color1 = opts.color1 != null ? opts.color1 : 0x282828                                 // black
+        const color2 = opts.color2 != null ? opts.color2 : 0xf6f6f6                                 // white
+
+        this.opts = Object.assign({}, {
+            margin: 12,
+            padding: 12,
+            radius: 4,
+            fast: .25,
+            normal: .5,
+            slow: 1,
+            primaryColor: colorPrimary,
+            color1: color1,
+            color2: color2,
+            fill: color1,
+            fillAlpha: 1,
+            fillActive: color1,
+            fillActiveAlpha: 1,
+            stroke: color2,
+            strokeWidth: .6,
+            strokeAlpha: 1,
+            strokeActive: color2,
+            strokeActiveWidth: .6,
+            strokeActiveAlpha: 1,
+            iconColor: color2,
+            iconColorActive: colorPrimary,
+            background: color1
+        }, opts)
+
+        // Set textStyle and variants
+        this.opts.textStyle = Object.assign({}, {
+            fontFamily: '"Avenir Next", "Open Sans", "Segoe UI", "Roboto", "Helvetica Neue", -apple-system, system-ui, BlinkMacSystemFont, Arial, sans-serif !default',
+            fontWeight: '500',
+            fontSize: 18,
+            fill: color2,
+            stroke: color1,
+            strokeThickness: 0,
+            miterLimit: 1,
+            lineJoin: 'round'
+        }, this.opts.textStyle)
+        this.opts.textStyleSmall = Object.assign({}, this.opts.textStyle, {fontSize: this.opts.textStyle.fontSize - 3}, this.opts.textStyleSmall)
+        this.opts.textStyleLarge = Object.assign({}, this.opts.textStyle, {fontSize: this.opts.textStyle.fontSize + 3}, this.opts.textStyleLarge)
+        this.opts.textStyleActive = Object.assign({}, this.opts.textStyle, {fill: this.opts.primaryColor}, this.opts.textStyleActive)
+        this.opts.textStyleSmallActive = Object.assign({}, this.opts.textStyleSmall, {fill: this.opts.primaryColor}, this.opts.textStyleSmallActive)
+        this.opts.textStyleLargeActive = Object.assign({}, this.opts.textStyleLarge, {fill: this.opts.primaryColor}, this.opts.textStyleLargeActive)
+
+        Object.assign(this, this.opts)
+    }
+
+    /**
+     * Factory function
+     *
+     * @static
+     * @param {string} theme=dark - The name of the theme to load.
+     * @return {Theme} Returns a newly created Theme object.
+     */
+    static fromString(theme) {
+
+        if (theme && typeof theme === 'object') {
+            return theme
+        }
+
+        switch (theme) {
+            case 'light':
+                return new ThemeLight()
+            case 'red':
+                return new ThemeRed()
+            default:
+                return new ThemeDark()
+        }
+    }
+}
+
+/**
+ * Class that represents a PixiJS ThemeDark.
+ *
+ * @example
+ * // Create the app with a new dark theme
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 450,
+ *     height: 150,
+ *     theme: new ThemeDark()
+ * }).setup().run()
+ *
+ * @class
+ * @extends Theme
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/theme.html|DocTest}
+ */
+export class ThemeDark extends Theme {
+
+}
+
+/**
+ * Class that represents a PixiJS ThemeLight.
+ * The color1 is set to 0xf6f6f6, color2 to 0x282828.
+ *
+ * @example
+ * // Create the app with a new light theme
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 450,
+ *     height: 150,
+ *     theme: new ThemeLight()
+ * }).setup().run()
+ *
+ * @class
+ * @extends Theme
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/theme.html|DocTest}
+ */
+export class ThemeLight extends Theme {
+
+    /**
+     * Creates an instance of a ThemeLight.
+     *
+     * @constructor
+     */
+    constructor() {
+
+        super({color1: 0xf6f6f6, color2: 0x282828})
+    }
+}
+
+/**
+ * Class that represents a PixiJS ThemeRed.
+ * The primaryColor is set to 0xd92f31.
+ *
+ * @example
+ * // Create the app with a new red theme
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 450,
+ *     height: 150,
+ *     theme: new ThemeRed()
+ * }).setup().run()
+ *
+ * @class
+ * @extends Theme
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/theme.html|DocTest}
+ */
+export class ThemeRed extends Theme {
+
+    /**
+     * Creates an instance of a ThemeRed.
+     *
+     * @constructor
+     */
+    constructor() {
+
+        super({primaryColor: 0xd92f31})
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_tooltip.js.html b/doc/out/pixi_tooltip.js.html new file mode 100644 index 0000000..26fb96d --- /dev/null +++ b/doc/out/pixi_tooltip.js.html @@ -0,0 +1,1363 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/tooltip.js

+ + + + +
+
+
+

pixi/tooltip.js

+
+
+
+
import Theme from './theme.js'
+import AbstractPopup from './abstractpopup.js'
+
+/**
+ * Class that represents a PixiJS Tooltip.
+ * 
+ * @example
+ * // Create the app
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * // Add an DisplayObject to the app
+ * const circle = new PIXI.Graphics()
+ * circle.beginFill(0x5251a3)
+ * circle.drawCircle(50, 50, 40)
+ * app.scene.addChild(circle)
+ * 
+ * const tooltip = new Tooltip({
+ *     object: circle,
+ *     container: app.scene,
+ *     content: 'Das Gesetz ist der Freund des Schwachen.'
+ * })
+ *
+ * @class
+ * @extends AbstractPopup
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/tooltip.html|DocTest}
+ */
+export default class Tooltip extends AbstractPopup {
+    
+    /**
+     * Creates an instance of a Tooltip.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the tooltip.
+     * @param {number} [opts.minWidth=0] - The minimum width of the tooltip.
+     * @param {number} [opts.minHeight=0] - The minimum height of the tooltip.
+     * @param {number} [opts.padding=Theme.padding / 2] - The inner spacing of the tooltip.
+     * @param {PIXI.DisplayObject} opts.object - The object, where the tooltip should be displayed.
+     * @param {PIXI.DisplayObject} [opts.container=object] - The container where the tooltip should be attached to.
+     * @param {number} [opts.offsetLeft=8] - The horizontal shift of the tooltip.
+     * @param {number} [opts.offsetTop=-8] - The vertical shift of the tooltip.
+     * @param {number} [opts.delay=0] - A delay, after which the tooltip should be opened.
+     */
+    constructor(opts = {}) {
+        
+        const theme = Theme.fromString(opts.theme)
+        
+        opts = Object.assign({}, {
+            minWidth: 0,
+            minHeight: 0,
+            padding: theme.padding / 2,
+            object: null,
+            container: null,
+            offsetLeft: 8,
+            offsetTop: -8,
+            delay: 0
+        }, opts)
+
+        opts.container = opts.container || opts.object
+
+        super(opts)
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Tooltip} A reference to the tooltip for chaining.
+     */
+    setup() {
+
+        super.setup()
+
+        // bind events this
+        //-----------------
+        this.interactive = true
+
+        let mouseoverTooltip = false
+        
+        this.on('mouseover', e => {
+            mouseoverTooltip = true
+        })
+
+        this.on('mouseout', e => {
+            mouseoverTooltip = false
+            if (!mouseoverObject) {
+                this.hide(() => {
+                    this.opts.container.removeChild(this)
+                })
+            }
+        })
+        
+        // bind events object
+        //-----------------
+        const object = this.opts.object
+        object.interactive = true
+
+        let mouseoverObject = false
+
+        object.on('mouseover', e => {
+
+            this.timeout = window.setTimeout(() => {
+                mouseoverObject = true
+                this.visible = true
+                this.opts.container.addChild(this)
+                this.setPosition(e)
+            }, this.opts.delay * 1000)
+        })
+
+        object.on('mousemove', e => {
+            if (mouseoverObject) {
+                this.setPosition(e)
+            }
+        })
+
+        object.on('mouseout', e => {
+            mouseoverObject = false
+            window.clearTimeout(this.timeout)
+            if (!mouseoverTooltip) {
+                this.hide(() => {
+                    this.opts.container.removeChild(this)
+                })
+            }
+        })
+
+        return this
+    }
+    
+    /**
+     * Calculates and sets the position of the tooltip.
+     * 
+     * @private
+     * @return {Tooltip} A reference to the tooltip for chaining.
+     */
+    setPosition(e) {
+
+        const position = e.data.getLocalPosition(this.opts.container)
+
+        this.x = position.x + this.opts.offsetLeft
+        this.y = position.y + this.opts.offsetTop - this.height
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/pixi_volatile.js.html b/doc/out/pixi_volatile.js.html new file mode 100644 index 0000000..c869b72 --- /dev/null +++ b/doc/out/pixi_volatile.js.html @@ -0,0 +1,1369 @@ + + + + + iwmlib API Documentation + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+

Source: pixi/volatile.js

+ + + + +
+
+
+

pixi/volatile.js

+
+
+
+
/* global Quad */
+
+import Theme from './theme.js'
+
+/**
+ * Class that represents a PixiJS Volatile.
+ * 
+ * @example
+ * const app = new PIXIApp({
+ *     view: canvas,
+ *     width: 900,
+ *     height: 250
+ * }).setup().run()
+ * 
+ * const button = new Button({
+ *     label: 'Volatile!',
+ *     action: () => {
+ *         new Volatile({
+ *             object: button,
+ *             direction: 'right',
+ *             destroyOnComplete: false
+ *         })
+ *     }
+ * })
+ * 
+ * app.scene.addChild(button)
+ *
+ * @class
+ * @see {@link https://www.iwm-tuebingen.de/iwmbrowser/lib/pixi/volatile.html|DocTest}
+ */
+export default class Volatile {
+    
+    /**
+     * Creates an instance of a Volatile.
+     * 
+     * @constructor
+     * @param {object} [opts] - An options object to specify to style and behaviour of the modal.
+     * @param {number} [opts.id=auto generated] - The id of the tooltip.
+     * @param {PIXI.DisplayObject|PIXI.DisplayObject[]} opts.object - The object where the volatile should be applied to.
+     * @param {string} [opts.direction=top] - The animation direction. Possible values: top, right, bottom, left.
+     * @param {function} [opts.onStart] - A function which is executed when the volatile animation starts.
+     * @param {function} [opts.onComplete] - A function which is executed when the volatile animation finishes.
+     * @param {number} [opts.distance=160] - The animation distance.
+     * @param {number} [opts.duration=1.5] - The duration of the animation in seconds.
+     * @param {object} [opts.ease=Quad.easeOut] - The easing of the animation, see {@link https://greensock.com/docs/Easing}
+     * @param {boolean} [opts.destroyOnComplete=true] - Should the object be destroyed after the volatile animation?
+     */
+    constructor(opts = {}) {
+        
+        const theme = Theme.fromString(opts.theme)
+        this.theme = theme
+
+        this.opts = Object.assign({}, {
+            id: PIXI.utils.uid(),
+            object: null,
+            direction: 'top',               // top, right, bottom, left
+            onStart: null,
+            onComplete: null,
+            distance: 160,
+            duration: 1.5,
+            ease: Quad.easeOut,
+            destroyOnComplete: true
+        }, opts)
+
+        this.id = this.opts.id
+
+        if (!Array.isArray(this.opts.object)) {
+            this.opts.object = [this.opts.object]
+        }
+
+        this.objects = this.opts.object
+
+        // setup
+        //-----------------
+        this.setup()
+
+        // layout
+        //-----------------
+        this.layout()
+
+        // run
+        //-----------------
+        this.run()
+    }
+    
+    /**
+     * Creates children and instantiates everything.
+     * 
+     * @private
+     * @return {Volatile} A reference to the volatile for chaining.
+     */
+    setup() {
+
+        return this
+    }
+    
+    /**
+     * Should be called to refresh the layout of the volatile. Can be used after resizing.
+     * 
+     * @return {Volatile} A reference to the volatile for chaining.
+     */
+    layout() {
+        
+        return this
+    }
+    
+    /**
+     * Starts the volatile animation.
+     * 
+     * @private
+     * @return {Volatile} A reference to the volatile for chaining.
+     */
+    run() {
+
+        for (let object of this.objects) {
+
+            let x = object.x
+            let y = object.y
+
+            switch (this.opts.direction) {
+                case 'top':
+                    y -= this.opts.distance
+                    break
+                case 'right':
+                    x += this.opts.distance
+                    break
+                case 'bottom':
+                    y += this.opts.distance
+                    break
+                case 'left':
+                    x -= this.opts.distance
+                    break
+            }
+
+            TweenLite.to(object, this.opts.duration, {
+                x,
+                y,
+                alpha: 0,
+                ease: this.opts.ease,
+                overwrite: 'all',
+                onStart: () => {
+                    if (this.opts.onStart) {
+                        this.opts.onStart.call(object, object)
+                    }
+                },
+                onComplete: () => {
+                    
+                    if (this.opts.onComplete) {
+                        this.opts.onComplete.call(object, object)
+                    }
+
+                    if (this.opts.destroyOnComplete) {
+                        object.destroy({children: true})
+                    }
+                }
+            })
+        }
+
+        return this
+    }
+}
+
+
+
+ + + + + + + + + +
+
+ + + + diff --git a/doc/out/scripts/bootstrap.min.js b/doc/out/scripts/bootstrap.min.js new file mode 100644 index 0000000..1a6258e --- /dev/null +++ b/doc/out/scripts/bootstrap.min.js @@ -0,0 +1,7 @@ +/*! + * Bootstrap v3.0.3 (http://getbootstrap.com) + * Copyright 2013 Twitter, Inc. + * Licensed under http://www.apache.org/licenses/LICENSE-2.0 + */ + +if("undefined"==typeof jQuery)throw new Error("Bootstrap requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]}}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one(a.support.transition.end,function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b()})}(jQuery),+function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function c(){f.trigger("closed.bs.alert").remove()}var d=a(this),e=d.attr("data-target");e||(e=d.attr("href"),e=e&&e.replace(/.*(?=#[^\s]*$)/,""));var f=a(e);b&&b.preventDefault(),f.length||(f=d.hasClass("alert")?d:d.parent()),f.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(f.removeClass("in"),a.support.transition&&f.hasClass("fade")?f.one(a.support.transition.end,c).emulateTransitionEnd(150):c())};var d=a.fn.alert;a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("bs.alert");e||d.data("bs.alert",e=new c(this)),"string"==typeof b&&e[b].call(d)})},a.fn.alert.Constructor=c,a.fn.alert.noConflict=function(){return a.fn.alert=d,this},a(document).on("click.bs.alert.data-api",b,c.prototype.close)}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d)};b.DEFAULTS={loadingText:"loading..."},b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.is("input")?"val":"html",e=c.data();a+="Text",e.resetText||c.data("resetText",c[d]()),c[d](e[a]||this.options[a]),setTimeout(function(){"loadingText"==a?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.closest('[data-toggle="buttons"]'),b=!0;if(a.length){var c=this.$element.find("input");"radio"===c.prop("type")&&(c.prop("checked")&&this.$element.hasClass("active")?b=!1:a.find(".active").removeClass("active")),b&&c.prop("checked",!this.$element.hasClass("active")).trigger("change")}b&&this.$element.toggleClass("active")};var c=a.fn.button;a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("bs.button"),f="object"==typeof c&&c;e||d.data("bs.button",e=new b(this,f)),"toggle"==c?e.toggle():c&&e.setState(c)})},a.fn.button.Constructor=b,a.fn.button.noConflict=function(){return a.fn.button=c,this},a(document).on("click.bs.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle"),b.preventDefault()})}(jQuery),+function(a){"use strict";var b=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.DEFAULTS={interval:5e3,pause:"hover",wrap:!0},b.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},b.prototype.getActiveIndex=function(){return this.$active=this.$element.find(".item.active"),this.$items=this.$active.parent().children(),this.$items.index(this.$active)},b.prototype.to=function(b){var c=this,d=this.getActiveIndex();return b>this.$items.length-1||0>b?void 0:this.sliding?this.$element.one("slid.bs.carousel",function(){c.to(b)}):d==b?this.pause().cycle():this.slide(b>d?"next":"prev",a(this.$items[b]))},b.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition.end&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},b.prototype.next=function(){return this.sliding?void 0:this.slide("next")},b.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},b.prototype.slide=function(b,c){var d=this.$element.find(".item.active"),e=c||d[b](),f=this.interval,g="next"==b?"left":"right",h="next"==b?"first":"last",i=this;if(!e.length){if(!this.options.wrap)return;e=this.$element.find(".item")[h]()}this.sliding=!0,f&&this.pause();var j=a.Event("slide.bs.carousel",{relatedTarget:e[0],direction:g});if(!e.hasClass("active")){if(this.$indicators.length&&(this.$indicators.find(".active").removeClass("active"),this.$element.one("slid.bs.carousel",function(){var b=a(i.$indicators.children()[i.getActiveIndex()]);b&&b.addClass("active")})),a.support.transition&&this.$element.hasClass("slide")){if(this.$element.trigger(j),j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),d.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid.bs.carousel")},0)}).emulateTransitionEnd(600)}else{if(this.$element.trigger(j),j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid.bs.carousel")}return f&&this.cycle(),this}};var c=a.fn.carousel;a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c),g="string"==typeof c?c:f.slide;e||d.data("bs.carousel",e=new b(this,f)),"number"==typeof c?e.to(c):g?e[g]():f.interval&&e.pause().cycle()})},a.fn.carousel.Constructor=b,a.fn.carousel.noConflict=function(){return a.fn.carousel=c,this},a(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(b){var c,d=a(this),e=a(d.attr("data-target")||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"")),f=a.extend({},e.data(),d.data()),g=d.attr("data-slide-to");g&&(f.interval=!1),e.carousel(f),(g=d.attr("data-slide-to"))&&e.data("bs.carousel").to(g),b.preventDefault()}),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var b=a(this);b.carousel(b.data())})})}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.transitioning=null,this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.DEFAULTS={toggle:!0},b.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},b.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b=a.Event("show.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.$parent&&this.$parent.find("> .panel > .in");if(c&&c.length){var d=c.data("bs.collapse");if(d&&d.transitioning)return;c.collapse("hide"),d||c.data("bs.collapse",null)}var e=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[e](0),this.transitioning=1;var f=function(){this.$element.removeClass("collapsing").addClass("in")[e]("auto"),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return f.call(this);var g=a.camelCase(["scroll",e].join("-"));this.$element.one(a.support.transition.end,a.proxy(f,this)).emulateTransitionEnd(350)[e](this.$element[0][g])}}},b.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var d=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return a.support.transition?(this.$element[c](0).one(a.support.transition.end,a.proxy(d,this)).emulateTransitionEnd(350),void 0):d.call(this)}}},b.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var c=a.fn.collapse;a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("bs.collapse"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);e||d.data("bs.collapse",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.collapse.Constructor=b,a.fn.collapse.noConflict=function(){return a.fn.collapse=c,this},a(document).on("click.bs.collapse.data-api","[data-toggle=collapse]",function(b){var c,d=a(this),e=d.attr("data-target")||b.preventDefault()||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,""),f=a(e),g=f.data("bs.collapse"),h=g?"toggle":d.data(),i=d.attr("data-parent"),j=i&&a(i);g&&g.transitioning||(j&&j.find('[data-toggle=collapse][data-parent="'+i+'"]').not(d).addClass("collapsed"),d[f.hasClass("in")?"addClass":"removeClass"]("collapsed")),f.collapse(h)})}(jQuery),+function(a){"use strict";function b(){a(d).remove(),a(e).each(function(b){var d=c(a(this));d.hasClass("open")&&(d.trigger(b=a.Event("hide.bs.dropdown")),b.isDefaultPrevented()||d.removeClass("open").trigger("hidden.bs.dropdown"))})}function c(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}var d=".dropdown-backdrop",e="[data-toggle=dropdown]",f=function(b){a(b).on("click.bs.dropdown",this.toggle)};f.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=c(e),g=f.hasClass("open");if(b(),!g){if("ontouchstart"in document.documentElement&&!f.closest(".navbar-nav").length&&a(''}),b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),b.prototype.constructor=b,b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content")[this.options.html?"html":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title").html()||a.find(".popover-title").hide()},b.prototype.hasContent=function(){return this.getTitle()||this.getContent()},b.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},b.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip};var c=a.fn.popover;a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("bs.popover"),f="object"==typeof c&&c;e||d.data("bs.popover",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.noConflict=function(){return a.fn.popover=c,this}}(jQuery),+function(a){"use strict";function b(c,d){var e,f=a.proxy(this.process,this);this.$element=a(c).is("body")?a(window):a(c),this.$body=a("body"),this.$scrollElement=this.$element.on("scroll.bs.scroll-spy.data-api",f),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||(e=a(c).attr("href"))&&e.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.offsets=a([]),this.targets=a([]),this.activeTarget=null,this.refresh(),this.process()}b.DEFAULTS={offset:10},b.prototype.refresh=function(){var b=this.$element[0]==window?"offset":"position";this.offsets=a([]),this.targets=a([]);var c=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#\w/.test(e)&&a(e);return f&&f.length&&[[f[b]().top+(!a.isWindow(c.$scrollElement.get(0))&&c.$scrollElement.scrollTop()),e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){c.offsets.push(this[0]),c.targets.push(this[1])})},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,d=c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(b>=d)return g!=(a=f.last()[0])&&this.activate(a);for(a=e.length;a--;)g!=f[a]&&b>=e[a]&&(!e[a+1]||b<=e[a+1])&&this.activate(f[a])},b.prototype.activate=function(b){this.activeTarget=b,a(this.selector).parents(".active").removeClass("active");var c=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',d=a(c).parents("li").addClass("active");d.parent(".dropdown-menu").length&&(d=d.closest("li.dropdown").addClass("active")),d.trigger("activate.bs.scrollspy")};var c=a.fn.scrollspy;a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.noConflict=function(){return a.fn.scrollspy=c,this},a(window).on("load",function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(jQuery),+function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype.show=function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.data("target");if(d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),!b.parent("li").hasClass("active")){var e=c.find(".active:last a")[0],f=a.Event("show.bs.tab",{relatedTarget:e});if(b.trigger(f),!f.isDefaultPrevented()){var g=a(d);this.activate(b.parent("li"),c),this.activate(g,g.parent(),function(){b.trigger({type:"shown.bs.tab",relatedTarget:e})})}}},b.prototype.activate=function(b,c,d){function e(){f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),g?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var f=c.find("> .active"),g=d&&a.support.transition&&f.hasClass("fade");g?f.one(a.support.transition.end,e).emulateTransitionEnd(150):e(),f.removeClass("in")};var c=a.fn.tab;a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tab");e||d.data("bs.tab",e=new b(this)),"string"==typeof c&&e[c]()})},a.fn.tab.Constructor=b,a.fn.tab.noConflict=function(){return a.fn.tab=c,this},a(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})}(jQuery),+function(a){"use strict";var b=function(c,d){this.options=a.extend({},b.DEFAULTS,d),this.$window=a(window).on("scroll.bs.affix.data-api",a.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",a.proxy(this.checkPositionWithEventLoop,this)),this.$element=a(c),this.affixed=this.unpin=null,this.checkPosition()};b.RESET="affix affix-top affix-bottom",b.DEFAULTS={offset:0},b.prototype.checkPositionWithEventLoop=function(){setTimeout(a.proxy(this.checkPosition,this),1)},b.prototype.checkPosition=function(){if(this.$element.is(":visible")){var c=a(document).height(),d=this.$window.scrollTop(),e=this.$element.offset(),f=this.options.offset,g=f.top,h=f.bottom;"object"!=typeof f&&(h=g=f),"function"==typeof g&&(g=f.top()),"function"==typeof h&&(h=f.bottom());var i=null!=this.unpin&&d+this.unpin<=e.top?!1:null!=h&&e.top+this.$element.height()>=c-h?"bottom":null!=g&&g>=d?"top":!1;this.affixed!==i&&(this.unpin&&this.$element.css("top",""),this.affixed=i,this.unpin="bottom"==i?e.top-d:null,this.$element.removeClass(b.RESET).addClass("affix"+(i?"-"+i:"")),"bottom"==i&&this.$element.offset({top:document.body.offsetHeight-h-this.$element.height()}))}};var c=a.fn.affix;a.fn.affix=function(c){return this.each(function(){var d=a(this),e=d.data("bs.affix"),f="object"==typeof c&&c;e||d.data("bs.affix",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.affix.Constructor=b,a.fn.affix.noConflict=function(){return a.fn.affix=c,this},a(window).on("load",function(){a('[data-spy="affix"]').each(function(){var b=a(this),c=b.data();c.offset=c.offset||{},c.offsetBottom&&(c.offset.bottom=c.offsetBottom),c.offsetTop&&(c.offset.top=c.offsetTop),b.affix(c)})})}(jQuery); \ No newline at end of file diff --git a/doc/out/scripts/jquery.min.js b/doc/out/scripts/jquery.min.js new file mode 100644 index 0000000..9a85bd3 --- /dev/null +++ b/doc/out/scripts/jquery.min.js @@ -0,0 +1,6 @@ +/*! jQuery v2.0.3 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license +//@ sourceMappingURL=jquery.min.map +*/ +(function(e,undefined){var t,n,r=typeof undefined,i=e.location,o=e.document,s=o.documentElement,a=e.jQuery,u=e.$,l={},c=[],p="2.0.3",f=c.concat,h=c.push,d=c.slice,g=c.indexOf,m=l.toString,y=l.hasOwnProperty,v=p.trim,x=function(e,n){return new x.fn.init(e,n,t)},b=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,w=/\S+/g,T=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,C=/^<(\w+)\s*\/?>(?:<\/\1>|)$/,k=/^-ms-/,N=/-([\da-z])/gi,E=function(e,t){return t.toUpperCase()},S=function(){o.removeEventListener("DOMContentLoaded",S,!1),e.removeEventListener("load",S,!1),x.ready()};x.fn=x.prototype={jquery:p,constructor:x,init:function(e,t,n){var r,i;if(!e)return this;if("string"==typeof e){if(r="<"===e.charAt(0)&&">"===e.charAt(e.length-1)&&e.length>=3?[null,e,null]:T.exec(e),!r||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof x?t[0]:t,x.merge(this,x.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:o,!0)),C.test(r[1])&&x.isPlainObject(t))for(r in t)x.isFunction(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return i=o.getElementById(r[2]),i&&i.parentNode&&(this.length=1,this[0]=i),this.context=o,this.selector=e,this}return e.nodeType?(this.context=this[0]=e,this.length=1,this):x.isFunction(e)?n.ready(e):(e.selector!==undefined&&(this.selector=e.selector,this.context=e.context),x.makeArray(e,this))},selector:"",length:0,toArray:function(){return d.call(this)},get:function(e){return null==e?this.toArray():0>e?this[this.length+e]:this[e]},pushStack:function(e){var t=x.merge(this.constructor(),e);return t.prevObject=this,t.context=this.context,t},each:function(e,t){return x.each(this,e,t)},ready:function(e){return x.ready.promise().done(e),this},slice:function(){return this.pushStack(d.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(e){var t=this.length,n=+e+(0>e?t:0);return this.pushStack(n>=0&&t>n?[this[n]]:[])},map:function(e){return this.pushStack(x.map(this,function(t,n){return e.call(t,n,t)}))},end:function(){return this.prevObject||this.constructor(null)},push:h,sort:[].sort,splice:[].splice},x.fn.init.prototype=x.fn,x.extend=x.fn.extend=function(){var e,t,n,r,i,o,s=arguments[0]||{},a=1,u=arguments.length,l=!1;for("boolean"==typeof s&&(l=s,s=arguments[1]||{},a=2),"object"==typeof s||x.isFunction(s)||(s={}),u===a&&(s=this,--a);u>a;a++)if(null!=(e=arguments[a]))for(t in e)n=s[t],r=e[t],s!==r&&(l&&r&&(x.isPlainObject(r)||(i=x.isArray(r)))?(i?(i=!1,o=n&&x.isArray(n)?n:[]):o=n&&x.isPlainObject(n)?n:{},s[t]=x.extend(l,o,r)):r!==undefined&&(s[t]=r));return s},x.extend({expando:"jQuery"+(p+Math.random()).replace(/\D/g,""),noConflict:function(t){return e.$===x&&(e.$=u),t&&e.jQuery===x&&(e.jQuery=a),x},isReady:!1,readyWait:1,holdReady:function(e){e?x.readyWait++:x.ready(!0)},ready:function(e){(e===!0?--x.readyWait:x.isReady)||(x.isReady=!0,e!==!0&&--x.readyWait>0||(n.resolveWith(o,[x]),x.fn.trigger&&x(o).trigger("ready").off("ready")))},isFunction:function(e){return"function"===x.type(e)},isArray:Array.isArray,isWindow:function(e){return null!=e&&e===e.window},isNumeric:function(e){return!isNaN(parseFloat(e))&&isFinite(e)},type:function(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?l[m.call(e)]||"object":typeof e},isPlainObject:function(e){if("object"!==x.type(e)||e.nodeType||x.isWindow(e))return!1;try{if(e.constructor&&!y.call(e.constructor.prototype,"isPrototypeOf"))return!1}catch(t){return!1}return!0},isEmptyObject:function(e){var t;for(t in e)return!1;return!0},error:function(e){throw Error(e)},parseHTML:function(e,t,n){if(!e||"string"!=typeof e)return null;"boolean"==typeof t&&(n=t,t=!1),t=t||o;var r=C.exec(e),i=!n&&[];return r?[t.createElement(r[1])]:(r=x.buildFragment([e],t,i),i&&x(i).remove(),x.merge([],r.childNodes))},parseJSON:JSON.parse,parseXML:function(e){var t,n;if(!e||"string"!=typeof e)return null;try{n=new DOMParser,t=n.parseFromString(e,"text/xml")}catch(r){t=undefined}return(!t||t.getElementsByTagName("parsererror").length)&&x.error("Invalid XML: "+e),t},noop:function(){},globalEval:function(e){var t,n=eval;e=x.trim(e),e&&(1===e.indexOf("use strict")?(t=o.createElement("script"),t.text=e,o.head.appendChild(t).parentNode.removeChild(t)):n(e))},camelCase:function(e){return e.replace(k,"ms-").replace(N,E)},nodeName:function(e,t){return e.nodeName&&e.nodeName.toLowerCase()===t.toLowerCase()},each:function(e,t,n){var r,i=0,o=e.length,s=j(e);if(n){if(s){for(;o>i;i++)if(r=t.apply(e[i],n),r===!1)break}else for(i in e)if(r=t.apply(e[i],n),r===!1)break}else if(s){for(;o>i;i++)if(r=t.call(e[i],i,e[i]),r===!1)break}else for(i in e)if(r=t.call(e[i],i,e[i]),r===!1)break;return e},trim:function(e){return null==e?"":v.call(e)},makeArray:function(e,t){var n=t||[];return null!=e&&(j(Object(e))?x.merge(n,"string"==typeof e?[e]:e):h.call(n,e)),n},inArray:function(e,t,n){return null==t?-1:g.call(t,e,n)},merge:function(e,t){var n=t.length,r=e.length,i=0;if("number"==typeof n)for(;n>i;i++)e[r++]=t[i];else while(t[i]!==undefined)e[r++]=t[i++];return e.length=r,e},grep:function(e,t,n){var r,i=[],o=0,s=e.length;for(n=!!n;s>o;o++)r=!!t(e[o],o),n!==r&&i.push(e[o]);return i},map:function(e,t,n){var r,i=0,o=e.length,s=j(e),a=[];if(s)for(;o>i;i++)r=t(e[i],i,n),null!=r&&(a[a.length]=r);else for(i in e)r=t(e[i],i,n),null!=r&&(a[a.length]=r);return f.apply([],a)},guid:1,proxy:function(e,t){var n,r,i;return"string"==typeof t&&(n=e[t],t=e,e=n),x.isFunction(e)?(r=d.call(arguments,2),i=function(){return e.apply(t||this,r.concat(d.call(arguments)))},i.guid=e.guid=e.guid||x.guid++,i):undefined},access:function(e,t,n,r,i,o,s){var a=0,u=e.length,l=null==n;if("object"===x.type(n)){i=!0;for(a in n)x.access(e,t,a,n[a],!0,o,s)}else if(r!==undefined&&(i=!0,x.isFunction(r)||(s=!0),l&&(s?(t.call(e,r),t=null):(l=t,t=function(e,t,n){return l.call(x(e),n)})),t))for(;u>a;a++)t(e[a],n,s?r:r.call(e[a],a,t(e[a],n)));return i?e:l?t.call(e):u?t(e[0],n):o},now:Date.now,swap:function(e,t,n,r){var i,o,s={};for(o in t)s[o]=e.style[o],e.style[o]=t[o];i=n.apply(e,r||[]);for(o in t)e.style[o]=s[o];return i}}),x.ready.promise=function(t){return n||(n=x.Deferred(),"complete"===o.readyState?setTimeout(x.ready):(o.addEventListener("DOMContentLoaded",S,!1),e.addEventListener("load",S,!1))),n.promise(t)},x.each("Boolean Number String Function Array Date RegExp Object Error".split(" "),function(e,t){l["[object "+t+"]"]=t.toLowerCase()});function j(e){var t=e.length,n=x.type(e);return x.isWindow(e)?!1:1===e.nodeType&&t?!0:"array"===n||"function"!==n&&(0===t||"number"==typeof t&&t>0&&t-1 in e)}t=x(o),function(e,undefined){var t,n,r,i,o,s,a,u,l,c,p,f,h,d,g,m,y,v="sizzle"+-new Date,b=e.document,w=0,T=0,C=st(),k=st(),N=st(),E=!1,S=function(e,t){return e===t?(E=!0,0):0},j=typeof undefined,D=1<<31,A={}.hasOwnProperty,L=[],q=L.pop,H=L.push,O=L.push,F=L.slice,P=L.indexOf||function(e){var t=0,n=this.length;for(;n>t;t++)if(this[t]===e)return t;return-1},R="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",M="[\\x20\\t\\r\\n\\f]",W="(?:\\\\.|[\\w-]|[^\\x00-\\xa0])+",$=W.replace("w","w#"),B="\\["+M+"*("+W+")"+M+"*(?:([*^$|!~]?=)"+M+"*(?:(['\"])((?:\\\\.|[^\\\\])*?)\\3|("+$+")|)|)"+M+"*\\]",I=":("+W+")(?:\\(((['\"])((?:\\\\.|[^\\\\])*?)\\3|((?:\\\\.|[^\\\\()[\\]]|"+B.replace(3,8)+")*)|.*)\\)|)",z=RegExp("^"+M+"+|((?:^|[^\\\\])(?:\\\\.)*)"+M+"+$","g"),_=RegExp("^"+M+"*,"+M+"*"),X=RegExp("^"+M+"*([>+~]|"+M+")"+M+"*"),U=RegExp(M+"*[+~]"),Y=RegExp("="+M+"*([^\\]'\"]*)"+M+"*\\]","g"),V=RegExp(I),G=RegExp("^"+$+"$"),J={ID:RegExp("^#("+W+")"),CLASS:RegExp("^\\.("+W+")"),TAG:RegExp("^("+W.replace("w","w*")+")"),ATTR:RegExp("^"+B),PSEUDO:RegExp("^"+I),CHILD:RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:RegExp("^(?:"+R+")$","i"),needsContext:RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Q=/^[^{]+\{\s*\[native \w/,K=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,Z=/^(?:input|select|textarea|button)$/i,et=/^h\d$/i,tt=/'|\\/g,nt=RegExp("\\\\([\\da-f]{1,6}"+M+"?|("+M+")|.)","ig"),rt=function(e,t,n){var r="0x"+t-65536;return r!==r||n?t:0>r?String.fromCharCode(r+65536):String.fromCharCode(55296|r>>10,56320|1023&r)};try{O.apply(L=F.call(b.childNodes),b.childNodes),L[b.childNodes.length].nodeType}catch(it){O={apply:L.length?function(e,t){H.apply(e,F.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function ot(e,t,r,i){var o,s,a,u,l,f,g,m,x,w;if((t?t.ownerDocument||t:b)!==p&&c(t),t=t||p,r=r||[],!e||"string"!=typeof e)return r;if(1!==(u=t.nodeType)&&9!==u)return[];if(h&&!i){if(o=K.exec(e))if(a=o[1]){if(9===u){if(s=t.getElementById(a),!s||!s.parentNode)return r;if(s.id===a)return r.push(s),r}else if(t.ownerDocument&&(s=t.ownerDocument.getElementById(a))&&y(t,s)&&s.id===a)return r.push(s),r}else{if(o[2])return O.apply(r,t.getElementsByTagName(e)),r;if((a=o[3])&&n.getElementsByClassName&&t.getElementsByClassName)return O.apply(r,t.getElementsByClassName(a)),r}if(n.qsa&&(!d||!d.test(e))){if(m=g=v,x=t,w=9===u&&e,1===u&&"object"!==t.nodeName.toLowerCase()){f=gt(e),(g=t.getAttribute("id"))?m=g.replace(tt,"\\$&"):t.setAttribute("id",m),m="[id='"+m+"'] ",l=f.length;while(l--)f[l]=m+mt(f[l]);x=U.test(e)&&t.parentNode||t,w=f.join(",")}if(w)try{return O.apply(r,x.querySelectorAll(w)),r}catch(T){}finally{g||t.removeAttribute("id")}}}return kt(e.replace(z,"$1"),t,r,i)}function st(){var e=[];function t(n,r){return e.push(n+=" ")>i.cacheLength&&delete t[e.shift()],t[n]=r}return t}function at(e){return e[v]=!0,e}function ut(e){var t=p.createElement("div");try{return!!e(t)}catch(n){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function lt(e,t){var n=e.split("|"),r=e.length;while(r--)i.attrHandle[n[r]]=t}function ct(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&(~t.sourceIndex||D)-(~e.sourceIndex||D);if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function pt(e){return function(t){var n=t.nodeName.toLowerCase();return"input"===n&&t.type===e}}function ft(e){return function(t){var n=t.nodeName.toLowerCase();return("input"===n||"button"===n)&&t.type===e}}function ht(e){return at(function(t){return t=+t,at(function(n,r){var i,o=e([],n.length,t),s=o.length;while(s--)n[i=o[s]]&&(n[i]=!(r[i]=n[i]))})})}s=ot.isXML=function(e){var t=e&&(e.ownerDocument||e).documentElement;return t?"HTML"!==t.nodeName:!1},n=ot.support={},c=ot.setDocument=function(e){var t=e?e.ownerDocument||e:b,r=t.defaultView;return t!==p&&9===t.nodeType&&t.documentElement?(p=t,f=t.documentElement,h=!s(t),r&&r.attachEvent&&r!==r.top&&r.attachEvent("onbeforeunload",function(){c()}),n.attributes=ut(function(e){return e.className="i",!e.getAttribute("className")}),n.getElementsByTagName=ut(function(e){return e.appendChild(t.createComment("")),!e.getElementsByTagName("*").length}),n.getElementsByClassName=ut(function(e){return e.innerHTML="
",e.firstChild.className="i",2===e.getElementsByClassName("i").length}),n.getById=ut(function(e){return f.appendChild(e).id=v,!t.getElementsByName||!t.getElementsByName(v).length}),n.getById?(i.find.ID=function(e,t){if(typeof t.getElementById!==j&&h){var n=t.getElementById(e);return n&&n.parentNode?[n]:[]}},i.filter.ID=function(e){var t=e.replace(nt,rt);return function(e){return e.getAttribute("id")===t}}):(delete i.find.ID,i.filter.ID=function(e){var t=e.replace(nt,rt);return function(e){var n=typeof e.getAttributeNode!==j&&e.getAttributeNode("id");return n&&n.value===t}}),i.find.TAG=n.getElementsByTagName?function(e,t){return typeof t.getElementsByTagName!==j?t.getElementsByTagName(e):undefined}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},i.find.CLASS=n.getElementsByClassName&&function(e,t){return typeof t.getElementsByClassName!==j&&h?t.getElementsByClassName(e):undefined},g=[],d=[],(n.qsa=Q.test(t.querySelectorAll))&&(ut(function(e){e.innerHTML="",e.querySelectorAll("[selected]").length||d.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll(":checked").length||d.push(":checked")}),ut(function(e){var n=t.createElement("input");n.setAttribute("type","hidden"),e.appendChild(n).setAttribute("t",""),e.querySelectorAll("[t^='']").length&&d.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll(":enabled").length||d.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),d.push(",.*:")})),(n.matchesSelector=Q.test(m=f.webkitMatchesSelector||f.mozMatchesSelector||f.oMatchesSelector||f.msMatchesSelector))&&ut(function(e){n.disconnectedMatch=m.call(e,"div"),m.call(e,"[s!='']:x"),g.push("!=",I)}),d=d.length&&RegExp(d.join("|")),g=g.length&&RegExp(g.join("|")),y=Q.test(f.contains)||f.compareDocumentPosition?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},S=f.compareDocumentPosition?function(e,r){if(e===r)return E=!0,0;var i=r.compareDocumentPosition&&e.compareDocumentPosition&&e.compareDocumentPosition(r);return i?1&i||!n.sortDetached&&r.compareDocumentPosition(e)===i?e===t||y(b,e)?-1:r===t||y(b,r)?1:l?P.call(l,e)-P.call(l,r):0:4&i?-1:1:e.compareDocumentPosition?-1:1}:function(e,n){var r,i=0,o=e.parentNode,s=n.parentNode,a=[e],u=[n];if(e===n)return E=!0,0;if(!o||!s)return e===t?-1:n===t?1:o?-1:s?1:l?P.call(l,e)-P.call(l,n):0;if(o===s)return ct(e,n);r=e;while(r=r.parentNode)a.unshift(r);r=n;while(r=r.parentNode)u.unshift(r);while(a[i]===u[i])i++;return i?ct(a[i],u[i]):a[i]===b?-1:u[i]===b?1:0},t):p},ot.matches=function(e,t){return ot(e,null,null,t)},ot.matchesSelector=function(e,t){if((e.ownerDocument||e)!==p&&c(e),t=t.replace(Y,"='$1']"),!(!n.matchesSelector||!h||g&&g.test(t)||d&&d.test(t)))try{var r=m.call(e,t);if(r||n.disconnectedMatch||e.document&&11!==e.document.nodeType)return r}catch(i){}return ot(t,p,null,[e]).length>0},ot.contains=function(e,t){return(e.ownerDocument||e)!==p&&c(e),y(e,t)},ot.attr=function(e,t){(e.ownerDocument||e)!==p&&c(e);var r=i.attrHandle[t.toLowerCase()],o=r&&A.call(i.attrHandle,t.toLowerCase())?r(e,t,!h):undefined;return o===undefined?n.attributes||!h?e.getAttribute(t):(o=e.getAttributeNode(t))&&o.specified?o.value:null:o},ot.error=function(e){throw Error("Syntax error, unrecognized expression: "+e)},ot.uniqueSort=function(e){var t,r=[],i=0,o=0;if(E=!n.detectDuplicates,l=!n.sortStable&&e.slice(0),e.sort(S),E){while(t=e[o++])t===e[o]&&(i=r.push(o));while(i--)e.splice(r[i],1)}return e},o=ot.getText=function(e){var t,n="",r=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)n+=o(e)}else if(3===i||4===i)return e.nodeValue}else for(;t=e[r];r++)n+=o(t);return n},i=ot.selectors={cacheLength:50,createPseudo:at,match:J,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(nt,rt),e[3]=(e[4]||e[5]||"").replace(nt,rt),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||ot.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&ot.error(e[0]),e},PSEUDO:function(e){var t,n=!e[5]&&e[2];return J.CHILD.test(e[0])?null:(e[3]&&e[4]!==undefined?e[2]=e[4]:n&&V.test(n)&&(t=gt(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(nt,rt).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=C[e+" "];return t||(t=RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&C(e,function(e){return t.test("string"==typeof e.className&&e.className||typeof e.getAttribute!==j&&e.getAttribute("class")||"")})},ATTR:function(e,t,n){return function(r){var i=ot.attr(r,e);return null==i?"!="===t:t?(i+="","="===t?i===n:"!="===t?i!==n:"^="===t?n&&0===i.indexOf(n):"*="===t?n&&i.indexOf(n)>-1:"$="===t?n&&i.slice(-n.length)===n:"~="===t?(" "+i+" ").indexOf(n)>-1:"|="===t?i===n||i.slice(0,n.length+1)===n+"-":!1):!0}},CHILD:function(e,t,n,r,i){var o="nth"!==e.slice(0,3),s="last"!==e.slice(-4),a="of-type"===t;return 1===r&&0===i?function(e){return!!e.parentNode}:function(t,n,u){var l,c,p,f,h,d,g=o!==s?"nextSibling":"previousSibling",m=t.parentNode,y=a&&t.nodeName.toLowerCase(),x=!u&&!a;if(m){if(o){while(g){p=t;while(p=p[g])if(a?p.nodeName.toLowerCase()===y:1===p.nodeType)return!1;d=g="only"===e&&!d&&"nextSibling"}return!0}if(d=[s?m.firstChild:m.lastChild],s&&x){c=m[v]||(m[v]={}),l=c[e]||[],h=l[0]===w&&l[1],f=l[0]===w&&l[2],p=h&&m.childNodes[h];while(p=++h&&p&&p[g]||(f=h=0)||d.pop())if(1===p.nodeType&&++f&&p===t){c[e]=[w,h,f];break}}else if(x&&(l=(t[v]||(t[v]={}))[e])&&l[0]===w)f=l[1];else while(p=++h&&p&&p[g]||(f=h=0)||d.pop())if((a?p.nodeName.toLowerCase()===y:1===p.nodeType)&&++f&&(x&&((p[v]||(p[v]={}))[e]=[w,f]),p===t))break;return f-=i,f===r||0===f%r&&f/r>=0}}},PSEUDO:function(e,t){var n,r=i.pseudos[e]||i.setFilters[e.toLowerCase()]||ot.error("unsupported pseudo: "+e);return r[v]?r(t):r.length>1?(n=[e,e,"",t],i.setFilters.hasOwnProperty(e.toLowerCase())?at(function(e,n){var i,o=r(e,t),s=o.length;while(s--)i=P.call(e,o[s]),e[i]=!(n[i]=o[s])}):function(e){return r(e,0,n)}):r}},pseudos:{not:at(function(e){var t=[],n=[],r=a(e.replace(z,"$1"));return r[v]?at(function(e,t,n,i){var o,s=r(e,null,i,[]),a=e.length;while(a--)(o=s[a])&&(e[a]=!(t[a]=o))}):function(e,i,o){return t[0]=e,r(t,null,o,n),!n.pop()}}),has:at(function(e){return function(t){return ot(e,t).length>0}}),contains:at(function(e){return function(t){return(t.textContent||t.innerText||o(t)).indexOf(e)>-1}}),lang:at(function(e){return G.test(e||"")||ot.error("unsupported lang: "+e),e=e.replace(nt,rt).toLowerCase(),function(t){var n;do if(n=h?t.lang:t.getAttribute("xml:lang")||t.getAttribute("lang"))return n=n.toLowerCase(),n===e||0===n.indexOf(e+"-");while((t=t.parentNode)&&1===t.nodeType);return!1}}),target:function(t){var n=e.location&&e.location.hash;return n&&n.slice(1)===t.id},root:function(e){return e===f},focus:function(e){return e===p.activeElement&&(!p.hasFocus||p.hasFocus())&&!!(e.type||e.href||~e.tabIndex)},enabled:function(e){return e.disabled===!1},disabled:function(e){return e.disabled===!0},checked:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&!!e.checked||"option"===t&&!!e.selected},selected:function(e){return e.parentNode&&e.parentNode.selectedIndex,e.selected===!0},empty:function(e){for(e=e.firstChild;e;e=e.nextSibling)if(e.nodeName>"@"||3===e.nodeType||4===e.nodeType)return!1;return!0},parent:function(e){return!i.pseudos.empty(e)},header:function(e){return et.test(e.nodeName)},input:function(e){return Z.test(e.nodeName)},button:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&"button"===e.type||"button"===t},text:function(e){var t;return"input"===e.nodeName.toLowerCase()&&"text"===e.type&&(null==(t=e.getAttribute("type"))||t.toLowerCase()===e.type)},first:ht(function(){return[0]}),last:ht(function(e,t){return[t-1]}),eq:ht(function(e,t,n){return[0>n?n+t:n]}),even:ht(function(e,t){var n=0;for(;t>n;n+=2)e.push(n);return e}),odd:ht(function(e,t){var n=1;for(;t>n;n+=2)e.push(n);return e}),lt:ht(function(e,t,n){var r=0>n?n+t:n;for(;--r>=0;)e.push(r);return e}),gt:ht(function(e,t,n){var r=0>n?n+t:n;for(;t>++r;)e.push(r);return e})}},i.pseudos.nth=i.pseudos.eq;for(t in{radio:!0,checkbox:!0,file:!0,password:!0,image:!0})i.pseudos[t]=pt(t);for(t in{submit:!0,reset:!0})i.pseudos[t]=ft(t);function dt(){}dt.prototype=i.filters=i.pseudos,i.setFilters=new dt;function gt(e,t){var n,r,o,s,a,u,l,c=k[e+" "];if(c)return t?0:c.slice(0);a=e,u=[],l=i.preFilter;while(a){(!n||(r=_.exec(a)))&&(r&&(a=a.slice(r[0].length)||a),u.push(o=[])),n=!1,(r=X.exec(a))&&(n=r.shift(),o.push({value:n,type:r[0].replace(z," ")}),a=a.slice(n.length));for(s in i.filter)!(r=J[s].exec(a))||l[s]&&!(r=l[s](r))||(n=r.shift(),o.push({value:n,type:s,matches:r}),a=a.slice(n.length));if(!n)break}return t?a.length:a?ot.error(e):k(e,u).slice(0)}function mt(e){var t=0,n=e.length,r="";for(;n>t;t++)r+=e[t].value;return r}function yt(e,t,n){var i=t.dir,o=n&&"parentNode"===i,s=T++;return t.first?function(t,n,r){while(t=t[i])if(1===t.nodeType||o)return e(t,n,r)}:function(t,n,a){var u,l,c,p=w+" "+s;if(a){while(t=t[i])if((1===t.nodeType||o)&&e(t,n,a))return!0}else while(t=t[i])if(1===t.nodeType||o)if(c=t[v]||(t[v]={}),(l=c[i])&&l[0]===p){if((u=l[1])===!0||u===r)return u===!0}else if(l=c[i]=[p],l[1]=e(t,n,a)||r,l[1]===!0)return!0}}function vt(e){return e.length>1?function(t,n,r){var i=e.length;while(i--)if(!e[i](t,n,r))return!1;return!0}:e[0]}function xt(e,t,n,r,i){var o,s=[],a=0,u=e.length,l=null!=t;for(;u>a;a++)(o=e[a])&&(!n||n(o,r,i))&&(s.push(o),l&&t.push(a));return s}function bt(e,t,n,r,i,o){return r&&!r[v]&&(r=bt(r)),i&&!i[v]&&(i=bt(i,o)),at(function(o,s,a,u){var l,c,p,f=[],h=[],d=s.length,g=o||Ct(t||"*",a.nodeType?[a]:a,[]),m=!e||!o&&t?g:xt(g,f,e,a,u),y=n?i||(o?e:d||r)?[]:s:m;if(n&&n(m,y,a,u),r){l=xt(y,h),r(l,[],a,u),c=l.length;while(c--)(p=l[c])&&(y[h[c]]=!(m[h[c]]=p))}if(o){if(i||e){if(i){l=[],c=y.length;while(c--)(p=y[c])&&l.push(m[c]=p);i(null,y=[],l,u)}c=y.length;while(c--)(p=y[c])&&(l=i?P.call(o,p):f[c])>-1&&(o[l]=!(s[l]=p))}}else y=xt(y===s?y.splice(d,y.length):y),i?i(null,s,y,u):O.apply(s,y)})}function wt(e){var t,n,r,o=e.length,s=i.relative[e[0].type],a=s||i.relative[" "],l=s?1:0,c=yt(function(e){return e===t},a,!0),p=yt(function(e){return P.call(t,e)>-1},a,!0),f=[function(e,n,r){return!s&&(r||n!==u)||((t=n).nodeType?c(e,n,r):p(e,n,r))}];for(;o>l;l++)if(n=i.relative[e[l].type])f=[yt(vt(f),n)];else{if(n=i.filter[e[l].type].apply(null,e[l].matches),n[v]){for(r=++l;o>r;r++)if(i.relative[e[r].type])break;return bt(l>1&&vt(f),l>1&&mt(e.slice(0,l-1).concat({value:" "===e[l-2].type?"*":""})).replace(z,"$1"),n,r>l&&wt(e.slice(l,r)),o>r&&wt(e=e.slice(r)),o>r&&mt(e))}f.push(n)}return vt(f)}function Tt(e,t){var n=0,o=t.length>0,s=e.length>0,a=function(a,l,c,f,h){var d,g,m,y=[],v=0,x="0",b=a&&[],T=null!=h,C=u,k=a||s&&i.find.TAG("*",h&&l.parentNode||l),N=w+=null==C?1:Math.random()||.1;for(T&&(u=l!==p&&l,r=n);null!=(d=k[x]);x++){if(s&&d){g=0;while(m=e[g++])if(m(d,l,c)){f.push(d);break}T&&(w=N,r=++n)}o&&((d=!m&&d)&&v--,a&&b.push(d))}if(v+=x,o&&x!==v){g=0;while(m=t[g++])m(b,y,l,c);if(a){if(v>0)while(x--)b[x]||y[x]||(y[x]=q.call(f));y=xt(y)}O.apply(f,y),T&&!a&&y.length>0&&v+t.length>1&&ot.uniqueSort(f)}return T&&(w=N,u=C),b};return o?at(a):a}a=ot.compile=function(e,t){var n,r=[],i=[],o=N[e+" "];if(!o){t||(t=gt(e)),n=t.length;while(n--)o=wt(t[n]),o[v]?r.push(o):i.push(o);o=N(e,Tt(i,r))}return o};function Ct(e,t,n){var r=0,i=t.length;for(;i>r;r++)ot(e,t[r],n);return n}function kt(e,t,r,o){var s,u,l,c,p,f=gt(e);if(!o&&1===f.length){if(u=f[0]=f[0].slice(0),u.length>2&&"ID"===(l=u[0]).type&&n.getById&&9===t.nodeType&&h&&i.relative[u[1].type]){if(t=(i.find.ID(l.matches[0].replace(nt,rt),t)||[])[0],!t)return r;e=e.slice(u.shift().value.length)}s=J.needsContext.test(e)?0:u.length;while(s--){if(l=u[s],i.relative[c=l.type])break;if((p=i.find[c])&&(o=p(l.matches[0].replace(nt,rt),U.test(u[0].type)&&t.parentNode||t))){if(u.splice(s,1),e=o.length&&mt(u),!e)return O.apply(r,o),r;break}}}return a(e,f)(o,t,!h,r,U.test(e)),r}n.sortStable=v.split("").sort(S).join("")===v,n.detectDuplicates=E,c(),n.sortDetached=ut(function(e){return 1&e.compareDocumentPosition(p.createElement("div"))}),ut(function(e){return e.innerHTML="","#"===e.firstChild.getAttribute("href")})||lt("type|href|height|width",function(e,t,n){return n?undefined:e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),n.attributes&&ut(function(e){return e.innerHTML="",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||lt("value",function(e,t,n){return n||"input"!==e.nodeName.toLowerCase()?undefined:e.defaultValue}),ut(function(e){return null==e.getAttribute("disabled")})||lt(R,function(e,t,n){var r;return n?undefined:(r=e.getAttributeNode(t))&&r.specified?r.value:e[t]===!0?t.toLowerCase():null}),x.find=ot,x.expr=ot.selectors,x.expr[":"]=x.expr.pseudos,x.unique=ot.uniqueSort,x.text=ot.getText,x.isXMLDoc=ot.isXML,x.contains=ot.contains}(e);var D={};function A(e){var t=D[e]={};return x.each(e.match(w)||[],function(e,n){t[n]=!0}),t}x.Callbacks=function(e){e="string"==typeof e?D[e]||A(e):x.extend({},e);var t,n,r,i,o,s,a=[],u=!e.once&&[],l=function(p){for(t=e.memory&&p,n=!0,s=i||0,i=0,o=a.length,r=!0;a&&o>s;s++)if(a[s].apply(p[0],p[1])===!1&&e.stopOnFalse){t=!1;break}r=!1,a&&(u?u.length&&l(u.shift()):t?a=[]:c.disable())},c={add:function(){if(a){var n=a.length;(function s(t){x.each(t,function(t,n){var r=x.type(n);"function"===r?e.unique&&c.has(n)||a.push(n):n&&n.length&&"string"!==r&&s(n)})})(arguments),r?o=a.length:t&&(i=n,l(t))}return this},remove:function(){return a&&x.each(arguments,function(e,t){var n;while((n=x.inArray(t,a,n))>-1)a.splice(n,1),r&&(o>=n&&o--,s>=n&&s--)}),this},has:function(e){return e?x.inArray(e,a)>-1:!(!a||!a.length)},empty:function(){return a=[],o=0,this},disable:function(){return a=u=t=undefined,this},disabled:function(){return!a},lock:function(){return u=undefined,t||c.disable(),this},locked:function(){return!u},fireWith:function(e,t){return!a||n&&!u||(t=t||[],t=[e,t.slice?t.slice():t],r?u.push(t):l(t)),this},fire:function(){return c.fireWith(this,arguments),this},fired:function(){return!!n}};return c},x.extend({Deferred:function(e){var t=[["resolve","done",x.Callbacks("once memory"),"resolved"],["reject","fail",x.Callbacks("once memory"),"rejected"],["notify","progress",x.Callbacks("memory")]],n="pending",r={state:function(){return n},always:function(){return i.done(arguments).fail(arguments),this},then:function(){var e=arguments;return x.Deferred(function(n){x.each(t,function(t,o){var s=o[0],a=x.isFunction(e[t])&&e[t];i[o[1]](function(){var e=a&&a.apply(this,arguments);e&&x.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[s+"With"](this===r?n.promise():this,a?[e]:arguments)})}),e=null}).promise()},promise:function(e){return null!=e?x.extend(e,r):r}},i={};return r.pipe=r.then,x.each(t,function(e,o){var s=o[2],a=o[3];r[o[1]]=s.add,a&&s.add(function(){n=a},t[1^e][2].disable,t[2][2].lock),i[o[0]]=function(){return i[o[0]+"With"](this===i?r:this,arguments),this},i[o[0]+"With"]=s.fireWith}),r.promise(i),e&&e.call(i,i),i},when:function(e){var t=0,n=d.call(arguments),r=n.length,i=1!==r||e&&x.isFunction(e.promise)?r:0,o=1===i?e:x.Deferred(),s=function(e,t,n){return function(r){t[e]=this,n[e]=arguments.length>1?d.call(arguments):r,n===a?o.notifyWith(t,n):--i||o.resolveWith(t,n)}},a,u,l;if(r>1)for(a=Array(r),u=Array(r),l=Array(r);r>t;t++)n[t]&&x.isFunction(n[t].promise)?n[t].promise().done(s(t,l,n)).fail(o.reject).progress(s(t,u,a)):--i;return i||o.resolveWith(l,n),o.promise()}}),x.support=function(t){var n=o.createElement("input"),r=o.createDocumentFragment(),i=o.createElement("div"),s=o.createElement("select"),a=s.appendChild(o.createElement("option"));return n.type?(n.type="checkbox",t.checkOn=""!==n.value,t.optSelected=a.selected,t.reliableMarginRight=!0,t.boxSizingReliable=!0,t.pixelPosition=!1,n.checked=!0,t.noCloneChecked=n.cloneNode(!0).checked,s.disabled=!0,t.optDisabled=!a.disabled,n=o.createElement("input"),n.value="t",n.type="radio",t.radioValue="t"===n.value,n.setAttribute("checked","t"),n.setAttribute("name","t"),r.appendChild(n),t.checkClone=r.cloneNode(!0).cloneNode(!0).lastChild.checked,t.focusinBubbles="onfocusin"in e,i.style.backgroundClip="content-box",i.cloneNode(!0).style.backgroundClip="",t.clearCloneStyle="content-box"===i.style.backgroundClip,x(function(){var n,r,s="padding:0;margin:0;border:0;display:block;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box",a=o.getElementsByTagName("body")[0];a&&(n=o.createElement("div"),n.style.cssText="border:0;width:0;height:0;position:absolute;top:0;left:-9999px;margin-top:1px",a.appendChild(n).appendChild(i),i.innerHTML="",i.style.cssText="-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:1px;border:1px;display:block;width:4px;margin-top:1%;position:absolute;top:1%",x.swap(a,null!=a.style.zoom?{zoom:1}:{},function(){t.boxSizing=4===i.offsetWidth}),e.getComputedStyle&&(t.pixelPosition="1%"!==(e.getComputedStyle(i,null)||{}).top,t.boxSizingReliable="4px"===(e.getComputedStyle(i,null)||{width:"4px"}).width,r=i.appendChild(o.createElement("div")),r.style.cssText=i.style.cssText=s,r.style.marginRight=r.style.width="0",i.style.width="1px",t.reliableMarginRight=!parseFloat((e.getComputedStyle(r,null)||{}).marginRight)),a.removeChild(n))}),t):t}({});var L,q,H=/(?:\{[\s\S]*\}|\[[\s\S]*\])$/,O=/([A-Z])/g;function F(){Object.defineProperty(this.cache={},0,{get:function(){return{}}}),this.expando=x.expando+Math.random()}F.uid=1,F.accepts=function(e){return e.nodeType?1===e.nodeType||9===e.nodeType:!0},F.prototype={key:function(e){if(!F.accepts(e))return 0;var t={},n=e[this.expando];if(!n){n=F.uid++;try{t[this.expando]={value:n},Object.defineProperties(e,t)}catch(r){t[this.expando]=n,x.extend(e,t)}}return this.cache[n]||(this.cache[n]={}),n},set:function(e,t,n){var r,i=this.key(e),o=this.cache[i];if("string"==typeof t)o[t]=n;else if(x.isEmptyObject(o))x.extend(this.cache[i],t);else for(r in t)o[r]=t[r];return o},get:function(e,t){var n=this.cache[this.key(e)];return t===undefined?n:n[t]},access:function(e,t,n){var r;return t===undefined||t&&"string"==typeof t&&n===undefined?(r=this.get(e,t),r!==undefined?r:this.get(e,x.camelCase(t))):(this.set(e,t,n),n!==undefined?n:t)},remove:function(e,t){var n,r,i,o=this.key(e),s=this.cache[o];if(t===undefined)this.cache[o]={};else{x.isArray(t)?r=t.concat(t.map(x.camelCase)):(i=x.camelCase(t),t in s?r=[t,i]:(r=i,r=r in s?[r]:r.match(w)||[])),n=r.length;while(n--)delete s[r[n]]}},hasData:function(e){return!x.isEmptyObject(this.cache[e[this.expando]]||{})},discard:function(e){e[this.expando]&&delete this.cache[e[this.expando]]}},L=new F,q=new F,x.extend({acceptData:F.accepts,hasData:function(e){return L.hasData(e)||q.hasData(e)},data:function(e,t,n){return L.access(e,t,n)},removeData:function(e,t){L.remove(e,t)},_data:function(e,t,n){return q.access(e,t,n)},_removeData:function(e,t){q.remove(e,t)}}),x.fn.extend({data:function(e,t){var n,r,i=this[0],o=0,s=null;if(e===undefined){if(this.length&&(s=L.get(i),1===i.nodeType&&!q.get(i,"hasDataAttrs"))){for(n=i.attributes;n.length>o;o++)r=n[o].name,0===r.indexOf("data-")&&(r=x.camelCase(r.slice(5)),P(i,r,s[r]));q.set(i,"hasDataAttrs",!0)}return s}return"object"==typeof e?this.each(function(){L.set(this,e)}):x.access(this,function(t){var n,r=x.camelCase(e);if(i&&t===undefined){if(n=L.get(i,e),n!==undefined)return n;if(n=L.get(i,r),n!==undefined)return n;if(n=P(i,r,undefined),n!==undefined)return n}else this.each(function(){var n=L.get(this,r);L.set(this,r,t),-1!==e.indexOf("-")&&n!==undefined&&L.set(this,e,t)})},null,t,arguments.length>1,null,!0)},removeData:function(e){return this.each(function(){L.remove(this,e)})}});function P(e,t,n){var r;if(n===undefined&&1===e.nodeType)if(r="data-"+t.replace(O,"-$1").toLowerCase(),n=e.getAttribute(r),"string"==typeof n){try{n="true"===n?!0:"false"===n?!1:"null"===n?null:+n+""===n?+n:H.test(n)?JSON.parse(n):n}catch(i){}L.set(e,t,n)}else n=undefined;return n}x.extend({queue:function(e,t,n){var r;return e?(t=(t||"fx")+"queue",r=q.get(e,t),n&&(!r||x.isArray(n)?r=q.access(e,t,x.makeArray(n)):r.push(n)),r||[]):undefined},dequeue:function(e,t){t=t||"fx";var n=x.queue(e,t),r=n.length,i=n.shift(),o=x._queueHooks(e,t),s=function(){x.dequeue(e,t) +};"inprogress"===i&&(i=n.shift(),r--),i&&("fx"===t&&n.unshift("inprogress"),delete o.stop,i.call(e,s,o)),!r&&o&&o.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return q.get(e,n)||q.access(e,n,{empty:x.Callbacks("once memory").add(function(){q.remove(e,[t+"queue",n])})})}}),x.fn.extend({queue:function(e,t){var n=2;return"string"!=typeof e&&(t=e,e="fx",n--),n>arguments.length?x.queue(this[0],e):t===undefined?this:this.each(function(){var n=x.queue(this,e,t);x._queueHooks(this,e),"fx"===e&&"inprogress"!==n[0]&&x.dequeue(this,e)})},dequeue:function(e){return this.each(function(){x.dequeue(this,e)})},delay:function(e,t){return e=x.fx?x.fx.speeds[e]||e:e,t=t||"fx",this.queue(t,function(t,n){var r=setTimeout(t,e);n.stop=function(){clearTimeout(r)}})},clearQueue:function(e){return this.queue(e||"fx",[])},promise:function(e,t){var n,r=1,i=x.Deferred(),o=this,s=this.length,a=function(){--r||i.resolveWith(o,[o])};"string"!=typeof e&&(t=e,e=undefined),e=e||"fx";while(s--)n=q.get(o[s],e+"queueHooks"),n&&n.empty&&(r++,n.empty.add(a));return a(),i.promise(t)}});var R,M,W=/[\t\r\n\f]/g,$=/\r/g,B=/^(?:input|select|textarea|button)$/i;x.fn.extend({attr:function(e,t){return x.access(this,x.attr,e,t,arguments.length>1)},removeAttr:function(e){return this.each(function(){x.removeAttr(this,e)})},prop:function(e,t){return x.access(this,x.prop,e,t,arguments.length>1)},removeProp:function(e){return this.each(function(){delete this[x.propFix[e]||e]})},addClass:function(e){var t,n,r,i,o,s=0,a=this.length,u="string"==typeof e&&e;if(x.isFunction(e))return this.each(function(t){x(this).addClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(w)||[];a>s;s++)if(n=this[s],r=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(W," "):" ")){o=0;while(i=t[o++])0>r.indexOf(" "+i+" ")&&(r+=i+" ");n.className=x.trim(r)}return this},removeClass:function(e){var t,n,r,i,o,s=0,a=this.length,u=0===arguments.length||"string"==typeof e&&e;if(x.isFunction(e))return this.each(function(t){x(this).removeClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(w)||[];a>s;s++)if(n=this[s],r=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(W," "):"")){o=0;while(i=t[o++])while(r.indexOf(" "+i+" ")>=0)r=r.replace(" "+i+" "," ");n.className=e?x.trim(r):""}return this},toggleClass:function(e,t){var n=typeof e;return"boolean"==typeof t&&"string"===n?t?this.addClass(e):this.removeClass(e):x.isFunction(e)?this.each(function(n){x(this).toggleClass(e.call(this,n,this.className,t),t)}):this.each(function(){if("string"===n){var t,i=0,o=x(this),s=e.match(w)||[];while(t=s[i++])o.hasClass(t)?o.removeClass(t):o.addClass(t)}else(n===r||"boolean"===n)&&(this.className&&q.set(this,"__className__",this.className),this.className=this.className||e===!1?"":q.get(this,"__className__")||"")})},hasClass:function(e){var t=" "+e+" ",n=0,r=this.length;for(;r>n;n++)if(1===this[n].nodeType&&(" "+this[n].className+" ").replace(W," ").indexOf(t)>=0)return!0;return!1},val:function(e){var t,n,r,i=this[0];{if(arguments.length)return r=x.isFunction(e),this.each(function(n){var i;1===this.nodeType&&(i=r?e.call(this,n,x(this).val()):e,null==i?i="":"number"==typeof i?i+="":x.isArray(i)&&(i=x.map(i,function(e){return null==e?"":e+""})),t=x.valHooks[this.type]||x.valHooks[this.nodeName.toLowerCase()],t&&"set"in t&&t.set(this,i,"value")!==undefined||(this.value=i))});if(i)return t=x.valHooks[i.type]||x.valHooks[i.nodeName.toLowerCase()],t&&"get"in t&&(n=t.get(i,"value"))!==undefined?n:(n=i.value,"string"==typeof n?n.replace($,""):null==n?"":n)}}}),x.extend({valHooks:{option:{get:function(e){var t=e.attributes.value;return!t||t.specified?e.value:e.text}},select:{get:function(e){var t,n,r=e.options,i=e.selectedIndex,o="select-one"===e.type||0>i,s=o?null:[],a=o?i+1:r.length,u=0>i?a:o?i:0;for(;a>u;u++)if(n=r[u],!(!n.selected&&u!==i||(x.support.optDisabled?n.disabled:null!==n.getAttribute("disabled"))||n.parentNode.disabled&&x.nodeName(n.parentNode,"optgroup"))){if(t=x(n).val(),o)return t;s.push(t)}return s},set:function(e,t){var n,r,i=e.options,o=x.makeArray(t),s=i.length;while(s--)r=i[s],(r.selected=x.inArray(x(r).val(),o)>=0)&&(n=!0);return n||(e.selectedIndex=-1),o}}},attr:function(e,t,n){var i,o,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return typeof e.getAttribute===r?x.prop(e,t,n):(1===s&&x.isXMLDoc(e)||(t=t.toLowerCase(),i=x.attrHooks[t]||(x.expr.match.bool.test(t)?M:R)),n===undefined?i&&"get"in i&&null!==(o=i.get(e,t))?o:(o=x.find.attr(e,t),null==o?undefined:o):null!==n?i&&"set"in i&&(o=i.set(e,n,t))!==undefined?o:(e.setAttribute(t,n+""),n):(x.removeAttr(e,t),undefined))},removeAttr:function(e,t){var n,r,i=0,o=t&&t.match(w);if(o&&1===e.nodeType)while(n=o[i++])r=x.propFix[n]||n,x.expr.match.bool.test(n)&&(e[r]=!1),e.removeAttribute(n)},attrHooks:{type:{set:function(e,t){if(!x.support.radioValue&&"radio"===t&&x.nodeName(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}},propFix:{"for":"htmlFor","class":"className"},prop:function(e,t,n){var r,i,o,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return o=1!==s||!x.isXMLDoc(e),o&&(t=x.propFix[t]||t,i=x.propHooks[t]),n!==undefined?i&&"set"in i&&(r=i.set(e,n,t))!==undefined?r:e[t]=n:i&&"get"in i&&null!==(r=i.get(e,t))?r:e[t]},propHooks:{tabIndex:{get:function(e){return e.hasAttribute("tabindex")||B.test(e.nodeName)||e.href?e.tabIndex:-1}}}}),M={set:function(e,t,n){return t===!1?x.removeAttr(e,n):e.setAttribute(n,n),n}},x.each(x.expr.match.bool.source.match(/\w+/g),function(e,t){var n=x.expr.attrHandle[t]||x.find.attr;x.expr.attrHandle[t]=function(e,t,r){var i=x.expr.attrHandle[t],o=r?undefined:(x.expr.attrHandle[t]=undefined)!=n(e,t,r)?t.toLowerCase():null;return x.expr.attrHandle[t]=i,o}}),x.support.optSelected||(x.propHooks.selected={get:function(e){var t=e.parentNode;return t&&t.parentNode&&t.parentNode.selectedIndex,null}}),x.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){x.propFix[this.toLowerCase()]=this}),x.each(["radio","checkbox"],function(){x.valHooks[this]={set:function(e,t){return x.isArray(t)?e.checked=x.inArray(x(e).val(),t)>=0:undefined}},x.support.checkOn||(x.valHooks[this].get=function(e){return null===e.getAttribute("value")?"on":e.value})});var I=/^key/,z=/^(?:mouse|contextmenu)|click/,_=/^(?:focusinfocus|focusoutblur)$/,X=/^([^.]*)(?:\.(.+)|)$/;function U(){return!0}function Y(){return!1}function V(){try{return o.activeElement}catch(e){}}x.event={global:{},add:function(e,t,n,i,o){var s,a,u,l,c,p,f,h,d,g,m,y=q.get(e);if(y){n.handler&&(s=n,n=s.handler,o=s.selector),n.guid||(n.guid=x.guid++),(l=y.events)||(l=y.events={}),(a=y.handle)||(a=y.handle=function(e){return typeof x===r||e&&x.event.triggered===e.type?undefined:x.event.dispatch.apply(a.elem,arguments)},a.elem=e),t=(t||"").match(w)||[""],c=t.length;while(c--)u=X.exec(t[c])||[],d=m=u[1],g=(u[2]||"").split(".").sort(),d&&(f=x.event.special[d]||{},d=(o?f.delegateType:f.bindType)||d,f=x.event.special[d]||{},p=x.extend({type:d,origType:m,data:i,handler:n,guid:n.guid,selector:o,needsContext:o&&x.expr.match.needsContext.test(o),namespace:g.join(".")},s),(h=l[d])||(h=l[d]=[],h.delegateCount=0,f.setup&&f.setup.call(e,i,g,a)!==!1||e.addEventListener&&e.addEventListener(d,a,!1)),f.add&&(f.add.call(e,p),p.handler.guid||(p.handler.guid=n.guid)),o?h.splice(h.delegateCount++,0,p):h.push(p),x.event.global[d]=!0);e=null}},remove:function(e,t,n,r,i){var o,s,a,u,l,c,p,f,h,d,g,m=q.hasData(e)&&q.get(e);if(m&&(u=m.events)){t=(t||"").match(w)||[""],l=t.length;while(l--)if(a=X.exec(t[l])||[],h=g=a[1],d=(a[2]||"").split(".").sort(),h){p=x.event.special[h]||{},h=(r?p.delegateType:p.bindType)||h,f=u[h]||[],a=a[2]&&RegExp("(^|\\.)"+d.join("\\.(?:.*\\.|)")+"(\\.|$)"),s=o=f.length;while(o--)c=f[o],!i&&g!==c.origType||n&&n.guid!==c.guid||a&&!a.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(f.splice(o,1),c.selector&&f.delegateCount--,p.remove&&p.remove.call(e,c));s&&!f.length&&(p.teardown&&p.teardown.call(e,d,m.handle)!==!1||x.removeEvent(e,h,m.handle),delete u[h])}else for(h in u)x.event.remove(e,h+t[l],n,r,!0);x.isEmptyObject(u)&&(delete m.handle,q.remove(e,"events"))}},trigger:function(t,n,r,i){var s,a,u,l,c,p,f,h=[r||o],d=y.call(t,"type")?t.type:t,g=y.call(t,"namespace")?t.namespace.split("."):[];if(a=u=r=r||o,3!==r.nodeType&&8!==r.nodeType&&!_.test(d+x.event.triggered)&&(d.indexOf(".")>=0&&(g=d.split("."),d=g.shift(),g.sort()),c=0>d.indexOf(":")&&"on"+d,t=t[x.expando]?t:new x.Event(d,"object"==typeof t&&t),t.isTrigger=i?2:3,t.namespace=g.join("."),t.namespace_re=t.namespace?RegExp("(^|\\.)"+g.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,t.result=undefined,t.target||(t.target=r),n=null==n?[t]:x.makeArray(n,[t]),f=x.event.special[d]||{},i||!f.trigger||f.trigger.apply(r,n)!==!1)){if(!i&&!f.noBubble&&!x.isWindow(r)){for(l=f.delegateType||d,_.test(l+d)||(a=a.parentNode);a;a=a.parentNode)h.push(a),u=a;u===(r.ownerDocument||o)&&h.push(u.defaultView||u.parentWindow||e)}s=0;while((a=h[s++])&&!t.isPropagationStopped())t.type=s>1?l:f.bindType||d,p=(q.get(a,"events")||{})[t.type]&&q.get(a,"handle"),p&&p.apply(a,n),p=c&&a[c],p&&x.acceptData(a)&&p.apply&&p.apply(a,n)===!1&&t.preventDefault();return t.type=d,i||t.isDefaultPrevented()||f._default&&f._default.apply(h.pop(),n)!==!1||!x.acceptData(r)||c&&x.isFunction(r[d])&&!x.isWindow(r)&&(u=r[c],u&&(r[c]=null),x.event.triggered=d,r[d](),x.event.triggered=undefined,u&&(r[c]=u)),t.result}},dispatch:function(e){e=x.event.fix(e);var t,n,r,i,o,s=[],a=d.call(arguments),u=(q.get(this,"events")||{})[e.type]||[],l=x.event.special[e.type]||{};if(a[0]=e,e.delegateTarget=this,!l.preDispatch||l.preDispatch.call(this,e)!==!1){s=x.event.handlers.call(this,e,u),t=0;while((i=s[t++])&&!e.isPropagationStopped()){e.currentTarget=i.elem,n=0;while((o=i.handlers[n++])&&!e.isImmediatePropagationStopped())(!e.namespace_re||e.namespace_re.test(o.namespace))&&(e.handleObj=o,e.data=o.data,r=((x.event.special[o.origType]||{}).handle||o.handler).apply(i.elem,a),r!==undefined&&(e.result=r)===!1&&(e.preventDefault(),e.stopPropagation()))}return l.postDispatch&&l.postDispatch.call(this,e),e.result}},handlers:function(e,t){var n,r,i,o,s=[],a=t.delegateCount,u=e.target;if(a&&u.nodeType&&(!e.button||"click"!==e.type))for(;u!==this;u=u.parentNode||this)if(u.disabled!==!0||"click"!==e.type){for(r=[],n=0;a>n;n++)o=t[n],i=o.selector+" ",r[i]===undefined&&(r[i]=o.needsContext?x(i,this).index(u)>=0:x.find(i,this,null,[u]).length),r[i]&&r.push(o);r.length&&s.push({elem:u,handlers:r})}return t.length>a&&s.push({elem:this,handlers:t.slice(a)}),s},props:"altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "),fixHooks:{},keyHooks:{props:"char charCode key keyCode".split(" "),filter:function(e,t){return null==e.which&&(e.which=null!=t.charCode?t.charCode:t.keyCode),e}},mouseHooks:{props:"button buttons clientX clientY offsetX offsetY pageX pageY screenX screenY toElement".split(" "),filter:function(e,t){var n,r,i,s=t.button;return null==e.pageX&&null!=t.clientX&&(n=e.target.ownerDocument||o,r=n.documentElement,i=n.body,e.pageX=t.clientX+(r&&r.scrollLeft||i&&i.scrollLeft||0)-(r&&r.clientLeft||i&&i.clientLeft||0),e.pageY=t.clientY+(r&&r.scrollTop||i&&i.scrollTop||0)-(r&&r.clientTop||i&&i.clientTop||0)),e.which||s===undefined||(e.which=1&s?1:2&s?3:4&s?2:0),e}},fix:function(e){if(e[x.expando])return e;var t,n,r,i=e.type,s=e,a=this.fixHooks[i];a||(this.fixHooks[i]=a=z.test(i)?this.mouseHooks:I.test(i)?this.keyHooks:{}),r=a.props?this.props.concat(a.props):this.props,e=new x.Event(s),t=r.length;while(t--)n=r[t],e[n]=s[n];return e.target||(e.target=o),3===e.target.nodeType&&(e.target=e.target.parentNode),a.filter?a.filter(e,s):e},special:{load:{noBubble:!0},focus:{trigger:function(){return this!==V()&&this.focus?(this.focus(),!1):undefined},delegateType:"focusin"},blur:{trigger:function(){return this===V()&&this.blur?(this.blur(),!1):undefined},delegateType:"focusout"},click:{trigger:function(){return"checkbox"===this.type&&this.click&&x.nodeName(this,"input")?(this.click(),!1):undefined},_default:function(e){return x.nodeName(e.target,"a")}},beforeunload:{postDispatch:function(e){e.result!==undefined&&(e.originalEvent.returnValue=e.result)}}},simulate:function(e,t,n,r){var i=x.extend(new x.Event,n,{type:e,isSimulated:!0,originalEvent:{}});r?x.event.trigger(i,null,t):x.event.dispatch.call(t,i),i.isDefaultPrevented()&&n.preventDefault()}},x.removeEvent=function(e,t,n){e.removeEventListener&&e.removeEventListener(t,n,!1)},x.Event=function(e,t){return this instanceof x.Event?(e&&e.type?(this.originalEvent=e,this.type=e.type,this.isDefaultPrevented=e.defaultPrevented||e.getPreventDefault&&e.getPreventDefault()?U:Y):this.type=e,t&&x.extend(this,t),this.timeStamp=e&&e.timeStamp||x.now(),this[x.expando]=!0,undefined):new x.Event(e,t)},x.Event.prototype={isDefaultPrevented:Y,isPropagationStopped:Y,isImmediatePropagationStopped:Y,preventDefault:function(){var e=this.originalEvent;this.isDefaultPrevented=U,e&&e.preventDefault&&e.preventDefault()},stopPropagation:function(){var e=this.originalEvent;this.isPropagationStopped=U,e&&e.stopPropagation&&e.stopPropagation()},stopImmediatePropagation:function(){this.isImmediatePropagationStopped=U,this.stopPropagation()}},x.each({mouseenter:"mouseover",mouseleave:"mouseout"},function(e,t){x.event.special[e]={delegateType:t,bindType:t,handle:function(e){var n,r=this,i=e.relatedTarget,o=e.handleObj;return(!i||i!==r&&!x.contains(r,i))&&(e.type=o.origType,n=o.handler.apply(this,arguments),e.type=t),n}}}),x.support.focusinBubbles||x.each({focus:"focusin",blur:"focusout"},function(e,t){var n=0,r=function(e){x.event.simulate(t,e.target,x.event.fix(e),!0)};x.event.special[t]={setup:function(){0===n++&&o.addEventListener(e,r,!0)},teardown:function(){0===--n&&o.removeEventListener(e,r,!0)}}}),x.fn.extend({on:function(e,t,n,r,i){var o,s;if("object"==typeof e){"string"!=typeof t&&(n=n||t,t=undefined);for(s in e)this.on(s,t,n,e[s],i);return this}if(null==n&&null==r?(r=t,n=t=undefined):null==r&&("string"==typeof t?(r=n,n=undefined):(r=n,n=t,t=undefined)),r===!1)r=Y;else if(!r)return this;return 1===i&&(o=r,r=function(e){return x().off(e),o.apply(this,arguments)},r.guid=o.guid||(o.guid=x.guid++)),this.each(function(){x.event.add(this,e,r,n,t)})},one:function(e,t,n,r){return this.on(e,t,n,r,1)},off:function(e,t,n){var r,i;if(e&&e.preventDefault&&e.handleObj)return r=e.handleObj,x(e.delegateTarget).off(r.namespace?r.origType+"."+r.namespace:r.origType,r.selector,r.handler),this;if("object"==typeof e){for(i in e)this.off(i,t,e[i]);return this}return(t===!1||"function"==typeof t)&&(n=t,t=undefined),n===!1&&(n=Y),this.each(function(){x.event.remove(this,e,n,t)})},trigger:function(e,t){return this.each(function(){x.event.trigger(e,t,this)})},triggerHandler:function(e,t){var n=this[0];return n?x.event.trigger(e,t,n,!0):undefined}});var G=/^.[^:#\[\.,]*$/,J=/^(?:parents|prev(?:Until|All))/,Q=x.expr.match.needsContext,K={children:!0,contents:!0,next:!0,prev:!0};x.fn.extend({find:function(e){var t,n=[],r=this,i=r.length;if("string"!=typeof e)return this.pushStack(x(e).filter(function(){for(t=0;i>t;t++)if(x.contains(r[t],this))return!0}));for(t=0;i>t;t++)x.find(e,r[t],n);return n=this.pushStack(i>1?x.unique(n):n),n.selector=this.selector?this.selector+" "+e:e,n},has:function(e){var t=x(e,this),n=t.length;return this.filter(function(){var e=0;for(;n>e;e++)if(x.contains(this,t[e]))return!0})},not:function(e){return this.pushStack(et(this,e||[],!0))},filter:function(e){return this.pushStack(et(this,e||[],!1))},is:function(e){return!!et(this,"string"==typeof e&&Q.test(e)?x(e):e||[],!1).length},closest:function(e,t){var n,r=0,i=this.length,o=[],s=Q.test(e)||"string"!=typeof e?x(e,t||this.context):0;for(;i>r;r++)for(n=this[r];n&&n!==t;n=n.parentNode)if(11>n.nodeType&&(s?s.index(n)>-1:1===n.nodeType&&x.find.matchesSelector(n,e))){n=o.push(n);break}return this.pushStack(o.length>1?x.unique(o):o)},index:function(e){return e?"string"==typeof e?g.call(x(e),this[0]):g.call(this,e.jquery?e[0]:e):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){var n="string"==typeof e?x(e,t):x.makeArray(e&&e.nodeType?[e]:e),r=x.merge(this.get(),n);return this.pushStack(x.unique(r))},addBack:function(e){return this.add(null==e?this.prevObject:this.prevObject.filter(e))}});function Z(e,t){while((e=e[t])&&1!==e.nodeType);return e}x.each({parent:function(e){var t=e.parentNode;return t&&11!==t.nodeType?t:null},parents:function(e){return x.dir(e,"parentNode")},parentsUntil:function(e,t,n){return x.dir(e,"parentNode",n)},next:function(e){return Z(e,"nextSibling")},prev:function(e){return Z(e,"previousSibling")},nextAll:function(e){return x.dir(e,"nextSibling")},prevAll:function(e){return x.dir(e,"previousSibling")},nextUntil:function(e,t,n){return x.dir(e,"nextSibling",n)},prevUntil:function(e,t,n){return x.dir(e,"previousSibling",n)},siblings:function(e){return x.sibling((e.parentNode||{}).firstChild,e)},children:function(e){return x.sibling(e.firstChild)},contents:function(e){return e.contentDocument||x.merge([],e.childNodes)}},function(e,t){x.fn[e]=function(n,r){var i=x.map(this,t,n);return"Until"!==e.slice(-5)&&(r=n),r&&"string"==typeof r&&(i=x.filter(r,i)),this.length>1&&(K[e]||x.unique(i),J.test(e)&&i.reverse()),this.pushStack(i)}}),x.extend({filter:function(e,t,n){var r=t[0];return n&&(e=":not("+e+")"),1===t.length&&1===r.nodeType?x.find.matchesSelector(r,e)?[r]:[]:x.find.matches(e,x.grep(t,function(e){return 1===e.nodeType}))},dir:function(e,t,n){var r=[],i=n!==undefined;while((e=e[t])&&9!==e.nodeType)if(1===e.nodeType){if(i&&x(e).is(n))break;r.push(e)}return r},sibling:function(e,t){var n=[];for(;e;e=e.nextSibling)1===e.nodeType&&e!==t&&n.push(e);return n}});function et(e,t,n){if(x.isFunction(t))return x.grep(e,function(e,r){return!!t.call(e,r,e)!==n});if(t.nodeType)return x.grep(e,function(e){return e===t!==n});if("string"==typeof t){if(G.test(t))return x.filter(t,e,n);t=x.filter(t,e)}return x.grep(e,function(e){return g.call(t,e)>=0!==n})}var tt=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/gi,nt=/<([\w:]+)/,rt=/<|&#?\w+;/,it=/<(?:script|style|link)/i,ot=/^(?:checkbox|radio)$/i,st=/checked\s*(?:[^=]|=\s*.checked.)/i,at=/^$|\/(?:java|ecma)script/i,ut=/^true\/(.*)/,lt=/^\s*\s*$/g,ct={option:[1,""],thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};ct.optgroup=ct.option,ct.tbody=ct.tfoot=ct.colgroup=ct.caption=ct.thead,ct.th=ct.td,x.fn.extend({text:function(e){return x.access(this,function(e){return e===undefined?x.text(this):this.empty().append((this[0]&&this[0].ownerDocument||o).createTextNode(e))},null,e,arguments.length)},append:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=pt(this,e);t.appendChild(e)}})},prepend:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=pt(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},remove:function(e,t){var n,r=e?x.filter(e,this):this,i=0;for(;null!=(n=r[i]);i++)t||1!==n.nodeType||x.cleanData(mt(n)),n.parentNode&&(t&&x.contains(n.ownerDocument,n)&&dt(mt(n,"script")),n.parentNode.removeChild(n));return this},empty:function(){var e,t=0;for(;null!=(e=this[t]);t++)1===e.nodeType&&(x.cleanData(mt(e,!1)),e.textContent="");return this},clone:function(e,t){return e=null==e?!1:e,t=null==t?e:t,this.map(function(){return x.clone(this,e,t)})},html:function(e){return x.access(this,function(e){var t=this[0]||{},n=0,r=this.length;if(e===undefined&&1===t.nodeType)return t.innerHTML;if("string"==typeof e&&!it.test(e)&&!ct[(nt.exec(e)||["",""])[1].toLowerCase()]){e=e.replace(tt,"<$1>");try{for(;r>n;n++)t=this[n]||{},1===t.nodeType&&(x.cleanData(mt(t,!1)),t.innerHTML=e);t=0}catch(i){}}t&&this.empty().append(e)},null,e,arguments.length)},replaceWith:function(){var e=x.map(this,function(e){return[e.nextSibling,e.parentNode]}),t=0;return this.domManip(arguments,function(n){var r=e[t++],i=e[t++];i&&(r&&r.parentNode!==i&&(r=this.nextSibling),x(this).remove(),i.insertBefore(n,r))},!0),t?this:this.remove()},detach:function(e){return this.remove(e,!0)},domManip:function(e,t,n){e=f.apply([],e);var r,i,o,s,a,u,l=0,c=this.length,p=this,h=c-1,d=e[0],g=x.isFunction(d);if(g||!(1>=c||"string"!=typeof d||x.support.checkClone)&&st.test(d))return this.each(function(r){var i=p.eq(r);g&&(e[0]=d.call(this,r,i.html())),i.domManip(e,t,n)});if(c&&(r=x.buildFragment(e,this[0].ownerDocument,!1,!n&&this),i=r.firstChild,1===r.childNodes.length&&(r=i),i)){for(o=x.map(mt(r,"script"),ft),s=o.length;c>l;l++)a=r,l!==h&&(a=x.clone(a,!0,!0),s&&x.merge(o,mt(a,"script"))),t.call(this[l],a,l);if(s)for(u=o[o.length-1].ownerDocument,x.map(o,ht),l=0;s>l;l++)a=o[l],at.test(a.type||"")&&!q.access(a,"globalEval")&&x.contains(u,a)&&(a.src?x._evalUrl(a.src):x.globalEval(a.textContent.replace(lt,"")))}return this}}),x.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(e,t){x.fn[e]=function(e){var n,r=[],i=x(e),o=i.length-1,s=0;for(;o>=s;s++)n=s===o?this:this.clone(!0),x(i[s])[t](n),h.apply(r,n.get());return this.pushStack(r)}}),x.extend({clone:function(e,t,n){var r,i,o,s,a=e.cloneNode(!0),u=x.contains(e.ownerDocument,e);if(!(x.support.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||x.isXMLDoc(e)))for(s=mt(a),o=mt(e),r=0,i=o.length;i>r;r++)yt(o[r],s[r]);if(t)if(n)for(o=o||mt(e),s=s||mt(a),r=0,i=o.length;i>r;r++)gt(o[r],s[r]);else gt(e,a);return s=mt(a,"script"),s.length>0&&dt(s,!u&&mt(e,"script")),a},buildFragment:function(e,t,n,r){var i,o,s,a,u,l,c=0,p=e.length,f=t.createDocumentFragment(),h=[];for(;p>c;c++)if(i=e[c],i||0===i)if("object"===x.type(i))x.merge(h,i.nodeType?[i]:i);else if(rt.test(i)){o=o||f.appendChild(t.createElement("div")),s=(nt.exec(i)||["",""])[1].toLowerCase(),a=ct[s]||ct._default,o.innerHTML=a[1]+i.replace(tt,"<$1>")+a[2],l=a[0];while(l--)o=o.lastChild;x.merge(h,o.childNodes),o=f.firstChild,o.textContent=""}else h.push(t.createTextNode(i));f.textContent="",c=0;while(i=h[c++])if((!r||-1===x.inArray(i,r))&&(u=x.contains(i.ownerDocument,i),o=mt(f.appendChild(i),"script"),u&&dt(o),n)){l=0;while(i=o[l++])at.test(i.type||"")&&n.push(i)}return f},cleanData:function(e){var t,n,r,i,o,s,a=x.event.special,u=0;for(;(n=e[u])!==undefined;u++){if(F.accepts(n)&&(o=n[q.expando],o&&(t=q.cache[o]))){if(r=Object.keys(t.events||{}),r.length)for(s=0;(i=r[s])!==undefined;s++)a[i]?x.event.remove(n,i):x.removeEvent(n,i,t.handle);q.cache[o]&&delete q.cache[o]}delete L.cache[n[L.expando]]}},_evalUrl:function(e){return x.ajax({url:e,type:"GET",dataType:"script",async:!1,global:!1,"throws":!0})}});function pt(e,t){return x.nodeName(e,"table")&&x.nodeName(1===t.nodeType?t:t.firstChild,"tr")?e.getElementsByTagName("tbody")[0]||e.appendChild(e.ownerDocument.createElement("tbody")):e}function ft(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function ht(e){var t=ut.exec(e.type);return t?e.type=t[1]:e.removeAttribute("type"),e}function dt(e,t){var n=e.length,r=0;for(;n>r;r++)q.set(e[r],"globalEval",!t||q.get(t[r],"globalEval"))}function gt(e,t){var n,r,i,o,s,a,u,l;if(1===t.nodeType){if(q.hasData(e)&&(o=q.access(e),s=q.set(t,o),l=o.events)){delete s.handle,s.events={};for(i in l)for(n=0,r=l[i].length;r>n;n++)x.event.add(t,i,l[i][n])}L.hasData(e)&&(a=L.access(e),u=x.extend({},a),L.set(t,u))}}function mt(e,t){var n=e.getElementsByTagName?e.getElementsByTagName(t||"*"):e.querySelectorAll?e.querySelectorAll(t||"*"):[];return t===undefined||t&&x.nodeName(e,t)?x.merge([e],n):n}function yt(e,t){var n=t.nodeName.toLowerCase();"input"===n&&ot.test(e.type)?t.checked=e.checked:("input"===n||"textarea"===n)&&(t.defaultValue=e.defaultValue)}x.fn.extend({wrapAll:function(e){var t;return x.isFunction(e)?this.each(function(t){x(this).wrapAll(e.call(this,t))}):(this[0]&&(t=x(e,this[0].ownerDocument).eq(0).clone(!0),this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){var e=this;while(e.firstElementChild)e=e.firstElementChild;return e}).append(this)),this)},wrapInner:function(e){return x.isFunction(e)?this.each(function(t){x(this).wrapInner(e.call(this,t))}):this.each(function(){var t=x(this),n=t.contents();n.length?n.wrapAll(e):t.append(e)})},wrap:function(e){var t=x.isFunction(e);return this.each(function(n){x(this).wrapAll(t?e.call(this,n):e)})},unwrap:function(){return this.parent().each(function(){x.nodeName(this,"body")||x(this).replaceWith(this.childNodes)}).end()}});var vt,xt,bt=/^(none|table(?!-c[ea]).+)/,wt=/^margin/,Tt=RegExp("^("+b+")(.*)$","i"),Ct=RegExp("^("+b+")(?!px)[a-z%]+$","i"),kt=RegExp("^([+-])=("+b+")","i"),Nt={BODY:"block"},Et={position:"absolute",visibility:"hidden",display:"block"},St={letterSpacing:0,fontWeight:400},jt=["Top","Right","Bottom","Left"],Dt=["Webkit","O","Moz","ms"];function At(e,t){if(t in e)return t;var n=t.charAt(0).toUpperCase()+t.slice(1),r=t,i=Dt.length;while(i--)if(t=Dt[i]+n,t in e)return t;return r}function Lt(e,t){return e=t||e,"none"===x.css(e,"display")||!x.contains(e.ownerDocument,e)}function qt(t){return e.getComputedStyle(t,null)}function Ht(e,t){var n,r,i,o=[],s=0,a=e.length;for(;a>s;s++)r=e[s],r.style&&(o[s]=q.get(r,"olddisplay"),n=r.style.display,t?(o[s]||"none"!==n||(r.style.display=""),""===r.style.display&&Lt(r)&&(o[s]=q.access(r,"olddisplay",Rt(r.nodeName)))):o[s]||(i=Lt(r),(n&&"none"!==n||!i)&&q.set(r,"olddisplay",i?n:x.css(r,"display"))));for(s=0;a>s;s++)r=e[s],r.style&&(t&&"none"!==r.style.display&&""!==r.style.display||(r.style.display=t?o[s]||"":"none"));return e}x.fn.extend({css:function(e,t){return x.access(this,function(e,t,n){var r,i,o={},s=0;if(x.isArray(t)){for(r=qt(e),i=t.length;i>s;s++)o[t[s]]=x.css(e,t[s],!1,r);return o}return n!==undefined?x.style(e,t,n):x.css(e,t)},e,t,arguments.length>1)},show:function(){return Ht(this,!0)},hide:function(){return Ht(this)},toggle:function(e){return"boolean"==typeof e?e?this.show():this.hide():this.each(function(){Lt(this)?x(this).show():x(this).hide()})}}),x.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=vt(e,"opacity");return""===n?"1":n}}}},cssNumber:{columnCount:!0,fillOpacity:!0,fontWeight:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{"float":"cssFloat"},style:function(e,t,n,r){if(e&&3!==e.nodeType&&8!==e.nodeType&&e.style){var i,o,s,a=x.camelCase(t),u=e.style;return t=x.cssProps[a]||(x.cssProps[a]=At(u,a)),s=x.cssHooks[t]||x.cssHooks[a],n===undefined?s&&"get"in s&&(i=s.get(e,!1,r))!==undefined?i:u[t]:(o=typeof n,"string"===o&&(i=kt.exec(n))&&(n=(i[1]+1)*i[2]+parseFloat(x.css(e,t)),o="number"),null==n||"number"===o&&isNaN(n)||("number"!==o||x.cssNumber[a]||(n+="px"),x.support.clearCloneStyle||""!==n||0!==t.indexOf("background")||(u[t]="inherit"),s&&"set"in s&&(n=s.set(e,n,r))===undefined||(u[t]=n)),undefined)}},css:function(e,t,n,r){var i,o,s,a=x.camelCase(t);return t=x.cssProps[a]||(x.cssProps[a]=At(e.style,a)),s=x.cssHooks[t]||x.cssHooks[a],s&&"get"in s&&(i=s.get(e,!0,n)),i===undefined&&(i=vt(e,t,r)),"normal"===i&&t in St&&(i=St[t]),""===n||n?(o=parseFloat(i),n===!0||x.isNumeric(o)?o||0:i):i}}),vt=function(e,t,n){var r,i,o,s=n||qt(e),a=s?s.getPropertyValue(t)||s[t]:undefined,u=e.style;return s&&(""!==a||x.contains(e.ownerDocument,e)||(a=x.style(e,t)),Ct.test(a)&&wt.test(t)&&(r=u.width,i=u.minWidth,o=u.maxWidth,u.minWidth=u.maxWidth=u.width=a,a=s.width,u.width=r,u.minWidth=i,u.maxWidth=o)),a};function Ot(e,t,n){var r=Tt.exec(t);return r?Math.max(0,r[1]-(n||0))+(r[2]||"px"):t}function Ft(e,t,n,r,i){var o=n===(r?"border":"content")?4:"width"===t?1:0,s=0;for(;4>o;o+=2)"margin"===n&&(s+=x.css(e,n+jt[o],!0,i)),r?("content"===n&&(s-=x.css(e,"padding"+jt[o],!0,i)),"margin"!==n&&(s-=x.css(e,"border"+jt[o]+"Width",!0,i))):(s+=x.css(e,"padding"+jt[o],!0,i),"padding"!==n&&(s+=x.css(e,"border"+jt[o]+"Width",!0,i)));return s}function Pt(e,t,n){var r=!0,i="width"===t?e.offsetWidth:e.offsetHeight,o=qt(e),s=x.support.boxSizing&&"border-box"===x.css(e,"boxSizing",!1,o);if(0>=i||null==i){if(i=vt(e,t,o),(0>i||null==i)&&(i=e.style[t]),Ct.test(i))return i;r=s&&(x.support.boxSizingReliable||i===e.style[t]),i=parseFloat(i)||0}return i+Ft(e,t,n||(s?"border":"content"),r,o)+"px"}function Rt(e){var t=o,n=Nt[e];return n||(n=Mt(e,t),"none"!==n&&n||(xt=(xt||x("