| OLD | NEW |
| 1 <!DOCTYPE html><html style="height: 100%"><head><script src="packages/web_compon
ents/dart_support.js"></script> | 1 <!DOCTYPE html><html style="height: 100%"><head> |
| 2 | |
| 3 <meta charset="utf-8"> | 2 <meta charset="utf-8"> |
| 4 <title>Dart VM Observatory</title> | 3 <title>Dart VM Observatory</title> |
| 5 <script src="packages/web_components/platform.js"></script> | 4 <script src="packages/web_components/platform.js"></script> |
| 5 <script src="packages/web_components/dart_support.js"></script> |
| 6 | 6 |
| 7 | 7 |
| 8 | 8 |
| 9 | 9 |
| 10 | 10 |
| 11 | 11 |
| 12 </head> | 12 </head> |
| 13 <body style="height: 100%"><div hidden=""><style shim-shadowdom=""> | 13 <body style="height: 100%"><div hidden=""><style shim-shadowdom=""> |
| 14 /******************************* | 14 /******************************* |
| 15 Flex Layout | 15 Flex Layout |
| (...skipping 277 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 293 | 293 |
| 294 <script> | 294 <script> |
| 295 // TODO(sigmund): remove this script tag (dartbug.com/19650). This empty | 295 // TODO(sigmund): remove this script tag (dartbug.com/19650). This empty |
| 296 // script tag is necessary to work around a bug in Chrome 36. | 296 // script tag is necessary to work around a bug in Chrome 36. |
| 297 </script> | 297 </script> |
| 298 | 298 |
| 299 <!-- unminified for debugging: | 299 <!-- unminified for debugging: |
| 300 <link rel="import" href="src/js/polymer/layout.html"> | 300 <link rel="import" href="src/js/polymer/layout.html"> |
| 301 <script src="src/js/polymer/polymer.concat.js"></script> | 301 <script src="src/js/polymer/polymer.concat.js"></script> |
| 302 --> | 302 --> |
| 303 <script type="text/javascript" src="https://www.google.com/jsapi"></script><styl
e>/* Global styles */ | 303 <script type="text/javascript" src="https://www.google.com/jsapi"></script><link
rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"> |
| 304 * { | |
| 305 margin: 0; | |
| 306 padding: 0; | |
| 307 font: 400 14px 'Montserrat', sans-serif; | |
| 308 color: #333; | |
| 309 box-sizing: border-box; | |
| 310 } | |
| 311 | |
| 312 .content { | |
| 313 padding-left: 10%; | |
| 314 font: 400 14px 'Montserrat', sans-serif; | |
| 315 } | |
| 316 | |
| 317 .content-centered { | |
| 318 padding-left: 10%; | |
| 319 padding-right: 10%; | |
| 320 font: 400 14px 'Montserrat', sans-serif; | |
| 321 } | |
| 322 | |
| 323 .content-centered-big { | |
| 324 padding-left: 5%; | |
| 325 padding-right: 5%; | |
| 326 font: 400 14px 'Montserrat', sans-serif; | |
| 327 } | |
| 328 | |
| 329 h1 { | |
| 330 font: 400 18px 'Montserrat', sans-serif; | |
| 331 } | |
| 332 | |
| 333 .memberList { | |
| 334 display: table; | |
| 335 } | |
| 336 | |
| 337 .memberItem { | |
| 338 display: table-row; | |
| 339 } | |
| 340 | |
| 341 .memberName, .memberValue { | |
| 342 display: table-cell; | |
| 343 vertical-align: top; | |
| 344 padding: 3px 0 3px 1em; | |
| 345 font: 400 14px 'Montserrat', sans-serif; | |
| 346 } | |
| 347 | |
| 348 .memberSmall { | |
| 349 display: table-cell; | |
| 350 vertical-align: top; | |
| 351 padding: 3px 0 3px 1em; | |
| 352 font: 400 12px 'Montserrat', sans-serif; | |
| 353 } | |
| 354 | |
| 355 .monospace { | |
| 356 font-family: consolas, courier, monospace; | |
| 357 font-size: 1em; | |
| 358 line-height: 1.2em; | |
| 359 white-space: nowrap; | |
| 360 } | |
| 361 | |
| 362 a { | |
| 363 color: #0489c3; | |
| 364 text-decoration: none; | |
| 365 } | |
| 366 | |
| 367 a:hover { | |
| 368 text-decoration: underline; | |
| 369 } | |
| 370 | |
| 371 em { | |
| 372 color: inherit; | |
| 373 font-style: italic; | |
| 374 } | |
| 375 | |
| 376 b { | |
| 377 color: inherit; | |
| 378 font-weight: bold; | |
| 379 } | |
| 380 | |
| 381 hr { | |
| 382 margin-top: 20px; | |
| 383 margin-bottom: 20px; | |
| 384 border: 0; | |
| 385 border-top: 1px solid #eee; | |
| 386 height: 0; | |
| 387 box-sizing: content-box; | |
| 388 } | |
| 389 | |
| 390 .list-group { | |
| 391 padding-left: 0; | |
| 392 margin-bottom: 20px; | |
| 393 } | |
| 394 | |
| 395 .list-group-item { | |
| 396 position: relative; | |
| 397 display: block; | |
| 398 padding: 10px 15px; | |
| 399 margin-bottom: -1px; | |
| 400 background-color: #fff; | |
| 401 } | |
| 402 | |
| 403 .list-group-item:first-child { | |
| 404 /* rounded top corners */ | |
| 405 border-top-right-radius:4px; | |
| 406 border-top-left-radius:4px; | |
| 407 } | |
| 408 | |
| 409 .list-group-item:last-child { | |
| 410 margin-bottom: 0; | |
| 411 /* rounded bottom corners */ | |
| 412 border-bottom-right-radius: 4px; | |
| 413 border-bottom-left-radius:4px; | |
| 414 } | |
| 415 | |
| 416 /* Flex row container */ | |
| 417 .flex-row { | |
| 418 display: flex; | |
| 419 flex-direction: row; | |
| 420 } | |
| 421 | |
| 422 /* Flex column container */ | |
| 423 .flex-column { | |
| 424 display: flex; | |
| 425 flex-direction: column; | |
| 426 } | |
| 427 | |
| 428 .flex-item-fit { | |
| 429 flex-grow: 1; | |
| 430 flex-shrink: 1; | |
| 431 flex-basis: auto; | |
| 432 } | |
| 433 | |
| 434 .flex-item-no-shrink { | |
| 435 flex-grow: 0; | |
| 436 flex-shrink: 0; | |
| 437 flex-basis: auto; | |
| 438 } | |
| 439 | |
| 440 .flex-item-fill { | |
| 441 flex-grow: 0; | |
| 442 flex-shrink: 1; /* shrink when pressured */ | |
| 443 flex-basis: 100%; /* try and take 100% */ | |
| 444 } | |
| 445 | |
| 446 .flex-item-fixed-1-12 { | |
| 447 flex-grow: 0; | |
| 448 flex-shrink: 0; | |
| 449 flex-basis: 8.3%; | |
| 450 } | |
| 451 | |
| 452 .flex-item-fixed-2-12 { | |
| 453 flex-grow: 0; | |
| 454 flex-shrink: 0; | |
| 455 flex-basis: 16.6%; | |
| 456 } | |
| 457 | |
| 458 .flex-item-fixed-4-12 { | |
| 459 flex-grow: 0; | |
| 460 flex-shrink: 0; | |
| 461 flex-basis: 33.3333%; | |
| 462 } | |
| 463 | |
| 464 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 465 flex-grow: 0; | |
| 466 flex-shrink: 0; | |
| 467 flex-basis: 50%; | |
| 468 } | |
| 469 | |
| 470 .flex-item-fixed-8-12 { | |
| 471 flex-grow: 0; | |
| 472 flex-shrink: 0; | |
| 473 flex-basis: 66.6666%; | |
| 474 } | |
| 475 | |
| 476 .flex-item-fixed-9-12 { | |
| 477 flex-grow: 0; | |
| 478 flex-shrink: 0; | |
| 479 flex-basis: 75%; | |
| 480 } | |
| 481 | |
| 482 | |
| 483 .flex-item-fixed-12-12 { | |
| 484 flex-grow: 0; | |
| 485 flex-shrink: 0; | |
| 486 flex-basis: 100%; | |
| 487 } | |
| 488 | |
| 489 .flex-item-10-percent { | |
| 490 flex-grow: 0; | |
| 491 flex-shrink: 0; | |
| 492 flex-basis: 10%; | |
| 493 } | |
| 494 | |
| 495 .flex-item-15-percent { | |
| 496 flex-grow: 0; | |
| 497 flex-shrink: 0; | |
| 498 flex-basis: 15%; | |
| 499 } | |
| 500 | |
| 501 .flex-item-20-percent { | |
| 502 flex-grow: 0; | |
| 503 flex-shrink: 0; | |
| 504 flex-basis: 20%; | |
| 505 } | |
| 506 | |
| 507 .flex-item-30-percent { | |
| 508 flex-grow: 0; | |
| 509 flex-shrink: 0; | |
| 510 flex-basis: 30%; | |
| 511 } | |
| 512 | |
| 513 .flex-item-40-percent { | |
| 514 flex-grow: 0; | |
| 515 flex-shrink: 0; | |
| 516 flex-basis: 40%; | |
| 517 } | |
| 518 | |
| 519 .flex-item-50-percent { | |
| 520 flex-grow: 0; | |
| 521 flex-shrink: 0; | |
| 522 flex-basis: 50%; | |
| 523 } | |
| 524 | |
| 525 .flex-item-60-percent { | |
| 526 flex-grow: 0; | |
| 527 flex-shrink: 0; | |
| 528 flex-basis: 60%; | |
| 529 } | |
| 530 | |
| 531 .flex-item-70-percent { | |
| 532 flex-grow: 0; | |
| 533 flex-shrink: 0; | |
| 534 flex-basis: 70%; | |
| 535 } | |
| 536 | |
| 537 .flex-item-80-percent { | |
| 538 flex-grow: 0; | |
| 539 flex-shrink: 0; | |
| 540 flex-basis: 80%; | |
| 541 } | |
| 542 | |
| 543 .well { | |
| 544 min-height: 20px; | |
| 545 padding: 19px; | |
| 546 margin-bottom: 20px; | |
| 547 background-color: #f5f5f5; | |
| 548 border: 1px solid #e3e3e3; | |
| 549 border-radius: 4px; | |
| 550 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 551 } | |
| 552 | |
| 553 .break-wrap { | |
| 554 word-wrap: break-word; | |
| 555 } | |
| 556 </style> | |
| 557 | 304 |
| 558 | 305 |
| 559 | 306 |
| 560 <polymer-element name="curly-block"> | 307 <polymer-element name="curly-block"> |
| 561 <template> | 308 <template> |
| 562 <style> | 309 <style> |
| 563 .idle { | 310 .idle { |
| 564 display: inline-block; | 311 display: inline-block; |
| 565 color: #0489c3; | 312 color: #0489c3; |
| 566 cursor: pointer; | 313 cursor: pointer; |
| (...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 608 | 355 |
| 609 | 356 |
| 610 | 357 |
| 611 <polymer-element name="service-ref" extends="observatory-element"> | 358 <polymer-element name="service-ref" extends="observatory-element"> |
| 612 </polymer-element> | 359 </polymer-element> |
| 613 | 360 |
| 614 <polymer-element name="any-service-ref" extends="observatory-element"> | 361 <polymer-element name="any-service-ref" extends="observatory-element"> |
| 615 </polymer-element> | 362 </polymer-element> |
| 616 | 363 |
| 617 <polymer-element name="object-ref" extends="service-ref"> | 364 <polymer-element name="object-ref" extends="service-ref"> |
| 618 <template><style>/* Global styles */ | 365 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/s
hared.css"> |
| 619 * { | |
| 620 margin: 0; | |
| 621 padding: 0; | |
| 622 font: 400 14px 'Montserrat', sans-serif; | |
| 623 color: #333; | |
| 624 box-sizing: border-box; | |
| 625 } | |
| 626 | |
| 627 .content { | |
| 628 padding-left: 10%; | |
| 629 font: 400 14px 'Montserrat', sans-serif; | |
| 630 } | |
| 631 | |
| 632 .content-centered { | |
| 633 padding-left: 10%; | |
| 634 padding-right: 10%; | |
| 635 font: 400 14px 'Montserrat', sans-serif; | |
| 636 } | |
| 637 | |
| 638 .content-centered-big { | |
| 639 padding-left: 5%; | |
| 640 padding-right: 5%; | |
| 641 font: 400 14px 'Montserrat', sans-serif; | |
| 642 } | |
| 643 | |
| 644 h1 { | |
| 645 font: 400 18px 'Montserrat', sans-serif; | |
| 646 } | |
| 647 | |
| 648 .memberList { | |
| 649 display: table; | |
| 650 } | |
| 651 | |
| 652 .memberItem { | |
| 653 display: table-row; | |
| 654 } | |
| 655 | |
| 656 .memberName, .memberValue { | |
| 657 display: table-cell; | |
| 658 vertical-align: top; | |
| 659 padding: 3px 0 3px 1em; | |
| 660 font: 400 14px 'Montserrat', sans-serif; | |
| 661 } | |
| 662 | |
| 663 .memberSmall { | |
| 664 display: table-cell; | |
| 665 vertical-align: top; | |
| 666 padding: 3px 0 3px 1em; | |
| 667 font: 400 12px 'Montserrat', sans-serif; | |
| 668 } | |
| 669 | |
| 670 .monospace { | |
| 671 font-family: consolas, courier, monospace; | |
| 672 font-size: 1em; | |
| 673 line-height: 1.2em; | |
| 674 white-space: nowrap; | |
| 675 } | |
| 676 | |
| 677 a { | |
| 678 color: #0489c3; | |
| 679 text-decoration: none; | |
| 680 } | |
| 681 | |
| 682 a:hover { | |
| 683 text-decoration: underline; | |
| 684 } | |
| 685 | |
| 686 em { | |
| 687 color: inherit; | |
| 688 font-style: italic; | |
| 689 } | |
| 690 | |
| 691 b { | |
| 692 color: inherit; | |
| 693 font-weight: bold; | |
| 694 } | |
| 695 | |
| 696 hr { | |
| 697 margin-top: 20px; | |
| 698 margin-bottom: 20px; | |
| 699 border: 0; | |
| 700 border-top: 1px solid #eee; | |
| 701 height: 0; | |
| 702 box-sizing: content-box; | |
| 703 } | |
| 704 | |
| 705 .list-group { | |
| 706 padding-left: 0; | |
| 707 margin-bottom: 20px; | |
| 708 } | |
| 709 | |
| 710 .list-group-item { | |
| 711 position: relative; | |
| 712 display: block; | |
| 713 padding: 10px 15px; | |
| 714 margin-bottom: -1px; | |
| 715 background-color: #fff; | |
| 716 } | |
| 717 | |
| 718 .list-group-item:first-child { | |
| 719 /* rounded top corners */ | |
| 720 border-top-right-radius:4px; | |
| 721 border-top-left-radius:4px; | |
| 722 } | |
| 723 | |
| 724 .list-group-item:last-child { | |
| 725 margin-bottom: 0; | |
| 726 /* rounded bottom corners */ | |
| 727 border-bottom-right-radius: 4px; | |
| 728 border-bottom-left-radius:4px; | |
| 729 } | |
| 730 | |
| 731 /* Flex row container */ | |
| 732 .flex-row { | |
| 733 display: flex; | |
| 734 flex-direction: row; | |
| 735 } | |
| 736 | |
| 737 /* Flex column container */ | |
| 738 .flex-column { | |
| 739 display: flex; | |
| 740 flex-direction: column; | |
| 741 } | |
| 742 | |
| 743 .flex-item-fit { | |
| 744 flex-grow: 1; | |
| 745 flex-shrink: 1; | |
| 746 flex-basis: auto; | |
| 747 } | |
| 748 | |
| 749 .flex-item-no-shrink { | |
| 750 flex-grow: 0; | |
| 751 flex-shrink: 0; | |
| 752 flex-basis: auto; | |
| 753 } | |
| 754 | |
| 755 .flex-item-fill { | |
| 756 flex-grow: 0; | |
| 757 flex-shrink: 1; /* shrink when pressured */ | |
| 758 flex-basis: 100%; /* try and take 100% */ | |
| 759 } | |
| 760 | |
| 761 .flex-item-fixed-1-12 { | |
| 762 flex-grow: 0; | |
| 763 flex-shrink: 0; | |
| 764 flex-basis: 8.3%; | |
| 765 } | |
| 766 | |
| 767 .flex-item-fixed-2-12 { | |
| 768 flex-grow: 0; | |
| 769 flex-shrink: 0; | |
| 770 flex-basis: 16.6%; | |
| 771 } | |
| 772 | |
| 773 .flex-item-fixed-4-12 { | |
| 774 flex-grow: 0; | |
| 775 flex-shrink: 0; | |
| 776 flex-basis: 33.3333%; | |
| 777 } | |
| 778 | |
| 779 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 780 flex-grow: 0; | |
| 781 flex-shrink: 0; | |
| 782 flex-basis: 50%; | |
| 783 } | |
| 784 | |
| 785 .flex-item-fixed-8-12 { | |
| 786 flex-grow: 0; | |
| 787 flex-shrink: 0; | |
| 788 flex-basis: 66.6666%; | |
| 789 } | |
| 790 | |
| 791 .flex-item-fixed-9-12 { | |
| 792 flex-grow: 0; | |
| 793 flex-shrink: 0; | |
| 794 flex-basis: 75%; | |
| 795 } | |
| 796 | |
| 797 | |
| 798 .flex-item-fixed-12-12 { | |
| 799 flex-grow: 0; | |
| 800 flex-shrink: 0; | |
| 801 flex-basis: 100%; | |
| 802 } | |
| 803 | |
| 804 .flex-item-10-percent { | |
| 805 flex-grow: 0; | |
| 806 flex-shrink: 0; | |
| 807 flex-basis: 10%; | |
| 808 } | |
| 809 | |
| 810 .flex-item-15-percent { | |
| 811 flex-grow: 0; | |
| 812 flex-shrink: 0; | |
| 813 flex-basis: 15%; | |
| 814 } | |
| 815 | |
| 816 .flex-item-20-percent { | |
| 817 flex-grow: 0; | |
| 818 flex-shrink: 0; | |
| 819 flex-basis: 20%; | |
| 820 } | |
| 821 | |
| 822 .flex-item-30-percent { | |
| 823 flex-grow: 0; | |
| 824 flex-shrink: 0; | |
| 825 flex-basis: 30%; | |
| 826 } | |
| 827 | |
| 828 .flex-item-40-percent { | |
| 829 flex-grow: 0; | |
| 830 flex-shrink: 0; | |
| 831 flex-basis: 40%; | |
| 832 } | |
| 833 | |
| 834 .flex-item-50-percent { | |
| 835 flex-grow: 0; | |
| 836 flex-shrink: 0; | |
| 837 flex-basis: 50%; | |
| 838 } | |
| 839 | |
| 840 .flex-item-60-percent { | |
| 841 flex-grow: 0; | |
| 842 flex-shrink: 0; | |
| 843 flex-basis: 60%; | |
| 844 } | |
| 845 | |
| 846 .flex-item-70-percent { | |
| 847 flex-grow: 0; | |
| 848 flex-shrink: 0; | |
| 849 flex-basis: 70%; | |
| 850 } | |
| 851 | |
| 852 .flex-item-80-percent { | |
| 853 flex-grow: 0; | |
| 854 flex-shrink: 0; | |
| 855 flex-basis: 80%; | |
| 856 } | |
| 857 | |
| 858 .well { | |
| 859 min-height: 20px; | |
| 860 padding: 19px; | |
| 861 margin-bottom: 20px; | |
| 862 background-color: #f5f5f5; | |
| 863 border: 1px solid #e3e3e3; | |
| 864 border-radius: 4px; | |
| 865 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 866 } | |
| 867 | |
| 868 .break-wrap { | |
| 869 word-wrap: break-word; | |
| 870 } | |
| 871 </style> | |
| 872 <template if="{{ nameIsEmpty }}"> | 366 <template if="{{ nameIsEmpty }}"> |
| 873 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.vmType }}</em></a> | 367 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.vmType }}</em></a> |
| 874 </template> | 368 </template> |
| 875 <template if="{{ !nameIsEmpty }}"> | 369 <template if="{{ !nameIsEmpty }}"> |
| 876 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ name }}</em></a> | 370 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ name }}</em></a> |
| 877 </template> | 371 </template> |
| 878 </template> | 372 </template> |
| 879 </polymer-element> | 373 </polymer-element> |
| 880 | 374 |
| 881 | 375 |
| 882 | 376 |
| 883 <polymer-element name="instance-ref" extends="service-ref"> | 377 <polymer-element name="instance-ref" extends="service-ref"> |
| 884 <template> | 378 <template> |
| 885 <style>/* Global styles */ | 379 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 886 * { | |
| 887 margin: 0; | |
| 888 padding: 0; | |
| 889 font: 400 14px 'Montserrat', sans-serif; | |
| 890 color: #333; | |
| 891 box-sizing: border-box; | |
| 892 } | |
| 893 | |
| 894 .content { | |
| 895 padding-left: 10%; | |
| 896 font: 400 14px 'Montserrat', sans-serif; | |
| 897 } | |
| 898 | |
| 899 .content-centered { | |
| 900 padding-left: 10%; | |
| 901 padding-right: 10%; | |
| 902 font: 400 14px 'Montserrat', sans-serif; | |
| 903 } | |
| 904 | |
| 905 .content-centered-big { | |
| 906 padding-left: 5%; | |
| 907 padding-right: 5%; | |
| 908 font: 400 14px 'Montserrat', sans-serif; | |
| 909 } | |
| 910 | |
| 911 h1 { | |
| 912 font: 400 18px 'Montserrat', sans-serif; | |
| 913 } | |
| 914 | |
| 915 .memberList { | |
| 916 display: table; | |
| 917 } | |
| 918 | |
| 919 .memberItem { | |
| 920 display: table-row; | |
| 921 } | |
| 922 | |
| 923 .memberName, .memberValue { | |
| 924 display: table-cell; | |
| 925 vertical-align: top; | |
| 926 padding: 3px 0 3px 1em; | |
| 927 font: 400 14px 'Montserrat', sans-serif; | |
| 928 } | |
| 929 | |
| 930 .memberSmall { | |
| 931 display: table-cell; | |
| 932 vertical-align: top; | |
| 933 padding: 3px 0 3px 1em; | |
| 934 font: 400 12px 'Montserrat', sans-serif; | |
| 935 } | |
| 936 | |
| 937 .monospace { | |
| 938 font-family: consolas, courier, monospace; | |
| 939 font-size: 1em; | |
| 940 line-height: 1.2em; | |
| 941 white-space: nowrap; | |
| 942 } | |
| 943 | |
| 944 a { | |
| 945 color: #0489c3; | |
| 946 text-decoration: none; | |
| 947 } | |
| 948 | |
| 949 a:hover { | |
| 950 text-decoration: underline; | |
| 951 } | |
| 952 | |
| 953 em { | |
| 954 color: inherit; | |
| 955 font-style: italic; | |
| 956 } | |
| 957 | |
| 958 b { | |
| 959 color: inherit; | |
| 960 font-weight: bold; | |
| 961 } | |
| 962 | |
| 963 hr { | |
| 964 margin-top: 20px; | |
| 965 margin-bottom: 20px; | |
| 966 border: 0; | |
| 967 border-top: 1px solid #eee; | |
| 968 height: 0; | |
| 969 box-sizing: content-box; | |
| 970 } | |
| 971 | |
| 972 .list-group { | |
| 973 padding-left: 0; | |
| 974 margin-bottom: 20px; | |
| 975 } | |
| 976 | |
| 977 .list-group-item { | |
| 978 position: relative; | |
| 979 display: block; | |
| 980 padding: 10px 15px; | |
| 981 margin-bottom: -1px; | |
| 982 background-color: #fff; | |
| 983 } | |
| 984 | |
| 985 .list-group-item:first-child { | |
| 986 /* rounded top corners */ | |
| 987 border-top-right-radius:4px; | |
| 988 border-top-left-radius:4px; | |
| 989 } | |
| 990 | |
| 991 .list-group-item:last-child { | |
| 992 margin-bottom: 0; | |
| 993 /* rounded bottom corners */ | |
| 994 border-bottom-right-radius: 4px; | |
| 995 border-bottom-left-radius:4px; | |
| 996 } | |
| 997 | |
| 998 /* Flex row container */ | |
| 999 .flex-row { | |
| 1000 display: flex; | |
| 1001 flex-direction: row; | |
| 1002 } | |
| 1003 | |
| 1004 /* Flex column container */ | |
| 1005 .flex-column { | |
| 1006 display: flex; | |
| 1007 flex-direction: column; | |
| 1008 } | |
| 1009 | |
| 1010 .flex-item-fit { | |
| 1011 flex-grow: 1; | |
| 1012 flex-shrink: 1; | |
| 1013 flex-basis: auto; | |
| 1014 } | |
| 1015 | |
| 1016 .flex-item-no-shrink { | |
| 1017 flex-grow: 0; | |
| 1018 flex-shrink: 0; | |
| 1019 flex-basis: auto; | |
| 1020 } | |
| 1021 | |
| 1022 .flex-item-fill { | |
| 1023 flex-grow: 0; | |
| 1024 flex-shrink: 1; /* shrink when pressured */ | |
| 1025 flex-basis: 100%; /* try and take 100% */ | |
| 1026 } | |
| 1027 | |
| 1028 .flex-item-fixed-1-12 { | |
| 1029 flex-grow: 0; | |
| 1030 flex-shrink: 0; | |
| 1031 flex-basis: 8.3%; | |
| 1032 } | |
| 1033 | |
| 1034 .flex-item-fixed-2-12 { | |
| 1035 flex-grow: 0; | |
| 1036 flex-shrink: 0; | |
| 1037 flex-basis: 16.6%; | |
| 1038 } | |
| 1039 | |
| 1040 .flex-item-fixed-4-12 { | |
| 1041 flex-grow: 0; | |
| 1042 flex-shrink: 0; | |
| 1043 flex-basis: 33.3333%; | |
| 1044 } | |
| 1045 | |
| 1046 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 1047 flex-grow: 0; | |
| 1048 flex-shrink: 0; | |
| 1049 flex-basis: 50%; | |
| 1050 } | |
| 1051 | |
| 1052 .flex-item-fixed-8-12 { | |
| 1053 flex-grow: 0; | |
| 1054 flex-shrink: 0; | |
| 1055 flex-basis: 66.6666%; | |
| 1056 } | |
| 1057 | |
| 1058 .flex-item-fixed-9-12 { | |
| 1059 flex-grow: 0; | |
| 1060 flex-shrink: 0; | |
| 1061 flex-basis: 75%; | |
| 1062 } | |
| 1063 | |
| 1064 | |
| 1065 .flex-item-fixed-12-12 { | |
| 1066 flex-grow: 0; | |
| 1067 flex-shrink: 0; | |
| 1068 flex-basis: 100%; | |
| 1069 } | |
| 1070 | |
| 1071 .flex-item-10-percent { | |
| 1072 flex-grow: 0; | |
| 1073 flex-shrink: 0; | |
| 1074 flex-basis: 10%; | |
| 1075 } | |
| 1076 | |
| 1077 .flex-item-15-percent { | |
| 1078 flex-grow: 0; | |
| 1079 flex-shrink: 0; | |
| 1080 flex-basis: 15%; | |
| 1081 } | |
| 1082 | |
| 1083 .flex-item-20-percent { | |
| 1084 flex-grow: 0; | |
| 1085 flex-shrink: 0; | |
| 1086 flex-basis: 20%; | |
| 1087 } | |
| 1088 | |
| 1089 .flex-item-30-percent { | |
| 1090 flex-grow: 0; | |
| 1091 flex-shrink: 0; | |
| 1092 flex-basis: 30%; | |
| 1093 } | |
| 1094 | |
| 1095 .flex-item-40-percent { | |
| 1096 flex-grow: 0; | |
| 1097 flex-shrink: 0; | |
| 1098 flex-basis: 40%; | |
| 1099 } | |
| 1100 | |
| 1101 .flex-item-50-percent { | |
| 1102 flex-grow: 0; | |
| 1103 flex-shrink: 0; | |
| 1104 flex-basis: 50%; | |
| 1105 } | |
| 1106 | |
| 1107 .flex-item-60-percent { | |
| 1108 flex-grow: 0; | |
| 1109 flex-shrink: 0; | |
| 1110 flex-basis: 60%; | |
| 1111 } | |
| 1112 | |
| 1113 .flex-item-70-percent { | |
| 1114 flex-grow: 0; | |
| 1115 flex-shrink: 0; | |
| 1116 flex-basis: 70%; | |
| 1117 } | |
| 1118 | |
| 1119 .flex-item-80-percent { | |
| 1120 flex-grow: 0; | |
| 1121 flex-shrink: 0; | |
| 1122 flex-basis: 80%; | |
| 1123 } | |
| 1124 | |
| 1125 .well { | |
| 1126 min-height: 20px; | |
| 1127 padding: 19px; | |
| 1128 margin-bottom: 20px; | |
| 1129 background-color: #f5f5f5; | |
| 1130 border: 1px solid #e3e3e3; | |
| 1131 border-radius: 4px; | |
| 1132 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 1133 } | |
| 1134 | |
| 1135 .break-wrap { | |
| 1136 word-wrap: break-word; | |
| 1137 } | |
| 1138 </style> | |
| 1139 <style> | 380 <style> |
| 1140 .errorBox { | 381 .errorBox { |
| 1141 background-color: #f5f5f5; | 382 background-color: #f5f5f5; |
| 1142 border: 1px solid #ccc; | 383 border: 1px solid #ccc; |
| 1143 padding: 10px; | 384 padding: 10px; |
| 1144 font-family: consolas, courier, monospace; | 385 font-family: consolas, courier, monospace; |
| 1145 font-size: 1em; | 386 font-size: 1em; |
| 1146 line-height: 1.2em; | 387 line-height: 1.2em; |
| 1147 white-space: pre; | 388 white-space: pre; |
| 1148 } | 389 } |
| (...skipping 132 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1281 | 522 |
| 1282 | 523 |
| 1283 | 524 |
| 1284 | 525 |
| 1285 | 526 |
| 1286 | 527 |
| 1287 | 528 |
| 1288 | 529 |
| 1289 <polymer-element name="nav-bar" extends="observatory-element"> | 530 <polymer-element name="nav-bar" extends="observatory-element"> |
| 1290 <template> | 531 <template> |
| 1291 <style>/* Global styles */ | 532 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1292 * { | |
| 1293 margin: 0; | |
| 1294 padding: 0; | |
| 1295 font: 400 14px 'Montserrat', sans-serif; | |
| 1296 color: #333; | |
| 1297 box-sizing: border-box; | |
| 1298 } | |
| 1299 | |
| 1300 .content { | |
| 1301 padding-left: 10%; | |
| 1302 font: 400 14px 'Montserrat', sans-serif; | |
| 1303 } | |
| 1304 | |
| 1305 .content-centered { | |
| 1306 padding-left: 10%; | |
| 1307 padding-right: 10%; | |
| 1308 font: 400 14px 'Montserrat', sans-serif; | |
| 1309 } | |
| 1310 | |
| 1311 .content-centered-big { | |
| 1312 padding-left: 5%; | |
| 1313 padding-right: 5%; | |
| 1314 font: 400 14px 'Montserrat', sans-serif; | |
| 1315 } | |
| 1316 | |
| 1317 h1 { | |
| 1318 font: 400 18px 'Montserrat', sans-serif; | |
| 1319 } | |
| 1320 | |
| 1321 .memberList { | |
| 1322 display: table; | |
| 1323 } | |
| 1324 | |
| 1325 .memberItem { | |
| 1326 display: table-row; | |
| 1327 } | |
| 1328 | |
| 1329 .memberName, .memberValue { | |
| 1330 display: table-cell; | |
| 1331 vertical-align: top; | |
| 1332 padding: 3px 0 3px 1em; | |
| 1333 font: 400 14px 'Montserrat', sans-serif; | |
| 1334 } | |
| 1335 | |
| 1336 .memberSmall { | |
| 1337 display: table-cell; | |
| 1338 vertical-align: top; | |
| 1339 padding: 3px 0 3px 1em; | |
| 1340 font: 400 12px 'Montserrat', sans-serif; | |
| 1341 } | |
| 1342 | |
| 1343 .monospace { | |
| 1344 font-family: consolas, courier, monospace; | |
| 1345 font-size: 1em; | |
| 1346 line-height: 1.2em; | |
| 1347 white-space: nowrap; | |
| 1348 } | |
| 1349 | |
| 1350 a { | |
| 1351 color: #0489c3; | |
| 1352 text-decoration: none; | |
| 1353 } | |
| 1354 | |
| 1355 a:hover { | |
| 1356 text-decoration: underline; | |
| 1357 } | |
| 1358 | |
| 1359 em { | |
| 1360 color: inherit; | |
| 1361 font-style: italic; | |
| 1362 } | |
| 1363 | |
| 1364 b { | |
| 1365 color: inherit; | |
| 1366 font-weight: bold; | |
| 1367 } | |
| 1368 | |
| 1369 hr { | |
| 1370 margin-top: 20px; | |
| 1371 margin-bottom: 20px; | |
| 1372 border: 0; | |
| 1373 border-top: 1px solid #eee; | |
| 1374 height: 0; | |
| 1375 box-sizing: content-box; | |
| 1376 } | |
| 1377 | |
| 1378 .list-group { | |
| 1379 padding-left: 0; | |
| 1380 margin-bottom: 20px; | |
| 1381 } | |
| 1382 | |
| 1383 .list-group-item { | |
| 1384 position: relative; | |
| 1385 display: block; | |
| 1386 padding: 10px 15px; | |
| 1387 margin-bottom: -1px; | |
| 1388 background-color: #fff; | |
| 1389 } | |
| 1390 | |
| 1391 .list-group-item:first-child { | |
| 1392 /* rounded top corners */ | |
| 1393 border-top-right-radius:4px; | |
| 1394 border-top-left-radius:4px; | |
| 1395 } | |
| 1396 | |
| 1397 .list-group-item:last-child { | |
| 1398 margin-bottom: 0; | |
| 1399 /* rounded bottom corners */ | |
| 1400 border-bottom-right-radius: 4px; | |
| 1401 border-bottom-left-radius:4px; | |
| 1402 } | |
| 1403 | |
| 1404 /* Flex row container */ | |
| 1405 .flex-row { | |
| 1406 display: flex; | |
| 1407 flex-direction: row; | |
| 1408 } | |
| 1409 | |
| 1410 /* Flex column container */ | |
| 1411 .flex-column { | |
| 1412 display: flex; | |
| 1413 flex-direction: column; | |
| 1414 } | |
| 1415 | |
| 1416 .flex-item-fit { | |
| 1417 flex-grow: 1; | |
| 1418 flex-shrink: 1; | |
| 1419 flex-basis: auto; | |
| 1420 } | |
| 1421 | |
| 1422 .flex-item-no-shrink { | |
| 1423 flex-grow: 0; | |
| 1424 flex-shrink: 0; | |
| 1425 flex-basis: auto; | |
| 1426 } | |
| 1427 | |
| 1428 .flex-item-fill { | |
| 1429 flex-grow: 0; | |
| 1430 flex-shrink: 1; /* shrink when pressured */ | |
| 1431 flex-basis: 100%; /* try and take 100% */ | |
| 1432 } | |
| 1433 | |
| 1434 .flex-item-fixed-1-12 { | |
| 1435 flex-grow: 0; | |
| 1436 flex-shrink: 0; | |
| 1437 flex-basis: 8.3%; | |
| 1438 } | |
| 1439 | |
| 1440 .flex-item-fixed-2-12 { | |
| 1441 flex-grow: 0; | |
| 1442 flex-shrink: 0; | |
| 1443 flex-basis: 16.6%; | |
| 1444 } | |
| 1445 | |
| 1446 .flex-item-fixed-4-12 { | |
| 1447 flex-grow: 0; | |
| 1448 flex-shrink: 0; | |
| 1449 flex-basis: 33.3333%; | |
| 1450 } | |
| 1451 | |
| 1452 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 1453 flex-grow: 0; | |
| 1454 flex-shrink: 0; | |
| 1455 flex-basis: 50%; | |
| 1456 } | |
| 1457 | |
| 1458 .flex-item-fixed-8-12 { | |
| 1459 flex-grow: 0; | |
| 1460 flex-shrink: 0; | |
| 1461 flex-basis: 66.6666%; | |
| 1462 } | |
| 1463 | |
| 1464 .flex-item-fixed-9-12 { | |
| 1465 flex-grow: 0; | |
| 1466 flex-shrink: 0; | |
| 1467 flex-basis: 75%; | |
| 1468 } | |
| 1469 | |
| 1470 | |
| 1471 .flex-item-fixed-12-12 { | |
| 1472 flex-grow: 0; | |
| 1473 flex-shrink: 0; | |
| 1474 flex-basis: 100%; | |
| 1475 } | |
| 1476 | |
| 1477 .flex-item-10-percent { | |
| 1478 flex-grow: 0; | |
| 1479 flex-shrink: 0; | |
| 1480 flex-basis: 10%; | |
| 1481 } | |
| 1482 | |
| 1483 .flex-item-15-percent { | |
| 1484 flex-grow: 0; | |
| 1485 flex-shrink: 0; | |
| 1486 flex-basis: 15%; | |
| 1487 } | |
| 1488 | |
| 1489 .flex-item-20-percent { | |
| 1490 flex-grow: 0; | |
| 1491 flex-shrink: 0; | |
| 1492 flex-basis: 20%; | |
| 1493 } | |
| 1494 | |
| 1495 .flex-item-30-percent { | |
| 1496 flex-grow: 0; | |
| 1497 flex-shrink: 0; | |
| 1498 flex-basis: 30%; | |
| 1499 } | |
| 1500 | |
| 1501 .flex-item-40-percent { | |
| 1502 flex-grow: 0; | |
| 1503 flex-shrink: 0; | |
| 1504 flex-basis: 40%; | |
| 1505 } | |
| 1506 | |
| 1507 .flex-item-50-percent { | |
| 1508 flex-grow: 0; | |
| 1509 flex-shrink: 0; | |
| 1510 flex-basis: 50%; | |
| 1511 } | |
| 1512 | |
| 1513 .flex-item-60-percent { | |
| 1514 flex-grow: 0; | |
| 1515 flex-shrink: 0; | |
| 1516 flex-basis: 60%; | |
| 1517 } | |
| 1518 | |
| 1519 .flex-item-70-percent { | |
| 1520 flex-grow: 0; | |
| 1521 flex-shrink: 0; | |
| 1522 flex-basis: 70%; | |
| 1523 } | |
| 1524 | |
| 1525 .flex-item-80-percent { | |
| 1526 flex-grow: 0; | |
| 1527 flex-shrink: 0; | |
| 1528 flex-basis: 80%; | |
| 1529 } | |
| 1530 | |
| 1531 .well { | |
| 1532 min-height: 20px; | |
| 1533 padding: 19px; | |
| 1534 margin-bottom: 20px; | |
| 1535 background-color: #f5f5f5; | |
| 1536 border: 1px solid #e3e3e3; | |
| 1537 border-radius: 4px; | |
| 1538 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 1539 } | |
| 1540 | |
| 1541 .break-wrap { | |
| 1542 word-wrap: break-word; | |
| 1543 } | |
| 1544 </style> | |
| 1545 <style> | 533 <style> |
| 1546 nav { | 534 nav { |
| 1547 position: fixed; | 535 position: fixed; |
| 1548 width: 100%; | 536 width: 100%; |
| 1549 z-index: 1000; | 537 z-index: 1000; |
| 1550 } | 538 } |
| 1551 nav ul { | 539 nav ul { |
| 1552 display: inline-table; | 540 display: inline-table; |
| 1553 position: relative; | 541 position: relative; |
| 1554 list-style: none; | 542 list-style: none; |
| (...skipping 325 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1880 </template> | 868 </template> |
| 1881 </polymer-element> | 869 </polymer-element> |
| 1882 | 870 |
| 1883 | 871 |
| 1884 | 872 |
| 1885 | 873 |
| 1886 | 874 |
| 1887 | 875 |
| 1888 <polymer-element name="breakpoint-list" extends="observatory-element"> | 876 <polymer-element name="breakpoint-list" extends="observatory-element"> |
| 1889 <template> | 877 <template> |
| 1890 <style>/* Global styles */ | 878 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1891 * { | |
| 1892 margin: 0; | |
| 1893 padding: 0; | |
| 1894 font: 400 14px 'Montserrat', sans-serif; | |
| 1895 color: #333; | |
| 1896 box-sizing: border-box; | |
| 1897 } | |
| 1898 | |
| 1899 .content { | |
| 1900 padding-left: 10%; | |
| 1901 font: 400 14px 'Montserrat', sans-serif; | |
| 1902 } | |
| 1903 | |
| 1904 .content-centered { | |
| 1905 padding-left: 10%; | |
| 1906 padding-right: 10%; | |
| 1907 font: 400 14px 'Montserrat', sans-serif; | |
| 1908 } | |
| 1909 | |
| 1910 .content-centered-big { | |
| 1911 padding-left: 5%; | |
| 1912 padding-right: 5%; | |
| 1913 font: 400 14px 'Montserrat', sans-serif; | |
| 1914 } | |
| 1915 | |
| 1916 h1 { | |
| 1917 font: 400 18px 'Montserrat', sans-serif; | |
| 1918 } | |
| 1919 | |
| 1920 .memberList { | |
| 1921 display: table; | |
| 1922 } | |
| 1923 | |
| 1924 .memberItem { | |
| 1925 display: table-row; | |
| 1926 } | |
| 1927 | |
| 1928 .memberName, .memberValue { | |
| 1929 display: table-cell; | |
| 1930 vertical-align: top; | |
| 1931 padding: 3px 0 3px 1em; | |
| 1932 font: 400 14px 'Montserrat', sans-serif; | |
| 1933 } | |
| 1934 | |
| 1935 .memberSmall { | |
| 1936 display: table-cell; | |
| 1937 vertical-align: top; | |
| 1938 padding: 3px 0 3px 1em; | |
| 1939 font: 400 12px 'Montserrat', sans-serif; | |
| 1940 } | |
| 1941 | |
| 1942 .monospace { | |
| 1943 font-family: consolas, courier, monospace; | |
| 1944 font-size: 1em; | |
| 1945 line-height: 1.2em; | |
| 1946 white-space: nowrap; | |
| 1947 } | |
| 1948 | |
| 1949 a { | |
| 1950 color: #0489c3; | |
| 1951 text-decoration: none; | |
| 1952 } | |
| 1953 | |
| 1954 a:hover { | |
| 1955 text-decoration: underline; | |
| 1956 } | |
| 1957 | |
| 1958 em { | |
| 1959 color: inherit; | |
| 1960 font-style: italic; | |
| 1961 } | |
| 1962 | |
| 1963 b { | |
| 1964 color: inherit; | |
| 1965 font-weight: bold; | |
| 1966 } | |
| 1967 | |
| 1968 hr { | |
| 1969 margin-top: 20px; | |
| 1970 margin-bottom: 20px; | |
| 1971 border: 0; | |
| 1972 border-top: 1px solid #eee; | |
| 1973 height: 0; | |
| 1974 box-sizing: content-box; | |
| 1975 } | |
| 1976 | |
| 1977 .list-group { | |
| 1978 padding-left: 0; | |
| 1979 margin-bottom: 20px; | |
| 1980 } | |
| 1981 | |
| 1982 .list-group-item { | |
| 1983 position: relative; | |
| 1984 display: block; | |
| 1985 padding: 10px 15px; | |
| 1986 margin-bottom: -1px; | |
| 1987 background-color: #fff; | |
| 1988 } | |
| 1989 | |
| 1990 .list-group-item:first-child { | |
| 1991 /* rounded top corners */ | |
| 1992 border-top-right-radius:4px; | |
| 1993 border-top-left-radius:4px; | |
| 1994 } | |
| 1995 | |
| 1996 .list-group-item:last-child { | |
| 1997 margin-bottom: 0; | |
| 1998 /* rounded bottom corners */ | |
| 1999 border-bottom-right-radius: 4px; | |
| 2000 border-bottom-left-radius:4px; | |
| 2001 } | |
| 2002 | |
| 2003 /* Flex row container */ | |
| 2004 .flex-row { | |
| 2005 display: flex; | |
| 2006 flex-direction: row; | |
| 2007 } | |
| 2008 | |
| 2009 /* Flex column container */ | |
| 2010 .flex-column { | |
| 2011 display: flex; | |
| 2012 flex-direction: column; | |
| 2013 } | |
| 2014 | |
| 2015 .flex-item-fit { | |
| 2016 flex-grow: 1; | |
| 2017 flex-shrink: 1; | |
| 2018 flex-basis: auto; | |
| 2019 } | |
| 2020 | |
| 2021 .flex-item-no-shrink { | |
| 2022 flex-grow: 0; | |
| 2023 flex-shrink: 0; | |
| 2024 flex-basis: auto; | |
| 2025 } | |
| 2026 | |
| 2027 .flex-item-fill { | |
| 2028 flex-grow: 0; | |
| 2029 flex-shrink: 1; /* shrink when pressured */ | |
| 2030 flex-basis: 100%; /* try and take 100% */ | |
| 2031 } | |
| 2032 | |
| 2033 .flex-item-fixed-1-12 { | |
| 2034 flex-grow: 0; | |
| 2035 flex-shrink: 0; | |
| 2036 flex-basis: 8.3%; | |
| 2037 } | |
| 2038 | |
| 2039 .flex-item-fixed-2-12 { | |
| 2040 flex-grow: 0; | |
| 2041 flex-shrink: 0; | |
| 2042 flex-basis: 16.6%; | |
| 2043 } | |
| 2044 | |
| 2045 .flex-item-fixed-4-12 { | |
| 2046 flex-grow: 0; | |
| 2047 flex-shrink: 0; | |
| 2048 flex-basis: 33.3333%; | |
| 2049 } | |
| 2050 | |
| 2051 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 2052 flex-grow: 0; | |
| 2053 flex-shrink: 0; | |
| 2054 flex-basis: 50%; | |
| 2055 } | |
| 2056 | |
| 2057 .flex-item-fixed-8-12 { | |
| 2058 flex-grow: 0; | |
| 2059 flex-shrink: 0; | |
| 2060 flex-basis: 66.6666%; | |
| 2061 } | |
| 2062 | |
| 2063 .flex-item-fixed-9-12 { | |
| 2064 flex-grow: 0; | |
| 2065 flex-shrink: 0; | |
| 2066 flex-basis: 75%; | |
| 2067 } | |
| 2068 | |
| 2069 | |
| 2070 .flex-item-fixed-12-12 { | |
| 2071 flex-grow: 0; | |
| 2072 flex-shrink: 0; | |
| 2073 flex-basis: 100%; | |
| 2074 } | |
| 2075 | |
| 2076 .flex-item-10-percent { | |
| 2077 flex-grow: 0; | |
| 2078 flex-shrink: 0; | |
| 2079 flex-basis: 10%; | |
| 2080 } | |
| 2081 | |
| 2082 .flex-item-15-percent { | |
| 2083 flex-grow: 0; | |
| 2084 flex-shrink: 0; | |
| 2085 flex-basis: 15%; | |
| 2086 } | |
| 2087 | |
| 2088 .flex-item-20-percent { | |
| 2089 flex-grow: 0; | |
| 2090 flex-shrink: 0; | |
| 2091 flex-basis: 20%; | |
| 2092 } | |
| 2093 | |
| 2094 .flex-item-30-percent { | |
| 2095 flex-grow: 0; | |
| 2096 flex-shrink: 0; | |
| 2097 flex-basis: 30%; | |
| 2098 } | |
| 2099 | |
| 2100 .flex-item-40-percent { | |
| 2101 flex-grow: 0; | |
| 2102 flex-shrink: 0; | |
| 2103 flex-basis: 40%; | |
| 2104 } | |
| 2105 | |
| 2106 .flex-item-50-percent { | |
| 2107 flex-grow: 0; | |
| 2108 flex-shrink: 0; | |
| 2109 flex-basis: 50%; | |
| 2110 } | |
| 2111 | |
| 2112 .flex-item-60-percent { | |
| 2113 flex-grow: 0; | |
| 2114 flex-shrink: 0; | |
| 2115 flex-basis: 60%; | |
| 2116 } | |
| 2117 | |
| 2118 .flex-item-70-percent { | |
| 2119 flex-grow: 0; | |
| 2120 flex-shrink: 0; | |
| 2121 flex-basis: 70%; | |
| 2122 } | |
| 2123 | |
| 2124 .flex-item-80-percent { | |
| 2125 flex-grow: 0; | |
| 2126 flex-shrink: 0; | |
| 2127 flex-basis: 80%; | |
| 2128 } | |
| 2129 | |
| 2130 .well { | |
| 2131 min-height: 20px; | |
| 2132 padding: 19px; | |
| 2133 margin-bottom: 20px; | |
| 2134 background-color: #f5f5f5; | |
| 2135 border: 1px solid #e3e3e3; | |
| 2136 border-radius: 4px; | |
| 2137 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 2138 } | |
| 2139 | |
| 2140 .break-wrap { | |
| 2141 word-wrap: break-word; | |
| 2142 } | |
| 2143 </style> | |
| 2144 <nav-bar> | 879 <nav-bar> |
| 2145 <top-nav-menu></top-nav-menu> | 880 <top-nav-menu></top-nav-menu> |
| 2146 <isolate-nav-menu isolate="{{ msg.isolate }}"></isolate-nav-menu> | 881 <isolate-nav-menu isolate="{{ msg.isolate }}"></isolate-nav-menu> |
| 2147 <nav-menu link="{{ gotoLink(msg.isolate.relativeLink('debug/breakpoints'))
}}" anchor="breakpoints" last="{{ true }}"></nav-menu> | 882 <nav-menu link="{{ gotoLink(msg.isolate.relativeLink('debug/breakpoints'))
}}" anchor="breakpoints" last="{{ true }}"></nav-menu> |
| 2148 <nav-refresh callback="{{ refresh }}"></nav-refresh> | 883 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2149 <nav-control></nav-control> | 884 <nav-control></nav-control> |
| 2150 </nav-bar> | 885 </nav-bar> |
| 2151 <template if="{{ msg['breakpoints'].isEmpty }}"> | 886 <template if="{{ msg['breakpoints'].isEmpty }}"> |
| 2152 <div> | 887 <div> |
| 2153 <div>No breakpoints</div> | 888 <div>No breakpoints</div> |
| 2154 </div> | 889 </div> |
| 2155 </template> | 890 </template> |
| 2156 <template if="{{ msg['breakpoints'].isNotEmpty }}"> | 891 <template if="{{ msg['breakpoints'].isNotEmpty }}"> |
| 2157 <ul class="list-group"> | 892 <ul class="list-group"> |
| 2158 <template repeat="{{ bpt in msg['breakpoints'] }}"> | 893 <template repeat="{{ bpt in msg['breakpoints'] }}"> |
| 2159 <li class="list-group-item"> | 894 <li class="list-group-item"> |
| 2160 {{ bpt }} | 895 {{ bpt }} |
| 2161 </li> | 896 </li> |
| 2162 </template> | 897 </template> |
| 2163 </ul> | 898 </ul> |
| 2164 </template> | 899 </template> |
| 2165 </template> | 900 </template> |
| 2166 </polymer-element> | 901 </polymer-element> |
| 902 |
| 903 |
| 904 |
| 905 |
| 906 |
| 907 |
| 908 <polymer-element name="class-ref" extends="service-ref"> |
| 909 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/s
hared.css"><span><a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url
}}">{{ name }}</a></span></template> |
| 910 </polymer-element> |
| 911 |
| 912 |
| 913 |
| 914 |
| 915 |
| 916 |
| 917 |
| 918 |
| 919 <polymer-element name="class-tree" extends="observatory-element"> |
| 920 <template> |
| 921 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 922 <style> |
| 923 .table { |
| 924 border-collapse: collapse!important; |
| 925 width: 100%; |
| 926 margin-bottom: 20px |
| 927 } |
| 928 .table thead > tr > th, |
| 929 .table tbody > tr > th, |
| 930 .table tfoot > tr > th, |
| 931 .table thead > tr > td, |
| 932 .table tbody > tr > td, |
| 933 .table tfoot > tr > td { |
| 934 padding: 8px; |
| 935 vertical-align: top; |
| 936 } |
| 937 .table thead > tr > th { |
| 938 vertical-align: bottom; |
| 939 text-align: left; |
| 940 border-bottom:2px solid #ddd; |
| 941 } |
| 942 |
| 943 tr:hover > td { |
| 944 background-color: #FFF3E3; |
| 945 } |
| 946 .rowColor0 { |
| 947 background-color: #FFE9CC; |
| 948 } |
| 949 .rowColor1 { |
| 950 background-color: #FFDEB2; |
| 951 } |
| 952 .rowColor2 { |
| 953 background-color: #FFD399; |
| 954 } |
| 955 .rowColor3 { |
| 956 background-color: #FFC87F; |
| 957 } |
| 958 .rowColor4 { |
| 959 background-color: #FFBD66; |
| 960 } |
| 961 .rowColor5 { |
| 962 background-color: #FFB24C; |
| 963 } |
| 964 .rowColor6 { |
| 965 background-color: #FFA733; |
| 966 } |
| 967 .rowColor7 { |
| 968 background-color: #FF9C19; |
| 969 } |
| 970 .rowColor8 { |
| 971 background-color: #FF9100; |
| 972 } |
| 973 |
| 974 .tooltip { |
| 975 display: block; |
| 976 position: absolute; |
| 977 visibility: hidden; |
| 978 opacity: 0; |
| 979 transition: visibility 0s linear 0.5s; |
| 980 transition: opacity .4s ease-in-out; |
| 981 } |
| 982 |
| 983 tr:hover .tooltip { |
| 984 display: block; |
| 985 position: absolute; |
| 986 top: 100%; |
| 987 right: 100%; |
| 988 visibility: visible; |
| 989 z-index: 999; |
| 990 width: 400px; |
| 991 color: #ffffff; |
| 992 background-color: #0489c3; |
| 993 border-top-right-radius: 8px; |
| 994 border-top-left-radius: 8px; |
| 995 border-bottom-right-radius: 8px; |
| 996 border-bottom-left-radius: 8px; |
| 997 transition: visibility 0s linear 0.5s; |
| 998 transition: opacity .4s ease-in-out; |
| 999 opacity: 1; |
| 1000 } |
| 1001 |
| 1002 .white { |
| 1003 color: #ffffff; |
| 1004 } |
| 1005 </style> |
| 1006 <nav-bar> |
| 1007 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 1008 <nav-control></nav-control> |
| 1009 </nav-bar> |
| 1010 <div class="content-centered"> |
| 1011 <h1>Class Hierarchy</h1> |
| 1012 <table id="tableTree" class="table"> |
| 1013 <thead> |
| 1014 <tr> |
| 1015 <th>Class</th> |
| 1016 </tr> |
| 1017 </thead> |
| 1018 <tbody> |
| 1019 <tr template="" repeat="{{row in tree.rows }}"> |
| 1020 <td on-click="{{toggleExpanded}}" class="{{ coloring(row) }}" style=
"{{ padding(row) }}"> |
| 1021 <span id="expand" style="{{ row.expanderStyle }}">{{ row.expander
}}</span> |
| 1022 <class-ref ref="{{ row.cls }}"></class-ref> |
| 1023 </td> |
| 1024 </tr> |
| 1025 </tbody> |
| 1026 </table> |
| 1027 </div> |
| 1028 </template> |
| 1029 </polymer-element> |
| 1030 |
| 1031 |
| 1032 |
| 1033 |
| 1034 |
| 1035 |
| 1036 |
| 1037 |
| 1038 |
| 1039 |
| 1040 |
| 1041 |
| 1042 <polymer-element name="error-ref" extends="service-ref"> |
| 1043 <template> |
| 1044 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1045 <style> |
| 1046 .errorBox { |
| 1047 background-color: #f5f5f5; |
| 1048 border: 1px solid #ccc; |
| 1049 padding: 10px; |
| 1050 font-family: consolas, courier, monospace; |
| 1051 font-size: 1em; |
| 1052 line-height: 1.2em; |
| 1053 white-space: pre; |
| 1054 } |
| 1055 </style> |
| 1056 <span> |
| 1057 <pre class="errorBox">{{ ref.kind }}: {{ ref.message }}</pre> |
| 1058 </span> |
| 1059 </template> |
| 1060 </polymer-element> |
| 1061 |
| 1062 |
| 1063 |
| 1064 |
| 1065 <polymer-element name="eval-box" extends="observatory-element"> |
| 1066 <template> |
| 1067 <style> |
| 1068 .textbox { |
| 1069 flex-grow: 1; |
| 1070 font: 400 16px 'Montserrat', sans-serif; |
| 1071 } |
| 1072 .bigtextbox { |
| 1073 font: 400 16px 'Montserrat', sans-serif; |
| 1074 } |
| 1075 .button { |
| 1076 font: 400 16px 'Montserrat', sans-serif; |
| 1077 } |
| 1078 .radios { |
| 1079 display: inline; |
| 1080 padding-right: 30px; |
| 1081 } |
| 1082 .radios label{ |
| 1083 padding-left: 10px; |
| 1084 } |
| 1085 .historyExpr, .historyValue { |
| 1086 vertical-align: text-top; |
| 1087 font: 400 14px 'Montserrat', sans-serif; |
| 1088 } |
| 1089 .historyExpr a { |
| 1090 display: block; |
| 1091 color: black; |
| 1092 text-decoration: none; |
| 1093 padding: 6px 6px; |
| 1094 cursor: pointer; |
| 1095 white-space: pre-line; |
| 1096 } |
| 1097 .historyExpr a:hover { |
| 1098 background-color: #fff3e3; |
| 1099 } |
| 1100 .historyValue { |
| 1101 display: block; |
| 1102 padding: 6px 6px; |
| 1103 } |
| 1104 </style> |
| 1105 <form style="display:flex; flex-direction:row; align-items:flex-end"> |
| 1106 <template if="{{ lineMode == '1-line' }}"> |
| 1107 <input class="textbox" type="text" value="{{ text }}"> |
| 1108 </template> |
| 1109 <template if="{{ lineMode == 'N-line' }}"> |
| 1110 <textarea class="bigtextbox" rows="5" cols="80" value="{{ text }}"></tex
tarea> |
| 1111 </template> |
| 1112 |
| 1113 <input class="button" type="submit" value="Evaluate" on-click="{{ eval }}"
> |
| 1114 <div class="radios" on-change="{{ updateLineMode }}"> |
| 1115 <label for="1-line"> |
| 1116 <input type="radio" name="lineMode" value="1-line" checked=""> |
| 1117 1-line |
| 1118 </label> |
| 1119 <label for="N-line"> |
| 1120 <input type="radio" name="lineMode" value="N-line"> |
| 1121 N-line |
| 1122 </label> |
| 1123 </div> |
| 1124 </form> |
| 1125 |
| 1126 <br> |
| 1127 <template if="{{ results.isNotEmpty }}"> |
| 1128 <table> |
| 1129 <tbody><tr template="" repeat="{{ result in results }}"> |
| 1130 <td class="historyExpr"> |
| 1131 <a class="expr" on-click="{{ selectExpr }}" expr="{{ result['expr']
}}">{{ result['expr'] }}</a> |
| 1132 </td> |
| 1133 <td class="historyValue"> |
| 1134 <template if="{{ result['value'] == null }}"> |
| 1135 <div style="color:#aaa;cursor:wait;"><pending></div> |
| 1136 </template> |
| 1137 <template if="{{ result['value'] != null }}"> |
| 1138 <any-service-ref ref="{{ result['value'] }}"></any-service-ref> |
| 1139 </template> |
| 1140 </td> |
| 1141 </tr> |
| 1142 </tbody></table> |
| 1143 </template> |
| 1144 </template> |
| 1145 </polymer-element> |
| 1146 |
| 1147 |
| 1148 |
| 1149 |
| 1150 |
| 1151 |
| 1152 |
| 1153 <polymer-element name="eval-link"> |
| 1154 <template> |
| 1155 <style> |
| 1156 .idle { |
| 1157 color: #0489c3; |
| 1158 cursor: pointer; |
| 1159 } |
| 1160 .busy { |
| 1161 color: #aaa; |
| 1162 cursor: wait; |
| 1163 } |
| 1164 </style> |
| 1165 |
| 1166 <template if="{{ busy }}"> |
| 1167 <span class="busy">{{ label }}</span> |
| 1168 </template> |
| 1169 <template if="{{ !busy }}"> |
| 1170 <span class="idle"><a on-click="{{ evalNow }}">{{ label }}</a></span> |
| 1171 </template> |
| 1172 <template if="{{ result != null }}"> |
| 1173 = <any-service-ref ref="{{ result }}"></any-service-ref> |
| 1174 </template> |
| 1175 </template> |
| 1176 </polymer-element> |
| 2167 | 1177 |
| 2168 | 1178 |
| 2169 | 1179 |
| 2170 | 1180 |
| 2171 | 1181 |
| 2172 | 1182 |
| 2173 <polymer-element name="class-ref" extends="service-ref"> | 1183 |
| 2174 <template><style>/* Global styles */ | 1184 |
| 2175 * { | 1185 <polymer-element name="field-ref" extends="service-ref"> |
| 2176 margin: 0; | 1186 <template> |
| 2177 padding: 0; | 1187 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"
> |
| 2178 font: 400 14px 'Montserrat', sans-serif; | 1188 <span> |
| 2179 color: #333; | 1189 <template if="{{ ref.isStatic] }}">static</template> |
| 2180 box-sizing: border-box; | 1190 <template if="{{ ref.isFinal }}">final</template> |
| 2181 } | 1191 <template if="{{ ref.isConst }}">const</template> |
| 2182 | 1192 <template if="{{ (ref.declaredType.name == 'dynamic' && |
| 2183 .content { | 1193 !ref.isFinal && !ref.isConst) }}"> |
| 2184 padding-left: 10%; | 1194 var |
| 2185 font: 400 14px 'Montserrat', sans-serif; | 1195 </template> |
| 2186 } | 1196 <template if="{{ (ref.declaredType.name != 'dynamic') }}"> |
| 2187 | 1197 <instance-ref ref="{{ ref.declaredType }}"></instance-ref> |
| 2188 .content-centered { | 1198 </template> |
| 2189 padding-left: 10%; | 1199 <a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url }}">{{ name
}}</a> |
| 2190 padding-right: 10%; | 1200 </span> |
| 2191 font: 400 14px 'Montserrat', sans-serif; | 1201 </template> |
| 2192 } | 1202 </polymer-element> |
| 2193 | 1203 |
| 2194 .content-centered-big { | 1204 |
| 2195 padding-left: 5%; | 1205 |
| 2196 padding-right: 5%; | 1206 |
| 2197 font: 400 14px 'Montserrat', sans-serif; | 1207 |
| 2198 } | 1208 |
| 2199 | 1209 |
| 2200 h1 { | 1210 <polymer-element name="function-ref" extends="service-ref"> |
| 2201 font: 400 18px 'Montserrat', sans-serif; | 1211 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/s
hared.css"><!-- These comments are here to allow newlines. |
| 2202 } | 1212 --><template if="{{ ref.isDart }}"><!-- |
| 2203 | 1213 --><template if="{{ qualified && ref.parent == null && re
f.owningClass != null }}"><!-- |
| 2204 .memberList { | 1214 --><class-ref ref="{{ ref.owningClass] }}"></class-ref>.</template><!-- |
| 2205 display: table; | 1215 --><template if="{{ qualified && ref.parent != null }}"><!-- |
| 2206 } | 1216 --><function-ref ref="{{ ref.parent }}" qualified="{{ true }}"> |
| 2207 | 1217 </function-ref>.<!-- |
| 2208 .memberItem { | 1218 --></template><a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a><!-- |
| 2209 display: table-row; | 1219 --></template><template if="{{ !ref.isDart }}"><span> {{ name }}</span></templ
ate></template> |
| 2210 } | 1220 </polymer-element> |
| 2211 | 1221 |
| 2212 .memberName, .memberValue { | 1222 |
| 2213 display: table-cell; | 1223 |
| 2214 vertical-align: top; | 1224 |
| 2215 padding: 3px 0 3px 1em; | 1225 |
| 2216 font: 400 14px 'Montserrat', sans-serif; | 1226 |
| 2217 } | 1227 <polymer-element name="library-ref" extends="service-ref"> |
| 2218 | 1228 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/s
hared.css"> |
| 2219 .memberSmall { | 1229 <template if="{{ nameIsEmpty }}"> |
| 2220 display: table-cell; | 1230 <a on-click="{{ goto }}" _href="{{ url }}">unnamed</a> |
| 2221 vertical-align: top; | 1231 </template> |
| 2222 padding: 3px 0 3px 1em; | 1232 <template if="{{ !nameIsEmpty }}"> |
| 2223 font: 400 12px 'Montserrat', sans-serif; | 1233 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2224 } | 1234 </template> |
| 2225 | 1235 </template> |
| 2226 .monospace { | 1236 </polymer-element> |
| 2227 font-family: consolas, courier, monospace; | 1237 |
| 2228 font-size: 1em; | 1238 |
| 2229 line-height: 1.2em; | 1239 |
| 2230 white-space: nowrap; | 1240 |
| 2231 } | 1241 |
| 2232 | 1242 |
| 2233 a { | 1243 |
| 2234 color: #0489c3; | 1244 <polymer-element name="script-inset" extends="observatory-element"> |
| 2235 text-decoration: none; | 1245 <template> |
| 2236 } | |
| 2237 | |
| 2238 a:hover { | |
| 2239 text-decoration: underline; | |
| 2240 } | |
| 2241 | |
| 2242 em { | |
| 2243 color: inherit; | |
| 2244 font-style: italic; | |
| 2245 } | |
| 2246 | |
| 2247 b { | |
| 2248 color: inherit; | |
| 2249 font-weight: bold; | |
| 2250 } | |
| 2251 | |
| 2252 hr { | |
| 2253 margin-top: 20px; | |
| 2254 margin-bottom: 20px; | |
| 2255 border: 0; | |
| 2256 border-top: 1px solid #eee; | |
| 2257 height: 0; | |
| 2258 box-sizing: content-box; | |
| 2259 } | |
| 2260 | |
| 2261 .list-group { | |
| 2262 padding-left: 0; | |
| 2263 margin-bottom: 20px; | |
| 2264 } | |
| 2265 | |
| 2266 .list-group-item { | |
| 2267 position: relative; | |
| 2268 display: block; | |
| 2269 padding: 10px 15px; | |
| 2270 margin-bottom: -1px; | |
| 2271 background-color: #fff; | |
| 2272 } | |
| 2273 | |
| 2274 .list-group-item:first-child { | |
| 2275 /* rounded top corners */ | |
| 2276 border-top-right-radius:4px; | |
| 2277 border-top-left-radius:4px; | |
| 2278 } | |
| 2279 | |
| 2280 .list-group-item:last-child { | |
| 2281 margin-bottom: 0; | |
| 2282 /* rounded bottom corners */ | |
| 2283 border-bottom-right-radius: 4px; | |
| 2284 border-bottom-left-radius:4px; | |
| 2285 } | |
| 2286 | |
| 2287 /* Flex row container */ | |
| 2288 .flex-row { | |
| 2289 display: flex; | |
| 2290 flex-direction: row; | |
| 2291 } | |
| 2292 | |
| 2293 /* Flex column container */ | |
| 2294 .flex-column { | |
| 2295 display: flex; | |
| 2296 flex-direction: column; | |
| 2297 } | |
| 2298 | |
| 2299 .flex-item-fit { | |
| 2300 flex-grow: 1; | |
| 2301 flex-shrink: 1; | |
| 2302 flex-basis: auto; | |
| 2303 } | |
| 2304 | |
| 2305 .flex-item-no-shrink { | |
| 2306 flex-grow: 0; | |
| 2307 flex-shrink: 0; | |
| 2308 flex-basis: auto; | |
| 2309 } | |
| 2310 | |
| 2311 .flex-item-fill { | |
| 2312 flex-grow: 0; | |
| 2313 flex-shrink: 1; /* shrink when pressured */ | |
| 2314 flex-basis: 100%; /* try and take 100% */ | |
| 2315 } | |
| 2316 | |
| 2317 .flex-item-fixed-1-12 { | |
| 2318 flex-grow: 0; | |
| 2319 flex-shrink: 0; | |
| 2320 flex-basis: 8.3%; | |
| 2321 } | |
| 2322 | |
| 2323 .flex-item-fixed-2-12 { | |
| 2324 flex-grow: 0; | |
| 2325 flex-shrink: 0; | |
| 2326 flex-basis: 16.6%; | |
| 2327 } | |
| 2328 | |
| 2329 .flex-item-fixed-4-12 { | |
| 2330 flex-grow: 0; | |
| 2331 flex-shrink: 0; | |
| 2332 flex-basis: 33.3333%; | |
| 2333 } | |
| 2334 | |
| 2335 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 2336 flex-grow: 0; | |
| 2337 flex-shrink: 0; | |
| 2338 flex-basis: 50%; | |
| 2339 } | |
| 2340 | |
| 2341 .flex-item-fixed-8-12 { | |
| 2342 flex-grow: 0; | |
| 2343 flex-shrink: 0; | |
| 2344 flex-basis: 66.6666%; | |
| 2345 } | |
| 2346 | |
| 2347 .flex-item-fixed-9-12 { | |
| 2348 flex-grow: 0; | |
| 2349 flex-shrink: 0; | |
| 2350 flex-basis: 75%; | |
| 2351 } | |
| 2352 | |
| 2353 | |
| 2354 .flex-item-fixed-12-12 { | |
| 2355 flex-grow: 0; | |
| 2356 flex-shrink: 0; | |
| 2357 flex-basis: 100%; | |
| 2358 } | |
| 2359 | |
| 2360 .flex-item-10-percent { | |
| 2361 flex-grow: 0; | |
| 2362 flex-shrink: 0; | |
| 2363 flex-basis: 10%; | |
| 2364 } | |
| 2365 | |
| 2366 .flex-item-15-percent { | |
| 2367 flex-grow: 0; | |
| 2368 flex-shrink: 0; | |
| 2369 flex-basis: 15%; | |
| 2370 } | |
| 2371 | |
| 2372 .flex-item-20-percent { | |
| 2373 flex-grow: 0; | |
| 2374 flex-shrink: 0; | |
| 2375 flex-basis: 20%; | |
| 2376 } | |
| 2377 | |
| 2378 .flex-item-30-percent { | |
| 2379 flex-grow: 0; | |
| 2380 flex-shrink: 0; | |
| 2381 flex-basis: 30%; | |
| 2382 } | |
| 2383 | |
| 2384 .flex-item-40-percent { | |
| 2385 flex-grow: 0; | |
| 2386 flex-shrink: 0; | |
| 2387 flex-basis: 40%; | |
| 2388 } | |
| 2389 | |
| 2390 .flex-item-50-percent { | |
| 2391 flex-grow: 0; | |
| 2392 flex-shrink: 0; | |
| 2393 flex-basis: 50%; | |
| 2394 } | |
| 2395 | |
| 2396 .flex-item-60-percent { | |
| 2397 flex-grow: 0; | |
| 2398 flex-shrink: 0; | |
| 2399 flex-basis: 60%; | |
| 2400 } | |
| 2401 | |
| 2402 .flex-item-70-percent { | |
| 2403 flex-grow: 0; | |
| 2404 flex-shrink: 0; | |
| 2405 flex-basis: 70%; | |
| 2406 } | |
| 2407 | |
| 2408 .flex-item-80-percent { | |
| 2409 flex-grow: 0; | |
| 2410 flex-shrink: 0; | |
| 2411 flex-basis: 80%; | |
| 2412 } | |
| 2413 | |
| 2414 .well { | |
| 2415 min-height: 20px; | |
| 2416 padding: 19px; | |
| 2417 margin-bottom: 20px; | |
| 2418 background-color: #f5f5f5; | |
| 2419 border: 1px solid #e3e3e3; | |
| 2420 border-radius: 4px; | |
| 2421 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 2422 } | |
| 2423 | |
| 2424 .break-wrap { | |
| 2425 word-wrap: break-word; | |
| 2426 } | |
| 2427 </style><span><a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url }}"
>{{ name }}</a></span></template> | |
| 2428 </polymer-element> | |
| 2429 | |
| 2430 | |
| 2431 | |
| 2432 | |
| 2433 | |
| 2434 | |
| 2435 | |
| 2436 | |
| 2437 <polymer-element name="class-tree" extends="observatory-element"> | |
| 2438 <template> | |
| 2439 <style>/* Global styles */ | |
| 2440 * { | |
| 2441 margin: 0; | |
| 2442 padding: 0; | |
| 2443 font: 400 14px 'Montserrat', sans-serif; | |
| 2444 color: #333; | |
| 2445 box-sizing: border-box; | |
| 2446 } | |
| 2447 | |
| 2448 .content { | |
| 2449 padding-left: 10%; | |
| 2450 font: 400 14px 'Montserrat', sans-serif; | |
| 2451 } | |
| 2452 | |
| 2453 .content-centered { | |
| 2454 padding-left: 10%; | |
| 2455 padding-right: 10%; | |
| 2456 font: 400 14px 'Montserrat', sans-serif; | |
| 2457 } | |
| 2458 | |
| 2459 .content-centered-big { | |
| 2460 padding-left: 5%; | |
| 2461 padding-right: 5%; | |
| 2462 font: 400 14px 'Montserrat', sans-serif; | |
| 2463 } | |
| 2464 | |
| 2465 h1 { | |
| 2466 font: 400 18px 'Montserrat', sans-serif; | |
| 2467 } | |
| 2468 | |
| 2469 .memberList { | |
| 2470 display: table; | |
| 2471 } | |
| 2472 | |
| 2473 .memberItem { | |
| 2474 display: table-row; | |
| 2475 } | |
| 2476 | |
| 2477 .memberName, .memberValue { | |
| 2478 display: table-cell; | |
| 2479 vertical-align: top; | |
| 2480 padding: 3px 0 3px 1em; | |
| 2481 font: 400 14px 'Montserrat', sans-serif; | |
| 2482 } | |
| 2483 | |
| 2484 .memberSmall { | |
| 2485 display: table-cell; | |
| 2486 vertical-align: top; | |
| 2487 padding: 3px 0 3px 1em; | |
| 2488 font: 400 12px 'Montserrat', sans-serif; | |
| 2489 } | |
| 2490 | |
| 2491 .monospace { | |
| 2492 font-family: consolas, courier, monospace; | |
| 2493 font-size: 1em; | |
| 2494 line-height: 1.2em; | |
| 2495 white-space: nowrap; | |
| 2496 } | |
| 2497 | |
| 2498 a { | |
| 2499 color: #0489c3; | |
| 2500 text-decoration: none; | |
| 2501 } | |
| 2502 | |
| 2503 a:hover { | |
| 2504 text-decoration: underline; | |
| 2505 } | |
| 2506 | |
| 2507 em { | |
| 2508 color: inherit; | |
| 2509 font-style: italic; | |
| 2510 } | |
| 2511 | |
| 2512 b { | |
| 2513 color: inherit; | |
| 2514 font-weight: bold; | |
| 2515 } | |
| 2516 | |
| 2517 hr { | |
| 2518 margin-top: 20px; | |
| 2519 margin-bottom: 20px; | |
| 2520 border: 0; | |
| 2521 border-top: 1px solid #eee; | |
| 2522 height: 0; | |
| 2523 box-sizing: content-box; | |
| 2524 } | |
| 2525 | |
| 2526 .list-group { | |
| 2527 padding-left: 0; | |
| 2528 margin-bottom: 20px; | |
| 2529 } | |
| 2530 | |
| 2531 .list-group-item { | |
| 2532 position: relative; | |
| 2533 display: block; | |
| 2534 padding: 10px 15px; | |
| 2535 margin-bottom: -1px; | |
| 2536 background-color: #fff; | |
| 2537 } | |
| 2538 | |
| 2539 .list-group-item:first-child { | |
| 2540 /* rounded top corners */ | |
| 2541 border-top-right-radius:4px; | |
| 2542 border-top-left-radius:4px; | |
| 2543 } | |
| 2544 | |
| 2545 .list-group-item:last-child { | |
| 2546 margin-bottom: 0; | |
| 2547 /* rounded bottom corners */ | |
| 2548 border-bottom-right-radius: 4px; | |
| 2549 border-bottom-left-radius:4px; | |
| 2550 } | |
| 2551 | |
| 2552 /* Flex row container */ | |
| 2553 .flex-row { | |
| 2554 display: flex; | |
| 2555 flex-direction: row; | |
| 2556 } | |
| 2557 | |
| 2558 /* Flex column container */ | |
| 2559 .flex-column { | |
| 2560 display: flex; | |
| 2561 flex-direction: column; | |
| 2562 } | |
| 2563 | |
| 2564 .flex-item-fit { | |
| 2565 flex-grow: 1; | |
| 2566 flex-shrink: 1; | |
| 2567 flex-basis: auto; | |
| 2568 } | |
| 2569 | |
| 2570 .flex-item-no-shrink { | |
| 2571 flex-grow: 0; | |
| 2572 flex-shrink: 0; | |
| 2573 flex-basis: auto; | |
| 2574 } | |
| 2575 | |
| 2576 .flex-item-fill { | |
| 2577 flex-grow: 0; | |
| 2578 flex-shrink: 1; /* shrink when pressured */ | |
| 2579 flex-basis: 100%; /* try and take 100% */ | |
| 2580 } | |
| 2581 | |
| 2582 .flex-item-fixed-1-12 { | |
| 2583 flex-grow: 0; | |
| 2584 flex-shrink: 0; | |
| 2585 flex-basis: 8.3%; | |
| 2586 } | |
| 2587 | |
| 2588 .flex-item-fixed-2-12 { | |
| 2589 flex-grow: 0; | |
| 2590 flex-shrink: 0; | |
| 2591 flex-basis: 16.6%; | |
| 2592 } | |
| 2593 | |
| 2594 .flex-item-fixed-4-12 { | |
| 2595 flex-grow: 0; | |
| 2596 flex-shrink: 0; | |
| 2597 flex-basis: 33.3333%; | |
| 2598 } | |
| 2599 | |
| 2600 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 2601 flex-grow: 0; | |
| 2602 flex-shrink: 0; | |
| 2603 flex-basis: 50%; | |
| 2604 } | |
| 2605 | |
| 2606 .flex-item-fixed-8-12 { | |
| 2607 flex-grow: 0; | |
| 2608 flex-shrink: 0; | |
| 2609 flex-basis: 66.6666%; | |
| 2610 } | |
| 2611 | |
| 2612 .flex-item-fixed-9-12 { | |
| 2613 flex-grow: 0; | |
| 2614 flex-shrink: 0; | |
| 2615 flex-basis: 75%; | |
| 2616 } | |
| 2617 | |
| 2618 | |
| 2619 .flex-item-fixed-12-12 { | |
| 2620 flex-grow: 0; | |
| 2621 flex-shrink: 0; | |
| 2622 flex-basis: 100%; | |
| 2623 } | |
| 2624 | |
| 2625 .flex-item-10-percent { | |
| 2626 flex-grow: 0; | |
| 2627 flex-shrink: 0; | |
| 2628 flex-basis: 10%; | |
| 2629 } | |
| 2630 | |
| 2631 .flex-item-15-percent { | |
| 2632 flex-grow: 0; | |
| 2633 flex-shrink: 0; | |
| 2634 flex-basis: 15%; | |
| 2635 } | |
| 2636 | |
| 2637 .flex-item-20-percent { | |
| 2638 flex-grow: 0; | |
| 2639 flex-shrink: 0; | |
| 2640 flex-basis: 20%; | |
| 2641 } | |
| 2642 | |
| 2643 .flex-item-30-percent { | |
| 2644 flex-grow: 0; | |
| 2645 flex-shrink: 0; | |
| 2646 flex-basis: 30%; | |
| 2647 } | |
| 2648 | |
| 2649 .flex-item-40-percent { | |
| 2650 flex-grow: 0; | |
| 2651 flex-shrink: 0; | |
| 2652 flex-basis: 40%; | |
| 2653 } | |
| 2654 | |
| 2655 .flex-item-50-percent { | |
| 2656 flex-grow: 0; | |
| 2657 flex-shrink: 0; | |
| 2658 flex-basis: 50%; | |
| 2659 } | |
| 2660 | |
| 2661 .flex-item-60-percent { | |
| 2662 flex-grow: 0; | |
| 2663 flex-shrink: 0; | |
| 2664 flex-basis: 60%; | |
| 2665 } | |
| 2666 | |
| 2667 .flex-item-70-percent { | |
| 2668 flex-grow: 0; | |
| 2669 flex-shrink: 0; | |
| 2670 flex-basis: 70%; | |
| 2671 } | |
| 2672 | |
| 2673 .flex-item-80-percent { | |
| 2674 flex-grow: 0; | |
| 2675 flex-shrink: 0; | |
| 2676 flex-basis: 80%; | |
| 2677 } | |
| 2678 | |
| 2679 .well { | |
| 2680 min-height: 20px; | |
| 2681 padding: 19px; | |
| 2682 margin-bottom: 20px; | |
| 2683 background-color: #f5f5f5; | |
| 2684 border: 1px solid #e3e3e3; | |
| 2685 border-radius: 4px; | |
| 2686 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 2687 } | |
| 2688 | |
| 2689 .break-wrap { | |
| 2690 word-wrap: break-word; | |
| 2691 } | |
| 2692 </style> | |
| 2693 <style> | 1246 <style> |
| 2694 .table { | 1247 .sourceInset { |
| 2695 border-collapse: collapse!important; | 1248 } |
| 2696 width: 100%; | 1249 .sourceBox { |
| 2697 margin-bottom: 20px | 1250 background-color: #f5f5f5; |
| 2698 } | 1251 border: 1px solid #ccc; |
| 2699 .table thead > tr > th, | 1252 padding: 10px; |
| 2700 .table tbody > tr > th, | 1253 overflow-y: auto; |
| 2701 .table tfoot > tr > th, | 1254 } |
| 2702 .table thead > tr > td, | 1255 .sourceTable { |
| 2703 .table tbody > tr > td, | 1256 display: table; |
| 2704 .table tfoot > tr > td { | 1257 } |
| 2705 padding: 8px; | 1258 .sourceRow { |
| 1259 display: table-row; |
| 1260 } |
| 1261 .sourceItem, .sourceItemCurrent { |
| 1262 display: table-cell; |
| 2706 vertical-align: top; | 1263 vertical-align: top; |
| 2707 } | 1264 font: 400 14px consolas, courier, monospace; |
| 2708 .table thead > tr > th { | 1265 line-height: 125%; |
| 2709 vertical-align: bottom; | 1266 white-space: pre; |
| 2710 text-align: left; | 1267 } |
| 2711 border-bottom:2px solid #ddd; | 1268 .sourceItemCurrent { |
| 2712 } | 1269 background-color: #6cf; |
| 2713 | 1270 } |
| 2714 tr:hover > td { | 1271 .hitsNone, .hitsNotExecuted, .hitsExecuted { |
| 1272 min-width: 32px; |
| 1273 text-align: right; |
| 1274 } |
| 1275 .hitsNotExecuted { |
| 1276 background-color: #e66; |
| 1277 } |
| 1278 .hitsExecuted { |
| 1279 background-color: #6d6; |
| 1280 } |
| 1281 </style> |
| 1282 <div class="sourceInset"> |
| 1283 <content></content> |
| 1284 <div class="sourceBox" style="max-height:{{height}}"> |
| 1285 <div class="sourceTable"> |
| 1286 <template if="{{ linesReady }}"> |
| 1287 <template repeat="{{ line in lines }}"> |
| 1288 <div class="sourceRow" id="{{ makeLineId(line.line) }}"> |
| 1289 <breakpoint-toggle line="{{ line }}"></breakpoint-toggle> |
| 1290 |
| 1291 <div class="sourceItem"> </div> |
| 1292 |
| 1293 <template if="{{ line.hits == null || |
| 1294 line.hits < 0 }}"> |
| 1295 <div class="hitsNone">{{ line.line }}</div> |
| 1296 </template> |
| 1297 <template if="{{ line.hits == 0 }}"> |
| 1298 <div class="hitsNotExecuted">{{ line.line }}</div> |
| 1299 </template> |
| 1300 <template if="{{ line.hits > 0 }}"> |
| 1301 <div class="hitsExecuted">{{ line.line }}</div> |
| 1302 </template> |
| 1303 |
| 1304 <div class="sourceItem"> </div> |
| 1305 |
| 1306 <template if="{{ line.line == currentLine }}"> |
| 1307 <div class="sourceItemCurrent">{{line.text}}</div> |
| 1308 </template> |
| 1309 <template if="{{ line.line != currentLine }}"> |
| 1310 <div class="sourceItem">{{line.text}}</div> |
| 1311 </template> |
| 1312 </div> |
| 1313 </template> |
| 1314 </template> |
| 1315 |
| 1316 <template if="{{ !linesReady }}"> |
| 1317 <div class="sourceRow"> |
| 1318 <div class="sourceItem">loading...</div> |
| 1319 </div> |
| 1320 </template> |
| 1321 </div> |
| 1322 </div> |
| 1323 </div> |
| 1324 </template> |
| 1325 </polymer-element> |
| 1326 |
| 1327 <polymer-element name="breakpoint-toggle" extends="observatory-element"> |
| 1328 <template> |
| 1329 <style> |
| 1330 .emptyBreakpoint, .possibleBreakpoint, .busyBreakpoint, .unresolvedBreakpo
int, .resolvedBreakpoint { |
| 1331 display: table-cell; |
| 1332 vertical-align: top; |
| 1333 font: 400 14px consolas, courier, monospace; |
| 1334 min-width: 1em; |
| 1335 text-align: center; |
| 1336 cursor: pointer; |
| 1337 } |
| 1338 .possibleBreakpoint { |
| 1339 color: #e0e0e0; |
| 1340 } |
| 1341 .possibleBreakpoint:hover { |
| 1342 color: white; |
| 1343 background-color: #777; |
| 1344 } |
| 1345 .busyBreakpoint { |
| 1346 color: white; |
| 1347 background-color: black; |
| 1348 cursor: wait; |
| 1349 } |
| 1350 .unresolvedBreakpoint { |
| 1351 color: white; |
| 1352 background-color: #cac; |
| 1353 } |
| 1354 .resolvedBreakpoint { |
| 1355 color: white; |
| 1356 background-color: #e66; |
| 1357 } |
| 1358 </style> |
| 1359 |
| 1360 <template if="{{ line.possibleBpt && busy}}"> |
| 1361 <div class="busyBreakpoint">B</div> |
| 1362 </template> |
| 1363 |
| 1364 <template if="{{ line.bpt == null && !line.possibleBpt }}"> |
| 1365 <div class="emptyBreakpoint"> </div> |
| 1366 </template> |
| 1367 |
| 1368 <template if="{{ line.bpt == null && line.possibleBpt && !bu
sy}}"> |
| 1369 <div class="possibleBreakpoint"> |
| 1370 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 1371 </div> |
| 1372 </template> |
| 1373 |
| 1374 <template if="{{ line.bpt != null && !line.bpt['resolved'] &&
; !busy}}"> |
| 1375 <div class="unresolvedBreakpoint"> |
| 1376 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 1377 </div> |
| 1378 </template> |
| 1379 |
| 1380 <template if="{{ line.bpt != null && line.bpt['resolved'] &&
!busy}}"> |
| 1381 <div class="resolvedBreakpoint"> |
| 1382 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 1383 </div> |
| 1384 </template> |
| 1385 |
| 1386 </template> |
| 1387 </polymer-element> |
| 1388 |
| 1389 |
| 1390 |
| 1391 |
| 1392 |
| 1393 |
| 1394 |
| 1395 <polymer-element name="script-ref" extends="service-ref"> |
| 1396 <template> |
| 1397 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"
> |
| 1398 <a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url }}">{{ name }}<
/a> |
| 1399 </template> |
| 1400 </polymer-element> |
| 1401 |
| 1402 |
| 1403 |
| 1404 |
| 1405 <polymer-element name="class-view" extends="observatory-element"> |
| 1406 <template> |
| 1407 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1408 <nav-bar> |
| 1409 <top-nav-menu></top-nav-menu> |
| 1410 <isolate-nav-menu isolate="{{ cls.isolate }}"></isolate-nav-menu> |
| 1411 <library-nav-menu library="{{ cls.library }}"></library-nav-menu> |
| 1412 <class-nav-menu cls="{{ cls }}" last="{{ true }}"></class-nav-menu> |
| 1413 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> |
| 1414 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 1415 <nav-control></nav-control> |
| 1416 </nav-bar> |
| 1417 |
| 1418 <div class="content"> |
| 1419 <h1> |
| 1420 <template if="{{ cls.isAbstract }}"> |
| 1421 abstract |
| 1422 </template> |
| 1423 <template if="{{ cls.isPatch }}"> |
| 1424 patch |
| 1425 </template> |
| 1426 class {{ cls.name }} |
| 1427 </h1> |
| 1428 <div class="memberList"> |
| 1429 <div class="memberItem"> |
| 1430 <div class="memberName">library</div> |
| 1431 <div class="memberValue"> |
| 1432 <library-ref ref="{{ cls.library }}"></library-ref> |
| 1433 </div> |
| 1434 </div> |
| 1435 <div class="memberItem"> |
| 1436 <div class="memberName">script</div> |
| 1437 <div class="memberValue"> |
| 1438 <script-ref ref="{{ cls.script }}" pos="{{ cls.tokenPos }}"> |
| 1439 </script-ref> |
| 1440 </div> |
| 1441 </div> |
| 1442 |
| 1443 <div class="memberItem"> </div> |
| 1444 |
| 1445 <template if="{{ cls.superclass != null }}"> |
| 1446 <div class="memberItem"> |
| 1447 <div class="memberName">extends</div> |
| 1448 <div class="memberValue"> |
| 1449 <class-ref ref="{{ cls.superclass }}"></class-ref> |
| 1450 </div> |
| 1451 </div> |
| 1452 </template> |
| 1453 <template if="{{ cls.subclasses.length > 0 }}"> |
| 1454 <div class="memberItem"> |
| 1455 <div class="memberName">extended by</div> |
| 1456 <div class="memberValue"> |
| 1457 <template repeat="{{ subclass in cls.subclasses }}"> |
| 1458 <class-ref ref="{{ subclass }}"></class-ref> |
| 1459 </template> |
| 1460 </div> |
| 1461 </div> |
| 1462 </template> |
| 1463 |
| 1464 <div class="memberItem"> </div> |
| 1465 |
| 1466 <template if="{{ cls.interfaces.length > 0 }}"> |
| 1467 <div class="memberItem"> |
| 1468 <div class="memberName">implements</div> |
| 1469 <div class="memberValue"> |
| 1470 <template repeat="{{ interface in cls.interfaces }}"> |
| 1471 <class-ref ref="{{ interface }}"></class-ref> |
| 1472 </template> |
| 1473 </div> |
| 1474 </div> |
| 1475 </template> |
| 1476 <template if="{{ cls.name != cls.vmName }}"> |
| 1477 <div class="memberItem"> |
| 1478 <div class="memberName">vm name</div> |
| 1479 <div class="memberValue">{{ cls.vmName }}</div> |
| 1480 </div> |
| 1481 </template> |
| 1482 </div> |
| 1483 </div> |
| 1484 |
| 1485 <template if="{{ cls.error != null }}"> |
| 1486 <error-ref ref="{{ cls.error }}"></error-ref> |
| 1487 </template> |
| 1488 |
| 1489 <hr> |
| 1490 |
| 1491 <div class="content"> |
| 1492 <template if="{{ cls.fields.isNotEmpty }}"> |
| 1493 fields ({{ cls.fields.length }}) |
| 1494 <curly-block expand="{{ cls.fields.length <= 8 }}"> |
| 1495 <div class="memberList"> |
| 1496 <template repeat="{{ field in cls.fields }}"> |
| 1497 <div class="memberItem"> |
| 1498 <div class="memberName"> |
| 1499 <field-ref ref="{{ field }}"></field-ref> |
| 1500 </div> |
| 1501 <div class="memberValue"> |
| 1502 <template if="{{ field.value != null }}"> |
| 1503 <any-service-ref ref="{{ field.value }}"></any-service-ref> |
| 1504 </template> |
| 1505 </div> |
| 1506 </div> |
| 1507 </template> |
| 1508 </div> |
| 1509 </curly-block><br><br> |
| 1510 </template> |
| 1511 |
| 1512 <template if="{{ cls.functions.isNotEmpty }}"> |
| 1513 functions ({{ cls.functions.length }}) |
| 1514 <curly-block expand="{{ cls.functions.length <= 8 }}"> |
| 1515 <div class="memberList"> |
| 1516 <template repeat="{{ function in cls.functions }}"> |
| 1517 <div class="memberItem"> |
| 1518 <div class="memberValue"> |
| 1519 <function-ref ref="{{ function }}" qualified="{{ false }}"> |
| 1520 </function-ref> |
| 1521 </div> |
| 1522 </div> |
| 1523 </template> |
| 1524 </div> |
| 1525 </curly-block><br><br> |
| 1526 </template> |
| 1527 |
| 1528 <template if="{{ !cls.hasNoAllocations }}"> |
| 1529 instances |
| 1530 <div class="memberItem"> |
| 1531 <div class="memberName">currently allocated</div> |
| 1532 <div class="memberValue"> |
| 1533 count {{ cls.newSpace.current.instances + cls.oldSpace.current.ins
tances }} |
| 1534 (shallow size {{ cls.newSpace.current.bytes + cls.oldSpace.current
.bytes | formatSize }}) |
| 1535 </div> |
| 1536 </div> |
| 1537 <div class="memberItem"> |
| 1538 <div class="memberName">strongly reachable</div> |
| 1539 <div class="memberValue"> |
| 1540 <template if="{{ instances == null }}"> |
| 1541 <eval-link callback="{{ reachable }}" label="[find]" expr="100"> |
| 1542 </eval-link> |
| 1543 </template> |
| 1544 <template if="{{ instances != null }}"> |
| 1545 sample |
| 1546 <any-service-ref ref="{{ instances['sample'] }}"></any-service-r
ef> |
| 1547 <template if="{{ instances['totalCount'] > instances['sampleCoun
t'] }}"> |
| 1548 <eval-link callback="{{ reachable }}" label="[more]" expr="{{
instances['sampleCount'] * 2 }}"> |
| 1549 </eval-link> |
| 1550 </template> |
| 1551 of total {{ instances['totalCount'] }} |
| 1552 </template> |
| 1553 </div> |
| 1554 </div> |
| 1555 <div class="memberItem"> |
| 1556 <div class="memberName">retained size</div> |
| 1557 <div class="memberValue"> |
| 1558 <template if="{{ retainedBytes == null }}"> |
| 1559 <eval-link callback="{{ retainedSize }}" label="[calculate]"> |
| 1560 </eval-link> |
| 1561 </template> |
| 1562 <template if="{{ retainedBytes != null }}"> |
| 1563 {{ retainedBytes | formatSize }} |
| 1564 </template> |
| 1565 </div> |
| 1566 </div> |
| 1567 </template> |
| 1568 </div> |
| 1569 |
| 1570 <hr> |
| 1571 |
| 1572 <div class="content"> |
| 1573 <eval-box callback="{{ eval }}"></eval-box> |
| 1574 </div> |
| 1575 |
| 1576 <hr> |
| 1577 <script-inset script="{{ cls.script }}" startpos="{{ cls.tokenPos }}" endpos
="{{ cls.endTokenPos }}"> |
| 1578 </script-inset> |
| 1579 |
| 1580 <br><br><br><br> |
| 1581 <br><br><br><br> |
| 1582 </template> |
| 1583 </polymer-element> |
| 1584 |
| 1585 |
| 1586 |
| 1587 |
| 1588 |
| 1589 |
| 1590 <polymer-element name="code-ref" extends="service-ref"> |
| 1591 <template> |
| 1592 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1593 <template if="{{ code.isDartCode }}"> |
| 1594 <template if="{{ code.isOptimized }}"> |
| 1595 <a on-click="{{ goto }}" _href="{{ url }}">*{{ name }}</a> |
| 1596 </template> |
| 1597 <template if="{{ !code.isOptimized }}"> |
| 1598 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 1599 </template> |
| 1600 </template> |
| 1601 <template if="{{ !code.isDartCode }}"> |
| 1602 <span>{{ name }}</span> |
| 1603 </template> |
| 1604 </template> |
| 1605 </polymer-element> |
| 1606 |
| 1607 |
| 1608 |
| 1609 |
| 1610 |
| 1611 |
| 1612 |
| 1613 |
| 1614 |
| 1615 <polymer-element name="code-view" extends="observatory-element"> |
| 1616 <template> |
| 1617 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1618 <style> |
| 1619 div.flex-row:hover { |
| 2715 background-color: #FFF3E3; | 1620 background-color: #FFF3E3; |
| 2716 } | 1621 } |
| 2717 .rowColor0 { | 1622 |
| 2718 background-color: #FFE9CC; | 1623 .highlight { |
| 2719 } | 1624 background-color: #FFF3E3; |
| 2720 .rowColor1 { | |
| 2721 background-color: #FFDEB2; | |
| 2722 } | |
| 2723 .rowColor2 { | |
| 2724 background-color: #FFD399; | |
| 2725 } | |
| 2726 .rowColor3 { | |
| 2727 background-color: #FFC87F; | |
| 2728 } | |
| 2729 .rowColor4 { | |
| 2730 background-color: #FFBD66; | |
| 2731 } | |
| 2732 .rowColor5 { | |
| 2733 background-color: #FFB24C; | |
| 2734 } | |
| 2735 .rowColor6 { | |
| 2736 background-color: #FFA733; | |
| 2737 } | |
| 2738 .rowColor7 { | |
| 2739 background-color: #FF9C19; | |
| 2740 } | |
| 2741 .rowColor8 { | |
| 2742 background-color: #FF9100; | |
| 2743 } | 1625 } |
| 2744 | 1626 |
| 2745 .tooltip { | 1627 .tooltip { |
| 2746 display: block; | 1628 display: block; |
| 2747 position: absolute; | 1629 position: absolute; |
| 2748 visibility: hidden; | 1630 visibility: hidden; |
| 2749 opacity: 0; | 1631 opacity: 0; |
| 2750 transition: visibility 0s linear 0.5s; | 1632 transition: visibility 0s linear 0.5s; |
| 2751 transition: opacity .4s ease-in-out; | 1633 transition: opacity .4s ease-in-out; |
| 2752 } | 1634 } |
| 2753 | 1635 |
| 2754 tr:hover .tooltip { | 1636 .flex-row:hover .tooltip { |
| 2755 display: block; | 1637 display: block; |
| 2756 position: absolute; | 1638 position: absolute; |
| 2757 top: 100%; | 1639 top: 100%; |
| 2758 right: 100%; | |
| 2759 visibility: visible; | 1640 visibility: visible; |
| 2760 z-index: 999; | 1641 z-index: 999; |
| 2761 width: 400px; | 1642 width: auto; |
| 1643 min-width: 400px; |
| 2762 color: #ffffff; | 1644 color: #ffffff; |
| 2763 background-color: #0489c3; | 1645 background-color: #FFF3E3; |
| 2764 border-top-right-radius: 8px; | |
| 2765 border-top-left-radius: 8px; | |
| 2766 border-bottom-right-radius: 8px; | 1646 border-bottom-right-radius: 8px; |
| 2767 border-bottom-left-radius: 8px; | 1647 border-bottom-left-radius: 8px; |
| 2768 transition: visibility 0s linear 0.5s; | 1648 transition: visibility 0s linear 0.5s; |
| 2769 transition: opacity .4s ease-in-out; | 1649 transition: opacity .4s ease-in-out; |
| 2770 opacity: 1; | 1650 opacity: 1; |
| 2771 } | 1651 } |
| 2772 | 1652 |
| 2773 .white { | 1653 .descriptor-address { |
| 2774 color: #ffffff; | 1654 color: #0489c3; |
| 2775 } | 1655 } |
| 1656 |
| 1657 .snippet { |
| 1658 text-align: center; |
| 1659 margin-left: 10px; |
| 1660 margin-right: 10px; |
| 1661 } |
| 1662 |
| 2776 </style> | 1663 </style> |
| 2777 <nav-bar> | 1664 <nav-bar> |
| 2778 <top-nav-menu last="{{ true }}"></top-nav-menu> | 1665 <top-nav-menu></top-nav-menu> |
| 1666 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu> |
| 1667 <nav-menu link="{{ code.link }}" anchor="{{ code.name }}" last="{{ true }}
"></nav-menu> |
| 1668 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2779 <nav-control></nav-control> | 1669 <nav-control></nav-control> |
| 2780 </nav-bar> | 1670 </nav-bar> |
| 2781 <div class="content-centered"> | 1671 <div class="content"> |
| 2782 <h1>Class Hierarchy</h1> | 1672 <template if="{{ code.isDartCode && code.isOptimized }}"> |
| 2783 <table id="tableTree" class="table"> | 1673 <h1>Optimized code for {{ code.name }}</h1> |
| 2784 <thead> | 1674 </template> |
| 2785 <tr> | 1675 <template if="{{ !(code.isDartCode && code.isOptimized) }}"> |
| 2786 <th>Class</th> | 1676 <h1>Code for {{ code.name }}</h1> |
| 2787 </tr> | 1677 </template> |
| 2788 </thead> | 1678 <div class="memberList"> |
| 2789 <tbody> | 1679 <div class="memberItem"> |
| 2790 <tr template="" repeat="{{row in tree.rows }}"> | 1680 <div class="memberName">Kind</div> |
| 2791 <td on-click="{{toggleExpanded}}" class="{{ coloring(row) }}" style=
"{{ padding(row) }}"> | 1681 <div class="memberValue">{{code.kind}}</div> |
| 2792 <span id="expand" style="{{ row.expanderStyle }}">{{ row.expander
}}</span> | 1682 </div> |
| 2793 <class-ref ref="{{ row.cls }}"></class-ref> | 1683 <template if="{{ code.isDartCode }}"> |
| 2794 </td> | 1684 <div class="memberItem"> |
| 2795 </tr> | 1685 <div class="memberName">Optimized</div> |
| 2796 </tbody> | 1686 <div class="memberValue">{{code.isOptimized}}</div> |
| 2797 </table> | 1687 </div> |
| 1688 </template> |
| 1689 <div class="memberItem"> |
| 1690 <div class="memberName">Function</div> |
| 1691 <div class="memberValue"> |
| 1692 <function-ref ref="{{code.function}}"> |
| 1693 </function-ref> |
| 1694 </div> |
| 1695 </div> |
| 1696 <div class="memberItem"> |
| 1697 <div class="memberName">Inclusive</div> |
| 1698 <div class="memberValue">{{ code.formattedInclusiveTicks }}</div> |
| 1699 </div> |
| 1700 <div class="memberItem"> |
| 1701 <div class="memberName">Exclusive</div> |
| 1702 <div class="memberValue">{{ code.formattedExclusiveTicks }}</div> |
| 1703 </div> |
| 1704 <div class="memberItem"> |
| 1705 <div class="memberName">Constant object pool</div> |
| 1706 <div class="memberValue"> |
| 1707 <any-service-ref ref="{{ code.objectPool }}"></any-service-ref> |
| 1708 </div> |
| 1709 </div> |
| 1710 </div> |
| 1711 </div> |
| 1712 <hr> |
| 1713 <div class="content"> |
| 1714 <template if="{{ code.hasDisassembly }}"> |
| 1715 <div class="flex-row"> |
| 1716 <div class="flex-item-fixed-2-12 memberHeader">Inclusive</div> |
| 1717 <div class="flex-item-fixed-2-12 memberHeader">Exclusive</div> |
| 1718 <div class="flex-item-fixed-2-12 memberHeader">Address</div> |
| 1719 <div class="flex-item-fixed-6-12 memberHeader">Disassembly</div> |
| 1720 </div> |
| 1721 </template> |
| 1722 <template repeat="{{ instruction in code.instructions }}"> |
| 1723 <div class="flex-row" on-mouseover="{{ mouseOver }}" on-mouseout="{{ mou
seOut }}" data-jump-target="{{ instruction.jumpTarget.address }}" id="addr-{{ in
struction.address }}" style="position: relative"> |
| 1724 <template if="{{ instruction.isComment }}"> |
| 1725 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> |
| 1726 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> |
| 1727 <div class="flex-item-fixed-8-12 monospace">{{ instruction.human }}<
/div> |
| 1728 </template> |
| 1729 <template if="{{ !instruction.isComment }}"> |
| 1730 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> |
| 1731 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> |
| 1732 <template if="{{ instruction.hasDescriptors }}"> |
| 1733 <div class="flex-item-fixed-2-12 monospace descriptor-address"> |
| 1734 <div class="tooltip"> |
| 1735 <template repeat="{{ descriptor in instruction.descriptors }}"
> |
| 1736 <div class="memberList"> |
| 1737 <div class="memberItem"> |
| 1738 <div class="memberName">Kind</div> |
| 1739 <div class="memberValue">{{ descriptor.kind }}</div> |
| 1740 </div> |
| 1741 <div class="memberItem"> |
| 1742 <div class="memberName">Deoptimization ID</div> |
| 1743 <div class="memberValue">{{ descriptor.formattedDeoptId()
}}</div> |
| 1744 </div> |
| 1745 <template if="{{ descriptor.script != null }}"> |
| 1746 <div class="memberItem"> |
| 1747 <div class="memberName">Script</div> |
| 1748 <div class="memberValue"><script-ref ref="{{ descriptor
.script }}" pos="{{ descriptor.tokenPos }}"></script-ref></div> |
| 1749 </div> |
| 1750 </template> |
| 1751 </div> |
| 1752 <template if="{{ descriptor.script != null }}"> |
| 1753 <div class="snippet monospace"> |
| 1754 <span>{{ descriptor.formattedLine }}</span> |
| 1755 </div> |
| 1756 </template> |
| 1757 </template> |
| 1758 </div> |
| 1759 {{ instruction.formattedAddress() }} |
| 1760 </div> |
| 1761 </template> |
| 1762 <template if="{{ !instruction.hasDescriptors }}"> |
| 1763 <div class="flex-item-fixed-2-12 monospace"> |
| 1764 {{ instruction.formattedAddress() }} |
| 1765 </div> |
| 1766 </template> |
| 1767 <div class="flex-item-fixed-6-12 monospace"> |
| 1768 {{ instruction.human }} |
| 1769 </div> |
| 1770 </template> |
| 1771 </div> |
| 1772 </template> |
| 2798 </div> | 1773 </div> |
| 2799 </template> | 1774 </template> |
| 2800 </polymer-element> | 1775 </polymer-element> |
| 2801 | 1776 |
| 2802 | 1777 |
| 2803 | 1778 |
| 2804 | 1779 |
| 2805 | 1780 |
| 2806 | 1781 |
| 2807 | 1782 |
| 2808 | 1783 |
| 2809 | 1784 |
| 2810 | 1785 |
| 2811 | 1786 |
| 2812 | 1787 <!-- TODO(turnidge): Use core-icon once core_elements work properly in |
| 2813 <polymer-element name="error-ref" extends="service-ref"> | 1788 devtools --> |
| 2814 <template> | 1789 <polymer-element name="icon-expand-less" noscript=""> |
| 2815 <style>/* Global styles */ | 1790 <template> |
| 2816 * { | 1791 <svg width="24" height="24"> |
| 2817 margin: 0; | 1792 <polygon points="12,8 6,14 7.4,15.4 12,10.8 16.6,15.4 18,14 "></polygon> |
| 2818 padding: 0; | 1793 </svg> |
| 2819 font: 400 14px 'Montserrat', sans-serif; | 1794 </template> |
| 2820 color: #333; | 1795 </polymer-element> |
| 2821 box-sizing: border-box; | 1796 |
| 2822 } | 1797 <polymer-element name="icon-expand-more" noscript=""> |
| 2823 | 1798 <template> |
| 2824 .content { | 1799 <svg width="24" height="24"> |
| 2825 padding-left: 10%; | 1800 <polygon points="16.6,8.6 12,13.2 7.4,8.6 6,10 12,16 18,10 "></polygon> |
| 2826 font: 400 14px 'Montserrat', sans-serif; | 1801 </svg> |
| 2827 } | 1802 </template> |
| 2828 | 1803 </polymer-element> |
| 2829 .content-centered { | 1804 |
| 2830 padding-left: 10%; | 1805 <polymer-element name="debugger-page" extends="observatory-element"> |
| 2831 padding-right: 10%; | 1806 <template> |
| 2832 font: 400 14px 'Montserrat', sans-serif; | 1807 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2833 } | |
| 2834 | |
| 2835 .content-centered-big { | |
| 2836 padding-left: 5%; | |
| 2837 padding-right: 5%; | |
| 2838 font: 400 14px 'Montserrat', sans-serif; | |
| 2839 } | |
| 2840 | |
| 2841 h1 { | |
| 2842 font: 400 18px 'Montserrat', sans-serif; | |
| 2843 } | |
| 2844 | |
| 2845 .memberList { | |
| 2846 display: table; | |
| 2847 } | |
| 2848 | |
| 2849 .memberItem { | |
| 2850 display: table-row; | |
| 2851 } | |
| 2852 | |
| 2853 .memberName, .memberValue { | |
| 2854 display: table-cell; | |
| 2855 vertical-align: top; | |
| 2856 padding: 3px 0 3px 1em; | |
| 2857 font: 400 14px 'Montserrat', sans-serif; | |
| 2858 } | |
| 2859 | |
| 2860 .memberSmall { | |
| 2861 display: table-cell; | |
| 2862 vertical-align: top; | |
| 2863 padding: 3px 0 3px 1em; | |
| 2864 font: 400 12px 'Montserrat', sans-serif; | |
| 2865 } | |
| 2866 | |
| 2867 .monospace { | |
| 2868 font-family: consolas, courier, monospace; | |
| 2869 font-size: 1em; | |
| 2870 line-height: 1.2em; | |
| 2871 white-space: nowrap; | |
| 2872 } | |
| 2873 | |
| 2874 a { | |
| 2875 color: #0489c3; | |
| 2876 text-decoration: none; | |
| 2877 } | |
| 2878 | |
| 2879 a:hover { | |
| 2880 text-decoration: underline; | |
| 2881 } | |
| 2882 | |
| 2883 em { | |
| 2884 color: inherit; | |
| 2885 font-style: italic; | |
| 2886 } | |
| 2887 | |
| 2888 b { | |
| 2889 color: inherit; | |
| 2890 font-weight: bold; | |
| 2891 } | |
| 2892 | |
| 2893 hr { | |
| 2894 margin-top: 20px; | |
| 2895 margin-bottom: 20px; | |
| 2896 border: 0; | |
| 2897 border-top: 1px solid #eee; | |
| 2898 height: 0; | |
| 2899 box-sizing: content-box; | |
| 2900 } | |
| 2901 | |
| 2902 .list-group { | |
| 2903 padding-left: 0; | |
| 2904 margin-bottom: 20px; | |
| 2905 } | |
| 2906 | |
| 2907 .list-group-item { | |
| 2908 position: relative; | |
| 2909 display: block; | |
| 2910 padding: 10px 15px; | |
| 2911 margin-bottom: -1px; | |
| 2912 background-color: #fff; | |
| 2913 } | |
| 2914 | |
| 2915 .list-group-item:first-child { | |
| 2916 /* rounded top corners */ | |
| 2917 border-top-right-radius:4px; | |
| 2918 border-top-left-radius:4px; | |
| 2919 } | |
| 2920 | |
| 2921 .list-group-item:last-child { | |
| 2922 margin-bottom: 0; | |
| 2923 /* rounded bottom corners */ | |
| 2924 border-bottom-right-radius: 4px; | |
| 2925 border-bottom-left-radius:4px; | |
| 2926 } | |
| 2927 | |
| 2928 /* Flex row container */ | |
| 2929 .flex-row { | |
| 2930 display: flex; | |
| 2931 flex-direction: row; | |
| 2932 } | |
| 2933 | |
| 2934 /* Flex column container */ | |
| 2935 .flex-column { | |
| 2936 display: flex; | |
| 2937 flex-direction: column; | |
| 2938 } | |
| 2939 | |
| 2940 .flex-item-fit { | |
| 2941 flex-grow: 1; | |
| 2942 flex-shrink: 1; | |
| 2943 flex-basis: auto; | |
| 2944 } | |
| 2945 | |
| 2946 .flex-item-no-shrink { | |
| 2947 flex-grow: 0; | |
| 2948 flex-shrink: 0; | |
| 2949 flex-basis: auto; | |
| 2950 } | |
| 2951 | |
| 2952 .flex-item-fill { | |
| 2953 flex-grow: 0; | |
| 2954 flex-shrink: 1; /* shrink when pressured */ | |
| 2955 flex-basis: 100%; /* try and take 100% */ | |
| 2956 } | |
| 2957 | |
| 2958 .flex-item-fixed-1-12 { | |
| 2959 flex-grow: 0; | |
| 2960 flex-shrink: 0; | |
| 2961 flex-basis: 8.3%; | |
| 2962 } | |
| 2963 | |
| 2964 .flex-item-fixed-2-12 { | |
| 2965 flex-grow: 0; | |
| 2966 flex-shrink: 0; | |
| 2967 flex-basis: 16.6%; | |
| 2968 } | |
| 2969 | |
| 2970 .flex-item-fixed-4-12 { | |
| 2971 flex-grow: 0; | |
| 2972 flex-shrink: 0; | |
| 2973 flex-basis: 33.3333%; | |
| 2974 } | |
| 2975 | |
| 2976 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 2977 flex-grow: 0; | |
| 2978 flex-shrink: 0; | |
| 2979 flex-basis: 50%; | |
| 2980 } | |
| 2981 | |
| 2982 .flex-item-fixed-8-12 { | |
| 2983 flex-grow: 0; | |
| 2984 flex-shrink: 0; | |
| 2985 flex-basis: 66.6666%; | |
| 2986 } | |
| 2987 | |
| 2988 .flex-item-fixed-9-12 { | |
| 2989 flex-grow: 0; | |
| 2990 flex-shrink: 0; | |
| 2991 flex-basis: 75%; | |
| 2992 } | |
| 2993 | |
| 2994 | |
| 2995 .flex-item-fixed-12-12 { | |
| 2996 flex-grow: 0; | |
| 2997 flex-shrink: 0; | |
| 2998 flex-basis: 100%; | |
| 2999 } | |
| 3000 | |
| 3001 .flex-item-10-percent { | |
| 3002 flex-grow: 0; | |
| 3003 flex-shrink: 0; | |
| 3004 flex-basis: 10%; | |
| 3005 } | |
| 3006 | |
| 3007 .flex-item-15-percent { | |
| 3008 flex-grow: 0; | |
| 3009 flex-shrink: 0; | |
| 3010 flex-basis: 15%; | |
| 3011 } | |
| 3012 | |
| 3013 .flex-item-20-percent { | |
| 3014 flex-grow: 0; | |
| 3015 flex-shrink: 0; | |
| 3016 flex-basis: 20%; | |
| 3017 } | |
| 3018 | |
| 3019 .flex-item-30-percent { | |
| 3020 flex-grow: 0; | |
| 3021 flex-shrink: 0; | |
| 3022 flex-basis: 30%; | |
| 3023 } | |
| 3024 | |
| 3025 .flex-item-40-percent { | |
| 3026 flex-grow: 0; | |
| 3027 flex-shrink: 0; | |
| 3028 flex-basis: 40%; | |
| 3029 } | |
| 3030 | |
| 3031 .flex-item-50-percent { | |
| 3032 flex-grow: 0; | |
| 3033 flex-shrink: 0; | |
| 3034 flex-basis: 50%; | |
| 3035 } | |
| 3036 | |
| 3037 .flex-item-60-percent { | |
| 3038 flex-grow: 0; | |
| 3039 flex-shrink: 0; | |
| 3040 flex-basis: 60%; | |
| 3041 } | |
| 3042 | |
| 3043 .flex-item-70-percent { | |
| 3044 flex-grow: 0; | |
| 3045 flex-shrink: 0; | |
| 3046 flex-basis: 70%; | |
| 3047 } | |
| 3048 | |
| 3049 .flex-item-80-percent { | |
| 3050 flex-grow: 0; | |
| 3051 flex-shrink: 0; | |
| 3052 flex-basis: 80%; | |
| 3053 } | |
| 3054 | |
| 3055 .well { | |
| 3056 min-height: 20px; | |
| 3057 padding: 19px; | |
| 3058 margin-bottom: 20px; | |
| 3059 background-color: #f5f5f5; | |
| 3060 border: 1px solid #e3e3e3; | |
| 3061 border-radius: 4px; | |
| 3062 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 3063 } | |
| 3064 | |
| 3065 .break-wrap { | |
| 3066 word-wrap: break-word; | |
| 3067 } | |
| 3068 </style> | |
| 3069 <style> | 1808 <style> |
| 3070 .errorBox { | 1809 .container { |
| 3071 background-color: #f5f5f5; | 1810 height: 100%; |
| 3072 border: 1px solid #ccc; | 1811 display: flex; |
| 3073 padding: 10px; | 1812 flex-direction: column; |
| 3074 font-family: consolas, courier, monospace; | 1813 justify-content: space-between; |
| 3075 font-size: 1em; | 1814 } |
| 3076 line-height: 1.2em; | 1815 nav-bar { |
| 3077 white-space: pre; | 1816 flex: 0 0 auto; |
| 1817 } |
| 1818 .stack { |
| 1819 flex: 0 0 auto; |
| 1820 overflow-y: auto; |
| 1821 } |
| 1822 core-splitter { |
| 1823 flex: 0 0 auto; |
| 1824 } |
| 1825 .console { |
| 1826 flex: 1 1 auto; |
| 1827 overflow-y: auto; |
| 1828 } |
| 1829 .commandline { |
| 1830 flex: 0 0 auto; |
| 3078 } | 1831 } |
| 3079 </style> | 1832 </style> |
| 3080 <span> | 1833 |
| 3081 <pre class="errorBox">{{ ref.kind }}: {{ ref.message }}</pre> | 1834 <div class="container"> |
| 3082 </span> | 1835 <nav-bar> |
| 3083 </template> | 1836 » <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 3084 </polymer-element> | 1837 » <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}"> |
| 3085 | 1838 » </isolate-nav-menu> |
| 3086 | 1839 » <nav-control></nav-control> |
| 3087 | 1840 </nav-bar> |
| 3088 | 1841 |
| 3089 <polymer-element name="eval-box" extends="observatory-element"> | 1842 <div id="stack" class="stack"> |
| 3090 <template> | 1843 » <debugger-stack isolate="{{ isolate }}"></debugger-stack> |
| 1844 </div> |
| 1845 <!-- |
| 1846 <core-splitter direction="up" allowOverflow=true></core-splitter> |
| 1847 <div class="console"> |
| 1848 » <debugger-console isolate="{{ isolate }}"></debugger-console> |
| 1849 </div> |
| 1850 <div class="commandline"> |
| 1851 » <debugger-input isolate="{{ isolate }}"></debugger-input> |
| 1852 </div> |
| 1853 --> |
| 1854 </div> |
| 1855 </template> |
| 1856 </polymer-element> |
| 1857 |
| 1858 <polymer-element name="debugger-stack" extends="observatory-element"> |
| 1859 <template> |
| 1860 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1861 <template if="{{ stack == null }}"> |
| 1862 Loading stack frames |
| 1863 </template> |
| 1864 <template if="{{ stack != null }}"> |
| 1865 <ul class="list-group"> |
| 1866 <template repeat="{{ frame in stack['members'] }}"> |
| 1867 <li class="list-group-item"> |
| 1868 <debugger-frame frame="{{ frame }}" expand="{{ frame['depth'] == act
iveFrame }}"> |
| 1869 </debugger-frame> |
| 1870 </li> |
| 1871 </template> |
| 1872 </ul> |
| 1873 </template> |
| 1874 </template> |
| 1875 </polymer-element> |
| 1876 |
| 1877 |
| 1878 <polymer-element name="debugger-frame" extends="observatory-element"> |
| 1879 <template> |
| 1880 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3091 <style> | 1881 <style> |
| 3092 .textbox { | 1882 .frameOuter { |
| 3093 flex-grow: 1; | 1883 position: relative; |
| 1884 padding: 5px; |
| 1885 border: 1px solid white; |
| 1886 } |
| 1887 .frameOuter:hover { |
| 1888 border: 1px solid #e0e0e0; |
| 1889 } |
| 1890 .shadow { |
| 1891 box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), |
| 1892 0 2px 5px 0 rgba(0, 0, 0, 0.26); |
| 1893 } |
| 1894 .frameSummaryText { |
| 1895 display: inline-block; |
| 1896 padding: 5px; |
| 1897 } |
| 1898 .frameId { |
| 1899 display: inline-block; |
| 1900 width: 60px; |
| 1901 } |
| 1902 .frameOuter .frameExpander { |
| 1903 position: absolute; |
| 1904 right: 5px; |
| 1905 top: 5px; |
| 1906 display: none; |
| 1907 } |
| 1908 .frameOuter:hover .frameExpander{ |
| 1909 display: inline-block; |
| 1910 } |
| 1911 .frameContractor { |
| 1912 position: absolute; |
| 1913 right: 5px; |
| 1914 bottom: 5px; |
| 1915 display: inline-block; |
| 1916 } |
| 1917 </style> |
| 1918 <div id="frameOuter" class="frameOuter"> |
| 1919 <a on-click="{{ toggleExpand }}"> |
| 1920 <div class="frameSummary"> |
| 1921 <div class="frameSummaryText"> |
| 1922 <div class="frameId"><b>frame {{ frame['depth'] }}</b></div> |
| 1923 <function-ref ref="{{ frame['function'] }}"></function-ref> |
| 1924 ( <script-ref ref="{{ frame['script'] }}" pos="{{ frame['tokenPos']
}}"> |
| 1925 </script-ref> ) |
| 1926 </div> |
| 1927 <template if="{{ !expanded }}"> |
| 1928 <div class="frameExpander"> |
| 1929 <icon-expand-more></icon-expand-more> |
| 1930 </div> |
| 1931 </template> |
| 1932 </div> |
| 1933 </a> |
| 1934 |
| 1935 <template if="{{expanded}}"> |
| 1936 <div class="frameDetails"> |
| 1937 <div class="flex-row"> |
| 1938 <div class="flex-item-60-percent"> |
| 1939 <script-inset height="{{ scriptHeight }}" script="{{ frame['functi
on'].script }}" startpos="{{ frame['function'].tokenPos }}" endpos="{{ frame['fu
nction'].endTokenPos }}" currentpos="{{ frame['tokenPos'] }}"> |
| 1940 </script-inset> |
| 1941 </div> |
| 1942 <div class="flex-item-40-percent"> |
| 1943 <div style="padding:10px;" class="memberList"> |
| 1944 <template repeat="{{ v in frame['vars'] }}"> |
| 1945 <div class="memberItem"> |
| 1946 <div class="memberName">{{ v['name']}}</div> |
| 1947 <div class="memberValue"> |
| 1948 <any-service-ref ref="{{ v['value'] }}"> |
| 1949 </any-service-ref> |
| 1950 </div> |
| 1951 </div> |
| 1952 </template> |
| 1953 </div> |
| 1954 </div> |
| 1955 </div> |
| 1956 <!-- TODO(turnidge): Add eval box here? --> |
| 1957 <div class="frameContractor"> |
| 1958 <template if="{{expanded}}"> |
| 1959 <a on-click="{{ toggleExpand }}"> |
| 1960 <icon-expand-less></icon-expand-less> |
| 1961 </a> |
| 1962 </template> |
| 1963 </div> |
| 1964 </div> |
| 1965 </template> |
| 1966 </div> |
| 1967 </template> |
| 1968 </polymer-element> |
| 1969 |
| 1970 <polymer-element name="debugger-console" extends="observatory-element"> |
| 1971 <template> |
| 1972 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1973 <style> |
| 1974 .textBox { |
| 1975 position: absolute; |
| 1976 bottom: 0px; |
| 1977 width: 100%; |
| 1978 } |
| 1979 </style> |
| 1980 <div> |
| 1981 Debugging console is not yet implemented.<br> |
| 1982 </div> |
| 1983 </template> |
| 1984 </polymer-element> |
| 1985 |
| 1986 <polymer-element name="debugger-input" extends="observatory-element"> |
| 1987 <template> |
| 1988 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 1989 <style> |
| 1990 .textBox { |
| 3094 font: 400 16px 'Montserrat', sans-serif; | 1991 font: 400 16px 'Montserrat', sans-serif; |
| 3095 } | 1992 width: 100%; |
| 3096 .bigtextbox { | |
| 3097 font: 400 16px 'Montserrat', sans-serif; | |
| 3098 } | |
| 3099 .button { | |
| 3100 font: 400 16px 'Montserrat', sans-serif; | |
| 3101 } | |
| 3102 .radios { | |
| 3103 display: inline; | |
| 3104 padding-right: 30px; | |
| 3105 } | |
| 3106 .radios label{ | |
| 3107 padding-left: 10px; | |
| 3108 } | |
| 3109 .historyExpr, .historyValue { | |
| 3110 vertical-align: text-top; | |
| 3111 font: 400 14px 'Montserrat', sans-serif; | |
| 3112 } | |
| 3113 .historyExpr a { | |
| 3114 display: block; | |
| 3115 color: black; | |
| 3116 text-decoration: none; | |
| 3117 padding: 6px 6px; | |
| 3118 cursor: pointer; | |
| 3119 white-space: pre-line; | |
| 3120 } | |
| 3121 .historyExpr a:hover { | |
| 3122 background-color: #fff3e3; | |
| 3123 } | |
| 3124 .historyValue { | |
| 3125 display: block; | |
| 3126 padding: 6px 6px; | |
| 3127 } | 1993 } |
| 3128 </style> | 1994 </style> |
| 3129 <form style="display:flex; flex-direction:row; align-items:flex-end"> | 1995 <input id="textBox" class="textBox" type="text" value="{{ text }}"> |
| 3130 <template if="{{ lineMode == '1-line' }}"> | 1996 </template> |
| 3131 <input class="textbox" type="text" value="{{ text }}"> | 1997 </polymer-element> |
| 1998 |
| 1999 |
| 2000 |
| 2001 |
| 2002 |
| 2003 |
| 2004 |
| 2005 <polymer-element name="error-view" extends="observatory-element"> |
| 2006 <template> |
| 2007 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2008 <nav-bar> |
| 2009 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2010 <nav-control></nav-control> |
| 2011 </nav-bar> |
| 2012 <div class="content-centered"> |
| 2013 <h1>{{ error.kind }}</h1> |
| 2014 <br> |
| 2015 <div class="well">{{ error.message }}</div> |
| 2016 </div> |
| 2017 </template> |
| 2018 </polymer-element> |
| 2019 |
| 2020 |
| 2021 |
| 2022 |
| 2023 |
| 2024 |
| 2025 |
| 2026 |
| 2027 |
| 2028 |
| 2029 |
| 2030 |
| 2031 |
| 2032 |
| 2033 <polymer-element name="field-view" extends="observatory-element"> |
| 2034 <template> |
| 2035 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2036 <nav-bar> |
| 2037 <top-nav-menu></top-nav-menu> |
| 2038 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu> |
| 2039 <template if="{{ field.owner.type == 'Class' }}"> |
| 2040 <!-- TODO(turnidge): Add library nav menu here. --> |
| 2041 <class-nav-menu cls="{{ field.owner }}"></class-nav-menu> |
| 3132 </template> | 2042 </template> |
| 3133 <template if="{{ lineMode == 'N-line' }}"> | 2043 <template if="{{ field.owner.type == 'Library' }}"> |
| 3134 <textarea class="bigtextbox" rows="5" cols="80" value="{{ text }}"></tex
tarea> | 2044 <library-nav-menu library="{{ field.owner }}"></library-nav-menu> |
| 3135 </template> | 2045 </template> |
| 3136 | 2046 <nav-menu link="{{ field.link }}" anchor="{{ field.name }}" last="{{ true
}}"></nav-menu> |
| 3137 <input class="button" type="submit" value="Evaluate" on-click="{{ eval }}"
> | 2047 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 3138 <div class="radios" on-change="{{ updateLineMode }}"> | 2048 <nav-control></nav-control> |
| 3139 <label for="1-line"> | 2049 </nav-bar> |
| 3140 <input type="radio" name="lineMode" value="1-line" checked=""> | 2050 |
| 3141 1-line | 2051 <div class="content"> |
| 3142 </label> | 2052 <h1> |
| 3143 <label for="N-line"> | 2053 <template if="{{ field.isStatic }}">static</template> |
| 3144 <input type="radio" name="lineMode" value="N-line"> | 2054 <template if="{{ field.isFinal }}">final</template> |
| 3145 N-line | 2055 <template if="{{ field.isConst }}">const</template> |
| 3146 </label> | 2056 <template if="{{ (field.declaredType.name == 'dynamic' && |
| 2057 !field.isFinal && !field.isConst) }}"> |
| 2058 var |
| 2059 </template> |
| 2060 <template if="{{ (field.declaredType.name != 'dynamic') }}"> |
| 2061 {{ field.declaredType.name }} |
| 2062 </template> |
| 2063 {{ field.name }} |
| 2064 </h1> |
| 2065 <div class="memberList"> |
| 2066 <div class="memberItem"> |
| 2067 <div class="memberName">owner</div> |
| 2068 <div class="memberValue"> |
| 2069 <template if="{{ field.owner.type == 'Class' }}"> |
| 2070 <class-ref ref="{{ field.owner }}"></class-ref> |
| 2071 </template> |
| 2072 <template if="{{ field.owner.type != 'Class' }}"> |
| 2073 <library-ref ref="{{ field.owner }}"></library-ref> |
| 2074 </template> |
| 2075 </div> |
| 2076 </div> |
| 2077 <div class="memberItem"> |
| 2078 <div class="memberName">script</div> |
| 2079 <div class="memberValue"> |
| 2080 <script-ref ref="{{ field.script }}"></script-ref> |
| 2081 </div> |
| 2082 </div> |
| 2083 <template if="{{ !field.isStatic }}"> |
| 2084 <div class="memberItem" title="The types observed for this field at ru
ntime. Fields that are observed to have a single type at runtime or to never be
null may allow for additional optimization."> |
| 2085 <div class="memberName">observed types</div> |
| 2086 <div class="memberValue"> |
| 2087 <template if="{{ field.guardClass == 'dynamic' }}"> |
| 2088 various |
| 2089 </template> |
| 2090 <template if="{{ field.guardClass == 'unknown' }}"> |
| 2091 none |
| 2092 </template> |
| 2093 <template if="{{ field.guardClass != 'unknown' && |
| 2094 field.guardClass != 'dynamic' }}"> |
| 2095 <class-ref ref="{{ field.guardClass }}"></class-ref> |
| 2096 <template if="{{ field.guardNullable }}"> |
| 2097 — null observed |
| 2098 </template> |
| 2099 <template if="{{ !field.guardNullable }}"> |
| 2100 — null not observed |
| 2101 </template> |
| 2102 </template> |
| 2103 </div> |
| 2104 </div> |
| 2105 </template> |
| 2106 <template if="{{ field.value != null }}"> |
| 2107 <div class="memberItem"> |
| 2108 <div class="memberName">static value</div> |
| 2109 <div class="memberValue"> |
| 2110 <any-service-ref ref="{{ field.value }}"></any-service-ref> |
| 2111 </div> |
| 2112 </div> |
| 2113 </template> |
| 3147 </div> | 2114 </div> |
| 3148 </form> | 2115 </div> |
| 3149 | 2116 </template> |
| 3150 <br> | 2117 </polymer-element> |
| 3151 <template if="{{ results.isNotEmpty }}"> | 2118 |
| 3152 <table> | |
| 3153 <tbody><tr template="" repeat="{{ result in results }}"> | |
| 3154 <td class="historyExpr"> | |
| 3155 <a class="expr" on-click="{{ selectExpr }}" expr="{{ result['expr']
}}">{{ result['expr'] }}</a> | |
| 3156 </td> | |
| 3157 <td class="historyValue"> | |
| 3158 <template if="{{ result['value'] == null }}"> | |
| 3159 <div style="color:#aaa;cursor:wait;"><pending></div> | |
| 3160 </template> | |
| 3161 <template if="{{ result['value'] != null }}"> | |
| 3162 <any-service-ref ref="{{ result['value'] }}"></any-service-ref> | |
| 3163 </template> | |
| 3164 </td> | |
| 3165 </tr> | |
| 3166 </tbody></table> | |
| 3167 </template> | |
| 3168 </template> | |
| 3169 </polymer-element> | |
| 3170 | |
| 3171 | 2119 |
| 3172 | 2120 |
| 3173 | 2121 |
| 3174 | 2122 |
| 3175 | 2123 |
| 3176 | 2124 |
| 3177 <polymer-element name="eval-link"> | 2125 <polymer-element name="flag-list" extends="observatory-element"> |
| 2126 <template> |
| 2127 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2128 <nav-bar> |
| 2129 <top-nav-menu></top-nav-menu> |
| 2130 <nav-menu link="{{ flagList.vm.relativeLink('flags') }}" anchor="flags" la
st="{{ true }}"></nav-menu> |
| 2131 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2132 <nav-control></nav-control> |
| 2133 </nav-bar> |
| 2134 |
| 2135 <div class="content-centered"> |
| 2136 <template if="{{ flagList['modifiedFlags'].isNotEmpty }}"> |
| 2137 <h1>Modified Flags</h1> |
| 2138 <br> |
| 2139 <template repeat="{{ flag in flagList['modifiedFlags'] }}"> |
| 2140 <flag-item flag="{{ flag }}"></flag-item> |
| 2141 <br> |
| 2142 </template> |
| 2143 <hr> |
| 2144 </template> |
| 2145 |
| 2146 <h1>Unmodified Flags</h1> |
| 2147 <br> |
| 2148 <template if="{{ flagList['unmodifiedFlags'].isEmpty }}"> |
| 2149 <em>None</em> |
| 2150 </template> |
| 2151 <template if="{{ flagList['unmodifiedFlags'].isNotEmpty }}"> |
| 2152 <template repeat="{{ flag in flagList['unmodifiedFlags'] }}"> |
| 2153 <flag-item flag="{{ flag }}"></flag-item> |
| 2154 <br> |
| 2155 </template> |
| 2156 </template> |
| 2157 </div> |
| 2158 |
| 2159 </template> |
| 2160 </polymer-element> |
| 2161 |
| 2162 <polymer-element name="flag-item" extends="observatory-element"> |
| 2163 <template> |
| 2164 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2165 <span style="color:#aaa">// {{ flag['comment'] }}</span> |
| 2166 <div style="padding: 3px 0"> |
| 2167 <b>{{ flag['name'] }}</b> |
| 2168 = |
| 2169 {{ flag['valueAsString'] }} |
| 2170 </div> |
| 2171 </template> |
| 2172 </polymer-element> |
| 2173 |
| 2174 |
| 2175 |
| 2176 |
| 2177 |
| 2178 |
| 2179 |
| 2180 |
| 2181 |
| 2182 |
| 2183 |
| 2184 |
| 2185 |
| 2186 |
| 2187 <polymer-element name="function-view" extends="observatory-element"> |
| 2188 <template> |
| 2189 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2190 <nav-bar> |
| 2191 <top-nav-menu></top-nav-menu> |
| 2192 <isolate-nav-menu isolate="{{ function.isolate }}"></isolate-nav-menu> |
| 2193 <template if="{{ function.owningClass != null }}"> |
| 2194 <!-- TODO(turnidge): Add library nav menu here. --> |
| 2195 <class-nav-menu cls="{{ function.owningClass }}"></class-nav-menu> |
| 2196 </template> |
| 2197 <template if="{{ function.owningLibrary != null }}"> |
| 2198 <library-nav-menu library="{{ function.owningLibrary }}"></library-nav-m
enu> |
| 2199 </template> |
| 2200 <nav-menu link="{{ function.link }}" anchor="{{ function.name }}" last="{{
true }}"></nav-menu> |
| 2201 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> |
| 2202 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2203 <nav-control></nav-control> |
| 2204 </nav-bar> |
| 2205 |
| 2206 <div class="content"> |
| 2207 <h1>function {{ function.qualifiedName }}</h1> |
| 2208 |
| 2209 <div class="memberList"> |
| 2210 <div class="memberItem"> |
| 2211 <div class="memberName">kind</div> |
| 2212 <div class="memberValue"> |
| 2213 <template if="{{ function.isStatic }}">static</template> |
| 2214 <template if="{{ function.isConst }}">const</template> |
| 2215 {{ function.kind.toString() }} |
| 2216 </div> |
| 2217 </div> |
| 2218 <template if="{{ function.parent != null }}"> |
| 2219 <div class="memberItem"> |
| 2220 <div class="memberName">parent function</div> |
| 2221 <div class="memberValue"> |
| 2222 <function-ref ref="{{ function.parent }}"></function-ref> |
| 2223 </div> |
| 2224 </div> |
| 2225 </template> |
| 2226 <div class="memberItem"> |
| 2227 <div class="memberName">owner</div> |
| 2228 <div class="memberValue"> |
| 2229 <template if="{{ function.owningClass != null }}"> |
| 2230 <class-ref ref="{{ function.owningClass }}"></class-ref> |
| 2231 </template> |
| 2232 <template if="{{ function.owningLibrary != null }}"> |
| 2233 <library-ref ref="{{ function.owningLibrary }}"></library-ref> |
| 2234 </template> |
| 2235 </div> |
| 2236 </div> |
| 2237 <div class="memberItem"> |
| 2238 <div class="memberName">script</div> |
| 2239 <div class="memberValue"> |
| 2240 <script-ref ref="{{ function.script }}" pos="{{ function.tokenPos }}
"> |
| 2241 </script-ref> |
| 2242 </div> |
| 2243 </div> |
| 2244 |
| 2245 <div class="memberItem"> </div> |
| 2246 |
| 2247 <template if="{{ function.code != null }}"> |
| 2248 <div class="memberItem"> |
| 2249 <div class="memberName">optimized code</div> |
| 2250 <div class="memberValue"> |
| 2251 <code-ref ref="{{ function.code }}"></code-ref> |
| 2252 </div> |
| 2253 </div> |
| 2254 </template> |
| 2255 <template if="{{ function.unoptimizedCode != null }}"> |
| 2256 <div class="memberItem"> |
| 2257 <div class="memberName">unoptimized code</div> |
| 2258 <div class="memberValue"> |
| 2259 <code-ref ref="{{ function.unoptimizedCode }}"></code-ref> |
| 2260 </div> |
| 2261 <div class="memberValue"> |
| 2262 <span title="This count is used to determine when a function wil
l be optimized. It is a combination of call counts and other factors."> |
| 2263 (usage count: {{ function.usageCounter }}) |
| 2264 </span> |
| 2265 </div> |
| 2266 </div> |
| 2267 </template> |
| 2268 <div class="memberItem"> |
| 2269 <div class="memberName">deoptimizations</div> |
| 2270 <div class="memberValue">{{ function.deoptimizations }}</div> |
| 2271 </div> |
| 2272 <div class="memberItem"> |
| 2273 <div class="memberName">optimizable</div> |
| 2274 <div class="memberValue">{{ function.isOptimizable }}</div> |
| 2275 </div> |
| 2276 <div class="memberItem"> |
| 2277 <div class="memberName">inlinable</div> |
| 2278 <div class="memberValue">{{ function.isInlinable }}</div> |
| 2279 </div> |
| 2280 <template if="{{ function.name != function.vmName }}"> |
| 2281 <div class="memberItem"> |
| 2282 <div class="memberName">vm name</div> |
| 2283 <div class="memberValue">{{ function.vmName }}</div> |
| 2284 </div> |
| 2285 </template> |
| 2286 </div> |
| 2287 </div> |
| 2288 |
| 2289 <hr> |
| 2290 <script-inset script="{{ function.script }}" startpos="{{ function.tokenPos
}}" endpos="{{ function.endTokenPos }}"> |
| 2291 </script-inset> |
| 2292 |
| 2293 <br> |
| 2294 </template> |
| 2295 </polymer-element> |
| 2296 |
| 2297 |
| 2298 |
| 2299 |
| 2300 |
| 2301 |
| 2302 |
| 2303 |
| 2304 <polymer-element name="heap-map" extends="observatory-element"> |
| 2305 <template> |
| 2306 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"
> |
| 2307 <style> |
| 2308 .hover { |
| 2309 position: fixed; |
| 2310 z-index: 999; |
| 2311 height: 16px; |
| 2312 width: 100%; |
| 2313 background: #ffffff; |
| 2314 } |
| 2315 .spacer { |
| 2316 height: 16px; |
| 2317 background-color: red; |
| 2318 } |
| 2319 </style> |
| 2320 <nav-bar pad="{{ false }}"> |
| 2321 <top-nav-menu></top-nav-menu> |
| 2322 <isolate-nav-menu isolate="{{ fragmentation.isolate }}"></isolate-nav-menu> |
| 2323 <nav-menu link="{{ fragmentation.isolate.relativeLink('heapmap') }}" anchor=
"heap map" last="{{ true }}"></nav-menu> |
| 2324 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2325 <nav-control></nav-control> |
| 2326 </nav-bar> |
| 2327 <div class="hover"> |
| 2328 <p style="text-align:center">{{ status }}</p> |
| 2329 </div> |
| 2330 <div class="spacer"> |
| 2331 <!-- Make sure no data is covered by hover bar initially --> |
| 2332 </div> |
| 2333 <div class="flex-row"> |
| 2334 <canvas id="fragmentation" width="1px" height="1px"></canvas> |
| 2335 </div> |
| 2336 </template> |
| 2337 </polymer-element> |
| 2338 |
| 2339 |
| 2340 |
| 2341 |
| 2342 |
| 2343 |
| 2344 |
| 2345 <polymer-element name="io-view" extends="observatory-element"> |
| 2346 <template> |
| 2347 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2348 |
| 2349 <nav-bar> |
| 2350 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2351 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2352 <nav-control></nav-control> |
| 2353 </nav-bar> |
| 2354 |
| 2355 <div class="content"> |
| 2356 <h1>dart:io</h1> |
| 2357 |
| 2358 <br> |
| 2359 |
| 2360 <ul class="list-group"> |
| 2361 <li class="list-group-item"> |
| 2362 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/http/servers'))}}">HTTP Servers</a> |
| 2363 </li> |
| 2364 </ul> |
| 2365 |
| 2366 <br> |
| 2367 |
| 2368 <ul class="list-group"> |
| 2369 <li class="list-group-item"> |
| 2370 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/sockets'))}}">Sockets</a> |
| 2371 </li> |
| 2372 </ul> |
| 2373 |
| 2374 <br> |
| 2375 |
| 2376 <ul class="list-group"> |
| 2377 <li class="list-group-item"> |
| 2378 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/websockets'))}}">WebSockets</a> |
| 2379 </li> |
| 2380 </ul> |
| 2381 |
| 2382 <br> |
| 2383 |
| 2384 <ul class="list-group"> |
| 2385 <li class="list-group-item"> |
| 2386 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/file/randomaccessfiles'))}}">Random Access Files</a> |
| 2387 </li> |
| 2388 </ul> |
| 2389 |
| 2390 <br> |
| 2391 |
| 2392 <ul class="list-group"> |
| 2393 <li class="list-group-item"> |
| 2394 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/processes'))}}">Processes</a> |
| 2395 </li> |
| 2396 </ul> |
| 2397 |
| 2398 </div> |
| 2399 <br> |
| 2400 <hr> |
| 2401 </template> |
| 2402 </polymer-element> |
| 2403 |
| 2404 <polymer-element name="io-ref" extends="service-ref"> |
| 2405 <template> |
| 2406 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2407 <template if="{{ ref.type == 'Socket' }}"> |
| 2408 <io-socket-ref ref="{{ ref }}"></io-socket-ref> |
| 2409 </template> |
| 2410 <template if="{{ ref.type == 'HttpServerConnection' }}"> |
| 2411 <io-http-server-connection-ref ref="{{ ref }}"></io-http-server-connection
-ref> |
| 2412 </template> |
| 2413 <template if="{{ ref.type == 'HttpServer' }}"> |
| 2414 <io-http-server-ref ref="{{ ref }}"></io-http-server-ref> |
| 2415 </template> |
| 2416 <template if="{{ ref.type == 'WebSocket' }}"> |
| 2417 <io-web-socket-ref ref="{{ ref }}"></io-web-socket-ref> |
| 2418 </template> |
| 2419 <template if="{{ ref.type == 'Process' }}"> |
| 2420 <io-process-ref ref="{{ ref }}"></io-process-ref> |
| 2421 </template> |
| 2422 </template> |
| 2423 </polymer-element> |
| 2424 |
| 2425 <polymer-element name="io-http-server-list-view" extends="observatory-element"> |
| 2426 <template> |
| 2427 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2428 |
| 2429 <nav-bar> |
| 2430 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2431 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2432 </nav-bar> |
| 2433 |
| 2434 <div class="content"> |
| 2435 <h1>HttpServers</h1> |
| 2436 |
| 2437 <br> |
| 2438 |
| 2439 <ul class="list-group"> |
| 2440 <template repeat="{{ httpServer in list['members'] }}"> |
| 2441 <li class="list-group-item"> |
| 2442 <io-http-server-ref ref="{{ httpServer }}"></io-http-server-ref> |
| 2443 </li> |
| 2444 </template> |
| 2445 </ul> |
| 2446 </div> |
| 2447 <br> |
| 2448 <hr> |
| 2449 </template> |
| 2450 </polymer-element> |
| 2451 |
| 2452 <polymer-element name="io-http-server-ref" extends="service-ref"> |
| 2453 <template> |
| 2454 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2455 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2456 </template> |
| 2457 </polymer-element> |
| 2458 |
| 2459 <polymer-element name="io-http-server-view" extends="observatory-element"> |
| 2460 <template> |
| 2461 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2462 |
| 2463 <nav-bar> |
| 2464 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2465 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2466 </nav-bar> |
| 2467 |
| 2468 <div class="content"> |
| 2469 <h1>HttpServer</h1> |
| 2470 |
| 2471 <br> |
| 2472 |
| 2473 <div class="memberList"> |
| 2474 <div class="memberItem"> |
| 2475 <div class="memberName">Socket</div> |
| 2476 <div class="memberValue"><io-socket-ref ref="{{ httpServer['socket'] }
}"></io-socket-ref></div> |
| 2477 </div> |
| 2478 <div class="memberItem"> |
| 2479 <div class="memberName">Address</div> |
| 2480 <div class="memberValue">{{ httpServer['address'] }}</div> |
| 2481 </div> |
| 2482 <div class="memberItem"> |
| 2483 <div class="memberName">Port</div> |
| 2484 <div class="memberValue">{{ httpServer['port'] }}</div> |
| 2485 </div> |
| 2486 <div class="memberItem"> |
| 2487 <div class="memberName">Active connections</div> |
| 2488 <ul class="list-group"> |
| 2489 <template repeat="{{ connection in httpServer['active'] }}"> |
| 2490 <li class="list-group-item"> |
| 2491 <io-http-server-connection-ref ref="{{ connection }}"></io-http-
server-connection-ref> |
| 2492 </li> |
| 2493 </template> |
| 2494 </ul> |
| 2495 </div> |
| 2496 <div class="memberItem"> |
| 2497 <div class="memberName">Idle connections</div> |
| 2498 <ul class="list-group"> |
| 2499 <template repeat="{{ connection in httpServer['idle'] }}"> |
| 2500 <li class="list-group-item"> |
| 2501 <io-http-server-connection-ref ref="{{ connection }}"></io-http-
server-connection-ref> |
| 2502 </li> |
| 2503 </template> |
| 2504 </ul> |
| 2505 </div> |
| 2506 </div> |
| 2507 </div> |
| 2508 <br> |
| 2509 <hr> |
| 2510 </template> |
| 2511 </polymer-element> |
| 2512 |
| 2513 <polymer-element name="io-http-server-connection-ref" extends="service-ref"> |
| 2514 <template> |
| 2515 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2516 <a _href="{{ url }}">{{ name }}</a> |
| 2517 </template> |
| 2518 </polymer-element> |
| 2519 |
| 2520 <polymer-element name="io-http-server-connection-view" extends="observatory-elem
ent"> |
| 2521 <template> |
| 2522 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2523 |
| 2524 <nav-bar> |
| 2525 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2526 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2527 </nav-bar> |
| 2528 |
| 2529 <div class="content"> |
| 2530 <h1>HttpConnection</h1> |
| 2531 |
| 2532 <br> |
| 2533 |
| 2534 <div class="memberList"> |
| 2535 <div class="memberItem"> |
| 2536 <div class="memberName">Socket</div> |
| 2537 <div class="memberValue"><io-socket-ref ref="{{ connection['socket'] }
}"></io-socket-ref></div> |
| 2538 </div> |
| 2539 <div class="memberItem"> |
| 2540 <div class="memberName">State</div> |
| 2541 <div class="memberValue">{{ connection['state'] }}</div> |
| 2542 </div> |
| 2543 <div class="memberItem"> |
| 2544 <div class="memberName">Server</div> |
| 2545 <div class="memberValue"><io-http-server-ref ref="{{ connection['serve
r'] }}"></io-http-server-ref></div> |
| 2546 </div> |
| 2547 </div> |
| 2548 </div> |
| 2549 <br> |
| 2550 <hr> |
| 2551 </template> |
| 2552 </polymer-element> |
| 2553 |
| 2554 <polymer-element name="io-socket-ref" extends="service-ref"> |
| 2555 <template> |
| 2556 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2557 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2558 </template> |
| 2559 </polymer-element> |
| 2560 |
| 2561 <polymer-element name="io-socket-list-view" extends="observatory-element"> |
| 2562 <template> |
| 2563 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2564 |
| 2565 <nav-bar> |
| 2566 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2567 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2568 </nav-bar> |
| 2569 |
| 2570 <div class="content"> |
| 2571 <h1>Sockets</h1> |
| 2572 |
| 2573 <br> |
| 2574 |
| 2575 <ul class="list-group"> |
| 2576 <template repeat="{{ socket in list['members'] }}"> |
| 2577 <li class="list-group-item"> |
| 2578 <io-socket-ref ref="{{ socket }}"></io-socket-ref> |
| 2579 </li> |
| 2580 </template> |
| 2581 </ul> |
| 2582 </div> |
| 2583 <br> |
| 2584 <hr> |
| 2585 </template> |
| 2586 </polymer-element> |
| 2587 |
| 2588 <polymer-element name="io-socket-view" extends="observatory-element"> |
| 2589 <template> |
| 2590 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2591 |
| 2592 <nav-bar> |
| 2593 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2594 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2595 </nav-bar> |
| 2596 |
| 2597 <div class="content"> |
| 2598 <!-- Pipe Socket --> |
| 2599 <template if="{{ socket.isPipe }}"> |
| 2600 <h1>Pipe Socket</h1> |
| 2601 <div class="memberList"> |
| 2602 <template if="{{ socket.socketOwner != null }}"> |
| 2603 <div class="memberItem"> |
| 2604 <div class="memberName">Owner</div> |
| 2605 <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></
io-ref></div> |
| 2606 </div> |
| 2607 </template> |
| 2608 <div class="memberItem"> |
| 2609 <div class="memberName">File descriptor</div> |
| 2610 <div class="memberValue">{{ socket.fd }}</div> |
| 2611 </div> |
| 2612 <div class="memberItem"> |
| 2613 <div class="memberName">Read Closed</div> |
| 2614 <div class="memberValue">{{ socket.readClosed }}</div> |
| 2615 </div> |
| 2616 <div class="memberItem"> |
| 2617 <div class="memberName">Write Closed</div> |
| 2618 <div class="memberValue">{{ socket.writeClosed }}</div> |
| 2619 </div> |
| 2620 <div class="memberItem"> |
| 2621 <div class="memberName">Closing</div> |
| 2622 <div class="memberValue">{{ socket.closing }}</div> |
| 2623 </div> |
| 2624 </div> |
| 2625 </template> |
| 2626 <!-- Network Socket --> |
| 2627 <template if="{{ !socket.isPipe }}"> |
| 2628 <h1>Network Socket</h1> |
| 2629 <div class="memberList"> |
| 2630 <template if="{{ socket.socketOwner != null }}"> |
| 2631 <div class="memberItem"> |
| 2632 <div class="memberName">Owner</div> |
| 2633 <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></
io-ref></div> |
| 2634 </div> |
| 2635 </template> |
| 2636 <div class="memberItem"> |
| 2637 <div class="memberName">Local Address</div> |
| 2638 <div class="memberValue">{{ socket.localAddress }}</div> |
| 2639 </div> |
| 2640 <div class="memberItem"> |
| 2641 <div class="memberName">Local Port</div> |
| 2642 <div class="memberValue">{{ socket.localPort }}</div> |
| 2643 </div> |
| 2644 <div class="memberItem"> |
| 2645 <div class="memberName">Remote Address</div> |
| 2646 <div class="memberValue">{{ socket.remoteAddress }}</div> |
| 2647 </div> |
| 2648 <div class="memberItem"> |
| 2649 <div class="memberName">Remote Port</div> |
| 2650 <div class="memberValue">{{ socket.remotePort }}</div> |
| 2651 </div> |
| 2652 <div class="memberItem"> |
| 2653 <div class="memberName">File descriptor</div> |
| 2654 <div class="memberValue">{{ socket.fd }}</div> |
| 2655 </div> |
| 2656 <div class="memberItem"> |
| 2657 <div class="memberName">Read Closed</div> |
| 2658 <div class="memberValue">{{ socket.readClosed }}</div> |
| 2659 </div> |
| 2660 <div class="memberItem"> |
| 2661 <div class="memberName">Write Closed</div> |
| 2662 <div class="memberValue">{{ socket.writeClosed }}</div> |
| 2663 </div> |
| 2664 <div class="memberItem"> |
| 2665 <div class="memberName">Closing</div> |
| 2666 <div class="memberValue">{{ socket.closing }}</div> |
| 2667 </div> |
| 2668 <div class="memberItem"> |
| 2669 <div class="memberName">Listening</div> |
| 2670 <div class="memberValue">{{ socket.listening }}</div> |
| 2671 </div> |
| 2672 <div class="memberItem"> |
| 2673 <div class="memberName">Protocol</div> |
| 2674 <div class="memberValue">{{ socket.protocol }}</div> |
| 2675 </div> |
| 2676 </div> |
| 2677 </template> |
| 2678 </div> |
| 2679 <br> |
| 2680 <hr> |
| 2681 </template> |
| 2682 </polymer-element> |
| 2683 |
| 2684 <polymer-element name="io-web-socket-ref" extends="service-ref"> |
| 2685 <template> |
| 2686 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2687 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2688 </template> |
| 2689 </polymer-element> |
| 2690 |
| 2691 <polymer-element name="io-web-socket-list-view" extends="observatory-element"> |
| 2692 <template> |
| 2693 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2694 |
| 2695 <nav-bar> |
| 2696 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2697 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2698 </nav-bar> |
| 2699 |
| 2700 <div class="content"> |
| 2701 <h1>WebSockets</h1> |
| 2702 |
| 2703 <br> |
| 2704 |
| 2705 <ul class="list-group"> |
| 2706 <template repeat="{{ webSocket in list['members'] }}"> |
| 2707 <li class="list-group-item"> |
| 2708 <io-web-socket-ref ref="{{ webSocket }}"></io-web-socket-ref> |
| 2709 </li> |
| 2710 </template> |
| 2711 </ul> |
| 2712 </div> |
| 2713 <br> |
| 2714 <hr> |
| 2715 </template> |
| 2716 </polymer-element> |
| 2717 |
| 2718 <polymer-element name="io-web-socket-view" extends="observatory-element"> |
| 2719 <template> |
| 2720 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2721 |
| 2722 <nav-bar> |
| 2723 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2724 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2725 </nav-bar> |
| 2726 |
| 2727 <div class="content"> |
| 2728 <h1>WebSocket</h1> |
| 2729 |
| 2730 <br> |
| 2731 |
| 2732 <div class="memberList"> |
| 2733 <div class="memberItem"> |
| 2734 <div class="memberName">Socket</div> |
| 2735 <div class="memberValue"><io-socket-ref ref="{{ webSocket['socket'] }}
"></io-socket-ref></div> |
| 2736 </div> |
| 2737 </div> |
| 2738 </div> |
| 2739 <br> |
| 2740 <hr> |
| 2741 </template> |
| 2742 </polymer-element> |
| 2743 |
| 2744 <polymer-element name="io-random-access-file-ref" extends="service-ref"> |
| 2745 <template> |
| 2746 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2747 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2748 </template> |
| 2749 </polymer-element> |
| 2750 |
| 2751 <polymer-element name="io-random-access-file-list-view" extends="observatory-ele
ment"> |
| 2752 <template> |
| 2753 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2754 |
| 2755 <nav-bar> |
| 2756 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2757 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2758 </nav-bar> |
| 2759 |
| 2760 <div class="content"> |
| 2761 <h1>Random Access Files</h1> |
| 2762 |
| 2763 <br> |
| 2764 |
| 2765 <ul class="list-group"> |
| 2766 <template repeat="{{ file in list['members'] }}"> |
| 2767 <li class="list-group-item"> |
| 2768 <io-random-access-file-ref ref="{{ file }}"></io-random-access-file-
ref> |
| 2769 </li> |
| 2770 </template> |
| 2771 </ul> |
| 2772 </div> |
| 2773 <br> |
| 2774 <hr> |
| 2775 </template> |
| 2776 </polymer-element> |
| 2777 |
| 2778 <polymer-element name="io-random-access-file-view" extends="observatory-element"
> |
| 2779 <template> |
| 2780 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2781 |
| 2782 <nav-bar> |
| 2783 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2784 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2785 </nav-bar> |
| 2786 |
| 2787 <div class="content"> |
| 2788 <h1>Random Access File</h1> |
| 2789 |
| 2790 <br> |
| 2791 |
| 2792 <div class="memberList"> |
| 2793 <div class="memberItem"> |
| 2794 <div class="memberName">Path</div> |
| 2795 <div class="memberValue">{{ file['name'] }}</div> |
| 2796 </div> |
| 2797 <div class="memberItem"> |
| 2798 <div class="memberName">Pending Operation</div> |
| 2799 <div class="memberValue">{{ file['asyncDispatched'] }}</div> |
| 2800 </div> |
| 2801 <div class="memberItem"> |
| 2802 <div class="memberName">File Descriptor</div> |
| 2803 <div class="memberValue">{{ file['fd'] }}</div> |
| 2804 </div> |
| 2805 </div> |
| 2806 </div> |
| 2807 <br> |
| 2808 <hr> |
| 2809 </template> |
| 2810 </polymer-element> |
| 2811 |
| 2812 <polymer-element name="io-process-list-view" extends="observatory-element"> |
| 2813 <template> |
| 2814 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2815 |
| 2816 <nav-bar> |
| 2817 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2818 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2819 </nav-bar> |
| 2820 |
| 2821 <div class="content"> |
| 2822 <h1>Processes</h1> |
| 2823 |
| 2824 <br> |
| 2825 |
| 2826 <ul class="list-group"> |
| 2827 <template repeat="{{ process in list['members'] }}"> |
| 2828 <li class="list-group-item"> |
| 2829 <io-process-ref ref="{{ process }}"></io-process-ref> |
| 2830 </li> |
| 2831 </template> |
| 2832 </ul> |
| 2833 </div> |
| 2834 <br> |
| 2835 <hr> |
| 2836 </template> |
| 2837 </polymer-element> |
| 2838 |
| 2839 <polymer-element name="io-process-ref" extends="service-ref"> |
| 2840 <template> |
| 2841 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2842 <template if="{{ small }}"> |
| 2843 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> |
| 2844 </template> |
| 2845 <template if="{{ !small }}"> |
| 2846 <a on-click="{{ goto }}" _href="{{ url }}">({{ ref['pid'] }}) {{ name }} {
{ ref['arguments'] }}</a> |
| 2847 </template> |
| 2848 </template> |
| 2849 </polymer-element> |
| 2850 |
| 2851 <polymer-element name="io-process-view" extends="observatory-element"> |
| 2852 <template> |
| 2853 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2854 |
| 2855 <nav-bar> |
| 2856 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 2857 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 2858 </nav-bar> |
| 2859 |
| 2860 <div class="content"> |
| 2861 <h1>Process</h1> |
| 2862 |
| 2863 <br> |
| 2864 |
| 2865 <div class="memberList"> |
| 2866 <div class="memberItem"> |
| 2867 <div class="memberName">Path</div> |
| 2868 <div class="memberValue">{{ process['name'] }}</div> |
| 2869 </div> |
| 2870 <div class="memberItem"> |
| 2871 <div class="memberName">Pid</div> |
| 2872 <div class="memberValue">{{ process['pid'] }}</div> |
| 2873 </div> |
| 2874 <div class="memberItem"> |
| 2875 <div class="memberName">Arguments</div> |
| 2876 <div class="memberValue">{{ process['arguments'] }}</div> |
| 2877 </div> |
| 2878 <div class="memberItem"> |
| 2879 <div class="memberName">Started</div> |
| 2880 <div class="memberValue">{{ process['started'] }}</div> |
| 2881 </div> |
| 2882 <div class="memberItem"> |
| 2883 <div class="memberName">Working Directory</div> |
| 2884 <div class="memberValue">{{ process['workingDirectory'] }}</div> |
| 2885 </div> |
| 2886 <template if="{{ process['stdin'] != null }}"> |
| 2887 <div class="memberItem"> |
| 2888 <div class="memberName">stdin</div> |
| 2889 <div class="memberValue"> |
| 2890 <io-socket-ref ref="{{ process['stdin'] }}"></io-socket-ref> |
| 2891 </div> |
| 2892 </div> |
| 2893 </template> |
| 2894 <template if="{{ process['stdout'] != null }}"> |
| 2895 <div class="memberItem"> |
| 2896 <div class="memberName">stdout</div> |
| 2897 <div class="memberValue"> |
| 2898 <io-socket-ref ref="{{ process['stdout'] }}"></io-socket-ref> |
| 2899 </div> |
| 2900 </div> |
| 2901 </template> |
| 2902 <template if="{{ process['stderr'] != null }}"> |
| 2903 <div class="memberItem"> |
| 2904 <div class="memberName">stderr</div> |
| 2905 <div class="memberValue"> |
| 2906 <io-socket-ref ref="{{ process['stderr'] }}"></io-socket-ref> |
| 2907 </div> |
| 2908 </div> |
| 2909 </template> |
| 2910 </div> |
| 2911 |
| 2912 <br> |
| 2913 |
| 2914 <h2>Environment</h2> |
| 2915 <div class="well"> |
| 2916 <div class="monospace break-wrap"> |
| 2917 <template repeat="{{ variable in process['environment'] }}"> |
| 2918 {{ variable }} |
| 2919 <br> |
| 2920 </template> |
| 2921 </div> |
| 2922 </div> |
| 2923 </div> |
| 2924 <br> |
| 2925 <hr> |
| 2926 </template> |
| 2927 </polymer-element> |
| 2928 |
| 2929 |
| 2930 |
| 2931 |
| 2932 |
| 2933 <polymer-element name="isolate-ref" extends="service-ref"> |
| 2934 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/sha
red.css"> |
| 2935 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a> |
| 2936 </template> |
| 2937 </polymer-element> |
| 2938 |
| 2939 |
| 2940 |
| 2941 |
| 2942 |
| 2943 |
| 2944 |
| 2945 |
| 2946 |
| 2947 |
| 2948 <polymer-element name="isolate-summary" extends="observatory-element"> |
| 2949 <template> |
| 2950 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 2951 <div class="flex-row"> |
| 2952 <div class="flex-item-10-percent"> |
| 2953 <img src="packages/observatory/src/elements/img/isolate_icon.png"> |
| 2954 </div> |
| 2955 <div class="flex-item-10-percent"> |
| 2956 <isolate-ref ref="{{ isolate }}"></isolate-ref> |
| 2957 </div> |
| 2958 <div class="flex-item-30-percent"> |
| 2959 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> |
| 2960 </div> |
| 2961 <div class="flex-item-40-percent"> |
| 2962 <isolate-location isolate="{{ isolate }}"></isolate-location> |
| 2963 </div> |
| 2964 <div class="flex-item-10-percent"> |
| 2965 </div> |
| 2966 </div> |
| 2967 |
| 2968 <div class="flex-row"> |
| 2969 <div class="flex-item-20-percent"></div> |
| 2970 <div class="flex-item-60-percent"> |
| 2971 <hr> |
| 2972 </div> |
| 2973 <div class="flex-item-20-percent"></div> |
| 2974 </div> |
| 2975 |
| 2976 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> |
| 2977 |
| 2978 </template> |
| 2979 </polymer-element> |
| 2980 |
| 2981 <polymer-element name="isolate-run-state" extends="observatory-element"> |
| 2982 <template> |
| 2983 <template if="{{ isolate.pauseEvent != null }}"> |
| 2984 <strong>paused</strong> |
| 2985 <action-link callback="{{ resume }}" label="resume"></action-link> |
| 2986 |
| 2987 <action-link callback="{{ stepInto }}" label="step"></action-link> |
| 2988 <action-link callback="{{ stepOver }}" label="step over"></action-lin
k> |
| 2989 <action-link callback="{{ stepOut }}" label="step out"></action-link> |
| 2990 </template> |
| 2991 |
| 2992 <template if="{{ isolate.running }}"> |
| 2993 <strong>running</strong> |
| 2994 <action-link callback="{{ pause }}" label="pause"></action-link> |
| 2995 </template> |
| 2996 |
| 2997 <template if="{{ isolate.idle }}"> |
| 2998 <strong>idle</strong> |
| 2999 <action-link callback="{{ pause }}" label="pause"></action-link> |
| 3000 </template> |
| 3001 |
| 3002 <template if="{{ isolate.loading }}"> |
| 3003 <strong>loading...</strong> |
| 3004 </template> |
| 3005 </template> |
| 3006 </polymer-element> |
| 3007 |
| 3008 <polymer-element name="isolate-location" extends="observatory-element"> |
| 3009 <template> |
| 3010 <template if="{{ isolate.pauseEvent != null }}"> |
| 3011 <template if="{{ isolate.pauseEvent.eventType == 'IsolateCreated' }}"> |
| 3012 at isolate start |
| 3013 </template> |
| 3014 |
| 3015 <template if="{{ isolate.pauseEvent.eventType == 'IsolateShutdown' }}"> |
| 3016 at isolate exit |
| 3017 </template> |
| 3018 |
| 3019 <template if="{{ isolate.pauseEvent.eventType == 'IsolateInterrupted' || |
| 3020 isolate.pauseEvent.eventType == 'BreakpointReached' || |
| 3021 isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> |
| 3022 <template if="{{ isolate.pauseEvent.breakpoint != null }}"> |
| 3023 by breakpoint |
| 3024 </template> |
| 3025 <template if="{{ isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> |
| 3026 by exception |
| 3027 </template> |
| 3028 at |
| 3029 <function-ref ref="{{ isolate.topFrame['function'] }}"> |
| 3030 </function-ref> |
| 3031 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) |
| 3032 </template> |
| 3033 </template> |
| 3034 |
| 3035 <template if="{{ isolate.running }}"> |
| 3036 at |
| 3037 <function-ref ref="{{ isolate.topFrame['function'] }}"> |
| 3038 </function-ref> |
| 3039 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra
me['tokenPos'] }}"></script-ref>) |
| 3040 </template> |
| 3041 |
| 3042 </template> |
| 3043 </polymer-element> |
| 3044 |
| 3045 <polymer-element name="isolate-shared-summary" extends="observatory-element"> |
| 3178 <template> | 3046 <template> |
| 3179 <style> | 3047 <style> |
| 3180 .idle { | 3048 .errorBox { |
| 3181 color: #0489c3; | |
| 3182 cursor: pointer; | |
| 3183 } | |
| 3184 .busy { | |
| 3185 color: #aaa; | |
| 3186 cursor: wait; | |
| 3187 } | |
| 3188 </style> | |
| 3189 | |
| 3190 <template if="{{ busy }}"> | |
| 3191 <span class="busy">{{ label }}</span> | |
| 3192 </template> | |
| 3193 <template if="{{ !busy }}"> | |
| 3194 <span class="idle"><a on-click="{{ evalNow }}">{{ label }}</a></span> | |
| 3195 </template> | |
| 3196 <template if="{{ result != null }}"> | |
| 3197 = <any-service-ref ref="{{ result }}"></any-service-ref> | |
| 3198 </template> | |
| 3199 </template> | |
| 3200 </polymer-element> | |
| 3201 | |
| 3202 | |
| 3203 | |
| 3204 | |
| 3205 | |
| 3206 | |
| 3207 | |
| 3208 | |
| 3209 <polymer-element name="field-ref" extends="service-ref"> | |
| 3210 <template> | |
| 3211 <style>/* Global styles */ | |
| 3212 * { | |
| 3213 margin: 0; | |
| 3214 padding: 0; | |
| 3215 font: 400 14px 'Montserrat', sans-serif; | |
| 3216 color: #333; | |
| 3217 box-sizing: border-box; | |
| 3218 } | |
| 3219 | |
| 3220 .content { | |
| 3221 padding-left: 10%; | |
| 3222 font: 400 14px 'Montserrat', sans-serif; | |
| 3223 } | |
| 3224 | |
| 3225 .content-centered { | |
| 3226 padding-left: 10%; | |
| 3227 padding-right: 10%; | |
| 3228 font: 400 14px 'Montserrat', sans-serif; | |
| 3229 } | |
| 3230 | |
| 3231 .content-centered-big { | |
| 3232 padding-left: 5%; | |
| 3233 padding-right: 5%; | |
| 3234 font: 400 14px 'Montserrat', sans-serif; | |
| 3235 } | |
| 3236 | |
| 3237 h1 { | |
| 3238 font: 400 18px 'Montserrat', sans-serif; | |
| 3239 } | |
| 3240 | |
| 3241 .memberList { | |
| 3242 display: table; | |
| 3243 } | |
| 3244 | |
| 3245 .memberItem { | |
| 3246 display: table-row; | |
| 3247 } | |
| 3248 | |
| 3249 .memberName, .memberValue { | |
| 3250 display: table-cell; | |
| 3251 vertical-align: top; | |
| 3252 padding: 3px 0 3px 1em; | |
| 3253 font: 400 14px 'Montserrat', sans-serif; | |
| 3254 } | |
| 3255 | |
| 3256 .memberSmall { | |
| 3257 display: table-cell; | |
| 3258 vertical-align: top; | |
| 3259 padding: 3px 0 3px 1em; | |
| 3260 font: 400 12px 'Montserrat', sans-serif; | |
| 3261 } | |
| 3262 | |
| 3263 .monospace { | |
| 3264 font-family: consolas, courier, monospace; | |
| 3265 font-size: 1em; | |
| 3266 line-height: 1.2em; | |
| 3267 white-space: nowrap; | |
| 3268 } | |
| 3269 | |
| 3270 a { | |
| 3271 color: #0489c3; | |
| 3272 text-decoration: none; | |
| 3273 } | |
| 3274 | |
| 3275 a:hover { | |
| 3276 text-decoration: underline; | |
| 3277 } | |
| 3278 | |
| 3279 em { | |
| 3280 color: inherit; | |
| 3281 font-style: italic; | |
| 3282 } | |
| 3283 | |
| 3284 b { | |
| 3285 color: inherit; | |
| 3286 font-weight: bold; | |
| 3287 } | |
| 3288 | |
| 3289 hr { | |
| 3290 margin-top: 20px; | |
| 3291 margin-bottom: 20px; | |
| 3292 border: 0; | |
| 3293 border-top: 1px solid #eee; | |
| 3294 height: 0; | |
| 3295 box-sizing: content-box; | |
| 3296 } | |
| 3297 | |
| 3298 .list-group { | |
| 3299 padding-left: 0; | |
| 3300 margin-bottom: 20px; | |
| 3301 } | |
| 3302 | |
| 3303 .list-group-item { | |
| 3304 position: relative; | |
| 3305 display: block; | |
| 3306 padding: 10px 15px; | |
| 3307 margin-bottom: -1px; | |
| 3308 background-color: #fff; | |
| 3309 } | |
| 3310 | |
| 3311 .list-group-item:first-child { | |
| 3312 /* rounded top corners */ | |
| 3313 border-top-right-radius:4px; | |
| 3314 border-top-left-radius:4px; | |
| 3315 } | |
| 3316 | |
| 3317 .list-group-item:last-child { | |
| 3318 margin-bottom: 0; | |
| 3319 /* rounded bottom corners */ | |
| 3320 border-bottom-right-radius: 4px; | |
| 3321 border-bottom-left-radius:4px; | |
| 3322 } | |
| 3323 | |
| 3324 /* Flex row container */ | |
| 3325 .flex-row { | |
| 3326 display: flex; | |
| 3327 flex-direction: row; | |
| 3328 } | |
| 3329 | |
| 3330 /* Flex column container */ | |
| 3331 .flex-column { | |
| 3332 display: flex; | |
| 3333 flex-direction: column; | |
| 3334 } | |
| 3335 | |
| 3336 .flex-item-fit { | |
| 3337 flex-grow: 1; | |
| 3338 flex-shrink: 1; | |
| 3339 flex-basis: auto; | |
| 3340 } | |
| 3341 | |
| 3342 .flex-item-no-shrink { | |
| 3343 flex-grow: 0; | |
| 3344 flex-shrink: 0; | |
| 3345 flex-basis: auto; | |
| 3346 } | |
| 3347 | |
| 3348 .flex-item-fill { | |
| 3349 flex-grow: 0; | |
| 3350 flex-shrink: 1; /* shrink when pressured */ | |
| 3351 flex-basis: 100%; /* try and take 100% */ | |
| 3352 } | |
| 3353 | |
| 3354 .flex-item-fixed-1-12 { | |
| 3355 flex-grow: 0; | |
| 3356 flex-shrink: 0; | |
| 3357 flex-basis: 8.3%; | |
| 3358 } | |
| 3359 | |
| 3360 .flex-item-fixed-2-12 { | |
| 3361 flex-grow: 0; | |
| 3362 flex-shrink: 0; | |
| 3363 flex-basis: 16.6%; | |
| 3364 } | |
| 3365 | |
| 3366 .flex-item-fixed-4-12 { | |
| 3367 flex-grow: 0; | |
| 3368 flex-shrink: 0; | |
| 3369 flex-basis: 33.3333%; | |
| 3370 } | |
| 3371 | |
| 3372 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 3373 flex-grow: 0; | |
| 3374 flex-shrink: 0; | |
| 3375 flex-basis: 50%; | |
| 3376 } | |
| 3377 | |
| 3378 .flex-item-fixed-8-12 { | |
| 3379 flex-grow: 0; | |
| 3380 flex-shrink: 0; | |
| 3381 flex-basis: 66.6666%; | |
| 3382 } | |
| 3383 | |
| 3384 .flex-item-fixed-9-12 { | |
| 3385 flex-grow: 0; | |
| 3386 flex-shrink: 0; | |
| 3387 flex-basis: 75%; | |
| 3388 } | |
| 3389 | |
| 3390 | |
| 3391 .flex-item-fixed-12-12 { | |
| 3392 flex-grow: 0; | |
| 3393 flex-shrink: 0; | |
| 3394 flex-basis: 100%; | |
| 3395 } | |
| 3396 | |
| 3397 .flex-item-10-percent { | |
| 3398 flex-grow: 0; | |
| 3399 flex-shrink: 0; | |
| 3400 flex-basis: 10%; | |
| 3401 } | |
| 3402 | |
| 3403 .flex-item-15-percent { | |
| 3404 flex-grow: 0; | |
| 3405 flex-shrink: 0; | |
| 3406 flex-basis: 15%; | |
| 3407 } | |
| 3408 | |
| 3409 .flex-item-20-percent { | |
| 3410 flex-grow: 0; | |
| 3411 flex-shrink: 0; | |
| 3412 flex-basis: 20%; | |
| 3413 } | |
| 3414 | |
| 3415 .flex-item-30-percent { | |
| 3416 flex-grow: 0; | |
| 3417 flex-shrink: 0; | |
| 3418 flex-basis: 30%; | |
| 3419 } | |
| 3420 | |
| 3421 .flex-item-40-percent { | |
| 3422 flex-grow: 0; | |
| 3423 flex-shrink: 0; | |
| 3424 flex-basis: 40%; | |
| 3425 } | |
| 3426 | |
| 3427 .flex-item-50-percent { | |
| 3428 flex-grow: 0; | |
| 3429 flex-shrink: 0; | |
| 3430 flex-basis: 50%; | |
| 3431 } | |
| 3432 | |
| 3433 .flex-item-60-percent { | |
| 3434 flex-grow: 0; | |
| 3435 flex-shrink: 0; | |
| 3436 flex-basis: 60%; | |
| 3437 } | |
| 3438 | |
| 3439 .flex-item-70-percent { | |
| 3440 flex-grow: 0; | |
| 3441 flex-shrink: 0; | |
| 3442 flex-basis: 70%; | |
| 3443 } | |
| 3444 | |
| 3445 .flex-item-80-percent { | |
| 3446 flex-grow: 0; | |
| 3447 flex-shrink: 0; | |
| 3448 flex-basis: 80%; | |
| 3449 } | |
| 3450 | |
| 3451 .well { | |
| 3452 min-height: 20px; | |
| 3453 padding: 19px; | |
| 3454 margin-bottom: 20px; | |
| 3455 background-color: #f5f5f5; | |
| 3456 border: 1px solid #e3e3e3; | |
| 3457 border-radius: 4px; | |
| 3458 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 3459 } | |
| 3460 | |
| 3461 .break-wrap { | |
| 3462 word-wrap: break-word; | |
| 3463 } | |
| 3464 </style> | |
| 3465 <span> | |
| 3466 <template if="{{ ref.isStatic] }}">static</template> | |
| 3467 <template if="{{ ref.isFinal }}">final</template> | |
| 3468 <template if="{{ ref.isConst }}">const</template> | |
| 3469 <template if="{{ (ref.declaredType.name == 'dynamic' && | |
| 3470 !ref.isFinal && !ref.isConst) }}"> | |
| 3471 var | |
| 3472 </template> | |
| 3473 <template if="{{ (ref.declaredType.name != 'dynamic') }}"> | |
| 3474 <instance-ref ref="{{ ref.declaredType }}"></instance-ref> | |
| 3475 </template> | |
| 3476 <a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url }}">{{ name
}}</a> | |
| 3477 </span> | |
| 3478 </template> | |
| 3479 </polymer-element> | |
| 3480 | |
| 3481 | |
| 3482 | |
| 3483 | |
| 3484 | |
| 3485 | |
| 3486 | |
| 3487 <polymer-element name="function-ref" extends="service-ref"> | |
| 3488 <template><style>/* Global styles */ | |
| 3489 * { | |
| 3490 margin: 0; | |
| 3491 padding: 0; | |
| 3492 font: 400 14px 'Montserrat', sans-serif; | |
| 3493 color: #333; | |
| 3494 box-sizing: border-box; | |
| 3495 } | |
| 3496 | |
| 3497 .content { | |
| 3498 padding-left: 10%; | |
| 3499 font: 400 14px 'Montserrat', sans-serif; | |
| 3500 } | |
| 3501 | |
| 3502 .content-centered { | |
| 3503 padding-left: 10%; | |
| 3504 padding-right: 10%; | |
| 3505 font: 400 14px 'Montserrat', sans-serif; | |
| 3506 } | |
| 3507 | |
| 3508 .content-centered-big { | |
| 3509 padding-left: 5%; | |
| 3510 padding-right: 5%; | |
| 3511 font: 400 14px 'Montserrat', sans-serif; | |
| 3512 } | |
| 3513 | |
| 3514 h1 { | |
| 3515 font: 400 18px 'Montserrat', sans-serif; | |
| 3516 } | |
| 3517 | |
| 3518 .memberList { | |
| 3519 display: table; | |
| 3520 } | |
| 3521 | |
| 3522 .memberItem { | |
| 3523 display: table-row; | |
| 3524 } | |
| 3525 | |
| 3526 .memberName, .memberValue { | |
| 3527 display: table-cell; | |
| 3528 vertical-align: top; | |
| 3529 padding: 3px 0 3px 1em; | |
| 3530 font: 400 14px 'Montserrat', sans-serif; | |
| 3531 } | |
| 3532 | |
| 3533 .memberSmall { | |
| 3534 display: table-cell; | |
| 3535 vertical-align: top; | |
| 3536 padding: 3px 0 3px 1em; | |
| 3537 font: 400 12px 'Montserrat', sans-serif; | |
| 3538 } | |
| 3539 | |
| 3540 .monospace { | |
| 3541 font-family: consolas, courier, monospace; | |
| 3542 font-size: 1em; | |
| 3543 line-height: 1.2em; | |
| 3544 white-space: nowrap; | |
| 3545 } | |
| 3546 | |
| 3547 a { | |
| 3548 color: #0489c3; | |
| 3549 text-decoration: none; | |
| 3550 } | |
| 3551 | |
| 3552 a:hover { | |
| 3553 text-decoration: underline; | |
| 3554 } | |
| 3555 | |
| 3556 em { | |
| 3557 color: inherit; | |
| 3558 font-style: italic; | |
| 3559 } | |
| 3560 | |
| 3561 b { | |
| 3562 color: inherit; | |
| 3563 font-weight: bold; | |
| 3564 } | |
| 3565 | |
| 3566 hr { | |
| 3567 margin-top: 20px; | |
| 3568 margin-bottom: 20px; | |
| 3569 border: 0; | |
| 3570 border-top: 1px solid #eee; | |
| 3571 height: 0; | |
| 3572 box-sizing: content-box; | |
| 3573 } | |
| 3574 | |
| 3575 .list-group { | |
| 3576 padding-left: 0; | |
| 3577 margin-bottom: 20px; | |
| 3578 } | |
| 3579 | |
| 3580 .list-group-item { | |
| 3581 position: relative; | |
| 3582 display: block; | |
| 3583 padding: 10px 15px; | |
| 3584 margin-bottom: -1px; | |
| 3585 background-color: #fff; | |
| 3586 } | |
| 3587 | |
| 3588 .list-group-item:first-child { | |
| 3589 /* rounded top corners */ | |
| 3590 border-top-right-radius:4px; | |
| 3591 border-top-left-radius:4px; | |
| 3592 } | |
| 3593 | |
| 3594 .list-group-item:last-child { | |
| 3595 margin-bottom: 0; | |
| 3596 /* rounded bottom corners */ | |
| 3597 border-bottom-right-radius: 4px; | |
| 3598 border-bottom-left-radius:4px; | |
| 3599 } | |
| 3600 | |
| 3601 /* Flex row container */ | |
| 3602 .flex-row { | |
| 3603 display: flex; | |
| 3604 flex-direction: row; | |
| 3605 } | |
| 3606 | |
| 3607 /* Flex column container */ | |
| 3608 .flex-column { | |
| 3609 display: flex; | |
| 3610 flex-direction: column; | |
| 3611 } | |
| 3612 | |
| 3613 .flex-item-fit { | |
| 3614 flex-grow: 1; | |
| 3615 flex-shrink: 1; | |
| 3616 flex-basis: auto; | |
| 3617 } | |
| 3618 | |
| 3619 .flex-item-no-shrink { | |
| 3620 flex-grow: 0; | |
| 3621 flex-shrink: 0; | |
| 3622 flex-basis: auto; | |
| 3623 } | |
| 3624 | |
| 3625 .flex-item-fill { | |
| 3626 flex-grow: 0; | |
| 3627 flex-shrink: 1; /* shrink when pressured */ | |
| 3628 flex-basis: 100%; /* try and take 100% */ | |
| 3629 } | |
| 3630 | |
| 3631 .flex-item-fixed-1-12 { | |
| 3632 flex-grow: 0; | |
| 3633 flex-shrink: 0; | |
| 3634 flex-basis: 8.3%; | |
| 3635 } | |
| 3636 | |
| 3637 .flex-item-fixed-2-12 { | |
| 3638 flex-grow: 0; | |
| 3639 flex-shrink: 0; | |
| 3640 flex-basis: 16.6%; | |
| 3641 } | |
| 3642 | |
| 3643 .flex-item-fixed-4-12 { | |
| 3644 flex-grow: 0; | |
| 3645 flex-shrink: 0; | |
| 3646 flex-basis: 33.3333%; | |
| 3647 } | |
| 3648 | |
| 3649 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 3650 flex-grow: 0; | |
| 3651 flex-shrink: 0; | |
| 3652 flex-basis: 50%; | |
| 3653 } | |
| 3654 | |
| 3655 .flex-item-fixed-8-12 { | |
| 3656 flex-grow: 0; | |
| 3657 flex-shrink: 0; | |
| 3658 flex-basis: 66.6666%; | |
| 3659 } | |
| 3660 | |
| 3661 .flex-item-fixed-9-12 { | |
| 3662 flex-grow: 0; | |
| 3663 flex-shrink: 0; | |
| 3664 flex-basis: 75%; | |
| 3665 } | |
| 3666 | |
| 3667 | |
| 3668 .flex-item-fixed-12-12 { | |
| 3669 flex-grow: 0; | |
| 3670 flex-shrink: 0; | |
| 3671 flex-basis: 100%; | |
| 3672 } | |
| 3673 | |
| 3674 .flex-item-10-percent { | |
| 3675 flex-grow: 0; | |
| 3676 flex-shrink: 0; | |
| 3677 flex-basis: 10%; | |
| 3678 } | |
| 3679 | |
| 3680 .flex-item-15-percent { | |
| 3681 flex-grow: 0; | |
| 3682 flex-shrink: 0; | |
| 3683 flex-basis: 15%; | |
| 3684 } | |
| 3685 | |
| 3686 .flex-item-20-percent { | |
| 3687 flex-grow: 0; | |
| 3688 flex-shrink: 0; | |
| 3689 flex-basis: 20%; | |
| 3690 } | |
| 3691 | |
| 3692 .flex-item-30-percent { | |
| 3693 flex-grow: 0; | |
| 3694 flex-shrink: 0; | |
| 3695 flex-basis: 30%; | |
| 3696 } | |
| 3697 | |
| 3698 .flex-item-40-percent { | |
| 3699 flex-grow: 0; | |
| 3700 flex-shrink: 0; | |
| 3701 flex-basis: 40%; | |
| 3702 } | |
| 3703 | |
| 3704 .flex-item-50-percent { | |
| 3705 flex-grow: 0; | |
| 3706 flex-shrink: 0; | |
| 3707 flex-basis: 50%; | |
| 3708 } | |
| 3709 | |
| 3710 .flex-item-60-percent { | |
| 3711 flex-grow: 0; | |
| 3712 flex-shrink: 0; | |
| 3713 flex-basis: 60%; | |
| 3714 } | |
| 3715 | |
| 3716 .flex-item-70-percent { | |
| 3717 flex-grow: 0; | |
| 3718 flex-shrink: 0; | |
| 3719 flex-basis: 70%; | |
| 3720 } | |
| 3721 | |
| 3722 .flex-item-80-percent { | |
| 3723 flex-grow: 0; | |
| 3724 flex-shrink: 0; | |
| 3725 flex-basis: 80%; | |
| 3726 } | |
| 3727 | |
| 3728 .well { | |
| 3729 min-height: 20px; | |
| 3730 padding: 19px; | |
| 3731 margin-bottom: 20px; | |
| 3732 background-color: #f5f5f5; | |
| 3733 border: 1px solid #e3e3e3; | |
| 3734 border-radius: 4px; | |
| 3735 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 3736 } | |
| 3737 | |
| 3738 .break-wrap { | |
| 3739 word-wrap: break-word; | |
| 3740 } | |
| 3741 </style><!-- These comments are here to allow newlines. | |
| 3742 --><template if="{{ ref.isDart }}"><!-- | |
| 3743 --><template if="{{ qualified && ref.parent == null && re
f.owningClass != null }}"><!-- | |
| 3744 --><class-ref ref="{{ ref.owningClass] }}"></class-ref>.</template><!-- | |
| 3745 --><template if="{{ qualified && ref.parent != null }}"><!-- | |
| 3746 --><function-ref ref="{{ ref.parent }}" qualified="{{ true }}"> | |
| 3747 </function-ref>.<!-- | |
| 3748 --></template><a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a><!-- | |
| 3749 --></template><template if="{{ !ref.isDart }}"><span> {{ name }}</span></templ
ate></template> | |
| 3750 </polymer-element> | |
| 3751 | |
| 3752 | |
| 3753 | |
| 3754 | |
| 3755 | |
| 3756 | |
| 3757 <polymer-element name="library-ref" extends="service-ref"> | |
| 3758 <template><style>/* Global styles */ | |
| 3759 * { | |
| 3760 margin: 0; | |
| 3761 padding: 0; | |
| 3762 font: 400 14px 'Montserrat', sans-serif; | |
| 3763 color: #333; | |
| 3764 box-sizing: border-box; | |
| 3765 } | |
| 3766 | |
| 3767 .content { | |
| 3768 padding-left: 10%; | |
| 3769 font: 400 14px 'Montserrat', sans-serif; | |
| 3770 } | |
| 3771 | |
| 3772 .content-centered { | |
| 3773 padding-left: 10%; | |
| 3774 padding-right: 10%; | |
| 3775 font: 400 14px 'Montserrat', sans-serif; | |
| 3776 } | |
| 3777 | |
| 3778 .content-centered-big { | |
| 3779 padding-left: 5%; | |
| 3780 padding-right: 5%; | |
| 3781 font: 400 14px 'Montserrat', sans-serif; | |
| 3782 } | |
| 3783 | |
| 3784 h1 { | |
| 3785 font: 400 18px 'Montserrat', sans-serif; | |
| 3786 } | |
| 3787 | |
| 3788 .memberList { | |
| 3789 display: table; | |
| 3790 } | |
| 3791 | |
| 3792 .memberItem { | |
| 3793 display: table-row; | |
| 3794 } | |
| 3795 | |
| 3796 .memberName, .memberValue { | |
| 3797 display: table-cell; | |
| 3798 vertical-align: top; | |
| 3799 padding: 3px 0 3px 1em; | |
| 3800 font: 400 14px 'Montserrat', sans-serif; | |
| 3801 } | |
| 3802 | |
| 3803 .memberSmall { | |
| 3804 display: table-cell; | |
| 3805 vertical-align: top; | |
| 3806 padding: 3px 0 3px 1em; | |
| 3807 font: 400 12px 'Montserrat', sans-serif; | |
| 3808 } | |
| 3809 | |
| 3810 .monospace { | |
| 3811 font-family: consolas, courier, monospace; | |
| 3812 font-size: 1em; | |
| 3813 line-height: 1.2em; | |
| 3814 white-space: nowrap; | |
| 3815 } | |
| 3816 | |
| 3817 a { | |
| 3818 color: #0489c3; | |
| 3819 text-decoration: none; | |
| 3820 } | |
| 3821 | |
| 3822 a:hover { | |
| 3823 text-decoration: underline; | |
| 3824 } | |
| 3825 | |
| 3826 em { | |
| 3827 color: inherit; | |
| 3828 font-style: italic; | |
| 3829 } | |
| 3830 | |
| 3831 b { | |
| 3832 color: inherit; | |
| 3833 font-weight: bold; | |
| 3834 } | |
| 3835 | |
| 3836 hr { | |
| 3837 margin-top: 20px; | |
| 3838 margin-bottom: 20px; | |
| 3839 border: 0; | |
| 3840 border-top: 1px solid #eee; | |
| 3841 height: 0; | |
| 3842 box-sizing: content-box; | |
| 3843 } | |
| 3844 | |
| 3845 .list-group { | |
| 3846 padding-left: 0; | |
| 3847 margin-bottom: 20px; | |
| 3848 } | |
| 3849 | |
| 3850 .list-group-item { | |
| 3851 position: relative; | |
| 3852 display: block; | |
| 3853 padding: 10px 15px; | |
| 3854 margin-bottom: -1px; | |
| 3855 background-color: #fff; | |
| 3856 } | |
| 3857 | |
| 3858 .list-group-item:first-child { | |
| 3859 /* rounded top corners */ | |
| 3860 border-top-right-radius:4px; | |
| 3861 border-top-left-radius:4px; | |
| 3862 } | |
| 3863 | |
| 3864 .list-group-item:last-child { | |
| 3865 margin-bottom: 0; | |
| 3866 /* rounded bottom corners */ | |
| 3867 border-bottom-right-radius: 4px; | |
| 3868 border-bottom-left-radius:4px; | |
| 3869 } | |
| 3870 | |
| 3871 /* Flex row container */ | |
| 3872 .flex-row { | |
| 3873 display: flex; | |
| 3874 flex-direction: row; | |
| 3875 } | |
| 3876 | |
| 3877 /* Flex column container */ | |
| 3878 .flex-column { | |
| 3879 display: flex; | |
| 3880 flex-direction: column; | |
| 3881 } | |
| 3882 | |
| 3883 .flex-item-fit { | |
| 3884 flex-grow: 1; | |
| 3885 flex-shrink: 1; | |
| 3886 flex-basis: auto; | |
| 3887 } | |
| 3888 | |
| 3889 .flex-item-no-shrink { | |
| 3890 flex-grow: 0; | |
| 3891 flex-shrink: 0; | |
| 3892 flex-basis: auto; | |
| 3893 } | |
| 3894 | |
| 3895 .flex-item-fill { | |
| 3896 flex-grow: 0; | |
| 3897 flex-shrink: 1; /* shrink when pressured */ | |
| 3898 flex-basis: 100%; /* try and take 100% */ | |
| 3899 } | |
| 3900 | |
| 3901 .flex-item-fixed-1-12 { | |
| 3902 flex-grow: 0; | |
| 3903 flex-shrink: 0; | |
| 3904 flex-basis: 8.3%; | |
| 3905 } | |
| 3906 | |
| 3907 .flex-item-fixed-2-12 { | |
| 3908 flex-grow: 0; | |
| 3909 flex-shrink: 0; | |
| 3910 flex-basis: 16.6%; | |
| 3911 } | |
| 3912 | |
| 3913 .flex-item-fixed-4-12 { | |
| 3914 flex-grow: 0; | |
| 3915 flex-shrink: 0; | |
| 3916 flex-basis: 33.3333%; | |
| 3917 } | |
| 3918 | |
| 3919 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 3920 flex-grow: 0; | |
| 3921 flex-shrink: 0; | |
| 3922 flex-basis: 50%; | |
| 3923 } | |
| 3924 | |
| 3925 .flex-item-fixed-8-12 { | |
| 3926 flex-grow: 0; | |
| 3927 flex-shrink: 0; | |
| 3928 flex-basis: 66.6666%; | |
| 3929 } | |
| 3930 | |
| 3931 .flex-item-fixed-9-12 { | |
| 3932 flex-grow: 0; | |
| 3933 flex-shrink: 0; | |
| 3934 flex-basis: 75%; | |
| 3935 } | |
| 3936 | |
| 3937 | |
| 3938 .flex-item-fixed-12-12 { | |
| 3939 flex-grow: 0; | |
| 3940 flex-shrink: 0; | |
| 3941 flex-basis: 100%; | |
| 3942 } | |
| 3943 | |
| 3944 .flex-item-10-percent { | |
| 3945 flex-grow: 0; | |
| 3946 flex-shrink: 0; | |
| 3947 flex-basis: 10%; | |
| 3948 } | |
| 3949 | |
| 3950 .flex-item-15-percent { | |
| 3951 flex-grow: 0; | |
| 3952 flex-shrink: 0; | |
| 3953 flex-basis: 15%; | |
| 3954 } | |
| 3955 | |
| 3956 .flex-item-20-percent { | |
| 3957 flex-grow: 0; | |
| 3958 flex-shrink: 0; | |
| 3959 flex-basis: 20%; | |
| 3960 } | |
| 3961 | |
| 3962 .flex-item-30-percent { | |
| 3963 flex-grow: 0; | |
| 3964 flex-shrink: 0; | |
| 3965 flex-basis: 30%; | |
| 3966 } | |
| 3967 | |
| 3968 .flex-item-40-percent { | |
| 3969 flex-grow: 0; | |
| 3970 flex-shrink: 0; | |
| 3971 flex-basis: 40%; | |
| 3972 } | |
| 3973 | |
| 3974 .flex-item-50-percent { | |
| 3975 flex-grow: 0; | |
| 3976 flex-shrink: 0; | |
| 3977 flex-basis: 50%; | |
| 3978 } | |
| 3979 | |
| 3980 .flex-item-60-percent { | |
| 3981 flex-grow: 0; | |
| 3982 flex-shrink: 0; | |
| 3983 flex-basis: 60%; | |
| 3984 } | |
| 3985 | |
| 3986 .flex-item-70-percent { | |
| 3987 flex-grow: 0; | |
| 3988 flex-shrink: 0; | |
| 3989 flex-basis: 70%; | |
| 3990 } | |
| 3991 | |
| 3992 .flex-item-80-percent { | |
| 3993 flex-grow: 0; | |
| 3994 flex-shrink: 0; | |
| 3995 flex-basis: 80%; | |
| 3996 } | |
| 3997 | |
| 3998 .well { | |
| 3999 min-height: 20px; | |
| 4000 padding: 19px; | |
| 4001 margin-bottom: 20px; | |
| 4002 background-color: #f5f5f5; | |
| 4003 border: 1px solid #e3e3e3; | |
| 4004 border-radius: 4px; | |
| 4005 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 4006 } | |
| 4007 | |
| 4008 .break-wrap { | |
| 4009 word-wrap: break-word; | |
| 4010 } | |
| 4011 </style> | |
| 4012 <template if="{{ nameIsEmpty }}"> | |
| 4013 <a on-click="{{ goto }}" _href="{{ url }}">unnamed</a> | |
| 4014 </template> | |
| 4015 <template if="{{ !nameIsEmpty }}"> | |
| 4016 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 4017 </template> | |
| 4018 </template> | |
| 4019 </polymer-element> | |
| 4020 | |
| 4021 | |
| 4022 | |
| 4023 | |
| 4024 | |
| 4025 | |
| 4026 | |
| 4027 <polymer-element name="script-inset" extends="observatory-element"> | |
| 4028 <template> | |
| 4029 <style> | |
| 4030 .sourceInset { | |
| 4031 } | |
| 4032 .sourceBox { | |
| 4033 background-color: #f5f5f5; | 3049 background-color: #f5f5f5; |
| 4034 border: 1px solid #ccc; | 3050 border: 1px solid #ccc; |
| 4035 padding: 10px; | 3051 padding: 10px; |
| 4036 overflow-y: auto; | 3052 font-family: consolas, courier, monospace; |
| 4037 } | 3053 font-size: 1em; |
| 4038 .sourceTable { | 3054 line-height: 1.2em; |
| 4039 display: table; | |
| 4040 } | |
| 4041 .sourceRow { | |
| 4042 display: table-row; | |
| 4043 } | |
| 4044 .sourceItem, .sourceItemCurrent { | |
| 4045 display: table-cell; | |
| 4046 vertical-align: top; | |
| 4047 font: 400 14px consolas, courier, monospace; | |
| 4048 line-height: 125%; | |
| 4049 white-space: pre; | 3055 white-space: pre; |
| 4050 } | 3056 } |
| 4051 .sourceItemCurrent { | |
| 4052 background-color: #6cf; | |
| 4053 } | |
| 4054 .hitsNone, .hitsNotExecuted, .hitsExecuted { | |
| 4055 min-width: 32px; | |
| 4056 text-align: right; | |
| 4057 } | |
| 4058 .hitsNotExecuted { | |
| 4059 background-color: #e66; | |
| 4060 } | |
| 4061 .hitsExecuted { | |
| 4062 background-color: #6d6; | |
| 4063 } | |
| 4064 </style> | 3057 </style> |
| 4065 <div class="sourceInset"> | 3058 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4066 <content></content> | 3059 <template if="{{ isolate.error != null }}"> |
| 4067 <div class="sourceBox" style="max-height:{{height}}"> | 3060 <div class="content-centered"> |
| 4068 <div class="sourceTable"> | 3061 <pre class="errorBox">{{ isolate.error.message }}</pre> |
| 4069 <template if="{{ linesReady }}"> | 3062 <br> |
| 4070 <template repeat="{{ line in lines }}"> | 3063 </div> |
| 4071 <div class="sourceRow" id="{{ makeLineId(line.line) }}"> | 3064 </template> |
| 4072 <breakpoint-toggle line="{{ line }}"></breakpoint-toggle> | 3065 <div class="flex-row"> |
| 4073 | 3066 <div class="flex-item-10-percent"> |
| 4074 <div class="sourceItem"> </div> | 3067 </div> |
| 4075 | 3068 <div class="flex-item-40-percent"> |
| 4076 <template if="{{ line.hits == null || | 3069 <isolate-counter-chart counters="{{ isolate.counters }}"></isolate-count
er-chart> |
| 4077 line.hits < 0 }}"> | 3070 </div> |
| 4078 <div class="hitsNone">{{ line.line }}</div> | 3071 <div class="flex-item-40-percent"> |
| 4079 </template> | 3072 <div class="memberList"> |
| 4080 <template if="{{ line.hits == 0 }}"> | 3073 <div class="memberItem"> |
| 4081 <div class="hitsNotExecuted">{{ line.line }}</div> | 3074 <div class="memberName">new heap</div> |
| 4082 </template> | 3075 <div class="memberValue"> |
| 4083 <template if="{{ line.hits > 0 }}"> | 3076 {{ isolate.newSpace.used | formatSize }} |
| 4084 <div class="hitsExecuted">{{ line.line }}</div> | 3077 of |
| 4085 </template> | 3078 {{ isolate.newSpace.capacity | formatSize }} |
| 4086 | |
| 4087 <div class="sourceItem"> </div> | |
| 4088 | |
| 4089 <template if="{{ line.line == currentLine }}"> | |
| 4090 <div class="sourceItemCurrent">{{line.text}}</div> | |
| 4091 </template> | |
| 4092 <template if="{{ line.line != currentLine }}"> | |
| 4093 <div class="sourceItem">{{line.text}}</div> | |
| 4094 </template> | |
| 4095 </div> | |
| 4096 </template> | |
| 4097 </template> | |
| 4098 | |
| 4099 <template if="{{ !linesReady }}"> | |
| 4100 <div class="sourceRow"> | |
| 4101 <div class="sourceItem">loading...</div> | |
| 4102 </div> | 3079 </div> |
| 4103 </template> | 3080 </div> |
| 4104 </div> | 3081 <div class="memberItem"> |
| 4105 </div> | 3082 <div class="memberName">old heap</div> |
| 4106 </div> | 3083 <div class="memberValue"> |
| 4107 </template> | 3084 {{ isolate.oldSpace.used | formatSize }} |
| 4108 </polymer-element> | 3085 of |
| 4109 | 3086 {{ isolate.oldSpace.capacity | formatSize }} |
| 4110 <polymer-element name="breakpoint-toggle" extends="observatory-element"> | 3087 </div> |
| 4111 <template> | 3088 </div> |
| 4112 <style> | 3089 </div> |
| 4113 .emptyBreakpoint, .possibleBreakpoint, .busyBreakpoint, .unresolvedBreakpo
int, .resolvedBreakpoint { | 3090 <br> |
| 4114 display: table-cell; | 3091 <div class="memberItem"> |
| 4115 vertical-align: top; | 3092 <div class="memberValue"> |
| 4116 font: 400 14px consolas, courier, monospace; | 3093 See <a on-click="{{ goto }}" _href="{{ gotoLink('/debugger' + isolat
e.link) }}">debugger</a> |
| 4117 min-width: 1em; | 3094 </div> |
| 4118 text-align: center; | 3095 </div> |
| 4119 cursor: pointer; | 3096 <div class="memberItem"> |
| 4120 } | 3097 <div class="memberValue"> |
| 4121 .possibleBreakpoint { | 3098 See <a on-click="{{ goto }}" _href="{{ gotoLink('/class-tree' + isol
ate.link) }}">class hierarchy</a> |
| 4122 color: #e0e0e0; | 3099 </div> |
| 4123 } | 3100 </div> |
| 4124 .possibleBreakpoint:hover { | 3101 <div class="memberItem"> |
| 4125 color: white; | 3102 <div class="memberValue"> |
| 4126 background-color: #777; | 3103 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('profile')) }}">cpu profile</a> |
| 4127 } | 3104 </div> |
| 4128 .busyBreakpoint { | 3105 </div> |
| 4129 color: white; | 3106 <div class="memberItem"> |
| 4130 background-color: black; | 3107 <div class="memberValue"> |
| 4131 cursor: wait; | 3108 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('allocationprofile')) }}">allocation profile</a> |
| 4132 } | 3109 </div> |
| 4133 .unresolvedBreakpoint { | 3110 </div> |
| 4134 color: white; | 3111 <div class="memberItem"> |
| 4135 background-color: #cac; | 3112 <div class="memberValue"> |
| 4136 } | 3113 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('heapmap')) }}">heap map</a> |
| 4137 .resolvedBreakpoint { | 3114 </div> |
| 4138 color: white; | 3115 </div> |
| 4139 background-color: #e66; | 3116 <div class="memberItem"> |
| 4140 } | 3117 <div class="memberValue"> |
| 4141 </style> | 3118 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('metrics')) }}">metrics</a> |
| 4142 | 3119 </div> |
| 4143 <template if="{{ line.possibleBpt && busy}}"> | 3120 </div> |
| 4144 <div class="busyBreakpoint">B</div> | 3121 <!-- Temporarily disabled until UI for dart:io is acceptable. |
| 4145 </template> | 3122 <template if="{{ isolate.ioEnabled }}"> |
| 4146 | 3123 <div class="memberItem"> |
| 4147 <template if="{{ line.bpt == null && !line.possibleBpt }}"> | 3124 <div class="memberValue"> |
| 4148 <div class="emptyBreakpoint"> </div> | 3125 See <a on-click="{{ goto }}" href="{{ gotoLink(isolate.relativeLin
k('io')) }}">dart:io</a> |
| 4149 </template> | 3126 </div> |
| 4150 | 3127 </div> |
| 4151 <template if="{{ line.bpt == null && line.possibleBpt && !bu
sy}}"> | 3128 </template> |
| 4152 <div class="possibleBreakpoint"> | 3129 --> |
| 4153 <a on-click="{{ toggleBreakpoint }}">B</a> | 3130 </div> |
| 4154 </div> | 3131 <div class="flex-item-10-percent"> |
| 4155 </template> | 3132 </div> |
| 4156 | 3133 </div> |
| 4157 <template if="{{ line.bpt != null && !line.bpt['resolved'] &&
; !busy}}"> | 3134 </template> |
| 4158 <div class="unresolvedBreakpoint"> | 3135 </polymer-element> |
| 4159 <a on-click="{{ toggleBreakpoint }}">B</a> | 3136 |
| 4160 </div> | 3137 <polymer-element name="isolate-counter-chart" extends="observatory-element"> |
| 4161 </template> | 3138 <template> |
| 4162 | 3139 <div id="counterPieChart" style="height: 200px"></div> |
| 4163 <template if="{{ line.bpt != null && line.bpt['resolved'] &&
!busy}}"> | 3140 </template> |
| 4164 <div class="resolvedBreakpoint"> | 3141 </polymer-element> |
| 4165 <a on-click="{{ toggleBreakpoint }}">B</a> | 3142 |
| 4166 </div> | |
| 4167 </template> | |
| 4168 | |
| 4169 </template> | |
| 4170 </polymer-element> | |
| 4171 | |
| 4172 | 3143 |
| 4173 | 3144 |
| 4174 | 3145 |
| 4175 | 3146 |
| 4176 | 3147 |
| 4177 | 3148 |
| 4178 <polymer-element name="script-ref" extends="service-ref"> | 3149 |
| 4179 <template> | 3150 |
| 4180 <style>/* Global styles */ | 3151 |
| 4181 * { | 3152 |
| 4182 margin: 0; | 3153 |
| 4183 padding: 0; | 3154 |
| 4184 font: 400 14px 'Montserrat', sans-serif; | 3155 |
| 4185 color: #333; | 3156 |
| 4186 box-sizing: border-box; | 3157 <polymer-element name="isolate-view" extends="observatory-element"> |
| 4187 } | |
| 4188 | |
| 4189 .content { | |
| 4190 padding-left: 10%; | |
| 4191 font: 400 14px 'Montserrat', sans-serif; | |
| 4192 } | |
| 4193 | |
| 4194 .content-centered { | |
| 4195 padding-left: 10%; | |
| 4196 padding-right: 10%; | |
| 4197 font: 400 14px 'Montserrat', sans-serif; | |
| 4198 } | |
| 4199 | |
| 4200 .content-centered-big { | |
| 4201 padding-left: 5%; | |
| 4202 padding-right: 5%; | |
| 4203 font: 400 14px 'Montserrat', sans-serif; | |
| 4204 } | |
| 4205 | |
| 4206 h1 { | |
| 4207 font: 400 18px 'Montserrat', sans-serif; | |
| 4208 } | |
| 4209 | |
| 4210 .memberList { | |
| 4211 display: table; | |
| 4212 } | |
| 4213 | |
| 4214 .memberItem { | |
| 4215 display: table-row; | |
| 4216 } | |
| 4217 | |
| 4218 .memberName, .memberValue { | |
| 4219 display: table-cell; | |
| 4220 vertical-align: top; | |
| 4221 padding: 3px 0 3px 1em; | |
| 4222 font: 400 14px 'Montserrat', sans-serif; | |
| 4223 } | |
| 4224 | |
| 4225 .memberSmall { | |
| 4226 display: table-cell; | |
| 4227 vertical-align: top; | |
| 4228 padding: 3px 0 3px 1em; | |
| 4229 font: 400 12px 'Montserrat', sans-serif; | |
| 4230 } | |
| 4231 | |
| 4232 .monospace { | |
| 4233 font-family: consolas, courier, monospace; | |
| 4234 font-size: 1em; | |
| 4235 line-height: 1.2em; | |
| 4236 white-space: nowrap; | |
| 4237 } | |
| 4238 | |
| 4239 a { | |
| 4240 color: #0489c3; | |
| 4241 text-decoration: none; | |
| 4242 } | |
| 4243 | |
| 4244 a:hover { | |
| 4245 text-decoration: underline; | |
| 4246 } | |
| 4247 | |
| 4248 em { | |
| 4249 color: inherit; | |
| 4250 font-style: italic; | |
| 4251 } | |
| 4252 | |
| 4253 b { | |
| 4254 color: inherit; | |
| 4255 font-weight: bold; | |
| 4256 } | |
| 4257 | |
| 4258 hr { | |
| 4259 margin-top: 20px; | |
| 4260 margin-bottom: 20px; | |
| 4261 border: 0; | |
| 4262 border-top: 1px solid #eee; | |
| 4263 height: 0; | |
| 4264 box-sizing: content-box; | |
| 4265 } | |
| 4266 | |
| 4267 .list-group { | |
| 4268 padding-left: 0; | |
| 4269 margin-bottom: 20px; | |
| 4270 } | |
| 4271 | |
| 4272 .list-group-item { | |
| 4273 position: relative; | |
| 4274 display: block; | |
| 4275 padding: 10px 15px; | |
| 4276 margin-bottom: -1px; | |
| 4277 background-color: #fff; | |
| 4278 } | |
| 4279 | |
| 4280 .list-group-item:first-child { | |
| 4281 /* rounded top corners */ | |
| 4282 border-top-right-radius:4px; | |
| 4283 border-top-left-radius:4px; | |
| 4284 } | |
| 4285 | |
| 4286 .list-group-item:last-child { | |
| 4287 margin-bottom: 0; | |
| 4288 /* rounded bottom corners */ | |
| 4289 border-bottom-right-radius: 4px; | |
| 4290 border-bottom-left-radius:4px; | |
| 4291 } | |
| 4292 | |
| 4293 /* Flex row container */ | |
| 4294 .flex-row { | |
| 4295 display: flex; | |
| 4296 flex-direction: row; | |
| 4297 } | |
| 4298 | |
| 4299 /* Flex column container */ | |
| 4300 .flex-column { | |
| 4301 display: flex; | |
| 4302 flex-direction: column; | |
| 4303 } | |
| 4304 | |
| 4305 .flex-item-fit { | |
| 4306 flex-grow: 1; | |
| 4307 flex-shrink: 1; | |
| 4308 flex-basis: auto; | |
| 4309 } | |
| 4310 | |
| 4311 .flex-item-no-shrink { | |
| 4312 flex-grow: 0; | |
| 4313 flex-shrink: 0; | |
| 4314 flex-basis: auto; | |
| 4315 } | |
| 4316 | |
| 4317 .flex-item-fill { | |
| 4318 flex-grow: 0; | |
| 4319 flex-shrink: 1; /* shrink when pressured */ | |
| 4320 flex-basis: 100%; /* try and take 100% */ | |
| 4321 } | |
| 4322 | |
| 4323 .flex-item-fixed-1-12 { | |
| 4324 flex-grow: 0; | |
| 4325 flex-shrink: 0; | |
| 4326 flex-basis: 8.3%; | |
| 4327 } | |
| 4328 | |
| 4329 .flex-item-fixed-2-12 { | |
| 4330 flex-grow: 0; | |
| 4331 flex-shrink: 0; | |
| 4332 flex-basis: 16.6%; | |
| 4333 } | |
| 4334 | |
| 4335 .flex-item-fixed-4-12 { | |
| 4336 flex-grow: 0; | |
| 4337 flex-shrink: 0; | |
| 4338 flex-basis: 33.3333%; | |
| 4339 } | |
| 4340 | |
| 4341 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 4342 flex-grow: 0; | |
| 4343 flex-shrink: 0; | |
| 4344 flex-basis: 50%; | |
| 4345 } | |
| 4346 | |
| 4347 .flex-item-fixed-8-12 { | |
| 4348 flex-grow: 0; | |
| 4349 flex-shrink: 0; | |
| 4350 flex-basis: 66.6666%; | |
| 4351 } | |
| 4352 | |
| 4353 .flex-item-fixed-9-12 { | |
| 4354 flex-grow: 0; | |
| 4355 flex-shrink: 0; | |
| 4356 flex-basis: 75%; | |
| 4357 } | |
| 4358 | |
| 4359 | |
| 4360 .flex-item-fixed-12-12 { | |
| 4361 flex-grow: 0; | |
| 4362 flex-shrink: 0; | |
| 4363 flex-basis: 100%; | |
| 4364 } | |
| 4365 | |
| 4366 .flex-item-10-percent { | |
| 4367 flex-grow: 0; | |
| 4368 flex-shrink: 0; | |
| 4369 flex-basis: 10%; | |
| 4370 } | |
| 4371 | |
| 4372 .flex-item-15-percent { | |
| 4373 flex-grow: 0; | |
| 4374 flex-shrink: 0; | |
| 4375 flex-basis: 15%; | |
| 4376 } | |
| 4377 | |
| 4378 .flex-item-20-percent { | |
| 4379 flex-grow: 0; | |
| 4380 flex-shrink: 0; | |
| 4381 flex-basis: 20%; | |
| 4382 } | |
| 4383 | |
| 4384 .flex-item-30-percent { | |
| 4385 flex-grow: 0; | |
| 4386 flex-shrink: 0; | |
| 4387 flex-basis: 30%; | |
| 4388 } | |
| 4389 | |
| 4390 .flex-item-40-percent { | |
| 4391 flex-grow: 0; | |
| 4392 flex-shrink: 0; | |
| 4393 flex-basis: 40%; | |
| 4394 } | |
| 4395 | |
| 4396 .flex-item-50-percent { | |
| 4397 flex-grow: 0; | |
| 4398 flex-shrink: 0; | |
| 4399 flex-basis: 50%; | |
| 4400 } | |
| 4401 | |
| 4402 .flex-item-60-percent { | |
| 4403 flex-grow: 0; | |
| 4404 flex-shrink: 0; | |
| 4405 flex-basis: 60%; | |
| 4406 } | |
| 4407 | |
| 4408 .flex-item-70-percent { | |
| 4409 flex-grow: 0; | |
| 4410 flex-shrink: 0; | |
| 4411 flex-basis: 70%; | |
| 4412 } | |
| 4413 | |
| 4414 .flex-item-80-percent { | |
| 4415 flex-grow: 0; | |
| 4416 flex-shrink: 0; | |
| 4417 flex-basis: 80%; | |
| 4418 } | |
| 4419 | |
| 4420 .well { | |
| 4421 min-height: 20px; | |
| 4422 padding: 19px; | |
| 4423 margin-bottom: 20px; | |
| 4424 background-color: #f5f5f5; | |
| 4425 border: 1px solid #e3e3e3; | |
| 4426 border-radius: 4px; | |
| 4427 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 4428 } | |
| 4429 | |
| 4430 .break-wrap { | |
| 4431 word-wrap: break-word; | |
| 4432 } | |
| 4433 </style> | |
| 4434 <a on-click="{{ goto }}" title="{{ hoverText }}" _href="{{ url }}">{{ name }}<
/a> | |
| 4435 </template> | |
| 4436 </polymer-element> | |
| 4437 | |
| 4438 | |
| 4439 | |
| 4440 | |
| 4441 <polymer-element name="class-view" extends="observatory-element"> | |
| 4442 <template> | 3158 <template> |
| 4443 <style>/* Global styles */ | 3159 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4444 * { | 3160 <style> |
| 4445 margin: 0; | 3161 .sourceInset { |
| 4446 padding: 0; | 3162 padding-left: 15%; |
| 4447 font: 400 14px 'Montserrat', sans-serif; | 3163 padding-right: 15%; |
| 4448 color: #333; | 3164 } |
| 4449 box-sizing: border-box; | 3165 .miniProfileChart { |
| 4450 } | 3166 width: 80%; |
| 4451 | 3167 } |
| 4452 .content { | 3168 </style> |
| 4453 padding-left: 10%; | 3169 |
| 4454 font: 400 14px 'Montserrat', sans-serif; | |
| 4455 } | |
| 4456 | |
| 4457 .content-centered { | |
| 4458 padding-left: 10%; | |
| 4459 padding-right: 10%; | |
| 4460 font: 400 14px 'Montserrat', sans-serif; | |
| 4461 } | |
| 4462 | |
| 4463 .content-centered-big { | |
| 4464 padding-left: 5%; | |
| 4465 padding-right: 5%; | |
| 4466 font: 400 14px 'Montserrat', sans-serif; | |
| 4467 } | |
| 4468 | |
| 4469 h1 { | |
| 4470 font: 400 18px 'Montserrat', sans-serif; | |
| 4471 } | |
| 4472 | |
| 4473 .memberList { | |
| 4474 display: table; | |
| 4475 } | |
| 4476 | |
| 4477 .memberItem { | |
| 4478 display: table-row; | |
| 4479 } | |
| 4480 | |
| 4481 .memberName, .memberValue { | |
| 4482 display: table-cell; | |
| 4483 vertical-align: top; | |
| 4484 padding: 3px 0 3px 1em; | |
| 4485 font: 400 14px 'Montserrat', sans-serif; | |
| 4486 } | |
| 4487 | |
| 4488 .memberSmall { | |
| 4489 display: table-cell; | |
| 4490 vertical-align: top; | |
| 4491 padding: 3px 0 3px 1em; | |
| 4492 font: 400 12px 'Montserrat', sans-serif; | |
| 4493 } | |
| 4494 | |
| 4495 .monospace { | |
| 4496 font-family: consolas, courier, monospace; | |
| 4497 font-size: 1em; | |
| 4498 line-height: 1.2em; | |
| 4499 white-space: nowrap; | |
| 4500 } | |
| 4501 | |
| 4502 a { | |
| 4503 color: #0489c3; | |
| 4504 text-decoration: none; | |
| 4505 } | |
| 4506 | |
| 4507 a:hover { | |
| 4508 text-decoration: underline; | |
| 4509 } | |
| 4510 | |
| 4511 em { | |
| 4512 color: inherit; | |
| 4513 font-style: italic; | |
| 4514 } | |
| 4515 | |
| 4516 b { | |
| 4517 color: inherit; | |
| 4518 font-weight: bold; | |
| 4519 } | |
| 4520 | |
| 4521 hr { | |
| 4522 margin-top: 20px; | |
| 4523 margin-bottom: 20px; | |
| 4524 border: 0; | |
| 4525 border-top: 1px solid #eee; | |
| 4526 height: 0; | |
| 4527 box-sizing: content-box; | |
| 4528 } | |
| 4529 | |
| 4530 .list-group { | |
| 4531 padding-left: 0; | |
| 4532 margin-bottom: 20px; | |
| 4533 } | |
| 4534 | |
| 4535 .list-group-item { | |
| 4536 position: relative; | |
| 4537 display: block; | |
| 4538 padding: 10px 15px; | |
| 4539 margin-bottom: -1px; | |
| 4540 background-color: #fff; | |
| 4541 } | |
| 4542 | |
| 4543 .list-group-item:first-child { | |
| 4544 /* rounded top corners */ | |
| 4545 border-top-right-radius:4px; | |
| 4546 border-top-left-radius:4px; | |
| 4547 } | |
| 4548 | |
| 4549 .list-group-item:last-child { | |
| 4550 margin-bottom: 0; | |
| 4551 /* rounded bottom corners */ | |
| 4552 border-bottom-right-radius: 4px; | |
| 4553 border-bottom-left-radius:4px; | |
| 4554 } | |
| 4555 | |
| 4556 /* Flex row container */ | |
| 4557 .flex-row { | |
| 4558 display: flex; | |
| 4559 flex-direction: row; | |
| 4560 } | |
| 4561 | |
| 4562 /* Flex column container */ | |
| 4563 .flex-column { | |
| 4564 display: flex; | |
| 4565 flex-direction: column; | |
| 4566 } | |
| 4567 | |
| 4568 .flex-item-fit { | |
| 4569 flex-grow: 1; | |
| 4570 flex-shrink: 1; | |
| 4571 flex-basis: auto; | |
| 4572 } | |
| 4573 | |
| 4574 .flex-item-no-shrink { | |
| 4575 flex-grow: 0; | |
| 4576 flex-shrink: 0; | |
| 4577 flex-basis: auto; | |
| 4578 } | |
| 4579 | |
| 4580 .flex-item-fill { | |
| 4581 flex-grow: 0; | |
| 4582 flex-shrink: 1; /* shrink when pressured */ | |
| 4583 flex-basis: 100%; /* try and take 100% */ | |
| 4584 } | |
| 4585 | |
| 4586 .flex-item-fixed-1-12 { | |
| 4587 flex-grow: 0; | |
| 4588 flex-shrink: 0; | |
| 4589 flex-basis: 8.3%; | |
| 4590 } | |
| 4591 | |
| 4592 .flex-item-fixed-2-12 { | |
| 4593 flex-grow: 0; | |
| 4594 flex-shrink: 0; | |
| 4595 flex-basis: 16.6%; | |
| 4596 } | |
| 4597 | |
| 4598 .flex-item-fixed-4-12 { | |
| 4599 flex-grow: 0; | |
| 4600 flex-shrink: 0; | |
| 4601 flex-basis: 33.3333%; | |
| 4602 } | |
| 4603 | |
| 4604 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 4605 flex-grow: 0; | |
| 4606 flex-shrink: 0; | |
| 4607 flex-basis: 50%; | |
| 4608 } | |
| 4609 | |
| 4610 .flex-item-fixed-8-12 { | |
| 4611 flex-grow: 0; | |
| 4612 flex-shrink: 0; | |
| 4613 flex-basis: 66.6666%; | |
| 4614 } | |
| 4615 | |
| 4616 .flex-item-fixed-9-12 { | |
| 4617 flex-grow: 0; | |
| 4618 flex-shrink: 0; | |
| 4619 flex-basis: 75%; | |
| 4620 } | |
| 4621 | |
| 4622 | |
| 4623 .flex-item-fixed-12-12 { | |
| 4624 flex-grow: 0; | |
| 4625 flex-shrink: 0; | |
| 4626 flex-basis: 100%; | |
| 4627 } | |
| 4628 | |
| 4629 .flex-item-10-percent { | |
| 4630 flex-grow: 0; | |
| 4631 flex-shrink: 0; | |
| 4632 flex-basis: 10%; | |
| 4633 } | |
| 4634 | |
| 4635 .flex-item-15-percent { | |
| 4636 flex-grow: 0; | |
| 4637 flex-shrink: 0; | |
| 4638 flex-basis: 15%; | |
| 4639 } | |
| 4640 | |
| 4641 .flex-item-20-percent { | |
| 4642 flex-grow: 0; | |
| 4643 flex-shrink: 0; | |
| 4644 flex-basis: 20%; | |
| 4645 } | |
| 4646 | |
| 4647 .flex-item-30-percent { | |
| 4648 flex-grow: 0; | |
| 4649 flex-shrink: 0; | |
| 4650 flex-basis: 30%; | |
| 4651 } | |
| 4652 | |
| 4653 .flex-item-40-percent { | |
| 4654 flex-grow: 0; | |
| 4655 flex-shrink: 0; | |
| 4656 flex-basis: 40%; | |
| 4657 } | |
| 4658 | |
| 4659 .flex-item-50-percent { | |
| 4660 flex-grow: 0; | |
| 4661 flex-shrink: 0; | |
| 4662 flex-basis: 50%; | |
| 4663 } | |
| 4664 | |
| 4665 .flex-item-60-percent { | |
| 4666 flex-grow: 0; | |
| 4667 flex-shrink: 0; | |
| 4668 flex-basis: 60%; | |
| 4669 } | |
| 4670 | |
| 4671 .flex-item-70-percent { | |
| 4672 flex-grow: 0; | |
| 4673 flex-shrink: 0; | |
| 4674 flex-basis: 70%; | |
| 4675 } | |
| 4676 | |
| 4677 .flex-item-80-percent { | |
| 4678 flex-grow: 0; | |
| 4679 flex-shrink: 0; | |
| 4680 flex-basis: 80%; | |
| 4681 } | |
| 4682 | |
| 4683 .well { | |
| 4684 min-height: 20px; | |
| 4685 padding: 19px; | |
| 4686 margin-bottom: 20px; | |
| 4687 background-color: #f5f5f5; | |
| 4688 border: 1px solid #e3e3e3; | |
| 4689 border-radius: 4px; | |
| 4690 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 4691 } | |
| 4692 | |
| 4693 .break-wrap { | |
| 4694 word-wrap: break-word; | |
| 4695 } | |
| 4696 </style> | |
| 4697 <nav-bar> | 3170 <nav-bar> |
| 4698 <top-nav-menu></top-nav-menu> | 3171 <top-nav-menu></top-nav-menu> |
| 4699 <isolate-nav-menu isolate="{{ cls.isolate }}"></isolate-nav-menu> | 3172 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}"> |
| 4700 <library-nav-menu library="{{ cls.library }}"></library-nav-menu> | 3173 </isolate-nav-menu> |
| 4701 <class-nav-menu cls="{{ cls }}" last="{{ true }}"></class-nav-menu> | |
| 4702 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> | 3174 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> |
| 4703 <nav-refresh callback="{{ refresh }}"></nav-refresh> | 3175 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4704 <nav-control></nav-control> | 3176 <nav-control></nav-control> |
| 4705 </nav-bar> | 3177 </nav-bar> |
| 4706 | 3178 |
| 4707 <div class="content"> | 3179 <div class="content"> |
| 4708 <h1> | 3180 <h1>isolate '{{ isolate.name }}'</h1> |
| 4709 <template if="{{ cls.isAbstract }}"> | 3181 </div> |
| 4710 abstract | 3182 |
| 4711 </template> | 3183 <br> |
| 4712 <template if="{{ cls.isPatch }}"> | 3184 <div class="flex-row"> |
| 4713 patch | 3185 <div class="flex-item-10-percent"> |
| 4714 </template> | 3186 </div> |
| 4715 class {{ cls.name }} | 3187 <div class="flex-item-30-percent"> |
| 4716 </h1> | 3188 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> |
| 4717 <div class="memberList"> | 3189 </div> |
| 4718 <div class="memberItem"> | 3190 <div class="flex-item-50-percent"> |
| 4719 <div class="memberName">library</div> | 3191 <isolate-location isolate="{{ isolate }}"></isolate-location> |
| 4720 <div class="memberValue"> | 3192 </div> |
| 4721 <library-ref ref="{{ cls.library }}"></library-ref> | 3193 <div class="flex-item-10-percent"> |
| 3194 </div> |
| 3195 </div> |
| 3196 <br> |
| 3197 |
| 3198 <template if="{{ isolate.topFrame != null }}"> |
| 3199 <br> |
| 3200 <script-inset script="{{ isolate.topFrame['script'] }}" currentpos="{{ iso
late.topFrame['tokenPos'] }}" height="200px"> |
| 3201 </script-inset> |
| 3202 </template> |
| 3203 |
| 3204 <div class="flex-row"> |
| 3205 <div class="flex-item-20-percent"></div> |
| 3206 <div class="flex-item-60-percent"><hr></div> |
| 3207 <div class="flex-item-20-percent"></div> |
| 3208 </div> |
| 3209 |
| 3210 <br> |
| 3211 |
| 3212 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> |
| 3213 |
| 3214 <div class="flex-row"> |
| 3215 <div class="flex-item-20-percent"></div> |
| 3216 <div class="flex-item-60-percent"><hr></div> |
| 3217 <div class="flex-item-20-percent"></div> |
| 3218 </div> |
| 3219 |
| 3220 <div class="content-centered"> |
| 3221 <div class="flex-row"> |
| 3222 <div class="flex-item-50-percent"> |
| 3223 <div class="memberList"> |
| 3224 <div class="memberItem"> |
| 3225 <div class="memberName">root library</div> |
| 3226 <div class="memberValue"> |
| 3227 <library-ref ref="{{ isolate.rootLib }}"></library-ref> |
| 3228 </div> |
| 3229 </div> |
| 3230 <div class="memberItem"> |
| 3231 <template if="{{ isolate.entry != null }}"> |
| 3232 <div class="memberName">entry</div> |
| 3233 <div class="memberValue"> |
| 3234 <function-ref ref="{{ isolate.entry }}"></function-ref> |
| 3235 </div> |
| 3236 </template> |
| 3237 </div> |
| 3238 <div class="memberItem"> |
| 3239 <div class="memberName">isolate id</div> |
| 3240 <div class="memberValue">{{ isolate.mainPort }}</div> |
| 3241 </div> |
| 4722 </div> | 3242 </div> |
| 4723 </div> | 3243 </div> |
| 4724 <div class="memberItem"> | 3244 <div class="flex-item-50-percent"> |
| 4725 <div class="memberName">script</div> | 3245 <div class="memberItem"> |
| 4726 <div class="memberValue"> | 3246 <div class="memberValue"> |
| 4727 <script-ref ref="{{ cls.script }}" pos="{{ cls.tokenPos }}"> | 3247 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLi
nk('debug/breakpoints')) }}">breakpoints</a> |
| 4728 </script-ref> | 3248 </div> |
| 4729 </div> | 3249 </div> |
| 4730 </div> | 3250 </div> |
| 4731 | 3251 </div> |
| 4732 <div class="memberItem"> </div> | 3252 </div> |
| 4733 | |
| 4734 <template if="{{ cls.superclass != null }}"> | |
| 4735 <div class="memberItem"> | |
| 4736 <div class="memberName">extends</div> | |
| 4737 <div class="memberValue"> | |
| 4738 <class-ref ref="{{ cls.superclass }}"></class-ref> | |
| 4739 </div> | |
| 4740 </div> | |
| 4741 </template> | |
| 4742 <template if="{{ cls.subclasses.length > 0 }}"> | |
| 4743 <div class="memberItem"> | |
| 4744 <div class="memberName">extended by</div> | |
| 4745 <div class="memberValue"> | |
| 4746 <template repeat="{{ subclass in cls.subclasses }}"> | |
| 4747 <class-ref ref="{{ subclass }}"></class-ref> | |
| 4748 </template> | |
| 4749 </div> | |
| 4750 </div> | |
| 4751 </template> | |
| 4752 | |
| 4753 <div class="memberItem"> </div> | |
| 4754 | |
| 4755 <template if="{{ cls.interfaces.length > 0 }}"> | |
| 4756 <div class="memberItem"> | |
| 4757 <div class="memberName">implements</div> | |
| 4758 <div class="memberValue"> | |
| 4759 <template repeat="{{ interface in cls.interfaces }}"> | |
| 4760 <class-ref ref="{{ interface }}"></class-ref> | |
| 4761 </template> | |
| 4762 </div> | |
| 4763 </div> | |
| 4764 </template> | |
| 4765 <template if="{{ cls.name != cls.vmName }}"> | |
| 4766 <div class="memberItem"> | |
| 4767 <div class="memberName">vm name</div> | |
| 4768 <div class="memberValue">{{ cls.vmName }}</div> | |
| 4769 </div> | |
| 4770 </template> | |
| 4771 </div> | |
| 4772 </div> | |
| 4773 | |
| 4774 <template if="{{ cls.error != null }}"> | |
| 4775 <error-ref ref="{{ cls.error }}"></error-ref> | |
| 4776 </template> | |
| 4777 | 3253 |
| 4778 <hr> | 3254 <hr> |
| 4779 | 3255 |
| 4780 <div class="content"> | 3256 <div class="content"> |
| 4781 <template if="{{ cls.fields.isNotEmpty }}"> | 3257 libraries ({{ isolate.libraries.length }}) |
| 4782 fields ({{ cls.fields.length }}) | 3258 <curly-block expand="{{ isolate.libraries.length <= 8 }}"> |
| 4783 <curly-block expand="{{ cls.fields.length <= 8 }}"> | 3259 <div class="memberList"> |
| 4784 <div class="memberList"> | 3260 <template repeat="{{ lib in isolate.libraries }}"> |
| 4785 <template repeat="{{ field in cls.fields }}"> | 3261 <div class="memberItem"> |
| 4786 <div class="memberItem"> | 3262 <div class="memberName"> |
| 4787 <div class="memberName"> | 3263 <library-ref ref="{{ lib }}"></library-ref> |
| 4788 <field-ref ref="{{ field }}"></field-ref> | 3264 </div> |
| 4789 </div> | 3265 </div> |
| 4790 <div class="memberValue"> | 3266 </template> |
| 4791 <template if="{{ field.value != null }}"> | 3267 </div> |
| 4792 <any-service-ref ref="{{ field.value }}"></any-service-ref> | 3268 </curly-block> |
| 4793 </template> | 3269 </div> |
| 4794 </div> | 3270 |
| 4795 </div> | 3271 <hr> |
| 4796 </template> | 3272 |
| 4797 </div> | 3273 <div class="content"> |
| 4798 </curly-block><br><br> | 3274 <div id="tagProfileChart" class="miniProfileChart" style="height: 600px"><
/div> |
| 4799 </template> | |
| 4800 | |
| 4801 <template if="{{ cls.functions.isNotEmpty }}"> | |
| 4802 functions ({{ cls.functions.length }}) | |
| 4803 <curly-block expand="{{ cls.functions.length <= 8 }}"> | |
| 4804 <div class="memberList"> | |
| 4805 <template repeat="{{ function in cls.functions }}"> | |
| 4806 <div class="memberItem"> | |
| 4807 <div class="memberValue"> | |
| 4808 <function-ref ref="{{ function }}" qualified="{{ false }}"> | |
| 4809 </function-ref> | |
| 4810 </div> | |
| 4811 </div> | |
| 4812 </template> | |
| 4813 </div> | |
| 4814 </curly-block><br><br> | |
| 4815 </template> | |
| 4816 | |
| 4817 <template if="{{ !cls.hasNoAllocations }}"> | |
| 4818 instances | |
| 4819 <div class="memberItem"> | |
| 4820 <div class="memberName">currently allocated</div> | |
| 4821 <div class="memberValue"> | |
| 4822 count {{ cls.newSpace.current.instances + cls.oldSpace.current.ins
tances }} | |
| 4823 (shallow size {{ cls.newSpace.current.bytes + cls.oldSpace.current
.bytes | formatSize }}) | |
| 4824 </div> | |
| 4825 </div> | |
| 4826 <div class="memberItem"> | |
| 4827 <div class="memberName">strongly reachable</div> | |
| 4828 <div class="memberValue"> | |
| 4829 <template if="{{ instances == null }}"> | |
| 4830 <eval-link callback="{{ reachable }}" label="[find]" expr="100"> | |
| 4831 </eval-link> | |
| 4832 </template> | |
| 4833 <template if="{{ instances != null }}"> | |
| 4834 sample | |
| 4835 <any-service-ref ref="{{ instances['sample'] }}"></any-service-r
ef> | |
| 4836 <template if="{{ instances['totalCount'] > instances['sampleCoun
t'] }}"> | |
| 4837 <eval-link callback="{{ reachable }}" label="[more]" expr="{{
instances['sampleCount'] * 2 }}"> | |
| 4838 </eval-link> | |
| 4839 </template> | |
| 4840 of total {{ instances['totalCount'] }} | |
| 4841 </template> | |
| 4842 </div> | |
| 4843 </div> | |
| 4844 <div class="memberItem"> | |
| 4845 <div class="memberName">retained size</div> | |
| 4846 <div class="memberValue"> | |
| 4847 <template if="{{ retainedBytes == null }}"> | |
| 4848 <eval-link callback="{{ retainedSize }}" label="[calculate]"> | |
| 4849 </eval-link> | |
| 4850 </template> | |
| 4851 <template if="{{ retainedBytes != null }}"> | |
| 4852 {{ retainedBytes | formatSize }} | |
| 4853 </template> | |
| 4854 </div> | |
| 4855 </div> | |
| 4856 </template> | |
| 4857 </div> | 3275 </div> |
| 4858 | 3276 |
| 4859 <hr> | 3277 <hr> |
| 4860 | 3278 |
| 4861 <div class="content"> | 3279 <div class="content"> |
| 4862 <eval-box callback="{{ eval }}"></eval-box> | 3280 <eval-box callback="{{ eval }}"></eval-box> |
| 4863 </div> | 3281 </div> |
| 4864 | |
| 4865 <hr> | |
| 4866 <script-inset script="{{ cls.script }}" startpos="{{ cls.tokenPos }}" endpos
="{{ cls.endTokenPos }}"> | |
| 4867 </script-inset> | |
| 4868 | |
| 4869 <br><br><br><br> | 3282 <br><br><br><br> |
| 4870 <br><br><br><br> | 3283 <br><br><br><br> |
| 4871 </template> | 3284 </template> |
| 4872 </polymer-element> | 3285 </polymer-element> |
| 4873 | 3286 |
| 3287 |
| 3288 |
| 3289 |
| 3290 |
| 3291 |
| 3292 |
| 3293 |
| 3294 |
| 3295 |
| 3296 |
| 3297 |
| 3298 |
| 3299 |
| 3300 |
| 3301 |
| 3302 |
| 3303 <polymer-element name="inbound-reference" extends="service-ref"> |
| 3304 <template> |
| 3305 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3306 <div> |
| 3307 from <any-service-ref ref="{{ source }}"></any-service-ref> |
| 3308 <template if="{{ slotIsArrayIndex }}">via [{{ slot }}]</template> |
| 3309 <template if="{{ slotIsField }}">via <field-ref ref="{{ slot }}"></field-r
ef></template> |
| 3310 |
| 3311 <curly-block callback="{{ expander() }}"> |
| 3312 <div class="memberList"> |
| 3313 <div class="memberItem"> |
| 3314 <div class="memberName"> |
| 3315 <template repeat="{{ reference in inboundReferences] }}"> |
| 3316 <inbound-reference ref="{{ reference }}"></inbound-reference> |
| 3317 </template> |
| 3318 </div> |
| 3319 </div> |
| 3320 </div> |
| 3321 </curly-block> |
| 3322 </div> |
| 3323 </template> |
| 3324 </polymer-element> |
| 3325 |
| 3326 |
| 3327 |
| 3328 |
| 3329 |
| 3330 |
| 3331 |
| 3332 |
| 3333 |
| 3334 |
| 3335 |
| 3336 |
| 3337 |
| 3338 |
| 3339 |
| 3340 |
| 3341 |
| 3342 <polymer-element name="object-common" extends="observatory-element"> |
| 3343 <template> |
| 3344 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3345 <div class="memberList"> |
| 3346 |
| 3347 <div class="memberItem"> |
| 3348 <div class="memberName">class</div> |
| 3349 <div class="memberValue"> |
| 3350 <class-ref ref="{{ object.clazz }}"></class-ref> |
| 3351 </div> |
| 3352 </div> |
| 3353 |
| 3354 <template if="{{ object.size != null }}"> |
| 3355 <div class="memberItem" title="Space for this object in memory"> |
| 3356 <div class="memberName">size</div> |
| 3357 <div class="memberValue">{{ object.size | formatSize }}</div> |
| 3358 </div> |
| 3359 </template> |
| 3360 |
| 3361 <template if="{{ object.size == null }}"> |
| 3362 <div class="memberItem" title="Space for this object in memory"> |
| 3363 <div class="memberName">size</div> |
| 3364 <div class="memberValue">0</div> |
| 3365 </div> |
| 3366 </template> |
| 3367 |
| 3368 <div class="memberItem" title="Space that would be reclaimed if references
to this object were replaced with null"> |
| 3369 <div class="memberName">retained size</div> |
| 3370 <div class="memberValue"> |
| 3371 <template if="{{ retainedBytes == null }}"> |
| 3372 <eval-link callback="{{ retainedSize }}" label="[calculate]"> |
| 3373 </eval-link> |
| 3374 </template> |
| 3375 <template if="{{ retainedBytes != null }}"> |
| 3376 {{ retainedBytes | formatSize }} |
| 3377 </template> |
| 3378 </div> |
| 3379 </div> |
| 3380 |
| 3381 <div class="memberItem"> |
| 3382 <div class="memberName">retaining path</div> |
| 3383 <div class="memberValue"> |
| 3384 <template if="{{ path == null }}"> |
| 3385 <eval-link callback="{{ retainingPath }}" label="[find]" expr="10"> |
| 3386 </eval-link> |
| 3387 </template> |
| 3388 <template if="{{ path != null }}"> |
| 3389 <template repeat="{{ element in path['elements'] }}"> |
| 3390 <div class="memberItem"> |
| 3391 <div class="memberName">[{{ element['index']}}]</div> |
| 3392 <div class="memberValue"> |
| 3393 <any-service-ref ref="{{ element['value'] }}"></any-service-ref> |
| 3394 <template if="{{ element['parentField'] != null }}"> |
| 3395 in <field-ref ref="{{ element['parentField'] }}"></field-ref>
of |
| 3396 </template> |
| 3397 <template if="{{ element['parentListIndex'] != null }}"> |
| 3398 in [{{ element['parentListIndex'] }}] of |
| 3399 </template> |
| 3400 </div> |
| 3401 </div> |
| 3402 </template> |
| 3403 <template if="{{ path['length'] > path['elements'].length }}"> |
| 3404 showing {{ path['elements'].length }} of {{ path['length'] }} |
| 3405 <eval-link callback="{{ retainingPath }}" label="[find more]" expr
="{{ path['elements'].length * 2 }}"> |
| 3406 </eval-link> |
| 3407 </template> |
| 3408 </template> |
| 3409 </div> |
| 3410 </div> |
| 3411 |
| 3412 <div class="memberItem" title="Objects which directly reference this objec
t"> |
| 3413 <div class="memberName">inbound references</div> |
| 3414 <div class="memberValue"> |
| 3415 <template if="{{ inboundReferences == null }}"> |
| 3416 <eval-link callback="{{ fetchInboundReferences }}" label="[find]" ex
pr="100"> |
| 3417 </eval-link> |
| 3418 </template> |
| 3419 <template if="{{ inboundReferences != null }}"> |
| 3420 <template repeat="{{ reference in inboundReferences['references'] }}
"> |
| 3421 <inbound-reference ref="{{ reference }}"></inbound-reference> |
| 3422 </template> |
| 3423 </template> |
| 3424 </div> |
| 3425 </div> |
| 3426 |
| 3427 </div> |
| 3428 </template> |
| 3429 </polymer-element> |
| 3430 |
| 3431 |
| 3432 |
| 3433 |
| 3434 |
| 3435 |
| 3436 |
| 3437 |
| 3438 <polymer-element name="context-ref" extends="service-ref"> |
| 3439 <template> |
| 3440 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3441 <span> |
| 3442 <a on-click="{{ goto }}" _href="{{ url }}"><em>Context</em> ({{ ref.length
}})</a> |
| 3443 <curly-block callback="{{ expander() }}"> |
| 3444 <div class="memberList"> |
| 3445 <div class="memberItem"> |
| 3446 <div class="memberName">parent</div> |
| 3447 <div class="memberValue"> |
| 3448 <any-service-ref ref="{{ ref.parentContext }}"></any-service-ref> |
| 3449 </div> |
| 3450 </div> |
| 3451 <template repeat="{{ variable in ref.variables }}"> |
| 3452 <div class="memberItem"> |
| 3453 <div class="memberName">[{{ variable['index']}}]</div> |
| 3454 <div class="memberValue"> |
| 3455 <any-service-ref ref="{{ variable['value'] }}"></any-service-ref
> |
| 3456 </div> |
| 3457 </div> |
| 3458 </template> |
| 3459 </div> |
| 3460 </curly-block> |
| 3461 </span> |
| 3462 </template> |
| 3463 </polymer-element> |
| 3464 |
| 3465 |
| 3466 |
| 3467 |
| 3468 <polymer-element name="instance-view" extends="observatory-element"> |
| 3469 <template> |
| 3470 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3471 <nav-bar> |
| 3472 <top-nav-menu></top-nav-menu> |
| 3473 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu> |
| 3474 <!-- TODO(turnidge): Add library nav menu here. --> |
| 3475 <class-nav-menu cls="{{ instance.clazz }}"></class-nav-menu> |
| 3476 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> |
| 3477 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 3478 <nav-control></nav-control> |
| 3479 </nav-bar> |
| 3480 |
| 3481 <template if="{{ instance.isError }}"> |
| 3482 <error-view error_obj="{{ instance['error'] }}"></error-view> |
| 3483 </template> |
| 3484 |
| 3485 <template if="{{ !instance.isError }}"> |
| 3486 <div class="content"> |
| 3487 <template if="{{ instance.isAbstractType }}"> |
| 3488 <h1>type {{ instance.name }}</h1> |
| 3489 </template> |
| 3490 <template if="{{ !instance.isAbstractType }}"> |
| 3491 <h1>instance of {{ instance.clazz.name }}</h1> |
| 3492 </template> |
| 3493 |
| 3494 <object-common object="{{ instance }}"></object-common> |
| 3495 |
| 3496 <div class="memberList"> |
| 3497 <div class="memberItem"> </div> |
| 3498 |
| 3499 <template if="{{ instance.valueAsString != null }}"> |
| 3500 <div class="memberItem"> |
| 3501 <div class="memberName">value</div> |
| 3502 <div class="memberValue">{{ instance.valueAsString }}</div> |
| 3503 </div> |
| 3504 </template> |
| 3505 |
| 3506 <template if="{{ instance.isString }}"> |
| 3507 <div class="memberItem"> |
| 3508 <div class="memberName">valueAsLiteral</div> |
| 3509 <div class="memberValue"> {{ asStringLiteral(instance.valueAsStrin
g, instance.valueAsStringIsTruncated) }}</div> |
| 3510 </div> |
| 3511 </template> |
| 3512 |
| 3513 <template if="{{ instance.isMirrorReference }}"> |
| 3514 <div class="memberItem"> |
| 3515 <div class="memberName">referent</div> |
| 3516 <div class="memberValue"> |
| 3517 <any-service-ref ref="{{ instance.referent }}"> |
| 3518 </any-service-ref> |
| 3519 </div> |
| 3520 </div> |
| 3521 </template> |
| 3522 |
| 3523 <template if="{{ instance.typeClass != null }}"> |
| 3524 <div class="memberItem"> |
| 3525 <div class="memberName">type class</div> |
| 3526 <div class="memberValue"> |
| 3527 <class-ref ref="{{ instance.typeClass }}"> |
| 3528 </class-ref> |
| 3529 </div> |
| 3530 </div> |
| 3531 </template> |
| 3532 |
| 3533 <template if="{{ instance.isClosure }}"> |
| 3534 <div class="memberItem"> |
| 3535 <div class="memberName">closure function</div> |
| 3536 <div class="memberValue"> |
| 3537 <function-ref ref="{{ instance.closureFunc }}"> |
| 3538 </function-ref> |
| 3539 </div> |
| 3540 </div> |
| 3541 </template> |
| 3542 <template if="{{ instance.isClosure }}"> |
| 3543 <div class="memberItem"> |
| 3544 <div class="memberName">closure context</div> |
| 3545 <div class="memberValue"> |
| 3546 <any-service-ref ref="{{ instance.closureCtxt }}"> |
| 3547 </any-service-ref> |
| 3548 </div> |
| 3549 </div> |
| 3550 </template> |
| 3551 |
| 3552 <template if="{{ instance.isWeakProperty }}"> |
| 3553 <div class="memberItem"> |
| 3554 <div class="memberName">key</div> |
| 3555 <div class="memberValue"> |
| 3556 <any-service-ref ref="{{ instance.key }}"> |
| 3557 </any-service-ref> |
| 3558 </div> |
| 3559 </div> |
| 3560 <div class="memberItem"> |
| 3561 <div class="memberName">value</div> |
| 3562 <div class="memberValue"> |
| 3563 <any-service-ref ref="{{ instance.value }}"> |
| 3564 </any-service-ref> |
| 3565 </div> |
| 3566 </div> |
| 3567 </template> |
| 3568 |
| 3569 <div class="memberItem"> |
| 3570 <div class="memberName">toString()</div> |
| 3571 <div class="memberValue"> |
| 3572 <eval-link callback="{{ eval }}" expr="toString()"></eval-link> |
| 3573 </div> |
| 3574 </div> |
| 3575 </div> |
| 3576 </div> |
| 3577 |
| 3578 <hr> |
| 3579 |
| 3580 <div class="content"> |
| 3581 <template if="{{ instance.nativeFields.isNotEmpty }}"> |
| 3582 native fields ({{ instance.nativeFields.length }}) |
| 3583 <curly-block expand="{{ instance.nativeFields.length <= 8 }}"> |
| 3584 <div class="memberList"> |
| 3585 <template repeat="{{ field in instance.nativeFields }}"> |
| 3586 <div class="memberItem"> |
| 3587 <div class="memberName">[{{ field['index']}}]</div> |
| 3588 <div class="memberValue">[{{ field['value']}}]</div> |
| 3589 </div> |
| 3590 </template> |
| 3591 </div> |
| 3592 </curly-block><br><br> |
| 3593 </template> |
| 3594 |
| 3595 <template if="{{ instance.fields.isNotEmpty }}"> |
| 3596 fields ({{ instance.fields.length }}) |
| 3597 <curly-block expand="{{ instance.fields.length <= 8 }}"> |
| 3598 <div class="memberList"> |
| 3599 <template repeat="{{ field in instance.fields }}"> |
| 3600 <div class="memberItem"> |
| 3601 <div class="memberName"> |
| 3602 <field-ref ref="{{ field['decl'] }}"></field-ref> |
| 3603 </div> |
| 3604 <div class="memberValue"> |
| 3605 <any-service-ref ref="{{ field.value }}"></any-service-ref> |
| 3606 </div> |
| 3607 </div> |
| 3608 </template> |
| 3609 </div> |
| 3610 </curly-block><br><br> |
| 3611 </template> |
| 3612 |
| 3613 <template if="{{ instance.elements.isNotEmpty }}"> |
| 3614 elements ({{ instance.elements.length }}) |
| 3615 <curly-block expand="{{ instance.elements.length <= 8 }}"> |
| 3616 <div class="memberList"> |
| 3617 <template repeat="{{ element in instance.elements }}"> |
| 3618 <div class="memberItem"> |
| 3619 <div class="memberName">[{{ element['index']}}]</div> |
| 3620 <div class="memberValue"> |
| 3621 <any-service-ref ref="{{ element['value'] }}"></any-service-
ref> |
| 3622 </div> |
| 3623 </div> |
| 3624 </template> |
| 3625 </div> |
| 3626 </curly-block><br><br> |
| 3627 </template> |
| 3628 </div> |
| 3629 |
| 3630 <hr> |
| 3631 |
| 3632 <div class="content"> |
| 3633 <eval-box callback="{{ eval }}"></eval-box> |
| 3634 </div> |
| 3635 |
| 3636 <br><br><br><br> |
| 3637 <br><br><br><br> |
| 3638 |
| 3639 </template> |
| 3640 </template> |
| 3641 </polymer-element> |
| 3642 |
| 4874 | 3643 |
| 4875 | 3644 |
| 4876 | 3645 |
| 4877 | 3646 |
| 4878 | 3647 |
| 4879 <polymer-element name="code-ref" extends="service-ref"> | 3648 <polymer-element name="json-view" extends="observatory-element"> |
| 4880 <template> | 3649 <template> |
| 4881 <style>/* Global styles */ | 3650 <nav-bar> |
| 4882 * { | 3651 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 4883 margin: 0; | 3652 </nav-bar> |
| 4884 padding: 0; | 3653 <pre>{{ mapAsString }}</pre> |
| 4885 font: 400 14px 'Montserrat', sans-serif; | 3654 </template> |
| 4886 color: #333; | 3655 </polymer-element> |
| 4887 box-sizing: border-box; | 3656 |
| 4888 } | 3657 |
| 4889 | 3658 |
| 4890 .content { | 3659 |
| 4891 padding-left: 10%; | 3660 |
| 4892 font: 400 14px 'Montserrat', sans-serif; | 3661 |
| 4893 } | 3662 |
| 4894 | 3663 |
| 4895 .content-centered { | 3664 |
| 4896 padding-left: 10%; | 3665 |
| 4897 padding-right: 10%; | 3666 |
| 4898 font: 400 14px 'Montserrat', sans-serif; | 3667 |
| 4899 } | 3668 |
| 4900 | 3669 |
| 4901 .content-centered-big { | 3670 |
| 4902 padding-left: 5%; | 3671 |
| 4903 padding-right: 5%; | 3672 <polymer-element name="library-view" extends="observatory-element"> |
| 4904 font: 400 14px 'Montserrat', sans-serif; | 3673 <template> |
| 4905 } | 3674 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4906 | 3675 |
| 4907 h1 { | 3676 <nav-bar> |
| 4908 font: 400 18px 'Montserrat', sans-serif; | 3677 <top-nav-menu></top-nav-menu> |
| 4909 } | 3678 <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu> |
| 4910 | 3679 <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav-
menu> |
| 4911 .memberList { | 3680 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> |
| 4912 display: table; | 3681 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4913 } | 3682 <nav-control></nav-control> |
| 4914 | 3683 </nav-bar> |
| 4915 .memberItem { | 3684 |
| 4916 display: table-row; | 3685 <div class="content"> |
| 4917 } | 3686 <h1> |
| 4918 | 3687 <!-- TODO(turnidge): Handle unnamed libraries --> |
| 4919 .memberName, .memberValue { | 3688 library {{ library.name }} |
| 4920 display: table-cell; | 3689 </h1> |
| 4921 vertical-align: top; | 3690 <div class="memberList"> |
| 4922 padding: 3px 0 3px 1em; | 3691 <div class="memberItem"> |
| 4923 font: 400 14px 'Montserrat', sans-serif; | 3692 <div class="memberName">url</div> |
| 4924 } | 3693 <div class="memberValue">{{ library.url }}</div> |
| 4925 | 3694 </div> |
| 4926 .memberSmall { | 3695 <template if="{{ library.name != library.vmName }}"> |
| 4927 display: table-cell; | 3696 <div class="memberItem"> |
| 4928 vertical-align: top; | 3697 <div class="memberName">vm name</div> |
| 4929 padding: 3px 0 3px 1em; | 3698 <div class="memberValue">{{ library.vmName }}</div> |
| 4930 font: 400 12px 'Montserrat', sans-serif; | 3699 </div> |
| 4931 } | |
| 4932 | |
| 4933 .monospace { | |
| 4934 font-family: consolas, courier, monospace; | |
| 4935 font-size: 1em; | |
| 4936 line-height: 1.2em; | |
| 4937 white-space: nowrap; | |
| 4938 } | |
| 4939 | |
| 4940 a { | |
| 4941 color: #0489c3; | |
| 4942 text-decoration: none; | |
| 4943 } | |
| 4944 | |
| 4945 a:hover { | |
| 4946 text-decoration: underline; | |
| 4947 } | |
| 4948 | |
| 4949 em { | |
| 4950 color: inherit; | |
| 4951 font-style: italic; | |
| 4952 } | |
| 4953 | |
| 4954 b { | |
| 4955 color: inherit; | |
| 4956 font-weight: bold; | |
| 4957 } | |
| 4958 | |
| 4959 hr { | |
| 4960 margin-top: 20px; | |
| 4961 margin-bottom: 20px; | |
| 4962 border: 0; | |
| 4963 border-top: 1px solid #eee; | |
| 4964 height: 0; | |
| 4965 box-sizing: content-box; | |
| 4966 } | |
| 4967 | |
| 4968 .list-group { | |
| 4969 padding-left: 0; | |
| 4970 margin-bottom: 20px; | |
| 4971 } | |
| 4972 | |
| 4973 .list-group-item { | |
| 4974 position: relative; | |
| 4975 display: block; | |
| 4976 padding: 10px 15px; | |
| 4977 margin-bottom: -1px; | |
| 4978 background-color: #fff; | |
| 4979 } | |
| 4980 | |
| 4981 .list-group-item:first-child { | |
| 4982 /* rounded top corners */ | |
| 4983 border-top-right-radius:4px; | |
| 4984 border-top-left-radius:4px; | |
| 4985 } | |
| 4986 | |
| 4987 .list-group-item:last-child { | |
| 4988 margin-bottom: 0; | |
| 4989 /* rounded bottom corners */ | |
| 4990 border-bottom-right-radius: 4px; | |
| 4991 border-bottom-left-radius:4px; | |
| 4992 } | |
| 4993 | |
| 4994 /* Flex row container */ | |
| 4995 .flex-row { | |
| 4996 display: flex; | |
| 4997 flex-direction: row; | |
| 4998 } | |
| 4999 | |
| 5000 /* Flex column container */ | |
| 5001 .flex-column { | |
| 5002 display: flex; | |
| 5003 flex-direction: column; | |
| 5004 } | |
| 5005 | |
| 5006 .flex-item-fit { | |
| 5007 flex-grow: 1; | |
| 5008 flex-shrink: 1; | |
| 5009 flex-basis: auto; | |
| 5010 } | |
| 5011 | |
| 5012 .flex-item-no-shrink { | |
| 5013 flex-grow: 0; | |
| 5014 flex-shrink: 0; | |
| 5015 flex-basis: auto; | |
| 5016 } | |
| 5017 | |
| 5018 .flex-item-fill { | |
| 5019 flex-grow: 0; | |
| 5020 flex-shrink: 1; /* shrink when pressured */ | |
| 5021 flex-basis: 100%; /* try and take 100% */ | |
| 5022 } | |
| 5023 | |
| 5024 .flex-item-fixed-1-12 { | |
| 5025 flex-grow: 0; | |
| 5026 flex-shrink: 0; | |
| 5027 flex-basis: 8.3%; | |
| 5028 } | |
| 5029 | |
| 5030 .flex-item-fixed-2-12 { | |
| 5031 flex-grow: 0; | |
| 5032 flex-shrink: 0; | |
| 5033 flex-basis: 16.6%; | |
| 5034 } | |
| 5035 | |
| 5036 .flex-item-fixed-4-12 { | |
| 5037 flex-grow: 0; | |
| 5038 flex-shrink: 0; | |
| 5039 flex-basis: 33.3333%; | |
| 5040 } | |
| 5041 | |
| 5042 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 5043 flex-grow: 0; | |
| 5044 flex-shrink: 0; | |
| 5045 flex-basis: 50%; | |
| 5046 } | |
| 5047 | |
| 5048 .flex-item-fixed-8-12 { | |
| 5049 flex-grow: 0; | |
| 5050 flex-shrink: 0; | |
| 5051 flex-basis: 66.6666%; | |
| 5052 } | |
| 5053 | |
| 5054 .flex-item-fixed-9-12 { | |
| 5055 flex-grow: 0; | |
| 5056 flex-shrink: 0; | |
| 5057 flex-basis: 75%; | |
| 5058 } | |
| 5059 | |
| 5060 | |
| 5061 .flex-item-fixed-12-12 { | |
| 5062 flex-grow: 0; | |
| 5063 flex-shrink: 0; | |
| 5064 flex-basis: 100%; | |
| 5065 } | |
| 5066 | |
| 5067 .flex-item-10-percent { | |
| 5068 flex-grow: 0; | |
| 5069 flex-shrink: 0; | |
| 5070 flex-basis: 10%; | |
| 5071 } | |
| 5072 | |
| 5073 .flex-item-15-percent { | |
| 5074 flex-grow: 0; | |
| 5075 flex-shrink: 0; | |
| 5076 flex-basis: 15%; | |
| 5077 } | |
| 5078 | |
| 5079 .flex-item-20-percent { | |
| 5080 flex-grow: 0; | |
| 5081 flex-shrink: 0; | |
| 5082 flex-basis: 20%; | |
| 5083 } | |
| 5084 | |
| 5085 .flex-item-30-percent { | |
| 5086 flex-grow: 0; | |
| 5087 flex-shrink: 0; | |
| 5088 flex-basis: 30%; | |
| 5089 } | |
| 5090 | |
| 5091 .flex-item-40-percent { | |
| 5092 flex-grow: 0; | |
| 5093 flex-shrink: 0; | |
| 5094 flex-basis: 40%; | |
| 5095 } | |
| 5096 | |
| 5097 .flex-item-50-percent { | |
| 5098 flex-grow: 0; | |
| 5099 flex-shrink: 0; | |
| 5100 flex-basis: 50%; | |
| 5101 } | |
| 5102 | |
| 5103 .flex-item-60-percent { | |
| 5104 flex-grow: 0; | |
| 5105 flex-shrink: 0; | |
| 5106 flex-basis: 60%; | |
| 5107 } | |
| 5108 | |
| 5109 .flex-item-70-percent { | |
| 5110 flex-grow: 0; | |
| 5111 flex-shrink: 0; | |
| 5112 flex-basis: 70%; | |
| 5113 } | |
| 5114 | |
| 5115 .flex-item-80-percent { | |
| 5116 flex-grow: 0; | |
| 5117 flex-shrink: 0; | |
| 5118 flex-basis: 80%; | |
| 5119 } | |
| 5120 | |
| 5121 .well { | |
| 5122 min-height: 20px; | |
| 5123 padding: 19px; | |
| 5124 margin-bottom: 20px; | |
| 5125 background-color: #f5f5f5; | |
| 5126 border: 1px solid #e3e3e3; | |
| 5127 border-radius: 4px; | |
| 5128 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 5129 } | |
| 5130 | |
| 5131 .break-wrap { | |
| 5132 word-wrap: break-word; | |
| 5133 } | |
| 5134 </style> | |
| 5135 <template if="{{ code.isDartCode }}"> | |
| 5136 <template if="{{ code.isOptimized }}"> | |
| 5137 <a on-click="{{ goto }}" _href="{{ url }}">*{{ name }}</a> | |
| 5138 </template> | 3700 </template> |
| 5139 <template if="{{ !code.isOptimized }}"> | 3701 </div> |
| 5140 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | 3702 </div> |
| 3703 |
| 3704 <hr> |
| 3705 |
| 3706 <div class="content"> |
| 3707 <template if="{{ library.imports.isNotEmpty }}"> |
| 3708 imports ({{ library.imports.length }}) |
| 3709 <curly-block expand="{{ library.imports.length <= 8 }}"> |
| 3710 <div class="memberList"> |
| 3711 <template repeat="{{ imp in library.imports }}"> |
| 3712 <div class="memberItem"> |
| 3713 <div class="memberValue"> |
| 3714 <library-ref ref="{{ imp }}"></library-ref> |
| 3715 </div> |
| 3716 </div> |
| 3717 </template> |
| 3718 </div> |
| 3719 </curly-block><br> |
| 3720 <br> |
| 3721 </template> |
| 3722 |
| 3723 <template if="{{ library.scripts.isNotEmpty }}"> |
| 3724 scripts ({{ library.scripts.length }}) |
| 3725 <curly-block expand="{{ library.scripts.length <= 8 }}"> |
| 3726 <div class="memberList"> |
| 3727 <template repeat="{{ script in library.scripts }}"> |
| 3728 <div class="memberItem"> |
| 3729 <div class="memberValue"> |
| 3730 <script-ref ref="{{ script }}"></script-ref> |
| 3731 </div> |
| 3732 </div> |
| 3733 </template> |
| 3734 </div> |
| 3735 </curly-block><br> |
| 3736 <br> |
| 3737 </template> |
| 3738 |
| 3739 <template if="{{ library.classes.isNotEmpty }}"> |
| 3740 classes ({{ library.classes.length }}) |
| 3741 <curly-block expand="{{ library.classes.length <= 8 }}"> |
| 3742 <div class="memberList"> |
| 3743 <template repeat="{{ cls in library.classes }}"> |
| 3744 <div class="memberItem"> |
| 3745 <div class="memberValue"> |
| 3746 <class-ref ref="{{ cls }}"></class-ref> |
| 3747 </div> |
| 3748 </div> |
| 3749 </template> |
| 3750 </div> |
| 3751 </curly-block><br> |
| 3752 <br> |
| 3753 </template> |
| 3754 |
| 3755 <template if="{{ library.variables.isNotEmpty }}"> |
| 3756 variables ({{ library.variables.length }}) |
| 3757 <curly-block expand="{{ library.variables.length <= 8 }}"> |
| 3758 <div class="memberList"> |
| 3759 <template repeat="{{ field in library.variables }}"> |
| 3760 <div class="memberItem"> |
| 3761 <div class="memberName"> |
| 3762 <field-ref ref="{{ field }}"></field-ref> |
| 3763 </div> |
| 3764 <div class="memberValue"> |
| 3765 <template if="{{ field.value != null }}"> |
| 3766 <any-service-ref ref="{{ field.value }}"></any-service-ref> |
| 3767 </template> |
| 3768 </div> |
| 3769 </div> |
| 3770 </template> |
| 3771 </div> |
| 3772 </curly-block><br> |
| 3773 <br> |
| 3774 </template> |
| 3775 |
| 3776 <template if="{{ library.functions.isNotEmpty }}"> |
| 3777 functions ({{ library.functions.length }}) |
| 3778 <curly-block expand="{{ library.functions.length <= 8 }}"> |
| 3779 <div class="memberList"> |
| 3780 <template repeat="{{ function in library.functions }}"> |
| 3781 <div class="memberItem"> |
| 3782 <div class="memberValue"> |
| 3783 <function-ref ref="{{ function }}"></function-ref> |
| 3784 </div> |
| 3785 </div> |
| 3786 </template> |
| 3787 </div> |
| 3788 </curly-block><br> |
| 3789 <br> |
| 3790 </template> |
| 3791 </div> |
| 3792 |
| 3793 <hr> |
| 3794 |
| 3795 <div class="content"> |
| 3796 <eval-box callback="{{ eval }}"></eval-box> |
| 3797 </div> |
| 3798 <br><br><br><br> |
| 3799 <br><br><br><br> |
| 3800 </template> |
| 3801 </polymer-element> |
| 3802 |
| 3803 |
| 3804 |
| 3805 |
| 3806 |
| 3807 |
| 3808 |
| 3809 <polymer-element name="metrics-page" extends="observatory-element"> |
| 3810 <template> |
| 3811 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3812 <style> |
| 3813 ul li:hover:not(.selected) { |
| 3814 background-color: #FFF3E3; |
| 3815 } |
| 3816 .selected { |
| 3817 background-color: #0489c3; |
| 3818 } |
| 3819 .graph { |
| 3820 min-height: 600px; |
| 3821 } |
| 3822 </style> |
| 3823 <nav-bar> |
| 3824 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 3825 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 3826 <nav-control></nav-control> |
| 3827 </nav-bar> |
| 3828 <div class="flex-row"> |
| 3829 <div class="flex-item-20-percent"> |
| 3830 <ul> |
| 3831 <template repeat="{{ metric in isolate.dartMetrics.values }}"> |
| 3832 <template if="{{ metric == selectedMetric }}"> |
| 3833 <li class="selected"> |
| 3834 {{ metric.name }} |
| 3835 </li> |
| 3836 </template> |
| 3837 <template if="{{ metric != selectedMetric }}"> |
| 3838 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> |
| 3839 {{ metric.name }} |
| 3840 </li> |
| 3841 </template> |
| 3842 </template> |
| 3843 <template repeat="{{ metric in isolate.vmMetrics.values }}"> |
| 3844 <template if="{{ metric == selectedMetric }}"> |
| 3845 <li class="selected"> |
| 3846 {{ metric.name }} |
| 3847 </li> |
| 3848 </template> |
| 3849 <template if="{{ metric != selectedMetric }}"> |
| 3850 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> |
| 3851 {{ metric.name }} |
| 3852 </li> |
| 3853 </template> |
| 3854 </template> |
| 3855 </ul> |
| 3856 </div> |
| 3857 <div class="flex-item-80-percent"> |
| 3858 <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}"> |
| 3859 </metrics-graph> |
| 3860 <div> |
| 3861 <metric-details page="{{ page }}" metric="{{ selectedMetric }}"> |
| 3862 </metric-details> |
| 3863 </div> |
| 3864 </div> |
| 3865 </div> |
| 3866 </template> |
| 3867 </polymer-element> |
| 3868 |
| 3869 <polymer-element name="metric-details" extends="observatory-element"> |
| 3870 <template> |
| 3871 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3872 <div class="content-centered"> |
| 3873 <div class="memberList"> |
| 3874 <div class="memberItem"> |
| 3875 <div class="memberName">name</div> |
| 3876 <div class="memberValue">{{ metric.name }}</div> |
| 3877 </div> |
| 3878 <div class="memberItem"> |
| 3879 <div class="memberName">description</div> |
| 3880 <div class="memberValue">{{ metric.description }}</div> |
| 3881 </div> |
| 3882 <div class="memberItem"> |
| 3883 <div class="memberName">current value</div> |
| 3884 <div class="memberValue">{{ metric.value }}</div> |
| 3885 </div> |
| 3886 <template if="{{ (metric != null) && (metric.min != null) }}"> |
| 3887 <div class="memberItem"> |
| 3888 <div class="memberName">minimum</div> |
| 3889 <div class="memberValue">{{ metric.min }}</div> |
| 3890 </div> |
| 5141 </template> | 3891 </template> |
| 5142 </template> | 3892 <template if="{{ (metric != null) && (metric.max != null) }}"> |
| 5143 <template if="{{ !code.isDartCode }}"> | 3893 <div class="memberItem"> |
| 5144 <span>{{ name }}</span> | 3894 <div class="memberName">maximum</div> |
| 5145 </template> | 3895 <div class="memberValue">{{ metric.max }}</div> |
| 5146 </template> | 3896 </div> |
| 5147 </polymer-element> | 3897 </template> |
| 5148 | 3898 <div class="memberItem"> |
| 5149 | 3899 <div class="memberName">refresh rate</div> |
| 5150 | 3900 <div class="memberValue"> |
| 5151 | 3901 <select id="refreshrate" on-change="{{ refreshRateChange }}"> |
| 3902 <!-- These must be kept in sync with POLL_PERIODS in MetricsPage |
| 3903 in object.dart --> |
| 3904 <option value="8000">Every eight seconds</option> |
| 3905 <option value="4000">Every four seconds</option> |
| 3906 <option value="2000">Every two seconds</option> |
| 3907 <option value="1000">Once a second</option> |
| 3908 <option value="100">Ten times per second</option> |
| 3909 <option value="0" selected="selected">Never</option> |
| 3910 </select> |
| 3911 </div> |
| 3912 </div> |
| 3913 <div class="memberItem"> |
| 3914 <div class="memberName">sample buffer size</div> |
| 3915 <div class="memberValue"> |
| 3916 <select id="buffersize" on-change="{{ sampleBufferSizeChange }}"> |
| 3917 <option value="10">10</option> |
| 3918 <option value="100" selected="selected">100</option> |
| 3919 <option value="1000">1000</option> |
| 3920 </select> |
| 3921 </div> |
| 3922 </div> |
| 3923 </div> |
| 3924 </div> |
| 3925 </template> |
| 3926 </polymer-element> |
| 3927 |
| 3928 <polymer-element name="metrics-graph" extends="observatory-element"> |
| 3929 <template> |
| 3930 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3931 <style> |
| 3932 .graph { |
| 3933 min-height: 600px; |
| 3934 } |
| 3935 </style> |
| 3936 <div id="graph" class="graph"> |
| 3937 </div> |
| 3938 </template> |
| 3939 </polymer-element> |
| 3940 |
| 3941 |
| 3942 |
| 5152 | 3943 |
| 5153 | 3944 |
| 5154 | 3945 |
| 5155 | 3946 |
| 5156 | 3947 |
| 5157 <polymer-element name="code-view" extends="observatory-element"> | |
| 5158 <template> | |
| 5159 <style>/* Global styles */ | |
| 5160 * { | |
| 5161 margin: 0; | |
| 5162 padding: 0; | |
| 5163 font: 400 14px 'Montserrat', sans-serif; | |
| 5164 color: #333; | |
| 5165 box-sizing: border-box; | |
| 5166 } | |
| 5167 | |
| 5168 .content { | |
| 5169 padding-left: 10%; | |
| 5170 font: 400 14px 'Montserrat', sans-serif; | |
| 5171 } | |
| 5172 | |
| 5173 .content-centered { | |
| 5174 padding-left: 10%; | |
| 5175 padding-right: 10%; | |
| 5176 font: 400 14px 'Montserrat', sans-serif; | |
| 5177 } | |
| 5178 | |
| 5179 .content-centered-big { | |
| 5180 padding-left: 5%; | |
| 5181 padding-right: 5%; | |
| 5182 font: 400 14px 'Montserrat', sans-serif; | |
| 5183 } | |
| 5184 | |
| 5185 h1 { | |
| 5186 font: 400 18px 'Montserrat', sans-serif; | |
| 5187 } | |
| 5188 | |
| 5189 .memberList { | |
| 5190 display: table; | |
| 5191 } | |
| 5192 | |
| 5193 .memberItem { | |
| 5194 display: table-row; | |
| 5195 } | |
| 5196 | |
| 5197 .memberName, .memberValue { | |
| 5198 display: table-cell; | |
| 5199 vertical-align: top; | |
| 5200 padding: 3px 0 3px 1em; | |
| 5201 font: 400 14px 'Montserrat', sans-serif; | |
| 5202 } | |
| 5203 | |
| 5204 .memberSmall { | |
| 5205 display: table-cell; | |
| 5206 vertical-align: top; | |
| 5207 padding: 3px 0 3px 1em; | |
| 5208 font: 400 12px 'Montserrat', sans-serif; | |
| 5209 } | |
| 5210 | |
| 5211 .monospace { | |
| 5212 font-family: consolas, courier, monospace; | |
| 5213 font-size: 1em; | |
| 5214 line-height: 1.2em; | |
| 5215 white-space: nowrap; | |
| 5216 } | |
| 5217 | |
| 5218 a { | |
| 5219 color: #0489c3; | |
| 5220 text-decoration: none; | |
| 5221 } | |
| 5222 | |
| 5223 a:hover { | |
| 5224 text-decoration: underline; | |
| 5225 } | |
| 5226 | |
| 5227 em { | |
| 5228 color: inherit; | |
| 5229 font-style: italic; | |
| 5230 } | |
| 5231 | |
| 5232 b { | |
| 5233 color: inherit; | |
| 5234 font-weight: bold; | |
| 5235 } | |
| 5236 | |
| 5237 hr { | |
| 5238 margin-top: 20px; | |
| 5239 margin-bottom: 20px; | |
| 5240 border: 0; | |
| 5241 border-top: 1px solid #eee; | |
| 5242 height: 0; | |
| 5243 box-sizing: content-box; | |
| 5244 } | |
| 5245 | |
| 5246 .list-group { | |
| 5247 padding-left: 0; | |
| 5248 margin-bottom: 20px; | |
| 5249 } | |
| 5250 | |
| 5251 .list-group-item { | |
| 5252 position: relative; | |
| 5253 display: block; | |
| 5254 padding: 10px 15px; | |
| 5255 margin-bottom: -1px; | |
| 5256 background-color: #fff; | |
| 5257 } | |
| 5258 | |
| 5259 .list-group-item:first-child { | |
| 5260 /* rounded top corners */ | |
| 5261 border-top-right-radius:4px; | |
| 5262 border-top-left-radius:4px; | |
| 5263 } | |
| 5264 | |
| 5265 .list-group-item:last-child { | |
| 5266 margin-bottom: 0; | |
| 5267 /* rounded bottom corners */ | |
| 5268 border-bottom-right-radius: 4px; | |
| 5269 border-bottom-left-radius:4px; | |
| 5270 } | |
| 5271 | |
| 5272 /* Flex row container */ | |
| 5273 .flex-row { | |
| 5274 display: flex; | |
| 5275 flex-direction: row; | |
| 5276 } | |
| 5277 | |
| 5278 /* Flex column container */ | |
| 5279 .flex-column { | |
| 5280 display: flex; | |
| 5281 flex-direction: column; | |
| 5282 } | |
| 5283 | |
| 5284 .flex-item-fit { | |
| 5285 flex-grow: 1; | |
| 5286 flex-shrink: 1; | |
| 5287 flex-basis: auto; | |
| 5288 } | |
| 5289 | |
| 5290 .flex-item-no-shrink { | |
| 5291 flex-grow: 0; | |
| 5292 flex-shrink: 0; | |
| 5293 flex-basis: auto; | |
| 5294 } | |
| 5295 | |
| 5296 .flex-item-fill { | |
| 5297 flex-grow: 0; | |
| 5298 flex-shrink: 1; /* shrink when pressured */ | |
| 5299 flex-basis: 100%; /* try and take 100% */ | |
| 5300 } | |
| 5301 | |
| 5302 .flex-item-fixed-1-12 { | |
| 5303 flex-grow: 0; | |
| 5304 flex-shrink: 0; | |
| 5305 flex-basis: 8.3%; | |
| 5306 } | |
| 5307 | |
| 5308 .flex-item-fixed-2-12 { | |
| 5309 flex-grow: 0; | |
| 5310 flex-shrink: 0; | |
| 5311 flex-basis: 16.6%; | |
| 5312 } | |
| 5313 | |
| 5314 .flex-item-fixed-4-12 { | |
| 5315 flex-grow: 0; | |
| 5316 flex-shrink: 0; | |
| 5317 flex-basis: 33.3333%; | |
| 5318 } | |
| 5319 | |
| 5320 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 5321 flex-grow: 0; | |
| 5322 flex-shrink: 0; | |
| 5323 flex-basis: 50%; | |
| 5324 } | |
| 5325 | |
| 5326 .flex-item-fixed-8-12 { | |
| 5327 flex-grow: 0; | |
| 5328 flex-shrink: 0; | |
| 5329 flex-basis: 66.6666%; | |
| 5330 } | |
| 5331 | |
| 5332 .flex-item-fixed-9-12 { | |
| 5333 flex-grow: 0; | |
| 5334 flex-shrink: 0; | |
| 5335 flex-basis: 75%; | |
| 5336 } | |
| 5337 | 3948 |
| 5338 | 3949 |
| 5339 .flex-item-fixed-12-12 { | |
| 5340 flex-grow: 0; | |
| 5341 flex-shrink: 0; | |
| 5342 flex-basis: 100%; | |
| 5343 } | |
| 5344 | 3950 |
| 5345 .flex-item-10-percent { | |
| 5346 flex-grow: 0; | |
| 5347 flex-shrink: 0; | |
| 5348 flex-basis: 10%; | |
| 5349 } | |
| 5350 | 3951 |
| 5351 .flex-item-15-percent { | |
| 5352 flex-grow: 0; | |
| 5353 flex-shrink: 0; | |
| 5354 flex-basis: 15%; | |
| 5355 } | |
| 5356 | 3952 |
| 5357 .flex-item-20-percent { | |
| 5358 flex-grow: 0; | |
| 5359 flex-shrink: 0; | |
| 5360 flex-basis: 20%; | |
| 5361 } | |
| 5362 | 3953 |
| 5363 .flex-item-30-percent { | |
| 5364 flex-grow: 0; | |
| 5365 flex-shrink: 0; | |
| 5366 flex-basis: 30%; | |
| 5367 } | |
| 5368 | 3954 |
| 5369 .flex-item-40-percent { | |
| 5370 flex-grow: 0; | |
| 5371 flex-shrink: 0; | |
| 5372 flex-basis: 40%; | |
| 5373 } | |
| 5374 | 3955 |
| 5375 .flex-item-50-percent { | |
| 5376 flex-grow: 0; | |
| 5377 flex-shrink: 0; | |
| 5378 flex-basis: 50%; | |
| 5379 } | |
| 5380 | 3956 |
| 5381 .flex-item-60-percent { | 3957 <polymer-element name="object-view" extends="observatory-element"> |
| 5382 flex-grow: 0; | 3958 <template> |
| 5383 flex-shrink: 0; | 3959 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 5384 flex-basis: 60%; | |
| 5385 } | |
| 5386 | |
| 5387 .flex-item-70-percent { | |
| 5388 flex-grow: 0; | |
| 5389 flex-shrink: 0; | |
| 5390 flex-basis: 70%; | |
| 5391 } | |
| 5392 | |
| 5393 .flex-item-80-percent { | |
| 5394 flex-grow: 0; | |
| 5395 flex-shrink: 0; | |
| 5396 flex-basis: 80%; | |
| 5397 } | |
| 5398 | |
| 5399 .well { | |
| 5400 min-height: 20px; | |
| 5401 padding: 19px; | |
| 5402 margin-bottom: 20px; | |
| 5403 background-color: #f5f5f5; | |
| 5404 border: 1px solid #e3e3e3; | |
| 5405 border-radius: 4px; | |
| 5406 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 5407 } | |
| 5408 | |
| 5409 .break-wrap { | |
| 5410 word-wrap: break-word; | |
| 5411 } | |
| 5412 </style> | |
| 5413 <style> | |
| 5414 div.flex-row:hover { | |
| 5415 background-color: #FFF3E3; | |
| 5416 } | |
| 5417 | |
| 5418 .highlight { | |
| 5419 background-color: #FFF3E3; | |
| 5420 } | |
| 5421 | |
| 5422 .tooltip { | |
| 5423 display: block; | |
| 5424 position: absolute; | |
| 5425 visibility: hidden; | |
| 5426 opacity: 0; | |
| 5427 transition: visibility 0s linear 0.5s; | |
| 5428 transition: opacity .4s ease-in-out; | |
| 5429 } | |
| 5430 | |
| 5431 .flex-row:hover .tooltip { | |
| 5432 display: block; | |
| 5433 position: absolute; | |
| 5434 top: 100%; | |
| 5435 visibility: visible; | |
| 5436 z-index: 999; | |
| 5437 width: auto; | |
| 5438 min-width: 400px; | |
| 5439 color: #ffffff; | |
| 5440 background-color: #FFF3E3; | |
| 5441 border-bottom-right-radius: 8px; | |
| 5442 border-bottom-left-radius: 8px; | |
| 5443 transition: visibility 0s linear 0.5s; | |
| 5444 transition: opacity .4s ease-in-out; | |
| 5445 opacity: 1; | |
| 5446 } | |
| 5447 | |
| 5448 .descriptor-address { | |
| 5449 color: #0489c3; | |
| 5450 } | |
| 5451 | |
| 5452 .snippet { | |
| 5453 text-align: center; | |
| 5454 margin-left: 10px; | |
| 5455 margin-right: 10px; | |
| 5456 } | |
| 5457 | |
| 5458 </style> | |
| 5459 <nav-bar> | 3960 <nav-bar> |
| 5460 <top-nav-menu></top-nav-menu> | 3961 <top-nav-menu></top-nav-menu> |
| 5461 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu> | 3962 <isolate-nav-menu isolate="{{ object.isolate }}"></isolate-nav-menu> |
| 5462 <nav-menu link="{{ code.link }}" anchor="{{ code.name }}" last="{{ true }}
"></nav-menu> | 3963 <nav-menu link="." anchor="object" last="{{ true }}"></nav-menu> |
| 5463 <nav-refresh callback="{{ refresh }}"></nav-refresh> | 3964 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 5464 <nav-control></nav-control> | 3965 <nav-control></nav-control> |
| 5465 </nav-bar> | 3966 </nav-bar> |
| 3967 |
| 5466 <div class="content"> | 3968 <div class="content"> |
| 5467 <template if="{{ code.isDartCode && code.isOptimized }}"> | 3969 <object-common object="{{ object }}"></object-common> |
| 5468 <h1>Optimized code for {{ code.name }}</h1> | 3970 </div> |
| 5469 </template> | 3971 |
| 5470 <template if="{{ !(code.isDartCode && code.isOptimized) }}"> | 3972 <hr> |
| 5471 <h1>Code for {{ code.name }}</h1> | 3973 </template> |
| 5472 </template> | 3974 </polymer-element> |
| 5473 <div class="memberList"> | 3975 |
| 5474 <div class="memberItem"> | 3976 |
| 5475 <div class="memberName">Kind</div> | 3977 |
| 5476 <div class="memberValue">{{code.kind}}</div> | 3978 |
| 5477 </div> | 3979 |
| 5478 <template if="{{ code.isDartCode }}"> | 3980 |
| 3981 |
| 3982 |
| 3983 |
| 3984 |
| 3985 |
| 3986 |
| 3987 |
| 3988 |
| 3989 |
| 3990 |
| 3991 |
| 3992 |
| 3993 |
| 3994 <polymer-element name="context-view" extends="observatory-element"> |
| 3995 <template> |
| 3996 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 3997 <nav-bar> |
| 3998 <top-nav-menu></top-nav-menu> |
| 3999 <isolate-nav-menu isolate="{{ context.isolate }}"></isolate-nav-menu> |
| 4000 <!-- TODO(turnidge): Add library nav menu here. --> |
| 4001 <class-nav-menu cls="{{ context.clazz }}"></class-nav-menu> |
| 4002 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> |
| 4003 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4004 <nav-control></nav-control> |
| 4005 </nav-bar> |
| 4006 |
| 4007 <template if="{{ !context.isError }}"> |
| 4008 <div class="content"> |
| 4009 <h1>instance of Context</h1> |
| 4010 |
| 4011 <object-common object="{{ context }}"></object-common> |
| 4012 |
| 4013 <div class="memberList"> |
| 4014 <div class="memberItem"> </div> |
| 4015 |
| 5479 <div class="memberItem"> | 4016 <div class="memberItem"> |
| 5480 <div class="memberName">Optimized</div> | 4017 <div class="memberName">parent context</div> |
| 5481 <div class="memberValue">{{code.isOptimized}}</div> | 4018 <div class="memberValue"> |
| 5482 </div> | 4019 <any-service-ref ref="{{ context.parentContext }}"></any-service-r
ef> |
| 5483 </template> | 4020 </div> |
| 5484 <div class="memberItem"> | |
| 5485 <div class="memberName">Function</div> | |
| 5486 <div class="memberValue"> | |
| 5487 <function-ref ref="{{code.function}}"> | |
| 5488 </function-ref> | |
| 5489 </div> | |
| 5490 </div> | |
| 5491 <div class="memberItem"> | |
| 5492 <div class="memberName">Inclusive</div> | |
| 5493 <div class="memberValue">{{ code.formattedInclusiveTicks }}</div> | |
| 5494 </div> | |
| 5495 <div class="memberItem"> | |
| 5496 <div class="memberName">Exclusive</div> | |
| 5497 <div class="memberValue">{{ code.formattedExclusiveTicks }}</div> | |
| 5498 </div> | |
| 5499 <div class="memberItem"> | |
| 5500 <div class="memberName">Constant object pool</div> | |
| 5501 <div class="memberValue"> | |
| 5502 <any-service-ref ref="{{ code.objectPool }}"></any-service-ref> | |
| 5503 </div> | 4021 </div> |
| 5504 </div> | 4022 </div> |
| 5505 </div> | 4023 </div> |
| 5506 </div> | 4024 |
| 5507 <hr> | 4025 <hr> |
| 5508 <div class="content"> | 4026 |
| 5509 <template if="{{ code.hasDisassembly }}"> | 4027 <div class="content"> |
| 5510 <div class="flex-row"> | 4028 <template if="{{ context.variables.isNotEmpty }}"> |
| 5511 <div class="flex-item-fixed-2-12 memberHeader">Inclusive</div> | 4029 variables ({{ context.variables.length }}) |
| 5512 <div class="flex-item-fixed-2-12 memberHeader">Exclusive</div> | 4030 <curly-block expand="{{ context.variables.length <= 8 }}"> |
| 5513 <div class="flex-item-fixed-2-12 memberHeader">Address</div> | 4031 <div class="memberList"> |
| 5514 <div class="flex-item-fixed-6-12 memberHeader">Disassembly</div> | 4032 <template repeat="{{ variable in context.variables }}"> |
| 5515 </div> | 4033 <div class="memberItem"> |
| 5516 </template> | 4034 <div class="memberName">[{{ variable['index']}}]</div> |
| 5517 <template repeat="{{ instruction in code.instructions }}"> | 4035 <div class="memberValue"> |
| 5518 <div class="flex-row" on-mouseover="{{ mouseOver }}" on-mouseout="{{ mou
seOut }}" data-jump-target="{{ instruction.jumpTarget.address }}" id="addr-{{ in
struction.address }}" style="position: relative"> | 4036 <any-service-ref ref="{{ variable['value'] }}"></any-service
-ref> |
| 5519 <template if="{{ instruction.isComment }}"> | 4037 </div> |
| 5520 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> | |
| 5521 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> | |
| 5522 <div class="flex-item-fixed-8-12 monospace">{{ instruction.human }}<
/div> | |
| 5523 </template> | |
| 5524 <template if="{{ !instruction.isComment }}"> | |
| 5525 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> | |
| 5526 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> | |
| 5527 <template if="{{ instruction.hasDescriptors }}"> | |
| 5528 <div class="flex-item-fixed-2-12 monospace descriptor-address"> | |
| 5529 <div class="tooltip"> | |
| 5530 <template repeat="{{ descriptor in instruction.descriptors }}"
> | |
| 5531 <div class="memberList"> | |
| 5532 <div class="memberItem"> | |
| 5533 <div class="memberName">Kind</div> | |
| 5534 <div class="memberValue">{{ descriptor.kind }}</div> | |
| 5535 </div> | |
| 5536 <div class="memberItem"> | |
| 5537 <div class="memberName">Deoptimization ID</div> | |
| 5538 <div class="memberValue">{{ descriptor.formattedDeoptId()
}}</div> | |
| 5539 </div> | |
| 5540 <template if="{{ descriptor.script != null }}"> | |
| 5541 <div class="memberItem"> | |
| 5542 <div class="memberName">Script</div> | |
| 5543 <div class="memberValue"><script-ref ref="{{ descriptor
.script }}" pos="{{ descriptor.tokenPos }}"></script-ref></div> | |
| 5544 </div> | |
| 5545 </template> | |
| 5546 </div> | |
| 5547 <template if="{{ descriptor.script != null }}"> | |
| 5548 <div class="snippet monospace"> | |
| 5549 <span>{{ descriptor.formattedLine }}</span> | |
| 5550 </div> | |
| 5551 </template> | |
| 5552 </template> | |
| 5553 </div> | 4038 </div> |
| 5554 {{ instruction.formattedAddress() }} | 4039 </template> |
| 5555 </div> | |
| 5556 </template> | |
| 5557 <template if="{{ !instruction.hasDescriptors }}"> | |
| 5558 <div class="flex-item-fixed-2-12 monospace"> | |
| 5559 {{ instruction.formattedAddress() }} | |
| 5560 </div> | |
| 5561 </template> | |
| 5562 <div class="flex-item-fixed-6-12 monospace"> | |
| 5563 {{ instruction.human }} | |
| 5564 </div> | 4040 </div> |
| 5565 </template> | 4041 </curly-block><br><br> |
| 5566 </div> | 4042 </template> |
| 5567 </template> | 4043 </div> |
| 5568 </div> | 4044 |
| 4045 <br><br><br><br> |
| 4046 <br><br><br><br> |
| 4047 |
| 4048 </template> |
| 5569 </template> | 4049 </template> |
| 5570 </polymer-element> | 4050 </polymer-element> |
| 5571 | 4051 |
| 5572 | 4052 |
| 5573 | 4053 |
| 5574 | 4054 |
| 5575 | 4055 |
| 5576 | 4056 |
| 5577 | 4057 |
| 5578 | 4058 |
| 5579 | 4059 |
| 5580 | 4060 |
| 5581 | 4061 |
| 5582 <!-- TODO(turnidge): Use core-icon once core_elements work properly in | |
| 5583 devtools --> | |
| 5584 <polymer-element name="icon-expand-less" noscript=""> | |
| 5585 <template> | |
| 5586 <svg width="24" height="24"> | |
| 5587 <polygon points="12,8 6,14 7.4,15.4 12,10.8 16.6,15.4 18,14 "></polygon> | |
| 5588 </svg> | |
| 5589 </template> | |
| 5590 </polymer-element> | |
| 5591 | |
| 5592 <polymer-element name="icon-expand-more" noscript=""> | |
| 5593 <template> | |
| 5594 <svg width="24" height="24"> | |
| 5595 <polygon points="16.6,8.6 12,13.2 7.4,8.6 6,10 12,16 18,10 "></polygon> | |
| 5596 </svg> | |
| 5597 </template> | |
| 5598 </polymer-element> | |
| 5599 | |
| 5600 <polymer-element name="debugger-page" extends="observatory-element"> | |
| 5601 <template> | |
| 5602 <style>/* Global styles */ | |
| 5603 * { | |
| 5604 margin: 0; | |
| 5605 padding: 0; | |
| 5606 font: 400 14px 'Montserrat', sans-serif; | |
| 5607 color: #333; | |
| 5608 box-sizing: border-box; | |
| 5609 } | |
| 5610 | |
| 5611 .content { | |
| 5612 padding-left: 10%; | |
| 5613 font: 400 14px 'Montserrat', sans-serif; | |
| 5614 } | |
| 5615 | |
| 5616 .content-centered { | |
| 5617 padding-left: 10%; | |
| 5618 padding-right: 10%; | |
| 5619 font: 400 14px 'Montserrat', sans-serif; | |
| 5620 } | |
| 5621 | |
| 5622 .content-centered-big { | |
| 5623 padding-left: 5%; | |
| 5624 padding-right: 5%; | |
| 5625 font: 400 14px 'Montserrat', sans-serif; | |
| 5626 } | |
| 5627 | |
| 5628 h1 { | |
| 5629 font: 400 18px 'Montserrat', sans-serif; | |
| 5630 } | |
| 5631 | |
| 5632 .memberList { | |
| 5633 display: table; | |
| 5634 } | |
| 5635 | |
| 5636 .memberItem { | |
| 5637 display: table-row; | |
| 5638 } | |
| 5639 | |
| 5640 .memberName, .memberValue { | |
| 5641 display: table-cell; | |
| 5642 vertical-align: top; | |
| 5643 padding: 3px 0 3px 1em; | |
| 5644 font: 400 14px 'Montserrat', sans-serif; | |
| 5645 } | |
| 5646 | |
| 5647 .memberSmall { | |
| 5648 display: table-cell; | |
| 5649 vertical-align: top; | |
| 5650 padding: 3px 0 3px 1em; | |
| 5651 font: 400 12px 'Montserrat', sans-serif; | |
| 5652 } | |
| 5653 | |
| 5654 .monospace { | |
| 5655 font-family: consolas, courier, monospace; | |
| 5656 font-size: 1em; | |
| 5657 line-height: 1.2em; | |
| 5658 white-space: nowrap; | |
| 5659 } | |
| 5660 | |
| 5661 a { | |
| 5662 color: #0489c3; | |
| 5663 text-decoration: none; | |
| 5664 } | |
| 5665 | |
| 5666 a:hover { | |
| 5667 text-decoration: underline; | |
| 5668 } | |
| 5669 | |
| 5670 em { | |
| 5671 color: inherit; | |
| 5672 font-style: italic; | |
| 5673 } | |
| 5674 | |
| 5675 b { | |
| 5676 color: inherit; | |
| 5677 font-weight: bold; | |
| 5678 } | |
| 5679 | |
| 5680 hr { | |
| 5681 margin-top: 20px; | |
| 5682 margin-bottom: 20px; | |
| 5683 border: 0; | |
| 5684 border-top: 1px solid #eee; | |
| 5685 height: 0; | |
| 5686 box-sizing: content-box; | |
| 5687 } | |
| 5688 | |
| 5689 .list-group { | |
| 5690 padding-left: 0; | |
| 5691 margin-bottom: 20px; | |
| 5692 } | |
| 5693 | |
| 5694 .list-group-item { | |
| 5695 position: relative; | |
| 5696 display: block; | |
| 5697 padding: 10px 15px; | |
| 5698 margin-bottom: -1px; | |
| 5699 background-color: #fff; | |
| 5700 } | |
| 5701 | |
| 5702 .list-group-item:first-child { | |
| 5703 /* rounded top corners */ | |
| 5704 border-top-right-radius:4px; | |
| 5705 border-top-left-radius:4px; | |
| 5706 } | |
| 5707 | |
| 5708 .list-group-item:last-child { | |
| 5709 margin-bottom: 0; | |
| 5710 /* rounded bottom corners */ | |
| 5711 border-bottom-right-radius: 4px; | |
| 5712 border-bottom-left-radius:4px; | |
| 5713 } | |
| 5714 | |
| 5715 /* Flex row container */ | |
| 5716 .flex-row { | |
| 5717 display: flex; | |
| 5718 flex-direction: row; | |
| 5719 } | |
| 5720 | |
| 5721 /* Flex column container */ | |
| 5722 .flex-column { | |
| 5723 display: flex; | |
| 5724 flex-direction: column; | |
| 5725 } | |
| 5726 | |
| 5727 .flex-item-fit { | |
| 5728 flex-grow: 1; | |
| 5729 flex-shrink: 1; | |
| 5730 flex-basis: auto; | |
| 5731 } | |
| 5732 | |
| 5733 .flex-item-no-shrink { | |
| 5734 flex-grow: 0; | |
| 5735 flex-shrink: 0; | |
| 5736 flex-basis: auto; | |
| 5737 } | |
| 5738 | |
| 5739 .flex-item-fill { | |
| 5740 flex-grow: 0; | |
| 5741 flex-shrink: 1; /* shrink when pressured */ | |
| 5742 flex-basis: 100%; /* try and take 100% */ | |
| 5743 } | |
| 5744 | |
| 5745 .flex-item-fixed-1-12 { | |
| 5746 flex-grow: 0; | |
| 5747 flex-shrink: 0; | |
| 5748 flex-basis: 8.3%; | |
| 5749 } | |
| 5750 | |
| 5751 .flex-item-fixed-2-12 { | |
| 5752 flex-grow: 0; | |
| 5753 flex-shrink: 0; | |
| 5754 flex-basis: 16.6%; | |
| 5755 } | |
| 5756 | |
| 5757 .flex-item-fixed-4-12 { | |
| 5758 flex-grow: 0; | |
| 5759 flex-shrink: 0; | |
| 5760 flex-basis: 33.3333%; | |
| 5761 } | |
| 5762 | |
| 5763 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 5764 flex-grow: 0; | |
| 5765 flex-shrink: 0; | |
| 5766 flex-basis: 50%; | |
| 5767 } | |
| 5768 | |
| 5769 .flex-item-fixed-8-12 { | |
| 5770 flex-grow: 0; | |
| 5771 flex-shrink: 0; | |
| 5772 flex-basis: 66.6666%; | |
| 5773 } | |
| 5774 | |
| 5775 .flex-item-fixed-9-12 { | |
| 5776 flex-grow: 0; | |
| 5777 flex-shrink: 0; | |
| 5778 flex-basis: 75%; | |
| 5779 } | |
| 5780 | |
| 5781 | |
| 5782 .flex-item-fixed-12-12 { | |
| 5783 flex-grow: 0; | |
| 5784 flex-shrink: 0; | |
| 5785 flex-basis: 100%; | |
| 5786 } | |
| 5787 | |
| 5788 .flex-item-10-percent { | |
| 5789 flex-grow: 0; | |
| 5790 flex-shrink: 0; | |
| 5791 flex-basis: 10%; | |
| 5792 } | |
| 5793 | |
| 5794 .flex-item-15-percent { | |
| 5795 flex-grow: 0; | |
| 5796 flex-shrink: 0; | |
| 5797 flex-basis: 15%; | |
| 5798 } | |
| 5799 | |
| 5800 .flex-item-20-percent { | |
| 5801 flex-grow: 0; | |
| 5802 flex-shrink: 0; | |
| 5803 flex-basis: 20%; | |
| 5804 } | |
| 5805 | |
| 5806 .flex-item-30-percent { | |
| 5807 flex-grow: 0; | |
| 5808 flex-shrink: 0; | |
| 5809 flex-basis: 30%; | |
| 5810 } | |
| 5811 | |
| 5812 .flex-item-40-percent { | |
| 5813 flex-grow: 0; | |
| 5814 flex-shrink: 0; | |
| 5815 flex-basis: 40%; | |
| 5816 } | |
| 5817 | |
| 5818 .flex-item-50-percent { | |
| 5819 flex-grow: 0; | |
| 5820 flex-shrink: 0; | |
| 5821 flex-basis: 50%; | |
| 5822 } | |
| 5823 | |
| 5824 .flex-item-60-percent { | |
| 5825 flex-grow: 0; | |
| 5826 flex-shrink: 0; | |
| 5827 flex-basis: 60%; | |
| 5828 } | |
| 5829 | |
| 5830 .flex-item-70-percent { | |
| 5831 flex-grow: 0; | |
| 5832 flex-shrink: 0; | |
| 5833 flex-basis: 70%; | |
| 5834 } | |
| 5835 | |
| 5836 .flex-item-80-percent { | |
| 5837 flex-grow: 0; | |
| 5838 flex-shrink: 0; | |
| 5839 flex-basis: 80%; | |
| 5840 } | |
| 5841 | |
| 5842 .well { | |
| 5843 min-height: 20px; | |
| 5844 padding: 19px; | |
| 5845 margin-bottom: 20px; | |
| 5846 background-color: #f5f5f5; | |
| 5847 border: 1px solid #e3e3e3; | |
| 5848 border-radius: 4px; | |
| 5849 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 5850 } | |
| 5851 | |
| 5852 .break-wrap { | |
| 5853 word-wrap: break-word; | |
| 5854 } | |
| 5855 </style> | |
| 5856 <style> | |
| 5857 .container { | |
| 5858 height: 100%; | |
| 5859 display: flex; | |
| 5860 flex-direction: column; | |
| 5861 justify-content: space-between; | |
| 5862 } | |
| 5863 nav-bar { | |
| 5864 flex: 0 0 auto; | |
| 5865 } | |
| 5866 .stack { | |
| 5867 flex: 0 0 auto; | |
| 5868 overflow-y: auto; | |
| 5869 } | |
| 5870 core-splitter { | |
| 5871 flex: 0 0 auto; | |
| 5872 } | |
| 5873 .console { | |
| 5874 flex: 1 1 auto; | |
| 5875 overflow-y: auto; | |
| 5876 } | |
| 5877 .commandline { | |
| 5878 flex: 0 0 auto; | |
| 5879 } | |
| 5880 </style> | |
| 5881 | |
| 5882 <div class="container"> | |
| 5883 <nav-bar> | |
| 5884 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 5885 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}"> | |
| 5886 </isolate-nav-menu> | |
| 5887 <nav-control></nav-control> | |
| 5888 </nav-bar> | |
| 5889 | |
| 5890 <div id="stack" class="stack"> | |
| 5891 <debugger-stack isolate="{{ isolate }}"></debugger-stack> | |
| 5892 </div> | |
| 5893 <!-- | |
| 5894 <core-splitter direction="up" allowOverflow=true></core-splitter> | |
| 5895 <div class="console"> | |
| 5896 <debugger-console isolate="{{ isolate }}"></debugger-console> | |
| 5897 </div> | |
| 5898 <div class="commandline"> | |
| 5899 <debugger-input isolate="{{ isolate }}"></debugger-input> | |
| 5900 </div> | |
| 5901 --> | |
| 5902 </div> | |
| 5903 </template> | |
| 5904 </polymer-element> | |
| 5905 | |
| 5906 <polymer-element name="debugger-stack" extends="observatory-element"> | |
| 5907 <template> | |
| 5908 <style>/* Global styles */ | |
| 5909 * { | |
| 5910 margin: 0; | |
| 5911 padding: 0; | |
| 5912 font: 400 14px 'Montserrat', sans-serif; | |
| 5913 color: #333; | |
| 5914 box-sizing: border-box; | |
| 5915 } | |
| 5916 | |
| 5917 .content { | |
| 5918 padding-left: 10%; | |
| 5919 font: 400 14px 'Montserrat', sans-serif; | |
| 5920 } | |
| 5921 | |
| 5922 .content-centered { | |
| 5923 padding-left: 10%; | |
| 5924 padding-right: 10%; | |
| 5925 font: 400 14px 'Montserrat', sans-serif; | |
| 5926 } | |
| 5927 | |
| 5928 .content-centered-big { | |
| 5929 padding-left: 5%; | |
| 5930 padding-right: 5%; | |
| 5931 font: 400 14px 'Montserrat', sans-serif; | |
| 5932 } | |
| 5933 | |
| 5934 h1 { | |
| 5935 font: 400 18px 'Montserrat', sans-serif; | |
| 5936 } | |
| 5937 | |
| 5938 .memberList { | |
| 5939 display: table; | |
| 5940 } | |
| 5941 | |
| 5942 .memberItem { | |
| 5943 display: table-row; | |
| 5944 } | |
| 5945 | |
| 5946 .memberName, .memberValue { | |
| 5947 display: table-cell; | |
| 5948 vertical-align: top; | |
| 5949 padding: 3px 0 3px 1em; | |
| 5950 font: 400 14px 'Montserrat', sans-serif; | |
| 5951 } | |
| 5952 | |
| 5953 .memberSmall { | |
| 5954 display: table-cell; | |
| 5955 vertical-align: top; | |
| 5956 padding: 3px 0 3px 1em; | |
| 5957 font: 400 12px 'Montserrat', sans-serif; | |
| 5958 } | |
| 5959 | |
| 5960 .monospace { | |
| 5961 font-family: consolas, courier, monospace; | |
| 5962 font-size: 1em; | |
| 5963 line-height: 1.2em; | |
| 5964 white-space: nowrap; | |
| 5965 } | |
| 5966 | |
| 5967 a { | |
| 5968 color: #0489c3; | |
| 5969 text-decoration: none; | |
| 5970 } | |
| 5971 | |
| 5972 a:hover { | |
| 5973 text-decoration: underline; | |
| 5974 } | |
| 5975 | |
| 5976 em { | |
| 5977 color: inherit; | |
| 5978 font-style: italic; | |
| 5979 } | |
| 5980 | |
| 5981 b { | |
| 5982 color: inherit; | |
| 5983 font-weight: bold; | |
| 5984 } | |
| 5985 | |
| 5986 hr { | |
| 5987 margin-top: 20px; | |
| 5988 margin-bottom: 20px; | |
| 5989 border: 0; | |
| 5990 border-top: 1px solid #eee; | |
| 5991 height: 0; | |
| 5992 box-sizing: content-box; | |
| 5993 } | |
| 5994 | |
| 5995 .list-group { | |
| 5996 padding-left: 0; | |
| 5997 margin-bottom: 20px; | |
| 5998 } | |
| 5999 | |
| 6000 .list-group-item { | |
| 6001 position: relative; | |
| 6002 display: block; | |
| 6003 padding: 10px 15px; | |
| 6004 margin-bottom: -1px; | |
| 6005 background-color: #fff; | |
| 6006 } | |
| 6007 | |
| 6008 .list-group-item:first-child { | |
| 6009 /* rounded top corners */ | |
| 6010 border-top-right-radius:4px; | |
| 6011 border-top-left-radius:4px; | |
| 6012 } | |
| 6013 | |
| 6014 .list-group-item:last-child { | |
| 6015 margin-bottom: 0; | |
| 6016 /* rounded bottom corners */ | |
| 6017 border-bottom-right-radius: 4px; | |
| 6018 border-bottom-left-radius:4px; | |
| 6019 } | |
| 6020 | |
| 6021 /* Flex row container */ | |
| 6022 .flex-row { | |
| 6023 display: flex; | |
| 6024 flex-direction: row; | |
| 6025 } | |
| 6026 | |
| 6027 /* Flex column container */ | |
| 6028 .flex-column { | |
| 6029 display: flex; | |
| 6030 flex-direction: column; | |
| 6031 } | |
| 6032 | |
| 6033 .flex-item-fit { | |
| 6034 flex-grow: 1; | |
| 6035 flex-shrink: 1; | |
| 6036 flex-basis: auto; | |
| 6037 } | |
| 6038 | |
| 6039 .flex-item-no-shrink { | |
| 6040 flex-grow: 0; | |
| 6041 flex-shrink: 0; | |
| 6042 flex-basis: auto; | |
| 6043 } | |
| 6044 | |
| 6045 .flex-item-fill { | |
| 6046 flex-grow: 0; | |
| 6047 flex-shrink: 1; /* shrink when pressured */ | |
| 6048 flex-basis: 100%; /* try and take 100% */ | |
| 6049 } | |
| 6050 | |
| 6051 .flex-item-fixed-1-12 { | |
| 6052 flex-grow: 0; | |
| 6053 flex-shrink: 0; | |
| 6054 flex-basis: 8.3%; | |
| 6055 } | |
| 6056 | |
| 6057 .flex-item-fixed-2-12 { | |
| 6058 flex-grow: 0; | |
| 6059 flex-shrink: 0; | |
| 6060 flex-basis: 16.6%; | |
| 6061 } | |
| 6062 | |
| 6063 .flex-item-fixed-4-12 { | |
| 6064 flex-grow: 0; | |
| 6065 flex-shrink: 0; | |
| 6066 flex-basis: 33.3333%; | |
| 6067 } | |
| 6068 | |
| 6069 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 6070 flex-grow: 0; | |
| 6071 flex-shrink: 0; | |
| 6072 flex-basis: 50%; | |
| 6073 } | |
| 6074 | |
| 6075 .flex-item-fixed-8-12 { | |
| 6076 flex-grow: 0; | |
| 6077 flex-shrink: 0; | |
| 6078 flex-basis: 66.6666%; | |
| 6079 } | |
| 6080 | |
| 6081 .flex-item-fixed-9-12 { | |
| 6082 flex-grow: 0; | |
| 6083 flex-shrink: 0; | |
| 6084 flex-basis: 75%; | |
| 6085 } | |
| 6086 | |
| 6087 | |
| 6088 .flex-item-fixed-12-12 { | |
| 6089 flex-grow: 0; | |
| 6090 flex-shrink: 0; | |
| 6091 flex-basis: 100%; | |
| 6092 } | |
| 6093 | |
| 6094 .flex-item-10-percent { | |
| 6095 flex-grow: 0; | |
| 6096 flex-shrink: 0; | |
| 6097 flex-basis: 10%; | |
| 6098 } | |
| 6099 | |
| 6100 .flex-item-15-percent { | |
| 6101 flex-grow: 0; | |
| 6102 flex-shrink: 0; | |
| 6103 flex-basis: 15%; | |
| 6104 } | |
| 6105 | |
| 6106 .flex-item-20-percent { | |
| 6107 flex-grow: 0; | |
| 6108 flex-shrink: 0; | |
| 6109 flex-basis: 20%; | |
| 6110 } | |
| 6111 | |
| 6112 .flex-item-30-percent { | |
| 6113 flex-grow: 0; | |
| 6114 flex-shrink: 0; | |
| 6115 flex-basis: 30%; | |
| 6116 } | |
| 6117 | |
| 6118 .flex-item-40-percent { | |
| 6119 flex-grow: 0; | |
| 6120 flex-shrink: 0; | |
| 6121 flex-basis: 40%; | |
| 6122 } | |
| 6123 | |
| 6124 .flex-item-50-percent { | |
| 6125 flex-grow: 0; | |
| 6126 flex-shrink: 0; | |
| 6127 flex-basis: 50%; | |
| 6128 } | |
| 6129 | |
| 6130 .flex-item-60-percent { | |
| 6131 flex-grow: 0; | |
| 6132 flex-shrink: 0; | |
| 6133 flex-basis: 60%; | |
| 6134 } | |
| 6135 | |
| 6136 .flex-item-70-percent { | |
| 6137 flex-grow: 0; | |
| 6138 flex-shrink: 0; | |
| 6139 flex-basis: 70%; | |
| 6140 } | |
| 6141 | |
| 6142 .flex-item-80-percent { | |
| 6143 flex-grow: 0; | |
| 6144 flex-shrink: 0; | |
| 6145 flex-basis: 80%; | |
| 6146 } | |
| 6147 | |
| 6148 .well { | |
| 6149 min-height: 20px; | |
| 6150 padding: 19px; | |
| 6151 margin-bottom: 20px; | |
| 6152 background-color: #f5f5f5; | |
| 6153 border: 1px solid #e3e3e3; | |
| 6154 border-radius: 4px; | |
| 6155 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 6156 } | |
| 6157 | |
| 6158 .break-wrap { | |
| 6159 word-wrap: break-word; | |
| 6160 } | |
| 6161 </style> | |
| 6162 <template if="{{ stack == null }}"> | |
| 6163 Loading stack frames | |
| 6164 </template> | |
| 6165 <template if="{{ stack != null }}"> | |
| 6166 <ul class="list-group"> | |
| 6167 <template repeat="{{ frame in stack['members'] }}"> | |
| 6168 <li class="list-group-item"> | |
| 6169 <debugger-frame frame="{{ frame }}" expand="{{ frame['depth'] == act
iveFrame }}"> | |
| 6170 </debugger-frame> | |
| 6171 </li> | |
| 6172 </template> | |
| 6173 </ul> | |
| 6174 </template> | |
| 6175 </template> | |
| 6176 </polymer-element> | |
| 6177 | |
| 6178 | |
| 6179 <polymer-element name="debugger-frame" extends="observatory-element"> | |
| 6180 <template> | |
| 6181 <style>/* Global styles */ | |
| 6182 * { | |
| 6183 margin: 0; | |
| 6184 padding: 0; | |
| 6185 font: 400 14px 'Montserrat', sans-serif; | |
| 6186 color: #333; | |
| 6187 box-sizing: border-box; | |
| 6188 } | |
| 6189 | |
| 6190 .content { | |
| 6191 padding-left: 10%; | |
| 6192 font: 400 14px 'Montserrat', sans-serif; | |
| 6193 } | |
| 6194 | |
| 6195 .content-centered { | |
| 6196 padding-left: 10%; | |
| 6197 padding-right: 10%; | |
| 6198 font: 400 14px 'Montserrat', sans-serif; | |
| 6199 } | |
| 6200 | |
| 6201 .content-centered-big { | |
| 6202 padding-left: 5%; | |
| 6203 padding-right: 5%; | |
| 6204 font: 400 14px 'Montserrat', sans-serif; | |
| 6205 } | |
| 6206 | |
| 6207 h1 { | |
| 6208 font: 400 18px 'Montserrat', sans-serif; | |
| 6209 } | |
| 6210 | |
| 6211 .memberList { | |
| 6212 display: table; | |
| 6213 } | |
| 6214 | |
| 6215 .memberItem { | |
| 6216 display: table-row; | |
| 6217 } | |
| 6218 | |
| 6219 .memberName, .memberValue { | |
| 6220 display: table-cell; | |
| 6221 vertical-align: top; | |
| 6222 padding: 3px 0 3px 1em; | |
| 6223 font: 400 14px 'Montserrat', sans-serif; | |
| 6224 } | |
| 6225 | |
| 6226 .memberSmall { | |
| 6227 display: table-cell; | |
| 6228 vertical-align: top; | |
| 6229 padding: 3px 0 3px 1em; | |
| 6230 font: 400 12px 'Montserrat', sans-serif; | |
| 6231 } | |
| 6232 | |
| 6233 .monospace { | |
| 6234 font-family: consolas, courier, monospace; | |
| 6235 font-size: 1em; | |
| 6236 line-height: 1.2em; | |
| 6237 white-space: nowrap; | |
| 6238 } | |
| 6239 | |
| 6240 a { | |
| 6241 color: #0489c3; | |
| 6242 text-decoration: none; | |
| 6243 } | |
| 6244 | |
| 6245 a:hover { | |
| 6246 text-decoration: underline; | |
| 6247 } | |
| 6248 | |
| 6249 em { | |
| 6250 color: inherit; | |
| 6251 font-style: italic; | |
| 6252 } | |
| 6253 | |
| 6254 b { | |
| 6255 color: inherit; | |
| 6256 font-weight: bold; | |
| 6257 } | |
| 6258 | |
| 6259 hr { | |
| 6260 margin-top: 20px; | |
| 6261 margin-bottom: 20px; | |
| 6262 border: 0; | |
| 6263 border-top: 1px solid #eee; | |
| 6264 height: 0; | |
| 6265 box-sizing: content-box; | |
| 6266 } | |
| 6267 | |
| 6268 .list-group { | |
| 6269 padding-left: 0; | |
| 6270 margin-bottom: 20px; | |
| 6271 } | |
| 6272 | |
| 6273 .list-group-item { | |
| 6274 position: relative; | |
| 6275 display: block; | |
| 6276 padding: 10px 15px; | |
| 6277 margin-bottom: -1px; | |
| 6278 background-color: #fff; | |
| 6279 } | |
| 6280 | |
| 6281 .list-group-item:first-child { | |
| 6282 /* rounded top corners */ | |
| 6283 border-top-right-radius:4px; | |
| 6284 border-top-left-radius:4px; | |
| 6285 } | |
| 6286 | |
| 6287 .list-group-item:last-child { | |
| 6288 margin-bottom: 0; | |
| 6289 /* rounded bottom corners */ | |
| 6290 border-bottom-right-radius: 4px; | |
| 6291 border-bottom-left-radius:4px; | |
| 6292 } | |
| 6293 | |
| 6294 /* Flex row container */ | |
| 6295 .flex-row { | |
| 6296 display: flex; | |
| 6297 flex-direction: row; | |
| 6298 } | |
| 6299 | |
| 6300 /* Flex column container */ | |
| 6301 .flex-column { | |
| 6302 display: flex; | |
| 6303 flex-direction: column; | |
| 6304 } | |
| 6305 | |
| 6306 .flex-item-fit { | |
| 6307 flex-grow: 1; | |
| 6308 flex-shrink: 1; | |
| 6309 flex-basis: auto; | |
| 6310 } | |
| 6311 | |
| 6312 .flex-item-no-shrink { | |
| 6313 flex-grow: 0; | |
| 6314 flex-shrink: 0; | |
| 6315 flex-basis: auto; | |
| 6316 } | |
| 6317 | |
| 6318 .flex-item-fill { | |
| 6319 flex-grow: 0; | |
| 6320 flex-shrink: 1; /* shrink when pressured */ | |
| 6321 flex-basis: 100%; /* try and take 100% */ | |
| 6322 } | |
| 6323 | |
| 6324 .flex-item-fixed-1-12 { | |
| 6325 flex-grow: 0; | |
| 6326 flex-shrink: 0; | |
| 6327 flex-basis: 8.3%; | |
| 6328 } | |
| 6329 | |
| 6330 .flex-item-fixed-2-12 { | |
| 6331 flex-grow: 0; | |
| 6332 flex-shrink: 0; | |
| 6333 flex-basis: 16.6%; | |
| 6334 } | |
| 6335 | |
| 6336 .flex-item-fixed-4-12 { | |
| 6337 flex-grow: 0; | |
| 6338 flex-shrink: 0; | |
| 6339 flex-basis: 33.3333%; | |
| 6340 } | |
| 6341 | |
| 6342 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 6343 flex-grow: 0; | |
| 6344 flex-shrink: 0; | |
| 6345 flex-basis: 50%; | |
| 6346 } | |
| 6347 | |
| 6348 .flex-item-fixed-8-12 { | |
| 6349 flex-grow: 0; | |
| 6350 flex-shrink: 0; | |
| 6351 flex-basis: 66.6666%; | |
| 6352 } | |
| 6353 | |
| 6354 .flex-item-fixed-9-12 { | |
| 6355 flex-grow: 0; | |
| 6356 flex-shrink: 0; | |
| 6357 flex-basis: 75%; | |
| 6358 } | |
| 6359 | |
| 6360 | |
| 6361 .flex-item-fixed-12-12 { | |
| 6362 flex-grow: 0; | |
| 6363 flex-shrink: 0; | |
| 6364 flex-basis: 100%; | |
| 6365 } | |
| 6366 | |
| 6367 .flex-item-10-percent { | |
| 6368 flex-grow: 0; | |
| 6369 flex-shrink: 0; | |
| 6370 flex-basis: 10%; | |
| 6371 } | |
| 6372 | |
| 6373 .flex-item-15-percent { | |
| 6374 flex-grow: 0; | |
| 6375 flex-shrink: 0; | |
| 6376 flex-basis: 15%; | |
| 6377 } | |
| 6378 | |
| 6379 .flex-item-20-percent { | |
| 6380 flex-grow: 0; | |
| 6381 flex-shrink: 0; | |
| 6382 flex-basis: 20%; | |
| 6383 } | |
| 6384 | |
| 6385 .flex-item-30-percent { | |
| 6386 flex-grow: 0; | |
| 6387 flex-shrink: 0; | |
| 6388 flex-basis: 30%; | |
| 6389 } | |
| 6390 | |
| 6391 .flex-item-40-percent { | |
| 6392 flex-grow: 0; | |
| 6393 flex-shrink: 0; | |
| 6394 flex-basis: 40%; | |
| 6395 } | |
| 6396 | |
| 6397 .flex-item-50-percent { | |
| 6398 flex-grow: 0; | |
| 6399 flex-shrink: 0; | |
| 6400 flex-basis: 50%; | |
| 6401 } | |
| 6402 | |
| 6403 .flex-item-60-percent { | |
| 6404 flex-grow: 0; | |
| 6405 flex-shrink: 0; | |
| 6406 flex-basis: 60%; | |
| 6407 } | |
| 6408 | |
| 6409 .flex-item-70-percent { | |
| 6410 flex-grow: 0; | |
| 6411 flex-shrink: 0; | |
| 6412 flex-basis: 70%; | |
| 6413 } | |
| 6414 | |
| 6415 .flex-item-80-percent { | |
| 6416 flex-grow: 0; | |
| 6417 flex-shrink: 0; | |
| 6418 flex-basis: 80%; | |
| 6419 } | |
| 6420 | |
| 6421 .well { | |
| 6422 min-height: 20px; | |
| 6423 padding: 19px; | |
| 6424 margin-bottom: 20px; | |
| 6425 background-color: #f5f5f5; | |
| 6426 border: 1px solid #e3e3e3; | |
| 6427 border-radius: 4px; | |
| 6428 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 6429 } | |
| 6430 | |
| 6431 .break-wrap { | |
| 6432 word-wrap: break-word; | |
| 6433 } | |
| 6434 </style> | |
| 6435 <style> | |
| 6436 .frameOuter { | |
| 6437 position: relative; | |
| 6438 padding: 5px; | |
| 6439 border: 1px solid white; | |
| 6440 } | |
| 6441 .frameOuter:hover { | |
| 6442 border: 1px solid #e0e0e0; | |
| 6443 } | |
| 6444 .shadow { | |
| 6445 box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), | |
| 6446 0 2px 5px 0 rgba(0, 0, 0, 0.26); | |
| 6447 } | |
| 6448 .frameSummaryText { | |
| 6449 display: inline-block; | |
| 6450 padding: 5px; | |
| 6451 } | |
| 6452 .frameId { | |
| 6453 display: inline-block; | |
| 6454 width: 60px; | |
| 6455 } | |
| 6456 .frameOuter .frameExpander { | |
| 6457 position: absolute; | |
| 6458 right: 5px; | |
| 6459 top: 5px; | |
| 6460 display: none; | |
| 6461 } | |
| 6462 .frameOuter:hover .frameExpander{ | |
| 6463 display: inline-block; | |
| 6464 } | |
| 6465 .frameContractor { | |
| 6466 position: absolute; | |
| 6467 right: 5px; | |
| 6468 bottom: 5px; | |
| 6469 display: inline-block; | |
| 6470 } | |
| 6471 </style> | |
| 6472 <div id="frameOuter" class="frameOuter"> | |
| 6473 <a on-click="{{ toggleExpand }}"> | |
| 6474 <div class="frameSummary"> | |
| 6475 <div class="frameSummaryText"> | |
| 6476 <div class="frameId"><b>frame {{ frame['depth'] }}</b></div> | |
| 6477 <function-ref ref="{{ frame['function'] }}"></function-ref> | |
| 6478 ( <script-ref ref="{{ frame['script'] }}" pos="{{ frame['tokenPos']
}}"> | |
| 6479 </script-ref> ) | |
| 6480 </div> | |
| 6481 <template if="{{ !expanded }}"> | |
| 6482 <div class="frameExpander"> | |
| 6483 <icon-expand-more></icon-expand-more> | |
| 6484 </div> | |
| 6485 </template> | |
| 6486 </div> | |
| 6487 </a> | |
| 6488 | |
| 6489 <template if="{{expanded}}"> | |
| 6490 <div class="frameDetails"> | |
| 6491 <div class="flex-row"> | |
| 6492 <div class="flex-item-60-percent"> | |
| 6493 <script-inset height="{{ scriptHeight }}" script="{{ frame['functi
on'].script }}" startpos="{{ frame['function'].tokenPos }}" endpos="{{ frame['fu
nction'].endTokenPos }}" currentpos="{{ frame['tokenPos'] }}"> | |
| 6494 </script-inset> | |
| 6495 </div> | |
| 6496 <div class="flex-item-40-percent"> | |
| 6497 <div style="padding:10px;" class="memberList"> | |
| 6498 <template repeat="{{ v in frame['vars'] }}"> | |
| 6499 <div class="memberItem"> | |
| 6500 <div class="memberName">{{ v['name']}}</div> | |
| 6501 <div class="memberValue"> | |
| 6502 <any-service-ref ref="{{ v['value'] }}"> | |
| 6503 </any-service-ref> | |
| 6504 </div> | |
| 6505 </div> | |
| 6506 </template> | |
| 6507 </div> | |
| 6508 </div> | |
| 6509 </div> | |
| 6510 <!-- TODO(turnidge): Add eval box here? --> | |
| 6511 <div class="frameContractor"> | |
| 6512 <template if="{{expanded}}"> | |
| 6513 <a on-click="{{ toggleExpand }}"> | |
| 6514 <icon-expand-less></icon-expand-less> | |
| 6515 </a> | |
| 6516 </template> | |
| 6517 </div> | |
| 6518 </div> | |
| 6519 </template> | |
| 6520 </div> | |
| 6521 </template> | |
| 6522 </polymer-element> | |
| 6523 | |
| 6524 <polymer-element name="debugger-console" extends="observatory-element"> | |
| 6525 <template> | |
| 6526 <style>/* Global styles */ | |
| 6527 * { | |
| 6528 margin: 0; | |
| 6529 padding: 0; | |
| 6530 font: 400 14px 'Montserrat', sans-serif; | |
| 6531 color: #333; | |
| 6532 box-sizing: border-box; | |
| 6533 } | |
| 6534 | |
| 6535 .content { | |
| 6536 padding-left: 10%; | |
| 6537 font: 400 14px 'Montserrat', sans-serif; | |
| 6538 } | |
| 6539 | |
| 6540 .content-centered { | |
| 6541 padding-left: 10%; | |
| 6542 padding-right: 10%; | |
| 6543 font: 400 14px 'Montserrat', sans-serif; | |
| 6544 } | |
| 6545 | |
| 6546 .content-centered-big { | |
| 6547 padding-left: 5%; | |
| 6548 padding-right: 5%; | |
| 6549 font: 400 14px 'Montserrat', sans-serif; | |
| 6550 } | |
| 6551 | |
| 6552 h1 { | |
| 6553 font: 400 18px 'Montserrat', sans-serif; | |
| 6554 } | |
| 6555 | |
| 6556 .memberList { | |
| 6557 display: table; | |
| 6558 } | |
| 6559 | |
| 6560 .memberItem { | |
| 6561 display: table-row; | |
| 6562 } | |
| 6563 | |
| 6564 .memberName, .memberValue { | |
| 6565 display: table-cell; | |
| 6566 vertical-align: top; | |
| 6567 padding: 3px 0 3px 1em; | |
| 6568 font: 400 14px 'Montserrat', sans-serif; | |
| 6569 } | |
| 6570 | |
| 6571 .memberSmall { | |
| 6572 display: table-cell; | |
| 6573 vertical-align: top; | |
| 6574 padding: 3px 0 3px 1em; | |
| 6575 font: 400 12px 'Montserrat', sans-serif; | |
| 6576 } | |
| 6577 | |
| 6578 .monospace { | |
| 6579 font-family: consolas, courier, monospace; | |
| 6580 font-size: 1em; | |
| 6581 line-height: 1.2em; | |
| 6582 white-space: nowrap; | |
| 6583 } | |
| 6584 | |
| 6585 a { | |
| 6586 color: #0489c3; | |
| 6587 text-decoration: none; | |
| 6588 } | |
| 6589 | |
| 6590 a:hover { | |
| 6591 text-decoration: underline; | |
| 6592 } | |
| 6593 | |
| 6594 em { | |
| 6595 color: inherit; | |
| 6596 font-style: italic; | |
| 6597 } | |
| 6598 | |
| 6599 b { | |
| 6600 color: inherit; | |
| 6601 font-weight: bold; | |
| 6602 } | |
| 6603 | |
| 6604 hr { | |
| 6605 margin-top: 20px; | |
| 6606 margin-bottom: 20px; | |
| 6607 border: 0; | |
| 6608 border-top: 1px solid #eee; | |
| 6609 height: 0; | |
| 6610 box-sizing: content-box; | |
| 6611 } | |
| 6612 | |
| 6613 .list-group { | |
| 6614 padding-left: 0; | |
| 6615 margin-bottom: 20px; | |
| 6616 } | |
| 6617 | |
| 6618 .list-group-item { | |
| 6619 position: relative; | |
| 6620 display: block; | |
| 6621 padding: 10px 15px; | |
| 6622 margin-bottom: -1px; | |
| 6623 background-color: #fff; | |
| 6624 } | |
| 6625 | |
| 6626 .list-group-item:first-child { | |
| 6627 /* rounded top corners */ | |
| 6628 border-top-right-radius:4px; | |
| 6629 border-top-left-radius:4px; | |
| 6630 } | |
| 6631 | |
| 6632 .list-group-item:last-child { | |
| 6633 margin-bottom: 0; | |
| 6634 /* rounded bottom corners */ | |
| 6635 border-bottom-right-radius: 4px; | |
| 6636 border-bottom-left-radius:4px; | |
| 6637 } | |
| 6638 | |
| 6639 /* Flex row container */ | |
| 6640 .flex-row { | |
| 6641 display: flex; | |
| 6642 flex-direction: row; | |
| 6643 } | |
| 6644 | |
| 6645 /* Flex column container */ | |
| 6646 .flex-column { | |
| 6647 display: flex; | |
| 6648 flex-direction: column; | |
| 6649 } | |
| 6650 | |
| 6651 .flex-item-fit { | |
| 6652 flex-grow: 1; | |
| 6653 flex-shrink: 1; | |
| 6654 flex-basis: auto; | |
| 6655 } | |
| 6656 | |
| 6657 .flex-item-no-shrink { | |
| 6658 flex-grow: 0; | |
| 6659 flex-shrink: 0; | |
| 6660 flex-basis: auto; | |
| 6661 } | |
| 6662 | |
| 6663 .flex-item-fill { | |
| 6664 flex-grow: 0; | |
| 6665 flex-shrink: 1; /* shrink when pressured */ | |
| 6666 flex-basis: 100%; /* try and take 100% */ | |
| 6667 } | |
| 6668 | |
| 6669 .flex-item-fixed-1-12 { | |
| 6670 flex-grow: 0; | |
| 6671 flex-shrink: 0; | |
| 6672 flex-basis: 8.3%; | |
| 6673 } | |
| 6674 | |
| 6675 .flex-item-fixed-2-12 { | |
| 6676 flex-grow: 0; | |
| 6677 flex-shrink: 0; | |
| 6678 flex-basis: 16.6%; | |
| 6679 } | |
| 6680 | |
| 6681 .flex-item-fixed-4-12 { | |
| 6682 flex-grow: 0; | |
| 6683 flex-shrink: 0; | |
| 6684 flex-basis: 33.3333%; | |
| 6685 } | |
| 6686 | |
| 6687 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 6688 flex-grow: 0; | |
| 6689 flex-shrink: 0; | |
| 6690 flex-basis: 50%; | |
| 6691 } | |
| 6692 | |
| 6693 .flex-item-fixed-8-12 { | |
| 6694 flex-grow: 0; | |
| 6695 flex-shrink: 0; | |
| 6696 flex-basis: 66.6666%; | |
| 6697 } | |
| 6698 | |
| 6699 .flex-item-fixed-9-12 { | |
| 6700 flex-grow: 0; | |
| 6701 flex-shrink: 0; | |
| 6702 flex-basis: 75%; | |
| 6703 } | |
| 6704 | |
| 6705 | |
| 6706 .flex-item-fixed-12-12 { | |
| 6707 flex-grow: 0; | |
| 6708 flex-shrink: 0; | |
| 6709 flex-basis: 100%; | |
| 6710 } | |
| 6711 | |
| 6712 .flex-item-10-percent { | |
| 6713 flex-grow: 0; | |
| 6714 flex-shrink: 0; | |
| 6715 flex-basis: 10%; | |
| 6716 } | |
| 6717 | |
| 6718 .flex-item-15-percent { | |
| 6719 flex-grow: 0; | |
| 6720 flex-shrink: 0; | |
| 6721 flex-basis: 15%; | |
| 6722 } | |
| 6723 | |
| 6724 .flex-item-20-percent { | |
| 6725 flex-grow: 0; | |
| 6726 flex-shrink: 0; | |
| 6727 flex-basis: 20%; | |
| 6728 } | |
| 6729 | |
| 6730 .flex-item-30-percent { | |
| 6731 flex-grow: 0; | |
| 6732 flex-shrink: 0; | |
| 6733 flex-basis: 30%; | |
| 6734 } | |
| 6735 | |
| 6736 .flex-item-40-percent { | |
| 6737 flex-grow: 0; | |
| 6738 flex-shrink: 0; | |
| 6739 flex-basis: 40%; | |
| 6740 } | |
| 6741 | |
| 6742 .flex-item-50-percent { | |
| 6743 flex-grow: 0; | |
| 6744 flex-shrink: 0; | |
| 6745 flex-basis: 50%; | |
| 6746 } | |
| 6747 | |
| 6748 .flex-item-60-percent { | |
| 6749 flex-grow: 0; | |
| 6750 flex-shrink: 0; | |
| 6751 flex-basis: 60%; | |
| 6752 } | |
| 6753 | |
| 6754 .flex-item-70-percent { | |
| 6755 flex-grow: 0; | |
| 6756 flex-shrink: 0; | |
| 6757 flex-basis: 70%; | |
| 6758 } | |
| 6759 | |
| 6760 .flex-item-80-percent { | |
| 6761 flex-grow: 0; | |
| 6762 flex-shrink: 0; | |
| 6763 flex-basis: 80%; | |
| 6764 } | |
| 6765 | |
| 6766 .well { | |
| 6767 min-height: 20px; | |
| 6768 padding: 19px; | |
| 6769 margin-bottom: 20px; | |
| 6770 background-color: #f5f5f5; | |
| 6771 border: 1px solid #e3e3e3; | |
| 6772 border-radius: 4px; | |
| 6773 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 6774 } | |
| 6775 | |
| 6776 .break-wrap { | |
| 6777 word-wrap: break-word; | |
| 6778 } | |
| 6779 </style> | |
| 6780 <style> | |
| 6781 .textBox { | |
| 6782 position: absolute; | |
| 6783 bottom: 0px; | |
| 6784 width: 100%; | |
| 6785 } | |
| 6786 </style> | |
| 6787 <div> | |
| 6788 Debugging console is not yet implemented.<br> | |
| 6789 </div> | |
| 6790 </template> | |
| 6791 </polymer-element> | |
| 6792 | |
| 6793 <polymer-element name="debugger-input" extends="observatory-element"> | |
| 6794 <template> | |
| 6795 <style>/* Global styles */ | |
| 6796 * { | |
| 6797 margin: 0; | |
| 6798 padding: 0; | |
| 6799 font: 400 14px 'Montserrat', sans-serif; | |
| 6800 color: #333; | |
| 6801 box-sizing: border-box; | |
| 6802 } | |
| 6803 | |
| 6804 .content { | |
| 6805 padding-left: 10%; | |
| 6806 font: 400 14px 'Montserrat', sans-serif; | |
| 6807 } | |
| 6808 | |
| 6809 .content-centered { | |
| 6810 padding-left: 10%; | |
| 6811 padding-right: 10%; | |
| 6812 font: 400 14px 'Montserrat', sans-serif; | |
| 6813 } | |
| 6814 | |
| 6815 .content-centered-big { | |
| 6816 padding-left: 5%; | |
| 6817 padding-right: 5%; | |
| 6818 font: 400 14px 'Montserrat', sans-serif; | |
| 6819 } | |
| 6820 | |
| 6821 h1 { | |
| 6822 font: 400 18px 'Montserrat', sans-serif; | |
| 6823 } | |
| 6824 | |
| 6825 .memberList { | |
| 6826 display: table; | |
| 6827 } | |
| 6828 | |
| 6829 .memberItem { | |
| 6830 display: table-row; | |
| 6831 } | |
| 6832 | |
| 6833 .memberName, .memberValue { | |
| 6834 display: table-cell; | |
| 6835 vertical-align: top; | |
| 6836 padding: 3px 0 3px 1em; | |
| 6837 font: 400 14px 'Montserrat', sans-serif; | |
| 6838 } | |
| 6839 | |
| 6840 .memberSmall { | |
| 6841 display: table-cell; | |
| 6842 vertical-align: top; | |
| 6843 padding: 3px 0 3px 1em; | |
| 6844 font: 400 12px 'Montserrat', sans-serif; | |
| 6845 } | |
| 6846 | |
| 6847 .monospace { | |
| 6848 font-family: consolas, courier, monospace; | |
| 6849 font-size: 1em; | |
| 6850 line-height: 1.2em; | |
| 6851 white-space: nowrap; | |
| 6852 } | |
| 6853 | |
| 6854 a { | |
| 6855 color: #0489c3; | |
| 6856 text-decoration: none; | |
| 6857 } | |
| 6858 | |
| 6859 a:hover { | |
| 6860 text-decoration: underline; | |
| 6861 } | |
| 6862 | |
| 6863 em { | |
| 6864 color: inherit; | |
| 6865 font-style: italic; | |
| 6866 } | |
| 6867 | |
| 6868 b { | |
| 6869 color: inherit; | |
| 6870 font-weight: bold; | |
| 6871 } | |
| 6872 | |
| 6873 hr { | |
| 6874 margin-top: 20px; | |
| 6875 margin-bottom: 20px; | |
| 6876 border: 0; | |
| 6877 border-top: 1px solid #eee; | |
| 6878 height: 0; | |
| 6879 box-sizing: content-box; | |
| 6880 } | |
| 6881 | |
| 6882 .list-group { | |
| 6883 padding-left: 0; | |
| 6884 margin-bottom: 20px; | |
| 6885 } | |
| 6886 | |
| 6887 .list-group-item { | |
| 6888 position: relative; | |
| 6889 display: block; | |
| 6890 padding: 10px 15px; | |
| 6891 margin-bottom: -1px; | |
| 6892 background-color: #fff; | |
| 6893 } | |
| 6894 | |
| 6895 .list-group-item:first-child { | |
| 6896 /* rounded top corners */ | |
| 6897 border-top-right-radius:4px; | |
| 6898 border-top-left-radius:4px; | |
| 6899 } | |
| 6900 | |
| 6901 .list-group-item:last-child { | |
| 6902 margin-bottom: 0; | |
| 6903 /* rounded bottom corners */ | |
| 6904 border-bottom-right-radius: 4px; | |
| 6905 border-bottom-left-radius:4px; | |
| 6906 } | |
| 6907 | |
| 6908 /* Flex row container */ | |
| 6909 .flex-row { | |
| 6910 display: flex; | |
| 6911 flex-direction: row; | |
| 6912 } | |
| 6913 | |
| 6914 /* Flex column container */ | |
| 6915 .flex-column { | |
| 6916 display: flex; | |
| 6917 flex-direction: column; | |
| 6918 } | |
| 6919 | |
| 6920 .flex-item-fit { | |
| 6921 flex-grow: 1; | |
| 6922 flex-shrink: 1; | |
| 6923 flex-basis: auto; | |
| 6924 } | |
| 6925 | |
| 6926 .flex-item-no-shrink { | |
| 6927 flex-grow: 0; | |
| 6928 flex-shrink: 0; | |
| 6929 flex-basis: auto; | |
| 6930 } | |
| 6931 | |
| 6932 .flex-item-fill { | |
| 6933 flex-grow: 0; | |
| 6934 flex-shrink: 1; /* shrink when pressured */ | |
| 6935 flex-basis: 100%; /* try and take 100% */ | |
| 6936 } | |
| 6937 | |
| 6938 .flex-item-fixed-1-12 { | |
| 6939 flex-grow: 0; | |
| 6940 flex-shrink: 0; | |
| 6941 flex-basis: 8.3%; | |
| 6942 } | |
| 6943 | |
| 6944 .flex-item-fixed-2-12 { | |
| 6945 flex-grow: 0; | |
| 6946 flex-shrink: 0; | |
| 6947 flex-basis: 16.6%; | |
| 6948 } | |
| 6949 | |
| 6950 .flex-item-fixed-4-12 { | |
| 6951 flex-grow: 0; | |
| 6952 flex-shrink: 0; | |
| 6953 flex-basis: 33.3333%; | |
| 6954 } | |
| 6955 | |
| 6956 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 6957 flex-grow: 0; | |
| 6958 flex-shrink: 0; | |
| 6959 flex-basis: 50%; | |
| 6960 } | |
| 6961 | |
| 6962 .flex-item-fixed-8-12 { | |
| 6963 flex-grow: 0; | |
| 6964 flex-shrink: 0; | |
| 6965 flex-basis: 66.6666%; | |
| 6966 } | |
| 6967 | |
| 6968 .flex-item-fixed-9-12 { | |
| 6969 flex-grow: 0; | |
| 6970 flex-shrink: 0; | |
| 6971 flex-basis: 75%; | |
| 6972 } | |
| 6973 | |
| 6974 | |
| 6975 .flex-item-fixed-12-12 { | |
| 6976 flex-grow: 0; | |
| 6977 flex-shrink: 0; | |
| 6978 flex-basis: 100%; | |
| 6979 } | |
| 6980 | |
| 6981 .flex-item-10-percent { | |
| 6982 flex-grow: 0; | |
| 6983 flex-shrink: 0; | |
| 6984 flex-basis: 10%; | |
| 6985 } | |
| 6986 | |
| 6987 .flex-item-15-percent { | |
| 6988 flex-grow: 0; | |
| 6989 flex-shrink: 0; | |
| 6990 flex-basis: 15%; | |
| 6991 } | |
| 6992 | |
| 6993 .flex-item-20-percent { | |
| 6994 flex-grow: 0; | |
| 6995 flex-shrink: 0; | |
| 6996 flex-basis: 20%; | |
| 6997 } | |
| 6998 | |
| 6999 .flex-item-30-percent { | |
| 7000 flex-grow: 0; | |
| 7001 flex-shrink: 0; | |
| 7002 flex-basis: 30%; | |
| 7003 } | |
| 7004 | |
| 7005 .flex-item-40-percent { | |
| 7006 flex-grow: 0; | |
| 7007 flex-shrink: 0; | |
| 7008 flex-basis: 40%; | |
| 7009 } | |
| 7010 | |
| 7011 .flex-item-50-percent { | |
| 7012 flex-grow: 0; | |
| 7013 flex-shrink: 0; | |
| 7014 flex-basis: 50%; | |
| 7015 } | |
| 7016 | |
| 7017 .flex-item-60-percent { | |
| 7018 flex-grow: 0; | |
| 7019 flex-shrink: 0; | |
| 7020 flex-basis: 60%; | |
| 7021 } | |
| 7022 | |
| 7023 .flex-item-70-percent { | |
| 7024 flex-grow: 0; | |
| 7025 flex-shrink: 0; | |
| 7026 flex-basis: 70%; | |
| 7027 } | |
| 7028 | |
| 7029 .flex-item-80-percent { | |
| 7030 flex-grow: 0; | |
| 7031 flex-shrink: 0; | |
| 7032 flex-basis: 80%; | |
| 7033 } | |
| 7034 | |
| 7035 .well { | |
| 7036 min-height: 20px; | |
| 7037 padding: 19px; | |
| 7038 margin-bottom: 20px; | |
| 7039 background-color: #f5f5f5; | |
| 7040 border: 1px solid #e3e3e3; | |
| 7041 border-radius: 4px; | |
| 7042 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 7043 } | |
| 7044 | |
| 7045 .break-wrap { | |
| 7046 word-wrap: break-word; | |
| 7047 } | |
| 7048 </style> | |
| 7049 <style> | |
| 7050 .textBox { | |
| 7051 font: 400 16px 'Montserrat', sans-serif; | |
| 7052 width: 100%; | |
| 7053 } | |
| 7054 </style> | |
| 7055 <input id="textBox" class="textBox" type="text" value="{{ text }}"> | |
| 7056 </template> | |
| 7057 </polymer-element> | |
| 7058 | |
| 7059 | |
| 7060 | |
| 7061 | |
| 7062 | |
| 7063 | |
| 7064 | |
| 7065 <polymer-element name="error-view" extends="observatory-element"> | |
| 7066 <template> | |
| 7067 <style>/* Global styles */ | |
| 7068 * { | |
| 7069 margin: 0; | |
| 7070 padding: 0; | |
| 7071 font: 400 14px 'Montserrat', sans-serif; | |
| 7072 color: #333; | |
| 7073 box-sizing: border-box; | |
| 7074 } | |
| 7075 | |
| 7076 .content { | |
| 7077 padding-left: 10%; | |
| 7078 font: 400 14px 'Montserrat', sans-serif; | |
| 7079 } | |
| 7080 | |
| 7081 .content-centered { | |
| 7082 padding-left: 10%; | |
| 7083 padding-right: 10%; | |
| 7084 font: 400 14px 'Montserrat', sans-serif; | |
| 7085 } | |
| 7086 | |
| 7087 .content-centered-big { | |
| 7088 padding-left: 5%; | |
| 7089 padding-right: 5%; | |
| 7090 font: 400 14px 'Montserrat', sans-serif; | |
| 7091 } | |
| 7092 | |
| 7093 h1 { | |
| 7094 font: 400 18px 'Montserrat', sans-serif; | |
| 7095 } | |
| 7096 | |
| 7097 .memberList { | |
| 7098 display: table; | |
| 7099 } | |
| 7100 | |
| 7101 .memberItem { | |
| 7102 display: table-row; | |
| 7103 } | |
| 7104 | |
| 7105 .memberName, .memberValue { | |
| 7106 display: table-cell; | |
| 7107 vertical-align: top; | |
| 7108 padding: 3px 0 3px 1em; | |
| 7109 font: 400 14px 'Montserrat', sans-serif; | |
| 7110 } | |
| 7111 | |
| 7112 .memberSmall { | |
| 7113 display: table-cell; | |
| 7114 vertical-align: top; | |
| 7115 padding: 3px 0 3px 1em; | |
| 7116 font: 400 12px 'Montserrat', sans-serif; | |
| 7117 } | |
| 7118 | |
| 7119 .monospace { | |
| 7120 font-family: consolas, courier, monospace; | |
| 7121 font-size: 1em; | |
| 7122 line-height: 1.2em; | |
| 7123 white-space: nowrap; | |
| 7124 } | |
| 7125 | |
| 7126 a { | |
| 7127 color: #0489c3; | |
| 7128 text-decoration: none; | |
| 7129 } | |
| 7130 | |
| 7131 a:hover { | |
| 7132 text-decoration: underline; | |
| 7133 } | |
| 7134 | |
| 7135 em { | |
| 7136 color: inherit; | |
| 7137 font-style: italic; | |
| 7138 } | |
| 7139 | |
| 7140 b { | |
| 7141 color: inherit; | |
| 7142 font-weight: bold; | |
| 7143 } | |
| 7144 | |
| 7145 hr { | |
| 7146 margin-top: 20px; | |
| 7147 margin-bottom: 20px; | |
| 7148 border: 0; | |
| 7149 border-top: 1px solid #eee; | |
| 7150 height: 0; | |
| 7151 box-sizing: content-box; | |
| 7152 } | |
| 7153 | |
| 7154 .list-group { | |
| 7155 padding-left: 0; | |
| 7156 margin-bottom: 20px; | |
| 7157 } | |
| 7158 | |
| 7159 .list-group-item { | |
| 7160 position: relative; | |
| 7161 display: block; | |
| 7162 padding: 10px 15px; | |
| 7163 margin-bottom: -1px; | |
| 7164 background-color: #fff; | |
| 7165 } | |
| 7166 | |
| 7167 .list-group-item:first-child { | |
| 7168 /* rounded top corners */ | |
| 7169 border-top-right-radius:4px; | |
| 7170 border-top-left-radius:4px; | |
| 7171 } | |
| 7172 | |
| 7173 .list-group-item:last-child { | |
| 7174 margin-bottom: 0; | |
| 7175 /* rounded bottom corners */ | |
| 7176 border-bottom-right-radius: 4px; | |
| 7177 border-bottom-left-radius:4px; | |
| 7178 } | |
| 7179 | |
| 7180 /* Flex row container */ | |
| 7181 .flex-row { | |
| 7182 display: flex; | |
| 7183 flex-direction: row; | |
| 7184 } | |
| 7185 | |
| 7186 /* Flex column container */ | |
| 7187 .flex-column { | |
| 7188 display: flex; | |
| 7189 flex-direction: column; | |
| 7190 } | |
| 7191 | |
| 7192 .flex-item-fit { | |
| 7193 flex-grow: 1; | |
| 7194 flex-shrink: 1; | |
| 7195 flex-basis: auto; | |
| 7196 } | |
| 7197 | |
| 7198 .flex-item-no-shrink { | |
| 7199 flex-grow: 0; | |
| 7200 flex-shrink: 0; | |
| 7201 flex-basis: auto; | |
| 7202 } | |
| 7203 | |
| 7204 .flex-item-fill { | |
| 7205 flex-grow: 0; | |
| 7206 flex-shrink: 1; /* shrink when pressured */ | |
| 7207 flex-basis: 100%; /* try and take 100% */ | |
| 7208 } | |
| 7209 | |
| 7210 .flex-item-fixed-1-12 { | |
| 7211 flex-grow: 0; | |
| 7212 flex-shrink: 0; | |
| 7213 flex-basis: 8.3%; | |
| 7214 } | |
| 7215 | |
| 7216 .flex-item-fixed-2-12 { | |
| 7217 flex-grow: 0; | |
| 7218 flex-shrink: 0; | |
| 7219 flex-basis: 16.6%; | |
| 7220 } | |
| 7221 | |
| 7222 .flex-item-fixed-4-12 { | |
| 7223 flex-grow: 0; | |
| 7224 flex-shrink: 0; | |
| 7225 flex-basis: 33.3333%; | |
| 7226 } | |
| 7227 | |
| 7228 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 7229 flex-grow: 0; | |
| 7230 flex-shrink: 0; | |
| 7231 flex-basis: 50%; | |
| 7232 } | |
| 7233 | |
| 7234 .flex-item-fixed-8-12 { | |
| 7235 flex-grow: 0; | |
| 7236 flex-shrink: 0; | |
| 7237 flex-basis: 66.6666%; | |
| 7238 } | |
| 7239 | |
| 7240 .flex-item-fixed-9-12 { | |
| 7241 flex-grow: 0; | |
| 7242 flex-shrink: 0; | |
| 7243 flex-basis: 75%; | |
| 7244 } | |
| 7245 | |
| 7246 | |
| 7247 .flex-item-fixed-12-12 { | |
| 7248 flex-grow: 0; | |
| 7249 flex-shrink: 0; | |
| 7250 flex-basis: 100%; | |
| 7251 } | |
| 7252 | |
| 7253 .flex-item-10-percent { | |
| 7254 flex-grow: 0; | |
| 7255 flex-shrink: 0; | |
| 7256 flex-basis: 10%; | |
| 7257 } | |
| 7258 | |
| 7259 .flex-item-15-percent { | |
| 7260 flex-grow: 0; | |
| 7261 flex-shrink: 0; | |
| 7262 flex-basis: 15%; | |
| 7263 } | |
| 7264 | |
| 7265 .flex-item-20-percent { | |
| 7266 flex-grow: 0; | |
| 7267 flex-shrink: 0; | |
| 7268 flex-basis: 20%; | |
| 7269 } | |
| 7270 | |
| 7271 .flex-item-30-percent { | |
| 7272 flex-grow: 0; | |
| 7273 flex-shrink: 0; | |
| 7274 flex-basis: 30%; | |
| 7275 } | |
| 7276 | |
| 7277 .flex-item-40-percent { | |
| 7278 flex-grow: 0; | |
| 7279 flex-shrink: 0; | |
| 7280 flex-basis: 40%; | |
| 7281 } | |
| 7282 | |
| 7283 .flex-item-50-percent { | |
| 7284 flex-grow: 0; | |
| 7285 flex-shrink: 0; | |
| 7286 flex-basis: 50%; | |
| 7287 } | |
| 7288 | |
| 7289 .flex-item-60-percent { | |
| 7290 flex-grow: 0; | |
| 7291 flex-shrink: 0; | |
| 7292 flex-basis: 60%; | |
| 7293 } | |
| 7294 | |
| 7295 .flex-item-70-percent { | |
| 7296 flex-grow: 0; | |
| 7297 flex-shrink: 0; | |
| 7298 flex-basis: 70%; | |
| 7299 } | |
| 7300 | |
| 7301 .flex-item-80-percent { | |
| 7302 flex-grow: 0; | |
| 7303 flex-shrink: 0; | |
| 7304 flex-basis: 80%; | |
| 7305 } | |
| 7306 | |
| 7307 .well { | |
| 7308 min-height: 20px; | |
| 7309 padding: 19px; | |
| 7310 margin-bottom: 20px; | |
| 7311 background-color: #f5f5f5; | |
| 7312 border: 1px solid #e3e3e3; | |
| 7313 border-radius: 4px; | |
| 7314 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 7315 } | |
| 7316 | |
| 7317 .break-wrap { | |
| 7318 word-wrap: break-word; | |
| 7319 } | |
| 7320 </style> | |
| 7321 <nav-bar> | |
| 7322 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 7323 <nav-control></nav-control> | |
| 7324 </nav-bar> | |
| 7325 <div class="content-centered"> | |
| 7326 <h1>{{ error.kind }}</h1> | |
| 7327 <br> | |
| 7328 <div class="well">{{ error.message }}</div> | |
| 7329 </div> | |
| 7330 </template> | |
| 7331 </polymer-element> | |
| 7332 | |
| 7333 | |
| 7334 | |
| 7335 | |
| 7336 | |
| 7337 | |
| 7338 | |
| 7339 | |
| 7340 | |
| 7341 | |
| 7342 | |
| 7343 | |
| 7344 | |
| 7345 | |
| 7346 <polymer-element name="field-view" extends="observatory-element"> | |
| 7347 <template> | |
| 7348 <style>/* Global styles */ | |
| 7349 * { | |
| 7350 margin: 0; | |
| 7351 padding: 0; | |
| 7352 font: 400 14px 'Montserrat', sans-serif; | |
| 7353 color: #333; | |
| 7354 box-sizing: border-box; | |
| 7355 } | |
| 7356 | |
| 7357 .content { | |
| 7358 padding-left: 10%; | |
| 7359 font: 400 14px 'Montserrat', sans-serif; | |
| 7360 } | |
| 7361 | |
| 7362 .content-centered { | |
| 7363 padding-left: 10%; | |
| 7364 padding-right: 10%; | |
| 7365 font: 400 14px 'Montserrat', sans-serif; | |
| 7366 } | |
| 7367 | |
| 7368 .content-centered-big { | |
| 7369 padding-left: 5%; | |
| 7370 padding-right: 5%; | |
| 7371 font: 400 14px 'Montserrat', sans-serif; | |
| 7372 } | |
| 7373 | |
| 7374 h1 { | |
| 7375 font: 400 18px 'Montserrat', sans-serif; | |
| 7376 } | |
| 7377 | |
| 7378 .memberList { | |
| 7379 display: table; | |
| 7380 } | |
| 7381 | |
| 7382 .memberItem { | |
| 7383 display: table-row; | |
| 7384 } | |
| 7385 | |
| 7386 .memberName, .memberValue { | |
| 7387 display: table-cell; | |
| 7388 vertical-align: top; | |
| 7389 padding: 3px 0 3px 1em; | |
| 7390 font: 400 14px 'Montserrat', sans-serif; | |
| 7391 } | |
| 7392 | |
| 7393 .memberSmall { | |
| 7394 display: table-cell; | |
| 7395 vertical-align: top; | |
| 7396 padding: 3px 0 3px 1em; | |
| 7397 font: 400 12px 'Montserrat', sans-serif; | |
| 7398 } | |
| 7399 | |
| 7400 .monospace { | |
| 7401 font-family: consolas, courier, monospace; | |
| 7402 font-size: 1em; | |
| 7403 line-height: 1.2em; | |
| 7404 white-space: nowrap; | |
| 7405 } | |
| 7406 | |
| 7407 a { | |
| 7408 color: #0489c3; | |
| 7409 text-decoration: none; | |
| 7410 } | |
| 7411 | |
| 7412 a:hover { | |
| 7413 text-decoration: underline; | |
| 7414 } | |
| 7415 | |
| 7416 em { | |
| 7417 color: inherit; | |
| 7418 font-style: italic; | |
| 7419 } | |
| 7420 | |
| 7421 b { | |
| 7422 color: inherit; | |
| 7423 font-weight: bold; | |
| 7424 } | |
| 7425 | |
| 7426 hr { | |
| 7427 margin-top: 20px; | |
| 7428 margin-bottom: 20px; | |
| 7429 border: 0; | |
| 7430 border-top: 1px solid #eee; | |
| 7431 height: 0; | |
| 7432 box-sizing: content-box; | |
| 7433 } | |
| 7434 | |
| 7435 .list-group { | |
| 7436 padding-left: 0; | |
| 7437 margin-bottom: 20px; | |
| 7438 } | |
| 7439 | |
| 7440 .list-group-item { | |
| 7441 position: relative; | |
| 7442 display: block; | |
| 7443 padding: 10px 15px; | |
| 7444 margin-bottom: -1px; | |
| 7445 background-color: #fff; | |
| 7446 } | |
| 7447 | |
| 7448 .list-group-item:first-child { | |
| 7449 /* rounded top corners */ | |
| 7450 border-top-right-radius:4px; | |
| 7451 border-top-left-radius:4px; | |
| 7452 } | |
| 7453 | |
| 7454 .list-group-item:last-child { | |
| 7455 margin-bottom: 0; | |
| 7456 /* rounded bottom corners */ | |
| 7457 border-bottom-right-radius: 4px; | |
| 7458 border-bottom-left-radius:4px; | |
| 7459 } | |
| 7460 | |
| 7461 /* Flex row container */ | |
| 7462 .flex-row { | |
| 7463 display: flex; | |
| 7464 flex-direction: row; | |
| 7465 } | |
| 7466 | |
| 7467 /* Flex column container */ | |
| 7468 .flex-column { | |
| 7469 display: flex; | |
| 7470 flex-direction: column; | |
| 7471 } | |
| 7472 | |
| 7473 .flex-item-fit { | |
| 7474 flex-grow: 1; | |
| 7475 flex-shrink: 1; | |
| 7476 flex-basis: auto; | |
| 7477 } | |
| 7478 | |
| 7479 .flex-item-no-shrink { | |
| 7480 flex-grow: 0; | |
| 7481 flex-shrink: 0; | |
| 7482 flex-basis: auto; | |
| 7483 } | |
| 7484 | |
| 7485 .flex-item-fill { | |
| 7486 flex-grow: 0; | |
| 7487 flex-shrink: 1; /* shrink when pressured */ | |
| 7488 flex-basis: 100%; /* try and take 100% */ | |
| 7489 } | |
| 7490 | |
| 7491 .flex-item-fixed-1-12 { | |
| 7492 flex-grow: 0; | |
| 7493 flex-shrink: 0; | |
| 7494 flex-basis: 8.3%; | |
| 7495 } | |
| 7496 | |
| 7497 .flex-item-fixed-2-12 { | |
| 7498 flex-grow: 0; | |
| 7499 flex-shrink: 0; | |
| 7500 flex-basis: 16.6%; | |
| 7501 } | |
| 7502 | |
| 7503 .flex-item-fixed-4-12 { | |
| 7504 flex-grow: 0; | |
| 7505 flex-shrink: 0; | |
| 7506 flex-basis: 33.3333%; | |
| 7507 } | |
| 7508 | |
| 7509 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 7510 flex-grow: 0; | |
| 7511 flex-shrink: 0; | |
| 7512 flex-basis: 50%; | |
| 7513 } | |
| 7514 | |
| 7515 .flex-item-fixed-8-12 { | |
| 7516 flex-grow: 0; | |
| 7517 flex-shrink: 0; | |
| 7518 flex-basis: 66.6666%; | |
| 7519 } | |
| 7520 | |
| 7521 .flex-item-fixed-9-12 { | |
| 7522 flex-grow: 0; | |
| 7523 flex-shrink: 0; | |
| 7524 flex-basis: 75%; | |
| 7525 } | |
| 7526 | |
| 7527 | |
| 7528 .flex-item-fixed-12-12 { | |
| 7529 flex-grow: 0; | |
| 7530 flex-shrink: 0; | |
| 7531 flex-basis: 100%; | |
| 7532 } | |
| 7533 | |
| 7534 .flex-item-10-percent { | |
| 7535 flex-grow: 0; | |
| 7536 flex-shrink: 0; | |
| 7537 flex-basis: 10%; | |
| 7538 } | |
| 7539 | |
| 7540 .flex-item-15-percent { | |
| 7541 flex-grow: 0; | |
| 7542 flex-shrink: 0; | |
| 7543 flex-basis: 15%; | |
| 7544 } | |
| 7545 | |
| 7546 .flex-item-20-percent { | |
| 7547 flex-grow: 0; | |
| 7548 flex-shrink: 0; | |
| 7549 flex-basis: 20%; | |
| 7550 } | |
| 7551 | |
| 7552 .flex-item-30-percent { | |
| 7553 flex-grow: 0; | |
| 7554 flex-shrink: 0; | |
| 7555 flex-basis: 30%; | |
| 7556 } | |
| 7557 | |
| 7558 .flex-item-40-percent { | |
| 7559 flex-grow: 0; | |
| 7560 flex-shrink: 0; | |
| 7561 flex-basis: 40%; | |
| 7562 } | |
| 7563 | |
| 7564 .flex-item-50-percent { | |
| 7565 flex-grow: 0; | |
| 7566 flex-shrink: 0; | |
| 7567 flex-basis: 50%; | |
| 7568 } | |
| 7569 | |
| 7570 .flex-item-60-percent { | |
| 7571 flex-grow: 0; | |
| 7572 flex-shrink: 0; | |
| 7573 flex-basis: 60%; | |
| 7574 } | |
| 7575 | |
| 7576 .flex-item-70-percent { | |
| 7577 flex-grow: 0; | |
| 7578 flex-shrink: 0; | |
| 7579 flex-basis: 70%; | |
| 7580 } | |
| 7581 | |
| 7582 .flex-item-80-percent { | |
| 7583 flex-grow: 0; | |
| 7584 flex-shrink: 0; | |
| 7585 flex-basis: 80%; | |
| 7586 } | |
| 7587 | |
| 7588 .well { | |
| 7589 min-height: 20px; | |
| 7590 padding: 19px; | |
| 7591 margin-bottom: 20px; | |
| 7592 background-color: #f5f5f5; | |
| 7593 border: 1px solid #e3e3e3; | |
| 7594 border-radius: 4px; | |
| 7595 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 7596 } | |
| 7597 | |
| 7598 .break-wrap { | |
| 7599 word-wrap: break-word; | |
| 7600 } | |
| 7601 </style> | |
| 7602 <nav-bar> | |
| 7603 <top-nav-menu></top-nav-menu> | |
| 7604 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu> | |
| 7605 <template if="{{ field.owner.type == 'Class' }}"> | |
| 7606 <!-- TODO(turnidge): Add library nav menu here. --> | |
| 7607 <class-nav-menu cls="{{ field.owner }}"></class-nav-menu> | |
| 7608 </template> | |
| 7609 <template if="{{ field.owner.type == 'Library' }}"> | |
| 7610 <library-nav-menu library="{{ field.owner }}"></library-nav-menu> | |
| 7611 </template> | |
| 7612 <nav-menu link="{{ field.link }}" anchor="{{ field.name }}" last="{{ true
}}"></nav-menu> | |
| 7613 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 7614 <nav-control></nav-control> | |
| 7615 </nav-bar> | |
| 7616 | |
| 7617 <div class="content"> | |
| 7618 <h1> | |
| 7619 <template if="{{ field.isStatic }}">static</template> | |
| 7620 <template if="{{ field.isFinal }}">final</template> | |
| 7621 <template if="{{ field.isConst }}">const</template> | |
| 7622 <template if="{{ (field.declaredType.name == 'dynamic' && | |
| 7623 !field.isFinal && !field.isConst) }}"> | |
| 7624 var | |
| 7625 </template> | |
| 7626 <template if="{{ (field.declaredType.name != 'dynamic') }}"> | |
| 7627 {{ field.declaredType.name }} | |
| 7628 </template> | |
| 7629 {{ field.name }} | |
| 7630 </h1> | |
| 7631 <div class="memberList"> | |
| 7632 <div class="memberItem"> | |
| 7633 <div class="memberName">owner</div> | |
| 7634 <div class="memberValue"> | |
| 7635 <template if="{{ field.owner.type == 'Class' }}"> | |
| 7636 <class-ref ref="{{ field.owner }}"></class-ref> | |
| 7637 </template> | |
| 7638 <template if="{{ field.owner.type != 'Class' }}"> | |
| 7639 <library-ref ref="{{ field.owner }}"></library-ref> | |
| 7640 </template> | |
| 7641 </div> | |
| 7642 </div> | |
| 7643 <div class="memberItem"> | |
| 7644 <div class="memberName">script</div> | |
| 7645 <div class="memberValue"> | |
| 7646 <script-ref ref="{{ field.script }}"></script-ref> | |
| 7647 </div> | |
| 7648 </div> | |
| 7649 <template if="{{ !field.isStatic }}"> | |
| 7650 <div class="memberItem" title="The types observed for this field at ru
ntime. Fields that are observed to have a single type at runtime or to never be
null may allow for additional optimization."> | |
| 7651 <div class="memberName">observed types</div> | |
| 7652 <div class="memberValue"> | |
| 7653 <template if="{{ field.guardClass == 'dynamic' }}"> | |
| 7654 various | |
| 7655 </template> | |
| 7656 <template if="{{ field.guardClass == 'unknown' }}"> | |
| 7657 none | |
| 7658 </template> | |
| 7659 <template if="{{ field.guardClass != 'unknown' && | |
| 7660 field.guardClass != 'dynamic' }}"> | |
| 7661 <class-ref ref="{{ field.guardClass }}"></class-ref> | |
| 7662 <template if="{{ field.guardNullable }}"> | |
| 7663 — null observed | |
| 7664 </template> | |
| 7665 <template if="{{ !field.guardNullable }}"> | |
| 7666 — null not observed | |
| 7667 </template> | |
| 7668 </template> | |
| 7669 </div> | |
| 7670 </div> | |
| 7671 </template> | |
| 7672 <template if="{{ field.value != null }}"> | |
| 7673 <div class="memberItem"> | |
| 7674 <div class="memberName">static value</div> | |
| 7675 <div class="memberValue"> | |
| 7676 <any-service-ref ref="{{ field.value }}"></any-service-ref> | |
| 7677 </div> | |
| 7678 </div> | |
| 7679 </template> | |
| 7680 </div> | |
| 7681 </div> | |
| 7682 </template> | |
| 7683 </polymer-element> | |
| 7684 | |
| 7685 | |
| 7686 | |
| 7687 | |
| 7688 | |
| 7689 | |
| 7690 | |
| 7691 <polymer-element name="flag-list" extends="observatory-element"> | |
| 7692 <template> | |
| 7693 <style>/* Global styles */ | |
| 7694 * { | |
| 7695 margin: 0; | |
| 7696 padding: 0; | |
| 7697 font: 400 14px 'Montserrat', sans-serif; | |
| 7698 color: #333; | |
| 7699 box-sizing: border-box; | |
| 7700 } | |
| 7701 | |
| 7702 .content { | |
| 7703 padding-left: 10%; | |
| 7704 font: 400 14px 'Montserrat', sans-serif; | |
| 7705 } | |
| 7706 | |
| 7707 .content-centered { | |
| 7708 padding-left: 10%; | |
| 7709 padding-right: 10%; | |
| 7710 font: 400 14px 'Montserrat', sans-serif; | |
| 7711 } | |
| 7712 | |
| 7713 .content-centered-big { | |
| 7714 padding-left: 5%; | |
| 7715 padding-right: 5%; | |
| 7716 font: 400 14px 'Montserrat', sans-serif; | |
| 7717 } | |
| 7718 | |
| 7719 h1 { | |
| 7720 font: 400 18px 'Montserrat', sans-serif; | |
| 7721 } | |
| 7722 | |
| 7723 .memberList { | |
| 7724 display: table; | |
| 7725 } | |
| 7726 | |
| 7727 .memberItem { | |
| 7728 display: table-row; | |
| 7729 } | |
| 7730 | |
| 7731 .memberName, .memberValue { | |
| 7732 display: table-cell; | |
| 7733 vertical-align: top; | |
| 7734 padding: 3px 0 3px 1em; | |
| 7735 font: 400 14px 'Montserrat', sans-serif; | |
| 7736 } | |
| 7737 | |
| 7738 .memberSmall { | |
| 7739 display: table-cell; | |
| 7740 vertical-align: top; | |
| 7741 padding: 3px 0 3px 1em; | |
| 7742 font: 400 12px 'Montserrat', sans-serif; | |
| 7743 } | |
| 7744 | |
| 7745 .monospace { | |
| 7746 font-family: consolas, courier, monospace; | |
| 7747 font-size: 1em; | |
| 7748 line-height: 1.2em; | |
| 7749 white-space: nowrap; | |
| 7750 } | |
| 7751 | |
| 7752 a { | |
| 7753 color: #0489c3; | |
| 7754 text-decoration: none; | |
| 7755 } | |
| 7756 | |
| 7757 a:hover { | |
| 7758 text-decoration: underline; | |
| 7759 } | |
| 7760 | |
| 7761 em { | |
| 7762 color: inherit; | |
| 7763 font-style: italic; | |
| 7764 } | |
| 7765 | |
| 7766 b { | |
| 7767 color: inherit; | |
| 7768 font-weight: bold; | |
| 7769 } | |
| 7770 | |
| 7771 hr { | |
| 7772 margin-top: 20px; | |
| 7773 margin-bottom: 20px; | |
| 7774 border: 0; | |
| 7775 border-top: 1px solid #eee; | |
| 7776 height: 0; | |
| 7777 box-sizing: content-box; | |
| 7778 } | |
| 7779 | |
| 7780 .list-group { | |
| 7781 padding-left: 0; | |
| 7782 margin-bottom: 20px; | |
| 7783 } | |
| 7784 | |
| 7785 .list-group-item { | |
| 7786 position: relative; | |
| 7787 display: block; | |
| 7788 padding: 10px 15px; | |
| 7789 margin-bottom: -1px; | |
| 7790 background-color: #fff; | |
| 7791 } | |
| 7792 | |
| 7793 .list-group-item:first-child { | |
| 7794 /* rounded top corners */ | |
| 7795 border-top-right-radius:4px; | |
| 7796 border-top-left-radius:4px; | |
| 7797 } | |
| 7798 | |
| 7799 .list-group-item:last-child { | |
| 7800 margin-bottom: 0; | |
| 7801 /* rounded bottom corners */ | |
| 7802 border-bottom-right-radius: 4px; | |
| 7803 border-bottom-left-radius:4px; | |
| 7804 } | |
| 7805 | |
| 7806 /* Flex row container */ | |
| 7807 .flex-row { | |
| 7808 display: flex; | |
| 7809 flex-direction: row; | |
| 7810 } | |
| 7811 | |
| 7812 /* Flex column container */ | |
| 7813 .flex-column { | |
| 7814 display: flex; | |
| 7815 flex-direction: column; | |
| 7816 } | |
| 7817 | |
| 7818 .flex-item-fit { | |
| 7819 flex-grow: 1; | |
| 7820 flex-shrink: 1; | |
| 7821 flex-basis: auto; | |
| 7822 } | |
| 7823 | |
| 7824 .flex-item-no-shrink { | |
| 7825 flex-grow: 0; | |
| 7826 flex-shrink: 0; | |
| 7827 flex-basis: auto; | |
| 7828 } | |
| 7829 | |
| 7830 .flex-item-fill { | |
| 7831 flex-grow: 0; | |
| 7832 flex-shrink: 1; /* shrink when pressured */ | |
| 7833 flex-basis: 100%; /* try and take 100% */ | |
| 7834 } | |
| 7835 | |
| 7836 .flex-item-fixed-1-12 { | |
| 7837 flex-grow: 0; | |
| 7838 flex-shrink: 0; | |
| 7839 flex-basis: 8.3%; | |
| 7840 } | |
| 7841 | |
| 7842 .flex-item-fixed-2-12 { | |
| 7843 flex-grow: 0; | |
| 7844 flex-shrink: 0; | |
| 7845 flex-basis: 16.6%; | |
| 7846 } | |
| 7847 | |
| 7848 .flex-item-fixed-4-12 { | |
| 7849 flex-grow: 0; | |
| 7850 flex-shrink: 0; | |
| 7851 flex-basis: 33.3333%; | |
| 7852 } | |
| 7853 | |
| 7854 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 7855 flex-grow: 0; | |
| 7856 flex-shrink: 0; | |
| 7857 flex-basis: 50%; | |
| 7858 } | |
| 7859 | |
| 7860 .flex-item-fixed-8-12 { | |
| 7861 flex-grow: 0; | |
| 7862 flex-shrink: 0; | |
| 7863 flex-basis: 66.6666%; | |
| 7864 } | |
| 7865 | |
| 7866 .flex-item-fixed-9-12 { | |
| 7867 flex-grow: 0; | |
| 7868 flex-shrink: 0; | |
| 7869 flex-basis: 75%; | |
| 7870 } | |
| 7871 | |
| 7872 | |
| 7873 .flex-item-fixed-12-12 { | |
| 7874 flex-grow: 0; | |
| 7875 flex-shrink: 0; | |
| 7876 flex-basis: 100%; | |
| 7877 } | |
| 7878 | |
| 7879 .flex-item-10-percent { | |
| 7880 flex-grow: 0; | |
| 7881 flex-shrink: 0; | |
| 7882 flex-basis: 10%; | |
| 7883 } | |
| 7884 | |
| 7885 .flex-item-15-percent { | |
| 7886 flex-grow: 0; | |
| 7887 flex-shrink: 0; | |
| 7888 flex-basis: 15%; | |
| 7889 } | |
| 7890 | |
| 7891 .flex-item-20-percent { | |
| 7892 flex-grow: 0; | |
| 7893 flex-shrink: 0; | |
| 7894 flex-basis: 20%; | |
| 7895 } | |
| 7896 | |
| 7897 .flex-item-30-percent { | |
| 7898 flex-grow: 0; | |
| 7899 flex-shrink: 0; | |
| 7900 flex-basis: 30%; | |
| 7901 } | |
| 7902 | |
| 7903 .flex-item-40-percent { | |
| 7904 flex-grow: 0; | |
| 7905 flex-shrink: 0; | |
| 7906 flex-basis: 40%; | |
| 7907 } | |
| 7908 | |
| 7909 .flex-item-50-percent { | |
| 7910 flex-grow: 0; | |
| 7911 flex-shrink: 0; | |
| 7912 flex-basis: 50%; | |
| 7913 } | |
| 7914 | |
| 7915 .flex-item-60-percent { | |
| 7916 flex-grow: 0; | |
| 7917 flex-shrink: 0; | |
| 7918 flex-basis: 60%; | |
| 7919 } | |
| 7920 | |
| 7921 .flex-item-70-percent { | |
| 7922 flex-grow: 0; | |
| 7923 flex-shrink: 0; | |
| 7924 flex-basis: 70%; | |
| 7925 } | |
| 7926 | |
| 7927 .flex-item-80-percent { | |
| 7928 flex-grow: 0; | |
| 7929 flex-shrink: 0; | |
| 7930 flex-basis: 80%; | |
| 7931 } | |
| 7932 | |
| 7933 .well { | |
| 7934 min-height: 20px; | |
| 7935 padding: 19px; | |
| 7936 margin-bottom: 20px; | |
| 7937 background-color: #f5f5f5; | |
| 7938 border: 1px solid #e3e3e3; | |
| 7939 border-radius: 4px; | |
| 7940 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 7941 } | |
| 7942 | |
| 7943 .break-wrap { | |
| 7944 word-wrap: break-word; | |
| 7945 } | |
| 7946 </style> | |
| 7947 <nav-bar> | |
| 7948 <top-nav-menu></top-nav-menu> | |
| 7949 <nav-menu link="{{ flagList.vm.relativeLink('flags') }}" anchor="flags" la
st="{{ true }}"></nav-menu> | |
| 7950 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 7951 <nav-control></nav-control> | |
| 7952 </nav-bar> | |
| 7953 | |
| 7954 <div class="content-centered"> | |
| 7955 <template if="{{ flagList['modifiedFlags'].isNotEmpty }}"> | |
| 7956 <h1>Modified Flags</h1> | |
| 7957 <br> | |
| 7958 <template repeat="{{ flag in flagList['modifiedFlags'] }}"> | |
| 7959 <flag-item flag="{{ flag }}"></flag-item> | |
| 7960 <br> | |
| 7961 </template> | |
| 7962 <hr> | |
| 7963 </template> | |
| 7964 | |
| 7965 <h1>Unmodified Flags</h1> | |
| 7966 <br> | |
| 7967 <template if="{{ flagList['unmodifiedFlags'].isEmpty }}"> | |
| 7968 <em>None</em> | |
| 7969 </template> | |
| 7970 <template if="{{ flagList['unmodifiedFlags'].isNotEmpty }}"> | |
| 7971 <template repeat="{{ flag in flagList['unmodifiedFlags'] }}"> | |
| 7972 <flag-item flag="{{ flag }}"></flag-item> | |
| 7973 <br> | |
| 7974 </template> | |
| 7975 </template> | |
| 7976 </div> | |
| 7977 | |
| 7978 </template> | |
| 7979 </polymer-element> | |
| 7980 | |
| 7981 <polymer-element name="flag-item" extends="observatory-element"> | |
| 7982 <template> | |
| 7983 <style>/* Global styles */ | |
| 7984 * { | |
| 7985 margin: 0; | |
| 7986 padding: 0; | |
| 7987 font: 400 14px 'Montserrat', sans-serif; | |
| 7988 color: #333; | |
| 7989 box-sizing: border-box; | |
| 7990 } | |
| 7991 | |
| 7992 .content { | |
| 7993 padding-left: 10%; | |
| 7994 font: 400 14px 'Montserrat', sans-serif; | |
| 7995 } | |
| 7996 | |
| 7997 .content-centered { | |
| 7998 padding-left: 10%; | |
| 7999 padding-right: 10%; | |
| 8000 font: 400 14px 'Montserrat', sans-serif; | |
| 8001 } | |
| 8002 | |
| 8003 .content-centered-big { | |
| 8004 padding-left: 5%; | |
| 8005 padding-right: 5%; | |
| 8006 font: 400 14px 'Montserrat', sans-serif; | |
| 8007 } | |
| 8008 | |
| 8009 h1 { | |
| 8010 font: 400 18px 'Montserrat', sans-serif; | |
| 8011 } | |
| 8012 | |
| 8013 .memberList { | |
| 8014 display: table; | |
| 8015 } | |
| 8016 | |
| 8017 .memberItem { | |
| 8018 display: table-row; | |
| 8019 } | |
| 8020 | |
| 8021 .memberName, .memberValue { | |
| 8022 display: table-cell; | |
| 8023 vertical-align: top; | |
| 8024 padding: 3px 0 3px 1em; | |
| 8025 font: 400 14px 'Montserrat', sans-serif; | |
| 8026 } | |
| 8027 | |
| 8028 .memberSmall { | |
| 8029 display: table-cell; | |
| 8030 vertical-align: top; | |
| 8031 padding: 3px 0 3px 1em; | |
| 8032 font: 400 12px 'Montserrat', sans-serif; | |
| 8033 } | |
| 8034 | |
| 8035 .monospace { | |
| 8036 font-family: consolas, courier, monospace; | |
| 8037 font-size: 1em; | |
| 8038 line-height: 1.2em; | |
| 8039 white-space: nowrap; | |
| 8040 } | |
| 8041 | |
| 8042 a { | |
| 8043 color: #0489c3; | |
| 8044 text-decoration: none; | |
| 8045 } | |
| 8046 | |
| 8047 a:hover { | |
| 8048 text-decoration: underline; | |
| 8049 } | |
| 8050 | |
| 8051 em { | |
| 8052 color: inherit; | |
| 8053 font-style: italic; | |
| 8054 } | |
| 8055 | |
| 8056 b { | |
| 8057 color: inherit; | |
| 8058 font-weight: bold; | |
| 8059 } | |
| 8060 | |
| 8061 hr { | |
| 8062 margin-top: 20px; | |
| 8063 margin-bottom: 20px; | |
| 8064 border: 0; | |
| 8065 border-top: 1px solid #eee; | |
| 8066 height: 0; | |
| 8067 box-sizing: content-box; | |
| 8068 } | |
| 8069 | |
| 8070 .list-group { | |
| 8071 padding-left: 0; | |
| 8072 margin-bottom: 20px; | |
| 8073 } | |
| 8074 | |
| 8075 .list-group-item { | |
| 8076 position: relative; | |
| 8077 display: block; | |
| 8078 padding: 10px 15px; | |
| 8079 margin-bottom: -1px; | |
| 8080 background-color: #fff; | |
| 8081 } | |
| 8082 | |
| 8083 .list-group-item:first-child { | |
| 8084 /* rounded top corners */ | |
| 8085 border-top-right-radius:4px; | |
| 8086 border-top-left-radius:4px; | |
| 8087 } | |
| 8088 | |
| 8089 .list-group-item:last-child { | |
| 8090 margin-bottom: 0; | |
| 8091 /* rounded bottom corners */ | |
| 8092 border-bottom-right-radius: 4px; | |
| 8093 border-bottom-left-radius:4px; | |
| 8094 } | |
| 8095 | |
| 8096 /* Flex row container */ | |
| 8097 .flex-row { | |
| 8098 display: flex; | |
| 8099 flex-direction: row; | |
| 8100 } | |
| 8101 | |
| 8102 /* Flex column container */ | |
| 8103 .flex-column { | |
| 8104 display: flex; | |
| 8105 flex-direction: column; | |
| 8106 } | |
| 8107 | |
| 8108 .flex-item-fit { | |
| 8109 flex-grow: 1; | |
| 8110 flex-shrink: 1; | |
| 8111 flex-basis: auto; | |
| 8112 } | |
| 8113 | |
| 8114 .flex-item-no-shrink { | |
| 8115 flex-grow: 0; | |
| 8116 flex-shrink: 0; | |
| 8117 flex-basis: auto; | |
| 8118 } | |
| 8119 | |
| 8120 .flex-item-fill { | |
| 8121 flex-grow: 0; | |
| 8122 flex-shrink: 1; /* shrink when pressured */ | |
| 8123 flex-basis: 100%; /* try and take 100% */ | |
| 8124 } | |
| 8125 | |
| 8126 .flex-item-fixed-1-12 { | |
| 8127 flex-grow: 0; | |
| 8128 flex-shrink: 0; | |
| 8129 flex-basis: 8.3%; | |
| 8130 } | |
| 8131 | |
| 8132 .flex-item-fixed-2-12 { | |
| 8133 flex-grow: 0; | |
| 8134 flex-shrink: 0; | |
| 8135 flex-basis: 16.6%; | |
| 8136 } | |
| 8137 | |
| 8138 .flex-item-fixed-4-12 { | |
| 8139 flex-grow: 0; | |
| 8140 flex-shrink: 0; | |
| 8141 flex-basis: 33.3333%; | |
| 8142 } | |
| 8143 | |
| 8144 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 8145 flex-grow: 0; | |
| 8146 flex-shrink: 0; | |
| 8147 flex-basis: 50%; | |
| 8148 } | |
| 8149 | |
| 8150 .flex-item-fixed-8-12 { | |
| 8151 flex-grow: 0; | |
| 8152 flex-shrink: 0; | |
| 8153 flex-basis: 66.6666%; | |
| 8154 } | |
| 8155 | |
| 8156 .flex-item-fixed-9-12 { | |
| 8157 flex-grow: 0; | |
| 8158 flex-shrink: 0; | |
| 8159 flex-basis: 75%; | |
| 8160 } | |
| 8161 | |
| 8162 | |
| 8163 .flex-item-fixed-12-12 { | |
| 8164 flex-grow: 0; | |
| 8165 flex-shrink: 0; | |
| 8166 flex-basis: 100%; | |
| 8167 } | |
| 8168 | |
| 8169 .flex-item-10-percent { | |
| 8170 flex-grow: 0; | |
| 8171 flex-shrink: 0; | |
| 8172 flex-basis: 10%; | |
| 8173 } | |
| 8174 | |
| 8175 .flex-item-15-percent { | |
| 8176 flex-grow: 0; | |
| 8177 flex-shrink: 0; | |
| 8178 flex-basis: 15%; | |
| 8179 } | |
| 8180 | |
| 8181 .flex-item-20-percent { | |
| 8182 flex-grow: 0; | |
| 8183 flex-shrink: 0; | |
| 8184 flex-basis: 20%; | |
| 8185 } | |
| 8186 | |
| 8187 .flex-item-30-percent { | |
| 8188 flex-grow: 0; | |
| 8189 flex-shrink: 0; | |
| 8190 flex-basis: 30%; | |
| 8191 } | |
| 8192 | |
| 8193 .flex-item-40-percent { | |
| 8194 flex-grow: 0; | |
| 8195 flex-shrink: 0; | |
| 8196 flex-basis: 40%; | |
| 8197 } | |
| 8198 | |
| 8199 .flex-item-50-percent { | |
| 8200 flex-grow: 0; | |
| 8201 flex-shrink: 0; | |
| 8202 flex-basis: 50%; | |
| 8203 } | |
| 8204 | |
| 8205 .flex-item-60-percent { | |
| 8206 flex-grow: 0; | |
| 8207 flex-shrink: 0; | |
| 8208 flex-basis: 60%; | |
| 8209 } | |
| 8210 | |
| 8211 .flex-item-70-percent { | |
| 8212 flex-grow: 0; | |
| 8213 flex-shrink: 0; | |
| 8214 flex-basis: 70%; | |
| 8215 } | |
| 8216 | |
| 8217 .flex-item-80-percent { | |
| 8218 flex-grow: 0; | |
| 8219 flex-shrink: 0; | |
| 8220 flex-basis: 80%; | |
| 8221 } | |
| 8222 | |
| 8223 .well { | |
| 8224 min-height: 20px; | |
| 8225 padding: 19px; | |
| 8226 margin-bottom: 20px; | |
| 8227 background-color: #f5f5f5; | |
| 8228 border: 1px solid #e3e3e3; | |
| 8229 border-radius: 4px; | |
| 8230 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 8231 } | |
| 8232 | |
| 8233 .break-wrap { | |
| 8234 word-wrap: break-word; | |
| 8235 } | |
| 8236 </style> | |
| 8237 <span style="color:#aaa">// {{ flag['comment'] }}</span> | |
| 8238 <div style="padding: 3px 0"> | |
| 8239 <b>{{ flag['name'] }}</b> | |
| 8240 = | |
| 8241 {{ flag['valueAsString'] }} | |
| 8242 </div> | |
| 8243 </template> | |
| 8244 </polymer-element> | |
| 8245 | |
| 8246 | |
| 8247 | |
| 8248 | |
| 8249 | |
| 8250 | |
| 8251 | |
| 8252 | |
| 8253 | |
| 8254 | |
| 8255 | |
| 8256 | |
| 8257 | |
| 8258 | |
| 8259 <polymer-element name="function-view" extends="observatory-element"> | |
| 8260 <template> | |
| 8261 <style>/* Global styles */ | |
| 8262 * { | |
| 8263 margin: 0; | |
| 8264 padding: 0; | |
| 8265 font: 400 14px 'Montserrat', sans-serif; | |
| 8266 color: #333; | |
| 8267 box-sizing: border-box; | |
| 8268 } | |
| 8269 | |
| 8270 .content { | |
| 8271 padding-left: 10%; | |
| 8272 font: 400 14px 'Montserrat', sans-serif; | |
| 8273 } | |
| 8274 | |
| 8275 .content-centered { | |
| 8276 padding-left: 10%; | |
| 8277 padding-right: 10%; | |
| 8278 font: 400 14px 'Montserrat', sans-serif; | |
| 8279 } | |
| 8280 | |
| 8281 .content-centered-big { | |
| 8282 padding-left: 5%; | |
| 8283 padding-right: 5%; | |
| 8284 font: 400 14px 'Montserrat', sans-serif; | |
| 8285 } | |
| 8286 | |
| 8287 h1 { | |
| 8288 font: 400 18px 'Montserrat', sans-serif; | |
| 8289 } | |
| 8290 | |
| 8291 .memberList { | |
| 8292 display: table; | |
| 8293 } | |
| 8294 | |
| 8295 .memberItem { | |
| 8296 display: table-row; | |
| 8297 } | |
| 8298 | |
| 8299 .memberName, .memberValue { | |
| 8300 display: table-cell; | |
| 8301 vertical-align: top; | |
| 8302 padding: 3px 0 3px 1em; | |
| 8303 font: 400 14px 'Montserrat', sans-serif; | |
| 8304 } | |
| 8305 | |
| 8306 .memberSmall { | |
| 8307 display: table-cell; | |
| 8308 vertical-align: top; | |
| 8309 padding: 3px 0 3px 1em; | |
| 8310 font: 400 12px 'Montserrat', sans-serif; | |
| 8311 } | |
| 8312 | |
| 8313 .monospace { | |
| 8314 font-family: consolas, courier, monospace; | |
| 8315 font-size: 1em; | |
| 8316 line-height: 1.2em; | |
| 8317 white-space: nowrap; | |
| 8318 } | |
| 8319 | |
| 8320 a { | |
| 8321 color: #0489c3; | |
| 8322 text-decoration: none; | |
| 8323 } | |
| 8324 | |
| 8325 a:hover { | |
| 8326 text-decoration: underline; | |
| 8327 } | |
| 8328 | |
| 8329 em { | |
| 8330 color: inherit; | |
| 8331 font-style: italic; | |
| 8332 } | |
| 8333 | |
| 8334 b { | |
| 8335 color: inherit; | |
| 8336 font-weight: bold; | |
| 8337 } | |
| 8338 | |
| 8339 hr { | |
| 8340 margin-top: 20px; | |
| 8341 margin-bottom: 20px; | |
| 8342 border: 0; | |
| 8343 border-top: 1px solid #eee; | |
| 8344 height: 0; | |
| 8345 box-sizing: content-box; | |
| 8346 } | |
| 8347 | |
| 8348 .list-group { | |
| 8349 padding-left: 0; | |
| 8350 margin-bottom: 20px; | |
| 8351 } | |
| 8352 | |
| 8353 .list-group-item { | |
| 8354 position: relative; | |
| 8355 display: block; | |
| 8356 padding: 10px 15px; | |
| 8357 margin-bottom: -1px; | |
| 8358 background-color: #fff; | |
| 8359 } | |
| 8360 | |
| 8361 .list-group-item:first-child { | |
| 8362 /* rounded top corners */ | |
| 8363 border-top-right-radius:4px; | |
| 8364 border-top-left-radius:4px; | |
| 8365 } | |
| 8366 | |
| 8367 .list-group-item:last-child { | |
| 8368 margin-bottom: 0; | |
| 8369 /* rounded bottom corners */ | |
| 8370 border-bottom-right-radius: 4px; | |
| 8371 border-bottom-left-radius:4px; | |
| 8372 } | |
| 8373 | |
| 8374 /* Flex row container */ | |
| 8375 .flex-row { | |
| 8376 display: flex; | |
| 8377 flex-direction: row; | |
| 8378 } | |
| 8379 | |
| 8380 /* Flex column container */ | |
| 8381 .flex-column { | |
| 8382 display: flex; | |
| 8383 flex-direction: column; | |
| 8384 } | |
| 8385 | |
| 8386 .flex-item-fit { | |
| 8387 flex-grow: 1; | |
| 8388 flex-shrink: 1; | |
| 8389 flex-basis: auto; | |
| 8390 } | |
| 8391 | |
| 8392 .flex-item-no-shrink { | |
| 8393 flex-grow: 0; | |
| 8394 flex-shrink: 0; | |
| 8395 flex-basis: auto; | |
| 8396 } | |
| 8397 | |
| 8398 .flex-item-fill { | |
| 8399 flex-grow: 0; | |
| 8400 flex-shrink: 1; /* shrink when pressured */ | |
| 8401 flex-basis: 100%; /* try and take 100% */ | |
| 8402 } | |
| 8403 | |
| 8404 .flex-item-fixed-1-12 { | |
| 8405 flex-grow: 0; | |
| 8406 flex-shrink: 0; | |
| 8407 flex-basis: 8.3%; | |
| 8408 } | |
| 8409 | |
| 8410 .flex-item-fixed-2-12 { | |
| 8411 flex-grow: 0; | |
| 8412 flex-shrink: 0; | |
| 8413 flex-basis: 16.6%; | |
| 8414 } | |
| 8415 | |
| 8416 .flex-item-fixed-4-12 { | |
| 8417 flex-grow: 0; | |
| 8418 flex-shrink: 0; | |
| 8419 flex-basis: 33.3333%; | |
| 8420 } | |
| 8421 | |
| 8422 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 8423 flex-grow: 0; | |
| 8424 flex-shrink: 0; | |
| 8425 flex-basis: 50%; | |
| 8426 } | |
| 8427 | |
| 8428 .flex-item-fixed-8-12 { | |
| 8429 flex-grow: 0; | |
| 8430 flex-shrink: 0; | |
| 8431 flex-basis: 66.6666%; | |
| 8432 } | |
| 8433 | |
| 8434 .flex-item-fixed-9-12 { | |
| 8435 flex-grow: 0; | |
| 8436 flex-shrink: 0; | |
| 8437 flex-basis: 75%; | |
| 8438 } | |
| 8439 | |
| 8440 | |
| 8441 .flex-item-fixed-12-12 { | |
| 8442 flex-grow: 0; | |
| 8443 flex-shrink: 0; | |
| 8444 flex-basis: 100%; | |
| 8445 } | |
| 8446 | |
| 8447 .flex-item-10-percent { | |
| 8448 flex-grow: 0; | |
| 8449 flex-shrink: 0; | |
| 8450 flex-basis: 10%; | |
| 8451 } | |
| 8452 | |
| 8453 .flex-item-15-percent { | |
| 8454 flex-grow: 0; | |
| 8455 flex-shrink: 0; | |
| 8456 flex-basis: 15%; | |
| 8457 } | |
| 8458 | |
| 8459 .flex-item-20-percent { | |
| 8460 flex-grow: 0; | |
| 8461 flex-shrink: 0; | |
| 8462 flex-basis: 20%; | |
| 8463 } | |
| 8464 | |
| 8465 .flex-item-30-percent { | |
| 8466 flex-grow: 0; | |
| 8467 flex-shrink: 0; | |
| 8468 flex-basis: 30%; | |
| 8469 } | |
| 8470 | |
| 8471 .flex-item-40-percent { | |
| 8472 flex-grow: 0; | |
| 8473 flex-shrink: 0; | |
| 8474 flex-basis: 40%; | |
| 8475 } | |
| 8476 | |
| 8477 .flex-item-50-percent { | |
| 8478 flex-grow: 0; | |
| 8479 flex-shrink: 0; | |
| 8480 flex-basis: 50%; | |
| 8481 } | |
| 8482 | |
| 8483 .flex-item-60-percent { | |
| 8484 flex-grow: 0; | |
| 8485 flex-shrink: 0; | |
| 8486 flex-basis: 60%; | |
| 8487 } | |
| 8488 | |
| 8489 .flex-item-70-percent { | |
| 8490 flex-grow: 0; | |
| 8491 flex-shrink: 0; | |
| 8492 flex-basis: 70%; | |
| 8493 } | |
| 8494 | |
| 8495 .flex-item-80-percent { | |
| 8496 flex-grow: 0; | |
| 8497 flex-shrink: 0; | |
| 8498 flex-basis: 80%; | |
| 8499 } | |
| 8500 | |
| 8501 .well { | |
| 8502 min-height: 20px; | |
| 8503 padding: 19px; | |
| 8504 margin-bottom: 20px; | |
| 8505 background-color: #f5f5f5; | |
| 8506 border: 1px solid #e3e3e3; | |
| 8507 border-radius: 4px; | |
| 8508 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 8509 } | |
| 8510 | |
| 8511 .break-wrap { | |
| 8512 word-wrap: break-word; | |
| 8513 } | |
| 8514 </style> | |
| 8515 <nav-bar> | |
| 8516 <top-nav-menu></top-nav-menu> | |
| 8517 <isolate-nav-menu isolate="{{ function.isolate }}"></isolate-nav-menu> | |
| 8518 <template if="{{ function.owningClass != null }}"> | |
| 8519 <!-- TODO(turnidge): Add library nav menu here. --> | |
| 8520 <class-nav-menu cls="{{ function.owningClass }}"></class-nav-menu> | |
| 8521 </template> | |
| 8522 <template if="{{ function.owningLibrary != null }}"> | |
| 8523 <library-nav-menu library="{{ function.owningLibrary }}"></library-nav-m
enu> | |
| 8524 </template> | |
| 8525 <nav-menu link="{{ function.link }}" anchor="{{ function.name }}" last="{{
true }}"></nav-menu> | |
| 8526 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> | |
| 8527 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 8528 <nav-control></nav-control> | |
| 8529 </nav-bar> | |
| 8530 | |
| 8531 <div class="content"> | |
| 8532 <h1>function {{ function.qualifiedName }}</h1> | |
| 8533 | |
| 8534 <div class="memberList"> | |
| 8535 <div class="memberItem"> | |
| 8536 <div class="memberName">kind</div> | |
| 8537 <div class="memberValue"> | |
| 8538 <template if="{{ function.isStatic }}">static</template> | |
| 8539 <template if="{{ function.isConst }}">const</template> | |
| 8540 {{ function.kind.toString() }} | |
| 8541 </div> | |
| 8542 </div> | |
| 8543 <template if="{{ function.parent != null }}"> | |
| 8544 <div class="memberItem"> | |
| 8545 <div class="memberName">parent function</div> | |
| 8546 <div class="memberValue"> | |
| 8547 <function-ref ref="{{ function.parent }}"></function-ref> | |
| 8548 </div> | |
| 8549 </div> | |
| 8550 </template> | |
| 8551 <div class="memberItem"> | |
| 8552 <div class="memberName">owner</div> | |
| 8553 <div class="memberValue"> | |
| 8554 <template if="{{ function.owningClass != null }}"> | |
| 8555 <class-ref ref="{{ function.owningClass }}"></class-ref> | |
| 8556 </template> | |
| 8557 <template if="{{ function.owningLibrary != null }}"> | |
| 8558 <library-ref ref="{{ function.owningLibrary }}"></library-ref> | |
| 8559 </template> | |
| 8560 </div> | |
| 8561 </div> | |
| 8562 <div class="memberItem"> | |
| 8563 <div class="memberName">script</div> | |
| 8564 <div class="memberValue"> | |
| 8565 <script-ref ref="{{ function.script }}" pos="{{ function.tokenPos }}
"> | |
| 8566 </script-ref> | |
| 8567 </div> | |
| 8568 </div> | |
| 8569 | |
| 8570 <div class="memberItem"> </div> | |
| 8571 | |
| 8572 <template if="{{ function.code != null }}"> | |
| 8573 <div class="memberItem"> | |
| 8574 <div class="memberName">optimized code</div> | |
| 8575 <div class="memberValue"> | |
| 8576 <code-ref ref="{{ function.code }}"></code-ref> | |
| 8577 </div> | |
| 8578 </div> | |
| 8579 </template> | |
| 8580 <template if="{{ function.unoptimizedCode != null }}"> | |
| 8581 <div class="memberItem"> | |
| 8582 <div class="memberName">unoptimized code</div> | |
| 8583 <div class="memberValue"> | |
| 8584 <code-ref ref="{{ function.unoptimizedCode }}"></code-ref> | |
| 8585 </div> | |
| 8586 <div class="memberValue"> | |
| 8587 <span title="This count is used to determine when a function wil
l be optimized. It is a combination of call counts and other factors."> | |
| 8588 (usage count: {{ function.usageCounter }}) | |
| 8589 </span> | |
| 8590 </div> | |
| 8591 </div> | |
| 8592 </template> | |
| 8593 <div class="memberItem"> | |
| 8594 <div class="memberName">deoptimizations</div> | |
| 8595 <div class="memberValue">{{ function.deoptimizations }}</div> | |
| 8596 </div> | |
| 8597 <div class="memberItem"> | |
| 8598 <div class="memberName">optimizable</div> | |
| 8599 <div class="memberValue">{{ function.isOptimizable }}</div> | |
| 8600 </div> | |
| 8601 <div class="memberItem"> | |
| 8602 <div class="memberName">inlinable</div> | |
| 8603 <div class="memberValue">{{ function.isInlinable }}</div> | |
| 8604 </div> | |
| 8605 <template if="{{ function.name != function.vmName }}"> | |
| 8606 <div class="memberItem"> | |
| 8607 <div class="memberName">vm name</div> | |
| 8608 <div class="memberValue">{{ function.vmName }}</div> | |
| 8609 </div> | |
| 8610 </template> | |
| 8611 </div> | |
| 8612 </div> | |
| 8613 | |
| 8614 <hr> | |
| 8615 <script-inset script="{{ function.script }}" startpos="{{ function.tokenPos
}}" endpos="{{ function.endTokenPos }}"> | |
| 8616 </script-inset> | |
| 8617 | |
| 8618 <br> | |
| 8619 </template> | |
| 8620 </polymer-element> | |
| 8621 | |
| 8622 | |
| 8623 | |
| 8624 | |
| 8625 | |
| 8626 | |
| 8627 | |
| 8628 | |
| 8629 <polymer-element name="heap-map" extends="observatory-element"> | |
| 8630 <template> | |
| 8631 <style>/* Global styles */ | |
| 8632 * { | |
| 8633 margin: 0; | |
| 8634 padding: 0; | |
| 8635 font: 400 14px 'Montserrat', sans-serif; | |
| 8636 color: #333; | |
| 8637 box-sizing: border-box; | |
| 8638 } | |
| 8639 | |
| 8640 .content { | |
| 8641 padding-left: 10%; | |
| 8642 font: 400 14px 'Montserrat', sans-serif; | |
| 8643 } | |
| 8644 | |
| 8645 .content-centered { | |
| 8646 padding-left: 10%; | |
| 8647 padding-right: 10%; | |
| 8648 font: 400 14px 'Montserrat', sans-serif; | |
| 8649 } | |
| 8650 | |
| 8651 .content-centered-big { | |
| 8652 padding-left: 5%; | |
| 8653 padding-right: 5%; | |
| 8654 font: 400 14px 'Montserrat', sans-serif; | |
| 8655 } | |
| 8656 | |
| 8657 h1 { | |
| 8658 font: 400 18px 'Montserrat', sans-serif; | |
| 8659 } | |
| 8660 | |
| 8661 .memberList { | |
| 8662 display: table; | |
| 8663 } | |
| 8664 | |
| 8665 .memberItem { | |
| 8666 display: table-row; | |
| 8667 } | |
| 8668 | |
| 8669 .memberName, .memberValue { | |
| 8670 display: table-cell; | |
| 8671 vertical-align: top; | |
| 8672 padding: 3px 0 3px 1em; | |
| 8673 font: 400 14px 'Montserrat', sans-serif; | |
| 8674 } | |
| 8675 | |
| 8676 .memberSmall { | |
| 8677 display: table-cell; | |
| 8678 vertical-align: top; | |
| 8679 padding: 3px 0 3px 1em; | |
| 8680 font: 400 12px 'Montserrat', sans-serif; | |
| 8681 } | |
| 8682 | |
| 8683 .monospace { | |
| 8684 font-family: consolas, courier, monospace; | |
| 8685 font-size: 1em; | |
| 8686 line-height: 1.2em; | |
| 8687 white-space: nowrap; | |
| 8688 } | |
| 8689 | |
| 8690 a { | |
| 8691 color: #0489c3; | |
| 8692 text-decoration: none; | |
| 8693 } | |
| 8694 | |
| 8695 a:hover { | |
| 8696 text-decoration: underline; | |
| 8697 } | |
| 8698 | |
| 8699 em { | |
| 8700 color: inherit; | |
| 8701 font-style: italic; | |
| 8702 } | |
| 8703 | |
| 8704 b { | |
| 8705 color: inherit; | |
| 8706 font-weight: bold; | |
| 8707 } | |
| 8708 | |
| 8709 hr { | |
| 8710 margin-top: 20px; | |
| 8711 margin-bottom: 20px; | |
| 8712 border: 0; | |
| 8713 border-top: 1px solid #eee; | |
| 8714 height: 0; | |
| 8715 box-sizing: content-box; | |
| 8716 } | |
| 8717 | |
| 8718 .list-group { | |
| 8719 padding-left: 0; | |
| 8720 margin-bottom: 20px; | |
| 8721 } | |
| 8722 | |
| 8723 .list-group-item { | |
| 8724 position: relative; | |
| 8725 display: block; | |
| 8726 padding: 10px 15px; | |
| 8727 margin-bottom: -1px; | |
| 8728 background-color: #fff; | |
| 8729 } | |
| 8730 | |
| 8731 .list-group-item:first-child { | |
| 8732 /* rounded top corners */ | |
| 8733 border-top-right-radius:4px; | |
| 8734 border-top-left-radius:4px; | |
| 8735 } | |
| 8736 | |
| 8737 .list-group-item:last-child { | |
| 8738 margin-bottom: 0; | |
| 8739 /* rounded bottom corners */ | |
| 8740 border-bottom-right-radius: 4px; | |
| 8741 border-bottom-left-radius:4px; | |
| 8742 } | |
| 8743 | |
| 8744 /* Flex row container */ | |
| 8745 .flex-row { | |
| 8746 display: flex; | |
| 8747 flex-direction: row; | |
| 8748 } | |
| 8749 | |
| 8750 /* Flex column container */ | |
| 8751 .flex-column { | |
| 8752 display: flex; | |
| 8753 flex-direction: column; | |
| 8754 } | |
| 8755 | |
| 8756 .flex-item-fit { | |
| 8757 flex-grow: 1; | |
| 8758 flex-shrink: 1; | |
| 8759 flex-basis: auto; | |
| 8760 } | |
| 8761 | |
| 8762 .flex-item-no-shrink { | |
| 8763 flex-grow: 0; | |
| 8764 flex-shrink: 0; | |
| 8765 flex-basis: auto; | |
| 8766 } | |
| 8767 | |
| 8768 .flex-item-fill { | |
| 8769 flex-grow: 0; | |
| 8770 flex-shrink: 1; /* shrink when pressured */ | |
| 8771 flex-basis: 100%; /* try and take 100% */ | |
| 8772 } | |
| 8773 | |
| 8774 .flex-item-fixed-1-12 { | |
| 8775 flex-grow: 0; | |
| 8776 flex-shrink: 0; | |
| 8777 flex-basis: 8.3%; | |
| 8778 } | |
| 8779 | |
| 8780 .flex-item-fixed-2-12 { | |
| 8781 flex-grow: 0; | |
| 8782 flex-shrink: 0; | |
| 8783 flex-basis: 16.6%; | |
| 8784 } | |
| 8785 | |
| 8786 .flex-item-fixed-4-12 { | |
| 8787 flex-grow: 0; | |
| 8788 flex-shrink: 0; | |
| 8789 flex-basis: 33.3333%; | |
| 8790 } | |
| 8791 | |
| 8792 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 8793 flex-grow: 0; | |
| 8794 flex-shrink: 0; | |
| 8795 flex-basis: 50%; | |
| 8796 } | |
| 8797 | |
| 8798 .flex-item-fixed-8-12 { | |
| 8799 flex-grow: 0; | |
| 8800 flex-shrink: 0; | |
| 8801 flex-basis: 66.6666%; | |
| 8802 } | |
| 8803 | |
| 8804 .flex-item-fixed-9-12 { | |
| 8805 flex-grow: 0; | |
| 8806 flex-shrink: 0; | |
| 8807 flex-basis: 75%; | |
| 8808 } | |
| 8809 | |
| 8810 | |
| 8811 .flex-item-fixed-12-12 { | |
| 8812 flex-grow: 0; | |
| 8813 flex-shrink: 0; | |
| 8814 flex-basis: 100%; | |
| 8815 } | |
| 8816 | |
| 8817 .flex-item-10-percent { | |
| 8818 flex-grow: 0; | |
| 8819 flex-shrink: 0; | |
| 8820 flex-basis: 10%; | |
| 8821 } | |
| 8822 | |
| 8823 .flex-item-15-percent { | |
| 8824 flex-grow: 0; | |
| 8825 flex-shrink: 0; | |
| 8826 flex-basis: 15%; | |
| 8827 } | |
| 8828 | |
| 8829 .flex-item-20-percent { | |
| 8830 flex-grow: 0; | |
| 8831 flex-shrink: 0; | |
| 8832 flex-basis: 20%; | |
| 8833 } | |
| 8834 | |
| 8835 .flex-item-30-percent { | |
| 8836 flex-grow: 0; | |
| 8837 flex-shrink: 0; | |
| 8838 flex-basis: 30%; | |
| 8839 } | |
| 8840 | |
| 8841 .flex-item-40-percent { | |
| 8842 flex-grow: 0; | |
| 8843 flex-shrink: 0; | |
| 8844 flex-basis: 40%; | |
| 8845 } | |
| 8846 | |
| 8847 .flex-item-50-percent { | |
| 8848 flex-grow: 0; | |
| 8849 flex-shrink: 0; | |
| 8850 flex-basis: 50%; | |
| 8851 } | |
| 8852 | |
| 8853 .flex-item-60-percent { | |
| 8854 flex-grow: 0; | |
| 8855 flex-shrink: 0; | |
| 8856 flex-basis: 60%; | |
| 8857 } | |
| 8858 | |
| 8859 .flex-item-70-percent { | |
| 8860 flex-grow: 0; | |
| 8861 flex-shrink: 0; | |
| 8862 flex-basis: 70%; | |
| 8863 } | |
| 8864 | |
| 8865 .flex-item-80-percent { | |
| 8866 flex-grow: 0; | |
| 8867 flex-shrink: 0; | |
| 8868 flex-basis: 80%; | |
| 8869 } | |
| 8870 | |
| 8871 .well { | |
| 8872 min-height: 20px; | |
| 8873 padding: 19px; | |
| 8874 margin-bottom: 20px; | |
| 8875 background-color: #f5f5f5; | |
| 8876 border: 1px solid #e3e3e3; | |
| 8877 border-radius: 4px; | |
| 8878 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 8879 } | |
| 8880 | |
| 8881 .break-wrap { | |
| 8882 word-wrap: break-word; | |
| 8883 } | |
| 8884 </style> | |
| 8885 <style> | |
| 8886 .hover { | |
| 8887 position: fixed; | |
| 8888 z-index: 999; | |
| 8889 height: 16px; | |
| 8890 width: 100%; | |
| 8891 background: #ffffff; | |
| 8892 } | |
| 8893 .spacer { | |
| 8894 height: 16px; | |
| 8895 background-color: red; | |
| 8896 } | |
| 8897 </style> | |
| 8898 <nav-bar pad="{{ false }}"> | |
| 8899 <top-nav-menu></top-nav-menu> | |
| 8900 <isolate-nav-menu isolate="{{ fragmentation.isolate }}"></isolate-nav-menu> | |
| 8901 <nav-menu link="{{ fragmentation.isolate.relativeLink('heapmap') }}" anchor=
"heap map" last="{{ true }}"></nav-menu> | |
| 8902 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 8903 <nav-control></nav-control> | |
| 8904 </nav-bar> | |
| 8905 <div class="hover"> | |
| 8906 <p style="text-align:center">{{ status }}</p> | |
| 8907 </div> | |
| 8908 <div class="spacer"> | |
| 8909 <!-- Make sure no data is covered by hover bar initially --> | |
| 8910 </div> | |
| 8911 <div class="flex-row"> | |
| 8912 <canvas id="fragmentation" width="1px" height="1px"></canvas> | |
| 8913 </div> | |
| 8914 </template> | |
| 8915 </polymer-element> | |
| 8916 | |
| 8917 | |
| 8918 | |
| 8919 | |
| 8920 | |
| 8921 | |
| 8922 | |
| 8923 <polymer-element name="io-view" extends="observatory-element"> | |
| 8924 <template> | |
| 8925 <style>/* Global styles */ | |
| 8926 * { | |
| 8927 margin: 0; | |
| 8928 padding: 0; | |
| 8929 font: 400 14px 'Montserrat', sans-serif; | |
| 8930 color: #333; | |
| 8931 box-sizing: border-box; | |
| 8932 } | |
| 8933 | |
| 8934 .content { | |
| 8935 padding-left: 10%; | |
| 8936 font: 400 14px 'Montserrat', sans-serif; | |
| 8937 } | |
| 8938 | |
| 8939 .content-centered { | |
| 8940 padding-left: 10%; | |
| 8941 padding-right: 10%; | |
| 8942 font: 400 14px 'Montserrat', sans-serif; | |
| 8943 } | |
| 8944 | |
| 8945 .content-centered-big { | |
| 8946 padding-left: 5%; | |
| 8947 padding-right: 5%; | |
| 8948 font: 400 14px 'Montserrat', sans-serif; | |
| 8949 } | |
| 8950 | |
| 8951 h1 { | |
| 8952 font: 400 18px 'Montserrat', sans-serif; | |
| 8953 } | |
| 8954 | |
| 8955 .memberList { | |
| 8956 display: table; | |
| 8957 } | |
| 8958 | |
| 8959 .memberItem { | |
| 8960 display: table-row; | |
| 8961 } | |
| 8962 | |
| 8963 .memberName, .memberValue { | |
| 8964 display: table-cell; | |
| 8965 vertical-align: top; | |
| 8966 padding: 3px 0 3px 1em; | |
| 8967 font: 400 14px 'Montserrat', sans-serif; | |
| 8968 } | |
| 8969 | |
| 8970 .memberSmall { | |
| 8971 display: table-cell; | |
| 8972 vertical-align: top; | |
| 8973 padding: 3px 0 3px 1em; | |
| 8974 font: 400 12px 'Montserrat', sans-serif; | |
| 8975 } | |
| 8976 | |
| 8977 .monospace { | |
| 8978 font-family: consolas, courier, monospace; | |
| 8979 font-size: 1em; | |
| 8980 line-height: 1.2em; | |
| 8981 white-space: nowrap; | |
| 8982 } | |
| 8983 | |
| 8984 a { | |
| 8985 color: #0489c3; | |
| 8986 text-decoration: none; | |
| 8987 } | |
| 8988 | |
| 8989 a:hover { | |
| 8990 text-decoration: underline; | |
| 8991 } | |
| 8992 | |
| 8993 em { | |
| 8994 color: inherit; | |
| 8995 font-style: italic; | |
| 8996 } | |
| 8997 | |
| 8998 b { | |
| 8999 color: inherit; | |
| 9000 font-weight: bold; | |
| 9001 } | |
| 9002 | |
| 9003 hr { | |
| 9004 margin-top: 20px; | |
| 9005 margin-bottom: 20px; | |
| 9006 border: 0; | |
| 9007 border-top: 1px solid #eee; | |
| 9008 height: 0; | |
| 9009 box-sizing: content-box; | |
| 9010 } | |
| 9011 | |
| 9012 .list-group { | |
| 9013 padding-left: 0; | |
| 9014 margin-bottom: 20px; | |
| 9015 } | |
| 9016 | |
| 9017 .list-group-item { | |
| 9018 position: relative; | |
| 9019 display: block; | |
| 9020 padding: 10px 15px; | |
| 9021 margin-bottom: -1px; | |
| 9022 background-color: #fff; | |
| 9023 } | |
| 9024 | |
| 9025 .list-group-item:first-child { | |
| 9026 /* rounded top corners */ | |
| 9027 border-top-right-radius:4px; | |
| 9028 border-top-left-radius:4px; | |
| 9029 } | |
| 9030 | |
| 9031 .list-group-item:last-child { | |
| 9032 margin-bottom: 0; | |
| 9033 /* rounded bottom corners */ | |
| 9034 border-bottom-right-radius: 4px; | |
| 9035 border-bottom-left-radius:4px; | |
| 9036 } | |
| 9037 | |
| 9038 /* Flex row container */ | |
| 9039 .flex-row { | |
| 9040 display: flex; | |
| 9041 flex-direction: row; | |
| 9042 } | |
| 9043 | |
| 9044 /* Flex column container */ | |
| 9045 .flex-column { | |
| 9046 display: flex; | |
| 9047 flex-direction: column; | |
| 9048 } | |
| 9049 | |
| 9050 .flex-item-fit { | |
| 9051 flex-grow: 1; | |
| 9052 flex-shrink: 1; | |
| 9053 flex-basis: auto; | |
| 9054 } | |
| 9055 | |
| 9056 .flex-item-no-shrink { | |
| 9057 flex-grow: 0; | |
| 9058 flex-shrink: 0; | |
| 9059 flex-basis: auto; | |
| 9060 } | |
| 9061 | |
| 9062 .flex-item-fill { | |
| 9063 flex-grow: 0; | |
| 9064 flex-shrink: 1; /* shrink when pressured */ | |
| 9065 flex-basis: 100%; /* try and take 100% */ | |
| 9066 } | |
| 9067 | |
| 9068 .flex-item-fixed-1-12 { | |
| 9069 flex-grow: 0; | |
| 9070 flex-shrink: 0; | |
| 9071 flex-basis: 8.3%; | |
| 9072 } | |
| 9073 | |
| 9074 .flex-item-fixed-2-12 { | |
| 9075 flex-grow: 0; | |
| 9076 flex-shrink: 0; | |
| 9077 flex-basis: 16.6%; | |
| 9078 } | |
| 9079 | |
| 9080 .flex-item-fixed-4-12 { | |
| 9081 flex-grow: 0; | |
| 9082 flex-shrink: 0; | |
| 9083 flex-basis: 33.3333%; | |
| 9084 } | |
| 9085 | |
| 9086 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 9087 flex-grow: 0; | |
| 9088 flex-shrink: 0; | |
| 9089 flex-basis: 50%; | |
| 9090 } | |
| 9091 | |
| 9092 .flex-item-fixed-8-12 { | |
| 9093 flex-grow: 0; | |
| 9094 flex-shrink: 0; | |
| 9095 flex-basis: 66.6666%; | |
| 9096 } | |
| 9097 | |
| 9098 .flex-item-fixed-9-12 { | |
| 9099 flex-grow: 0; | |
| 9100 flex-shrink: 0; | |
| 9101 flex-basis: 75%; | |
| 9102 } | |
| 9103 | |
| 9104 | |
| 9105 .flex-item-fixed-12-12 { | |
| 9106 flex-grow: 0; | |
| 9107 flex-shrink: 0; | |
| 9108 flex-basis: 100%; | |
| 9109 } | |
| 9110 | |
| 9111 .flex-item-10-percent { | |
| 9112 flex-grow: 0; | |
| 9113 flex-shrink: 0; | |
| 9114 flex-basis: 10%; | |
| 9115 } | |
| 9116 | |
| 9117 .flex-item-15-percent { | |
| 9118 flex-grow: 0; | |
| 9119 flex-shrink: 0; | |
| 9120 flex-basis: 15%; | |
| 9121 } | |
| 9122 | |
| 9123 .flex-item-20-percent { | |
| 9124 flex-grow: 0; | |
| 9125 flex-shrink: 0; | |
| 9126 flex-basis: 20%; | |
| 9127 } | |
| 9128 | |
| 9129 .flex-item-30-percent { | |
| 9130 flex-grow: 0; | |
| 9131 flex-shrink: 0; | |
| 9132 flex-basis: 30%; | |
| 9133 } | |
| 9134 | |
| 9135 .flex-item-40-percent { | |
| 9136 flex-grow: 0; | |
| 9137 flex-shrink: 0; | |
| 9138 flex-basis: 40%; | |
| 9139 } | |
| 9140 | |
| 9141 .flex-item-50-percent { | |
| 9142 flex-grow: 0; | |
| 9143 flex-shrink: 0; | |
| 9144 flex-basis: 50%; | |
| 9145 } | |
| 9146 | |
| 9147 .flex-item-60-percent { | |
| 9148 flex-grow: 0; | |
| 9149 flex-shrink: 0; | |
| 9150 flex-basis: 60%; | |
| 9151 } | |
| 9152 | |
| 9153 .flex-item-70-percent { | |
| 9154 flex-grow: 0; | |
| 9155 flex-shrink: 0; | |
| 9156 flex-basis: 70%; | |
| 9157 } | |
| 9158 | |
| 9159 .flex-item-80-percent { | |
| 9160 flex-grow: 0; | |
| 9161 flex-shrink: 0; | |
| 9162 flex-basis: 80%; | |
| 9163 } | |
| 9164 | |
| 9165 .well { | |
| 9166 min-height: 20px; | |
| 9167 padding: 19px; | |
| 9168 margin-bottom: 20px; | |
| 9169 background-color: #f5f5f5; | |
| 9170 border: 1px solid #e3e3e3; | |
| 9171 border-radius: 4px; | |
| 9172 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 9173 } | |
| 9174 | |
| 9175 .break-wrap { | |
| 9176 word-wrap: break-word; | |
| 9177 } | |
| 9178 </style> | |
| 9179 | |
| 9180 <nav-bar> | |
| 9181 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 9182 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 9183 <nav-control></nav-control> | |
| 9184 </nav-bar> | |
| 9185 | |
| 9186 <div class="content"> | |
| 9187 <h1>dart:io</h1> | |
| 9188 | |
| 9189 <br> | |
| 9190 | |
| 9191 <ul class="list-group"> | |
| 9192 <li class="list-group-item"> | |
| 9193 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/http/servers'))}}">HTTP Servers</a> | |
| 9194 </li> | |
| 9195 </ul> | |
| 9196 | |
| 9197 <br> | |
| 9198 | |
| 9199 <ul class="list-group"> | |
| 9200 <li class="list-group-item"> | |
| 9201 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/sockets'))}}">Sockets</a> | |
| 9202 </li> | |
| 9203 </ul> | |
| 9204 | |
| 9205 <br> | |
| 9206 | |
| 9207 <ul class="list-group"> | |
| 9208 <li class="list-group-item"> | |
| 9209 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/websockets'))}}">WebSockets</a> | |
| 9210 </li> | |
| 9211 </ul> | |
| 9212 | |
| 9213 <br> | |
| 9214 | |
| 9215 <ul class="list-group"> | |
| 9216 <li class="list-group-item"> | |
| 9217 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/file/randomaccessfiles'))}}">Random Access Files</a> | |
| 9218 </li> | |
| 9219 </ul> | |
| 9220 | |
| 9221 <br> | |
| 9222 | |
| 9223 <ul class="list-group"> | |
| 9224 <li class="list-group-item"> | |
| 9225 <a on-click="{{ goto }}" _href="{{gotoLink(io.isolate.relativeLink('io
/processes'))}}">Processes</a> | |
| 9226 </li> | |
| 9227 </ul> | |
| 9228 | |
| 9229 </div> | |
| 9230 <br> | |
| 9231 <hr> | |
| 9232 </template> | |
| 9233 </polymer-element> | |
| 9234 | |
| 9235 <polymer-element name="io-ref" extends="service-ref"> | |
| 9236 <template> | |
| 9237 <style>/* Global styles */ | |
| 9238 * { | |
| 9239 margin: 0; | |
| 9240 padding: 0; | |
| 9241 font: 400 14px 'Montserrat', sans-serif; | |
| 9242 color: #333; | |
| 9243 box-sizing: border-box; | |
| 9244 } | |
| 9245 | |
| 9246 .content { | |
| 9247 padding-left: 10%; | |
| 9248 font: 400 14px 'Montserrat', sans-serif; | |
| 9249 } | |
| 9250 | |
| 9251 .content-centered { | |
| 9252 padding-left: 10%; | |
| 9253 padding-right: 10%; | |
| 9254 font: 400 14px 'Montserrat', sans-serif; | |
| 9255 } | |
| 9256 | |
| 9257 .content-centered-big { | |
| 9258 padding-left: 5%; | |
| 9259 padding-right: 5%; | |
| 9260 font: 400 14px 'Montserrat', sans-serif; | |
| 9261 } | |
| 9262 | |
| 9263 h1 { | |
| 9264 font: 400 18px 'Montserrat', sans-serif; | |
| 9265 } | |
| 9266 | |
| 9267 .memberList { | |
| 9268 display: table; | |
| 9269 } | |
| 9270 | |
| 9271 .memberItem { | |
| 9272 display: table-row; | |
| 9273 } | |
| 9274 | |
| 9275 .memberName, .memberValue { | |
| 9276 display: table-cell; | |
| 9277 vertical-align: top; | |
| 9278 padding: 3px 0 3px 1em; | |
| 9279 font: 400 14px 'Montserrat', sans-serif; | |
| 9280 } | |
| 9281 | |
| 9282 .memberSmall { | |
| 9283 display: table-cell; | |
| 9284 vertical-align: top; | |
| 9285 padding: 3px 0 3px 1em; | |
| 9286 font: 400 12px 'Montserrat', sans-serif; | |
| 9287 } | |
| 9288 | |
| 9289 .monospace { | |
| 9290 font-family: consolas, courier, monospace; | |
| 9291 font-size: 1em; | |
| 9292 line-height: 1.2em; | |
| 9293 white-space: nowrap; | |
| 9294 } | |
| 9295 | |
| 9296 a { | |
| 9297 color: #0489c3; | |
| 9298 text-decoration: none; | |
| 9299 } | |
| 9300 | |
| 9301 a:hover { | |
| 9302 text-decoration: underline; | |
| 9303 } | |
| 9304 | |
| 9305 em { | |
| 9306 color: inherit; | |
| 9307 font-style: italic; | |
| 9308 } | |
| 9309 | |
| 9310 b { | |
| 9311 color: inherit; | |
| 9312 font-weight: bold; | |
| 9313 } | |
| 9314 | |
| 9315 hr { | |
| 9316 margin-top: 20px; | |
| 9317 margin-bottom: 20px; | |
| 9318 border: 0; | |
| 9319 border-top: 1px solid #eee; | |
| 9320 height: 0; | |
| 9321 box-sizing: content-box; | |
| 9322 } | |
| 9323 | |
| 9324 .list-group { | |
| 9325 padding-left: 0; | |
| 9326 margin-bottom: 20px; | |
| 9327 } | |
| 9328 | |
| 9329 .list-group-item { | |
| 9330 position: relative; | |
| 9331 display: block; | |
| 9332 padding: 10px 15px; | |
| 9333 margin-bottom: -1px; | |
| 9334 background-color: #fff; | |
| 9335 } | |
| 9336 | |
| 9337 .list-group-item:first-child { | |
| 9338 /* rounded top corners */ | |
| 9339 border-top-right-radius:4px; | |
| 9340 border-top-left-radius:4px; | |
| 9341 } | |
| 9342 | |
| 9343 .list-group-item:last-child { | |
| 9344 margin-bottom: 0; | |
| 9345 /* rounded bottom corners */ | |
| 9346 border-bottom-right-radius: 4px; | |
| 9347 border-bottom-left-radius:4px; | |
| 9348 } | |
| 9349 | |
| 9350 /* Flex row container */ | |
| 9351 .flex-row { | |
| 9352 display: flex; | |
| 9353 flex-direction: row; | |
| 9354 } | |
| 9355 | |
| 9356 /* Flex column container */ | |
| 9357 .flex-column { | |
| 9358 display: flex; | |
| 9359 flex-direction: column; | |
| 9360 } | |
| 9361 | |
| 9362 .flex-item-fit { | |
| 9363 flex-grow: 1; | |
| 9364 flex-shrink: 1; | |
| 9365 flex-basis: auto; | |
| 9366 } | |
| 9367 | |
| 9368 .flex-item-no-shrink { | |
| 9369 flex-grow: 0; | |
| 9370 flex-shrink: 0; | |
| 9371 flex-basis: auto; | |
| 9372 } | |
| 9373 | |
| 9374 .flex-item-fill { | |
| 9375 flex-grow: 0; | |
| 9376 flex-shrink: 1; /* shrink when pressured */ | |
| 9377 flex-basis: 100%; /* try and take 100% */ | |
| 9378 } | |
| 9379 | |
| 9380 .flex-item-fixed-1-12 { | |
| 9381 flex-grow: 0; | |
| 9382 flex-shrink: 0; | |
| 9383 flex-basis: 8.3%; | |
| 9384 } | |
| 9385 | |
| 9386 .flex-item-fixed-2-12 { | |
| 9387 flex-grow: 0; | |
| 9388 flex-shrink: 0; | |
| 9389 flex-basis: 16.6%; | |
| 9390 } | |
| 9391 | |
| 9392 .flex-item-fixed-4-12 { | |
| 9393 flex-grow: 0; | |
| 9394 flex-shrink: 0; | |
| 9395 flex-basis: 33.3333%; | |
| 9396 } | |
| 9397 | |
| 9398 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 9399 flex-grow: 0; | |
| 9400 flex-shrink: 0; | |
| 9401 flex-basis: 50%; | |
| 9402 } | |
| 9403 | |
| 9404 .flex-item-fixed-8-12 { | |
| 9405 flex-grow: 0; | |
| 9406 flex-shrink: 0; | |
| 9407 flex-basis: 66.6666%; | |
| 9408 } | |
| 9409 | |
| 9410 .flex-item-fixed-9-12 { | |
| 9411 flex-grow: 0; | |
| 9412 flex-shrink: 0; | |
| 9413 flex-basis: 75%; | |
| 9414 } | |
| 9415 | |
| 9416 | |
| 9417 .flex-item-fixed-12-12 { | |
| 9418 flex-grow: 0; | |
| 9419 flex-shrink: 0; | |
| 9420 flex-basis: 100%; | |
| 9421 } | |
| 9422 | |
| 9423 .flex-item-10-percent { | |
| 9424 flex-grow: 0; | |
| 9425 flex-shrink: 0; | |
| 9426 flex-basis: 10%; | |
| 9427 } | |
| 9428 | |
| 9429 .flex-item-15-percent { | |
| 9430 flex-grow: 0; | |
| 9431 flex-shrink: 0; | |
| 9432 flex-basis: 15%; | |
| 9433 } | |
| 9434 | |
| 9435 .flex-item-20-percent { | |
| 9436 flex-grow: 0; | |
| 9437 flex-shrink: 0; | |
| 9438 flex-basis: 20%; | |
| 9439 } | |
| 9440 | |
| 9441 .flex-item-30-percent { | |
| 9442 flex-grow: 0; | |
| 9443 flex-shrink: 0; | |
| 9444 flex-basis: 30%; | |
| 9445 } | |
| 9446 | |
| 9447 .flex-item-40-percent { | |
| 9448 flex-grow: 0; | |
| 9449 flex-shrink: 0; | |
| 9450 flex-basis: 40%; | |
| 9451 } | |
| 9452 | |
| 9453 .flex-item-50-percent { | |
| 9454 flex-grow: 0; | |
| 9455 flex-shrink: 0; | |
| 9456 flex-basis: 50%; | |
| 9457 } | |
| 9458 | |
| 9459 .flex-item-60-percent { | |
| 9460 flex-grow: 0; | |
| 9461 flex-shrink: 0; | |
| 9462 flex-basis: 60%; | |
| 9463 } | |
| 9464 | |
| 9465 .flex-item-70-percent { | |
| 9466 flex-grow: 0; | |
| 9467 flex-shrink: 0; | |
| 9468 flex-basis: 70%; | |
| 9469 } | |
| 9470 | |
| 9471 .flex-item-80-percent { | |
| 9472 flex-grow: 0; | |
| 9473 flex-shrink: 0; | |
| 9474 flex-basis: 80%; | |
| 9475 } | |
| 9476 | |
| 9477 .well { | |
| 9478 min-height: 20px; | |
| 9479 padding: 19px; | |
| 9480 margin-bottom: 20px; | |
| 9481 background-color: #f5f5f5; | |
| 9482 border: 1px solid #e3e3e3; | |
| 9483 border-radius: 4px; | |
| 9484 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 9485 } | |
| 9486 | |
| 9487 .break-wrap { | |
| 9488 word-wrap: break-word; | |
| 9489 } | |
| 9490 </style> | |
| 9491 <template if="{{ ref.type == 'Socket' }}"> | |
| 9492 <io-socket-ref ref="{{ ref }}"></io-socket-ref> | |
| 9493 </template> | |
| 9494 <template if="{{ ref.type == 'HttpServerConnection' }}"> | |
| 9495 <io-http-server-connection-ref ref="{{ ref }}"></io-http-server-connection
-ref> | |
| 9496 </template> | |
| 9497 <template if="{{ ref.type == 'HttpServer' }}"> | |
| 9498 <io-http-server-ref ref="{{ ref }}"></io-http-server-ref> | |
| 9499 </template> | |
| 9500 <template if="{{ ref.type == 'WebSocket' }}"> | |
| 9501 <io-web-socket-ref ref="{{ ref }}"></io-web-socket-ref> | |
| 9502 </template> | |
| 9503 <template if="{{ ref.type == 'Process' }}"> | |
| 9504 <io-process-ref ref="{{ ref }}"></io-process-ref> | |
| 9505 </template> | |
| 9506 </template> | |
| 9507 </polymer-element> | |
| 9508 | |
| 9509 <polymer-element name="io-http-server-list-view" extends="observatory-element"> | |
| 9510 <template> | |
| 9511 <style>/* Global styles */ | |
| 9512 * { | |
| 9513 margin: 0; | |
| 9514 padding: 0; | |
| 9515 font: 400 14px 'Montserrat', sans-serif; | |
| 9516 color: #333; | |
| 9517 box-sizing: border-box; | |
| 9518 } | |
| 9519 | |
| 9520 .content { | |
| 9521 padding-left: 10%; | |
| 9522 font: 400 14px 'Montserrat', sans-serif; | |
| 9523 } | |
| 9524 | |
| 9525 .content-centered { | |
| 9526 padding-left: 10%; | |
| 9527 padding-right: 10%; | |
| 9528 font: 400 14px 'Montserrat', sans-serif; | |
| 9529 } | |
| 9530 | |
| 9531 .content-centered-big { | |
| 9532 padding-left: 5%; | |
| 9533 padding-right: 5%; | |
| 9534 font: 400 14px 'Montserrat', sans-serif; | |
| 9535 } | |
| 9536 | |
| 9537 h1 { | |
| 9538 font: 400 18px 'Montserrat', sans-serif; | |
| 9539 } | |
| 9540 | |
| 9541 .memberList { | |
| 9542 display: table; | |
| 9543 } | |
| 9544 | |
| 9545 .memberItem { | |
| 9546 display: table-row; | |
| 9547 } | |
| 9548 | |
| 9549 .memberName, .memberValue { | |
| 9550 display: table-cell; | |
| 9551 vertical-align: top; | |
| 9552 padding: 3px 0 3px 1em; | |
| 9553 font: 400 14px 'Montserrat', sans-serif; | |
| 9554 } | |
| 9555 | |
| 9556 .memberSmall { | |
| 9557 display: table-cell; | |
| 9558 vertical-align: top; | |
| 9559 padding: 3px 0 3px 1em; | |
| 9560 font: 400 12px 'Montserrat', sans-serif; | |
| 9561 } | |
| 9562 | |
| 9563 .monospace { | |
| 9564 font-family: consolas, courier, monospace; | |
| 9565 font-size: 1em; | |
| 9566 line-height: 1.2em; | |
| 9567 white-space: nowrap; | |
| 9568 } | |
| 9569 | |
| 9570 a { | |
| 9571 color: #0489c3; | |
| 9572 text-decoration: none; | |
| 9573 } | |
| 9574 | |
| 9575 a:hover { | |
| 9576 text-decoration: underline; | |
| 9577 } | |
| 9578 | |
| 9579 em { | |
| 9580 color: inherit; | |
| 9581 font-style: italic; | |
| 9582 } | |
| 9583 | |
| 9584 b { | |
| 9585 color: inherit; | |
| 9586 font-weight: bold; | |
| 9587 } | |
| 9588 | |
| 9589 hr { | |
| 9590 margin-top: 20px; | |
| 9591 margin-bottom: 20px; | |
| 9592 border: 0; | |
| 9593 border-top: 1px solid #eee; | |
| 9594 height: 0; | |
| 9595 box-sizing: content-box; | |
| 9596 } | |
| 9597 | |
| 9598 .list-group { | |
| 9599 padding-left: 0; | |
| 9600 margin-bottom: 20px; | |
| 9601 } | |
| 9602 | |
| 9603 .list-group-item { | |
| 9604 position: relative; | |
| 9605 display: block; | |
| 9606 padding: 10px 15px; | |
| 9607 margin-bottom: -1px; | |
| 9608 background-color: #fff; | |
| 9609 } | |
| 9610 | |
| 9611 .list-group-item:first-child { | |
| 9612 /* rounded top corners */ | |
| 9613 border-top-right-radius:4px; | |
| 9614 border-top-left-radius:4px; | |
| 9615 } | |
| 9616 | |
| 9617 .list-group-item:last-child { | |
| 9618 margin-bottom: 0; | |
| 9619 /* rounded bottom corners */ | |
| 9620 border-bottom-right-radius: 4px; | |
| 9621 border-bottom-left-radius:4px; | |
| 9622 } | |
| 9623 | |
| 9624 /* Flex row container */ | |
| 9625 .flex-row { | |
| 9626 display: flex; | |
| 9627 flex-direction: row; | |
| 9628 } | |
| 9629 | |
| 9630 /* Flex column container */ | |
| 9631 .flex-column { | |
| 9632 display: flex; | |
| 9633 flex-direction: column; | |
| 9634 } | |
| 9635 | |
| 9636 .flex-item-fit { | |
| 9637 flex-grow: 1; | |
| 9638 flex-shrink: 1; | |
| 9639 flex-basis: auto; | |
| 9640 } | |
| 9641 | |
| 9642 .flex-item-no-shrink { | |
| 9643 flex-grow: 0; | |
| 9644 flex-shrink: 0; | |
| 9645 flex-basis: auto; | |
| 9646 } | |
| 9647 | |
| 9648 .flex-item-fill { | |
| 9649 flex-grow: 0; | |
| 9650 flex-shrink: 1; /* shrink when pressured */ | |
| 9651 flex-basis: 100%; /* try and take 100% */ | |
| 9652 } | |
| 9653 | |
| 9654 .flex-item-fixed-1-12 { | |
| 9655 flex-grow: 0; | |
| 9656 flex-shrink: 0; | |
| 9657 flex-basis: 8.3%; | |
| 9658 } | |
| 9659 | |
| 9660 .flex-item-fixed-2-12 { | |
| 9661 flex-grow: 0; | |
| 9662 flex-shrink: 0; | |
| 9663 flex-basis: 16.6%; | |
| 9664 } | |
| 9665 | |
| 9666 .flex-item-fixed-4-12 { | |
| 9667 flex-grow: 0; | |
| 9668 flex-shrink: 0; | |
| 9669 flex-basis: 33.3333%; | |
| 9670 } | |
| 9671 | |
| 9672 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 9673 flex-grow: 0; | |
| 9674 flex-shrink: 0; | |
| 9675 flex-basis: 50%; | |
| 9676 } | |
| 9677 | |
| 9678 .flex-item-fixed-8-12 { | |
| 9679 flex-grow: 0; | |
| 9680 flex-shrink: 0; | |
| 9681 flex-basis: 66.6666%; | |
| 9682 } | |
| 9683 | |
| 9684 .flex-item-fixed-9-12 { | |
| 9685 flex-grow: 0; | |
| 9686 flex-shrink: 0; | |
| 9687 flex-basis: 75%; | |
| 9688 } | |
| 9689 | |
| 9690 | |
| 9691 .flex-item-fixed-12-12 { | |
| 9692 flex-grow: 0; | |
| 9693 flex-shrink: 0; | |
| 9694 flex-basis: 100%; | |
| 9695 } | |
| 9696 | |
| 9697 .flex-item-10-percent { | |
| 9698 flex-grow: 0; | |
| 9699 flex-shrink: 0; | |
| 9700 flex-basis: 10%; | |
| 9701 } | |
| 9702 | |
| 9703 .flex-item-15-percent { | |
| 9704 flex-grow: 0; | |
| 9705 flex-shrink: 0; | |
| 9706 flex-basis: 15%; | |
| 9707 } | |
| 9708 | |
| 9709 .flex-item-20-percent { | |
| 9710 flex-grow: 0; | |
| 9711 flex-shrink: 0; | |
| 9712 flex-basis: 20%; | |
| 9713 } | |
| 9714 | |
| 9715 .flex-item-30-percent { | |
| 9716 flex-grow: 0; | |
| 9717 flex-shrink: 0; | |
| 9718 flex-basis: 30%; | |
| 9719 } | |
| 9720 | |
| 9721 .flex-item-40-percent { | |
| 9722 flex-grow: 0; | |
| 9723 flex-shrink: 0; | |
| 9724 flex-basis: 40%; | |
| 9725 } | |
| 9726 | |
| 9727 .flex-item-50-percent { | |
| 9728 flex-grow: 0; | |
| 9729 flex-shrink: 0; | |
| 9730 flex-basis: 50%; | |
| 9731 } | |
| 9732 | |
| 9733 .flex-item-60-percent { | |
| 9734 flex-grow: 0; | |
| 9735 flex-shrink: 0; | |
| 9736 flex-basis: 60%; | |
| 9737 } | |
| 9738 | |
| 9739 .flex-item-70-percent { | |
| 9740 flex-grow: 0; | |
| 9741 flex-shrink: 0; | |
| 9742 flex-basis: 70%; | |
| 9743 } | |
| 9744 | |
| 9745 .flex-item-80-percent { | |
| 9746 flex-grow: 0; | |
| 9747 flex-shrink: 0; | |
| 9748 flex-basis: 80%; | |
| 9749 } | |
| 9750 | |
| 9751 .well { | |
| 9752 min-height: 20px; | |
| 9753 padding: 19px; | |
| 9754 margin-bottom: 20px; | |
| 9755 background-color: #f5f5f5; | |
| 9756 border: 1px solid #e3e3e3; | |
| 9757 border-radius: 4px; | |
| 9758 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 9759 } | |
| 9760 | |
| 9761 .break-wrap { | |
| 9762 word-wrap: break-word; | |
| 9763 } | |
| 9764 </style> | |
| 9765 | |
| 9766 <nav-bar> | |
| 9767 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 9768 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 9769 </nav-bar> | |
| 9770 | |
| 9771 <div class="content"> | |
| 9772 <h1>HttpServers</h1> | |
| 9773 | |
| 9774 <br> | |
| 9775 | |
| 9776 <ul class="list-group"> | |
| 9777 <template repeat="{{ httpServer in list['members'] }}"> | |
| 9778 <li class="list-group-item"> | |
| 9779 <io-http-server-ref ref="{{ httpServer }}"></io-http-server-ref> | |
| 9780 </li> | |
| 9781 </template> | |
| 9782 </ul> | |
| 9783 </div> | |
| 9784 <br> | |
| 9785 <hr> | |
| 9786 </template> | |
| 9787 </polymer-element> | |
| 9788 | |
| 9789 <polymer-element name="io-http-server-ref" extends="service-ref"> | |
| 9790 <template> | |
| 9791 <style>/* Global styles */ | |
| 9792 * { | |
| 9793 margin: 0; | |
| 9794 padding: 0; | |
| 9795 font: 400 14px 'Montserrat', sans-serif; | |
| 9796 color: #333; | |
| 9797 box-sizing: border-box; | |
| 9798 } | |
| 9799 | |
| 9800 .content { | |
| 9801 padding-left: 10%; | |
| 9802 font: 400 14px 'Montserrat', sans-serif; | |
| 9803 } | |
| 9804 | |
| 9805 .content-centered { | |
| 9806 padding-left: 10%; | |
| 9807 padding-right: 10%; | |
| 9808 font: 400 14px 'Montserrat', sans-serif; | |
| 9809 } | |
| 9810 | |
| 9811 .content-centered-big { | |
| 9812 padding-left: 5%; | |
| 9813 padding-right: 5%; | |
| 9814 font: 400 14px 'Montserrat', sans-serif; | |
| 9815 } | |
| 9816 | |
| 9817 h1 { | |
| 9818 font: 400 18px 'Montserrat', sans-serif; | |
| 9819 } | |
| 9820 | |
| 9821 .memberList { | |
| 9822 display: table; | |
| 9823 } | |
| 9824 | |
| 9825 .memberItem { | |
| 9826 display: table-row; | |
| 9827 } | |
| 9828 | |
| 9829 .memberName, .memberValue { | |
| 9830 display: table-cell; | |
| 9831 vertical-align: top; | |
| 9832 padding: 3px 0 3px 1em; | |
| 9833 font: 400 14px 'Montserrat', sans-serif; | |
| 9834 } | |
| 9835 | |
| 9836 .memberSmall { | |
| 9837 display: table-cell; | |
| 9838 vertical-align: top; | |
| 9839 padding: 3px 0 3px 1em; | |
| 9840 font: 400 12px 'Montserrat', sans-serif; | |
| 9841 } | |
| 9842 | |
| 9843 .monospace { | |
| 9844 font-family: consolas, courier, monospace; | |
| 9845 font-size: 1em; | |
| 9846 line-height: 1.2em; | |
| 9847 white-space: nowrap; | |
| 9848 } | |
| 9849 | |
| 9850 a { | |
| 9851 color: #0489c3; | |
| 9852 text-decoration: none; | |
| 9853 } | |
| 9854 | |
| 9855 a:hover { | |
| 9856 text-decoration: underline; | |
| 9857 } | |
| 9858 | |
| 9859 em { | |
| 9860 color: inherit; | |
| 9861 font-style: italic; | |
| 9862 } | |
| 9863 | |
| 9864 b { | |
| 9865 color: inherit; | |
| 9866 font-weight: bold; | |
| 9867 } | |
| 9868 | |
| 9869 hr { | |
| 9870 margin-top: 20px; | |
| 9871 margin-bottom: 20px; | |
| 9872 border: 0; | |
| 9873 border-top: 1px solid #eee; | |
| 9874 height: 0; | |
| 9875 box-sizing: content-box; | |
| 9876 } | |
| 9877 | |
| 9878 .list-group { | |
| 9879 padding-left: 0; | |
| 9880 margin-bottom: 20px; | |
| 9881 } | |
| 9882 | |
| 9883 .list-group-item { | |
| 9884 position: relative; | |
| 9885 display: block; | |
| 9886 padding: 10px 15px; | |
| 9887 margin-bottom: -1px; | |
| 9888 background-color: #fff; | |
| 9889 } | |
| 9890 | |
| 9891 .list-group-item:first-child { | |
| 9892 /* rounded top corners */ | |
| 9893 border-top-right-radius:4px; | |
| 9894 border-top-left-radius:4px; | |
| 9895 } | |
| 9896 | |
| 9897 .list-group-item:last-child { | |
| 9898 margin-bottom: 0; | |
| 9899 /* rounded bottom corners */ | |
| 9900 border-bottom-right-radius: 4px; | |
| 9901 border-bottom-left-radius:4px; | |
| 9902 } | |
| 9903 | |
| 9904 /* Flex row container */ | |
| 9905 .flex-row { | |
| 9906 display: flex; | |
| 9907 flex-direction: row; | |
| 9908 } | |
| 9909 | |
| 9910 /* Flex column container */ | |
| 9911 .flex-column { | |
| 9912 display: flex; | |
| 9913 flex-direction: column; | |
| 9914 } | |
| 9915 | |
| 9916 .flex-item-fit { | |
| 9917 flex-grow: 1; | |
| 9918 flex-shrink: 1; | |
| 9919 flex-basis: auto; | |
| 9920 } | |
| 9921 | |
| 9922 .flex-item-no-shrink { | |
| 9923 flex-grow: 0; | |
| 9924 flex-shrink: 0; | |
| 9925 flex-basis: auto; | |
| 9926 } | |
| 9927 | |
| 9928 .flex-item-fill { | |
| 9929 flex-grow: 0; | |
| 9930 flex-shrink: 1; /* shrink when pressured */ | |
| 9931 flex-basis: 100%; /* try and take 100% */ | |
| 9932 } | |
| 9933 | |
| 9934 .flex-item-fixed-1-12 { | |
| 9935 flex-grow: 0; | |
| 9936 flex-shrink: 0; | |
| 9937 flex-basis: 8.3%; | |
| 9938 } | |
| 9939 | |
| 9940 .flex-item-fixed-2-12 { | |
| 9941 flex-grow: 0; | |
| 9942 flex-shrink: 0; | |
| 9943 flex-basis: 16.6%; | |
| 9944 } | |
| 9945 | |
| 9946 .flex-item-fixed-4-12 { | |
| 9947 flex-grow: 0; | |
| 9948 flex-shrink: 0; | |
| 9949 flex-basis: 33.3333%; | |
| 9950 } | |
| 9951 | |
| 9952 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 9953 flex-grow: 0; | |
| 9954 flex-shrink: 0; | |
| 9955 flex-basis: 50%; | |
| 9956 } | |
| 9957 | |
| 9958 .flex-item-fixed-8-12 { | |
| 9959 flex-grow: 0; | |
| 9960 flex-shrink: 0; | |
| 9961 flex-basis: 66.6666%; | |
| 9962 } | |
| 9963 | |
| 9964 .flex-item-fixed-9-12 { | |
| 9965 flex-grow: 0; | |
| 9966 flex-shrink: 0; | |
| 9967 flex-basis: 75%; | |
| 9968 } | |
| 9969 | |
| 9970 | |
| 9971 .flex-item-fixed-12-12 { | |
| 9972 flex-grow: 0; | |
| 9973 flex-shrink: 0; | |
| 9974 flex-basis: 100%; | |
| 9975 } | |
| 9976 | |
| 9977 .flex-item-10-percent { | |
| 9978 flex-grow: 0; | |
| 9979 flex-shrink: 0; | |
| 9980 flex-basis: 10%; | |
| 9981 } | |
| 9982 | |
| 9983 .flex-item-15-percent { | |
| 9984 flex-grow: 0; | |
| 9985 flex-shrink: 0; | |
| 9986 flex-basis: 15%; | |
| 9987 } | |
| 9988 | |
| 9989 .flex-item-20-percent { | |
| 9990 flex-grow: 0; | |
| 9991 flex-shrink: 0; | |
| 9992 flex-basis: 20%; | |
| 9993 } | |
| 9994 | |
| 9995 .flex-item-30-percent { | |
| 9996 flex-grow: 0; | |
| 9997 flex-shrink: 0; | |
| 9998 flex-basis: 30%; | |
| 9999 } | |
| 10000 | |
| 10001 .flex-item-40-percent { | |
| 10002 flex-grow: 0; | |
| 10003 flex-shrink: 0; | |
| 10004 flex-basis: 40%; | |
| 10005 } | |
| 10006 | |
| 10007 .flex-item-50-percent { | |
| 10008 flex-grow: 0; | |
| 10009 flex-shrink: 0; | |
| 10010 flex-basis: 50%; | |
| 10011 } | |
| 10012 | |
| 10013 .flex-item-60-percent { | |
| 10014 flex-grow: 0; | |
| 10015 flex-shrink: 0; | |
| 10016 flex-basis: 60%; | |
| 10017 } | |
| 10018 | |
| 10019 .flex-item-70-percent { | |
| 10020 flex-grow: 0; | |
| 10021 flex-shrink: 0; | |
| 10022 flex-basis: 70%; | |
| 10023 } | |
| 10024 | |
| 10025 .flex-item-80-percent { | |
| 10026 flex-grow: 0; | |
| 10027 flex-shrink: 0; | |
| 10028 flex-basis: 80%; | |
| 10029 } | |
| 10030 | |
| 10031 .well { | |
| 10032 min-height: 20px; | |
| 10033 padding: 19px; | |
| 10034 margin-bottom: 20px; | |
| 10035 background-color: #f5f5f5; | |
| 10036 border: 1px solid #e3e3e3; | |
| 10037 border-radius: 4px; | |
| 10038 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 10039 } | |
| 10040 | |
| 10041 .break-wrap { | |
| 10042 word-wrap: break-word; | |
| 10043 } | |
| 10044 </style> | |
| 10045 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 10046 </template> | |
| 10047 </polymer-element> | |
| 10048 | |
| 10049 <polymer-element name="io-http-server-view" extends="observatory-element"> | |
| 10050 <template> | |
| 10051 <style>/* Global styles */ | |
| 10052 * { | |
| 10053 margin: 0; | |
| 10054 padding: 0; | |
| 10055 font: 400 14px 'Montserrat', sans-serif; | |
| 10056 color: #333; | |
| 10057 box-sizing: border-box; | |
| 10058 } | |
| 10059 | |
| 10060 .content { | |
| 10061 padding-left: 10%; | |
| 10062 font: 400 14px 'Montserrat', sans-serif; | |
| 10063 } | |
| 10064 | |
| 10065 .content-centered { | |
| 10066 padding-left: 10%; | |
| 10067 padding-right: 10%; | |
| 10068 font: 400 14px 'Montserrat', sans-serif; | |
| 10069 } | |
| 10070 | |
| 10071 .content-centered-big { | |
| 10072 padding-left: 5%; | |
| 10073 padding-right: 5%; | |
| 10074 font: 400 14px 'Montserrat', sans-serif; | |
| 10075 } | |
| 10076 | |
| 10077 h1 { | |
| 10078 font: 400 18px 'Montserrat', sans-serif; | |
| 10079 } | |
| 10080 | |
| 10081 .memberList { | |
| 10082 display: table; | |
| 10083 } | |
| 10084 | |
| 10085 .memberItem { | |
| 10086 display: table-row; | |
| 10087 } | |
| 10088 | |
| 10089 .memberName, .memberValue { | |
| 10090 display: table-cell; | |
| 10091 vertical-align: top; | |
| 10092 padding: 3px 0 3px 1em; | |
| 10093 font: 400 14px 'Montserrat', sans-serif; | |
| 10094 } | |
| 10095 | |
| 10096 .memberSmall { | |
| 10097 display: table-cell; | |
| 10098 vertical-align: top; | |
| 10099 padding: 3px 0 3px 1em; | |
| 10100 font: 400 12px 'Montserrat', sans-serif; | |
| 10101 } | |
| 10102 | |
| 10103 .monospace { | |
| 10104 font-family: consolas, courier, monospace; | |
| 10105 font-size: 1em; | |
| 10106 line-height: 1.2em; | |
| 10107 white-space: nowrap; | |
| 10108 } | |
| 10109 | |
| 10110 a { | |
| 10111 color: #0489c3; | |
| 10112 text-decoration: none; | |
| 10113 } | |
| 10114 | |
| 10115 a:hover { | |
| 10116 text-decoration: underline; | |
| 10117 } | |
| 10118 | |
| 10119 em { | |
| 10120 color: inherit; | |
| 10121 font-style: italic; | |
| 10122 } | |
| 10123 | |
| 10124 b { | |
| 10125 color: inherit; | |
| 10126 font-weight: bold; | |
| 10127 } | |
| 10128 | |
| 10129 hr { | |
| 10130 margin-top: 20px; | |
| 10131 margin-bottom: 20px; | |
| 10132 border: 0; | |
| 10133 border-top: 1px solid #eee; | |
| 10134 height: 0; | |
| 10135 box-sizing: content-box; | |
| 10136 } | |
| 10137 | |
| 10138 .list-group { | |
| 10139 padding-left: 0; | |
| 10140 margin-bottom: 20px; | |
| 10141 } | |
| 10142 | |
| 10143 .list-group-item { | |
| 10144 position: relative; | |
| 10145 display: block; | |
| 10146 padding: 10px 15px; | |
| 10147 margin-bottom: -1px; | |
| 10148 background-color: #fff; | |
| 10149 } | |
| 10150 | |
| 10151 .list-group-item:first-child { | |
| 10152 /* rounded top corners */ | |
| 10153 border-top-right-radius:4px; | |
| 10154 border-top-left-radius:4px; | |
| 10155 } | |
| 10156 | |
| 10157 .list-group-item:last-child { | |
| 10158 margin-bottom: 0; | |
| 10159 /* rounded bottom corners */ | |
| 10160 border-bottom-right-radius: 4px; | |
| 10161 border-bottom-left-radius:4px; | |
| 10162 } | |
| 10163 | |
| 10164 /* Flex row container */ | |
| 10165 .flex-row { | |
| 10166 display: flex; | |
| 10167 flex-direction: row; | |
| 10168 } | |
| 10169 | |
| 10170 /* Flex column container */ | |
| 10171 .flex-column { | |
| 10172 display: flex; | |
| 10173 flex-direction: column; | |
| 10174 } | |
| 10175 | |
| 10176 .flex-item-fit { | |
| 10177 flex-grow: 1; | |
| 10178 flex-shrink: 1; | |
| 10179 flex-basis: auto; | |
| 10180 } | |
| 10181 | |
| 10182 .flex-item-no-shrink { | |
| 10183 flex-grow: 0; | |
| 10184 flex-shrink: 0; | |
| 10185 flex-basis: auto; | |
| 10186 } | |
| 10187 | |
| 10188 .flex-item-fill { | |
| 10189 flex-grow: 0; | |
| 10190 flex-shrink: 1; /* shrink when pressured */ | |
| 10191 flex-basis: 100%; /* try and take 100% */ | |
| 10192 } | |
| 10193 | |
| 10194 .flex-item-fixed-1-12 { | |
| 10195 flex-grow: 0; | |
| 10196 flex-shrink: 0; | |
| 10197 flex-basis: 8.3%; | |
| 10198 } | |
| 10199 | |
| 10200 .flex-item-fixed-2-12 { | |
| 10201 flex-grow: 0; | |
| 10202 flex-shrink: 0; | |
| 10203 flex-basis: 16.6%; | |
| 10204 } | |
| 10205 | |
| 10206 .flex-item-fixed-4-12 { | |
| 10207 flex-grow: 0; | |
| 10208 flex-shrink: 0; | |
| 10209 flex-basis: 33.3333%; | |
| 10210 } | |
| 10211 | |
| 10212 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 10213 flex-grow: 0; | |
| 10214 flex-shrink: 0; | |
| 10215 flex-basis: 50%; | |
| 10216 } | |
| 10217 | |
| 10218 .flex-item-fixed-8-12 { | |
| 10219 flex-grow: 0; | |
| 10220 flex-shrink: 0; | |
| 10221 flex-basis: 66.6666%; | |
| 10222 } | |
| 10223 | |
| 10224 .flex-item-fixed-9-12 { | |
| 10225 flex-grow: 0; | |
| 10226 flex-shrink: 0; | |
| 10227 flex-basis: 75%; | |
| 10228 } | |
| 10229 | |
| 10230 | |
| 10231 .flex-item-fixed-12-12 { | |
| 10232 flex-grow: 0; | |
| 10233 flex-shrink: 0; | |
| 10234 flex-basis: 100%; | |
| 10235 } | |
| 10236 | |
| 10237 .flex-item-10-percent { | |
| 10238 flex-grow: 0; | |
| 10239 flex-shrink: 0; | |
| 10240 flex-basis: 10%; | |
| 10241 } | |
| 10242 | |
| 10243 .flex-item-15-percent { | |
| 10244 flex-grow: 0; | |
| 10245 flex-shrink: 0; | |
| 10246 flex-basis: 15%; | |
| 10247 } | |
| 10248 | |
| 10249 .flex-item-20-percent { | |
| 10250 flex-grow: 0; | |
| 10251 flex-shrink: 0; | |
| 10252 flex-basis: 20%; | |
| 10253 } | |
| 10254 | |
| 10255 .flex-item-30-percent { | |
| 10256 flex-grow: 0; | |
| 10257 flex-shrink: 0; | |
| 10258 flex-basis: 30%; | |
| 10259 } | |
| 10260 | |
| 10261 .flex-item-40-percent { | |
| 10262 flex-grow: 0; | |
| 10263 flex-shrink: 0; | |
| 10264 flex-basis: 40%; | |
| 10265 } | |
| 10266 | |
| 10267 .flex-item-50-percent { | |
| 10268 flex-grow: 0; | |
| 10269 flex-shrink: 0; | |
| 10270 flex-basis: 50%; | |
| 10271 } | |
| 10272 | |
| 10273 .flex-item-60-percent { | |
| 10274 flex-grow: 0; | |
| 10275 flex-shrink: 0; | |
| 10276 flex-basis: 60%; | |
| 10277 } | |
| 10278 | |
| 10279 .flex-item-70-percent { | |
| 10280 flex-grow: 0; | |
| 10281 flex-shrink: 0; | |
| 10282 flex-basis: 70%; | |
| 10283 } | |
| 10284 | |
| 10285 .flex-item-80-percent { | |
| 10286 flex-grow: 0; | |
| 10287 flex-shrink: 0; | |
| 10288 flex-basis: 80%; | |
| 10289 } | |
| 10290 | |
| 10291 .well { | |
| 10292 min-height: 20px; | |
| 10293 padding: 19px; | |
| 10294 margin-bottom: 20px; | |
| 10295 background-color: #f5f5f5; | |
| 10296 border: 1px solid #e3e3e3; | |
| 10297 border-radius: 4px; | |
| 10298 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 10299 } | |
| 10300 | |
| 10301 .break-wrap { | |
| 10302 word-wrap: break-word; | |
| 10303 } | |
| 10304 </style> | |
| 10305 | |
| 10306 <nav-bar> | |
| 10307 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 10308 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 10309 </nav-bar> | |
| 10310 | |
| 10311 <div class="content"> | |
| 10312 <h1>HttpServer</h1> | |
| 10313 | |
| 10314 <br> | |
| 10315 | |
| 10316 <div class="memberList"> | |
| 10317 <div class="memberItem"> | |
| 10318 <div class="memberName">Socket</div> | |
| 10319 <div class="memberValue"><io-socket-ref ref="{{ httpServer['socket'] }
}"></io-socket-ref></div> | |
| 10320 </div> | |
| 10321 <div class="memberItem"> | |
| 10322 <div class="memberName">Address</div> | |
| 10323 <div class="memberValue">{{ httpServer['address'] }}</div> | |
| 10324 </div> | |
| 10325 <div class="memberItem"> | |
| 10326 <div class="memberName">Port</div> | |
| 10327 <div class="memberValue">{{ httpServer['port'] }}</div> | |
| 10328 </div> | |
| 10329 <div class="memberItem"> | |
| 10330 <div class="memberName">Active connections</div> | |
| 10331 <ul class="list-group"> | |
| 10332 <template repeat="{{ connection in httpServer['active'] }}"> | |
| 10333 <li class="list-group-item"> | |
| 10334 <io-http-server-connection-ref ref="{{ connection }}"></io-http-
server-connection-ref> | |
| 10335 </li> | |
| 10336 </template> | |
| 10337 </ul> | |
| 10338 </div> | |
| 10339 <div class="memberItem"> | |
| 10340 <div class="memberName">Idle connections</div> | |
| 10341 <ul class="list-group"> | |
| 10342 <template repeat="{{ connection in httpServer['idle'] }}"> | |
| 10343 <li class="list-group-item"> | |
| 10344 <io-http-server-connection-ref ref="{{ connection }}"></io-http-
server-connection-ref> | |
| 10345 </li> | |
| 10346 </template> | |
| 10347 </ul> | |
| 10348 </div> | |
| 10349 </div> | |
| 10350 </div> | |
| 10351 <br> | |
| 10352 <hr> | |
| 10353 </template> | |
| 10354 </polymer-element> | |
| 10355 | |
| 10356 <polymer-element name="io-http-server-connection-ref" extends="service-ref"> | |
| 10357 <template> | |
| 10358 <style>/* Global styles */ | |
| 10359 * { | |
| 10360 margin: 0; | |
| 10361 padding: 0; | |
| 10362 font: 400 14px 'Montserrat', sans-serif; | |
| 10363 color: #333; | |
| 10364 box-sizing: border-box; | |
| 10365 } | |
| 10366 | |
| 10367 .content { | |
| 10368 padding-left: 10%; | |
| 10369 font: 400 14px 'Montserrat', sans-serif; | |
| 10370 } | |
| 10371 | |
| 10372 .content-centered { | |
| 10373 padding-left: 10%; | |
| 10374 padding-right: 10%; | |
| 10375 font: 400 14px 'Montserrat', sans-serif; | |
| 10376 } | |
| 10377 | |
| 10378 .content-centered-big { | |
| 10379 padding-left: 5%; | |
| 10380 padding-right: 5%; | |
| 10381 font: 400 14px 'Montserrat', sans-serif; | |
| 10382 } | |
| 10383 | |
| 10384 h1 { | |
| 10385 font: 400 18px 'Montserrat', sans-serif; | |
| 10386 } | |
| 10387 | |
| 10388 .memberList { | |
| 10389 display: table; | |
| 10390 } | |
| 10391 | |
| 10392 .memberItem { | |
| 10393 display: table-row; | |
| 10394 } | |
| 10395 | |
| 10396 .memberName, .memberValue { | |
| 10397 display: table-cell; | |
| 10398 vertical-align: top; | |
| 10399 padding: 3px 0 3px 1em; | |
| 10400 font: 400 14px 'Montserrat', sans-serif; | |
| 10401 } | |
| 10402 | |
| 10403 .memberSmall { | |
| 10404 display: table-cell; | |
| 10405 vertical-align: top; | |
| 10406 padding: 3px 0 3px 1em; | |
| 10407 font: 400 12px 'Montserrat', sans-serif; | |
| 10408 } | |
| 10409 | |
| 10410 .monospace { | |
| 10411 font-family: consolas, courier, monospace; | |
| 10412 font-size: 1em; | |
| 10413 line-height: 1.2em; | |
| 10414 white-space: nowrap; | |
| 10415 } | |
| 10416 | |
| 10417 a { | |
| 10418 color: #0489c3; | |
| 10419 text-decoration: none; | |
| 10420 } | |
| 10421 | |
| 10422 a:hover { | |
| 10423 text-decoration: underline; | |
| 10424 } | |
| 10425 | |
| 10426 em { | |
| 10427 color: inherit; | |
| 10428 font-style: italic; | |
| 10429 } | |
| 10430 | |
| 10431 b { | |
| 10432 color: inherit; | |
| 10433 font-weight: bold; | |
| 10434 } | |
| 10435 | |
| 10436 hr { | |
| 10437 margin-top: 20px; | |
| 10438 margin-bottom: 20px; | |
| 10439 border: 0; | |
| 10440 border-top: 1px solid #eee; | |
| 10441 height: 0; | |
| 10442 box-sizing: content-box; | |
| 10443 } | |
| 10444 | |
| 10445 .list-group { | |
| 10446 padding-left: 0; | |
| 10447 margin-bottom: 20px; | |
| 10448 } | |
| 10449 | |
| 10450 .list-group-item { | |
| 10451 position: relative; | |
| 10452 display: block; | |
| 10453 padding: 10px 15px; | |
| 10454 margin-bottom: -1px; | |
| 10455 background-color: #fff; | |
| 10456 } | |
| 10457 | |
| 10458 .list-group-item:first-child { | |
| 10459 /* rounded top corners */ | |
| 10460 border-top-right-radius:4px; | |
| 10461 border-top-left-radius:4px; | |
| 10462 } | |
| 10463 | |
| 10464 .list-group-item:last-child { | |
| 10465 margin-bottom: 0; | |
| 10466 /* rounded bottom corners */ | |
| 10467 border-bottom-right-radius: 4px; | |
| 10468 border-bottom-left-radius:4px; | |
| 10469 } | |
| 10470 | |
| 10471 /* Flex row container */ | |
| 10472 .flex-row { | |
| 10473 display: flex; | |
| 10474 flex-direction: row; | |
| 10475 } | |
| 10476 | |
| 10477 /* Flex column container */ | |
| 10478 .flex-column { | |
| 10479 display: flex; | |
| 10480 flex-direction: column; | |
| 10481 } | |
| 10482 | |
| 10483 .flex-item-fit { | |
| 10484 flex-grow: 1; | |
| 10485 flex-shrink: 1; | |
| 10486 flex-basis: auto; | |
| 10487 } | |
| 10488 | |
| 10489 .flex-item-no-shrink { | |
| 10490 flex-grow: 0; | |
| 10491 flex-shrink: 0; | |
| 10492 flex-basis: auto; | |
| 10493 } | |
| 10494 | |
| 10495 .flex-item-fill { | |
| 10496 flex-grow: 0; | |
| 10497 flex-shrink: 1; /* shrink when pressured */ | |
| 10498 flex-basis: 100%; /* try and take 100% */ | |
| 10499 } | |
| 10500 | |
| 10501 .flex-item-fixed-1-12 { | |
| 10502 flex-grow: 0; | |
| 10503 flex-shrink: 0; | |
| 10504 flex-basis: 8.3%; | |
| 10505 } | |
| 10506 | |
| 10507 .flex-item-fixed-2-12 { | |
| 10508 flex-grow: 0; | |
| 10509 flex-shrink: 0; | |
| 10510 flex-basis: 16.6%; | |
| 10511 } | |
| 10512 | |
| 10513 .flex-item-fixed-4-12 { | |
| 10514 flex-grow: 0; | |
| 10515 flex-shrink: 0; | |
| 10516 flex-basis: 33.3333%; | |
| 10517 } | |
| 10518 | |
| 10519 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 10520 flex-grow: 0; | |
| 10521 flex-shrink: 0; | |
| 10522 flex-basis: 50%; | |
| 10523 } | |
| 10524 | |
| 10525 .flex-item-fixed-8-12 { | |
| 10526 flex-grow: 0; | |
| 10527 flex-shrink: 0; | |
| 10528 flex-basis: 66.6666%; | |
| 10529 } | |
| 10530 | |
| 10531 .flex-item-fixed-9-12 { | |
| 10532 flex-grow: 0; | |
| 10533 flex-shrink: 0; | |
| 10534 flex-basis: 75%; | |
| 10535 } | |
| 10536 | |
| 10537 | |
| 10538 .flex-item-fixed-12-12 { | |
| 10539 flex-grow: 0; | |
| 10540 flex-shrink: 0; | |
| 10541 flex-basis: 100%; | |
| 10542 } | |
| 10543 | |
| 10544 .flex-item-10-percent { | |
| 10545 flex-grow: 0; | |
| 10546 flex-shrink: 0; | |
| 10547 flex-basis: 10%; | |
| 10548 } | |
| 10549 | |
| 10550 .flex-item-15-percent { | |
| 10551 flex-grow: 0; | |
| 10552 flex-shrink: 0; | |
| 10553 flex-basis: 15%; | |
| 10554 } | |
| 10555 | |
| 10556 .flex-item-20-percent { | |
| 10557 flex-grow: 0; | |
| 10558 flex-shrink: 0; | |
| 10559 flex-basis: 20%; | |
| 10560 } | |
| 10561 | |
| 10562 .flex-item-30-percent { | |
| 10563 flex-grow: 0; | |
| 10564 flex-shrink: 0; | |
| 10565 flex-basis: 30%; | |
| 10566 } | |
| 10567 | |
| 10568 .flex-item-40-percent { | |
| 10569 flex-grow: 0; | |
| 10570 flex-shrink: 0; | |
| 10571 flex-basis: 40%; | |
| 10572 } | |
| 10573 | |
| 10574 .flex-item-50-percent { | |
| 10575 flex-grow: 0; | |
| 10576 flex-shrink: 0; | |
| 10577 flex-basis: 50%; | |
| 10578 } | |
| 10579 | |
| 10580 .flex-item-60-percent { | |
| 10581 flex-grow: 0; | |
| 10582 flex-shrink: 0; | |
| 10583 flex-basis: 60%; | |
| 10584 } | |
| 10585 | |
| 10586 .flex-item-70-percent { | |
| 10587 flex-grow: 0; | |
| 10588 flex-shrink: 0; | |
| 10589 flex-basis: 70%; | |
| 10590 } | |
| 10591 | |
| 10592 .flex-item-80-percent { | |
| 10593 flex-grow: 0; | |
| 10594 flex-shrink: 0; | |
| 10595 flex-basis: 80%; | |
| 10596 } | |
| 10597 | |
| 10598 .well { | |
| 10599 min-height: 20px; | |
| 10600 padding: 19px; | |
| 10601 margin-bottom: 20px; | |
| 10602 background-color: #f5f5f5; | |
| 10603 border: 1px solid #e3e3e3; | |
| 10604 border-radius: 4px; | |
| 10605 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 10606 } | |
| 10607 | |
| 10608 .break-wrap { | |
| 10609 word-wrap: break-word; | |
| 10610 } | |
| 10611 </style> | |
| 10612 <a _href="{{ url }}">{{ name }}</a> | |
| 10613 </template> | |
| 10614 </polymer-element> | |
| 10615 | |
| 10616 <polymer-element name="io-http-server-connection-view" extends="observatory-elem
ent"> | |
| 10617 <template> | |
| 10618 <style>/* Global styles */ | |
| 10619 * { | |
| 10620 margin: 0; | |
| 10621 padding: 0; | |
| 10622 font: 400 14px 'Montserrat', sans-serif; | |
| 10623 color: #333; | |
| 10624 box-sizing: border-box; | |
| 10625 } | |
| 10626 | |
| 10627 .content { | |
| 10628 padding-left: 10%; | |
| 10629 font: 400 14px 'Montserrat', sans-serif; | |
| 10630 } | |
| 10631 | |
| 10632 .content-centered { | |
| 10633 padding-left: 10%; | |
| 10634 padding-right: 10%; | |
| 10635 font: 400 14px 'Montserrat', sans-serif; | |
| 10636 } | |
| 10637 | |
| 10638 .content-centered-big { | |
| 10639 padding-left: 5%; | |
| 10640 padding-right: 5%; | |
| 10641 font: 400 14px 'Montserrat', sans-serif; | |
| 10642 } | |
| 10643 | |
| 10644 h1 { | |
| 10645 font: 400 18px 'Montserrat', sans-serif; | |
| 10646 } | |
| 10647 | |
| 10648 .memberList { | |
| 10649 display: table; | |
| 10650 } | |
| 10651 | |
| 10652 .memberItem { | |
| 10653 display: table-row; | |
| 10654 } | |
| 10655 | |
| 10656 .memberName, .memberValue { | |
| 10657 display: table-cell; | |
| 10658 vertical-align: top; | |
| 10659 padding: 3px 0 3px 1em; | |
| 10660 font: 400 14px 'Montserrat', sans-serif; | |
| 10661 } | |
| 10662 | |
| 10663 .memberSmall { | |
| 10664 display: table-cell; | |
| 10665 vertical-align: top; | |
| 10666 padding: 3px 0 3px 1em; | |
| 10667 font: 400 12px 'Montserrat', sans-serif; | |
| 10668 } | |
| 10669 | |
| 10670 .monospace { | |
| 10671 font-family: consolas, courier, monospace; | |
| 10672 font-size: 1em; | |
| 10673 line-height: 1.2em; | |
| 10674 white-space: nowrap; | |
| 10675 } | |
| 10676 | |
| 10677 a { | |
| 10678 color: #0489c3; | |
| 10679 text-decoration: none; | |
| 10680 } | |
| 10681 | |
| 10682 a:hover { | |
| 10683 text-decoration: underline; | |
| 10684 } | |
| 10685 | |
| 10686 em { | |
| 10687 color: inherit; | |
| 10688 font-style: italic; | |
| 10689 } | |
| 10690 | |
| 10691 b { | |
| 10692 color: inherit; | |
| 10693 font-weight: bold; | |
| 10694 } | |
| 10695 | |
| 10696 hr { | |
| 10697 margin-top: 20px; | |
| 10698 margin-bottom: 20px; | |
| 10699 border: 0; | |
| 10700 border-top: 1px solid #eee; | |
| 10701 height: 0; | |
| 10702 box-sizing: content-box; | |
| 10703 } | |
| 10704 | |
| 10705 .list-group { | |
| 10706 padding-left: 0; | |
| 10707 margin-bottom: 20px; | |
| 10708 } | |
| 10709 | |
| 10710 .list-group-item { | |
| 10711 position: relative; | |
| 10712 display: block; | |
| 10713 padding: 10px 15px; | |
| 10714 margin-bottom: -1px; | |
| 10715 background-color: #fff; | |
| 10716 } | |
| 10717 | |
| 10718 .list-group-item:first-child { | |
| 10719 /* rounded top corners */ | |
| 10720 border-top-right-radius:4px; | |
| 10721 border-top-left-radius:4px; | |
| 10722 } | |
| 10723 | |
| 10724 .list-group-item:last-child { | |
| 10725 margin-bottom: 0; | |
| 10726 /* rounded bottom corners */ | |
| 10727 border-bottom-right-radius: 4px; | |
| 10728 border-bottom-left-radius:4px; | |
| 10729 } | |
| 10730 | |
| 10731 /* Flex row container */ | |
| 10732 .flex-row { | |
| 10733 display: flex; | |
| 10734 flex-direction: row; | |
| 10735 } | |
| 10736 | |
| 10737 /* Flex column container */ | |
| 10738 .flex-column { | |
| 10739 display: flex; | |
| 10740 flex-direction: column; | |
| 10741 } | |
| 10742 | |
| 10743 .flex-item-fit { | |
| 10744 flex-grow: 1; | |
| 10745 flex-shrink: 1; | |
| 10746 flex-basis: auto; | |
| 10747 } | |
| 10748 | |
| 10749 .flex-item-no-shrink { | |
| 10750 flex-grow: 0; | |
| 10751 flex-shrink: 0; | |
| 10752 flex-basis: auto; | |
| 10753 } | |
| 10754 | |
| 10755 .flex-item-fill { | |
| 10756 flex-grow: 0; | |
| 10757 flex-shrink: 1; /* shrink when pressured */ | |
| 10758 flex-basis: 100%; /* try and take 100% */ | |
| 10759 } | |
| 10760 | |
| 10761 .flex-item-fixed-1-12 { | |
| 10762 flex-grow: 0; | |
| 10763 flex-shrink: 0; | |
| 10764 flex-basis: 8.3%; | |
| 10765 } | |
| 10766 | |
| 10767 .flex-item-fixed-2-12 { | |
| 10768 flex-grow: 0; | |
| 10769 flex-shrink: 0; | |
| 10770 flex-basis: 16.6%; | |
| 10771 } | |
| 10772 | |
| 10773 .flex-item-fixed-4-12 { | |
| 10774 flex-grow: 0; | |
| 10775 flex-shrink: 0; | |
| 10776 flex-basis: 33.3333%; | |
| 10777 } | |
| 10778 | |
| 10779 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 10780 flex-grow: 0; | |
| 10781 flex-shrink: 0; | |
| 10782 flex-basis: 50%; | |
| 10783 } | |
| 10784 | |
| 10785 .flex-item-fixed-8-12 { | |
| 10786 flex-grow: 0; | |
| 10787 flex-shrink: 0; | |
| 10788 flex-basis: 66.6666%; | |
| 10789 } | |
| 10790 | |
| 10791 .flex-item-fixed-9-12 { | |
| 10792 flex-grow: 0; | |
| 10793 flex-shrink: 0; | |
| 10794 flex-basis: 75%; | |
| 10795 } | |
| 10796 | |
| 10797 | |
| 10798 .flex-item-fixed-12-12 { | |
| 10799 flex-grow: 0; | |
| 10800 flex-shrink: 0; | |
| 10801 flex-basis: 100%; | |
| 10802 } | |
| 10803 | |
| 10804 .flex-item-10-percent { | |
| 10805 flex-grow: 0; | |
| 10806 flex-shrink: 0; | |
| 10807 flex-basis: 10%; | |
| 10808 } | |
| 10809 | |
| 10810 .flex-item-15-percent { | |
| 10811 flex-grow: 0; | |
| 10812 flex-shrink: 0; | |
| 10813 flex-basis: 15%; | |
| 10814 } | |
| 10815 | |
| 10816 .flex-item-20-percent { | |
| 10817 flex-grow: 0; | |
| 10818 flex-shrink: 0; | |
| 10819 flex-basis: 20%; | |
| 10820 } | |
| 10821 | |
| 10822 .flex-item-30-percent { | |
| 10823 flex-grow: 0; | |
| 10824 flex-shrink: 0; | |
| 10825 flex-basis: 30%; | |
| 10826 } | |
| 10827 | |
| 10828 .flex-item-40-percent { | |
| 10829 flex-grow: 0; | |
| 10830 flex-shrink: 0; | |
| 10831 flex-basis: 40%; | |
| 10832 } | |
| 10833 | |
| 10834 .flex-item-50-percent { | |
| 10835 flex-grow: 0; | |
| 10836 flex-shrink: 0; | |
| 10837 flex-basis: 50%; | |
| 10838 } | |
| 10839 | |
| 10840 .flex-item-60-percent { | |
| 10841 flex-grow: 0; | |
| 10842 flex-shrink: 0; | |
| 10843 flex-basis: 60%; | |
| 10844 } | |
| 10845 | |
| 10846 .flex-item-70-percent { | |
| 10847 flex-grow: 0; | |
| 10848 flex-shrink: 0; | |
| 10849 flex-basis: 70%; | |
| 10850 } | |
| 10851 | |
| 10852 .flex-item-80-percent { | |
| 10853 flex-grow: 0; | |
| 10854 flex-shrink: 0; | |
| 10855 flex-basis: 80%; | |
| 10856 } | |
| 10857 | |
| 10858 .well { | |
| 10859 min-height: 20px; | |
| 10860 padding: 19px; | |
| 10861 margin-bottom: 20px; | |
| 10862 background-color: #f5f5f5; | |
| 10863 border: 1px solid #e3e3e3; | |
| 10864 border-radius: 4px; | |
| 10865 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 10866 } | |
| 10867 | |
| 10868 .break-wrap { | |
| 10869 word-wrap: break-word; | |
| 10870 } | |
| 10871 </style> | |
| 10872 | |
| 10873 <nav-bar> | |
| 10874 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 10875 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 10876 </nav-bar> | |
| 10877 | |
| 10878 <div class="content"> | |
| 10879 <h1>HttpConnection</h1> | |
| 10880 | |
| 10881 <br> | |
| 10882 | |
| 10883 <div class="memberList"> | |
| 10884 <div class="memberItem"> | |
| 10885 <div class="memberName">Socket</div> | |
| 10886 <div class="memberValue"><io-socket-ref ref="{{ connection['socket'] }
}"></io-socket-ref></div> | |
| 10887 </div> | |
| 10888 <div class="memberItem"> | |
| 10889 <div class="memberName">State</div> | |
| 10890 <div class="memberValue">{{ connection['state'] }}</div> | |
| 10891 </div> | |
| 10892 <div class="memberItem"> | |
| 10893 <div class="memberName">Server</div> | |
| 10894 <div class="memberValue"><io-http-server-ref ref="{{ connection['serve
r'] }}"></io-http-server-ref></div> | |
| 10895 </div> | |
| 10896 </div> | |
| 10897 </div> | |
| 10898 <br> | |
| 10899 <hr> | |
| 10900 </template> | |
| 10901 </polymer-element> | |
| 10902 | |
| 10903 <polymer-element name="io-socket-ref" extends="service-ref"> | |
| 10904 <template> | |
| 10905 <style>/* Global styles */ | |
| 10906 * { | |
| 10907 margin: 0; | |
| 10908 padding: 0; | |
| 10909 font: 400 14px 'Montserrat', sans-serif; | |
| 10910 color: #333; | |
| 10911 box-sizing: border-box; | |
| 10912 } | |
| 10913 | |
| 10914 .content { | |
| 10915 padding-left: 10%; | |
| 10916 font: 400 14px 'Montserrat', sans-serif; | |
| 10917 } | |
| 10918 | |
| 10919 .content-centered { | |
| 10920 padding-left: 10%; | |
| 10921 padding-right: 10%; | |
| 10922 font: 400 14px 'Montserrat', sans-serif; | |
| 10923 } | |
| 10924 | |
| 10925 .content-centered-big { | |
| 10926 padding-left: 5%; | |
| 10927 padding-right: 5%; | |
| 10928 font: 400 14px 'Montserrat', sans-serif; | |
| 10929 } | |
| 10930 | |
| 10931 h1 { | |
| 10932 font: 400 18px 'Montserrat', sans-serif; | |
| 10933 } | |
| 10934 | |
| 10935 .memberList { | |
| 10936 display: table; | |
| 10937 } | |
| 10938 | |
| 10939 .memberItem { | |
| 10940 display: table-row; | |
| 10941 } | |
| 10942 | |
| 10943 .memberName, .memberValue { | |
| 10944 display: table-cell; | |
| 10945 vertical-align: top; | |
| 10946 padding: 3px 0 3px 1em; | |
| 10947 font: 400 14px 'Montserrat', sans-serif; | |
| 10948 } | |
| 10949 | |
| 10950 .memberSmall { | |
| 10951 display: table-cell; | |
| 10952 vertical-align: top; | |
| 10953 padding: 3px 0 3px 1em; | |
| 10954 font: 400 12px 'Montserrat', sans-serif; | |
| 10955 } | |
| 10956 | |
| 10957 .monospace { | |
| 10958 font-family: consolas, courier, monospace; | |
| 10959 font-size: 1em; | |
| 10960 line-height: 1.2em; | |
| 10961 white-space: nowrap; | |
| 10962 } | |
| 10963 | |
| 10964 a { | |
| 10965 color: #0489c3; | |
| 10966 text-decoration: none; | |
| 10967 } | |
| 10968 | |
| 10969 a:hover { | |
| 10970 text-decoration: underline; | |
| 10971 } | |
| 10972 | |
| 10973 em { | |
| 10974 color: inherit; | |
| 10975 font-style: italic; | |
| 10976 } | |
| 10977 | |
| 10978 b { | |
| 10979 color: inherit; | |
| 10980 font-weight: bold; | |
| 10981 } | |
| 10982 | |
| 10983 hr { | |
| 10984 margin-top: 20px; | |
| 10985 margin-bottom: 20px; | |
| 10986 border: 0; | |
| 10987 border-top: 1px solid #eee; | |
| 10988 height: 0; | |
| 10989 box-sizing: content-box; | |
| 10990 } | |
| 10991 | |
| 10992 .list-group { | |
| 10993 padding-left: 0; | |
| 10994 margin-bottom: 20px; | |
| 10995 } | |
| 10996 | |
| 10997 .list-group-item { | |
| 10998 position: relative; | |
| 10999 display: block; | |
| 11000 padding: 10px 15px; | |
| 11001 margin-bottom: -1px; | |
| 11002 background-color: #fff; | |
| 11003 } | |
| 11004 | |
| 11005 .list-group-item:first-child { | |
| 11006 /* rounded top corners */ | |
| 11007 border-top-right-radius:4px; | |
| 11008 border-top-left-radius:4px; | |
| 11009 } | |
| 11010 | |
| 11011 .list-group-item:last-child { | |
| 11012 margin-bottom: 0; | |
| 11013 /* rounded bottom corners */ | |
| 11014 border-bottom-right-radius: 4px; | |
| 11015 border-bottom-left-radius:4px; | |
| 11016 } | |
| 11017 | |
| 11018 /* Flex row container */ | |
| 11019 .flex-row { | |
| 11020 display: flex; | |
| 11021 flex-direction: row; | |
| 11022 } | |
| 11023 | |
| 11024 /* Flex column container */ | |
| 11025 .flex-column { | |
| 11026 display: flex; | |
| 11027 flex-direction: column; | |
| 11028 } | |
| 11029 | |
| 11030 .flex-item-fit { | |
| 11031 flex-grow: 1; | |
| 11032 flex-shrink: 1; | |
| 11033 flex-basis: auto; | |
| 11034 } | |
| 11035 | |
| 11036 .flex-item-no-shrink { | |
| 11037 flex-grow: 0; | |
| 11038 flex-shrink: 0; | |
| 11039 flex-basis: auto; | |
| 11040 } | |
| 11041 | |
| 11042 .flex-item-fill { | |
| 11043 flex-grow: 0; | |
| 11044 flex-shrink: 1; /* shrink when pressured */ | |
| 11045 flex-basis: 100%; /* try and take 100% */ | |
| 11046 } | |
| 11047 | |
| 11048 .flex-item-fixed-1-12 { | |
| 11049 flex-grow: 0; | |
| 11050 flex-shrink: 0; | |
| 11051 flex-basis: 8.3%; | |
| 11052 } | |
| 11053 | |
| 11054 .flex-item-fixed-2-12 { | |
| 11055 flex-grow: 0; | |
| 11056 flex-shrink: 0; | |
| 11057 flex-basis: 16.6%; | |
| 11058 } | |
| 11059 | |
| 11060 .flex-item-fixed-4-12 { | |
| 11061 flex-grow: 0; | |
| 11062 flex-shrink: 0; | |
| 11063 flex-basis: 33.3333%; | |
| 11064 } | |
| 11065 | |
| 11066 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 11067 flex-grow: 0; | |
| 11068 flex-shrink: 0; | |
| 11069 flex-basis: 50%; | |
| 11070 } | |
| 11071 | |
| 11072 .flex-item-fixed-8-12 { | |
| 11073 flex-grow: 0; | |
| 11074 flex-shrink: 0; | |
| 11075 flex-basis: 66.6666%; | |
| 11076 } | |
| 11077 | |
| 11078 .flex-item-fixed-9-12 { | |
| 11079 flex-grow: 0; | |
| 11080 flex-shrink: 0; | |
| 11081 flex-basis: 75%; | |
| 11082 } | |
| 11083 | |
| 11084 | |
| 11085 .flex-item-fixed-12-12 { | |
| 11086 flex-grow: 0; | |
| 11087 flex-shrink: 0; | |
| 11088 flex-basis: 100%; | |
| 11089 } | |
| 11090 | |
| 11091 .flex-item-10-percent { | |
| 11092 flex-grow: 0; | |
| 11093 flex-shrink: 0; | |
| 11094 flex-basis: 10%; | |
| 11095 } | |
| 11096 | |
| 11097 .flex-item-15-percent { | |
| 11098 flex-grow: 0; | |
| 11099 flex-shrink: 0; | |
| 11100 flex-basis: 15%; | |
| 11101 } | |
| 11102 | |
| 11103 .flex-item-20-percent { | |
| 11104 flex-grow: 0; | |
| 11105 flex-shrink: 0; | |
| 11106 flex-basis: 20%; | |
| 11107 } | |
| 11108 | |
| 11109 .flex-item-30-percent { | |
| 11110 flex-grow: 0; | |
| 11111 flex-shrink: 0; | |
| 11112 flex-basis: 30%; | |
| 11113 } | |
| 11114 | |
| 11115 .flex-item-40-percent { | |
| 11116 flex-grow: 0; | |
| 11117 flex-shrink: 0; | |
| 11118 flex-basis: 40%; | |
| 11119 } | |
| 11120 | |
| 11121 .flex-item-50-percent { | |
| 11122 flex-grow: 0; | |
| 11123 flex-shrink: 0; | |
| 11124 flex-basis: 50%; | |
| 11125 } | |
| 11126 | |
| 11127 .flex-item-60-percent { | |
| 11128 flex-grow: 0; | |
| 11129 flex-shrink: 0; | |
| 11130 flex-basis: 60%; | |
| 11131 } | |
| 11132 | |
| 11133 .flex-item-70-percent { | |
| 11134 flex-grow: 0; | |
| 11135 flex-shrink: 0; | |
| 11136 flex-basis: 70%; | |
| 11137 } | |
| 11138 | |
| 11139 .flex-item-80-percent { | |
| 11140 flex-grow: 0; | |
| 11141 flex-shrink: 0; | |
| 11142 flex-basis: 80%; | |
| 11143 } | |
| 11144 | |
| 11145 .well { | |
| 11146 min-height: 20px; | |
| 11147 padding: 19px; | |
| 11148 margin-bottom: 20px; | |
| 11149 background-color: #f5f5f5; | |
| 11150 border: 1px solid #e3e3e3; | |
| 11151 border-radius: 4px; | |
| 11152 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 11153 } | |
| 11154 | |
| 11155 .break-wrap { | |
| 11156 word-wrap: break-word; | |
| 11157 } | |
| 11158 </style> | |
| 11159 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 11160 </template> | |
| 11161 </polymer-element> | |
| 11162 | |
| 11163 <polymer-element name="io-socket-list-view" extends="observatory-element"> | |
| 11164 <template> | |
| 11165 <style>/* Global styles */ | |
| 11166 * { | |
| 11167 margin: 0; | |
| 11168 padding: 0; | |
| 11169 font: 400 14px 'Montserrat', sans-serif; | |
| 11170 color: #333; | |
| 11171 box-sizing: border-box; | |
| 11172 } | |
| 11173 | |
| 11174 .content { | |
| 11175 padding-left: 10%; | |
| 11176 font: 400 14px 'Montserrat', sans-serif; | |
| 11177 } | |
| 11178 | |
| 11179 .content-centered { | |
| 11180 padding-left: 10%; | |
| 11181 padding-right: 10%; | |
| 11182 font: 400 14px 'Montserrat', sans-serif; | |
| 11183 } | |
| 11184 | |
| 11185 .content-centered-big { | |
| 11186 padding-left: 5%; | |
| 11187 padding-right: 5%; | |
| 11188 font: 400 14px 'Montserrat', sans-serif; | |
| 11189 } | |
| 11190 | |
| 11191 h1 { | |
| 11192 font: 400 18px 'Montserrat', sans-serif; | |
| 11193 } | |
| 11194 | |
| 11195 .memberList { | |
| 11196 display: table; | |
| 11197 } | |
| 11198 | |
| 11199 .memberItem { | |
| 11200 display: table-row; | |
| 11201 } | |
| 11202 | |
| 11203 .memberName, .memberValue { | |
| 11204 display: table-cell; | |
| 11205 vertical-align: top; | |
| 11206 padding: 3px 0 3px 1em; | |
| 11207 font: 400 14px 'Montserrat', sans-serif; | |
| 11208 } | |
| 11209 | |
| 11210 .memberSmall { | |
| 11211 display: table-cell; | |
| 11212 vertical-align: top; | |
| 11213 padding: 3px 0 3px 1em; | |
| 11214 font: 400 12px 'Montserrat', sans-serif; | |
| 11215 } | |
| 11216 | |
| 11217 .monospace { | |
| 11218 font-family: consolas, courier, monospace; | |
| 11219 font-size: 1em; | |
| 11220 line-height: 1.2em; | |
| 11221 white-space: nowrap; | |
| 11222 } | |
| 11223 | |
| 11224 a { | |
| 11225 color: #0489c3; | |
| 11226 text-decoration: none; | |
| 11227 } | |
| 11228 | |
| 11229 a:hover { | |
| 11230 text-decoration: underline; | |
| 11231 } | |
| 11232 | |
| 11233 em { | |
| 11234 color: inherit; | |
| 11235 font-style: italic; | |
| 11236 } | |
| 11237 | |
| 11238 b { | |
| 11239 color: inherit; | |
| 11240 font-weight: bold; | |
| 11241 } | |
| 11242 | |
| 11243 hr { | |
| 11244 margin-top: 20px; | |
| 11245 margin-bottom: 20px; | |
| 11246 border: 0; | |
| 11247 border-top: 1px solid #eee; | |
| 11248 height: 0; | |
| 11249 box-sizing: content-box; | |
| 11250 } | |
| 11251 | |
| 11252 .list-group { | |
| 11253 padding-left: 0; | |
| 11254 margin-bottom: 20px; | |
| 11255 } | |
| 11256 | |
| 11257 .list-group-item { | |
| 11258 position: relative; | |
| 11259 display: block; | |
| 11260 padding: 10px 15px; | |
| 11261 margin-bottom: -1px; | |
| 11262 background-color: #fff; | |
| 11263 } | |
| 11264 | |
| 11265 .list-group-item:first-child { | |
| 11266 /* rounded top corners */ | |
| 11267 border-top-right-radius:4px; | |
| 11268 border-top-left-radius:4px; | |
| 11269 } | |
| 11270 | |
| 11271 .list-group-item:last-child { | |
| 11272 margin-bottom: 0; | |
| 11273 /* rounded bottom corners */ | |
| 11274 border-bottom-right-radius: 4px; | |
| 11275 border-bottom-left-radius:4px; | |
| 11276 } | |
| 11277 | |
| 11278 /* Flex row container */ | |
| 11279 .flex-row { | |
| 11280 display: flex; | |
| 11281 flex-direction: row; | |
| 11282 } | |
| 11283 | |
| 11284 /* Flex column container */ | |
| 11285 .flex-column { | |
| 11286 display: flex; | |
| 11287 flex-direction: column; | |
| 11288 } | |
| 11289 | |
| 11290 .flex-item-fit { | |
| 11291 flex-grow: 1; | |
| 11292 flex-shrink: 1; | |
| 11293 flex-basis: auto; | |
| 11294 } | |
| 11295 | |
| 11296 .flex-item-no-shrink { | |
| 11297 flex-grow: 0; | |
| 11298 flex-shrink: 0; | |
| 11299 flex-basis: auto; | |
| 11300 } | |
| 11301 | |
| 11302 .flex-item-fill { | |
| 11303 flex-grow: 0; | |
| 11304 flex-shrink: 1; /* shrink when pressured */ | |
| 11305 flex-basis: 100%; /* try and take 100% */ | |
| 11306 } | |
| 11307 | |
| 11308 .flex-item-fixed-1-12 { | |
| 11309 flex-grow: 0; | |
| 11310 flex-shrink: 0; | |
| 11311 flex-basis: 8.3%; | |
| 11312 } | |
| 11313 | |
| 11314 .flex-item-fixed-2-12 { | |
| 11315 flex-grow: 0; | |
| 11316 flex-shrink: 0; | |
| 11317 flex-basis: 16.6%; | |
| 11318 } | |
| 11319 | |
| 11320 .flex-item-fixed-4-12 { | |
| 11321 flex-grow: 0; | |
| 11322 flex-shrink: 0; | |
| 11323 flex-basis: 33.3333%; | |
| 11324 } | |
| 11325 | |
| 11326 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 11327 flex-grow: 0; | |
| 11328 flex-shrink: 0; | |
| 11329 flex-basis: 50%; | |
| 11330 } | |
| 11331 | |
| 11332 .flex-item-fixed-8-12 { | |
| 11333 flex-grow: 0; | |
| 11334 flex-shrink: 0; | |
| 11335 flex-basis: 66.6666%; | |
| 11336 } | |
| 11337 | |
| 11338 .flex-item-fixed-9-12 { | |
| 11339 flex-grow: 0; | |
| 11340 flex-shrink: 0; | |
| 11341 flex-basis: 75%; | |
| 11342 } | |
| 11343 | |
| 11344 | |
| 11345 .flex-item-fixed-12-12 { | |
| 11346 flex-grow: 0; | |
| 11347 flex-shrink: 0; | |
| 11348 flex-basis: 100%; | |
| 11349 } | |
| 11350 | |
| 11351 .flex-item-10-percent { | |
| 11352 flex-grow: 0; | |
| 11353 flex-shrink: 0; | |
| 11354 flex-basis: 10%; | |
| 11355 } | |
| 11356 | |
| 11357 .flex-item-15-percent { | |
| 11358 flex-grow: 0; | |
| 11359 flex-shrink: 0; | |
| 11360 flex-basis: 15%; | |
| 11361 } | |
| 11362 | |
| 11363 .flex-item-20-percent { | |
| 11364 flex-grow: 0; | |
| 11365 flex-shrink: 0; | |
| 11366 flex-basis: 20%; | |
| 11367 } | |
| 11368 | |
| 11369 .flex-item-30-percent { | |
| 11370 flex-grow: 0; | |
| 11371 flex-shrink: 0; | |
| 11372 flex-basis: 30%; | |
| 11373 } | |
| 11374 | |
| 11375 .flex-item-40-percent { | |
| 11376 flex-grow: 0; | |
| 11377 flex-shrink: 0; | |
| 11378 flex-basis: 40%; | |
| 11379 } | |
| 11380 | |
| 11381 .flex-item-50-percent { | |
| 11382 flex-grow: 0; | |
| 11383 flex-shrink: 0; | |
| 11384 flex-basis: 50%; | |
| 11385 } | |
| 11386 | |
| 11387 .flex-item-60-percent { | |
| 11388 flex-grow: 0; | |
| 11389 flex-shrink: 0; | |
| 11390 flex-basis: 60%; | |
| 11391 } | |
| 11392 | |
| 11393 .flex-item-70-percent { | |
| 11394 flex-grow: 0; | |
| 11395 flex-shrink: 0; | |
| 11396 flex-basis: 70%; | |
| 11397 } | |
| 11398 | |
| 11399 .flex-item-80-percent { | |
| 11400 flex-grow: 0; | |
| 11401 flex-shrink: 0; | |
| 11402 flex-basis: 80%; | |
| 11403 } | |
| 11404 | |
| 11405 .well { | |
| 11406 min-height: 20px; | |
| 11407 padding: 19px; | |
| 11408 margin-bottom: 20px; | |
| 11409 background-color: #f5f5f5; | |
| 11410 border: 1px solid #e3e3e3; | |
| 11411 border-radius: 4px; | |
| 11412 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 11413 } | |
| 11414 | |
| 11415 .break-wrap { | |
| 11416 word-wrap: break-word; | |
| 11417 } | |
| 11418 </style> | |
| 11419 | |
| 11420 <nav-bar> | |
| 11421 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 11422 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 11423 </nav-bar> | |
| 11424 | |
| 11425 <div class="content"> | |
| 11426 <h1>Sockets</h1> | |
| 11427 | |
| 11428 <br> | |
| 11429 | |
| 11430 <ul class="list-group"> | |
| 11431 <template repeat="{{ socket in list['members'] }}"> | |
| 11432 <li class="list-group-item"> | |
| 11433 <io-socket-ref ref="{{ socket }}"></io-socket-ref> | |
| 11434 </li> | |
| 11435 </template> | |
| 11436 </ul> | |
| 11437 </div> | |
| 11438 <br> | |
| 11439 <hr> | |
| 11440 </template> | |
| 11441 </polymer-element> | |
| 11442 | |
| 11443 <polymer-element name="io-socket-view" extends="observatory-element"> | |
| 11444 <template> | |
| 11445 <style>/* Global styles */ | |
| 11446 * { | |
| 11447 margin: 0; | |
| 11448 padding: 0; | |
| 11449 font: 400 14px 'Montserrat', sans-serif; | |
| 11450 color: #333; | |
| 11451 box-sizing: border-box; | |
| 11452 } | |
| 11453 | |
| 11454 .content { | |
| 11455 padding-left: 10%; | |
| 11456 font: 400 14px 'Montserrat', sans-serif; | |
| 11457 } | |
| 11458 | |
| 11459 .content-centered { | |
| 11460 padding-left: 10%; | |
| 11461 padding-right: 10%; | |
| 11462 font: 400 14px 'Montserrat', sans-serif; | |
| 11463 } | |
| 11464 | |
| 11465 .content-centered-big { | |
| 11466 padding-left: 5%; | |
| 11467 padding-right: 5%; | |
| 11468 font: 400 14px 'Montserrat', sans-serif; | |
| 11469 } | |
| 11470 | |
| 11471 h1 { | |
| 11472 font: 400 18px 'Montserrat', sans-serif; | |
| 11473 } | |
| 11474 | |
| 11475 .memberList { | |
| 11476 display: table; | |
| 11477 } | |
| 11478 | |
| 11479 .memberItem { | |
| 11480 display: table-row; | |
| 11481 } | |
| 11482 | |
| 11483 .memberName, .memberValue { | |
| 11484 display: table-cell; | |
| 11485 vertical-align: top; | |
| 11486 padding: 3px 0 3px 1em; | |
| 11487 font: 400 14px 'Montserrat', sans-serif; | |
| 11488 } | |
| 11489 | |
| 11490 .memberSmall { | |
| 11491 display: table-cell; | |
| 11492 vertical-align: top; | |
| 11493 padding: 3px 0 3px 1em; | |
| 11494 font: 400 12px 'Montserrat', sans-serif; | |
| 11495 } | |
| 11496 | |
| 11497 .monospace { | |
| 11498 font-family: consolas, courier, monospace; | |
| 11499 font-size: 1em; | |
| 11500 line-height: 1.2em; | |
| 11501 white-space: nowrap; | |
| 11502 } | |
| 11503 | |
| 11504 a { | |
| 11505 color: #0489c3; | |
| 11506 text-decoration: none; | |
| 11507 } | |
| 11508 | |
| 11509 a:hover { | |
| 11510 text-decoration: underline; | |
| 11511 } | |
| 11512 | |
| 11513 em { | |
| 11514 color: inherit; | |
| 11515 font-style: italic; | |
| 11516 } | |
| 11517 | |
| 11518 b { | |
| 11519 color: inherit; | |
| 11520 font-weight: bold; | |
| 11521 } | |
| 11522 | |
| 11523 hr { | |
| 11524 margin-top: 20px; | |
| 11525 margin-bottom: 20px; | |
| 11526 border: 0; | |
| 11527 border-top: 1px solid #eee; | |
| 11528 height: 0; | |
| 11529 box-sizing: content-box; | |
| 11530 } | |
| 11531 | |
| 11532 .list-group { | |
| 11533 padding-left: 0; | |
| 11534 margin-bottom: 20px; | |
| 11535 } | |
| 11536 | |
| 11537 .list-group-item { | |
| 11538 position: relative; | |
| 11539 display: block; | |
| 11540 padding: 10px 15px; | |
| 11541 margin-bottom: -1px; | |
| 11542 background-color: #fff; | |
| 11543 } | |
| 11544 | |
| 11545 .list-group-item:first-child { | |
| 11546 /* rounded top corners */ | |
| 11547 border-top-right-radius:4px; | |
| 11548 border-top-left-radius:4px; | |
| 11549 } | |
| 11550 | |
| 11551 .list-group-item:last-child { | |
| 11552 margin-bottom: 0; | |
| 11553 /* rounded bottom corners */ | |
| 11554 border-bottom-right-radius: 4px; | |
| 11555 border-bottom-left-radius:4px; | |
| 11556 } | |
| 11557 | |
| 11558 /* Flex row container */ | |
| 11559 .flex-row { | |
| 11560 display: flex; | |
| 11561 flex-direction: row; | |
| 11562 } | |
| 11563 | |
| 11564 /* Flex column container */ | |
| 11565 .flex-column { | |
| 11566 display: flex; | |
| 11567 flex-direction: column; | |
| 11568 } | |
| 11569 | |
| 11570 .flex-item-fit { | |
| 11571 flex-grow: 1; | |
| 11572 flex-shrink: 1; | |
| 11573 flex-basis: auto; | |
| 11574 } | |
| 11575 | |
| 11576 .flex-item-no-shrink { | |
| 11577 flex-grow: 0; | |
| 11578 flex-shrink: 0; | |
| 11579 flex-basis: auto; | |
| 11580 } | |
| 11581 | |
| 11582 .flex-item-fill { | |
| 11583 flex-grow: 0; | |
| 11584 flex-shrink: 1; /* shrink when pressured */ | |
| 11585 flex-basis: 100%; /* try and take 100% */ | |
| 11586 } | |
| 11587 | |
| 11588 .flex-item-fixed-1-12 { | |
| 11589 flex-grow: 0; | |
| 11590 flex-shrink: 0; | |
| 11591 flex-basis: 8.3%; | |
| 11592 } | |
| 11593 | |
| 11594 .flex-item-fixed-2-12 { | |
| 11595 flex-grow: 0; | |
| 11596 flex-shrink: 0; | |
| 11597 flex-basis: 16.6%; | |
| 11598 } | |
| 11599 | |
| 11600 .flex-item-fixed-4-12 { | |
| 11601 flex-grow: 0; | |
| 11602 flex-shrink: 0; | |
| 11603 flex-basis: 33.3333%; | |
| 11604 } | |
| 11605 | |
| 11606 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 11607 flex-grow: 0; | |
| 11608 flex-shrink: 0; | |
| 11609 flex-basis: 50%; | |
| 11610 } | |
| 11611 | |
| 11612 .flex-item-fixed-8-12 { | |
| 11613 flex-grow: 0; | |
| 11614 flex-shrink: 0; | |
| 11615 flex-basis: 66.6666%; | |
| 11616 } | |
| 11617 | |
| 11618 .flex-item-fixed-9-12 { | |
| 11619 flex-grow: 0; | |
| 11620 flex-shrink: 0; | |
| 11621 flex-basis: 75%; | |
| 11622 } | |
| 11623 | |
| 11624 | |
| 11625 .flex-item-fixed-12-12 { | |
| 11626 flex-grow: 0; | |
| 11627 flex-shrink: 0; | |
| 11628 flex-basis: 100%; | |
| 11629 } | |
| 11630 | |
| 11631 .flex-item-10-percent { | |
| 11632 flex-grow: 0; | |
| 11633 flex-shrink: 0; | |
| 11634 flex-basis: 10%; | |
| 11635 } | |
| 11636 | |
| 11637 .flex-item-15-percent { | |
| 11638 flex-grow: 0; | |
| 11639 flex-shrink: 0; | |
| 11640 flex-basis: 15%; | |
| 11641 } | |
| 11642 | |
| 11643 .flex-item-20-percent { | |
| 11644 flex-grow: 0; | |
| 11645 flex-shrink: 0; | |
| 11646 flex-basis: 20%; | |
| 11647 } | |
| 11648 | |
| 11649 .flex-item-30-percent { | |
| 11650 flex-grow: 0; | |
| 11651 flex-shrink: 0; | |
| 11652 flex-basis: 30%; | |
| 11653 } | |
| 11654 | |
| 11655 .flex-item-40-percent { | |
| 11656 flex-grow: 0; | |
| 11657 flex-shrink: 0; | |
| 11658 flex-basis: 40%; | |
| 11659 } | |
| 11660 | |
| 11661 .flex-item-50-percent { | |
| 11662 flex-grow: 0; | |
| 11663 flex-shrink: 0; | |
| 11664 flex-basis: 50%; | |
| 11665 } | |
| 11666 | |
| 11667 .flex-item-60-percent { | |
| 11668 flex-grow: 0; | |
| 11669 flex-shrink: 0; | |
| 11670 flex-basis: 60%; | |
| 11671 } | |
| 11672 | |
| 11673 .flex-item-70-percent { | |
| 11674 flex-grow: 0; | |
| 11675 flex-shrink: 0; | |
| 11676 flex-basis: 70%; | |
| 11677 } | |
| 11678 | |
| 11679 .flex-item-80-percent { | |
| 11680 flex-grow: 0; | |
| 11681 flex-shrink: 0; | |
| 11682 flex-basis: 80%; | |
| 11683 } | |
| 11684 | |
| 11685 .well { | |
| 11686 min-height: 20px; | |
| 11687 padding: 19px; | |
| 11688 margin-bottom: 20px; | |
| 11689 background-color: #f5f5f5; | |
| 11690 border: 1px solid #e3e3e3; | |
| 11691 border-radius: 4px; | |
| 11692 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 11693 } | |
| 11694 | |
| 11695 .break-wrap { | |
| 11696 word-wrap: break-word; | |
| 11697 } | |
| 11698 </style> | |
| 11699 | |
| 11700 <nav-bar> | |
| 11701 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 11702 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 11703 </nav-bar> | |
| 11704 | |
| 11705 <div class="content"> | |
| 11706 <!-- Pipe Socket --> | |
| 11707 <template if="{{ socket.isPipe }}"> | |
| 11708 <h1>Pipe Socket</h1> | |
| 11709 <div class="memberList"> | |
| 11710 <template if="{{ socket.socketOwner != null }}"> | |
| 11711 <div class="memberItem"> | |
| 11712 <div class="memberName">Owner</div> | |
| 11713 <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></
io-ref></div> | |
| 11714 </div> | |
| 11715 </template> | |
| 11716 <div class="memberItem"> | |
| 11717 <div class="memberName">File descriptor</div> | |
| 11718 <div class="memberValue">{{ socket.fd }}</div> | |
| 11719 </div> | |
| 11720 <div class="memberItem"> | |
| 11721 <div class="memberName">Read Closed</div> | |
| 11722 <div class="memberValue">{{ socket.readClosed }}</div> | |
| 11723 </div> | |
| 11724 <div class="memberItem"> | |
| 11725 <div class="memberName">Write Closed</div> | |
| 11726 <div class="memberValue">{{ socket.writeClosed }}</div> | |
| 11727 </div> | |
| 11728 <div class="memberItem"> | |
| 11729 <div class="memberName">Closing</div> | |
| 11730 <div class="memberValue">{{ socket.closing }}</div> | |
| 11731 </div> | |
| 11732 </div> | |
| 11733 </template> | |
| 11734 <!-- Network Socket --> | |
| 11735 <template if="{{ !socket.isPipe }}"> | |
| 11736 <h1>Network Socket</h1> | |
| 11737 <div class="memberList"> | |
| 11738 <template if="{{ socket.socketOwner != null }}"> | |
| 11739 <div class="memberItem"> | |
| 11740 <div class="memberName">Owner</div> | |
| 11741 <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></
io-ref></div> | |
| 11742 </div> | |
| 11743 </template> | |
| 11744 <div class="memberItem"> | |
| 11745 <div class="memberName">Local Address</div> | |
| 11746 <div class="memberValue">{{ socket.localAddress }}</div> | |
| 11747 </div> | |
| 11748 <div class="memberItem"> | |
| 11749 <div class="memberName">Local Port</div> | |
| 11750 <div class="memberValue">{{ socket.localPort }}</div> | |
| 11751 </div> | |
| 11752 <div class="memberItem"> | |
| 11753 <div class="memberName">Remote Address</div> | |
| 11754 <div class="memberValue">{{ socket.remoteAddress }}</div> | |
| 11755 </div> | |
| 11756 <div class="memberItem"> | |
| 11757 <div class="memberName">Remote Port</div> | |
| 11758 <div class="memberValue">{{ socket.remotePort }}</div> | |
| 11759 </div> | |
| 11760 <div class="memberItem"> | |
| 11761 <div class="memberName">File descriptor</div> | |
| 11762 <div class="memberValue">{{ socket.fd }}</div> | |
| 11763 </div> | |
| 11764 <div class="memberItem"> | |
| 11765 <div class="memberName">Read Closed</div> | |
| 11766 <div class="memberValue">{{ socket.readClosed }}</div> | |
| 11767 </div> | |
| 11768 <div class="memberItem"> | |
| 11769 <div class="memberName">Write Closed</div> | |
| 11770 <div class="memberValue">{{ socket.writeClosed }}</div> | |
| 11771 </div> | |
| 11772 <div class="memberItem"> | |
| 11773 <div class="memberName">Closing</div> | |
| 11774 <div class="memberValue">{{ socket.closing }}</div> | |
| 11775 </div> | |
| 11776 <div class="memberItem"> | |
| 11777 <div class="memberName">Listening</div> | |
| 11778 <div class="memberValue">{{ socket.listening }}</div> | |
| 11779 </div> | |
| 11780 <div class="memberItem"> | |
| 11781 <div class="memberName">Protocol</div> | |
| 11782 <div class="memberValue">{{ socket.protocol }}</div> | |
| 11783 </div> | |
| 11784 </div> | |
| 11785 </template> | |
| 11786 </div> | |
| 11787 <br> | |
| 11788 <hr> | |
| 11789 </template> | |
| 11790 </polymer-element> | |
| 11791 | |
| 11792 <polymer-element name="io-web-socket-ref" extends="service-ref"> | |
| 11793 <template> | |
| 11794 <style>/* Global styles */ | |
| 11795 * { | |
| 11796 margin: 0; | |
| 11797 padding: 0; | |
| 11798 font: 400 14px 'Montserrat', sans-serif; | |
| 11799 color: #333; | |
| 11800 box-sizing: border-box; | |
| 11801 } | |
| 11802 | |
| 11803 .content { | |
| 11804 padding-left: 10%; | |
| 11805 font: 400 14px 'Montserrat', sans-serif; | |
| 11806 } | |
| 11807 | |
| 11808 .content-centered { | |
| 11809 padding-left: 10%; | |
| 11810 padding-right: 10%; | |
| 11811 font: 400 14px 'Montserrat', sans-serif; | |
| 11812 } | |
| 11813 | |
| 11814 .content-centered-big { | |
| 11815 padding-left: 5%; | |
| 11816 padding-right: 5%; | |
| 11817 font: 400 14px 'Montserrat', sans-serif; | |
| 11818 } | |
| 11819 | |
| 11820 h1 { | |
| 11821 font: 400 18px 'Montserrat', sans-serif; | |
| 11822 } | |
| 11823 | |
| 11824 .memberList { | |
| 11825 display: table; | |
| 11826 } | |
| 11827 | |
| 11828 .memberItem { | |
| 11829 display: table-row; | |
| 11830 } | |
| 11831 | |
| 11832 .memberName, .memberValue { | |
| 11833 display: table-cell; | |
| 11834 vertical-align: top; | |
| 11835 padding: 3px 0 3px 1em; | |
| 11836 font: 400 14px 'Montserrat', sans-serif; | |
| 11837 } | |
| 11838 | |
| 11839 .memberSmall { | |
| 11840 display: table-cell; | |
| 11841 vertical-align: top; | |
| 11842 padding: 3px 0 3px 1em; | |
| 11843 font: 400 12px 'Montserrat', sans-serif; | |
| 11844 } | |
| 11845 | |
| 11846 .monospace { | |
| 11847 font-family: consolas, courier, monospace; | |
| 11848 font-size: 1em; | |
| 11849 line-height: 1.2em; | |
| 11850 white-space: nowrap; | |
| 11851 } | |
| 11852 | |
| 11853 a { | |
| 11854 color: #0489c3; | |
| 11855 text-decoration: none; | |
| 11856 } | |
| 11857 | |
| 11858 a:hover { | |
| 11859 text-decoration: underline; | |
| 11860 } | |
| 11861 | |
| 11862 em { | |
| 11863 color: inherit; | |
| 11864 font-style: italic; | |
| 11865 } | |
| 11866 | |
| 11867 b { | |
| 11868 color: inherit; | |
| 11869 font-weight: bold; | |
| 11870 } | |
| 11871 | |
| 11872 hr { | |
| 11873 margin-top: 20px; | |
| 11874 margin-bottom: 20px; | |
| 11875 border: 0; | |
| 11876 border-top: 1px solid #eee; | |
| 11877 height: 0; | |
| 11878 box-sizing: content-box; | |
| 11879 } | |
| 11880 | |
| 11881 .list-group { | |
| 11882 padding-left: 0; | |
| 11883 margin-bottom: 20px; | |
| 11884 } | |
| 11885 | |
| 11886 .list-group-item { | |
| 11887 position: relative; | |
| 11888 display: block; | |
| 11889 padding: 10px 15px; | |
| 11890 margin-bottom: -1px; | |
| 11891 background-color: #fff; | |
| 11892 } | |
| 11893 | |
| 11894 .list-group-item:first-child { | |
| 11895 /* rounded top corners */ | |
| 11896 border-top-right-radius:4px; | |
| 11897 border-top-left-radius:4px; | |
| 11898 } | |
| 11899 | |
| 11900 .list-group-item:last-child { | |
| 11901 margin-bottom: 0; | |
| 11902 /* rounded bottom corners */ | |
| 11903 border-bottom-right-radius: 4px; | |
| 11904 border-bottom-left-radius:4px; | |
| 11905 } | |
| 11906 | |
| 11907 /* Flex row container */ | |
| 11908 .flex-row { | |
| 11909 display: flex; | |
| 11910 flex-direction: row; | |
| 11911 } | |
| 11912 | |
| 11913 /* Flex column container */ | |
| 11914 .flex-column { | |
| 11915 display: flex; | |
| 11916 flex-direction: column; | |
| 11917 } | |
| 11918 | |
| 11919 .flex-item-fit { | |
| 11920 flex-grow: 1; | |
| 11921 flex-shrink: 1; | |
| 11922 flex-basis: auto; | |
| 11923 } | |
| 11924 | |
| 11925 .flex-item-no-shrink { | |
| 11926 flex-grow: 0; | |
| 11927 flex-shrink: 0; | |
| 11928 flex-basis: auto; | |
| 11929 } | |
| 11930 | |
| 11931 .flex-item-fill { | |
| 11932 flex-grow: 0; | |
| 11933 flex-shrink: 1; /* shrink when pressured */ | |
| 11934 flex-basis: 100%; /* try and take 100% */ | |
| 11935 } | |
| 11936 | |
| 11937 .flex-item-fixed-1-12 { | |
| 11938 flex-grow: 0; | |
| 11939 flex-shrink: 0; | |
| 11940 flex-basis: 8.3%; | |
| 11941 } | |
| 11942 | |
| 11943 .flex-item-fixed-2-12 { | |
| 11944 flex-grow: 0; | |
| 11945 flex-shrink: 0; | |
| 11946 flex-basis: 16.6%; | |
| 11947 } | |
| 11948 | |
| 11949 .flex-item-fixed-4-12 { | |
| 11950 flex-grow: 0; | |
| 11951 flex-shrink: 0; | |
| 11952 flex-basis: 33.3333%; | |
| 11953 } | |
| 11954 | |
| 11955 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 11956 flex-grow: 0; | |
| 11957 flex-shrink: 0; | |
| 11958 flex-basis: 50%; | |
| 11959 } | |
| 11960 | |
| 11961 .flex-item-fixed-8-12 { | |
| 11962 flex-grow: 0; | |
| 11963 flex-shrink: 0; | |
| 11964 flex-basis: 66.6666%; | |
| 11965 } | |
| 11966 | |
| 11967 .flex-item-fixed-9-12 { | |
| 11968 flex-grow: 0; | |
| 11969 flex-shrink: 0; | |
| 11970 flex-basis: 75%; | |
| 11971 } | |
| 11972 | |
| 11973 | |
| 11974 .flex-item-fixed-12-12 { | |
| 11975 flex-grow: 0; | |
| 11976 flex-shrink: 0; | |
| 11977 flex-basis: 100%; | |
| 11978 } | |
| 11979 | |
| 11980 .flex-item-10-percent { | |
| 11981 flex-grow: 0; | |
| 11982 flex-shrink: 0; | |
| 11983 flex-basis: 10%; | |
| 11984 } | |
| 11985 | |
| 11986 .flex-item-15-percent { | |
| 11987 flex-grow: 0; | |
| 11988 flex-shrink: 0; | |
| 11989 flex-basis: 15%; | |
| 11990 } | |
| 11991 | |
| 11992 .flex-item-20-percent { | |
| 11993 flex-grow: 0; | |
| 11994 flex-shrink: 0; | |
| 11995 flex-basis: 20%; | |
| 11996 } | |
| 11997 | |
| 11998 .flex-item-30-percent { | |
| 11999 flex-grow: 0; | |
| 12000 flex-shrink: 0; | |
| 12001 flex-basis: 30%; | |
| 12002 } | |
| 12003 | |
| 12004 .flex-item-40-percent { | |
| 12005 flex-grow: 0; | |
| 12006 flex-shrink: 0; | |
| 12007 flex-basis: 40%; | |
| 12008 } | |
| 12009 | |
| 12010 .flex-item-50-percent { | |
| 12011 flex-grow: 0; | |
| 12012 flex-shrink: 0; | |
| 12013 flex-basis: 50%; | |
| 12014 } | |
| 12015 | |
| 12016 .flex-item-60-percent { | |
| 12017 flex-grow: 0; | |
| 12018 flex-shrink: 0; | |
| 12019 flex-basis: 60%; | |
| 12020 } | |
| 12021 | |
| 12022 .flex-item-70-percent { | |
| 12023 flex-grow: 0; | |
| 12024 flex-shrink: 0; | |
| 12025 flex-basis: 70%; | |
| 12026 } | |
| 12027 | |
| 12028 .flex-item-80-percent { | |
| 12029 flex-grow: 0; | |
| 12030 flex-shrink: 0; | |
| 12031 flex-basis: 80%; | |
| 12032 } | |
| 12033 | |
| 12034 .well { | |
| 12035 min-height: 20px; | |
| 12036 padding: 19px; | |
| 12037 margin-bottom: 20px; | |
| 12038 background-color: #f5f5f5; | |
| 12039 border: 1px solid #e3e3e3; | |
| 12040 border-radius: 4px; | |
| 12041 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 12042 } | |
| 12043 | |
| 12044 .break-wrap { | |
| 12045 word-wrap: break-word; | |
| 12046 } | |
| 12047 </style> | |
| 12048 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 12049 </template> | |
| 12050 </polymer-element> | |
| 12051 | |
| 12052 <polymer-element name="io-web-socket-list-view" extends="observatory-element"> | |
| 12053 <template> | |
| 12054 <style>/* Global styles */ | |
| 12055 * { | |
| 12056 margin: 0; | |
| 12057 padding: 0; | |
| 12058 font: 400 14px 'Montserrat', sans-serif; | |
| 12059 color: #333; | |
| 12060 box-sizing: border-box; | |
| 12061 } | |
| 12062 | |
| 12063 .content { | |
| 12064 padding-left: 10%; | |
| 12065 font: 400 14px 'Montserrat', sans-serif; | |
| 12066 } | |
| 12067 | |
| 12068 .content-centered { | |
| 12069 padding-left: 10%; | |
| 12070 padding-right: 10%; | |
| 12071 font: 400 14px 'Montserrat', sans-serif; | |
| 12072 } | |
| 12073 | |
| 12074 .content-centered-big { | |
| 12075 padding-left: 5%; | |
| 12076 padding-right: 5%; | |
| 12077 font: 400 14px 'Montserrat', sans-serif; | |
| 12078 } | |
| 12079 | |
| 12080 h1 { | |
| 12081 font: 400 18px 'Montserrat', sans-serif; | |
| 12082 } | |
| 12083 | |
| 12084 .memberList { | |
| 12085 display: table; | |
| 12086 } | |
| 12087 | |
| 12088 .memberItem { | |
| 12089 display: table-row; | |
| 12090 } | |
| 12091 | |
| 12092 .memberName, .memberValue { | |
| 12093 display: table-cell; | |
| 12094 vertical-align: top; | |
| 12095 padding: 3px 0 3px 1em; | |
| 12096 font: 400 14px 'Montserrat', sans-serif; | |
| 12097 } | |
| 12098 | |
| 12099 .memberSmall { | |
| 12100 display: table-cell; | |
| 12101 vertical-align: top; | |
| 12102 padding: 3px 0 3px 1em; | |
| 12103 font: 400 12px 'Montserrat', sans-serif; | |
| 12104 } | |
| 12105 | |
| 12106 .monospace { | |
| 12107 font-family: consolas, courier, monospace; | |
| 12108 font-size: 1em; | |
| 12109 line-height: 1.2em; | |
| 12110 white-space: nowrap; | |
| 12111 } | |
| 12112 | |
| 12113 a { | |
| 12114 color: #0489c3; | |
| 12115 text-decoration: none; | |
| 12116 } | |
| 12117 | |
| 12118 a:hover { | |
| 12119 text-decoration: underline; | |
| 12120 } | |
| 12121 | |
| 12122 em { | |
| 12123 color: inherit; | |
| 12124 font-style: italic; | |
| 12125 } | |
| 12126 | |
| 12127 b { | |
| 12128 color: inherit; | |
| 12129 font-weight: bold; | |
| 12130 } | |
| 12131 | |
| 12132 hr { | |
| 12133 margin-top: 20px; | |
| 12134 margin-bottom: 20px; | |
| 12135 border: 0; | |
| 12136 border-top: 1px solid #eee; | |
| 12137 height: 0; | |
| 12138 box-sizing: content-box; | |
| 12139 } | |
| 12140 | |
| 12141 .list-group { | |
| 12142 padding-left: 0; | |
| 12143 margin-bottom: 20px; | |
| 12144 } | |
| 12145 | |
| 12146 .list-group-item { | |
| 12147 position: relative; | |
| 12148 display: block; | |
| 12149 padding: 10px 15px; | |
| 12150 margin-bottom: -1px; | |
| 12151 background-color: #fff; | |
| 12152 } | |
| 12153 | |
| 12154 .list-group-item:first-child { | |
| 12155 /* rounded top corners */ | |
| 12156 border-top-right-radius:4px; | |
| 12157 border-top-left-radius:4px; | |
| 12158 } | |
| 12159 | |
| 12160 .list-group-item:last-child { | |
| 12161 margin-bottom: 0; | |
| 12162 /* rounded bottom corners */ | |
| 12163 border-bottom-right-radius: 4px; | |
| 12164 border-bottom-left-radius:4px; | |
| 12165 } | |
| 12166 | |
| 12167 /* Flex row container */ | |
| 12168 .flex-row { | |
| 12169 display: flex; | |
| 12170 flex-direction: row; | |
| 12171 } | |
| 12172 | |
| 12173 /* Flex column container */ | |
| 12174 .flex-column { | |
| 12175 display: flex; | |
| 12176 flex-direction: column; | |
| 12177 } | |
| 12178 | |
| 12179 .flex-item-fit { | |
| 12180 flex-grow: 1; | |
| 12181 flex-shrink: 1; | |
| 12182 flex-basis: auto; | |
| 12183 } | |
| 12184 | |
| 12185 .flex-item-no-shrink { | |
| 12186 flex-grow: 0; | |
| 12187 flex-shrink: 0; | |
| 12188 flex-basis: auto; | |
| 12189 } | |
| 12190 | |
| 12191 .flex-item-fill { | |
| 12192 flex-grow: 0; | |
| 12193 flex-shrink: 1; /* shrink when pressured */ | |
| 12194 flex-basis: 100%; /* try and take 100% */ | |
| 12195 } | |
| 12196 | |
| 12197 .flex-item-fixed-1-12 { | |
| 12198 flex-grow: 0; | |
| 12199 flex-shrink: 0; | |
| 12200 flex-basis: 8.3%; | |
| 12201 } | |
| 12202 | |
| 12203 .flex-item-fixed-2-12 { | |
| 12204 flex-grow: 0; | |
| 12205 flex-shrink: 0; | |
| 12206 flex-basis: 16.6%; | |
| 12207 } | |
| 12208 | |
| 12209 .flex-item-fixed-4-12 { | |
| 12210 flex-grow: 0; | |
| 12211 flex-shrink: 0; | |
| 12212 flex-basis: 33.3333%; | |
| 12213 } | |
| 12214 | |
| 12215 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 12216 flex-grow: 0; | |
| 12217 flex-shrink: 0; | |
| 12218 flex-basis: 50%; | |
| 12219 } | |
| 12220 | |
| 12221 .flex-item-fixed-8-12 { | |
| 12222 flex-grow: 0; | |
| 12223 flex-shrink: 0; | |
| 12224 flex-basis: 66.6666%; | |
| 12225 } | |
| 12226 | |
| 12227 .flex-item-fixed-9-12 { | |
| 12228 flex-grow: 0; | |
| 12229 flex-shrink: 0; | |
| 12230 flex-basis: 75%; | |
| 12231 } | |
| 12232 | |
| 12233 | |
| 12234 .flex-item-fixed-12-12 { | |
| 12235 flex-grow: 0; | |
| 12236 flex-shrink: 0; | |
| 12237 flex-basis: 100%; | |
| 12238 } | |
| 12239 | |
| 12240 .flex-item-10-percent { | |
| 12241 flex-grow: 0; | |
| 12242 flex-shrink: 0; | |
| 12243 flex-basis: 10%; | |
| 12244 } | |
| 12245 | |
| 12246 .flex-item-15-percent { | |
| 12247 flex-grow: 0; | |
| 12248 flex-shrink: 0; | |
| 12249 flex-basis: 15%; | |
| 12250 } | |
| 12251 | |
| 12252 .flex-item-20-percent { | |
| 12253 flex-grow: 0; | |
| 12254 flex-shrink: 0; | |
| 12255 flex-basis: 20%; | |
| 12256 } | |
| 12257 | |
| 12258 .flex-item-30-percent { | |
| 12259 flex-grow: 0; | |
| 12260 flex-shrink: 0; | |
| 12261 flex-basis: 30%; | |
| 12262 } | |
| 12263 | |
| 12264 .flex-item-40-percent { | |
| 12265 flex-grow: 0; | |
| 12266 flex-shrink: 0; | |
| 12267 flex-basis: 40%; | |
| 12268 } | |
| 12269 | |
| 12270 .flex-item-50-percent { | |
| 12271 flex-grow: 0; | |
| 12272 flex-shrink: 0; | |
| 12273 flex-basis: 50%; | |
| 12274 } | |
| 12275 | |
| 12276 .flex-item-60-percent { | |
| 12277 flex-grow: 0; | |
| 12278 flex-shrink: 0; | |
| 12279 flex-basis: 60%; | |
| 12280 } | |
| 12281 | |
| 12282 .flex-item-70-percent { | |
| 12283 flex-grow: 0; | |
| 12284 flex-shrink: 0; | |
| 12285 flex-basis: 70%; | |
| 12286 } | |
| 12287 | |
| 12288 .flex-item-80-percent { | |
| 12289 flex-grow: 0; | |
| 12290 flex-shrink: 0; | |
| 12291 flex-basis: 80%; | |
| 12292 } | |
| 12293 | |
| 12294 .well { | |
| 12295 min-height: 20px; | |
| 12296 padding: 19px; | |
| 12297 margin-bottom: 20px; | |
| 12298 background-color: #f5f5f5; | |
| 12299 border: 1px solid #e3e3e3; | |
| 12300 border-radius: 4px; | |
| 12301 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 12302 } | |
| 12303 | |
| 12304 .break-wrap { | |
| 12305 word-wrap: break-word; | |
| 12306 } | |
| 12307 </style> | |
| 12308 | |
| 12309 <nav-bar> | |
| 12310 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 12311 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 12312 </nav-bar> | |
| 12313 | |
| 12314 <div class="content"> | |
| 12315 <h1>WebSockets</h1> | |
| 12316 | |
| 12317 <br> | |
| 12318 | |
| 12319 <ul class="list-group"> | |
| 12320 <template repeat="{{ webSocket in list['members'] }}"> | |
| 12321 <li class="list-group-item"> | |
| 12322 <io-web-socket-ref ref="{{ webSocket }}"></io-web-socket-ref> | |
| 12323 </li> | |
| 12324 </template> | |
| 12325 </ul> | |
| 12326 </div> | |
| 12327 <br> | |
| 12328 <hr> | |
| 12329 </template> | |
| 12330 </polymer-element> | |
| 12331 | |
| 12332 <polymer-element name="io-web-socket-view" extends="observatory-element"> | |
| 12333 <template> | |
| 12334 <style>/* Global styles */ | |
| 12335 * { | |
| 12336 margin: 0; | |
| 12337 padding: 0; | |
| 12338 font: 400 14px 'Montserrat', sans-serif; | |
| 12339 color: #333; | |
| 12340 box-sizing: border-box; | |
| 12341 } | |
| 12342 | |
| 12343 .content { | |
| 12344 padding-left: 10%; | |
| 12345 font: 400 14px 'Montserrat', sans-serif; | |
| 12346 } | |
| 12347 | |
| 12348 .content-centered { | |
| 12349 padding-left: 10%; | |
| 12350 padding-right: 10%; | |
| 12351 font: 400 14px 'Montserrat', sans-serif; | |
| 12352 } | |
| 12353 | |
| 12354 .content-centered-big { | |
| 12355 padding-left: 5%; | |
| 12356 padding-right: 5%; | |
| 12357 font: 400 14px 'Montserrat', sans-serif; | |
| 12358 } | |
| 12359 | |
| 12360 h1 { | |
| 12361 font: 400 18px 'Montserrat', sans-serif; | |
| 12362 } | |
| 12363 | |
| 12364 .memberList { | |
| 12365 display: table; | |
| 12366 } | |
| 12367 | |
| 12368 .memberItem { | |
| 12369 display: table-row; | |
| 12370 } | |
| 12371 | |
| 12372 .memberName, .memberValue { | |
| 12373 display: table-cell; | |
| 12374 vertical-align: top; | |
| 12375 padding: 3px 0 3px 1em; | |
| 12376 font: 400 14px 'Montserrat', sans-serif; | |
| 12377 } | |
| 12378 | |
| 12379 .memberSmall { | |
| 12380 display: table-cell; | |
| 12381 vertical-align: top; | |
| 12382 padding: 3px 0 3px 1em; | |
| 12383 font: 400 12px 'Montserrat', sans-serif; | |
| 12384 } | |
| 12385 | |
| 12386 .monospace { | |
| 12387 font-family: consolas, courier, monospace; | |
| 12388 font-size: 1em; | |
| 12389 line-height: 1.2em; | |
| 12390 white-space: nowrap; | |
| 12391 } | |
| 12392 | |
| 12393 a { | |
| 12394 color: #0489c3; | |
| 12395 text-decoration: none; | |
| 12396 } | |
| 12397 | |
| 12398 a:hover { | |
| 12399 text-decoration: underline; | |
| 12400 } | |
| 12401 | |
| 12402 em { | |
| 12403 color: inherit; | |
| 12404 font-style: italic; | |
| 12405 } | |
| 12406 | |
| 12407 b { | |
| 12408 color: inherit; | |
| 12409 font-weight: bold; | |
| 12410 } | |
| 12411 | |
| 12412 hr { | |
| 12413 margin-top: 20px; | |
| 12414 margin-bottom: 20px; | |
| 12415 border: 0; | |
| 12416 border-top: 1px solid #eee; | |
| 12417 height: 0; | |
| 12418 box-sizing: content-box; | |
| 12419 } | |
| 12420 | |
| 12421 .list-group { | |
| 12422 padding-left: 0; | |
| 12423 margin-bottom: 20px; | |
| 12424 } | |
| 12425 | |
| 12426 .list-group-item { | |
| 12427 position: relative; | |
| 12428 display: block; | |
| 12429 padding: 10px 15px; | |
| 12430 margin-bottom: -1px; | |
| 12431 background-color: #fff; | |
| 12432 } | |
| 12433 | |
| 12434 .list-group-item:first-child { | |
| 12435 /* rounded top corners */ | |
| 12436 border-top-right-radius:4px; | |
| 12437 border-top-left-radius:4px; | |
| 12438 } | |
| 12439 | |
| 12440 .list-group-item:last-child { | |
| 12441 margin-bottom: 0; | |
| 12442 /* rounded bottom corners */ | |
| 12443 border-bottom-right-radius: 4px; | |
| 12444 border-bottom-left-radius:4px; | |
| 12445 } | |
| 12446 | |
| 12447 /* Flex row container */ | |
| 12448 .flex-row { | |
| 12449 display: flex; | |
| 12450 flex-direction: row; | |
| 12451 } | |
| 12452 | |
| 12453 /* Flex column container */ | |
| 12454 .flex-column { | |
| 12455 display: flex; | |
| 12456 flex-direction: column; | |
| 12457 } | |
| 12458 | |
| 12459 .flex-item-fit { | |
| 12460 flex-grow: 1; | |
| 12461 flex-shrink: 1; | |
| 12462 flex-basis: auto; | |
| 12463 } | |
| 12464 | |
| 12465 .flex-item-no-shrink { | |
| 12466 flex-grow: 0; | |
| 12467 flex-shrink: 0; | |
| 12468 flex-basis: auto; | |
| 12469 } | |
| 12470 | |
| 12471 .flex-item-fill { | |
| 12472 flex-grow: 0; | |
| 12473 flex-shrink: 1; /* shrink when pressured */ | |
| 12474 flex-basis: 100%; /* try and take 100% */ | |
| 12475 } | |
| 12476 | |
| 12477 .flex-item-fixed-1-12 { | |
| 12478 flex-grow: 0; | |
| 12479 flex-shrink: 0; | |
| 12480 flex-basis: 8.3%; | |
| 12481 } | |
| 12482 | |
| 12483 .flex-item-fixed-2-12 { | |
| 12484 flex-grow: 0; | |
| 12485 flex-shrink: 0; | |
| 12486 flex-basis: 16.6%; | |
| 12487 } | |
| 12488 | |
| 12489 .flex-item-fixed-4-12 { | |
| 12490 flex-grow: 0; | |
| 12491 flex-shrink: 0; | |
| 12492 flex-basis: 33.3333%; | |
| 12493 } | |
| 12494 | |
| 12495 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 12496 flex-grow: 0; | |
| 12497 flex-shrink: 0; | |
| 12498 flex-basis: 50%; | |
| 12499 } | |
| 12500 | |
| 12501 .flex-item-fixed-8-12 { | |
| 12502 flex-grow: 0; | |
| 12503 flex-shrink: 0; | |
| 12504 flex-basis: 66.6666%; | |
| 12505 } | |
| 12506 | |
| 12507 .flex-item-fixed-9-12 { | |
| 12508 flex-grow: 0; | |
| 12509 flex-shrink: 0; | |
| 12510 flex-basis: 75%; | |
| 12511 } | |
| 12512 | |
| 12513 | |
| 12514 .flex-item-fixed-12-12 { | |
| 12515 flex-grow: 0; | |
| 12516 flex-shrink: 0; | |
| 12517 flex-basis: 100%; | |
| 12518 } | |
| 12519 | |
| 12520 .flex-item-10-percent { | |
| 12521 flex-grow: 0; | |
| 12522 flex-shrink: 0; | |
| 12523 flex-basis: 10%; | |
| 12524 } | |
| 12525 | |
| 12526 .flex-item-15-percent { | |
| 12527 flex-grow: 0; | |
| 12528 flex-shrink: 0; | |
| 12529 flex-basis: 15%; | |
| 12530 } | |
| 12531 | |
| 12532 .flex-item-20-percent { | |
| 12533 flex-grow: 0; | |
| 12534 flex-shrink: 0; | |
| 12535 flex-basis: 20%; | |
| 12536 } | |
| 12537 | |
| 12538 .flex-item-30-percent { | |
| 12539 flex-grow: 0; | |
| 12540 flex-shrink: 0; | |
| 12541 flex-basis: 30%; | |
| 12542 } | |
| 12543 | |
| 12544 .flex-item-40-percent { | |
| 12545 flex-grow: 0; | |
| 12546 flex-shrink: 0; | |
| 12547 flex-basis: 40%; | |
| 12548 } | |
| 12549 | |
| 12550 .flex-item-50-percent { | |
| 12551 flex-grow: 0; | |
| 12552 flex-shrink: 0; | |
| 12553 flex-basis: 50%; | |
| 12554 } | |
| 12555 | |
| 12556 .flex-item-60-percent { | |
| 12557 flex-grow: 0; | |
| 12558 flex-shrink: 0; | |
| 12559 flex-basis: 60%; | |
| 12560 } | |
| 12561 | |
| 12562 .flex-item-70-percent { | |
| 12563 flex-grow: 0; | |
| 12564 flex-shrink: 0; | |
| 12565 flex-basis: 70%; | |
| 12566 } | |
| 12567 | |
| 12568 .flex-item-80-percent { | |
| 12569 flex-grow: 0; | |
| 12570 flex-shrink: 0; | |
| 12571 flex-basis: 80%; | |
| 12572 } | |
| 12573 | |
| 12574 .well { | |
| 12575 min-height: 20px; | |
| 12576 padding: 19px; | |
| 12577 margin-bottom: 20px; | |
| 12578 background-color: #f5f5f5; | |
| 12579 border: 1px solid #e3e3e3; | |
| 12580 border-radius: 4px; | |
| 12581 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 12582 } | |
| 12583 | |
| 12584 .break-wrap { | |
| 12585 word-wrap: break-word; | |
| 12586 } | |
| 12587 </style> | |
| 12588 | |
| 12589 <nav-bar> | |
| 12590 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 12591 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 12592 </nav-bar> | |
| 12593 | |
| 12594 <div class="content"> | |
| 12595 <h1>WebSocket</h1> | |
| 12596 | |
| 12597 <br> | |
| 12598 | |
| 12599 <div class="memberList"> | |
| 12600 <div class="memberItem"> | |
| 12601 <div class="memberName">Socket</div> | |
| 12602 <div class="memberValue"><io-socket-ref ref="{{ webSocket['socket'] }}
"></io-socket-ref></div> | |
| 12603 </div> | |
| 12604 </div> | |
| 12605 </div> | |
| 12606 <br> | |
| 12607 <hr> | |
| 12608 </template> | |
| 12609 </polymer-element> | |
| 12610 | |
| 12611 <polymer-element name="io-random-access-file-ref" extends="service-ref"> | |
| 12612 <template> | |
| 12613 <style>/* Global styles */ | |
| 12614 * { | |
| 12615 margin: 0; | |
| 12616 padding: 0; | |
| 12617 font: 400 14px 'Montserrat', sans-serif; | |
| 12618 color: #333; | |
| 12619 box-sizing: border-box; | |
| 12620 } | |
| 12621 | |
| 12622 .content { | |
| 12623 padding-left: 10%; | |
| 12624 font: 400 14px 'Montserrat', sans-serif; | |
| 12625 } | |
| 12626 | |
| 12627 .content-centered { | |
| 12628 padding-left: 10%; | |
| 12629 padding-right: 10%; | |
| 12630 font: 400 14px 'Montserrat', sans-serif; | |
| 12631 } | |
| 12632 | |
| 12633 .content-centered-big { | |
| 12634 padding-left: 5%; | |
| 12635 padding-right: 5%; | |
| 12636 font: 400 14px 'Montserrat', sans-serif; | |
| 12637 } | |
| 12638 | |
| 12639 h1 { | |
| 12640 font: 400 18px 'Montserrat', sans-serif; | |
| 12641 } | |
| 12642 | |
| 12643 .memberList { | |
| 12644 display: table; | |
| 12645 } | |
| 12646 | |
| 12647 .memberItem { | |
| 12648 display: table-row; | |
| 12649 } | |
| 12650 | |
| 12651 .memberName, .memberValue { | |
| 12652 display: table-cell; | |
| 12653 vertical-align: top; | |
| 12654 padding: 3px 0 3px 1em; | |
| 12655 font: 400 14px 'Montserrat', sans-serif; | |
| 12656 } | |
| 12657 | |
| 12658 .memberSmall { | |
| 12659 display: table-cell; | |
| 12660 vertical-align: top; | |
| 12661 padding: 3px 0 3px 1em; | |
| 12662 font: 400 12px 'Montserrat', sans-serif; | |
| 12663 } | |
| 12664 | |
| 12665 .monospace { | |
| 12666 font-family: consolas, courier, monospace; | |
| 12667 font-size: 1em; | |
| 12668 line-height: 1.2em; | |
| 12669 white-space: nowrap; | |
| 12670 } | |
| 12671 | |
| 12672 a { | |
| 12673 color: #0489c3; | |
| 12674 text-decoration: none; | |
| 12675 } | |
| 12676 | |
| 12677 a:hover { | |
| 12678 text-decoration: underline; | |
| 12679 } | |
| 12680 | |
| 12681 em { | |
| 12682 color: inherit; | |
| 12683 font-style: italic; | |
| 12684 } | |
| 12685 | |
| 12686 b { | |
| 12687 color: inherit; | |
| 12688 font-weight: bold; | |
| 12689 } | |
| 12690 | |
| 12691 hr { | |
| 12692 margin-top: 20px; | |
| 12693 margin-bottom: 20px; | |
| 12694 border: 0; | |
| 12695 border-top: 1px solid #eee; | |
| 12696 height: 0; | |
| 12697 box-sizing: content-box; | |
| 12698 } | |
| 12699 | |
| 12700 .list-group { | |
| 12701 padding-left: 0; | |
| 12702 margin-bottom: 20px; | |
| 12703 } | |
| 12704 | |
| 12705 .list-group-item { | |
| 12706 position: relative; | |
| 12707 display: block; | |
| 12708 padding: 10px 15px; | |
| 12709 margin-bottom: -1px; | |
| 12710 background-color: #fff; | |
| 12711 } | |
| 12712 | |
| 12713 .list-group-item:first-child { | |
| 12714 /* rounded top corners */ | |
| 12715 border-top-right-radius:4px; | |
| 12716 border-top-left-radius:4px; | |
| 12717 } | |
| 12718 | |
| 12719 .list-group-item:last-child { | |
| 12720 margin-bottom: 0; | |
| 12721 /* rounded bottom corners */ | |
| 12722 border-bottom-right-radius: 4px; | |
| 12723 border-bottom-left-radius:4px; | |
| 12724 } | |
| 12725 | |
| 12726 /* Flex row container */ | |
| 12727 .flex-row { | |
| 12728 display: flex; | |
| 12729 flex-direction: row; | |
| 12730 } | |
| 12731 | |
| 12732 /* Flex column container */ | |
| 12733 .flex-column { | |
| 12734 display: flex; | |
| 12735 flex-direction: column; | |
| 12736 } | |
| 12737 | |
| 12738 .flex-item-fit { | |
| 12739 flex-grow: 1; | |
| 12740 flex-shrink: 1; | |
| 12741 flex-basis: auto; | |
| 12742 } | |
| 12743 | |
| 12744 .flex-item-no-shrink { | |
| 12745 flex-grow: 0; | |
| 12746 flex-shrink: 0; | |
| 12747 flex-basis: auto; | |
| 12748 } | |
| 12749 | |
| 12750 .flex-item-fill { | |
| 12751 flex-grow: 0; | |
| 12752 flex-shrink: 1; /* shrink when pressured */ | |
| 12753 flex-basis: 100%; /* try and take 100% */ | |
| 12754 } | |
| 12755 | |
| 12756 .flex-item-fixed-1-12 { | |
| 12757 flex-grow: 0; | |
| 12758 flex-shrink: 0; | |
| 12759 flex-basis: 8.3%; | |
| 12760 } | |
| 12761 | |
| 12762 .flex-item-fixed-2-12 { | |
| 12763 flex-grow: 0; | |
| 12764 flex-shrink: 0; | |
| 12765 flex-basis: 16.6%; | |
| 12766 } | |
| 12767 | |
| 12768 .flex-item-fixed-4-12 { | |
| 12769 flex-grow: 0; | |
| 12770 flex-shrink: 0; | |
| 12771 flex-basis: 33.3333%; | |
| 12772 } | |
| 12773 | |
| 12774 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 12775 flex-grow: 0; | |
| 12776 flex-shrink: 0; | |
| 12777 flex-basis: 50%; | |
| 12778 } | |
| 12779 | |
| 12780 .flex-item-fixed-8-12 { | |
| 12781 flex-grow: 0; | |
| 12782 flex-shrink: 0; | |
| 12783 flex-basis: 66.6666%; | |
| 12784 } | |
| 12785 | |
| 12786 .flex-item-fixed-9-12 { | |
| 12787 flex-grow: 0; | |
| 12788 flex-shrink: 0; | |
| 12789 flex-basis: 75%; | |
| 12790 } | |
| 12791 | |
| 12792 | |
| 12793 .flex-item-fixed-12-12 { | |
| 12794 flex-grow: 0; | |
| 12795 flex-shrink: 0; | |
| 12796 flex-basis: 100%; | |
| 12797 } | |
| 12798 | |
| 12799 .flex-item-10-percent { | |
| 12800 flex-grow: 0; | |
| 12801 flex-shrink: 0; | |
| 12802 flex-basis: 10%; | |
| 12803 } | |
| 12804 | |
| 12805 .flex-item-15-percent { | |
| 12806 flex-grow: 0; | |
| 12807 flex-shrink: 0; | |
| 12808 flex-basis: 15%; | |
| 12809 } | |
| 12810 | |
| 12811 .flex-item-20-percent { | |
| 12812 flex-grow: 0; | |
| 12813 flex-shrink: 0; | |
| 12814 flex-basis: 20%; | |
| 12815 } | |
| 12816 | |
| 12817 .flex-item-30-percent { | |
| 12818 flex-grow: 0; | |
| 12819 flex-shrink: 0; | |
| 12820 flex-basis: 30%; | |
| 12821 } | |
| 12822 | |
| 12823 .flex-item-40-percent { | |
| 12824 flex-grow: 0; | |
| 12825 flex-shrink: 0; | |
| 12826 flex-basis: 40%; | |
| 12827 } | |
| 12828 | |
| 12829 .flex-item-50-percent { | |
| 12830 flex-grow: 0; | |
| 12831 flex-shrink: 0; | |
| 12832 flex-basis: 50%; | |
| 12833 } | |
| 12834 | |
| 12835 .flex-item-60-percent { | |
| 12836 flex-grow: 0; | |
| 12837 flex-shrink: 0; | |
| 12838 flex-basis: 60%; | |
| 12839 } | |
| 12840 | |
| 12841 .flex-item-70-percent { | |
| 12842 flex-grow: 0; | |
| 12843 flex-shrink: 0; | |
| 12844 flex-basis: 70%; | |
| 12845 } | |
| 12846 | |
| 12847 .flex-item-80-percent { | |
| 12848 flex-grow: 0; | |
| 12849 flex-shrink: 0; | |
| 12850 flex-basis: 80%; | |
| 12851 } | |
| 12852 | |
| 12853 .well { | |
| 12854 min-height: 20px; | |
| 12855 padding: 19px; | |
| 12856 margin-bottom: 20px; | |
| 12857 background-color: #f5f5f5; | |
| 12858 border: 1px solid #e3e3e3; | |
| 12859 border-radius: 4px; | |
| 12860 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 12861 } | |
| 12862 | |
| 12863 .break-wrap { | |
| 12864 word-wrap: break-word; | |
| 12865 } | |
| 12866 </style> | |
| 12867 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 12868 </template> | |
| 12869 </polymer-element> | |
| 12870 | |
| 12871 <polymer-element name="io-random-access-file-list-view" extends="observatory-ele
ment"> | |
| 12872 <template> | |
| 12873 <style>/* Global styles */ | |
| 12874 * { | |
| 12875 margin: 0; | |
| 12876 padding: 0; | |
| 12877 font: 400 14px 'Montserrat', sans-serif; | |
| 12878 color: #333; | |
| 12879 box-sizing: border-box; | |
| 12880 } | |
| 12881 | |
| 12882 .content { | |
| 12883 padding-left: 10%; | |
| 12884 font: 400 14px 'Montserrat', sans-serif; | |
| 12885 } | |
| 12886 | |
| 12887 .content-centered { | |
| 12888 padding-left: 10%; | |
| 12889 padding-right: 10%; | |
| 12890 font: 400 14px 'Montserrat', sans-serif; | |
| 12891 } | |
| 12892 | |
| 12893 .content-centered-big { | |
| 12894 padding-left: 5%; | |
| 12895 padding-right: 5%; | |
| 12896 font: 400 14px 'Montserrat', sans-serif; | |
| 12897 } | |
| 12898 | |
| 12899 h1 { | |
| 12900 font: 400 18px 'Montserrat', sans-serif; | |
| 12901 } | |
| 12902 | |
| 12903 .memberList { | |
| 12904 display: table; | |
| 12905 } | |
| 12906 | |
| 12907 .memberItem { | |
| 12908 display: table-row; | |
| 12909 } | |
| 12910 | |
| 12911 .memberName, .memberValue { | |
| 12912 display: table-cell; | |
| 12913 vertical-align: top; | |
| 12914 padding: 3px 0 3px 1em; | |
| 12915 font: 400 14px 'Montserrat', sans-serif; | |
| 12916 } | |
| 12917 | |
| 12918 .memberSmall { | |
| 12919 display: table-cell; | |
| 12920 vertical-align: top; | |
| 12921 padding: 3px 0 3px 1em; | |
| 12922 font: 400 12px 'Montserrat', sans-serif; | |
| 12923 } | |
| 12924 | |
| 12925 .monospace { | |
| 12926 font-family: consolas, courier, monospace; | |
| 12927 font-size: 1em; | |
| 12928 line-height: 1.2em; | |
| 12929 white-space: nowrap; | |
| 12930 } | |
| 12931 | |
| 12932 a { | |
| 12933 color: #0489c3; | |
| 12934 text-decoration: none; | |
| 12935 } | |
| 12936 | |
| 12937 a:hover { | |
| 12938 text-decoration: underline; | |
| 12939 } | |
| 12940 | |
| 12941 em { | |
| 12942 color: inherit; | |
| 12943 font-style: italic; | |
| 12944 } | |
| 12945 | |
| 12946 b { | |
| 12947 color: inherit; | |
| 12948 font-weight: bold; | |
| 12949 } | |
| 12950 | |
| 12951 hr { | |
| 12952 margin-top: 20px; | |
| 12953 margin-bottom: 20px; | |
| 12954 border: 0; | |
| 12955 border-top: 1px solid #eee; | |
| 12956 height: 0; | |
| 12957 box-sizing: content-box; | |
| 12958 } | |
| 12959 | |
| 12960 .list-group { | |
| 12961 padding-left: 0; | |
| 12962 margin-bottom: 20px; | |
| 12963 } | |
| 12964 | |
| 12965 .list-group-item { | |
| 12966 position: relative; | |
| 12967 display: block; | |
| 12968 padding: 10px 15px; | |
| 12969 margin-bottom: -1px; | |
| 12970 background-color: #fff; | |
| 12971 } | |
| 12972 | |
| 12973 .list-group-item:first-child { | |
| 12974 /* rounded top corners */ | |
| 12975 border-top-right-radius:4px; | |
| 12976 border-top-left-radius:4px; | |
| 12977 } | |
| 12978 | |
| 12979 .list-group-item:last-child { | |
| 12980 margin-bottom: 0; | |
| 12981 /* rounded bottom corners */ | |
| 12982 border-bottom-right-radius: 4px; | |
| 12983 border-bottom-left-radius:4px; | |
| 12984 } | |
| 12985 | |
| 12986 /* Flex row container */ | |
| 12987 .flex-row { | |
| 12988 display: flex; | |
| 12989 flex-direction: row; | |
| 12990 } | |
| 12991 | |
| 12992 /* Flex column container */ | |
| 12993 .flex-column { | |
| 12994 display: flex; | |
| 12995 flex-direction: column; | |
| 12996 } | |
| 12997 | |
| 12998 .flex-item-fit { | |
| 12999 flex-grow: 1; | |
| 13000 flex-shrink: 1; | |
| 13001 flex-basis: auto; | |
| 13002 } | |
| 13003 | |
| 13004 .flex-item-no-shrink { | |
| 13005 flex-grow: 0; | |
| 13006 flex-shrink: 0; | |
| 13007 flex-basis: auto; | |
| 13008 } | |
| 13009 | |
| 13010 .flex-item-fill { | |
| 13011 flex-grow: 0; | |
| 13012 flex-shrink: 1; /* shrink when pressured */ | |
| 13013 flex-basis: 100%; /* try and take 100% */ | |
| 13014 } | |
| 13015 | |
| 13016 .flex-item-fixed-1-12 { | |
| 13017 flex-grow: 0; | |
| 13018 flex-shrink: 0; | |
| 13019 flex-basis: 8.3%; | |
| 13020 } | |
| 13021 | |
| 13022 .flex-item-fixed-2-12 { | |
| 13023 flex-grow: 0; | |
| 13024 flex-shrink: 0; | |
| 13025 flex-basis: 16.6%; | |
| 13026 } | |
| 13027 | |
| 13028 .flex-item-fixed-4-12 { | |
| 13029 flex-grow: 0; | |
| 13030 flex-shrink: 0; | |
| 13031 flex-basis: 33.3333%; | |
| 13032 } | |
| 13033 | |
| 13034 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 13035 flex-grow: 0; | |
| 13036 flex-shrink: 0; | |
| 13037 flex-basis: 50%; | |
| 13038 } | |
| 13039 | |
| 13040 .flex-item-fixed-8-12 { | |
| 13041 flex-grow: 0; | |
| 13042 flex-shrink: 0; | |
| 13043 flex-basis: 66.6666%; | |
| 13044 } | |
| 13045 | |
| 13046 .flex-item-fixed-9-12 { | |
| 13047 flex-grow: 0; | |
| 13048 flex-shrink: 0; | |
| 13049 flex-basis: 75%; | |
| 13050 } | |
| 13051 | |
| 13052 | |
| 13053 .flex-item-fixed-12-12 { | |
| 13054 flex-grow: 0; | |
| 13055 flex-shrink: 0; | |
| 13056 flex-basis: 100%; | |
| 13057 } | |
| 13058 | |
| 13059 .flex-item-10-percent { | |
| 13060 flex-grow: 0; | |
| 13061 flex-shrink: 0; | |
| 13062 flex-basis: 10%; | |
| 13063 } | |
| 13064 | |
| 13065 .flex-item-15-percent { | |
| 13066 flex-grow: 0; | |
| 13067 flex-shrink: 0; | |
| 13068 flex-basis: 15%; | |
| 13069 } | |
| 13070 | |
| 13071 .flex-item-20-percent { | |
| 13072 flex-grow: 0; | |
| 13073 flex-shrink: 0; | |
| 13074 flex-basis: 20%; | |
| 13075 } | |
| 13076 | |
| 13077 .flex-item-30-percent { | |
| 13078 flex-grow: 0; | |
| 13079 flex-shrink: 0; | |
| 13080 flex-basis: 30%; | |
| 13081 } | |
| 13082 | |
| 13083 .flex-item-40-percent { | |
| 13084 flex-grow: 0; | |
| 13085 flex-shrink: 0; | |
| 13086 flex-basis: 40%; | |
| 13087 } | |
| 13088 | |
| 13089 .flex-item-50-percent { | |
| 13090 flex-grow: 0; | |
| 13091 flex-shrink: 0; | |
| 13092 flex-basis: 50%; | |
| 13093 } | |
| 13094 | |
| 13095 .flex-item-60-percent { | |
| 13096 flex-grow: 0; | |
| 13097 flex-shrink: 0; | |
| 13098 flex-basis: 60%; | |
| 13099 } | |
| 13100 | |
| 13101 .flex-item-70-percent { | |
| 13102 flex-grow: 0; | |
| 13103 flex-shrink: 0; | |
| 13104 flex-basis: 70%; | |
| 13105 } | |
| 13106 | |
| 13107 .flex-item-80-percent { | |
| 13108 flex-grow: 0; | |
| 13109 flex-shrink: 0; | |
| 13110 flex-basis: 80%; | |
| 13111 } | |
| 13112 | |
| 13113 .well { | |
| 13114 min-height: 20px; | |
| 13115 padding: 19px; | |
| 13116 margin-bottom: 20px; | |
| 13117 background-color: #f5f5f5; | |
| 13118 border: 1px solid #e3e3e3; | |
| 13119 border-radius: 4px; | |
| 13120 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 13121 } | |
| 13122 | |
| 13123 .break-wrap { | |
| 13124 word-wrap: break-word; | |
| 13125 } | |
| 13126 </style> | |
| 13127 | |
| 13128 <nav-bar> | |
| 13129 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 13130 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 13131 </nav-bar> | |
| 13132 | |
| 13133 <div class="content"> | |
| 13134 <h1>Random Access Files</h1> | |
| 13135 | |
| 13136 <br> | |
| 13137 | |
| 13138 <ul class="list-group"> | |
| 13139 <template repeat="{{ file in list['members'] }}"> | |
| 13140 <li class="list-group-item"> | |
| 13141 <io-random-access-file-ref ref="{{ file }}"></io-random-access-file-
ref> | |
| 13142 </li> | |
| 13143 </template> | |
| 13144 </ul> | |
| 13145 </div> | |
| 13146 <br> | |
| 13147 <hr> | |
| 13148 </template> | |
| 13149 </polymer-element> | |
| 13150 | |
| 13151 <polymer-element name="io-random-access-file-view" extends="observatory-element"
> | |
| 13152 <template> | |
| 13153 <style>/* Global styles */ | |
| 13154 * { | |
| 13155 margin: 0; | |
| 13156 padding: 0; | |
| 13157 font: 400 14px 'Montserrat', sans-serif; | |
| 13158 color: #333; | |
| 13159 box-sizing: border-box; | |
| 13160 } | |
| 13161 | |
| 13162 .content { | |
| 13163 padding-left: 10%; | |
| 13164 font: 400 14px 'Montserrat', sans-serif; | |
| 13165 } | |
| 13166 | |
| 13167 .content-centered { | |
| 13168 padding-left: 10%; | |
| 13169 padding-right: 10%; | |
| 13170 font: 400 14px 'Montserrat', sans-serif; | |
| 13171 } | |
| 13172 | |
| 13173 .content-centered-big { | |
| 13174 padding-left: 5%; | |
| 13175 padding-right: 5%; | |
| 13176 font: 400 14px 'Montserrat', sans-serif; | |
| 13177 } | |
| 13178 | |
| 13179 h1 { | |
| 13180 font: 400 18px 'Montserrat', sans-serif; | |
| 13181 } | |
| 13182 | |
| 13183 .memberList { | |
| 13184 display: table; | |
| 13185 } | |
| 13186 | |
| 13187 .memberItem { | |
| 13188 display: table-row; | |
| 13189 } | |
| 13190 | |
| 13191 .memberName, .memberValue { | |
| 13192 display: table-cell; | |
| 13193 vertical-align: top; | |
| 13194 padding: 3px 0 3px 1em; | |
| 13195 font: 400 14px 'Montserrat', sans-serif; | |
| 13196 } | |
| 13197 | |
| 13198 .memberSmall { | |
| 13199 display: table-cell; | |
| 13200 vertical-align: top; | |
| 13201 padding: 3px 0 3px 1em; | |
| 13202 font: 400 12px 'Montserrat', sans-serif; | |
| 13203 } | |
| 13204 | |
| 13205 .monospace { | |
| 13206 font-family: consolas, courier, monospace; | |
| 13207 font-size: 1em; | |
| 13208 line-height: 1.2em; | |
| 13209 white-space: nowrap; | |
| 13210 } | |
| 13211 | |
| 13212 a { | |
| 13213 color: #0489c3; | |
| 13214 text-decoration: none; | |
| 13215 } | |
| 13216 | |
| 13217 a:hover { | |
| 13218 text-decoration: underline; | |
| 13219 } | |
| 13220 | |
| 13221 em { | |
| 13222 color: inherit; | |
| 13223 font-style: italic; | |
| 13224 } | |
| 13225 | |
| 13226 b { | |
| 13227 color: inherit; | |
| 13228 font-weight: bold; | |
| 13229 } | |
| 13230 | |
| 13231 hr { | |
| 13232 margin-top: 20px; | |
| 13233 margin-bottom: 20px; | |
| 13234 border: 0; | |
| 13235 border-top: 1px solid #eee; | |
| 13236 height: 0; | |
| 13237 box-sizing: content-box; | |
| 13238 } | |
| 13239 | |
| 13240 .list-group { | |
| 13241 padding-left: 0; | |
| 13242 margin-bottom: 20px; | |
| 13243 } | |
| 13244 | |
| 13245 .list-group-item { | |
| 13246 position: relative; | |
| 13247 display: block; | |
| 13248 padding: 10px 15px; | |
| 13249 margin-bottom: -1px; | |
| 13250 background-color: #fff; | |
| 13251 } | |
| 13252 | |
| 13253 .list-group-item:first-child { | |
| 13254 /* rounded top corners */ | |
| 13255 border-top-right-radius:4px; | |
| 13256 border-top-left-radius:4px; | |
| 13257 } | |
| 13258 | |
| 13259 .list-group-item:last-child { | |
| 13260 margin-bottom: 0; | |
| 13261 /* rounded bottom corners */ | |
| 13262 border-bottom-right-radius: 4px; | |
| 13263 border-bottom-left-radius:4px; | |
| 13264 } | |
| 13265 | |
| 13266 /* Flex row container */ | |
| 13267 .flex-row { | |
| 13268 display: flex; | |
| 13269 flex-direction: row; | |
| 13270 } | |
| 13271 | |
| 13272 /* Flex column container */ | |
| 13273 .flex-column { | |
| 13274 display: flex; | |
| 13275 flex-direction: column; | |
| 13276 } | |
| 13277 | |
| 13278 .flex-item-fit { | |
| 13279 flex-grow: 1; | |
| 13280 flex-shrink: 1; | |
| 13281 flex-basis: auto; | |
| 13282 } | |
| 13283 | |
| 13284 .flex-item-no-shrink { | |
| 13285 flex-grow: 0; | |
| 13286 flex-shrink: 0; | |
| 13287 flex-basis: auto; | |
| 13288 } | |
| 13289 | |
| 13290 .flex-item-fill { | |
| 13291 flex-grow: 0; | |
| 13292 flex-shrink: 1; /* shrink when pressured */ | |
| 13293 flex-basis: 100%; /* try and take 100% */ | |
| 13294 } | |
| 13295 | |
| 13296 .flex-item-fixed-1-12 { | |
| 13297 flex-grow: 0; | |
| 13298 flex-shrink: 0; | |
| 13299 flex-basis: 8.3%; | |
| 13300 } | |
| 13301 | |
| 13302 .flex-item-fixed-2-12 { | |
| 13303 flex-grow: 0; | |
| 13304 flex-shrink: 0; | |
| 13305 flex-basis: 16.6%; | |
| 13306 } | |
| 13307 | |
| 13308 .flex-item-fixed-4-12 { | |
| 13309 flex-grow: 0; | |
| 13310 flex-shrink: 0; | |
| 13311 flex-basis: 33.3333%; | |
| 13312 } | |
| 13313 | |
| 13314 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 13315 flex-grow: 0; | |
| 13316 flex-shrink: 0; | |
| 13317 flex-basis: 50%; | |
| 13318 } | |
| 13319 | |
| 13320 .flex-item-fixed-8-12 { | |
| 13321 flex-grow: 0; | |
| 13322 flex-shrink: 0; | |
| 13323 flex-basis: 66.6666%; | |
| 13324 } | |
| 13325 | |
| 13326 .flex-item-fixed-9-12 { | |
| 13327 flex-grow: 0; | |
| 13328 flex-shrink: 0; | |
| 13329 flex-basis: 75%; | |
| 13330 } | |
| 13331 | |
| 13332 | |
| 13333 .flex-item-fixed-12-12 { | |
| 13334 flex-grow: 0; | |
| 13335 flex-shrink: 0; | |
| 13336 flex-basis: 100%; | |
| 13337 } | |
| 13338 | |
| 13339 .flex-item-10-percent { | |
| 13340 flex-grow: 0; | |
| 13341 flex-shrink: 0; | |
| 13342 flex-basis: 10%; | |
| 13343 } | |
| 13344 | |
| 13345 .flex-item-15-percent { | |
| 13346 flex-grow: 0; | |
| 13347 flex-shrink: 0; | |
| 13348 flex-basis: 15%; | |
| 13349 } | |
| 13350 | |
| 13351 .flex-item-20-percent { | |
| 13352 flex-grow: 0; | |
| 13353 flex-shrink: 0; | |
| 13354 flex-basis: 20%; | |
| 13355 } | |
| 13356 | |
| 13357 .flex-item-30-percent { | |
| 13358 flex-grow: 0; | |
| 13359 flex-shrink: 0; | |
| 13360 flex-basis: 30%; | |
| 13361 } | |
| 13362 | |
| 13363 .flex-item-40-percent { | |
| 13364 flex-grow: 0; | |
| 13365 flex-shrink: 0; | |
| 13366 flex-basis: 40%; | |
| 13367 } | |
| 13368 | |
| 13369 .flex-item-50-percent { | |
| 13370 flex-grow: 0; | |
| 13371 flex-shrink: 0; | |
| 13372 flex-basis: 50%; | |
| 13373 } | |
| 13374 | |
| 13375 .flex-item-60-percent { | |
| 13376 flex-grow: 0; | |
| 13377 flex-shrink: 0; | |
| 13378 flex-basis: 60%; | |
| 13379 } | |
| 13380 | |
| 13381 .flex-item-70-percent { | |
| 13382 flex-grow: 0; | |
| 13383 flex-shrink: 0; | |
| 13384 flex-basis: 70%; | |
| 13385 } | |
| 13386 | |
| 13387 .flex-item-80-percent { | |
| 13388 flex-grow: 0; | |
| 13389 flex-shrink: 0; | |
| 13390 flex-basis: 80%; | |
| 13391 } | |
| 13392 | |
| 13393 .well { | |
| 13394 min-height: 20px; | |
| 13395 padding: 19px; | |
| 13396 margin-bottom: 20px; | |
| 13397 background-color: #f5f5f5; | |
| 13398 border: 1px solid #e3e3e3; | |
| 13399 border-radius: 4px; | |
| 13400 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 13401 } | |
| 13402 | |
| 13403 .break-wrap { | |
| 13404 word-wrap: break-word; | |
| 13405 } | |
| 13406 </style> | |
| 13407 | |
| 13408 <nav-bar> | |
| 13409 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 13410 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 13411 </nav-bar> | |
| 13412 | |
| 13413 <div class="content"> | |
| 13414 <h1>Random Access File</h1> | |
| 13415 | |
| 13416 <br> | |
| 13417 | |
| 13418 <div class="memberList"> | |
| 13419 <div class="memberItem"> | |
| 13420 <div class="memberName">Path</div> | |
| 13421 <div class="memberValue">{{ file['name'] }}</div> | |
| 13422 </div> | |
| 13423 <div class="memberItem"> | |
| 13424 <div class="memberName">Pending Operation</div> | |
| 13425 <div class="memberValue">{{ file['asyncDispatched'] }}</div> | |
| 13426 </div> | |
| 13427 <div class="memberItem"> | |
| 13428 <div class="memberName">File Descriptor</div> | |
| 13429 <div class="memberValue">{{ file['fd'] }}</div> | |
| 13430 </div> | |
| 13431 </div> | |
| 13432 </div> | |
| 13433 <br> | |
| 13434 <hr> | |
| 13435 </template> | |
| 13436 </polymer-element> | |
| 13437 | |
| 13438 <polymer-element name="io-process-list-view" extends="observatory-element"> | |
| 13439 <template> | |
| 13440 <style>/* Global styles */ | |
| 13441 * { | |
| 13442 margin: 0; | |
| 13443 padding: 0; | |
| 13444 font: 400 14px 'Montserrat', sans-serif; | |
| 13445 color: #333; | |
| 13446 box-sizing: border-box; | |
| 13447 } | |
| 13448 | |
| 13449 .content { | |
| 13450 padding-left: 10%; | |
| 13451 font: 400 14px 'Montserrat', sans-serif; | |
| 13452 } | |
| 13453 | |
| 13454 .content-centered { | |
| 13455 padding-left: 10%; | |
| 13456 padding-right: 10%; | |
| 13457 font: 400 14px 'Montserrat', sans-serif; | |
| 13458 } | |
| 13459 | |
| 13460 .content-centered-big { | |
| 13461 padding-left: 5%; | |
| 13462 padding-right: 5%; | |
| 13463 font: 400 14px 'Montserrat', sans-serif; | |
| 13464 } | |
| 13465 | |
| 13466 h1 { | |
| 13467 font: 400 18px 'Montserrat', sans-serif; | |
| 13468 } | |
| 13469 | |
| 13470 .memberList { | |
| 13471 display: table; | |
| 13472 } | |
| 13473 | |
| 13474 .memberItem { | |
| 13475 display: table-row; | |
| 13476 } | |
| 13477 | |
| 13478 .memberName, .memberValue { | |
| 13479 display: table-cell; | |
| 13480 vertical-align: top; | |
| 13481 padding: 3px 0 3px 1em; | |
| 13482 font: 400 14px 'Montserrat', sans-serif; | |
| 13483 } | |
| 13484 | |
| 13485 .memberSmall { | |
| 13486 display: table-cell; | |
| 13487 vertical-align: top; | |
| 13488 padding: 3px 0 3px 1em; | |
| 13489 font: 400 12px 'Montserrat', sans-serif; | |
| 13490 } | |
| 13491 | |
| 13492 .monospace { | |
| 13493 font-family: consolas, courier, monospace; | |
| 13494 font-size: 1em; | |
| 13495 line-height: 1.2em; | |
| 13496 white-space: nowrap; | |
| 13497 } | |
| 13498 | |
| 13499 a { | |
| 13500 color: #0489c3; | |
| 13501 text-decoration: none; | |
| 13502 } | |
| 13503 | |
| 13504 a:hover { | |
| 13505 text-decoration: underline; | |
| 13506 } | |
| 13507 | |
| 13508 em { | |
| 13509 color: inherit; | |
| 13510 font-style: italic; | |
| 13511 } | |
| 13512 | |
| 13513 b { | |
| 13514 color: inherit; | |
| 13515 font-weight: bold; | |
| 13516 } | |
| 13517 | |
| 13518 hr { | |
| 13519 margin-top: 20px; | |
| 13520 margin-bottom: 20px; | |
| 13521 border: 0; | |
| 13522 border-top: 1px solid #eee; | |
| 13523 height: 0; | |
| 13524 box-sizing: content-box; | |
| 13525 } | |
| 13526 | |
| 13527 .list-group { | |
| 13528 padding-left: 0; | |
| 13529 margin-bottom: 20px; | |
| 13530 } | |
| 13531 | |
| 13532 .list-group-item { | |
| 13533 position: relative; | |
| 13534 display: block; | |
| 13535 padding: 10px 15px; | |
| 13536 margin-bottom: -1px; | |
| 13537 background-color: #fff; | |
| 13538 } | |
| 13539 | |
| 13540 .list-group-item:first-child { | |
| 13541 /* rounded top corners */ | |
| 13542 border-top-right-radius:4px; | |
| 13543 border-top-left-radius:4px; | |
| 13544 } | |
| 13545 | |
| 13546 .list-group-item:last-child { | |
| 13547 margin-bottom: 0; | |
| 13548 /* rounded bottom corners */ | |
| 13549 border-bottom-right-radius: 4px; | |
| 13550 border-bottom-left-radius:4px; | |
| 13551 } | |
| 13552 | |
| 13553 /* Flex row container */ | |
| 13554 .flex-row { | |
| 13555 display: flex; | |
| 13556 flex-direction: row; | |
| 13557 } | |
| 13558 | |
| 13559 /* Flex column container */ | |
| 13560 .flex-column { | |
| 13561 display: flex; | |
| 13562 flex-direction: column; | |
| 13563 } | |
| 13564 | |
| 13565 .flex-item-fit { | |
| 13566 flex-grow: 1; | |
| 13567 flex-shrink: 1; | |
| 13568 flex-basis: auto; | |
| 13569 } | |
| 13570 | |
| 13571 .flex-item-no-shrink { | |
| 13572 flex-grow: 0; | |
| 13573 flex-shrink: 0; | |
| 13574 flex-basis: auto; | |
| 13575 } | |
| 13576 | |
| 13577 .flex-item-fill { | |
| 13578 flex-grow: 0; | |
| 13579 flex-shrink: 1; /* shrink when pressured */ | |
| 13580 flex-basis: 100%; /* try and take 100% */ | |
| 13581 } | |
| 13582 | |
| 13583 .flex-item-fixed-1-12 { | |
| 13584 flex-grow: 0; | |
| 13585 flex-shrink: 0; | |
| 13586 flex-basis: 8.3%; | |
| 13587 } | |
| 13588 | |
| 13589 .flex-item-fixed-2-12 { | |
| 13590 flex-grow: 0; | |
| 13591 flex-shrink: 0; | |
| 13592 flex-basis: 16.6%; | |
| 13593 } | |
| 13594 | |
| 13595 .flex-item-fixed-4-12 { | |
| 13596 flex-grow: 0; | |
| 13597 flex-shrink: 0; | |
| 13598 flex-basis: 33.3333%; | |
| 13599 } | |
| 13600 | |
| 13601 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 13602 flex-grow: 0; | |
| 13603 flex-shrink: 0; | |
| 13604 flex-basis: 50%; | |
| 13605 } | |
| 13606 | |
| 13607 .flex-item-fixed-8-12 { | |
| 13608 flex-grow: 0; | |
| 13609 flex-shrink: 0; | |
| 13610 flex-basis: 66.6666%; | |
| 13611 } | |
| 13612 | |
| 13613 .flex-item-fixed-9-12 { | |
| 13614 flex-grow: 0; | |
| 13615 flex-shrink: 0; | |
| 13616 flex-basis: 75%; | |
| 13617 } | |
| 13618 | |
| 13619 | |
| 13620 .flex-item-fixed-12-12 { | |
| 13621 flex-grow: 0; | |
| 13622 flex-shrink: 0; | |
| 13623 flex-basis: 100%; | |
| 13624 } | |
| 13625 | |
| 13626 .flex-item-10-percent { | |
| 13627 flex-grow: 0; | |
| 13628 flex-shrink: 0; | |
| 13629 flex-basis: 10%; | |
| 13630 } | |
| 13631 | |
| 13632 .flex-item-15-percent { | |
| 13633 flex-grow: 0; | |
| 13634 flex-shrink: 0; | |
| 13635 flex-basis: 15%; | |
| 13636 } | |
| 13637 | |
| 13638 .flex-item-20-percent { | |
| 13639 flex-grow: 0; | |
| 13640 flex-shrink: 0; | |
| 13641 flex-basis: 20%; | |
| 13642 } | |
| 13643 | |
| 13644 .flex-item-30-percent { | |
| 13645 flex-grow: 0; | |
| 13646 flex-shrink: 0; | |
| 13647 flex-basis: 30%; | |
| 13648 } | |
| 13649 | |
| 13650 .flex-item-40-percent { | |
| 13651 flex-grow: 0; | |
| 13652 flex-shrink: 0; | |
| 13653 flex-basis: 40%; | |
| 13654 } | |
| 13655 | |
| 13656 .flex-item-50-percent { | |
| 13657 flex-grow: 0; | |
| 13658 flex-shrink: 0; | |
| 13659 flex-basis: 50%; | |
| 13660 } | |
| 13661 | |
| 13662 .flex-item-60-percent { | |
| 13663 flex-grow: 0; | |
| 13664 flex-shrink: 0; | |
| 13665 flex-basis: 60%; | |
| 13666 } | |
| 13667 | |
| 13668 .flex-item-70-percent { | |
| 13669 flex-grow: 0; | |
| 13670 flex-shrink: 0; | |
| 13671 flex-basis: 70%; | |
| 13672 } | |
| 13673 | |
| 13674 .flex-item-80-percent { | |
| 13675 flex-grow: 0; | |
| 13676 flex-shrink: 0; | |
| 13677 flex-basis: 80%; | |
| 13678 } | |
| 13679 | |
| 13680 .well { | |
| 13681 min-height: 20px; | |
| 13682 padding: 19px; | |
| 13683 margin-bottom: 20px; | |
| 13684 background-color: #f5f5f5; | |
| 13685 border: 1px solid #e3e3e3; | |
| 13686 border-radius: 4px; | |
| 13687 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 13688 } | |
| 13689 | |
| 13690 .break-wrap { | |
| 13691 word-wrap: break-word; | |
| 13692 } | |
| 13693 </style> | |
| 13694 | |
| 13695 <nav-bar> | |
| 13696 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 13697 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 13698 </nav-bar> | |
| 13699 | |
| 13700 <div class="content"> | |
| 13701 <h1>Processes</h1> | |
| 13702 | |
| 13703 <br> | |
| 13704 | |
| 13705 <ul class="list-group"> | |
| 13706 <template repeat="{{ process in list['members'] }}"> | |
| 13707 <li class="list-group-item"> | |
| 13708 <io-process-ref ref="{{ process }}"></io-process-ref> | |
| 13709 </li> | |
| 13710 </template> | |
| 13711 </ul> | |
| 13712 </div> | |
| 13713 <br> | |
| 13714 <hr> | |
| 13715 </template> | |
| 13716 </polymer-element> | |
| 13717 | |
| 13718 <polymer-element name="io-process-ref" extends="service-ref"> | |
| 13719 <template> | |
| 13720 <style>/* Global styles */ | |
| 13721 * { | |
| 13722 margin: 0; | |
| 13723 padding: 0; | |
| 13724 font: 400 14px 'Montserrat', sans-serif; | |
| 13725 color: #333; | |
| 13726 box-sizing: border-box; | |
| 13727 } | |
| 13728 | |
| 13729 .content { | |
| 13730 padding-left: 10%; | |
| 13731 font: 400 14px 'Montserrat', sans-serif; | |
| 13732 } | |
| 13733 | |
| 13734 .content-centered { | |
| 13735 padding-left: 10%; | |
| 13736 padding-right: 10%; | |
| 13737 font: 400 14px 'Montserrat', sans-serif; | |
| 13738 } | |
| 13739 | |
| 13740 .content-centered-big { | |
| 13741 padding-left: 5%; | |
| 13742 padding-right: 5%; | |
| 13743 font: 400 14px 'Montserrat', sans-serif; | |
| 13744 } | |
| 13745 | |
| 13746 h1 { | |
| 13747 font: 400 18px 'Montserrat', sans-serif; | |
| 13748 } | |
| 13749 | |
| 13750 .memberList { | |
| 13751 display: table; | |
| 13752 } | |
| 13753 | |
| 13754 .memberItem { | |
| 13755 display: table-row; | |
| 13756 } | |
| 13757 | |
| 13758 .memberName, .memberValue { | |
| 13759 display: table-cell; | |
| 13760 vertical-align: top; | |
| 13761 padding: 3px 0 3px 1em; | |
| 13762 font: 400 14px 'Montserrat', sans-serif; | |
| 13763 } | |
| 13764 | |
| 13765 .memberSmall { | |
| 13766 display: table-cell; | |
| 13767 vertical-align: top; | |
| 13768 padding: 3px 0 3px 1em; | |
| 13769 font: 400 12px 'Montserrat', sans-serif; | |
| 13770 } | |
| 13771 | |
| 13772 .monospace { | |
| 13773 font-family: consolas, courier, monospace; | |
| 13774 font-size: 1em; | |
| 13775 line-height: 1.2em; | |
| 13776 white-space: nowrap; | |
| 13777 } | |
| 13778 | |
| 13779 a { | |
| 13780 color: #0489c3; | |
| 13781 text-decoration: none; | |
| 13782 } | |
| 13783 | |
| 13784 a:hover { | |
| 13785 text-decoration: underline; | |
| 13786 } | |
| 13787 | |
| 13788 em { | |
| 13789 color: inherit; | |
| 13790 font-style: italic; | |
| 13791 } | |
| 13792 | |
| 13793 b { | |
| 13794 color: inherit; | |
| 13795 font-weight: bold; | |
| 13796 } | |
| 13797 | |
| 13798 hr { | |
| 13799 margin-top: 20px; | |
| 13800 margin-bottom: 20px; | |
| 13801 border: 0; | |
| 13802 border-top: 1px solid #eee; | |
| 13803 height: 0; | |
| 13804 box-sizing: content-box; | |
| 13805 } | |
| 13806 | |
| 13807 .list-group { | |
| 13808 padding-left: 0; | |
| 13809 margin-bottom: 20px; | |
| 13810 } | |
| 13811 | |
| 13812 .list-group-item { | |
| 13813 position: relative; | |
| 13814 display: block; | |
| 13815 padding: 10px 15px; | |
| 13816 margin-bottom: -1px; | |
| 13817 background-color: #fff; | |
| 13818 } | |
| 13819 | |
| 13820 .list-group-item:first-child { | |
| 13821 /* rounded top corners */ | |
| 13822 border-top-right-radius:4px; | |
| 13823 border-top-left-radius:4px; | |
| 13824 } | |
| 13825 | |
| 13826 .list-group-item:last-child { | |
| 13827 margin-bottom: 0; | |
| 13828 /* rounded bottom corners */ | |
| 13829 border-bottom-right-radius: 4px; | |
| 13830 border-bottom-left-radius:4px; | |
| 13831 } | |
| 13832 | |
| 13833 /* Flex row container */ | |
| 13834 .flex-row { | |
| 13835 display: flex; | |
| 13836 flex-direction: row; | |
| 13837 } | |
| 13838 | |
| 13839 /* Flex column container */ | |
| 13840 .flex-column { | |
| 13841 display: flex; | |
| 13842 flex-direction: column; | |
| 13843 } | |
| 13844 | |
| 13845 .flex-item-fit { | |
| 13846 flex-grow: 1; | |
| 13847 flex-shrink: 1; | |
| 13848 flex-basis: auto; | |
| 13849 } | |
| 13850 | |
| 13851 .flex-item-no-shrink { | |
| 13852 flex-grow: 0; | |
| 13853 flex-shrink: 0; | |
| 13854 flex-basis: auto; | |
| 13855 } | |
| 13856 | |
| 13857 .flex-item-fill { | |
| 13858 flex-grow: 0; | |
| 13859 flex-shrink: 1; /* shrink when pressured */ | |
| 13860 flex-basis: 100%; /* try and take 100% */ | |
| 13861 } | |
| 13862 | |
| 13863 .flex-item-fixed-1-12 { | |
| 13864 flex-grow: 0; | |
| 13865 flex-shrink: 0; | |
| 13866 flex-basis: 8.3%; | |
| 13867 } | |
| 13868 | |
| 13869 .flex-item-fixed-2-12 { | |
| 13870 flex-grow: 0; | |
| 13871 flex-shrink: 0; | |
| 13872 flex-basis: 16.6%; | |
| 13873 } | |
| 13874 | |
| 13875 .flex-item-fixed-4-12 { | |
| 13876 flex-grow: 0; | |
| 13877 flex-shrink: 0; | |
| 13878 flex-basis: 33.3333%; | |
| 13879 } | |
| 13880 | |
| 13881 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 13882 flex-grow: 0; | |
| 13883 flex-shrink: 0; | |
| 13884 flex-basis: 50%; | |
| 13885 } | |
| 13886 | |
| 13887 .flex-item-fixed-8-12 { | |
| 13888 flex-grow: 0; | |
| 13889 flex-shrink: 0; | |
| 13890 flex-basis: 66.6666%; | |
| 13891 } | |
| 13892 | |
| 13893 .flex-item-fixed-9-12 { | |
| 13894 flex-grow: 0; | |
| 13895 flex-shrink: 0; | |
| 13896 flex-basis: 75%; | |
| 13897 } | |
| 13898 | |
| 13899 | |
| 13900 .flex-item-fixed-12-12 { | |
| 13901 flex-grow: 0; | |
| 13902 flex-shrink: 0; | |
| 13903 flex-basis: 100%; | |
| 13904 } | |
| 13905 | |
| 13906 .flex-item-10-percent { | |
| 13907 flex-grow: 0; | |
| 13908 flex-shrink: 0; | |
| 13909 flex-basis: 10%; | |
| 13910 } | |
| 13911 | |
| 13912 .flex-item-15-percent { | |
| 13913 flex-grow: 0; | |
| 13914 flex-shrink: 0; | |
| 13915 flex-basis: 15%; | |
| 13916 } | |
| 13917 | |
| 13918 .flex-item-20-percent { | |
| 13919 flex-grow: 0; | |
| 13920 flex-shrink: 0; | |
| 13921 flex-basis: 20%; | |
| 13922 } | |
| 13923 | |
| 13924 .flex-item-30-percent { | |
| 13925 flex-grow: 0; | |
| 13926 flex-shrink: 0; | |
| 13927 flex-basis: 30%; | |
| 13928 } | |
| 13929 | |
| 13930 .flex-item-40-percent { | |
| 13931 flex-grow: 0; | |
| 13932 flex-shrink: 0; | |
| 13933 flex-basis: 40%; | |
| 13934 } | |
| 13935 | |
| 13936 .flex-item-50-percent { | |
| 13937 flex-grow: 0; | |
| 13938 flex-shrink: 0; | |
| 13939 flex-basis: 50%; | |
| 13940 } | |
| 13941 | |
| 13942 .flex-item-60-percent { | |
| 13943 flex-grow: 0; | |
| 13944 flex-shrink: 0; | |
| 13945 flex-basis: 60%; | |
| 13946 } | |
| 13947 | |
| 13948 .flex-item-70-percent { | |
| 13949 flex-grow: 0; | |
| 13950 flex-shrink: 0; | |
| 13951 flex-basis: 70%; | |
| 13952 } | |
| 13953 | |
| 13954 .flex-item-80-percent { | |
| 13955 flex-grow: 0; | |
| 13956 flex-shrink: 0; | |
| 13957 flex-basis: 80%; | |
| 13958 } | |
| 13959 | |
| 13960 .well { | |
| 13961 min-height: 20px; | |
| 13962 padding: 19px; | |
| 13963 margin-bottom: 20px; | |
| 13964 background-color: #f5f5f5; | |
| 13965 border: 1px solid #e3e3e3; | |
| 13966 border-radius: 4px; | |
| 13967 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 13968 } | |
| 13969 | |
| 13970 .break-wrap { | |
| 13971 word-wrap: break-word; | |
| 13972 } | |
| 13973 </style> | |
| 13974 <template if="{{ small }}"> | |
| 13975 <a on-click="{{ goto }}" _href="{{ url }}">{{ name }}</a> | |
| 13976 </template> | |
| 13977 <template if="{{ !small }}"> | |
| 13978 <a on-click="{{ goto }}" _href="{{ url }}">({{ ref['pid'] }}) {{ name }} {
{ ref['arguments'] }}</a> | |
| 13979 </template> | |
| 13980 </template> | |
| 13981 </polymer-element> | |
| 13982 | |
| 13983 <polymer-element name="io-process-view" extends="observatory-element"> | |
| 13984 <template> | |
| 13985 <style>/* Global styles */ | |
| 13986 * { | |
| 13987 margin: 0; | |
| 13988 padding: 0; | |
| 13989 font: 400 14px 'Montserrat', sans-serif; | |
| 13990 color: #333; | |
| 13991 box-sizing: border-box; | |
| 13992 } | |
| 13993 | |
| 13994 .content { | |
| 13995 padding-left: 10%; | |
| 13996 font: 400 14px 'Montserrat', sans-serif; | |
| 13997 } | |
| 13998 | |
| 13999 .content-centered { | |
| 14000 padding-left: 10%; | |
| 14001 padding-right: 10%; | |
| 14002 font: 400 14px 'Montserrat', sans-serif; | |
| 14003 } | |
| 14004 | |
| 14005 .content-centered-big { | |
| 14006 padding-left: 5%; | |
| 14007 padding-right: 5%; | |
| 14008 font: 400 14px 'Montserrat', sans-serif; | |
| 14009 } | |
| 14010 | |
| 14011 h1 { | |
| 14012 font: 400 18px 'Montserrat', sans-serif; | |
| 14013 } | |
| 14014 | |
| 14015 .memberList { | |
| 14016 display: table; | |
| 14017 } | |
| 14018 | |
| 14019 .memberItem { | |
| 14020 display: table-row; | |
| 14021 } | |
| 14022 | |
| 14023 .memberName, .memberValue { | |
| 14024 display: table-cell; | |
| 14025 vertical-align: top; | |
| 14026 padding: 3px 0 3px 1em; | |
| 14027 font: 400 14px 'Montserrat', sans-serif; | |
| 14028 } | |
| 14029 | |
| 14030 .memberSmall { | |
| 14031 display: table-cell; | |
| 14032 vertical-align: top; | |
| 14033 padding: 3px 0 3px 1em; | |
| 14034 font: 400 12px 'Montserrat', sans-serif; | |
| 14035 } | |
| 14036 | |
| 14037 .monospace { | |
| 14038 font-family: consolas, courier, monospace; | |
| 14039 font-size: 1em; | |
| 14040 line-height: 1.2em; | |
| 14041 white-space: nowrap; | |
| 14042 } | |
| 14043 | |
| 14044 a { | |
| 14045 color: #0489c3; | |
| 14046 text-decoration: none; | |
| 14047 } | |
| 14048 | |
| 14049 a:hover { | |
| 14050 text-decoration: underline; | |
| 14051 } | |
| 14052 | |
| 14053 em { | |
| 14054 color: inherit; | |
| 14055 font-style: italic; | |
| 14056 } | |
| 14057 | |
| 14058 b { | |
| 14059 color: inherit; | |
| 14060 font-weight: bold; | |
| 14061 } | |
| 14062 | |
| 14063 hr { | |
| 14064 margin-top: 20px; | |
| 14065 margin-bottom: 20px; | |
| 14066 border: 0; | |
| 14067 border-top: 1px solid #eee; | |
| 14068 height: 0; | |
| 14069 box-sizing: content-box; | |
| 14070 } | |
| 14071 | |
| 14072 .list-group { | |
| 14073 padding-left: 0; | |
| 14074 margin-bottom: 20px; | |
| 14075 } | |
| 14076 | |
| 14077 .list-group-item { | |
| 14078 position: relative; | |
| 14079 display: block; | |
| 14080 padding: 10px 15px; | |
| 14081 margin-bottom: -1px; | |
| 14082 background-color: #fff; | |
| 14083 } | |
| 14084 | |
| 14085 .list-group-item:first-child { | |
| 14086 /* rounded top corners */ | |
| 14087 border-top-right-radius:4px; | |
| 14088 border-top-left-radius:4px; | |
| 14089 } | |
| 14090 | |
| 14091 .list-group-item:last-child { | |
| 14092 margin-bottom: 0; | |
| 14093 /* rounded bottom corners */ | |
| 14094 border-bottom-right-radius: 4px; | |
| 14095 border-bottom-left-radius:4px; | |
| 14096 } | |
| 14097 | |
| 14098 /* Flex row container */ | |
| 14099 .flex-row { | |
| 14100 display: flex; | |
| 14101 flex-direction: row; | |
| 14102 } | |
| 14103 | |
| 14104 /* Flex column container */ | |
| 14105 .flex-column { | |
| 14106 display: flex; | |
| 14107 flex-direction: column; | |
| 14108 } | |
| 14109 | |
| 14110 .flex-item-fit { | |
| 14111 flex-grow: 1; | |
| 14112 flex-shrink: 1; | |
| 14113 flex-basis: auto; | |
| 14114 } | |
| 14115 | |
| 14116 .flex-item-no-shrink { | |
| 14117 flex-grow: 0; | |
| 14118 flex-shrink: 0; | |
| 14119 flex-basis: auto; | |
| 14120 } | |
| 14121 | |
| 14122 .flex-item-fill { | |
| 14123 flex-grow: 0; | |
| 14124 flex-shrink: 1; /* shrink when pressured */ | |
| 14125 flex-basis: 100%; /* try and take 100% */ | |
| 14126 } | |
| 14127 | |
| 14128 .flex-item-fixed-1-12 { | |
| 14129 flex-grow: 0; | |
| 14130 flex-shrink: 0; | |
| 14131 flex-basis: 8.3%; | |
| 14132 } | |
| 14133 | |
| 14134 .flex-item-fixed-2-12 { | |
| 14135 flex-grow: 0; | |
| 14136 flex-shrink: 0; | |
| 14137 flex-basis: 16.6%; | |
| 14138 } | |
| 14139 | |
| 14140 .flex-item-fixed-4-12 { | |
| 14141 flex-grow: 0; | |
| 14142 flex-shrink: 0; | |
| 14143 flex-basis: 33.3333%; | |
| 14144 } | |
| 14145 | |
| 14146 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 14147 flex-grow: 0; | |
| 14148 flex-shrink: 0; | |
| 14149 flex-basis: 50%; | |
| 14150 } | |
| 14151 | |
| 14152 .flex-item-fixed-8-12 { | |
| 14153 flex-grow: 0; | |
| 14154 flex-shrink: 0; | |
| 14155 flex-basis: 66.6666%; | |
| 14156 } | |
| 14157 | |
| 14158 .flex-item-fixed-9-12 { | |
| 14159 flex-grow: 0; | |
| 14160 flex-shrink: 0; | |
| 14161 flex-basis: 75%; | |
| 14162 } | |
| 14163 | |
| 14164 | |
| 14165 .flex-item-fixed-12-12 { | |
| 14166 flex-grow: 0; | |
| 14167 flex-shrink: 0; | |
| 14168 flex-basis: 100%; | |
| 14169 } | |
| 14170 | |
| 14171 .flex-item-10-percent { | |
| 14172 flex-grow: 0; | |
| 14173 flex-shrink: 0; | |
| 14174 flex-basis: 10%; | |
| 14175 } | |
| 14176 | |
| 14177 .flex-item-15-percent { | |
| 14178 flex-grow: 0; | |
| 14179 flex-shrink: 0; | |
| 14180 flex-basis: 15%; | |
| 14181 } | |
| 14182 | |
| 14183 .flex-item-20-percent { | |
| 14184 flex-grow: 0; | |
| 14185 flex-shrink: 0; | |
| 14186 flex-basis: 20%; | |
| 14187 } | |
| 14188 | |
| 14189 .flex-item-30-percent { | |
| 14190 flex-grow: 0; | |
| 14191 flex-shrink: 0; | |
| 14192 flex-basis: 30%; | |
| 14193 } | |
| 14194 | |
| 14195 .flex-item-40-percent { | |
| 14196 flex-grow: 0; | |
| 14197 flex-shrink: 0; | |
| 14198 flex-basis: 40%; | |
| 14199 } | |
| 14200 | |
| 14201 .flex-item-50-percent { | |
| 14202 flex-grow: 0; | |
| 14203 flex-shrink: 0; | |
| 14204 flex-basis: 50%; | |
| 14205 } | |
| 14206 | |
| 14207 .flex-item-60-percent { | |
| 14208 flex-grow: 0; | |
| 14209 flex-shrink: 0; | |
| 14210 flex-basis: 60%; | |
| 14211 } | |
| 14212 | |
| 14213 .flex-item-70-percent { | |
| 14214 flex-grow: 0; | |
| 14215 flex-shrink: 0; | |
| 14216 flex-basis: 70%; | |
| 14217 } | |
| 14218 | |
| 14219 .flex-item-80-percent { | |
| 14220 flex-grow: 0; | |
| 14221 flex-shrink: 0; | |
| 14222 flex-basis: 80%; | |
| 14223 } | |
| 14224 | |
| 14225 .well { | |
| 14226 min-height: 20px; | |
| 14227 padding: 19px; | |
| 14228 margin-bottom: 20px; | |
| 14229 background-color: #f5f5f5; | |
| 14230 border: 1px solid #e3e3e3; | |
| 14231 border-radius: 4px; | |
| 14232 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 14233 } | |
| 14234 | |
| 14235 .break-wrap { | |
| 14236 word-wrap: break-word; | |
| 14237 } | |
| 14238 </style> | |
| 14239 | |
| 14240 <nav-bar> | |
| 14241 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 14242 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 14243 </nav-bar> | |
| 14244 | |
| 14245 <div class="content"> | |
| 14246 <h1>Process</h1> | |
| 14247 | |
| 14248 <br> | |
| 14249 | |
| 14250 <div class="memberList"> | |
| 14251 <div class="memberItem"> | |
| 14252 <div class="memberName">Path</div> | |
| 14253 <div class="memberValue">{{ process['name'] }}</div> | |
| 14254 </div> | |
| 14255 <div class="memberItem"> | |
| 14256 <div class="memberName">Pid</div> | |
| 14257 <div class="memberValue">{{ process['pid'] }}</div> | |
| 14258 </div> | |
| 14259 <div class="memberItem"> | |
| 14260 <div class="memberName">Arguments</div> | |
| 14261 <div class="memberValue">{{ process['arguments'] }}</div> | |
| 14262 </div> | |
| 14263 <div class="memberItem"> | |
| 14264 <div class="memberName">Started</div> | |
| 14265 <div class="memberValue">{{ process['started'] }}</div> | |
| 14266 </div> | |
| 14267 <div class="memberItem"> | |
| 14268 <div class="memberName">Working Directory</div> | |
| 14269 <div class="memberValue">{{ process['workingDirectory'] }}</div> | |
| 14270 </div> | |
| 14271 <template if="{{ process['stdin'] != null }}"> | |
| 14272 <div class="memberItem"> | |
| 14273 <div class="memberName">stdin</div> | |
| 14274 <div class="memberValue"> | |
| 14275 <io-socket-ref ref="{{ process['stdin'] }}"></io-socket-ref> | |
| 14276 </div> | |
| 14277 </div> | |
| 14278 </template> | |
| 14279 <template if="{{ process['stdout'] != null }}"> | |
| 14280 <div class="memberItem"> | |
| 14281 <div class="memberName">stdout</div> | |
| 14282 <div class="memberValue"> | |
| 14283 <io-socket-ref ref="{{ process['stdout'] }}"></io-socket-ref> | |
| 14284 </div> | |
| 14285 </div> | |
| 14286 </template> | |
| 14287 <template if="{{ process['stderr'] != null }}"> | |
| 14288 <div class="memberItem"> | |
| 14289 <div class="memberName">stderr</div> | |
| 14290 <div class="memberValue"> | |
| 14291 <io-socket-ref ref="{{ process['stderr'] }}"></io-socket-ref> | |
| 14292 </div> | |
| 14293 </div> | |
| 14294 </template> | |
| 14295 </div> | |
| 14296 | |
| 14297 <br> | |
| 14298 | |
| 14299 <h2>Environment</h2> | |
| 14300 <div class="well"> | |
| 14301 <div class="monospace break-wrap"> | |
| 14302 <template repeat="{{ variable in process['environment'] }}"> | |
| 14303 {{ variable }} | |
| 14304 <br> | |
| 14305 </template> | |
| 14306 </div> | |
| 14307 </div> | |
| 14308 </div> | |
| 14309 <br> | |
| 14310 <hr> | |
| 14311 </template> | |
| 14312 </polymer-element> | |
| 14313 | |
| 14314 | |
| 14315 | |
| 14316 | |
| 14317 | |
| 14318 <polymer-element name="isolate-ref" extends="service-ref"> | |
| 14319 <template><style>/* Global styles */ | |
| 14320 * { | |
| 14321 margin: 0; | |
| 14322 padding: 0; | |
| 14323 font: 400 14px 'Montserrat', sans-serif; | |
| 14324 color: #333; | |
| 14325 box-sizing: border-box; | |
| 14326 } | |
| 14327 | |
| 14328 .content { | |
| 14329 padding-left: 10%; | |
| 14330 font: 400 14px 'Montserrat', sans-serif; | |
| 14331 } | |
| 14332 | |
| 14333 .content-centered { | |
| 14334 padding-left: 10%; | |
| 14335 padding-right: 10%; | |
| 14336 font: 400 14px 'Montserrat', sans-serif; | |
| 14337 } | |
| 14338 | |
| 14339 .content-centered-big { | |
| 14340 padding-left: 5%; | |
| 14341 padding-right: 5%; | |
| 14342 font: 400 14px 'Montserrat', sans-serif; | |
| 14343 } | |
| 14344 | |
| 14345 h1 { | |
| 14346 font: 400 18px 'Montserrat', sans-serif; | |
| 14347 } | |
| 14348 | |
| 14349 .memberList { | |
| 14350 display: table; | |
| 14351 } | |
| 14352 | |
| 14353 .memberItem { | |
| 14354 display: table-row; | |
| 14355 } | |
| 14356 | |
| 14357 .memberName, .memberValue { | |
| 14358 display: table-cell; | |
| 14359 vertical-align: top; | |
| 14360 padding: 3px 0 3px 1em; | |
| 14361 font: 400 14px 'Montserrat', sans-serif; | |
| 14362 } | |
| 14363 | |
| 14364 .memberSmall { | |
| 14365 display: table-cell; | |
| 14366 vertical-align: top; | |
| 14367 padding: 3px 0 3px 1em; | |
| 14368 font: 400 12px 'Montserrat', sans-serif; | |
| 14369 } | |
| 14370 | |
| 14371 .monospace { | |
| 14372 font-family: consolas, courier, monospace; | |
| 14373 font-size: 1em; | |
| 14374 line-height: 1.2em; | |
| 14375 white-space: nowrap; | |
| 14376 } | |
| 14377 | |
| 14378 a { | |
| 14379 color: #0489c3; | |
| 14380 text-decoration: none; | |
| 14381 } | |
| 14382 | |
| 14383 a:hover { | |
| 14384 text-decoration: underline; | |
| 14385 } | |
| 14386 | |
| 14387 em { | |
| 14388 color: inherit; | |
| 14389 font-style: italic; | |
| 14390 } | |
| 14391 | |
| 14392 b { | |
| 14393 color: inherit; | |
| 14394 font-weight: bold; | |
| 14395 } | |
| 14396 | |
| 14397 hr { | |
| 14398 margin-top: 20px; | |
| 14399 margin-bottom: 20px; | |
| 14400 border: 0; | |
| 14401 border-top: 1px solid #eee; | |
| 14402 height: 0; | |
| 14403 box-sizing: content-box; | |
| 14404 } | |
| 14405 | |
| 14406 .list-group { | |
| 14407 padding-left: 0; | |
| 14408 margin-bottom: 20px; | |
| 14409 } | |
| 14410 | |
| 14411 .list-group-item { | |
| 14412 position: relative; | |
| 14413 display: block; | |
| 14414 padding: 10px 15px; | |
| 14415 margin-bottom: -1px; | |
| 14416 background-color: #fff; | |
| 14417 } | |
| 14418 | |
| 14419 .list-group-item:first-child { | |
| 14420 /* rounded top corners */ | |
| 14421 border-top-right-radius:4px; | |
| 14422 border-top-left-radius:4px; | |
| 14423 } | |
| 14424 | |
| 14425 .list-group-item:last-child { | |
| 14426 margin-bottom: 0; | |
| 14427 /* rounded bottom corners */ | |
| 14428 border-bottom-right-radius: 4px; | |
| 14429 border-bottom-left-radius:4px; | |
| 14430 } | |
| 14431 | |
| 14432 /* Flex row container */ | |
| 14433 .flex-row { | |
| 14434 display: flex; | |
| 14435 flex-direction: row; | |
| 14436 } | |
| 14437 | |
| 14438 /* Flex column container */ | |
| 14439 .flex-column { | |
| 14440 display: flex; | |
| 14441 flex-direction: column; | |
| 14442 } | |
| 14443 | |
| 14444 .flex-item-fit { | |
| 14445 flex-grow: 1; | |
| 14446 flex-shrink: 1; | |
| 14447 flex-basis: auto; | |
| 14448 } | |
| 14449 | |
| 14450 .flex-item-no-shrink { | |
| 14451 flex-grow: 0; | |
| 14452 flex-shrink: 0; | |
| 14453 flex-basis: auto; | |
| 14454 } | |
| 14455 | |
| 14456 .flex-item-fill { | |
| 14457 flex-grow: 0; | |
| 14458 flex-shrink: 1; /* shrink when pressured */ | |
| 14459 flex-basis: 100%; /* try and take 100% */ | |
| 14460 } | |
| 14461 | |
| 14462 .flex-item-fixed-1-12 { | |
| 14463 flex-grow: 0; | |
| 14464 flex-shrink: 0; | |
| 14465 flex-basis: 8.3%; | |
| 14466 } | |
| 14467 | |
| 14468 .flex-item-fixed-2-12 { | |
| 14469 flex-grow: 0; | |
| 14470 flex-shrink: 0; | |
| 14471 flex-basis: 16.6%; | |
| 14472 } | |
| 14473 | |
| 14474 .flex-item-fixed-4-12 { | |
| 14475 flex-grow: 0; | |
| 14476 flex-shrink: 0; | |
| 14477 flex-basis: 33.3333%; | |
| 14478 } | |
| 14479 | |
| 14480 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 14481 flex-grow: 0; | |
| 14482 flex-shrink: 0; | |
| 14483 flex-basis: 50%; | |
| 14484 } | |
| 14485 | |
| 14486 .flex-item-fixed-8-12 { | |
| 14487 flex-grow: 0; | |
| 14488 flex-shrink: 0; | |
| 14489 flex-basis: 66.6666%; | |
| 14490 } | |
| 14491 | |
| 14492 .flex-item-fixed-9-12 { | |
| 14493 flex-grow: 0; | |
| 14494 flex-shrink: 0; | |
| 14495 flex-basis: 75%; | |
| 14496 } | |
| 14497 | |
| 14498 | |
| 14499 .flex-item-fixed-12-12 { | |
| 14500 flex-grow: 0; | |
| 14501 flex-shrink: 0; | |
| 14502 flex-basis: 100%; | |
| 14503 } | |
| 14504 | |
| 14505 .flex-item-10-percent { | |
| 14506 flex-grow: 0; | |
| 14507 flex-shrink: 0; | |
| 14508 flex-basis: 10%; | |
| 14509 } | |
| 14510 | |
| 14511 .flex-item-15-percent { | |
| 14512 flex-grow: 0; | |
| 14513 flex-shrink: 0; | |
| 14514 flex-basis: 15%; | |
| 14515 } | |
| 14516 | |
| 14517 .flex-item-20-percent { | |
| 14518 flex-grow: 0; | |
| 14519 flex-shrink: 0; | |
| 14520 flex-basis: 20%; | |
| 14521 } | |
| 14522 | |
| 14523 .flex-item-30-percent { | |
| 14524 flex-grow: 0; | |
| 14525 flex-shrink: 0; | |
| 14526 flex-basis: 30%; | |
| 14527 } | |
| 14528 | |
| 14529 .flex-item-40-percent { | |
| 14530 flex-grow: 0; | |
| 14531 flex-shrink: 0; | |
| 14532 flex-basis: 40%; | |
| 14533 } | |
| 14534 | |
| 14535 .flex-item-50-percent { | |
| 14536 flex-grow: 0; | |
| 14537 flex-shrink: 0; | |
| 14538 flex-basis: 50%; | |
| 14539 } | |
| 14540 | |
| 14541 .flex-item-60-percent { | |
| 14542 flex-grow: 0; | |
| 14543 flex-shrink: 0; | |
| 14544 flex-basis: 60%; | |
| 14545 } | |
| 14546 | |
| 14547 .flex-item-70-percent { | |
| 14548 flex-grow: 0; | |
| 14549 flex-shrink: 0; | |
| 14550 flex-basis: 70%; | |
| 14551 } | |
| 14552 | |
| 14553 .flex-item-80-percent { | |
| 14554 flex-grow: 0; | |
| 14555 flex-shrink: 0; | |
| 14556 flex-basis: 80%; | |
| 14557 } | |
| 14558 | |
| 14559 .well { | |
| 14560 min-height: 20px; | |
| 14561 padding: 19px; | |
| 14562 margin-bottom: 20px; | |
| 14563 background-color: #f5f5f5; | |
| 14564 border: 1px solid #e3e3e3; | |
| 14565 border-radius: 4px; | |
| 14566 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 14567 } | |
| 14568 | |
| 14569 .break-wrap { | |
| 14570 word-wrap: break-word; | |
| 14571 } | |
| 14572 </style> | |
| 14573 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a> | |
| 14574 </template> | |
| 14575 </polymer-element> | |
| 14576 | |
| 14577 | |
| 14578 | |
| 14579 | |
| 14580 | |
| 14581 | |
| 14582 | |
| 14583 | |
| 14584 | |
| 14585 | |
| 14586 <polymer-element name="isolate-summary" extends="observatory-element"> | |
| 14587 <template> | |
| 14588 <style>/* Global styles */ | |
| 14589 * { | |
| 14590 margin: 0; | |
| 14591 padding: 0; | |
| 14592 font: 400 14px 'Montserrat', sans-serif; | |
| 14593 color: #333; | |
| 14594 box-sizing: border-box; | |
| 14595 } | |
| 14596 | |
| 14597 .content { | |
| 14598 padding-left: 10%; | |
| 14599 font: 400 14px 'Montserrat', sans-serif; | |
| 14600 } | |
| 14601 | |
| 14602 .content-centered { | |
| 14603 padding-left: 10%; | |
| 14604 padding-right: 10%; | |
| 14605 font: 400 14px 'Montserrat', sans-serif; | |
| 14606 } | |
| 14607 | |
| 14608 .content-centered-big { | |
| 14609 padding-left: 5%; | |
| 14610 padding-right: 5%; | |
| 14611 font: 400 14px 'Montserrat', sans-serif; | |
| 14612 } | |
| 14613 | |
| 14614 h1 { | |
| 14615 font: 400 18px 'Montserrat', sans-serif; | |
| 14616 } | |
| 14617 | |
| 14618 .memberList { | |
| 14619 display: table; | |
| 14620 } | |
| 14621 | |
| 14622 .memberItem { | |
| 14623 display: table-row; | |
| 14624 } | |
| 14625 | |
| 14626 .memberName, .memberValue { | |
| 14627 display: table-cell; | |
| 14628 vertical-align: top; | |
| 14629 padding: 3px 0 3px 1em; | |
| 14630 font: 400 14px 'Montserrat', sans-serif; | |
| 14631 } | |
| 14632 | |
| 14633 .memberSmall { | |
| 14634 display: table-cell; | |
| 14635 vertical-align: top; | |
| 14636 padding: 3px 0 3px 1em; | |
| 14637 font: 400 12px 'Montserrat', sans-serif; | |
| 14638 } | |
| 14639 | |
| 14640 .monospace { | |
| 14641 font-family: consolas, courier, monospace; | |
| 14642 font-size: 1em; | |
| 14643 line-height: 1.2em; | |
| 14644 white-space: nowrap; | |
| 14645 } | |
| 14646 | |
| 14647 a { | |
| 14648 color: #0489c3; | |
| 14649 text-decoration: none; | |
| 14650 } | |
| 14651 | |
| 14652 a:hover { | |
| 14653 text-decoration: underline; | |
| 14654 } | |
| 14655 | |
| 14656 em { | |
| 14657 color: inherit; | |
| 14658 font-style: italic; | |
| 14659 } | |
| 14660 | |
| 14661 b { | |
| 14662 color: inherit; | |
| 14663 font-weight: bold; | |
| 14664 } | |
| 14665 | |
| 14666 hr { | |
| 14667 margin-top: 20px; | |
| 14668 margin-bottom: 20px; | |
| 14669 border: 0; | |
| 14670 border-top: 1px solid #eee; | |
| 14671 height: 0; | |
| 14672 box-sizing: content-box; | |
| 14673 } | |
| 14674 | |
| 14675 .list-group { | |
| 14676 padding-left: 0; | |
| 14677 margin-bottom: 20px; | |
| 14678 } | |
| 14679 | |
| 14680 .list-group-item { | |
| 14681 position: relative; | |
| 14682 display: block; | |
| 14683 padding: 10px 15px; | |
| 14684 margin-bottom: -1px; | |
| 14685 background-color: #fff; | |
| 14686 } | |
| 14687 | |
| 14688 .list-group-item:first-child { | |
| 14689 /* rounded top corners */ | |
| 14690 border-top-right-radius:4px; | |
| 14691 border-top-left-radius:4px; | |
| 14692 } | |
| 14693 | |
| 14694 .list-group-item:last-child { | |
| 14695 margin-bottom: 0; | |
| 14696 /* rounded bottom corners */ | |
| 14697 border-bottom-right-radius: 4px; | |
| 14698 border-bottom-left-radius:4px; | |
| 14699 } | |
| 14700 | |
| 14701 /* Flex row container */ | |
| 14702 .flex-row { | |
| 14703 display: flex; | |
| 14704 flex-direction: row; | |
| 14705 } | |
| 14706 | |
| 14707 /* Flex column container */ | |
| 14708 .flex-column { | |
| 14709 display: flex; | |
| 14710 flex-direction: column; | |
| 14711 } | |
| 14712 | |
| 14713 .flex-item-fit { | |
| 14714 flex-grow: 1; | |
| 14715 flex-shrink: 1; | |
| 14716 flex-basis: auto; | |
| 14717 } | |
| 14718 | |
| 14719 .flex-item-no-shrink { | |
| 14720 flex-grow: 0; | |
| 14721 flex-shrink: 0; | |
| 14722 flex-basis: auto; | |
| 14723 } | |
| 14724 | |
| 14725 .flex-item-fill { | |
| 14726 flex-grow: 0; | |
| 14727 flex-shrink: 1; /* shrink when pressured */ | |
| 14728 flex-basis: 100%; /* try and take 100% */ | |
| 14729 } | |
| 14730 | |
| 14731 .flex-item-fixed-1-12 { | |
| 14732 flex-grow: 0; | |
| 14733 flex-shrink: 0; | |
| 14734 flex-basis: 8.3%; | |
| 14735 } | |
| 14736 | |
| 14737 .flex-item-fixed-2-12 { | |
| 14738 flex-grow: 0; | |
| 14739 flex-shrink: 0; | |
| 14740 flex-basis: 16.6%; | |
| 14741 } | |
| 14742 | |
| 14743 .flex-item-fixed-4-12 { | |
| 14744 flex-grow: 0; | |
| 14745 flex-shrink: 0; | |
| 14746 flex-basis: 33.3333%; | |
| 14747 } | |
| 14748 | |
| 14749 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 14750 flex-grow: 0; | |
| 14751 flex-shrink: 0; | |
| 14752 flex-basis: 50%; | |
| 14753 } | |
| 14754 | |
| 14755 .flex-item-fixed-8-12 { | |
| 14756 flex-grow: 0; | |
| 14757 flex-shrink: 0; | |
| 14758 flex-basis: 66.6666%; | |
| 14759 } | |
| 14760 | |
| 14761 .flex-item-fixed-9-12 { | |
| 14762 flex-grow: 0; | |
| 14763 flex-shrink: 0; | |
| 14764 flex-basis: 75%; | |
| 14765 } | |
| 14766 | |
| 14767 | |
| 14768 .flex-item-fixed-12-12 { | |
| 14769 flex-grow: 0; | |
| 14770 flex-shrink: 0; | |
| 14771 flex-basis: 100%; | |
| 14772 } | |
| 14773 | |
| 14774 .flex-item-10-percent { | |
| 14775 flex-grow: 0; | |
| 14776 flex-shrink: 0; | |
| 14777 flex-basis: 10%; | |
| 14778 } | |
| 14779 | |
| 14780 .flex-item-15-percent { | |
| 14781 flex-grow: 0; | |
| 14782 flex-shrink: 0; | |
| 14783 flex-basis: 15%; | |
| 14784 } | |
| 14785 | |
| 14786 .flex-item-20-percent { | |
| 14787 flex-grow: 0; | |
| 14788 flex-shrink: 0; | |
| 14789 flex-basis: 20%; | |
| 14790 } | |
| 14791 | |
| 14792 .flex-item-30-percent { | |
| 14793 flex-grow: 0; | |
| 14794 flex-shrink: 0; | |
| 14795 flex-basis: 30%; | |
| 14796 } | |
| 14797 | |
| 14798 .flex-item-40-percent { | |
| 14799 flex-grow: 0; | |
| 14800 flex-shrink: 0; | |
| 14801 flex-basis: 40%; | |
| 14802 } | |
| 14803 | |
| 14804 .flex-item-50-percent { | |
| 14805 flex-grow: 0; | |
| 14806 flex-shrink: 0; | |
| 14807 flex-basis: 50%; | |
| 14808 } | |
| 14809 | |
| 14810 .flex-item-60-percent { | |
| 14811 flex-grow: 0; | |
| 14812 flex-shrink: 0; | |
| 14813 flex-basis: 60%; | |
| 14814 } | |
| 14815 | |
| 14816 .flex-item-70-percent { | |
| 14817 flex-grow: 0; | |
| 14818 flex-shrink: 0; | |
| 14819 flex-basis: 70%; | |
| 14820 } | |
| 14821 | |
| 14822 .flex-item-80-percent { | |
| 14823 flex-grow: 0; | |
| 14824 flex-shrink: 0; | |
| 14825 flex-basis: 80%; | |
| 14826 } | |
| 14827 | |
| 14828 .well { | |
| 14829 min-height: 20px; | |
| 14830 padding: 19px; | |
| 14831 margin-bottom: 20px; | |
| 14832 background-color: #f5f5f5; | |
| 14833 border: 1px solid #e3e3e3; | |
| 14834 border-radius: 4px; | |
| 14835 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 14836 } | |
| 14837 | |
| 14838 .break-wrap { | |
| 14839 word-wrap: break-word; | |
| 14840 } | |
| 14841 </style> | |
| 14842 <div class="flex-row"> | |
| 14843 <div class="flex-item-10-percent"> | |
| 14844 <img src="packages/observatory/src/elements/img/isolate_icon.png"> | |
| 14845 </div> | |
| 14846 <div class="flex-item-10-percent"> | |
| 14847 <isolate-ref ref="{{ isolate }}"></isolate-ref> | |
| 14848 </div> | |
| 14849 <div class="flex-item-30-percent"> | |
| 14850 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> | |
| 14851 </div> | |
| 14852 <div class="flex-item-40-percent"> | |
| 14853 <isolate-location isolate="{{ isolate }}"></isolate-location> | |
| 14854 </div> | |
| 14855 <div class="flex-item-10-percent"> | |
| 14856 </div> | |
| 14857 </div> | |
| 14858 | |
| 14859 <div class="flex-row"> | |
| 14860 <div class="flex-item-20-percent"></div> | |
| 14861 <div class="flex-item-60-percent"> | |
| 14862 <hr> | |
| 14863 </div> | |
| 14864 <div class="flex-item-20-percent"></div> | |
| 14865 </div> | |
| 14866 | |
| 14867 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> | |
| 14868 | |
| 14869 </template> | |
| 14870 </polymer-element> | |
| 14871 | |
| 14872 <polymer-element name="isolate-run-state" extends="observatory-element"> | |
| 14873 <template> | |
| 14874 <template if="{{ isolate.pauseEvent != null }}"> | |
| 14875 <strong>paused</strong> | |
| 14876 <action-link callback="{{ resume }}" label="resume"></action-link> | |
| 14877 | |
| 14878 <action-link callback="{{ stepInto }}" label="step"></action-link> | |
| 14879 <action-link callback="{{ stepOver }}" label="step over"></action-lin
k> | |
| 14880 <action-link callback="{{ stepOut }}" label="step out"></action-link> | |
| 14881 </template> | |
| 14882 | |
| 14883 <template if="{{ isolate.running }}"> | |
| 14884 <strong>running</strong> | |
| 14885 <action-link callback="{{ pause }}" label="pause"></action-link> | |
| 14886 </template> | |
| 14887 | |
| 14888 <template if="{{ isolate.idle }}"> | |
| 14889 <strong>idle</strong> | |
| 14890 <action-link callback="{{ pause }}" label="pause"></action-link> | |
| 14891 </template> | |
| 14892 | |
| 14893 <template if="{{ isolate.loading }}"> | |
| 14894 <strong>loading...</strong> | |
| 14895 </template> | |
| 14896 </template> | |
| 14897 </polymer-element> | |
| 14898 | |
| 14899 <polymer-element name="isolate-location" extends="observatory-element"> | |
| 14900 <template> | |
| 14901 <template if="{{ isolate.pauseEvent != null }}"> | |
| 14902 <template if="{{ isolate.pauseEvent.eventType == 'IsolateCreated' }}"> | |
| 14903 at isolate start | |
| 14904 </template> | |
| 14905 | |
| 14906 <template if="{{ isolate.pauseEvent.eventType == 'IsolateShutdown' }}"> | |
| 14907 at isolate exit | |
| 14908 </template> | |
| 14909 | |
| 14910 <template if="{{ isolate.pauseEvent.eventType == 'IsolateInterrupted' || | |
| 14911 isolate.pauseEvent.eventType == 'BreakpointReached' || | |
| 14912 isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> | |
| 14913 <template if="{{ isolate.pauseEvent.breakpoint != null }}"> | |
| 14914 by breakpoint | |
| 14915 </template> | |
| 14916 <template if="{{ isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> | |
| 14917 by exception | |
| 14918 </template> | |
| 14919 at | |
| 14920 <function-ref ref="{{ isolate.topFrame['function'] }}"> | |
| 14921 </function-ref> | |
| 14922 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) | |
| 14923 </template> | |
| 14924 </template> | |
| 14925 | |
| 14926 <template if="{{ isolate.running }}"> | |
| 14927 at | |
| 14928 <function-ref ref="{{ isolate.topFrame['function'] }}"> | |
| 14929 </function-ref> | |
| 14930 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra
me['tokenPos'] }}"></script-ref>) | |
| 14931 </template> | |
| 14932 | |
| 14933 </template> | |
| 14934 </polymer-element> | |
| 14935 | |
| 14936 <polymer-element name="isolate-shared-summary" extends="observatory-element"> | |
| 14937 <template> | |
| 14938 <style> | |
| 14939 .errorBox { | |
| 14940 background-color: #f5f5f5; | |
| 14941 border: 1px solid #ccc; | |
| 14942 padding: 10px; | |
| 14943 font-family: consolas, courier, monospace; | |
| 14944 font-size: 1em; | |
| 14945 line-height: 1.2em; | |
| 14946 white-space: pre; | |
| 14947 } | |
| 14948 </style> | |
| 14949 <style>/* Global styles */ | |
| 14950 * { | |
| 14951 margin: 0; | |
| 14952 padding: 0; | |
| 14953 font: 400 14px 'Montserrat', sans-serif; | |
| 14954 color: #333; | |
| 14955 box-sizing: border-box; | |
| 14956 } | |
| 14957 | |
| 14958 .content { | |
| 14959 padding-left: 10%; | |
| 14960 font: 400 14px 'Montserrat', sans-serif; | |
| 14961 } | |
| 14962 | |
| 14963 .content-centered { | |
| 14964 padding-left: 10%; | |
| 14965 padding-right: 10%; | |
| 14966 font: 400 14px 'Montserrat', sans-serif; | |
| 14967 } | |
| 14968 | |
| 14969 .content-centered-big { | |
| 14970 padding-left: 5%; | |
| 14971 padding-right: 5%; | |
| 14972 font: 400 14px 'Montserrat', sans-serif; | |
| 14973 } | |
| 14974 | |
| 14975 h1 { | |
| 14976 font: 400 18px 'Montserrat', sans-serif; | |
| 14977 } | |
| 14978 | |
| 14979 .memberList { | |
| 14980 display: table; | |
| 14981 } | |
| 14982 | |
| 14983 .memberItem { | |
| 14984 display: table-row; | |
| 14985 } | |
| 14986 | |
| 14987 .memberName, .memberValue { | |
| 14988 display: table-cell; | |
| 14989 vertical-align: top; | |
| 14990 padding: 3px 0 3px 1em; | |
| 14991 font: 400 14px 'Montserrat', sans-serif; | |
| 14992 } | |
| 14993 | |
| 14994 .memberSmall { | |
| 14995 display: table-cell; | |
| 14996 vertical-align: top; | |
| 14997 padding: 3px 0 3px 1em; | |
| 14998 font: 400 12px 'Montserrat', sans-serif; | |
| 14999 } | |
| 15000 | |
| 15001 .monospace { | |
| 15002 font-family: consolas, courier, monospace; | |
| 15003 font-size: 1em; | |
| 15004 line-height: 1.2em; | |
| 15005 white-space: nowrap; | |
| 15006 } | |
| 15007 | |
| 15008 a { | |
| 15009 color: #0489c3; | |
| 15010 text-decoration: none; | |
| 15011 } | |
| 15012 | |
| 15013 a:hover { | |
| 15014 text-decoration: underline; | |
| 15015 } | |
| 15016 | |
| 15017 em { | |
| 15018 color: inherit; | |
| 15019 font-style: italic; | |
| 15020 } | |
| 15021 | |
| 15022 b { | |
| 15023 color: inherit; | |
| 15024 font-weight: bold; | |
| 15025 } | |
| 15026 | |
| 15027 hr { | |
| 15028 margin-top: 20px; | |
| 15029 margin-bottom: 20px; | |
| 15030 border: 0; | |
| 15031 border-top: 1px solid #eee; | |
| 15032 height: 0; | |
| 15033 box-sizing: content-box; | |
| 15034 } | |
| 15035 | |
| 15036 .list-group { | |
| 15037 padding-left: 0; | |
| 15038 margin-bottom: 20px; | |
| 15039 } | |
| 15040 | |
| 15041 .list-group-item { | |
| 15042 position: relative; | |
| 15043 display: block; | |
| 15044 padding: 10px 15px; | |
| 15045 margin-bottom: -1px; | |
| 15046 background-color: #fff; | |
| 15047 } | |
| 15048 | |
| 15049 .list-group-item:first-child { | |
| 15050 /* rounded top corners */ | |
| 15051 border-top-right-radius:4px; | |
| 15052 border-top-left-radius:4px; | |
| 15053 } | |
| 15054 | |
| 15055 .list-group-item:last-child { | |
| 15056 margin-bottom: 0; | |
| 15057 /* rounded bottom corners */ | |
| 15058 border-bottom-right-radius: 4px; | |
| 15059 border-bottom-left-radius:4px; | |
| 15060 } | |
| 15061 | |
| 15062 /* Flex row container */ | |
| 15063 .flex-row { | |
| 15064 display: flex; | |
| 15065 flex-direction: row; | |
| 15066 } | |
| 15067 | |
| 15068 /* Flex column container */ | |
| 15069 .flex-column { | |
| 15070 display: flex; | |
| 15071 flex-direction: column; | |
| 15072 } | |
| 15073 | |
| 15074 .flex-item-fit { | |
| 15075 flex-grow: 1; | |
| 15076 flex-shrink: 1; | |
| 15077 flex-basis: auto; | |
| 15078 } | |
| 15079 | |
| 15080 .flex-item-no-shrink { | |
| 15081 flex-grow: 0; | |
| 15082 flex-shrink: 0; | |
| 15083 flex-basis: auto; | |
| 15084 } | |
| 15085 | |
| 15086 .flex-item-fill { | |
| 15087 flex-grow: 0; | |
| 15088 flex-shrink: 1; /* shrink when pressured */ | |
| 15089 flex-basis: 100%; /* try and take 100% */ | |
| 15090 } | |
| 15091 | |
| 15092 .flex-item-fixed-1-12 { | |
| 15093 flex-grow: 0; | |
| 15094 flex-shrink: 0; | |
| 15095 flex-basis: 8.3%; | |
| 15096 } | |
| 15097 | |
| 15098 .flex-item-fixed-2-12 { | |
| 15099 flex-grow: 0; | |
| 15100 flex-shrink: 0; | |
| 15101 flex-basis: 16.6%; | |
| 15102 } | |
| 15103 | |
| 15104 .flex-item-fixed-4-12 { | |
| 15105 flex-grow: 0; | |
| 15106 flex-shrink: 0; | |
| 15107 flex-basis: 33.3333%; | |
| 15108 } | |
| 15109 | |
| 15110 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 15111 flex-grow: 0; | |
| 15112 flex-shrink: 0; | |
| 15113 flex-basis: 50%; | |
| 15114 } | |
| 15115 | |
| 15116 .flex-item-fixed-8-12 { | |
| 15117 flex-grow: 0; | |
| 15118 flex-shrink: 0; | |
| 15119 flex-basis: 66.6666%; | |
| 15120 } | |
| 15121 | |
| 15122 .flex-item-fixed-9-12 { | |
| 15123 flex-grow: 0; | |
| 15124 flex-shrink: 0; | |
| 15125 flex-basis: 75%; | |
| 15126 } | |
| 15127 | |
| 15128 | |
| 15129 .flex-item-fixed-12-12 { | |
| 15130 flex-grow: 0; | |
| 15131 flex-shrink: 0; | |
| 15132 flex-basis: 100%; | |
| 15133 } | |
| 15134 | |
| 15135 .flex-item-10-percent { | |
| 15136 flex-grow: 0; | |
| 15137 flex-shrink: 0; | |
| 15138 flex-basis: 10%; | |
| 15139 } | |
| 15140 | |
| 15141 .flex-item-15-percent { | |
| 15142 flex-grow: 0; | |
| 15143 flex-shrink: 0; | |
| 15144 flex-basis: 15%; | |
| 15145 } | |
| 15146 | |
| 15147 .flex-item-20-percent { | |
| 15148 flex-grow: 0; | |
| 15149 flex-shrink: 0; | |
| 15150 flex-basis: 20%; | |
| 15151 } | |
| 15152 | |
| 15153 .flex-item-30-percent { | |
| 15154 flex-grow: 0; | |
| 15155 flex-shrink: 0; | |
| 15156 flex-basis: 30%; | |
| 15157 } | |
| 15158 | |
| 15159 .flex-item-40-percent { | |
| 15160 flex-grow: 0; | |
| 15161 flex-shrink: 0; | |
| 15162 flex-basis: 40%; | |
| 15163 } | |
| 15164 | |
| 15165 .flex-item-50-percent { | |
| 15166 flex-grow: 0; | |
| 15167 flex-shrink: 0; | |
| 15168 flex-basis: 50%; | |
| 15169 } | |
| 15170 | |
| 15171 .flex-item-60-percent { | |
| 15172 flex-grow: 0; | |
| 15173 flex-shrink: 0; | |
| 15174 flex-basis: 60%; | |
| 15175 } | |
| 15176 | |
| 15177 .flex-item-70-percent { | |
| 15178 flex-grow: 0; | |
| 15179 flex-shrink: 0; | |
| 15180 flex-basis: 70%; | |
| 15181 } | |
| 15182 | |
| 15183 .flex-item-80-percent { | |
| 15184 flex-grow: 0; | |
| 15185 flex-shrink: 0; | |
| 15186 flex-basis: 80%; | |
| 15187 } | |
| 15188 | |
| 15189 .well { | |
| 15190 min-height: 20px; | |
| 15191 padding: 19px; | |
| 15192 margin-bottom: 20px; | |
| 15193 background-color: #f5f5f5; | |
| 15194 border: 1px solid #e3e3e3; | |
| 15195 border-radius: 4px; | |
| 15196 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 15197 } | |
| 15198 | |
| 15199 .break-wrap { | |
| 15200 word-wrap: break-word; | |
| 15201 } | |
| 15202 </style> | |
| 15203 <template if="{{ isolate.error != null }}"> | |
| 15204 <div class="content-centered"> | |
| 15205 <pre class="errorBox">{{ isolate.error.message }}</pre> | |
| 15206 <br> | |
| 15207 </div> | |
| 15208 </template> | |
| 15209 <div class="flex-row"> | |
| 15210 <div class="flex-item-10-percent"> | |
| 15211 </div> | |
| 15212 <div class="flex-item-40-percent"> | |
| 15213 <isolate-counter-chart counters="{{ isolate.counters }}"></isolate-count
er-chart> | |
| 15214 </div> | |
| 15215 <div class="flex-item-40-percent"> | |
| 15216 <div class="memberList"> | |
| 15217 <div class="memberItem"> | |
| 15218 <div class="memberName">new heap</div> | |
| 15219 <div class="memberValue"> | |
| 15220 {{ isolate.newSpace.used | formatSize }} | |
| 15221 of | |
| 15222 {{ isolate.newSpace.capacity | formatSize }} | |
| 15223 </div> | |
| 15224 </div> | |
| 15225 <div class="memberItem"> | |
| 15226 <div class="memberName">old heap</div> | |
| 15227 <div class="memberValue"> | |
| 15228 {{ isolate.oldSpace.used | formatSize }} | |
| 15229 of | |
| 15230 {{ isolate.oldSpace.capacity | formatSize }} | |
| 15231 </div> | |
| 15232 </div> | |
| 15233 </div> | |
| 15234 <br> | |
| 15235 <div class="memberItem"> | |
| 15236 <div class="memberValue"> | |
| 15237 See <a on-click="{{ goto }}" _href="{{ gotoLink('/debugger' + isolat
e.link) }}">debugger</a> | |
| 15238 </div> | |
| 15239 </div> | |
| 15240 <div class="memberItem"> | |
| 15241 <div class="memberValue"> | |
| 15242 See <a on-click="{{ goto }}" _href="{{ gotoLink('/class-tree' + isol
ate.link) }}">class hierarchy</a> | |
| 15243 </div> | |
| 15244 </div> | |
| 15245 <div class="memberItem"> | |
| 15246 <div class="memberValue"> | |
| 15247 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('profile')) }}">cpu profile</a> | |
| 15248 </div> | |
| 15249 </div> | |
| 15250 <div class="memberItem"> | |
| 15251 <div class="memberValue"> | |
| 15252 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('allocationprofile')) }}">allocation profile</a> | |
| 15253 </div> | |
| 15254 </div> | |
| 15255 <div class="memberItem"> | |
| 15256 <div class="memberValue"> | |
| 15257 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('heapmap')) }}">heap map</a> | |
| 15258 </div> | |
| 15259 </div> | |
| 15260 <div class="memberItem"> | |
| 15261 <div class="memberValue"> | |
| 15262 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLink
('metrics')) }}">metrics</a> | |
| 15263 </div> | |
| 15264 </div> | |
| 15265 <!-- Temporarily disabled until UI for dart:io is acceptable. | |
| 15266 <template if="{{ isolate.ioEnabled }}"> | |
| 15267 <div class="memberItem"> | |
| 15268 <div class="memberValue"> | |
| 15269 See <a on-click="{{ goto }}" href="{{ gotoLink(isolate.relativeLin
k('io')) }}">dart:io</a> | |
| 15270 </div> | |
| 15271 </div> | |
| 15272 </template> | |
| 15273 --> | |
| 15274 </div> | |
| 15275 <div class="flex-item-10-percent"> | |
| 15276 </div> | |
| 15277 </div> | |
| 15278 </template> | |
| 15279 </polymer-element> | |
| 15280 | |
| 15281 <polymer-element name="isolate-counter-chart" extends="observatory-element"> | |
| 15282 <template> | |
| 15283 <div id="counterPieChart" style="height: 200px"></div> | |
| 15284 </template> | |
| 15285 </polymer-element> | |
| 15286 | |
| 15287 | |
| 15288 | |
| 15289 | |
| 15290 | |
| 15291 | |
| 15292 | |
| 15293 | |
| 15294 | |
| 15295 | |
| 15296 | |
| 15297 | |
| 15298 | |
| 15299 | |
| 15300 | |
| 15301 <polymer-element name="isolate-view" extends="observatory-element"> | |
| 15302 <template> | |
| 15303 <style>/* Global styles */ | |
| 15304 * { | |
| 15305 margin: 0; | |
| 15306 padding: 0; | |
| 15307 font: 400 14px 'Montserrat', sans-serif; | |
| 15308 color: #333; | |
| 15309 box-sizing: border-box; | |
| 15310 } | |
| 15311 | |
| 15312 .content { | |
| 15313 padding-left: 10%; | |
| 15314 font: 400 14px 'Montserrat', sans-serif; | |
| 15315 } | |
| 15316 | |
| 15317 .content-centered { | |
| 15318 padding-left: 10%; | |
| 15319 padding-right: 10%; | |
| 15320 font: 400 14px 'Montserrat', sans-serif; | |
| 15321 } | |
| 15322 | |
| 15323 .content-centered-big { | |
| 15324 padding-left: 5%; | |
| 15325 padding-right: 5%; | |
| 15326 font: 400 14px 'Montserrat', sans-serif; | |
| 15327 } | |
| 15328 | |
| 15329 h1 { | |
| 15330 font: 400 18px 'Montserrat', sans-serif; | |
| 15331 } | |
| 15332 | |
| 15333 .memberList { | |
| 15334 display: table; | |
| 15335 } | |
| 15336 | |
| 15337 .memberItem { | |
| 15338 display: table-row; | |
| 15339 } | |
| 15340 | |
| 15341 .memberName, .memberValue { | |
| 15342 display: table-cell; | |
| 15343 vertical-align: top; | |
| 15344 padding: 3px 0 3px 1em; | |
| 15345 font: 400 14px 'Montserrat', sans-serif; | |
| 15346 } | |
| 15347 | |
| 15348 .memberSmall { | |
| 15349 display: table-cell; | |
| 15350 vertical-align: top; | |
| 15351 padding: 3px 0 3px 1em; | |
| 15352 font: 400 12px 'Montserrat', sans-serif; | |
| 15353 } | |
| 15354 | |
| 15355 .monospace { | |
| 15356 font-family: consolas, courier, monospace; | |
| 15357 font-size: 1em; | |
| 15358 line-height: 1.2em; | |
| 15359 white-space: nowrap; | |
| 15360 } | |
| 15361 | |
| 15362 a { | |
| 15363 color: #0489c3; | |
| 15364 text-decoration: none; | |
| 15365 } | |
| 15366 | |
| 15367 a:hover { | |
| 15368 text-decoration: underline; | |
| 15369 } | |
| 15370 | |
| 15371 em { | |
| 15372 color: inherit; | |
| 15373 font-style: italic; | |
| 15374 } | |
| 15375 | |
| 15376 b { | |
| 15377 color: inherit; | |
| 15378 font-weight: bold; | |
| 15379 } | |
| 15380 | |
| 15381 hr { | |
| 15382 margin-top: 20px; | |
| 15383 margin-bottom: 20px; | |
| 15384 border: 0; | |
| 15385 border-top: 1px solid #eee; | |
| 15386 height: 0; | |
| 15387 box-sizing: content-box; | |
| 15388 } | |
| 15389 | |
| 15390 .list-group { | |
| 15391 padding-left: 0; | |
| 15392 margin-bottom: 20px; | |
| 15393 } | |
| 15394 | |
| 15395 .list-group-item { | |
| 15396 position: relative; | |
| 15397 display: block; | |
| 15398 padding: 10px 15px; | |
| 15399 margin-bottom: -1px; | |
| 15400 background-color: #fff; | |
| 15401 } | |
| 15402 | |
| 15403 .list-group-item:first-child { | |
| 15404 /* rounded top corners */ | |
| 15405 border-top-right-radius:4px; | |
| 15406 border-top-left-radius:4px; | |
| 15407 } | |
| 15408 | |
| 15409 .list-group-item:last-child { | |
| 15410 margin-bottom: 0; | |
| 15411 /* rounded bottom corners */ | |
| 15412 border-bottom-right-radius: 4px; | |
| 15413 border-bottom-left-radius:4px; | |
| 15414 } | |
| 15415 | |
| 15416 /* Flex row container */ | |
| 15417 .flex-row { | |
| 15418 display: flex; | |
| 15419 flex-direction: row; | |
| 15420 } | |
| 15421 | |
| 15422 /* Flex column container */ | |
| 15423 .flex-column { | |
| 15424 display: flex; | |
| 15425 flex-direction: column; | |
| 15426 } | |
| 15427 | |
| 15428 .flex-item-fit { | |
| 15429 flex-grow: 1; | |
| 15430 flex-shrink: 1; | |
| 15431 flex-basis: auto; | |
| 15432 } | |
| 15433 | |
| 15434 .flex-item-no-shrink { | |
| 15435 flex-grow: 0; | |
| 15436 flex-shrink: 0; | |
| 15437 flex-basis: auto; | |
| 15438 } | |
| 15439 | |
| 15440 .flex-item-fill { | |
| 15441 flex-grow: 0; | |
| 15442 flex-shrink: 1; /* shrink when pressured */ | |
| 15443 flex-basis: 100%; /* try and take 100% */ | |
| 15444 } | |
| 15445 | |
| 15446 .flex-item-fixed-1-12 { | |
| 15447 flex-grow: 0; | |
| 15448 flex-shrink: 0; | |
| 15449 flex-basis: 8.3%; | |
| 15450 } | |
| 15451 | |
| 15452 .flex-item-fixed-2-12 { | |
| 15453 flex-grow: 0; | |
| 15454 flex-shrink: 0; | |
| 15455 flex-basis: 16.6%; | |
| 15456 } | |
| 15457 | |
| 15458 .flex-item-fixed-4-12 { | |
| 15459 flex-grow: 0; | |
| 15460 flex-shrink: 0; | |
| 15461 flex-basis: 33.3333%; | |
| 15462 } | |
| 15463 | |
| 15464 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 15465 flex-grow: 0; | |
| 15466 flex-shrink: 0; | |
| 15467 flex-basis: 50%; | |
| 15468 } | |
| 15469 | |
| 15470 .flex-item-fixed-8-12 { | |
| 15471 flex-grow: 0; | |
| 15472 flex-shrink: 0; | |
| 15473 flex-basis: 66.6666%; | |
| 15474 } | |
| 15475 | |
| 15476 .flex-item-fixed-9-12 { | |
| 15477 flex-grow: 0; | |
| 15478 flex-shrink: 0; | |
| 15479 flex-basis: 75%; | |
| 15480 } | |
| 15481 | |
| 15482 | |
| 15483 .flex-item-fixed-12-12 { | |
| 15484 flex-grow: 0; | |
| 15485 flex-shrink: 0; | |
| 15486 flex-basis: 100%; | |
| 15487 } | |
| 15488 | |
| 15489 .flex-item-10-percent { | |
| 15490 flex-grow: 0; | |
| 15491 flex-shrink: 0; | |
| 15492 flex-basis: 10%; | |
| 15493 } | |
| 15494 | |
| 15495 .flex-item-15-percent { | |
| 15496 flex-grow: 0; | |
| 15497 flex-shrink: 0; | |
| 15498 flex-basis: 15%; | |
| 15499 } | |
| 15500 | |
| 15501 .flex-item-20-percent { | |
| 15502 flex-grow: 0; | |
| 15503 flex-shrink: 0; | |
| 15504 flex-basis: 20%; | |
| 15505 } | |
| 15506 | |
| 15507 .flex-item-30-percent { | |
| 15508 flex-grow: 0; | |
| 15509 flex-shrink: 0; | |
| 15510 flex-basis: 30%; | |
| 15511 } | |
| 15512 | |
| 15513 .flex-item-40-percent { | |
| 15514 flex-grow: 0; | |
| 15515 flex-shrink: 0; | |
| 15516 flex-basis: 40%; | |
| 15517 } | |
| 15518 | |
| 15519 .flex-item-50-percent { | |
| 15520 flex-grow: 0; | |
| 15521 flex-shrink: 0; | |
| 15522 flex-basis: 50%; | |
| 15523 } | |
| 15524 | |
| 15525 .flex-item-60-percent { | |
| 15526 flex-grow: 0; | |
| 15527 flex-shrink: 0; | |
| 15528 flex-basis: 60%; | |
| 15529 } | |
| 15530 | |
| 15531 .flex-item-70-percent { | |
| 15532 flex-grow: 0; | |
| 15533 flex-shrink: 0; | |
| 15534 flex-basis: 70%; | |
| 15535 } | |
| 15536 | |
| 15537 .flex-item-80-percent { | |
| 15538 flex-grow: 0; | |
| 15539 flex-shrink: 0; | |
| 15540 flex-basis: 80%; | |
| 15541 } | |
| 15542 | |
| 15543 .well { | |
| 15544 min-height: 20px; | |
| 15545 padding: 19px; | |
| 15546 margin-bottom: 20px; | |
| 15547 background-color: #f5f5f5; | |
| 15548 border: 1px solid #e3e3e3; | |
| 15549 border-radius: 4px; | |
| 15550 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 15551 } | |
| 15552 | |
| 15553 .break-wrap { | |
| 15554 word-wrap: break-word; | |
| 15555 } | |
| 15556 </style> | |
| 15557 <style> | |
| 15558 .sourceInset { | |
| 15559 padding-left: 15%; | |
| 15560 padding-right: 15%; | |
| 15561 } | |
| 15562 .miniProfileChart { | |
| 15563 width: 80%; | |
| 15564 } | |
| 15565 </style> | |
| 15566 | |
| 15567 <nav-bar> | |
| 15568 <top-nav-menu></top-nav-menu> | |
| 15569 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}"> | |
| 15570 </isolate-nav-menu> | |
| 15571 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> | |
| 15572 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 15573 <nav-control></nav-control> | |
| 15574 </nav-bar> | |
| 15575 | |
| 15576 <div class="content"> | |
| 15577 <h1>isolate '{{ isolate.name }}'</h1> | |
| 15578 </div> | |
| 15579 | |
| 15580 <br> | |
| 15581 <div class="flex-row"> | |
| 15582 <div class="flex-item-10-percent"> | |
| 15583 </div> | |
| 15584 <div class="flex-item-30-percent"> | |
| 15585 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> | |
| 15586 </div> | |
| 15587 <div class="flex-item-50-percent"> | |
| 15588 <isolate-location isolate="{{ isolate }}"></isolate-location> | |
| 15589 </div> | |
| 15590 <div class="flex-item-10-percent"> | |
| 15591 </div> | |
| 15592 </div> | |
| 15593 <br> | |
| 15594 | |
| 15595 <template if="{{ isolate.topFrame != null }}"> | |
| 15596 <br> | |
| 15597 <script-inset script="{{ isolate.topFrame['script'] }}" currentpos="{{ iso
late.topFrame['tokenPos'] }}" height="200px"> | |
| 15598 </script-inset> | |
| 15599 </template> | |
| 15600 | |
| 15601 <div class="flex-row"> | |
| 15602 <div class="flex-item-20-percent"></div> | |
| 15603 <div class="flex-item-60-percent"><hr></div> | |
| 15604 <div class="flex-item-20-percent"></div> | |
| 15605 </div> | |
| 15606 | |
| 15607 <br> | |
| 15608 | |
| 15609 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> | |
| 15610 | |
| 15611 <div class="flex-row"> | |
| 15612 <div class="flex-item-20-percent"></div> | |
| 15613 <div class="flex-item-60-percent"><hr></div> | |
| 15614 <div class="flex-item-20-percent"></div> | |
| 15615 </div> | |
| 15616 | |
| 15617 <div class="content-centered"> | |
| 15618 <div class="flex-row"> | |
| 15619 <div class="flex-item-50-percent"> | |
| 15620 <div class="memberList"> | |
| 15621 <div class="memberItem"> | |
| 15622 <div class="memberName">root library</div> | |
| 15623 <div class="memberValue"> | |
| 15624 <library-ref ref="{{ isolate.rootLib }}"></library-ref> | |
| 15625 </div> | |
| 15626 </div> | |
| 15627 <div class="memberItem"> | |
| 15628 <template if="{{ isolate.entry != null }}"> | |
| 15629 <div class="memberName">entry</div> | |
| 15630 <div class="memberValue"> | |
| 15631 <function-ref ref="{{ isolate.entry }}"></function-ref> | |
| 15632 </div> | |
| 15633 </template> | |
| 15634 </div> | |
| 15635 <div class="memberItem"> | |
| 15636 <div class="memberName">isolate id</div> | |
| 15637 <div class="memberValue">{{ isolate.mainPort }}</div> | |
| 15638 </div> | |
| 15639 </div> | |
| 15640 </div> | |
| 15641 <div class="flex-item-50-percent"> | |
| 15642 <div class="memberItem"> | |
| 15643 <div class="memberValue"> | |
| 15644 See <a on-click="{{ goto }}" _href="{{ gotoLink(isolate.relativeLi
nk('debug/breakpoints')) }}">breakpoints</a> | |
| 15645 </div> | |
| 15646 </div> | |
| 15647 </div> | |
| 15648 </div> | |
| 15649 </div> | |
| 15650 | |
| 15651 <hr> | |
| 15652 | |
| 15653 <div class="content"> | |
| 15654 libraries ({{ isolate.libraries.length }}) | |
| 15655 <curly-block expand="{{ isolate.libraries.length <= 8 }}"> | |
| 15656 <div class="memberList"> | |
| 15657 <template repeat="{{ lib in isolate.libraries }}"> | |
| 15658 <div class="memberItem"> | |
| 15659 <div class="memberName"> | |
| 15660 <library-ref ref="{{ lib }}"></library-ref> | |
| 15661 </div> | |
| 15662 </div> | |
| 15663 </template> | |
| 15664 </div> | |
| 15665 </curly-block> | |
| 15666 </div> | |
| 15667 | |
| 15668 <hr> | |
| 15669 | |
| 15670 <div class="content"> | |
| 15671 <div id="tagProfileChart" class="miniProfileChart" style="height: 600px"><
/div> | |
| 15672 </div> | |
| 15673 | |
| 15674 <hr> | |
| 15675 | |
| 15676 <div class="content"> | |
| 15677 <eval-box callback="{{ eval }}"></eval-box> | |
| 15678 </div> | |
| 15679 <br><br><br><br> | |
| 15680 <br><br><br><br> | |
| 15681 </template> | |
| 15682 </polymer-element> | |
| 15683 | |
| 15684 | |
| 15685 | |
| 15686 | |
| 15687 | |
| 15688 | |
| 15689 | |
| 15690 | |
| 15691 | |
| 15692 | |
| 15693 | |
| 15694 | |
| 15695 | |
| 15696 | |
| 15697 | |
| 15698 | |
| 15699 | |
| 15700 <polymer-element name="inbound-reference" extends="service-ref"> | |
| 15701 <template> | |
| 15702 <style>/* Global styles */ | |
| 15703 * { | |
| 15704 margin: 0; | |
| 15705 padding: 0; | |
| 15706 font: 400 14px 'Montserrat', sans-serif; | |
| 15707 color: #333; | |
| 15708 box-sizing: border-box; | |
| 15709 } | |
| 15710 | |
| 15711 .content { | |
| 15712 padding-left: 10%; | |
| 15713 font: 400 14px 'Montserrat', sans-serif; | |
| 15714 } | |
| 15715 | |
| 15716 .content-centered { | |
| 15717 padding-left: 10%; | |
| 15718 padding-right: 10%; | |
| 15719 font: 400 14px 'Montserrat', sans-serif; | |
| 15720 } | |
| 15721 | |
| 15722 .content-centered-big { | |
| 15723 padding-left: 5%; | |
| 15724 padding-right: 5%; | |
| 15725 font: 400 14px 'Montserrat', sans-serif; | |
| 15726 } | |
| 15727 | |
| 15728 h1 { | |
| 15729 font: 400 18px 'Montserrat', sans-serif; | |
| 15730 } | |
| 15731 | |
| 15732 .memberList { | |
| 15733 display: table; | |
| 15734 } | |
| 15735 | |
| 15736 .memberItem { | |
| 15737 display: table-row; | |
| 15738 } | |
| 15739 | |
| 15740 .memberName, .memberValue { | |
| 15741 display: table-cell; | |
| 15742 vertical-align: top; | |
| 15743 padding: 3px 0 3px 1em; | |
| 15744 font: 400 14px 'Montserrat', sans-serif; | |
| 15745 } | |
| 15746 | |
| 15747 .memberSmall { | |
| 15748 display: table-cell; | |
| 15749 vertical-align: top; | |
| 15750 padding: 3px 0 3px 1em; | |
| 15751 font: 400 12px 'Montserrat', sans-serif; | |
| 15752 } | |
| 15753 | |
| 15754 .monospace { | |
| 15755 font-family: consolas, courier, monospace; | |
| 15756 font-size: 1em; | |
| 15757 line-height: 1.2em; | |
| 15758 white-space: nowrap; | |
| 15759 } | |
| 15760 | |
| 15761 a { | |
| 15762 color: #0489c3; | |
| 15763 text-decoration: none; | |
| 15764 } | |
| 15765 | |
| 15766 a:hover { | |
| 15767 text-decoration: underline; | |
| 15768 } | |
| 15769 | |
| 15770 em { | |
| 15771 color: inherit; | |
| 15772 font-style: italic; | |
| 15773 } | |
| 15774 | |
| 15775 b { | |
| 15776 color: inherit; | |
| 15777 font-weight: bold; | |
| 15778 } | |
| 15779 | |
| 15780 hr { | |
| 15781 margin-top: 20px; | |
| 15782 margin-bottom: 20px; | |
| 15783 border: 0; | |
| 15784 border-top: 1px solid #eee; | |
| 15785 height: 0; | |
| 15786 box-sizing: content-box; | |
| 15787 } | |
| 15788 | |
| 15789 .list-group { | |
| 15790 padding-left: 0; | |
| 15791 margin-bottom: 20px; | |
| 15792 } | |
| 15793 | |
| 15794 .list-group-item { | |
| 15795 position: relative; | |
| 15796 display: block; | |
| 15797 padding: 10px 15px; | |
| 15798 margin-bottom: -1px; | |
| 15799 background-color: #fff; | |
| 15800 } | |
| 15801 | |
| 15802 .list-group-item:first-child { | |
| 15803 /* rounded top corners */ | |
| 15804 border-top-right-radius:4px; | |
| 15805 border-top-left-radius:4px; | |
| 15806 } | |
| 15807 | |
| 15808 .list-group-item:last-child { | |
| 15809 margin-bottom: 0; | |
| 15810 /* rounded bottom corners */ | |
| 15811 border-bottom-right-radius: 4px; | |
| 15812 border-bottom-left-radius:4px; | |
| 15813 } | |
| 15814 | |
| 15815 /* Flex row container */ | |
| 15816 .flex-row { | |
| 15817 display: flex; | |
| 15818 flex-direction: row; | |
| 15819 } | |
| 15820 | |
| 15821 /* Flex column container */ | |
| 15822 .flex-column { | |
| 15823 display: flex; | |
| 15824 flex-direction: column; | |
| 15825 } | |
| 15826 | |
| 15827 .flex-item-fit { | |
| 15828 flex-grow: 1; | |
| 15829 flex-shrink: 1; | |
| 15830 flex-basis: auto; | |
| 15831 } | |
| 15832 | |
| 15833 .flex-item-no-shrink { | |
| 15834 flex-grow: 0; | |
| 15835 flex-shrink: 0; | |
| 15836 flex-basis: auto; | |
| 15837 } | |
| 15838 | |
| 15839 .flex-item-fill { | |
| 15840 flex-grow: 0; | |
| 15841 flex-shrink: 1; /* shrink when pressured */ | |
| 15842 flex-basis: 100%; /* try and take 100% */ | |
| 15843 } | |
| 15844 | |
| 15845 .flex-item-fixed-1-12 { | |
| 15846 flex-grow: 0; | |
| 15847 flex-shrink: 0; | |
| 15848 flex-basis: 8.3%; | |
| 15849 } | |
| 15850 | |
| 15851 .flex-item-fixed-2-12 { | |
| 15852 flex-grow: 0; | |
| 15853 flex-shrink: 0; | |
| 15854 flex-basis: 16.6%; | |
| 15855 } | |
| 15856 | |
| 15857 .flex-item-fixed-4-12 { | |
| 15858 flex-grow: 0; | |
| 15859 flex-shrink: 0; | |
| 15860 flex-basis: 33.3333%; | |
| 15861 } | |
| 15862 | |
| 15863 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 15864 flex-grow: 0; | |
| 15865 flex-shrink: 0; | |
| 15866 flex-basis: 50%; | |
| 15867 } | |
| 15868 | |
| 15869 .flex-item-fixed-8-12 { | |
| 15870 flex-grow: 0; | |
| 15871 flex-shrink: 0; | |
| 15872 flex-basis: 66.6666%; | |
| 15873 } | |
| 15874 | |
| 15875 .flex-item-fixed-9-12 { | |
| 15876 flex-grow: 0; | |
| 15877 flex-shrink: 0; | |
| 15878 flex-basis: 75%; | |
| 15879 } | |
| 15880 | |
| 15881 | |
| 15882 .flex-item-fixed-12-12 { | |
| 15883 flex-grow: 0; | |
| 15884 flex-shrink: 0; | |
| 15885 flex-basis: 100%; | |
| 15886 } | |
| 15887 | |
| 15888 .flex-item-10-percent { | |
| 15889 flex-grow: 0; | |
| 15890 flex-shrink: 0; | |
| 15891 flex-basis: 10%; | |
| 15892 } | |
| 15893 | |
| 15894 .flex-item-15-percent { | |
| 15895 flex-grow: 0; | |
| 15896 flex-shrink: 0; | |
| 15897 flex-basis: 15%; | |
| 15898 } | |
| 15899 | |
| 15900 .flex-item-20-percent { | |
| 15901 flex-grow: 0; | |
| 15902 flex-shrink: 0; | |
| 15903 flex-basis: 20%; | |
| 15904 } | |
| 15905 | |
| 15906 .flex-item-30-percent { | |
| 15907 flex-grow: 0; | |
| 15908 flex-shrink: 0; | |
| 15909 flex-basis: 30%; | |
| 15910 } | |
| 15911 | |
| 15912 .flex-item-40-percent { | |
| 15913 flex-grow: 0; | |
| 15914 flex-shrink: 0; | |
| 15915 flex-basis: 40%; | |
| 15916 } | |
| 15917 | |
| 15918 .flex-item-50-percent { | |
| 15919 flex-grow: 0; | |
| 15920 flex-shrink: 0; | |
| 15921 flex-basis: 50%; | |
| 15922 } | |
| 15923 | |
| 15924 .flex-item-60-percent { | |
| 15925 flex-grow: 0; | |
| 15926 flex-shrink: 0; | |
| 15927 flex-basis: 60%; | |
| 15928 } | |
| 15929 | |
| 15930 .flex-item-70-percent { | |
| 15931 flex-grow: 0; | |
| 15932 flex-shrink: 0; | |
| 15933 flex-basis: 70%; | |
| 15934 } | |
| 15935 | |
| 15936 .flex-item-80-percent { | |
| 15937 flex-grow: 0; | |
| 15938 flex-shrink: 0; | |
| 15939 flex-basis: 80%; | |
| 15940 } | |
| 15941 | |
| 15942 .well { | |
| 15943 min-height: 20px; | |
| 15944 padding: 19px; | |
| 15945 margin-bottom: 20px; | |
| 15946 background-color: #f5f5f5; | |
| 15947 border: 1px solid #e3e3e3; | |
| 15948 border-radius: 4px; | |
| 15949 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 15950 } | |
| 15951 | |
| 15952 .break-wrap { | |
| 15953 word-wrap: break-word; | |
| 15954 } | |
| 15955 </style> | |
| 15956 <div> | |
| 15957 from <any-service-ref ref="{{ source }}"></any-service-ref> | |
| 15958 <template if="{{ slotIsArrayIndex }}">via [{{ slot }}]</template> | |
| 15959 <template if="{{ slotIsField }}">via <field-ref ref="{{ slot }}"></field-r
ef></template> | |
| 15960 | |
| 15961 <curly-block callback="{{ expander() }}"> | |
| 15962 <div class="memberList"> | |
| 15963 <div class="memberItem"> | |
| 15964 <div class="memberName"> | |
| 15965 <template repeat="{{ reference in inboundReferences] }}"> | |
| 15966 <inbound-reference ref="{{ reference }}"></inbound-reference> | |
| 15967 </template> | |
| 15968 </div> | |
| 15969 </div> | |
| 15970 </div> | |
| 15971 </curly-block> | |
| 15972 </div> | |
| 15973 </template> | |
| 15974 </polymer-element> | |
| 15975 | |
| 15976 | |
| 15977 | |
| 15978 | |
| 15979 | |
| 15980 | |
| 15981 | |
| 15982 | |
| 15983 | |
| 15984 | |
| 15985 | |
| 15986 | |
| 15987 | |
| 15988 | |
| 15989 | |
| 15990 | |
| 15991 | |
| 15992 <polymer-element name="object-common" extends="observatory-element"> | |
| 15993 <template> | |
| 15994 <style>/* Global styles */ | |
| 15995 * { | |
| 15996 margin: 0; | |
| 15997 padding: 0; | |
| 15998 font: 400 14px 'Montserrat', sans-serif; | |
| 15999 color: #333; | |
| 16000 box-sizing: border-box; | |
| 16001 } | |
| 16002 | |
| 16003 .content { | |
| 16004 padding-left: 10%; | |
| 16005 font: 400 14px 'Montserrat', sans-serif; | |
| 16006 } | |
| 16007 | |
| 16008 .content-centered { | |
| 16009 padding-left: 10%; | |
| 16010 padding-right: 10%; | |
| 16011 font: 400 14px 'Montserrat', sans-serif; | |
| 16012 } | |
| 16013 | |
| 16014 .content-centered-big { | |
| 16015 padding-left: 5%; | |
| 16016 padding-right: 5%; | |
| 16017 font: 400 14px 'Montserrat', sans-serif; | |
| 16018 } | |
| 16019 | |
| 16020 h1 { | |
| 16021 font: 400 18px 'Montserrat', sans-serif; | |
| 16022 } | |
| 16023 | |
| 16024 .memberList { | |
| 16025 display: table; | |
| 16026 } | |
| 16027 | |
| 16028 .memberItem { | |
| 16029 display: table-row; | |
| 16030 } | |
| 16031 | |
| 16032 .memberName, .memberValue { | |
| 16033 display: table-cell; | |
| 16034 vertical-align: top; | |
| 16035 padding: 3px 0 3px 1em; | |
| 16036 font: 400 14px 'Montserrat', sans-serif; | |
| 16037 } | |
| 16038 | |
| 16039 .memberSmall { | |
| 16040 display: table-cell; | |
| 16041 vertical-align: top; | |
| 16042 padding: 3px 0 3px 1em; | |
| 16043 font: 400 12px 'Montserrat', sans-serif; | |
| 16044 } | |
| 16045 | |
| 16046 .monospace { | |
| 16047 font-family: consolas, courier, monospace; | |
| 16048 font-size: 1em; | |
| 16049 line-height: 1.2em; | |
| 16050 white-space: nowrap; | |
| 16051 } | |
| 16052 | |
| 16053 a { | |
| 16054 color: #0489c3; | |
| 16055 text-decoration: none; | |
| 16056 } | |
| 16057 | |
| 16058 a:hover { | |
| 16059 text-decoration: underline; | |
| 16060 } | |
| 16061 | |
| 16062 em { | |
| 16063 color: inherit; | |
| 16064 font-style: italic; | |
| 16065 } | |
| 16066 | |
| 16067 b { | |
| 16068 color: inherit; | |
| 16069 font-weight: bold; | |
| 16070 } | |
| 16071 | |
| 16072 hr { | |
| 16073 margin-top: 20px; | |
| 16074 margin-bottom: 20px; | |
| 16075 border: 0; | |
| 16076 border-top: 1px solid #eee; | |
| 16077 height: 0; | |
| 16078 box-sizing: content-box; | |
| 16079 } | |
| 16080 | |
| 16081 .list-group { | |
| 16082 padding-left: 0; | |
| 16083 margin-bottom: 20px; | |
| 16084 } | |
| 16085 | |
| 16086 .list-group-item { | |
| 16087 position: relative; | |
| 16088 display: block; | |
| 16089 padding: 10px 15px; | |
| 16090 margin-bottom: -1px; | |
| 16091 background-color: #fff; | |
| 16092 } | |
| 16093 | |
| 16094 .list-group-item:first-child { | |
| 16095 /* rounded top corners */ | |
| 16096 border-top-right-radius:4px; | |
| 16097 border-top-left-radius:4px; | |
| 16098 } | |
| 16099 | |
| 16100 .list-group-item:last-child { | |
| 16101 margin-bottom: 0; | |
| 16102 /* rounded bottom corners */ | |
| 16103 border-bottom-right-radius: 4px; | |
| 16104 border-bottom-left-radius:4px; | |
| 16105 } | |
| 16106 | |
| 16107 /* Flex row container */ | |
| 16108 .flex-row { | |
| 16109 display: flex; | |
| 16110 flex-direction: row; | |
| 16111 } | |
| 16112 | |
| 16113 /* Flex column container */ | |
| 16114 .flex-column { | |
| 16115 display: flex; | |
| 16116 flex-direction: column; | |
| 16117 } | |
| 16118 | |
| 16119 .flex-item-fit { | |
| 16120 flex-grow: 1; | |
| 16121 flex-shrink: 1; | |
| 16122 flex-basis: auto; | |
| 16123 } | |
| 16124 | |
| 16125 .flex-item-no-shrink { | |
| 16126 flex-grow: 0; | |
| 16127 flex-shrink: 0; | |
| 16128 flex-basis: auto; | |
| 16129 } | |
| 16130 | |
| 16131 .flex-item-fill { | |
| 16132 flex-grow: 0; | |
| 16133 flex-shrink: 1; /* shrink when pressured */ | |
| 16134 flex-basis: 100%; /* try and take 100% */ | |
| 16135 } | |
| 16136 | |
| 16137 .flex-item-fixed-1-12 { | |
| 16138 flex-grow: 0; | |
| 16139 flex-shrink: 0; | |
| 16140 flex-basis: 8.3%; | |
| 16141 } | |
| 16142 | |
| 16143 .flex-item-fixed-2-12 { | |
| 16144 flex-grow: 0; | |
| 16145 flex-shrink: 0; | |
| 16146 flex-basis: 16.6%; | |
| 16147 } | |
| 16148 | |
| 16149 .flex-item-fixed-4-12 { | |
| 16150 flex-grow: 0; | |
| 16151 flex-shrink: 0; | |
| 16152 flex-basis: 33.3333%; | |
| 16153 } | |
| 16154 | |
| 16155 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 16156 flex-grow: 0; | |
| 16157 flex-shrink: 0; | |
| 16158 flex-basis: 50%; | |
| 16159 } | |
| 16160 | |
| 16161 .flex-item-fixed-8-12 { | |
| 16162 flex-grow: 0; | |
| 16163 flex-shrink: 0; | |
| 16164 flex-basis: 66.6666%; | |
| 16165 } | |
| 16166 | |
| 16167 .flex-item-fixed-9-12 { | |
| 16168 flex-grow: 0; | |
| 16169 flex-shrink: 0; | |
| 16170 flex-basis: 75%; | |
| 16171 } | |
| 16172 | |
| 16173 | |
| 16174 .flex-item-fixed-12-12 { | |
| 16175 flex-grow: 0; | |
| 16176 flex-shrink: 0; | |
| 16177 flex-basis: 100%; | |
| 16178 } | |
| 16179 | |
| 16180 .flex-item-10-percent { | |
| 16181 flex-grow: 0; | |
| 16182 flex-shrink: 0; | |
| 16183 flex-basis: 10%; | |
| 16184 } | |
| 16185 | |
| 16186 .flex-item-15-percent { | |
| 16187 flex-grow: 0; | |
| 16188 flex-shrink: 0; | |
| 16189 flex-basis: 15%; | |
| 16190 } | |
| 16191 | |
| 16192 .flex-item-20-percent { | |
| 16193 flex-grow: 0; | |
| 16194 flex-shrink: 0; | |
| 16195 flex-basis: 20%; | |
| 16196 } | |
| 16197 | |
| 16198 .flex-item-30-percent { | |
| 16199 flex-grow: 0; | |
| 16200 flex-shrink: 0; | |
| 16201 flex-basis: 30%; | |
| 16202 } | |
| 16203 | |
| 16204 .flex-item-40-percent { | |
| 16205 flex-grow: 0; | |
| 16206 flex-shrink: 0; | |
| 16207 flex-basis: 40%; | |
| 16208 } | |
| 16209 | |
| 16210 .flex-item-50-percent { | |
| 16211 flex-grow: 0; | |
| 16212 flex-shrink: 0; | |
| 16213 flex-basis: 50%; | |
| 16214 } | |
| 16215 | |
| 16216 .flex-item-60-percent { | |
| 16217 flex-grow: 0; | |
| 16218 flex-shrink: 0; | |
| 16219 flex-basis: 60%; | |
| 16220 } | |
| 16221 | |
| 16222 .flex-item-70-percent { | |
| 16223 flex-grow: 0; | |
| 16224 flex-shrink: 0; | |
| 16225 flex-basis: 70%; | |
| 16226 } | |
| 16227 | |
| 16228 .flex-item-80-percent { | |
| 16229 flex-grow: 0; | |
| 16230 flex-shrink: 0; | |
| 16231 flex-basis: 80%; | |
| 16232 } | |
| 16233 | |
| 16234 .well { | |
| 16235 min-height: 20px; | |
| 16236 padding: 19px; | |
| 16237 margin-bottom: 20px; | |
| 16238 background-color: #f5f5f5; | |
| 16239 border: 1px solid #e3e3e3; | |
| 16240 border-radius: 4px; | |
| 16241 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 16242 } | |
| 16243 | |
| 16244 .break-wrap { | |
| 16245 word-wrap: break-word; | |
| 16246 } | |
| 16247 </style> | |
| 16248 <div class="memberList"> | |
| 16249 | |
| 16250 <div class="memberItem"> | |
| 16251 <div class="memberName">class</div> | |
| 16252 <div class="memberValue"> | |
| 16253 <class-ref ref="{{ object.clazz }}"></class-ref> | |
| 16254 </div> | |
| 16255 </div> | |
| 16256 | |
| 16257 <template if="{{ object.size != null }}"> | |
| 16258 <div class="memberItem" title="Space for this object in memory"> | |
| 16259 <div class="memberName">size</div> | |
| 16260 <div class="memberValue">{{ object.size | formatSize }}</div> | |
| 16261 </div> | |
| 16262 </template> | |
| 16263 | |
| 16264 <template if="{{ object.size == null }}"> | |
| 16265 <div class="memberItem" title="Space for this object in memory"> | |
| 16266 <div class="memberName">size</div> | |
| 16267 <div class="memberValue">0</div> | |
| 16268 </div> | |
| 16269 </template> | |
| 16270 | |
| 16271 <div class="memberItem" title="Space that would be reclaimed if references
to this object were replaced with null"> | |
| 16272 <div class="memberName">retained size</div> | |
| 16273 <div class="memberValue"> | |
| 16274 <template if="{{ retainedBytes == null }}"> | |
| 16275 <eval-link callback="{{ retainedSize }}" label="[calculate]"> | |
| 16276 </eval-link> | |
| 16277 </template> | |
| 16278 <template if="{{ retainedBytes != null }}"> | |
| 16279 {{ retainedBytes | formatSize }} | |
| 16280 </template> | |
| 16281 </div> | |
| 16282 </div> | |
| 16283 | |
| 16284 <div class="memberItem"> | |
| 16285 <div class="memberName">retaining path</div> | |
| 16286 <div class="memberValue"> | |
| 16287 <template if="{{ path == null }}"> | |
| 16288 <eval-link callback="{{ retainingPath }}" label="[find]" expr="10"> | |
| 16289 </eval-link> | |
| 16290 </template> | |
| 16291 <template if="{{ path != null }}"> | |
| 16292 <template repeat="{{ element in path['elements'] }}"> | |
| 16293 <div class="memberItem"> | |
| 16294 <div class="memberName">[{{ element['index']}}]</div> | |
| 16295 <div class="memberValue"> | |
| 16296 <any-service-ref ref="{{ element['value'] }}"></any-service-ref> | |
| 16297 <template if="{{ element['parentField'] != null }}"> | |
| 16298 in <field-ref ref="{{ element['parentField'] }}"></field-ref>
of | |
| 16299 </template> | |
| 16300 <template if="{{ element['parentListIndex'] != null }}"> | |
| 16301 in [{{ element['parentListIndex'] }}] of | |
| 16302 </template> | |
| 16303 </div> | |
| 16304 </div> | |
| 16305 </template> | |
| 16306 <template if="{{ path['length'] > path['elements'].length }}"> | |
| 16307 showing {{ path['elements'].length }} of {{ path['length'] }} | |
| 16308 <eval-link callback="{{ retainingPath }}" label="[find more]" expr
="{{ path['elements'].length * 2 }}"> | |
| 16309 </eval-link> | |
| 16310 </template> | |
| 16311 </template> | |
| 16312 </div> | |
| 16313 </div> | |
| 16314 | |
| 16315 <div class="memberItem" title="Objects which directly reference this objec
t"> | |
| 16316 <div class="memberName">inbound references</div> | |
| 16317 <div class="memberValue"> | |
| 16318 <template if="{{ inboundReferences == null }}"> | |
| 16319 <eval-link callback="{{ fetchInboundReferences }}" label="[find]" ex
pr="100"> | |
| 16320 </eval-link> | |
| 16321 </template> | |
| 16322 <template if="{{ inboundReferences != null }}"> | |
| 16323 <template repeat="{{ reference in inboundReferences['references'] }}
"> | |
| 16324 <inbound-reference ref="{{ reference }}"></inbound-reference> | |
| 16325 </template> | |
| 16326 </template> | |
| 16327 </div> | |
| 16328 </div> | |
| 16329 | |
| 16330 </div> | |
| 16331 </template> | |
| 16332 </polymer-element> | |
| 16333 | |
| 16334 | |
| 16335 | |
| 16336 | |
| 16337 | |
| 16338 | |
| 16339 | |
| 16340 | |
| 16341 <polymer-element name="context-ref" extends="service-ref"> | |
| 16342 <template> | |
| 16343 <style>/* Global styles */ | |
| 16344 * { | |
| 16345 margin: 0; | |
| 16346 padding: 0; | |
| 16347 font: 400 14px 'Montserrat', sans-serif; | |
| 16348 color: #333; | |
| 16349 box-sizing: border-box; | |
| 16350 } | |
| 16351 | |
| 16352 .content { | |
| 16353 padding-left: 10%; | |
| 16354 font: 400 14px 'Montserrat', sans-serif; | |
| 16355 } | |
| 16356 | |
| 16357 .content-centered { | |
| 16358 padding-left: 10%; | |
| 16359 padding-right: 10%; | |
| 16360 font: 400 14px 'Montserrat', sans-serif; | |
| 16361 } | |
| 16362 | |
| 16363 .content-centered-big { | |
| 16364 padding-left: 5%; | |
| 16365 padding-right: 5%; | |
| 16366 font: 400 14px 'Montserrat', sans-serif; | |
| 16367 } | |
| 16368 | |
| 16369 h1 { | |
| 16370 font: 400 18px 'Montserrat', sans-serif; | |
| 16371 } | |
| 16372 | |
| 16373 .memberList { | |
| 16374 display: table; | |
| 16375 } | |
| 16376 | |
| 16377 .memberItem { | |
| 16378 display: table-row; | |
| 16379 } | |
| 16380 | |
| 16381 .memberName, .memberValue { | |
| 16382 display: table-cell; | |
| 16383 vertical-align: top; | |
| 16384 padding: 3px 0 3px 1em; | |
| 16385 font: 400 14px 'Montserrat', sans-serif; | |
| 16386 } | |
| 16387 | |
| 16388 .memberSmall { | |
| 16389 display: table-cell; | |
| 16390 vertical-align: top; | |
| 16391 padding: 3px 0 3px 1em; | |
| 16392 font: 400 12px 'Montserrat', sans-serif; | |
| 16393 } | |
| 16394 | |
| 16395 .monospace { | |
| 16396 font-family: consolas, courier, monospace; | |
| 16397 font-size: 1em; | |
| 16398 line-height: 1.2em; | |
| 16399 white-space: nowrap; | |
| 16400 } | |
| 16401 | |
| 16402 a { | |
| 16403 color: #0489c3; | |
| 16404 text-decoration: none; | |
| 16405 } | |
| 16406 | |
| 16407 a:hover { | |
| 16408 text-decoration: underline; | |
| 16409 } | |
| 16410 | |
| 16411 em { | |
| 16412 color: inherit; | |
| 16413 font-style: italic; | |
| 16414 } | |
| 16415 | |
| 16416 b { | |
| 16417 color: inherit; | |
| 16418 font-weight: bold; | |
| 16419 } | |
| 16420 | |
| 16421 hr { | |
| 16422 margin-top: 20px; | |
| 16423 margin-bottom: 20px; | |
| 16424 border: 0; | |
| 16425 border-top: 1px solid #eee; | |
| 16426 height: 0; | |
| 16427 box-sizing: content-box; | |
| 16428 } | |
| 16429 | |
| 16430 .list-group { | |
| 16431 padding-left: 0; | |
| 16432 margin-bottom: 20px; | |
| 16433 } | |
| 16434 | |
| 16435 .list-group-item { | |
| 16436 position: relative; | |
| 16437 display: block; | |
| 16438 padding: 10px 15px; | |
| 16439 margin-bottom: -1px; | |
| 16440 background-color: #fff; | |
| 16441 } | |
| 16442 | |
| 16443 .list-group-item:first-child { | |
| 16444 /* rounded top corners */ | |
| 16445 border-top-right-radius:4px; | |
| 16446 border-top-left-radius:4px; | |
| 16447 } | |
| 16448 | |
| 16449 .list-group-item:last-child { | |
| 16450 margin-bottom: 0; | |
| 16451 /* rounded bottom corners */ | |
| 16452 border-bottom-right-radius: 4px; | |
| 16453 border-bottom-left-radius:4px; | |
| 16454 } | |
| 16455 | |
| 16456 /* Flex row container */ | |
| 16457 .flex-row { | |
| 16458 display: flex; | |
| 16459 flex-direction: row; | |
| 16460 } | |
| 16461 | |
| 16462 /* Flex column container */ | |
| 16463 .flex-column { | |
| 16464 display: flex; | |
| 16465 flex-direction: column; | |
| 16466 } | |
| 16467 | |
| 16468 .flex-item-fit { | |
| 16469 flex-grow: 1; | |
| 16470 flex-shrink: 1; | |
| 16471 flex-basis: auto; | |
| 16472 } | |
| 16473 | |
| 16474 .flex-item-no-shrink { | |
| 16475 flex-grow: 0; | |
| 16476 flex-shrink: 0; | |
| 16477 flex-basis: auto; | |
| 16478 } | |
| 16479 | |
| 16480 .flex-item-fill { | |
| 16481 flex-grow: 0; | |
| 16482 flex-shrink: 1; /* shrink when pressured */ | |
| 16483 flex-basis: 100%; /* try and take 100% */ | |
| 16484 } | |
| 16485 | |
| 16486 .flex-item-fixed-1-12 { | |
| 16487 flex-grow: 0; | |
| 16488 flex-shrink: 0; | |
| 16489 flex-basis: 8.3%; | |
| 16490 } | |
| 16491 | |
| 16492 .flex-item-fixed-2-12 { | |
| 16493 flex-grow: 0; | |
| 16494 flex-shrink: 0; | |
| 16495 flex-basis: 16.6%; | |
| 16496 } | |
| 16497 | |
| 16498 .flex-item-fixed-4-12 { | |
| 16499 flex-grow: 0; | |
| 16500 flex-shrink: 0; | |
| 16501 flex-basis: 33.3333%; | |
| 16502 } | |
| 16503 | |
| 16504 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 16505 flex-grow: 0; | |
| 16506 flex-shrink: 0; | |
| 16507 flex-basis: 50%; | |
| 16508 } | |
| 16509 | |
| 16510 .flex-item-fixed-8-12 { | |
| 16511 flex-grow: 0; | |
| 16512 flex-shrink: 0; | |
| 16513 flex-basis: 66.6666%; | |
| 16514 } | |
| 16515 | |
| 16516 .flex-item-fixed-9-12 { | |
| 16517 flex-grow: 0; | |
| 16518 flex-shrink: 0; | |
| 16519 flex-basis: 75%; | |
| 16520 } | |
| 16521 | |
| 16522 | |
| 16523 .flex-item-fixed-12-12 { | |
| 16524 flex-grow: 0; | |
| 16525 flex-shrink: 0; | |
| 16526 flex-basis: 100%; | |
| 16527 } | |
| 16528 | |
| 16529 .flex-item-10-percent { | |
| 16530 flex-grow: 0; | |
| 16531 flex-shrink: 0; | |
| 16532 flex-basis: 10%; | |
| 16533 } | |
| 16534 | |
| 16535 .flex-item-15-percent { | |
| 16536 flex-grow: 0; | |
| 16537 flex-shrink: 0; | |
| 16538 flex-basis: 15%; | |
| 16539 } | |
| 16540 | |
| 16541 .flex-item-20-percent { | |
| 16542 flex-grow: 0; | |
| 16543 flex-shrink: 0; | |
| 16544 flex-basis: 20%; | |
| 16545 } | |
| 16546 | |
| 16547 .flex-item-30-percent { | |
| 16548 flex-grow: 0; | |
| 16549 flex-shrink: 0; | |
| 16550 flex-basis: 30%; | |
| 16551 } | |
| 16552 | |
| 16553 .flex-item-40-percent { | |
| 16554 flex-grow: 0; | |
| 16555 flex-shrink: 0; | |
| 16556 flex-basis: 40%; | |
| 16557 } | |
| 16558 | |
| 16559 .flex-item-50-percent { | |
| 16560 flex-grow: 0; | |
| 16561 flex-shrink: 0; | |
| 16562 flex-basis: 50%; | |
| 16563 } | |
| 16564 | |
| 16565 .flex-item-60-percent { | |
| 16566 flex-grow: 0; | |
| 16567 flex-shrink: 0; | |
| 16568 flex-basis: 60%; | |
| 16569 } | |
| 16570 | |
| 16571 .flex-item-70-percent { | |
| 16572 flex-grow: 0; | |
| 16573 flex-shrink: 0; | |
| 16574 flex-basis: 70%; | |
| 16575 } | |
| 16576 | |
| 16577 .flex-item-80-percent { | |
| 16578 flex-grow: 0; | |
| 16579 flex-shrink: 0; | |
| 16580 flex-basis: 80%; | |
| 16581 } | |
| 16582 | |
| 16583 .well { | |
| 16584 min-height: 20px; | |
| 16585 padding: 19px; | |
| 16586 margin-bottom: 20px; | |
| 16587 background-color: #f5f5f5; | |
| 16588 border: 1px solid #e3e3e3; | |
| 16589 border-radius: 4px; | |
| 16590 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 16591 } | |
| 16592 | |
| 16593 .break-wrap { | |
| 16594 word-wrap: break-word; | |
| 16595 } | |
| 16596 </style> | |
| 16597 <span> | |
| 16598 <a on-click="{{ goto }}" _href="{{ url }}"><em>Context</em> ({{ ref.length
}})</a> | |
| 16599 <curly-block callback="{{ expander() }}"> | |
| 16600 <div class="memberList"> | |
| 16601 <div class="memberItem"> | |
| 16602 <div class="memberName">parent</div> | |
| 16603 <div class="memberValue"> | |
| 16604 <any-service-ref ref="{{ ref.parentContext }}"></any-service-ref> | |
| 16605 </div> | |
| 16606 </div> | |
| 16607 <template repeat="{{ variable in ref.variables }}"> | |
| 16608 <div class="memberItem"> | |
| 16609 <div class="memberName">[{{ variable['index']}}]</div> | |
| 16610 <div class="memberValue"> | |
| 16611 <any-service-ref ref="{{ variable['value'] }}"></any-service-ref
> | |
| 16612 </div> | |
| 16613 </div> | |
| 16614 </template> | |
| 16615 </div> | |
| 16616 </curly-block> | |
| 16617 </span> | |
| 16618 </template> | |
| 16619 </polymer-element> | |
| 16620 | |
| 16621 | |
| 16622 | |
| 16623 | |
| 16624 <polymer-element name="instance-view" extends="observatory-element"> | |
| 16625 <template> | |
| 16626 <style>/* Global styles */ | |
| 16627 * { | |
| 16628 margin: 0; | |
| 16629 padding: 0; | |
| 16630 font: 400 14px 'Montserrat', sans-serif; | |
| 16631 color: #333; | |
| 16632 box-sizing: border-box; | |
| 16633 } | |
| 16634 | |
| 16635 .content { | |
| 16636 padding-left: 10%; | |
| 16637 font: 400 14px 'Montserrat', sans-serif; | |
| 16638 } | |
| 16639 | |
| 16640 .content-centered { | |
| 16641 padding-left: 10%; | |
| 16642 padding-right: 10%; | |
| 16643 font: 400 14px 'Montserrat', sans-serif; | |
| 16644 } | |
| 16645 | |
| 16646 .content-centered-big { | |
| 16647 padding-left: 5%; | |
| 16648 padding-right: 5%; | |
| 16649 font: 400 14px 'Montserrat', sans-serif; | |
| 16650 } | |
| 16651 | |
| 16652 h1 { | |
| 16653 font: 400 18px 'Montserrat', sans-serif; | |
| 16654 } | |
| 16655 | |
| 16656 .memberList { | |
| 16657 display: table; | |
| 16658 } | |
| 16659 | |
| 16660 .memberItem { | |
| 16661 display: table-row; | |
| 16662 } | |
| 16663 | |
| 16664 .memberName, .memberValue { | |
| 16665 display: table-cell; | |
| 16666 vertical-align: top; | |
| 16667 padding: 3px 0 3px 1em; | |
| 16668 font: 400 14px 'Montserrat', sans-serif; | |
| 16669 } | |
| 16670 | |
| 16671 .memberSmall { | |
| 16672 display: table-cell; | |
| 16673 vertical-align: top; | |
| 16674 padding: 3px 0 3px 1em; | |
| 16675 font: 400 12px 'Montserrat', sans-serif; | |
| 16676 } | |
| 16677 | |
| 16678 .monospace { | |
| 16679 font-family: consolas, courier, monospace; | |
| 16680 font-size: 1em; | |
| 16681 line-height: 1.2em; | |
| 16682 white-space: nowrap; | |
| 16683 } | |
| 16684 | |
| 16685 a { | |
| 16686 color: #0489c3; | |
| 16687 text-decoration: none; | |
| 16688 } | |
| 16689 | |
| 16690 a:hover { | |
| 16691 text-decoration: underline; | |
| 16692 } | |
| 16693 | |
| 16694 em { | |
| 16695 color: inherit; | |
| 16696 font-style: italic; | |
| 16697 } | |
| 16698 | |
| 16699 b { | |
| 16700 color: inherit; | |
| 16701 font-weight: bold; | |
| 16702 } | |
| 16703 | |
| 16704 hr { | |
| 16705 margin-top: 20px; | |
| 16706 margin-bottom: 20px; | |
| 16707 border: 0; | |
| 16708 border-top: 1px solid #eee; | |
| 16709 height: 0; | |
| 16710 box-sizing: content-box; | |
| 16711 } | |
| 16712 | |
| 16713 .list-group { | |
| 16714 padding-left: 0; | |
| 16715 margin-bottom: 20px; | |
| 16716 } | |
| 16717 | |
| 16718 .list-group-item { | |
| 16719 position: relative; | |
| 16720 display: block; | |
| 16721 padding: 10px 15px; | |
| 16722 margin-bottom: -1px; | |
| 16723 background-color: #fff; | |
| 16724 } | |
| 16725 | |
| 16726 .list-group-item:first-child { | |
| 16727 /* rounded top corners */ | |
| 16728 border-top-right-radius:4px; | |
| 16729 border-top-left-radius:4px; | |
| 16730 } | |
| 16731 | |
| 16732 .list-group-item:last-child { | |
| 16733 margin-bottom: 0; | |
| 16734 /* rounded bottom corners */ | |
| 16735 border-bottom-right-radius: 4px; | |
| 16736 border-bottom-left-radius:4px; | |
| 16737 } | |
| 16738 | |
| 16739 /* Flex row container */ | |
| 16740 .flex-row { | |
| 16741 display: flex; | |
| 16742 flex-direction: row; | |
| 16743 } | |
| 16744 | |
| 16745 /* Flex column container */ | |
| 16746 .flex-column { | |
| 16747 display: flex; | |
| 16748 flex-direction: column; | |
| 16749 } | |
| 16750 | |
| 16751 .flex-item-fit { | |
| 16752 flex-grow: 1; | |
| 16753 flex-shrink: 1; | |
| 16754 flex-basis: auto; | |
| 16755 } | |
| 16756 | |
| 16757 .flex-item-no-shrink { | |
| 16758 flex-grow: 0; | |
| 16759 flex-shrink: 0; | |
| 16760 flex-basis: auto; | |
| 16761 } | |
| 16762 | |
| 16763 .flex-item-fill { | |
| 16764 flex-grow: 0; | |
| 16765 flex-shrink: 1; /* shrink when pressured */ | |
| 16766 flex-basis: 100%; /* try and take 100% */ | |
| 16767 } | |
| 16768 | |
| 16769 .flex-item-fixed-1-12 { | |
| 16770 flex-grow: 0; | |
| 16771 flex-shrink: 0; | |
| 16772 flex-basis: 8.3%; | |
| 16773 } | |
| 16774 | |
| 16775 .flex-item-fixed-2-12 { | |
| 16776 flex-grow: 0; | |
| 16777 flex-shrink: 0; | |
| 16778 flex-basis: 16.6%; | |
| 16779 } | |
| 16780 | |
| 16781 .flex-item-fixed-4-12 { | |
| 16782 flex-grow: 0; | |
| 16783 flex-shrink: 0; | |
| 16784 flex-basis: 33.3333%; | |
| 16785 } | |
| 16786 | |
| 16787 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 16788 flex-grow: 0; | |
| 16789 flex-shrink: 0; | |
| 16790 flex-basis: 50%; | |
| 16791 } | |
| 16792 | |
| 16793 .flex-item-fixed-8-12 { | |
| 16794 flex-grow: 0; | |
| 16795 flex-shrink: 0; | |
| 16796 flex-basis: 66.6666%; | |
| 16797 } | |
| 16798 | |
| 16799 .flex-item-fixed-9-12 { | |
| 16800 flex-grow: 0; | |
| 16801 flex-shrink: 0; | |
| 16802 flex-basis: 75%; | |
| 16803 } | |
| 16804 | |
| 16805 | |
| 16806 .flex-item-fixed-12-12 { | |
| 16807 flex-grow: 0; | |
| 16808 flex-shrink: 0; | |
| 16809 flex-basis: 100%; | |
| 16810 } | |
| 16811 | |
| 16812 .flex-item-10-percent { | |
| 16813 flex-grow: 0; | |
| 16814 flex-shrink: 0; | |
| 16815 flex-basis: 10%; | |
| 16816 } | |
| 16817 | |
| 16818 .flex-item-15-percent { | |
| 16819 flex-grow: 0; | |
| 16820 flex-shrink: 0; | |
| 16821 flex-basis: 15%; | |
| 16822 } | |
| 16823 | |
| 16824 .flex-item-20-percent { | |
| 16825 flex-grow: 0; | |
| 16826 flex-shrink: 0; | |
| 16827 flex-basis: 20%; | |
| 16828 } | |
| 16829 | |
| 16830 .flex-item-30-percent { | |
| 16831 flex-grow: 0; | |
| 16832 flex-shrink: 0; | |
| 16833 flex-basis: 30%; | |
| 16834 } | |
| 16835 | |
| 16836 .flex-item-40-percent { | |
| 16837 flex-grow: 0; | |
| 16838 flex-shrink: 0; | |
| 16839 flex-basis: 40%; | |
| 16840 } | |
| 16841 | |
| 16842 .flex-item-50-percent { | |
| 16843 flex-grow: 0; | |
| 16844 flex-shrink: 0; | |
| 16845 flex-basis: 50%; | |
| 16846 } | |
| 16847 | |
| 16848 .flex-item-60-percent { | |
| 16849 flex-grow: 0; | |
| 16850 flex-shrink: 0; | |
| 16851 flex-basis: 60%; | |
| 16852 } | |
| 16853 | |
| 16854 .flex-item-70-percent { | |
| 16855 flex-grow: 0; | |
| 16856 flex-shrink: 0; | |
| 16857 flex-basis: 70%; | |
| 16858 } | |
| 16859 | |
| 16860 .flex-item-80-percent { | |
| 16861 flex-grow: 0; | |
| 16862 flex-shrink: 0; | |
| 16863 flex-basis: 80%; | |
| 16864 } | |
| 16865 | |
| 16866 .well { | |
| 16867 min-height: 20px; | |
| 16868 padding: 19px; | |
| 16869 margin-bottom: 20px; | |
| 16870 background-color: #f5f5f5; | |
| 16871 border: 1px solid #e3e3e3; | |
| 16872 border-radius: 4px; | |
| 16873 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 16874 } | |
| 16875 | |
| 16876 .break-wrap { | |
| 16877 word-wrap: break-word; | |
| 16878 } | |
| 16879 </style> | |
| 16880 <nav-bar> | |
| 16881 <top-nav-menu></top-nav-menu> | |
| 16882 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu> | |
| 16883 <!-- TODO(turnidge): Add library nav menu here. --> | |
| 16884 <class-nav-menu cls="{{ instance.clazz }}"></class-nav-menu> | |
| 16885 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> | |
| 16886 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 16887 <nav-control></nav-control> | |
| 16888 </nav-bar> | |
| 16889 | |
| 16890 <template if="{{ instance.isError }}"> | |
| 16891 <error-view error_obj="{{ instance['error'] }}"></error-view> | |
| 16892 </template> | |
| 16893 | |
| 16894 <template if="{{ !instance.isError }}"> | |
| 16895 <div class="content"> | |
| 16896 <template if="{{ instance.isAbstractType }}"> | |
| 16897 <h1>type {{ instance.name }}</h1> | |
| 16898 </template> | |
| 16899 <template if="{{ !instance.isAbstractType }}"> | |
| 16900 <h1>instance of {{ instance.clazz.name }}</h1> | |
| 16901 </template> | |
| 16902 | |
| 16903 <object-common object="{{ instance }}"></object-common> | |
| 16904 | |
| 16905 <div class="memberList"> | |
| 16906 <div class="memberItem"> </div> | |
| 16907 | |
| 16908 <template if="{{ instance.valueAsString != null }}"> | |
| 16909 <div class="memberItem"> | |
| 16910 <div class="memberName">value</div> | |
| 16911 <div class="memberValue">{{ instance.valueAsString }}</div> | |
| 16912 </div> | |
| 16913 </template> | |
| 16914 | |
| 16915 <template if="{{ instance.isString }}"> | |
| 16916 <div class="memberItem"> | |
| 16917 <div class="memberName">valueAsLiteral</div> | |
| 16918 <div class="memberValue"> {{ asStringLiteral(instance.valueAsStrin
g, instance.valueAsStringIsTruncated) }}</div> | |
| 16919 </div> | |
| 16920 </template> | |
| 16921 | |
| 16922 <template if="{{ instance.isMirrorReference }}"> | |
| 16923 <div class="memberItem"> | |
| 16924 <div class="memberName">referent</div> | |
| 16925 <div class="memberValue"> | |
| 16926 <any-service-ref ref="{{ instance.referent }}"> | |
| 16927 </any-service-ref> | |
| 16928 </div> | |
| 16929 </div> | |
| 16930 </template> | |
| 16931 | |
| 16932 <template if="{{ instance.typeClass != null }}"> | |
| 16933 <div class="memberItem"> | |
| 16934 <div class="memberName">type class</div> | |
| 16935 <div class="memberValue"> | |
| 16936 <class-ref ref="{{ instance.typeClass }}"> | |
| 16937 </class-ref> | |
| 16938 </div> | |
| 16939 </div> | |
| 16940 </template> | |
| 16941 | |
| 16942 <template if="{{ instance.isClosure }}"> | |
| 16943 <div class="memberItem"> | |
| 16944 <div class="memberName">closure function</div> | |
| 16945 <div class="memberValue"> | |
| 16946 <function-ref ref="{{ instance.closureFunc }}"> | |
| 16947 </function-ref> | |
| 16948 </div> | |
| 16949 </div> | |
| 16950 </template> | |
| 16951 <template if="{{ instance.isClosure }}"> | |
| 16952 <div class="memberItem"> | |
| 16953 <div class="memberName">closure context</div> | |
| 16954 <div class="memberValue"> | |
| 16955 <any-service-ref ref="{{ instance.closureCtxt }}"> | |
| 16956 </any-service-ref> | |
| 16957 </div> | |
| 16958 </div> | |
| 16959 </template> | |
| 16960 | |
| 16961 <template if="{{ instance.isWeakProperty }}"> | |
| 16962 <div class="memberItem"> | |
| 16963 <div class="memberName">key</div> | |
| 16964 <div class="memberValue"> | |
| 16965 <any-service-ref ref="{{ instance.key }}"> | |
| 16966 </any-service-ref> | |
| 16967 </div> | |
| 16968 </div> | |
| 16969 <div class="memberItem"> | |
| 16970 <div class="memberName">value</div> | |
| 16971 <div class="memberValue"> | |
| 16972 <any-service-ref ref="{{ instance.value }}"> | |
| 16973 </any-service-ref> | |
| 16974 </div> | |
| 16975 </div> | |
| 16976 </template> | |
| 16977 | |
| 16978 <div class="memberItem"> | |
| 16979 <div class="memberName">toString()</div> | |
| 16980 <div class="memberValue"> | |
| 16981 <eval-link callback="{{ eval }}" expr="toString()"></eval-link> | |
| 16982 </div> | |
| 16983 </div> | |
| 16984 </div> | |
| 16985 </div> | |
| 16986 | |
| 16987 <hr> | |
| 16988 | |
| 16989 <div class="content"> | |
| 16990 <template if="{{ instance.nativeFields.isNotEmpty }}"> | |
| 16991 native fields ({{ instance.nativeFields.length }}) | |
| 16992 <curly-block expand="{{ instance.nativeFields.length <= 8 }}"> | |
| 16993 <div class="memberList"> | |
| 16994 <template repeat="{{ field in instance.nativeFields }}"> | |
| 16995 <div class="memberItem"> | |
| 16996 <div class="memberName">[{{ field['index']}}]</div> | |
| 16997 <div class="memberValue">[{{ field['value']}}]</div> | |
| 16998 </div> | |
| 16999 </template> | |
| 17000 </div> | |
| 17001 </curly-block><br><br> | |
| 17002 </template> | |
| 17003 | |
| 17004 <template if="{{ instance.fields.isNotEmpty }}"> | |
| 17005 fields ({{ instance.fields.length }}) | |
| 17006 <curly-block expand="{{ instance.fields.length <= 8 }}"> | |
| 17007 <div class="memberList"> | |
| 17008 <template repeat="{{ field in instance.fields }}"> | |
| 17009 <div class="memberItem"> | |
| 17010 <div class="memberName"> | |
| 17011 <field-ref ref="{{ field['decl'] }}"></field-ref> | |
| 17012 </div> | |
| 17013 <div class="memberValue"> | |
| 17014 <any-service-ref ref="{{ field.value }}"></any-service-ref> | |
| 17015 </div> | |
| 17016 </div> | |
| 17017 </template> | |
| 17018 </div> | |
| 17019 </curly-block><br><br> | |
| 17020 </template> | |
| 17021 | |
| 17022 <template if="{{ instance.elements.isNotEmpty }}"> | |
| 17023 elements ({{ instance.elements.length }}) | |
| 17024 <curly-block expand="{{ instance.elements.length <= 8 }}"> | |
| 17025 <div class="memberList"> | |
| 17026 <template repeat="{{ element in instance.elements }}"> | |
| 17027 <div class="memberItem"> | |
| 17028 <div class="memberName">[{{ element['index']}}]</div> | |
| 17029 <div class="memberValue"> | |
| 17030 <any-service-ref ref="{{ element['value'] }}"></any-service-
ref> | |
| 17031 </div> | |
| 17032 </div> | |
| 17033 </template> | |
| 17034 </div> | |
| 17035 </curly-block><br><br> | |
| 17036 </template> | |
| 17037 </div> | |
| 17038 | |
| 17039 <hr> | |
| 17040 | |
| 17041 <div class="content"> | |
| 17042 <eval-box callback="{{ eval }}"></eval-box> | |
| 17043 </div> | |
| 17044 | |
| 17045 <br><br><br><br> | |
| 17046 <br><br><br><br> | |
| 17047 | |
| 17048 </template> | |
| 17049 </template> | |
| 17050 </polymer-element> | |
| 17051 | |
| 17052 | |
| 17053 | |
| 17054 | |
| 17055 | |
| 17056 | |
| 17057 <polymer-element name="json-view" extends="observatory-element"> | |
| 17058 <template> | |
| 17059 <nav-bar> | |
| 17060 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 17061 </nav-bar> | |
| 17062 <pre>{{ mapAsString }}</pre> | |
| 17063 </template> | |
| 17064 </polymer-element> | |
| 17065 | |
| 17066 | |
| 17067 | |
| 17068 | |
| 17069 | |
| 17070 | |
| 17071 | |
| 17072 | |
| 17073 | |
| 17074 | |
| 17075 | |
| 17076 | |
| 17077 | |
| 17078 | |
| 17079 | |
| 17080 | |
| 17081 <polymer-element name="library-view" extends="observatory-element"> | |
| 17082 <template> | |
| 17083 <style>/* Global styles */ | |
| 17084 * { | |
| 17085 margin: 0; | |
| 17086 padding: 0; | |
| 17087 font: 400 14px 'Montserrat', sans-serif; | |
| 17088 color: #333; | |
| 17089 box-sizing: border-box; | |
| 17090 } | |
| 17091 | |
| 17092 .content { | |
| 17093 padding-left: 10%; | |
| 17094 font: 400 14px 'Montserrat', sans-serif; | |
| 17095 } | |
| 17096 | |
| 17097 .content-centered { | |
| 17098 padding-left: 10%; | |
| 17099 padding-right: 10%; | |
| 17100 font: 400 14px 'Montserrat', sans-serif; | |
| 17101 } | |
| 17102 | |
| 17103 .content-centered-big { | |
| 17104 padding-left: 5%; | |
| 17105 padding-right: 5%; | |
| 17106 font: 400 14px 'Montserrat', sans-serif; | |
| 17107 } | |
| 17108 | |
| 17109 h1 { | |
| 17110 font: 400 18px 'Montserrat', sans-serif; | |
| 17111 } | |
| 17112 | |
| 17113 .memberList { | |
| 17114 display: table; | |
| 17115 } | |
| 17116 | |
| 17117 .memberItem { | |
| 17118 display: table-row; | |
| 17119 } | |
| 17120 | |
| 17121 .memberName, .memberValue { | |
| 17122 display: table-cell; | |
| 17123 vertical-align: top; | |
| 17124 padding: 3px 0 3px 1em; | |
| 17125 font: 400 14px 'Montserrat', sans-serif; | |
| 17126 } | |
| 17127 | |
| 17128 .memberSmall { | |
| 17129 display: table-cell; | |
| 17130 vertical-align: top; | |
| 17131 padding: 3px 0 3px 1em; | |
| 17132 font: 400 12px 'Montserrat', sans-serif; | |
| 17133 } | |
| 17134 | |
| 17135 .monospace { | |
| 17136 font-family: consolas, courier, monospace; | |
| 17137 font-size: 1em; | |
| 17138 line-height: 1.2em; | |
| 17139 white-space: nowrap; | |
| 17140 } | |
| 17141 | |
| 17142 a { | |
| 17143 color: #0489c3; | |
| 17144 text-decoration: none; | |
| 17145 } | |
| 17146 | |
| 17147 a:hover { | |
| 17148 text-decoration: underline; | |
| 17149 } | |
| 17150 | |
| 17151 em { | |
| 17152 color: inherit; | |
| 17153 font-style: italic; | |
| 17154 } | |
| 17155 | |
| 17156 b { | |
| 17157 color: inherit; | |
| 17158 font-weight: bold; | |
| 17159 } | |
| 17160 | |
| 17161 hr { | |
| 17162 margin-top: 20px; | |
| 17163 margin-bottom: 20px; | |
| 17164 border: 0; | |
| 17165 border-top: 1px solid #eee; | |
| 17166 height: 0; | |
| 17167 box-sizing: content-box; | |
| 17168 } | |
| 17169 | |
| 17170 .list-group { | |
| 17171 padding-left: 0; | |
| 17172 margin-bottom: 20px; | |
| 17173 } | |
| 17174 | |
| 17175 .list-group-item { | |
| 17176 position: relative; | |
| 17177 display: block; | |
| 17178 padding: 10px 15px; | |
| 17179 margin-bottom: -1px; | |
| 17180 background-color: #fff; | |
| 17181 } | |
| 17182 | |
| 17183 .list-group-item:first-child { | |
| 17184 /* rounded top corners */ | |
| 17185 border-top-right-radius:4px; | |
| 17186 border-top-left-radius:4px; | |
| 17187 } | |
| 17188 | |
| 17189 .list-group-item:last-child { | |
| 17190 margin-bottom: 0; | |
| 17191 /* rounded bottom corners */ | |
| 17192 border-bottom-right-radius: 4px; | |
| 17193 border-bottom-left-radius:4px; | |
| 17194 } | |
| 17195 | |
| 17196 /* Flex row container */ | |
| 17197 .flex-row { | |
| 17198 display: flex; | |
| 17199 flex-direction: row; | |
| 17200 } | |
| 17201 | |
| 17202 /* Flex column container */ | |
| 17203 .flex-column { | |
| 17204 display: flex; | |
| 17205 flex-direction: column; | |
| 17206 } | |
| 17207 | |
| 17208 .flex-item-fit { | |
| 17209 flex-grow: 1; | |
| 17210 flex-shrink: 1; | |
| 17211 flex-basis: auto; | |
| 17212 } | |
| 17213 | |
| 17214 .flex-item-no-shrink { | |
| 17215 flex-grow: 0; | |
| 17216 flex-shrink: 0; | |
| 17217 flex-basis: auto; | |
| 17218 } | |
| 17219 | |
| 17220 .flex-item-fill { | |
| 17221 flex-grow: 0; | |
| 17222 flex-shrink: 1; /* shrink when pressured */ | |
| 17223 flex-basis: 100%; /* try and take 100% */ | |
| 17224 } | |
| 17225 | |
| 17226 .flex-item-fixed-1-12 { | |
| 17227 flex-grow: 0; | |
| 17228 flex-shrink: 0; | |
| 17229 flex-basis: 8.3%; | |
| 17230 } | |
| 17231 | |
| 17232 .flex-item-fixed-2-12 { | |
| 17233 flex-grow: 0; | |
| 17234 flex-shrink: 0; | |
| 17235 flex-basis: 16.6%; | |
| 17236 } | |
| 17237 | |
| 17238 .flex-item-fixed-4-12 { | |
| 17239 flex-grow: 0; | |
| 17240 flex-shrink: 0; | |
| 17241 flex-basis: 33.3333%; | |
| 17242 } | |
| 17243 | |
| 17244 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 17245 flex-grow: 0; | |
| 17246 flex-shrink: 0; | |
| 17247 flex-basis: 50%; | |
| 17248 } | |
| 17249 | |
| 17250 .flex-item-fixed-8-12 { | |
| 17251 flex-grow: 0; | |
| 17252 flex-shrink: 0; | |
| 17253 flex-basis: 66.6666%; | |
| 17254 } | |
| 17255 | |
| 17256 .flex-item-fixed-9-12 { | |
| 17257 flex-grow: 0; | |
| 17258 flex-shrink: 0; | |
| 17259 flex-basis: 75%; | |
| 17260 } | |
| 17261 | |
| 17262 | |
| 17263 .flex-item-fixed-12-12 { | |
| 17264 flex-grow: 0; | |
| 17265 flex-shrink: 0; | |
| 17266 flex-basis: 100%; | |
| 17267 } | |
| 17268 | |
| 17269 .flex-item-10-percent { | |
| 17270 flex-grow: 0; | |
| 17271 flex-shrink: 0; | |
| 17272 flex-basis: 10%; | |
| 17273 } | |
| 17274 | |
| 17275 .flex-item-15-percent { | |
| 17276 flex-grow: 0; | |
| 17277 flex-shrink: 0; | |
| 17278 flex-basis: 15%; | |
| 17279 } | |
| 17280 | |
| 17281 .flex-item-20-percent { | |
| 17282 flex-grow: 0; | |
| 17283 flex-shrink: 0; | |
| 17284 flex-basis: 20%; | |
| 17285 } | |
| 17286 | |
| 17287 .flex-item-30-percent { | |
| 17288 flex-grow: 0; | |
| 17289 flex-shrink: 0; | |
| 17290 flex-basis: 30%; | |
| 17291 } | |
| 17292 | |
| 17293 .flex-item-40-percent { | |
| 17294 flex-grow: 0; | |
| 17295 flex-shrink: 0; | |
| 17296 flex-basis: 40%; | |
| 17297 } | |
| 17298 | |
| 17299 .flex-item-50-percent { | |
| 17300 flex-grow: 0; | |
| 17301 flex-shrink: 0; | |
| 17302 flex-basis: 50%; | |
| 17303 } | |
| 17304 | |
| 17305 .flex-item-60-percent { | |
| 17306 flex-grow: 0; | |
| 17307 flex-shrink: 0; | |
| 17308 flex-basis: 60%; | |
| 17309 } | |
| 17310 | |
| 17311 .flex-item-70-percent { | |
| 17312 flex-grow: 0; | |
| 17313 flex-shrink: 0; | |
| 17314 flex-basis: 70%; | |
| 17315 } | |
| 17316 | |
| 17317 .flex-item-80-percent { | |
| 17318 flex-grow: 0; | |
| 17319 flex-shrink: 0; | |
| 17320 flex-basis: 80%; | |
| 17321 } | |
| 17322 | |
| 17323 .well { | |
| 17324 min-height: 20px; | |
| 17325 padding: 19px; | |
| 17326 margin-bottom: 20px; | |
| 17327 background-color: #f5f5f5; | |
| 17328 border: 1px solid #e3e3e3; | |
| 17329 border-radius: 4px; | |
| 17330 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 17331 } | |
| 17332 | |
| 17333 .break-wrap { | |
| 17334 word-wrap: break-word; | |
| 17335 } | |
| 17336 </style> | |
| 17337 | |
| 17338 <nav-bar> | |
| 17339 <top-nav-menu></top-nav-menu> | |
| 17340 <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu> | |
| 17341 <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav-
menu> | |
| 17342 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n
av-refresh> | |
| 17343 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 17344 <nav-control></nav-control> | |
| 17345 </nav-bar> | |
| 17346 | |
| 17347 <div class="content"> | |
| 17348 <h1> | |
| 17349 <!-- TODO(turnidge): Handle unnamed libraries --> | |
| 17350 library {{ library.name }} | |
| 17351 </h1> | |
| 17352 <div class="memberList"> | |
| 17353 <div class="memberItem"> | |
| 17354 <div class="memberName">url</div> | |
| 17355 <div class="memberValue">{{ library.url }}</div> | |
| 17356 </div> | |
| 17357 <template if="{{ library.name != library.vmName }}"> | |
| 17358 <div class="memberItem"> | |
| 17359 <div class="memberName">vm name</div> | |
| 17360 <div class="memberValue">{{ library.vmName }}</div> | |
| 17361 </div> | |
| 17362 </template> | |
| 17363 </div> | |
| 17364 </div> | |
| 17365 | |
| 17366 <hr> | |
| 17367 | |
| 17368 <div class="content"> | |
| 17369 <template if="{{ library.imports.isNotEmpty }}"> | |
| 17370 imports ({{ library.imports.length }}) | |
| 17371 <curly-block expand="{{ library.imports.length <= 8 }}"> | |
| 17372 <div class="memberList"> | |
| 17373 <template repeat="{{ imp in library.imports }}"> | |
| 17374 <div class="memberItem"> | |
| 17375 <div class="memberValue"> | |
| 17376 <library-ref ref="{{ imp }}"></library-ref> | |
| 17377 </div> | |
| 17378 </div> | |
| 17379 </template> | |
| 17380 </div> | |
| 17381 </curly-block><br> | |
| 17382 <br> | |
| 17383 </template> | |
| 17384 | |
| 17385 <template if="{{ library.scripts.isNotEmpty }}"> | |
| 17386 scripts ({{ library.scripts.length }}) | |
| 17387 <curly-block expand="{{ library.scripts.length <= 8 }}"> | |
| 17388 <div class="memberList"> | |
| 17389 <template repeat="{{ script in library.scripts }}"> | |
| 17390 <div class="memberItem"> | |
| 17391 <div class="memberValue"> | |
| 17392 <script-ref ref="{{ script }}"></script-ref> | |
| 17393 </div> | |
| 17394 </div> | |
| 17395 </template> | |
| 17396 </div> | |
| 17397 </curly-block><br> | |
| 17398 <br> | |
| 17399 </template> | |
| 17400 | |
| 17401 <template if="{{ library.classes.isNotEmpty }}"> | |
| 17402 classes ({{ library.classes.length }}) | |
| 17403 <curly-block expand="{{ library.classes.length <= 8 }}"> | |
| 17404 <div class="memberList"> | |
| 17405 <template repeat="{{ cls in library.classes }}"> | |
| 17406 <div class="memberItem"> | |
| 17407 <div class="memberValue"> | |
| 17408 <class-ref ref="{{ cls }}"></class-ref> | |
| 17409 </div> | |
| 17410 </div> | |
| 17411 </template> | |
| 17412 </div> | |
| 17413 </curly-block><br> | |
| 17414 <br> | |
| 17415 </template> | |
| 17416 | |
| 17417 <template if="{{ library.variables.isNotEmpty }}"> | |
| 17418 variables ({{ library.variables.length }}) | |
| 17419 <curly-block expand="{{ library.variables.length <= 8 }}"> | |
| 17420 <div class="memberList"> | |
| 17421 <template repeat="{{ field in library.variables }}"> | |
| 17422 <div class="memberItem"> | |
| 17423 <div class="memberName"> | |
| 17424 <field-ref ref="{{ field }}"></field-ref> | |
| 17425 </div> | |
| 17426 <div class="memberValue"> | |
| 17427 <template if="{{ field.value != null }}"> | |
| 17428 <any-service-ref ref="{{ field.value }}"></any-service-ref> | |
| 17429 </template> | |
| 17430 </div> | |
| 17431 </div> | |
| 17432 </template> | |
| 17433 </div> | |
| 17434 </curly-block><br> | |
| 17435 <br> | |
| 17436 </template> | |
| 17437 | |
| 17438 <template if="{{ library.functions.isNotEmpty }}"> | |
| 17439 functions ({{ library.functions.length }}) | |
| 17440 <curly-block expand="{{ library.functions.length <= 8 }}"> | |
| 17441 <div class="memberList"> | |
| 17442 <template repeat="{{ function in library.functions }}"> | |
| 17443 <div class="memberItem"> | |
| 17444 <div class="memberValue"> | |
| 17445 <function-ref ref="{{ function }}"></function-ref> | |
| 17446 </div> | |
| 17447 </div> | |
| 17448 </template> | |
| 17449 </div> | |
| 17450 </curly-block><br> | |
| 17451 <br> | |
| 17452 </template> | |
| 17453 </div> | |
| 17454 | |
| 17455 <hr> | |
| 17456 | |
| 17457 <div class="content"> | |
| 17458 <eval-box callback="{{ eval }}"></eval-box> | |
| 17459 </div> | |
| 17460 <br><br><br><br> | |
| 17461 <br><br><br><br> | |
| 17462 </template> | |
| 17463 </polymer-element> | |
| 17464 | |
| 17465 | |
| 17466 | |
| 17467 | |
| 17468 | |
| 17469 | |
| 17470 | |
| 17471 <polymer-element name="metrics-page" extends="observatory-element"> | |
| 17472 <template> | |
| 17473 <style>/* Global styles */ | |
| 17474 * { | |
| 17475 margin: 0; | |
| 17476 padding: 0; | |
| 17477 font: 400 14px 'Montserrat', sans-serif; | |
| 17478 color: #333; | |
| 17479 box-sizing: border-box; | |
| 17480 } | |
| 17481 | |
| 17482 .content { | |
| 17483 padding-left: 10%; | |
| 17484 font: 400 14px 'Montserrat', sans-serif; | |
| 17485 } | |
| 17486 | |
| 17487 .content-centered { | |
| 17488 padding-left: 10%; | |
| 17489 padding-right: 10%; | |
| 17490 font: 400 14px 'Montserrat', sans-serif; | |
| 17491 } | |
| 17492 | |
| 17493 .content-centered-big { | |
| 17494 padding-left: 5%; | |
| 17495 padding-right: 5%; | |
| 17496 font: 400 14px 'Montserrat', sans-serif; | |
| 17497 } | |
| 17498 | |
| 17499 h1 { | |
| 17500 font: 400 18px 'Montserrat', sans-serif; | |
| 17501 } | |
| 17502 | |
| 17503 .memberList { | |
| 17504 display: table; | |
| 17505 } | |
| 17506 | |
| 17507 .memberItem { | |
| 17508 display: table-row; | |
| 17509 } | |
| 17510 | |
| 17511 .memberName, .memberValue { | |
| 17512 display: table-cell; | |
| 17513 vertical-align: top; | |
| 17514 padding: 3px 0 3px 1em; | |
| 17515 font: 400 14px 'Montserrat', sans-serif; | |
| 17516 } | |
| 17517 | |
| 17518 .memberSmall { | |
| 17519 display: table-cell; | |
| 17520 vertical-align: top; | |
| 17521 padding: 3px 0 3px 1em; | |
| 17522 font: 400 12px 'Montserrat', sans-serif; | |
| 17523 } | |
| 17524 | |
| 17525 .monospace { | |
| 17526 font-family: consolas, courier, monospace; | |
| 17527 font-size: 1em; | |
| 17528 line-height: 1.2em; | |
| 17529 white-space: nowrap; | |
| 17530 } | |
| 17531 | |
| 17532 a { | |
| 17533 color: #0489c3; | |
| 17534 text-decoration: none; | |
| 17535 } | |
| 17536 | |
| 17537 a:hover { | |
| 17538 text-decoration: underline; | |
| 17539 } | |
| 17540 | |
| 17541 em { | |
| 17542 color: inherit; | |
| 17543 font-style: italic; | |
| 17544 } | |
| 17545 | |
| 17546 b { | |
| 17547 color: inherit; | |
| 17548 font-weight: bold; | |
| 17549 } | |
| 17550 | |
| 17551 hr { | |
| 17552 margin-top: 20px; | |
| 17553 margin-bottom: 20px; | |
| 17554 border: 0; | |
| 17555 border-top: 1px solid #eee; | |
| 17556 height: 0; | |
| 17557 box-sizing: content-box; | |
| 17558 } | |
| 17559 | |
| 17560 .list-group { | |
| 17561 padding-left: 0; | |
| 17562 margin-bottom: 20px; | |
| 17563 } | |
| 17564 | |
| 17565 .list-group-item { | |
| 17566 position: relative; | |
| 17567 display: block; | |
| 17568 padding: 10px 15px; | |
| 17569 margin-bottom: -1px; | |
| 17570 background-color: #fff; | |
| 17571 } | |
| 17572 | |
| 17573 .list-group-item:first-child { | |
| 17574 /* rounded top corners */ | |
| 17575 border-top-right-radius:4px; | |
| 17576 border-top-left-radius:4px; | |
| 17577 } | |
| 17578 | |
| 17579 .list-group-item:last-child { | |
| 17580 margin-bottom: 0; | |
| 17581 /* rounded bottom corners */ | |
| 17582 border-bottom-right-radius: 4px; | |
| 17583 border-bottom-left-radius:4px; | |
| 17584 } | |
| 17585 | |
| 17586 /* Flex row container */ | |
| 17587 .flex-row { | |
| 17588 display: flex; | |
| 17589 flex-direction: row; | |
| 17590 } | |
| 17591 | |
| 17592 /* Flex column container */ | |
| 17593 .flex-column { | |
| 17594 display: flex; | |
| 17595 flex-direction: column; | |
| 17596 } | |
| 17597 | |
| 17598 .flex-item-fit { | |
| 17599 flex-grow: 1; | |
| 17600 flex-shrink: 1; | |
| 17601 flex-basis: auto; | |
| 17602 } | |
| 17603 | |
| 17604 .flex-item-no-shrink { | |
| 17605 flex-grow: 0; | |
| 17606 flex-shrink: 0; | |
| 17607 flex-basis: auto; | |
| 17608 } | |
| 17609 | |
| 17610 .flex-item-fill { | |
| 17611 flex-grow: 0; | |
| 17612 flex-shrink: 1; /* shrink when pressured */ | |
| 17613 flex-basis: 100%; /* try and take 100% */ | |
| 17614 } | |
| 17615 | |
| 17616 .flex-item-fixed-1-12 { | |
| 17617 flex-grow: 0; | |
| 17618 flex-shrink: 0; | |
| 17619 flex-basis: 8.3%; | |
| 17620 } | |
| 17621 | |
| 17622 .flex-item-fixed-2-12 { | |
| 17623 flex-grow: 0; | |
| 17624 flex-shrink: 0; | |
| 17625 flex-basis: 16.6%; | |
| 17626 } | |
| 17627 | |
| 17628 .flex-item-fixed-4-12 { | |
| 17629 flex-grow: 0; | |
| 17630 flex-shrink: 0; | |
| 17631 flex-basis: 33.3333%; | |
| 17632 } | |
| 17633 | |
| 17634 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 17635 flex-grow: 0; | |
| 17636 flex-shrink: 0; | |
| 17637 flex-basis: 50%; | |
| 17638 } | |
| 17639 | |
| 17640 .flex-item-fixed-8-12 { | |
| 17641 flex-grow: 0; | |
| 17642 flex-shrink: 0; | |
| 17643 flex-basis: 66.6666%; | |
| 17644 } | |
| 17645 | |
| 17646 .flex-item-fixed-9-12 { | |
| 17647 flex-grow: 0; | |
| 17648 flex-shrink: 0; | |
| 17649 flex-basis: 75%; | |
| 17650 } | |
| 17651 | |
| 17652 | |
| 17653 .flex-item-fixed-12-12 { | |
| 17654 flex-grow: 0; | |
| 17655 flex-shrink: 0; | |
| 17656 flex-basis: 100%; | |
| 17657 } | |
| 17658 | |
| 17659 .flex-item-10-percent { | |
| 17660 flex-grow: 0; | |
| 17661 flex-shrink: 0; | |
| 17662 flex-basis: 10%; | |
| 17663 } | |
| 17664 | |
| 17665 .flex-item-15-percent { | |
| 17666 flex-grow: 0; | |
| 17667 flex-shrink: 0; | |
| 17668 flex-basis: 15%; | |
| 17669 } | |
| 17670 | |
| 17671 .flex-item-20-percent { | |
| 17672 flex-grow: 0; | |
| 17673 flex-shrink: 0; | |
| 17674 flex-basis: 20%; | |
| 17675 } | |
| 17676 | |
| 17677 .flex-item-30-percent { | |
| 17678 flex-grow: 0; | |
| 17679 flex-shrink: 0; | |
| 17680 flex-basis: 30%; | |
| 17681 } | |
| 17682 | |
| 17683 .flex-item-40-percent { | |
| 17684 flex-grow: 0; | |
| 17685 flex-shrink: 0; | |
| 17686 flex-basis: 40%; | |
| 17687 } | |
| 17688 | |
| 17689 .flex-item-50-percent { | |
| 17690 flex-grow: 0; | |
| 17691 flex-shrink: 0; | |
| 17692 flex-basis: 50%; | |
| 17693 } | |
| 17694 | |
| 17695 .flex-item-60-percent { | |
| 17696 flex-grow: 0; | |
| 17697 flex-shrink: 0; | |
| 17698 flex-basis: 60%; | |
| 17699 } | |
| 17700 | |
| 17701 .flex-item-70-percent { | |
| 17702 flex-grow: 0; | |
| 17703 flex-shrink: 0; | |
| 17704 flex-basis: 70%; | |
| 17705 } | |
| 17706 | |
| 17707 .flex-item-80-percent { | |
| 17708 flex-grow: 0; | |
| 17709 flex-shrink: 0; | |
| 17710 flex-basis: 80%; | |
| 17711 } | |
| 17712 | |
| 17713 .well { | |
| 17714 min-height: 20px; | |
| 17715 padding: 19px; | |
| 17716 margin-bottom: 20px; | |
| 17717 background-color: #f5f5f5; | |
| 17718 border: 1px solid #e3e3e3; | |
| 17719 border-radius: 4px; | |
| 17720 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 17721 } | |
| 17722 | |
| 17723 .break-wrap { | |
| 17724 word-wrap: break-word; | |
| 17725 } | |
| 17726 </style> | |
| 17727 <style> | |
| 17728 ul li:hover:not(.selected) { | |
| 17729 background-color: #FFF3E3; | |
| 17730 } | |
| 17731 .selected { | |
| 17732 background-color: #0489c3; | |
| 17733 } | |
| 17734 .graph { | |
| 17735 min-height: 600px; | |
| 17736 } | |
| 17737 </style> | |
| 17738 <nav-bar> | |
| 17739 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 17740 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 17741 <nav-control></nav-control> | |
| 17742 </nav-bar> | |
| 17743 <div class="flex-row"> | |
| 17744 <div class="flex-item-20-percent"> | |
| 17745 <ul> | |
| 17746 <template repeat="{{ metric in isolate.dartMetrics.values }}"> | |
| 17747 <template if="{{ metric == selectedMetric }}"> | |
| 17748 <li class="selected"> | |
| 17749 {{ metric.name }} | |
| 17750 </li> | |
| 17751 </template> | |
| 17752 <template if="{{ metric != selectedMetric }}"> | |
| 17753 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> | |
| 17754 {{ metric.name }} | |
| 17755 </li> | |
| 17756 </template> | |
| 17757 </template> | |
| 17758 <template repeat="{{ metric in isolate.vmMetrics.values }}"> | |
| 17759 <template if="{{ metric == selectedMetric }}"> | |
| 17760 <li class="selected"> | |
| 17761 {{ metric.name }} | |
| 17762 </li> | |
| 17763 </template> | |
| 17764 <template if="{{ metric != selectedMetric }}"> | |
| 17765 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> | |
| 17766 {{ metric.name }} | |
| 17767 </li> | |
| 17768 </template> | |
| 17769 </template> | |
| 17770 </ul> | |
| 17771 </div> | |
| 17772 <div class="flex-item-80-percent"> | |
| 17773 <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}"> | |
| 17774 </metrics-graph> | |
| 17775 <div> | |
| 17776 <metric-details page="{{ page }}" metric="{{ selectedMetric }}"> | |
| 17777 </metric-details> | |
| 17778 </div> | |
| 17779 </div> | |
| 17780 </div> | |
| 17781 </template> | |
| 17782 </polymer-element> | |
| 17783 | |
| 17784 <polymer-element name="metric-details" extends="observatory-element"> | |
| 17785 <template> | |
| 17786 <style>/* Global styles */ | |
| 17787 * { | |
| 17788 margin: 0; | |
| 17789 padding: 0; | |
| 17790 font: 400 14px 'Montserrat', sans-serif; | |
| 17791 color: #333; | |
| 17792 box-sizing: border-box; | |
| 17793 } | |
| 17794 | |
| 17795 .content { | |
| 17796 padding-left: 10%; | |
| 17797 font: 400 14px 'Montserrat', sans-serif; | |
| 17798 } | |
| 17799 | |
| 17800 .content-centered { | |
| 17801 padding-left: 10%; | |
| 17802 padding-right: 10%; | |
| 17803 font: 400 14px 'Montserrat', sans-serif; | |
| 17804 } | |
| 17805 | |
| 17806 .content-centered-big { | |
| 17807 padding-left: 5%; | |
| 17808 padding-right: 5%; | |
| 17809 font: 400 14px 'Montserrat', sans-serif; | |
| 17810 } | |
| 17811 | |
| 17812 h1 { | |
| 17813 font: 400 18px 'Montserrat', sans-serif; | |
| 17814 } | |
| 17815 | |
| 17816 .memberList { | |
| 17817 display: table; | |
| 17818 } | |
| 17819 | |
| 17820 .memberItem { | |
| 17821 display: table-row; | |
| 17822 } | |
| 17823 | |
| 17824 .memberName, .memberValue { | |
| 17825 display: table-cell; | |
| 17826 vertical-align: top; | |
| 17827 padding: 3px 0 3px 1em; | |
| 17828 font: 400 14px 'Montserrat', sans-serif; | |
| 17829 } | |
| 17830 | |
| 17831 .memberSmall { | |
| 17832 display: table-cell; | |
| 17833 vertical-align: top; | |
| 17834 padding: 3px 0 3px 1em; | |
| 17835 font: 400 12px 'Montserrat', sans-serif; | |
| 17836 } | |
| 17837 | |
| 17838 .monospace { | |
| 17839 font-family: consolas, courier, monospace; | |
| 17840 font-size: 1em; | |
| 17841 line-height: 1.2em; | |
| 17842 white-space: nowrap; | |
| 17843 } | |
| 17844 | |
| 17845 a { | |
| 17846 color: #0489c3; | |
| 17847 text-decoration: none; | |
| 17848 } | |
| 17849 | |
| 17850 a:hover { | |
| 17851 text-decoration: underline; | |
| 17852 } | |
| 17853 | |
| 17854 em { | |
| 17855 color: inherit; | |
| 17856 font-style: italic; | |
| 17857 } | |
| 17858 | |
| 17859 b { | |
| 17860 color: inherit; | |
| 17861 font-weight: bold; | |
| 17862 } | |
| 17863 | |
| 17864 hr { | |
| 17865 margin-top: 20px; | |
| 17866 margin-bottom: 20px; | |
| 17867 border: 0; | |
| 17868 border-top: 1px solid #eee; | |
| 17869 height: 0; | |
| 17870 box-sizing: content-box; | |
| 17871 } | |
| 17872 | |
| 17873 .list-group { | |
| 17874 padding-left: 0; | |
| 17875 margin-bottom: 20px; | |
| 17876 } | |
| 17877 | |
| 17878 .list-group-item { | |
| 17879 position: relative; | |
| 17880 display: block; | |
| 17881 padding: 10px 15px; | |
| 17882 margin-bottom: -1px; | |
| 17883 background-color: #fff; | |
| 17884 } | |
| 17885 | |
| 17886 .list-group-item:first-child { | |
| 17887 /* rounded top corners */ | |
| 17888 border-top-right-radius:4px; | |
| 17889 border-top-left-radius:4px; | |
| 17890 } | |
| 17891 | |
| 17892 .list-group-item:last-child { | |
| 17893 margin-bottom: 0; | |
| 17894 /* rounded bottom corners */ | |
| 17895 border-bottom-right-radius: 4px; | |
| 17896 border-bottom-left-radius:4px; | |
| 17897 } | |
| 17898 | |
| 17899 /* Flex row container */ | |
| 17900 .flex-row { | |
| 17901 display: flex; | |
| 17902 flex-direction: row; | |
| 17903 } | |
| 17904 | |
| 17905 /* Flex column container */ | |
| 17906 .flex-column { | |
| 17907 display: flex; | |
| 17908 flex-direction: column; | |
| 17909 } | |
| 17910 | |
| 17911 .flex-item-fit { | |
| 17912 flex-grow: 1; | |
| 17913 flex-shrink: 1; | |
| 17914 flex-basis: auto; | |
| 17915 } | |
| 17916 | |
| 17917 .flex-item-no-shrink { | |
| 17918 flex-grow: 0; | |
| 17919 flex-shrink: 0; | |
| 17920 flex-basis: auto; | |
| 17921 } | |
| 17922 | |
| 17923 .flex-item-fill { | |
| 17924 flex-grow: 0; | |
| 17925 flex-shrink: 1; /* shrink when pressured */ | |
| 17926 flex-basis: 100%; /* try and take 100% */ | |
| 17927 } | |
| 17928 | |
| 17929 .flex-item-fixed-1-12 { | |
| 17930 flex-grow: 0; | |
| 17931 flex-shrink: 0; | |
| 17932 flex-basis: 8.3%; | |
| 17933 } | |
| 17934 | |
| 17935 .flex-item-fixed-2-12 { | |
| 17936 flex-grow: 0; | |
| 17937 flex-shrink: 0; | |
| 17938 flex-basis: 16.6%; | |
| 17939 } | |
| 17940 | |
| 17941 .flex-item-fixed-4-12 { | |
| 17942 flex-grow: 0; | |
| 17943 flex-shrink: 0; | |
| 17944 flex-basis: 33.3333%; | |
| 17945 } | |
| 17946 | |
| 17947 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 17948 flex-grow: 0; | |
| 17949 flex-shrink: 0; | |
| 17950 flex-basis: 50%; | |
| 17951 } | |
| 17952 | |
| 17953 .flex-item-fixed-8-12 { | |
| 17954 flex-grow: 0; | |
| 17955 flex-shrink: 0; | |
| 17956 flex-basis: 66.6666%; | |
| 17957 } | |
| 17958 | |
| 17959 .flex-item-fixed-9-12 { | |
| 17960 flex-grow: 0; | |
| 17961 flex-shrink: 0; | |
| 17962 flex-basis: 75%; | |
| 17963 } | |
| 17964 | |
| 17965 | |
| 17966 .flex-item-fixed-12-12 { | |
| 17967 flex-grow: 0; | |
| 17968 flex-shrink: 0; | |
| 17969 flex-basis: 100%; | |
| 17970 } | |
| 17971 | |
| 17972 .flex-item-10-percent { | |
| 17973 flex-grow: 0; | |
| 17974 flex-shrink: 0; | |
| 17975 flex-basis: 10%; | |
| 17976 } | |
| 17977 | |
| 17978 .flex-item-15-percent { | |
| 17979 flex-grow: 0; | |
| 17980 flex-shrink: 0; | |
| 17981 flex-basis: 15%; | |
| 17982 } | |
| 17983 | |
| 17984 .flex-item-20-percent { | |
| 17985 flex-grow: 0; | |
| 17986 flex-shrink: 0; | |
| 17987 flex-basis: 20%; | |
| 17988 } | |
| 17989 | |
| 17990 .flex-item-30-percent { | |
| 17991 flex-grow: 0; | |
| 17992 flex-shrink: 0; | |
| 17993 flex-basis: 30%; | |
| 17994 } | |
| 17995 | |
| 17996 .flex-item-40-percent { | |
| 17997 flex-grow: 0; | |
| 17998 flex-shrink: 0; | |
| 17999 flex-basis: 40%; | |
| 18000 } | |
| 18001 | |
| 18002 .flex-item-50-percent { | |
| 18003 flex-grow: 0; | |
| 18004 flex-shrink: 0; | |
| 18005 flex-basis: 50%; | |
| 18006 } | |
| 18007 | |
| 18008 .flex-item-60-percent { | |
| 18009 flex-grow: 0; | |
| 18010 flex-shrink: 0; | |
| 18011 flex-basis: 60%; | |
| 18012 } | |
| 18013 | |
| 18014 .flex-item-70-percent { | |
| 18015 flex-grow: 0; | |
| 18016 flex-shrink: 0; | |
| 18017 flex-basis: 70%; | |
| 18018 } | |
| 18019 | |
| 18020 .flex-item-80-percent { | |
| 18021 flex-grow: 0; | |
| 18022 flex-shrink: 0; | |
| 18023 flex-basis: 80%; | |
| 18024 } | |
| 18025 | |
| 18026 .well { | |
| 18027 min-height: 20px; | |
| 18028 padding: 19px; | |
| 18029 margin-bottom: 20px; | |
| 18030 background-color: #f5f5f5; | |
| 18031 border: 1px solid #e3e3e3; | |
| 18032 border-radius: 4px; | |
| 18033 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 18034 } | |
| 18035 | |
| 18036 .break-wrap { | |
| 18037 word-wrap: break-word; | |
| 18038 } | |
| 18039 </style> | |
| 18040 <div class="content-centered"> | |
| 18041 <div class="memberList"> | |
| 18042 <div class="memberItem"> | |
| 18043 <div class="memberName">name</div> | |
| 18044 <div class="memberValue">{{ metric.name }}</div> | |
| 18045 </div> | |
| 18046 <div class="memberItem"> | |
| 18047 <div class="memberName">description</div> | |
| 18048 <div class="memberValue">{{ metric.description }}</div> | |
| 18049 </div> | |
| 18050 <div class="memberItem"> | |
| 18051 <div class="memberName">current value</div> | |
| 18052 <div class="memberValue">{{ metric.value }}</div> | |
| 18053 </div> | |
| 18054 <template if="{{ (metric != null) && (metric.min != null) }}"> | |
| 18055 <div class="memberItem"> | |
| 18056 <div class="memberName">minimum</div> | |
| 18057 <div class="memberValue">{{ metric.min }}</div> | |
| 18058 </div> | |
| 18059 </template> | |
| 18060 <template if="{{ (metric != null) && (metric.max != null) }}"> | |
| 18061 <div class="memberItem"> | |
| 18062 <div class="memberName">maximum</div> | |
| 18063 <div class="memberValue">{{ metric.max }}</div> | |
| 18064 </div> | |
| 18065 </template> | |
| 18066 <div class="memberItem"> | |
| 18067 <div class="memberName">refresh rate</div> | |
| 18068 <div class="memberValue"> | |
| 18069 <select id="refreshrate" on-change="{{ refreshRateChange }}"> | |
| 18070 <!-- These must be kept in sync with POLL_PERIODS in MetricsPage | |
| 18071 in object.dart --> | |
| 18072 <option value="8000">Every eight seconds</option> | |
| 18073 <option value="4000">Every four seconds</option> | |
| 18074 <option value="2000">Every two seconds</option> | |
| 18075 <option value="1000">Once a second</option> | |
| 18076 <option value="100">Ten times per second</option> | |
| 18077 <option value="0" selected="selected">Never</option> | |
| 18078 </select> | |
| 18079 </div> | |
| 18080 </div> | |
| 18081 <div class="memberItem"> | |
| 18082 <div class="memberName">sample buffer size</div> | |
| 18083 <div class="memberValue"> | |
| 18084 <select id="buffersize" on-change="{{ sampleBufferSizeChange }}"> | |
| 18085 <option value="10">10</option> | |
| 18086 <option value="100" selected="selected">100</option> | |
| 18087 <option value="1000">1000</option> | |
| 18088 </select> | |
| 18089 </div> | |
| 18090 </div> | |
| 18091 </div> | |
| 18092 </div> | |
| 18093 </template> | |
| 18094 </polymer-element> | |
| 18095 | |
| 18096 <polymer-element name="metrics-graph" extends="observatory-element"> | |
| 18097 <template> | |
| 18098 <style>/* Global styles */ | |
| 18099 * { | |
| 18100 margin: 0; | |
| 18101 padding: 0; | |
| 18102 font: 400 14px 'Montserrat', sans-serif; | |
| 18103 color: #333; | |
| 18104 box-sizing: border-box; | |
| 18105 } | |
| 18106 | |
| 18107 .content { | |
| 18108 padding-left: 10%; | |
| 18109 font: 400 14px 'Montserrat', sans-serif; | |
| 18110 } | |
| 18111 | |
| 18112 .content-centered { | |
| 18113 padding-left: 10%; | |
| 18114 padding-right: 10%; | |
| 18115 font: 400 14px 'Montserrat', sans-serif; | |
| 18116 } | |
| 18117 | |
| 18118 .content-centered-big { | |
| 18119 padding-left: 5%; | |
| 18120 padding-right: 5%; | |
| 18121 font: 400 14px 'Montserrat', sans-serif; | |
| 18122 } | |
| 18123 | |
| 18124 h1 { | |
| 18125 font: 400 18px 'Montserrat', sans-serif; | |
| 18126 } | |
| 18127 | |
| 18128 .memberList { | |
| 18129 display: table; | |
| 18130 } | |
| 18131 | |
| 18132 .memberItem { | |
| 18133 display: table-row; | |
| 18134 } | |
| 18135 | |
| 18136 .memberName, .memberValue { | |
| 18137 display: table-cell; | |
| 18138 vertical-align: top; | |
| 18139 padding: 3px 0 3px 1em; | |
| 18140 font: 400 14px 'Montserrat', sans-serif; | |
| 18141 } | |
| 18142 | |
| 18143 .memberSmall { | |
| 18144 display: table-cell; | |
| 18145 vertical-align: top; | |
| 18146 padding: 3px 0 3px 1em; | |
| 18147 font: 400 12px 'Montserrat', sans-serif; | |
| 18148 } | |
| 18149 | |
| 18150 .monospace { | |
| 18151 font-family: consolas, courier, monospace; | |
| 18152 font-size: 1em; | |
| 18153 line-height: 1.2em; | |
| 18154 white-space: nowrap; | |
| 18155 } | |
| 18156 | |
| 18157 a { | |
| 18158 color: #0489c3; | |
| 18159 text-decoration: none; | |
| 18160 } | |
| 18161 | |
| 18162 a:hover { | |
| 18163 text-decoration: underline; | |
| 18164 } | |
| 18165 | |
| 18166 em { | |
| 18167 color: inherit; | |
| 18168 font-style: italic; | |
| 18169 } | |
| 18170 | |
| 18171 b { | |
| 18172 color: inherit; | |
| 18173 font-weight: bold; | |
| 18174 } | |
| 18175 | |
| 18176 hr { | |
| 18177 margin-top: 20px; | |
| 18178 margin-bottom: 20px; | |
| 18179 border: 0; | |
| 18180 border-top: 1px solid #eee; | |
| 18181 height: 0; | |
| 18182 box-sizing: content-box; | |
| 18183 } | |
| 18184 | |
| 18185 .list-group { | |
| 18186 padding-left: 0; | |
| 18187 margin-bottom: 20px; | |
| 18188 } | |
| 18189 | |
| 18190 .list-group-item { | |
| 18191 position: relative; | |
| 18192 display: block; | |
| 18193 padding: 10px 15px; | |
| 18194 margin-bottom: -1px; | |
| 18195 background-color: #fff; | |
| 18196 } | |
| 18197 | |
| 18198 .list-group-item:first-child { | |
| 18199 /* rounded top corners */ | |
| 18200 border-top-right-radius:4px; | |
| 18201 border-top-left-radius:4px; | |
| 18202 } | |
| 18203 | |
| 18204 .list-group-item:last-child { | |
| 18205 margin-bottom: 0; | |
| 18206 /* rounded bottom corners */ | |
| 18207 border-bottom-right-radius: 4px; | |
| 18208 border-bottom-left-radius:4px; | |
| 18209 } | |
| 18210 | |
| 18211 /* Flex row container */ | |
| 18212 .flex-row { | |
| 18213 display: flex; | |
| 18214 flex-direction: row; | |
| 18215 } | |
| 18216 | |
| 18217 /* Flex column container */ | |
| 18218 .flex-column { | |
| 18219 display: flex; | |
| 18220 flex-direction: column; | |
| 18221 } | |
| 18222 | |
| 18223 .flex-item-fit { | |
| 18224 flex-grow: 1; | |
| 18225 flex-shrink: 1; | |
| 18226 flex-basis: auto; | |
| 18227 } | |
| 18228 | |
| 18229 .flex-item-no-shrink { | |
| 18230 flex-grow: 0; | |
| 18231 flex-shrink: 0; | |
| 18232 flex-basis: auto; | |
| 18233 } | |
| 18234 | |
| 18235 .flex-item-fill { | |
| 18236 flex-grow: 0; | |
| 18237 flex-shrink: 1; /* shrink when pressured */ | |
| 18238 flex-basis: 100%; /* try and take 100% */ | |
| 18239 } | |
| 18240 | |
| 18241 .flex-item-fixed-1-12 { | |
| 18242 flex-grow: 0; | |
| 18243 flex-shrink: 0; | |
| 18244 flex-basis: 8.3%; | |
| 18245 } | |
| 18246 | |
| 18247 .flex-item-fixed-2-12 { | |
| 18248 flex-grow: 0; | |
| 18249 flex-shrink: 0; | |
| 18250 flex-basis: 16.6%; | |
| 18251 } | |
| 18252 | |
| 18253 .flex-item-fixed-4-12 { | |
| 18254 flex-grow: 0; | |
| 18255 flex-shrink: 0; | |
| 18256 flex-basis: 33.3333%; | |
| 18257 } | |
| 18258 | |
| 18259 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 18260 flex-grow: 0; | |
| 18261 flex-shrink: 0; | |
| 18262 flex-basis: 50%; | |
| 18263 } | |
| 18264 | |
| 18265 .flex-item-fixed-8-12 { | |
| 18266 flex-grow: 0; | |
| 18267 flex-shrink: 0; | |
| 18268 flex-basis: 66.6666%; | |
| 18269 } | |
| 18270 | |
| 18271 .flex-item-fixed-9-12 { | |
| 18272 flex-grow: 0; | |
| 18273 flex-shrink: 0; | |
| 18274 flex-basis: 75%; | |
| 18275 } | |
| 18276 | |
| 18277 | |
| 18278 .flex-item-fixed-12-12 { | |
| 18279 flex-grow: 0; | |
| 18280 flex-shrink: 0; | |
| 18281 flex-basis: 100%; | |
| 18282 } | |
| 18283 | |
| 18284 .flex-item-10-percent { | |
| 18285 flex-grow: 0; | |
| 18286 flex-shrink: 0; | |
| 18287 flex-basis: 10%; | |
| 18288 } | |
| 18289 | |
| 18290 .flex-item-15-percent { | |
| 18291 flex-grow: 0; | |
| 18292 flex-shrink: 0; | |
| 18293 flex-basis: 15%; | |
| 18294 } | |
| 18295 | |
| 18296 .flex-item-20-percent { | |
| 18297 flex-grow: 0; | |
| 18298 flex-shrink: 0; | |
| 18299 flex-basis: 20%; | |
| 18300 } | |
| 18301 | |
| 18302 .flex-item-30-percent { | |
| 18303 flex-grow: 0; | |
| 18304 flex-shrink: 0; | |
| 18305 flex-basis: 30%; | |
| 18306 } | |
| 18307 | |
| 18308 .flex-item-40-percent { | |
| 18309 flex-grow: 0; | |
| 18310 flex-shrink: 0; | |
| 18311 flex-basis: 40%; | |
| 18312 } | |
| 18313 | |
| 18314 .flex-item-50-percent { | |
| 18315 flex-grow: 0; | |
| 18316 flex-shrink: 0; | |
| 18317 flex-basis: 50%; | |
| 18318 } | |
| 18319 | |
| 18320 .flex-item-60-percent { | |
| 18321 flex-grow: 0; | |
| 18322 flex-shrink: 0; | |
| 18323 flex-basis: 60%; | |
| 18324 } | |
| 18325 | |
| 18326 .flex-item-70-percent { | |
| 18327 flex-grow: 0; | |
| 18328 flex-shrink: 0; | |
| 18329 flex-basis: 70%; | |
| 18330 } | |
| 18331 | |
| 18332 .flex-item-80-percent { | |
| 18333 flex-grow: 0; | |
| 18334 flex-shrink: 0; | |
| 18335 flex-basis: 80%; | |
| 18336 } | |
| 18337 | |
| 18338 .well { | |
| 18339 min-height: 20px; | |
| 18340 padding: 19px; | |
| 18341 margin-bottom: 20px; | |
| 18342 background-color: #f5f5f5; | |
| 18343 border: 1px solid #e3e3e3; | |
| 18344 border-radius: 4px; | |
| 18345 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 18346 } | |
| 18347 | |
| 18348 .break-wrap { | |
| 18349 word-wrap: break-word; | |
| 18350 } | |
| 18351 </style> | |
| 18352 <style> | |
| 18353 .graph { | |
| 18354 min-height: 600px; | |
| 18355 } | |
| 18356 </style> | |
| 18357 <div id="graph" class="graph"> | |
| 18358 </div> | |
| 18359 </template> | |
| 18360 </polymer-element> | |
| 18361 | |
| 18362 | |
| 18363 | |
| 18364 | |
| 18365 | |
| 18366 | |
| 18367 | |
| 18368 | |
| 18369 | |
| 18370 | |
| 18371 | |
| 18372 | |
| 18373 | |
| 18374 | |
| 18375 | |
| 18376 | |
| 18377 | |
| 18378 <polymer-element name="object-view" extends="observatory-element"> | |
| 18379 <template> | |
| 18380 <style>/* Global styles */ | |
| 18381 * { | |
| 18382 margin: 0; | |
| 18383 padding: 0; | |
| 18384 font: 400 14px 'Montserrat', sans-serif; | |
| 18385 color: #333; | |
| 18386 box-sizing: border-box; | |
| 18387 } | |
| 18388 | |
| 18389 .content { | |
| 18390 padding-left: 10%; | |
| 18391 font: 400 14px 'Montserrat', sans-serif; | |
| 18392 } | |
| 18393 | |
| 18394 .content-centered { | |
| 18395 padding-left: 10%; | |
| 18396 padding-right: 10%; | |
| 18397 font: 400 14px 'Montserrat', sans-serif; | |
| 18398 } | |
| 18399 | |
| 18400 .content-centered-big { | |
| 18401 padding-left: 5%; | |
| 18402 padding-right: 5%; | |
| 18403 font: 400 14px 'Montserrat', sans-serif; | |
| 18404 } | |
| 18405 | |
| 18406 h1 { | |
| 18407 font: 400 18px 'Montserrat', sans-serif; | |
| 18408 } | |
| 18409 | |
| 18410 .memberList { | |
| 18411 display: table; | |
| 18412 } | |
| 18413 | |
| 18414 .memberItem { | |
| 18415 display: table-row; | |
| 18416 } | |
| 18417 | |
| 18418 .memberName, .memberValue { | |
| 18419 display: table-cell; | |
| 18420 vertical-align: top; | |
| 18421 padding: 3px 0 3px 1em; | |
| 18422 font: 400 14px 'Montserrat', sans-serif; | |
| 18423 } | |
| 18424 | |
| 18425 .memberSmall { | |
| 18426 display: table-cell; | |
| 18427 vertical-align: top; | |
| 18428 padding: 3px 0 3px 1em; | |
| 18429 font: 400 12px 'Montserrat', sans-serif; | |
| 18430 } | |
| 18431 | |
| 18432 .monospace { | |
| 18433 font-family: consolas, courier, monospace; | |
| 18434 font-size: 1em; | |
| 18435 line-height: 1.2em; | |
| 18436 white-space: nowrap; | |
| 18437 } | |
| 18438 | |
| 18439 a { | |
| 18440 color: #0489c3; | |
| 18441 text-decoration: none; | |
| 18442 } | |
| 18443 | |
| 18444 a:hover { | |
| 18445 text-decoration: underline; | |
| 18446 } | |
| 18447 | |
| 18448 em { | |
| 18449 color: inherit; | |
| 18450 font-style: italic; | |
| 18451 } | |
| 18452 | |
| 18453 b { | |
| 18454 color: inherit; | |
| 18455 font-weight: bold; | |
| 18456 } | |
| 18457 | |
| 18458 hr { | |
| 18459 margin-top: 20px; | |
| 18460 margin-bottom: 20px; | |
| 18461 border: 0; | |
| 18462 border-top: 1px solid #eee; | |
| 18463 height: 0; | |
| 18464 box-sizing: content-box; | |
| 18465 } | |
| 18466 | |
| 18467 .list-group { | |
| 18468 padding-left: 0; | |
| 18469 margin-bottom: 20px; | |
| 18470 } | |
| 18471 | |
| 18472 .list-group-item { | |
| 18473 position: relative; | |
| 18474 display: block; | |
| 18475 padding: 10px 15px; | |
| 18476 margin-bottom: -1px; | |
| 18477 background-color: #fff; | |
| 18478 } | |
| 18479 | |
| 18480 .list-group-item:first-child { | |
| 18481 /* rounded top corners */ | |
| 18482 border-top-right-radius:4px; | |
| 18483 border-top-left-radius:4px; | |
| 18484 } | |
| 18485 | |
| 18486 .list-group-item:last-child { | |
| 18487 margin-bottom: 0; | |
| 18488 /* rounded bottom corners */ | |
| 18489 border-bottom-right-radius: 4px; | |
| 18490 border-bottom-left-radius:4px; | |
| 18491 } | |
| 18492 | |
| 18493 /* Flex row container */ | |
| 18494 .flex-row { | |
| 18495 display: flex; | |
| 18496 flex-direction: row; | |
| 18497 } | |
| 18498 | |
| 18499 /* Flex column container */ | |
| 18500 .flex-column { | |
| 18501 display: flex; | |
| 18502 flex-direction: column; | |
| 18503 } | |
| 18504 | |
| 18505 .flex-item-fit { | |
| 18506 flex-grow: 1; | |
| 18507 flex-shrink: 1; | |
| 18508 flex-basis: auto; | |
| 18509 } | |
| 18510 | |
| 18511 .flex-item-no-shrink { | |
| 18512 flex-grow: 0; | |
| 18513 flex-shrink: 0; | |
| 18514 flex-basis: auto; | |
| 18515 } | |
| 18516 | |
| 18517 .flex-item-fill { | |
| 18518 flex-grow: 0; | |
| 18519 flex-shrink: 1; /* shrink when pressured */ | |
| 18520 flex-basis: 100%; /* try and take 100% */ | |
| 18521 } | |
| 18522 | |
| 18523 .flex-item-fixed-1-12 { | |
| 18524 flex-grow: 0; | |
| 18525 flex-shrink: 0; | |
| 18526 flex-basis: 8.3%; | |
| 18527 } | |
| 18528 | |
| 18529 .flex-item-fixed-2-12 { | |
| 18530 flex-grow: 0; | |
| 18531 flex-shrink: 0; | |
| 18532 flex-basis: 16.6%; | |
| 18533 } | |
| 18534 | |
| 18535 .flex-item-fixed-4-12 { | |
| 18536 flex-grow: 0; | |
| 18537 flex-shrink: 0; | |
| 18538 flex-basis: 33.3333%; | |
| 18539 } | |
| 18540 | |
| 18541 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 18542 flex-grow: 0; | |
| 18543 flex-shrink: 0; | |
| 18544 flex-basis: 50%; | |
| 18545 } | |
| 18546 | |
| 18547 .flex-item-fixed-8-12 { | |
| 18548 flex-grow: 0; | |
| 18549 flex-shrink: 0; | |
| 18550 flex-basis: 66.6666%; | |
| 18551 } | |
| 18552 | |
| 18553 .flex-item-fixed-9-12 { | |
| 18554 flex-grow: 0; | |
| 18555 flex-shrink: 0; | |
| 18556 flex-basis: 75%; | |
| 18557 } | |
| 18558 | |
| 18559 | |
| 18560 .flex-item-fixed-12-12 { | |
| 18561 flex-grow: 0; | |
| 18562 flex-shrink: 0; | |
| 18563 flex-basis: 100%; | |
| 18564 } | |
| 18565 | |
| 18566 .flex-item-10-percent { | |
| 18567 flex-grow: 0; | |
| 18568 flex-shrink: 0; | |
| 18569 flex-basis: 10%; | |
| 18570 } | |
| 18571 | |
| 18572 .flex-item-15-percent { | |
| 18573 flex-grow: 0; | |
| 18574 flex-shrink: 0; | |
| 18575 flex-basis: 15%; | |
| 18576 } | |
| 18577 | |
| 18578 .flex-item-20-percent { | |
| 18579 flex-grow: 0; | |
| 18580 flex-shrink: 0; | |
| 18581 flex-basis: 20%; | |
| 18582 } | |
| 18583 | |
| 18584 .flex-item-30-percent { | |
| 18585 flex-grow: 0; | |
| 18586 flex-shrink: 0; | |
| 18587 flex-basis: 30%; | |
| 18588 } | |
| 18589 | |
| 18590 .flex-item-40-percent { | |
| 18591 flex-grow: 0; | |
| 18592 flex-shrink: 0; | |
| 18593 flex-basis: 40%; | |
| 18594 } | |
| 18595 | |
| 18596 .flex-item-50-percent { | |
| 18597 flex-grow: 0; | |
| 18598 flex-shrink: 0; | |
| 18599 flex-basis: 50%; | |
| 18600 } | |
| 18601 | |
| 18602 .flex-item-60-percent { | |
| 18603 flex-grow: 0; | |
| 18604 flex-shrink: 0; | |
| 18605 flex-basis: 60%; | |
| 18606 } | |
| 18607 | |
| 18608 .flex-item-70-percent { | |
| 18609 flex-grow: 0; | |
| 18610 flex-shrink: 0; | |
| 18611 flex-basis: 70%; | |
| 18612 } | |
| 18613 | |
| 18614 .flex-item-80-percent { | |
| 18615 flex-grow: 0; | |
| 18616 flex-shrink: 0; | |
| 18617 flex-basis: 80%; | |
| 18618 } | |
| 18619 | |
| 18620 .well { | |
| 18621 min-height: 20px; | |
| 18622 padding: 19px; | |
| 18623 margin-bottom: 20px; | |
| 18624 background-color: #f5f5f5; | |
| 18625 border: 1px solid #e3e3e3; | |
| 18626 border-radius: 4px; | |
| 18627 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 18628 } | |
| 18629 | |
| 18630 .break-wrap { | |
| 18631 word-wrap: break-word; | |
| 18632 } | |
| 18633 </style> | |
| 18634 <nav-bar> | |
| 18635 <top-nav-menu></top-nav-menu> | |
| 18636 <isolate-nav-menu isolate="{{ object.isolate }}"></isolate-nav-menu> | |
| 18637 <nav-menu link="." anchor="object" last="{{ true }}"></nav-menu> | |
| 18638 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 18639 <nav-control></nav-control> | |
| 18640 </nav-bar> | |
| 18641 | |
| 18642 <div class="content"> | |
| 18643 <object-common object="{{ object }}"></object-common> | |
| 18644 </div> | |
| 18645 | |
| 18646 <hr> | |
| 18647 </template> | |
| 18648 </polymer-element> | |
| 18649 | |
| 18650 | |
| 18651 | |
| 18652 | |
| 18653 | |
| 18654 | |
| 18655 | |
| 18656 | |
| 18657 | |
| 18658 | |
| 18659 | |
| 18660 | |
| 18661 | |
| 18662 | |
| 18663 | |
| 18664 | |
| 18665 | |
| 18666 | |
| 18667 | |
| 18668 <polymer-element name="context-view" extends="observatory-element"> | |
| 18669 <template> | |
| 18670 <style>/* Global styles */ | |
| 18671 * { | |
| 18672 margin: 0; | |
| 18673 padding: 0; | |
| 18674 font: 400 14px 'Montserrat', sans-serif; | |
| 18675 color: #333; | |
| 18676 box-sizing: border-box; | |
| 18677 } | |
| 18678 | |
| 18679 .content { | |
| 18680 padding-left: 10%; | |
| 18681 font: 400 14px 'Montserrat', sans-serif; | |
| 18682 } | |
| 18683 | |
| 18684 .content-centered { | |
| 18685 padding-left: 10%; | |
| 18686 padding-right: 10%; | |
| 18687 font: 400 14px 'Montserrat', sans-serif; | |
| 18688 } | |
| 18689 | |
| 18690 .content-centered-big { | |
| 18691 padding-left: 5%; | |
| 18692 padding-right: 5%; | |
| 18693 font: 400 14px 'Montserrat', sans-serif; | |
| 18694 } | |
| 18695 | |
| 18696 h1 { | |
| 18697 font: 400 18px 'Montserrat', sans-serif; | |
| 18698 } | |
| 18699 | |
| 18700 .memberList { | |
| 18701 display: table; | |
| 18702 } | |
| 18703 | |
| 18704 .memberItem { | |
| 18705 display: table-row; | |
| 18706 } | |
| 18707 | |
| 18708 .memberName, .memberValue { | |
| 18709 display: table-cell; | |
| 18710 vertical-align: top; | |
| 18711 padding: 3px 0 3px 1em; | |
| 18712 font: 400 14px 'Montserrat', sans-serif; | |
| 18713 } | |
| 18714 | |
| 18715 .memberSmall { | |
| 18716 display: table-cell; | |
| 18717 vertical-align: top; | |
| 18718 padding: 3px 0 3px 1em; | |
| 18719 font: 400 12px 'Montserrat', sans-serif; | |
| 18720 } | |
| 18721 | |
| 18722 .monospace { | |
| 18723 font-family: consolas, courier, monospace; | |
| 18724 font-size: 1em; | |
| 18725 line-height: 1.2em; | |
| 18726 white-space: nowrap; | |
| 18727 } | |
| 18728 | |
| 18729 a { | |
| 18730 color: #0489c3; | |
| 18731 text-decoration: none; | |
| 18732 } | |
| 18733 | |
| 18734 a:hover { | |
| 18735 text-decoration: underline; | |
| 18736 } | |
| 18737 | |
| 18738 em { | |
| 18739 color: inherit; | |
| 18740 font-style: italic; | |
| 18741 } | |
| 18742 | |
| 18743 b { | |
| 18744 color: inherit; | |
| 18745 font-weight: bold; | |
| 18746 } | |
| 18747 | |
| 18748 hr { | |
| 18749 margin-top: 20px; | |
| 18750 margin-bottom: 20px; | |
| 18751 border: 0; | |
| 18752 border-top: 1px solid #eee; | |
| 18753 height: 0; | |
| 18754 box-sizing: content-box; | |
| 18755 } | |
| 18756 | |
| 18757 .list-group { | |
| 18758 padding-left: 0; | |
| 18759 margin-bottom: 20px; | |
| 18760 } | |
| 18761 | |
| 18762 .list-group-item { | |
| 18763 position: relative; | |
| 18764 display: block; | |
| 18765 padding: 10px 15px; | |
| 18766 margin-bottom: -1px; | |
| 18767 background-color: #fff; | |
| 18768 } | |
| 18769 | |
| 18770 .list-group-item:first-child { | |
| 18771 /* rounded top corners */ | |
| 18772 border-top-right-radius:4px; | |
| 18773 border-top-left-radius:4px; | |
| 18774 } | |
| 18775 | |
| 18776 .list-group-item:last-child { | |
| 18777 margin-bottom: 0; | |
| 18778 /* rounded bottom corners */ | |
| 18779 border-bottom-right-radius: 4px; | |
| 18780 border-bottom-left-radius:4px; | |
| 18781 } | |
| 18782 | |
| 18783 /* Flex row container */ | |
| 18784 .flex-row { | |
| 18785 display: flex; | |
| 18786 flex-direction: row; | |
| 18787 } | |
| 18788 | |
| 18789 /* Flex column container */ | |
| 18790 .flex-column { | |
| 18791 display: flex; | |
| 18792 flex-direction: column; | |
| 18793 } | |
| 18794 | |
| 18795 .flex-item-fit { | |
| 18796 flex-grow: 1; | |
| 18797 flex-shrink: 1; | |
| 18798 flex-basis: auto; | |
| 18799 } | |
| 18800 | |
| 18801 .flex-item-no-shrink { | |
| 18802 flex-grow: 0; | |
| 18803 flex-shrink: 0; | |
| 18804 flex-basis: auto; | |
| 18805 } | |
| 18806 | |
| 18807 .flex-item-fill { | |
| 18808 flex-grow: 0; | |
| 18809 flex-shrink: 1; /* shrink when pressured */ | |
| 18810 flex-basis: 100%; /* try and take 100% */ | |
| 18811 } | |
| 18812 | |
| 18813 .flex-item-fixed-1-12 { | |
| 18814 flex-grow: 0; | |
| 18815 flex-shrink: 0; | |
| 18816 flex-basis: 8.3%; | |
| 18817 } | |
| 18818 | |
| 18819 .flex-item-fixed-2-12 { | |
| 18820 flex-grow: 0; | |
| 18821 flex-shrink: 0; | |
| 18822 flex-basis: 16.6%; | |
| 18823 } | |
| 18824 | |
| 18825 .flex-item-fixed-4-12 { | |
| 18826 flex-grow: 0; | |
| 18827 flex-shrink: 0; | |
| 18828 flex-basis: 33.3333%; | |
| 18829 } | |
| 18830 | |
| 18831 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 18832 flex-grow: 0; | |
| 18833 flex-shrink: 0; | |
| 18834 flex-basis: 50%; | |
| 18835 } | |
| 18836 | |
| 18837 .flex-item-fixed-8-12 { | |
| 18838 flex-grow: 0; | |
| 18839 flex-shrink: 0; | |
| 18840 flex-basis: 66.6666%; | |
| 18841 } | |
| 18842 | |
| 18843 .flex-item-fixed-9-12 { | |
| 18844 flex-grow: 0; | |
| 18845 flex-shrink: 0; | |
| 18846 flex-basis: 75%; | |
| 18847 } | |
| 18848 | |
| 18849 | |
| 18850 .flex-item-fixed-12-12 { | |
| 18851 flex-grow: 0; | |
| 18852 flex-shrink: 0; | |
| 18853 flex-basis: 100%; | |
| 18854 } | |
| 18855 | |
| 18856 .flex-item-10-percent { | |
| 18857 flex-grow: 0; | |
| 18858 flex-shrink: 0; | |
| 18859 flex-basis: 10%; | |
| 18860 } | |
| 18861 | |
| 18862 .flex-item-15-percent { | |
| 18863 flex-grow: 0; | |
| 18864 flex-shrink: 0; | |
| 18865 flex-basis: 15%; | |
| 18866 } | |
| 18867 | |
| 18868 .flex-item-20-percent { | |
| 18869 flex-grow: 0; | |
| 18870 flex-shrink: 0; | |
| 18871 flex-basis: 20%; | |
| 18872 } | |
| 18873 | |
| 18874 .flex-item-30-percent { | |
| 18875 flex-grow: 0; | |
| 18876 flex-shrink: 0; | |
| 18877 flex-basis: 30%; | |
| 18878 } | |
| 18879 | |
| 18880 .flex-item-40-percent { | |
| 18881 flex-grow: 0; | |
| 18882 flex-shrink: 0; | |
| 18883 flex-basis: 40%; | |
| 18884 } | |
| 18885 | |
| 18886 .flex-item-50-percent { | |
| 18887 flex-grow: 0; | |
| 18888 flex-shrink: 0; | |
| 18889 flex-basis: 50%; | |
| 18890 } | |
| 18891 | |
| 18892 .flex-item-60-percent { | |
| 18893 flex-grow: 0; | |
| 18894 flex-shrink: 0; | |
| 18895 flex-basis: 60%; | |
| 18896 } | |
| 18897 | |
| 18898 .flex-item-70-percent { | |
| 18899 flex-grow: 0; | |
| 18900 flex-shrink: 0; | |
| 18901 flex-basis: 70%; | |
| 18902 } | |
| 18903 | |
| 18904 .flex-item-80-percent { | |
| 18905 flex-grow: 0; | |
| 18906 flex-shrink: 0; | |
| 18907 flex-basis: 80%; | |
| 18908 } | |
| 18909 | |
| 18910 .well { | |
| 18911 min-height: 20px; | |
| 18912 padding: 19px; | |
| 18913 margin-bottom: 20px; | |
| 18914 background-color: #f5f5f5; | |
| 18915 border: 1px solid #e3e3e3; | |
| 18916 border-radius: 4px; | |
| 18917 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 18918 } | |
| 18919 | |
| 18920 .break-wrap { | |
| 18921 word-wrap: break-word; | |
| 18922 } | |
| 18923 </style> | |
| 18924 <nav-bar> | |
| 18925 <top-nav-menu></top-nav-menu> | |
| 18926 <isolate-nav-menu isolate="{{ context.isolate }}"></isolate-nav-menu> | |
| 18927 <!-- TODO(turnidge): Add library nav menu here. --> | |
| 18928 <class-nav-menu cls="{{ context.clazz }}"></class-nav-menu> | |
| 18929 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> | |
| 18930 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 18931 <nav-control></nav-control> | |
| 18932 </nav-bar> | |
| 18933 | |
| 18934 <template if="{{ !context.isError }}"> | |
| 18935 <div class="content"> | |
| 18936 <h1>instance of Context</h1> | |
| 18937 | |
| 18938 <object-common object="{{ context }}"></object-common> | |
| 18939 | |
| 18940 <div class="memberList"> | |
| 18941 <div class="memberItem"> </div> | |
| 18942 | |
| 18943 <div class="memberItem"> | |
| 18944 <div class="memberName">parent context</div> | |
| 18945 <div class="memberValue"> | |
| 18946 <any-service-ref ref="{{ context.parentContext }}"></any-service-r
ef> | |
| 18947 </div> | |
| 18948 </div> | |
| 18949 </div> | |
| 18950 </div> | |
| 18951 | |
| 18952 <hr> | |
| 18953 | |
| 18954 <div class="content"> | |
| 18955 <template if="{{ context.variables.isNotEmpty }}"> | |
| 18956 variables ({{ context.variables.length }}) | |
| 18957 <curly-block expand="{{ context.variables.length <= 8 }}"> | |
| 18958 <div class="memberList"> | |
| 18959 <template repeat="{{ variable in context.variables }}"> | |
| 18960 <div class="memberItem"> | |
| 18961 <div class="memberName">[{{ variable['index']}}]</div> | |
| 18962 <div class="memberValue"> | |
| 18963 <any-service-ref ref="{{ variable['value'] }}"></any-service
-ref> | |
| 18964 </div> | |
| 18965 </div> | |
| 18966 </template> | |
| 18967 </div> | |
| 18968 </curly-block><br><br> | |
| 18969 </template> | |
| 18970 </div> | |
| 18971 | |
| 18972 <br><br><br><br> | |
| 18973 <br><br><br><br> | |
| 18974 | |
| 18975 </template> | |
| 18976 </template> | |
| 18977 </polymer-element> | |
| 18978 | |
| 18979 | |
| 18980 | |
| 18981 | |
| 18982 | |
| 18983 | |
| 18984 | |
| 18985 | |
| 18986 | |
| 18987 | |
| 18988 | |
| 18989 | 4062 |
| 18990 <polymer-element name="heap-profile" extends="observatory-element"> | 4063 <polymer-element name="heap-profile" extends="observatory-element"> |
| 18991 <template> | 4064 <template> |
| 18992 <style>/* Global styles */ | 4065 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"
> |
| 18993 * { | |
| 18994 margin: 0; | |
| 18995 padding: 0; | |
| 18996 font: 400 14px 'Montserrat', sans-serif; | |
| 18997 color: #333; | |
| 18998 box-sizing: border-box; | |
| 18999 } | |
| 19000 | |
| 19001 .content { | |
| 19002 padding-left: 10%; | |
| 19003 font: 400 14px 'Montserrat', sans-serif; | |
| 19004 } | |
| 19005 | |
| 19006 .content-centered { | |
| 19007 padding-left: 10%; | |
| 19008 padding-right: 10%; | |
| 19009 font: 400 14px 'Montserrat', sans-serif; | |
| 19010 } | |
| 19011 | |
| 19012 .content-centered-big { | |
| 19013 padding-left: 5%; | |
| 19014 padding-right: 5%; | |
| 19015 font: 400 14px 'Montserrat', sans-serif; | |
| 19016 } | |
| 19017 | |
| 19018 h1 { | |
| 19019 font: 400 18px 'Montserrat', sans-serif; | |
| 19020 } | |
| 19021 | |
| 19022 .memberList { | |
| 19023 display: table; | |
| 19024 } | |
| 19025 | |
| 19026 .memberItem { | |
| 19027 display: table-row; | |
| 19028 } | |
| 19029 | |
| 19030 .memberName, .memberValue { | |
| 19031 display: table-cell; | |
| 19032 vertical-align: top; | |
| 19033 padding: 3px 0 3px 1em; | |
| 19034 font: 400 14px 'Montserrat', sans-serif; | |
| 19035 } | |
| 19036 | |
| 19037 .memberSmall { | |
| 19038 display: table-cell; | |
| 19039 vertical-align: top; | |
| 19040 padding: 3px 0 3px 1em; | |
| 19041 font: 400 12px 'Montserrat', sans-serif; | |
| 19042 } | |
| 19043 | |
| 19044 .monospace { | |
| 19045 font-family: consolas, courier, monospace; | |
| 19046 font-size: 1em; | |
| 19047 line-height: 1.2em; | |
| 19048 white-space: nowrap; | |
| 19049 } | |
| 19050 | |
| 19051 a { | |
| 19052 color: #0489c3; | |
| 19053 text-decoration: none; | |
| 19054 } | |
| 19055 | |
| 19056 a:hover { | |
| 19057 text-decoration: underline; | |
| 19058 } | |
| 19059 | |
| 19060 em { | |
| 19061 color: inherit; | |
| 19062 font-style: italic; | |
| 19063 } | |
| 19064 | |
| 19065 b { | |
| 19066 color: inherit; | |
| 19067 font-weight: bold; | |
| 19068 } | |
| 19069 | |
| 19070 hr { | |
| 19071 margin-top: 20px; | |
| 19072 margin-bottom: 20px; | |
| 19073 border: 0; | |
| 19074 border-top: 1px solid #eee; | |
| 19075 height: 0; | |
| 19076 box-sizing: content-box; | |
| 19077 } | |
| 19078 | |
| 19079 .list-group { | |
| 19080 padding-left: 0; | |
| 19081 margin-bottom: 20px; | |
| 19082 } | |
| 19083 | |
| 19084 .list-group-item { | |
| 19085 position: relative; | |
| 19086 display: block; | |
| 19087 padding: 10px 15px; | |
| 19088 margin-bottom: -1px; | |
| 19089 background-color: #fff; | |
| 19090 } | |
| 19091 | |
| 19092 .list-group-item:first-child { | |
| 19093 /* rounded top corners */ | |
| 19094 border-top-right-radius:4px; | |
| 19095 border-top-left-radius:4px; | |
| 19096 } | |
| 19097 | |
| 19098 .list-group-item:last-child { | |
| 19099 margin-bottom: 0; | |
| 19100 /* rounded bottom corners */ | |
| 19101 border-bottom-right-radius: 4px; | |
| 19102 border-bottom-left-radius:4px; | |
| 19103 } | |
| 19104 | |
| 19105 /* Flex row container */ | |
| 19106 .flex-row { | |
| 19107 display: flex; | |
| 19108 flex-direction: row; | |
| 19109 } | |
| 19110 | |
| 19111 /* Flex column container */ | |
| 19112 .flex-column { | |
| 19113 display: flex; | |
| 19114 flex-direction: column; | |
| 19115 } | |
| 19116 | |
| 19117 .flex-item-fit { | |
| 19118 flex-grow: 1; | |
| 19119 flex-shrink: 1; | |
| 19120 flex-basis: auto; | |
| 19121 } | |
| 19122 | |
| 19123 .flex-item-no-shrink { | |
| 19124 flex-grow: 0; | |
| 19125 flex-shrink: 0; | |
| 19126 flex-basis: auto; | |
| 19127 } | |
| 19128 | |
| 19129 .flex-item-fill { | |
| 19130 flex-grow: 0; | |
| 19131 flex-shrink: 1; /* shrink when pressured */ | |
| 19132 flex-basis: 100%; /* try and take 100% */ | |
| 19133 } | |
| 19134 | |
| 19135 .flex-item-fixed-1-12 { | |
| 19136 flex-grow: 0; | |
| 19137 flex-shrink: 0; | |
| 19138 flex-basis: 8.3%; | |
| 19139 } | |
| 19140 | |
| 19141 .flex-item-fixed-2-12 { | |
| 19142 flex-grow: 0; | |
| 19143 flex-shrink: 0; | |
| 19144 flex-basis: 16.6%; | |
| 19145 } | |
| 19146 | |
| 19147 .flex-item-fixed-4-12 { | |
| 19148 flex-grow: 0; | |
| 19149 flex-shrink: 0; | |
| 19150 flex-basis: 33.3333%; | |
| 19151 } | |
| 19152 | |
| 19153 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 19154 flex-grow: 0; | |
| 19155 flex-shrink: 0; | |
| 19156 flex-basis: 50%; | |
| 19157 } | |
| 19158 | |
| 19159 .flex-item-fixed-8-12 { | |
| 19160 flex-grow: 0; | |
| 19161 flex-shrink: 0; | |
| 19162 flex-basis: 66.6666%; | |
| 19163 } | |
| 19164 | |
| 19165 .flex-item-fixed-9-12 { | |
| 19166 flex-grow: 0; | |
| 19167 flex-shrink: 0; | |
| 19168 flex-basis: 75%; | |
| 19169 } | |
| 19170 | |
| 19171 | |
| 19172 .flex-item-fixed-12-12 { | |
| 19173 flex-grow: 0; | |
| 19174 flex-shrink: 0; | |
| 19175 flex-basis: 100%; | |
| 19176 } | |
| 19177 | |
| 19178 .flex-item-10-percent { | |
| 19179 flex-grow: 0; | |
| 19180 flex-shrink: 0; | |
| 19181 flex-basis: 10%; | |
| 19182 } | |
| 19183 | |
| 19184 .flex-item-15-percent { | |
| 19185 flex-grow: 0; | |
| 19186 flex-shrink: 0; | |
| 19187 flex-basis: 15%; | |
| 19188 } | |
| 19189 | |
| 19190 .flex-item-20-percent { | |
| 19191 flex-grow: 0; | |
| 19192 flex-shrink: 0; | |
| 19193 flex-basis: 20%; | |
| 19194 } | |
| 19195 | |
| 19196 .flex-item-30-percent { | |
| 19197 flex-grow: 0; | |
| 19198 flex-shrink: 0; | |
| 19199 flex-basis: 30%; | |
| 19200 } | |
| 19201 | |
| 19202 .flex-item-40-percent { | |
| 19203 flex-grow: 0; | |
| 19204 flex-shrink: 0; | |
| 19205 flex-basis: 40%; | |
| 19206 } | |
| 19207 | |
| 19208 .flex-item-50-percent { | |
| 19209 flex-grow: 0; | |
| 19210 flex-shrink: 0; | |
| 19211 flex-basis: 50%; | |
| 19212 } | |
| 19213 | |
| 19214 .flex-item-60-percent { | |
| 19215 flex-grow: 0; | |
| 19216 flex-shrink: 0; | |
| 19217 flex-basis: 60%; | |
| 19218 } | |
| 19219 | |
| 19220 .flex-item-70-percent { | |
| 19221 flex-grow: 0; | |
| 19222 flex-shrink: 0; | |
| 19223 flex-basis: 70%; | |
| 19224 } | |
| 19225 | |
| 19226 .flex-item-80-percent { | |
| 19227 flex-grow: 0; | |
| 19228 flex-shrink: 0; | |
| 19229 flex-basis: 80%; | |
| 19230 } | |
| 19231 | |
| 19232 .well { | |
| 19233 min-height: 20px; | |
| 19234 padding: 19px; | |
| 19235 margin-bottom: 20px; | |
| 19236 background-color: #f5f5f5; | |
| 19237 border: 1px solid #e3e3e3; | |
| 19238 border-radius: 4px; | |
| 19239 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 19240 } | |
| 19241 | |
| 19242 .break-wrap { | |
| 19243 word-wrap: break-word; | |
| 19244 } | |
| 19245 </style> | |
| 19246 <style> | 4066 <style> |
| 19247 .table { | 4067 .table { |
| 19248 border-collapse: collapse!important; | 4068 border-collapse: collapse!important; |
| 19249 margin-bottom: 20px | 4069 margin-bottom: 20px |
| 19250 table-layout: fixed; | 4070 table-layout: fixed; |
| 19251 } | 4071 } |
| 19252 .table td:nth-of-type(1) { | 4072 .table td:nth-of-type(1) { |
| 19253 width: 30%; | 4073 width: 30%; |
| 19254 } | 4074 } |
| 19255 .th, .td { | 4075 .th, .td { |
| (...skipping 149 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 19405 <tbody id="classTableBody"> | 4225 <tbody id="classTableBody"> |
| 19406 </tbody> | 4226 </tbody> |
| 19407 </table> | 4227 </table> |
| 19408 <br><br><br> | 4228 <br><br><br> |
| 19409 <br><br><br> | 4229 <br><br><br> |
| 19410 </div> | 4230 </div> |
| 19411 </template> | 4231 </template> |
| 19412 </polymer-element> | 4232 </polymer-element> |
| 19413 | 4233 |
| 19414 | 4234 |
| 19415 | |
| 19416 | |
| 19417 | |
| 19418 | |
| 19419 | |
| 19420 | |
| 19421 | |
| 19422 | |
| 19423 <polymer-element name="sliding-checkbox"> | |
| 19424 <template> | |
| 19425 <style> | |
| 19426 .switch { | |
| 19427 position: relative; | |
| 19428 width: 121px; | |
| 19429 -webkit-user-select: none; | |
| 19430 -moz-user-select: none; | |
| 19431 -ms-user-select: none; | |
| 19432 } | |
| 19433 .hide { | |
| 19434 display: none; | |
| 19435 } | |
| 19436 .label { | |
| 19437 display: block; | |
| 19438 overflow: hidden; | |
| 19439 cursor: pointer; | |
| 19440 border: 2px solid #999999; | |
| 19441 border-radius: 15px; | |
| 19442 } | |
| 19443 .content { | |
| 19444 width: 200%; | |
| 19445 margin-left: -100%; | |
| 19446 -moz-transition: margin 0.3s ease-in 0s; | |
| 19447 -webkit-transition: margin 0.3s ease-in 0s; | |
| 19448 -o-transition: margin 0.3s ease-in 0s; | |
| 19449 transition: margin 0.3s ease-in 0s; | |
| 19450 } | |
| 19451 .content:before, .content:after { | |
| 19452 float: left; | |
| 19453 width: 50%; | |
| 19454 height: 30px; | |
| 19455 padding: 0; | |
| 19456 line-height: 30px; | |
| 19457 color: white; | |
| 19458 font: 400 14px 'Montserrat', sans-serif; | |
| 19459 -moz-box-sizing: border-box; | |
| 19460 -webkit-box-sizing: border-box; | |
| 19461 box-sizing: border-box; | |
| 19462 } | |
| 19463 .content:before { | |
| 19464 content: {{ checkedText }}; | |
| 19465 padding-left: 10px; | |
| 19466 background-color: #0489C3; | |
| 19467 } | |
| 19468 .content:after { | |
| 19469 content: {{ uncheckedText }}; | |
| 19470 padding-right: 10px; | |
| 19471 background-color: #EEEEEE; | |
| 19472 color: #999999; | |
| 19473 text-align: right; | |
| 19474 } | |
| 19475 .dot { | |
| 19476 width: 14px; | |
| 19477 margin: 8px; | |
| 19478 background: #FFFFFF; | |
| 19479 border: 2px solid #999999; | |
| 19480 border-radius: 15px; | |
| 19481 position: absolute; | |
| 19482 top: 0; | |
| 19483 bottom: 0; | |
| 19484 right: 87px; | |
| 19485 -moz-transition: all 0.3s ease-in 0s; | |
| 19486 -webkit-transition: all 0.3s ease-in 0s; | |
| 19487 -o-transition: all 0.3s ease-in 0s; | |
| 19488 transition: all 0.3s ease-in 0s; | |
| 19489 } | |
| 19490 :checked + .label .content { | |
| 19491 margin-left: 0; | |
| 19492 } | |
| 19493 :checked + .label .dot { | |
| 19494 right: 0px; | |
| 19495 } | |
| 19496 </style> | |
| 19497 <div class="switch"> | |
| 19498 <input type="checkbox" class="hide" id="slide-switch" on-change="{{ change
}}"> | |
| 19499 <label class="label" for="slide-switch"> | |
| 19500 <div class="content"></div> | |
| 19501 <div class="dot"></div> | |
| 19502 </label> | |
| 19503 </div> | |
| 19504 </template> | |
| 19505 </polymer-element> | |
| 19506 | |
| 19507 | |
| 19508 | |
| 19509 <polymer-element name="isolate-profile" extends="observatory-element"> | |
| 19510 <template> | |
| 19511 <style>/* Global styles */ | |
| 19512 * { | |
| 19513 margin: 0; | |
| 19514 padding: 0; | |
| 19515 font: 400 14px 'Montserrat', sans-serif; | |
| 19516 color: #333; | |
| 19517 box-sizing: border-box; | |
| 19518 } | |
| 19519 | |
| 19520 .content { | |
| 19521 padding-left: 10%; | |
| 19522 font: 400 14px 'Montserrat', sans-serif; | |
| 19523 } | |
| 19524 | |
| 19525 .content-centered { | |
| 19526 padding-left: 10%; | |
| 19527 padding-right: 10%; | |
| 19528 font: 400 14px 'Montserrat', sans-serif; | |
| 19529 } | |
| 19530 | |
| 19531 .content-centered-big { | |
| 19532 padding-left: 5%; | |
| 19533 padding-right: 5%; | |
| 19534 font: 400 14px 'Montserrat', sans-serif; | |
| 19535 } | |
| 19536 | |
| 19537 h1 { | |
| 19538 font: 400 18px 'Montserrat', sans-serif; | |
| 19539 } | |
| 19540 | |
| 19541 .memberList { | |
| 19542 display: table; | |
| 19543 } | |
| 19544 | |
| 19545 .memberItem { | |
| 19546 display: table-row; | |
| 19547 } | |
| 19548 | |
| 19549 .memberName, .memberValue { | |
| 19550 display: table-cell; | |
| 19551 vertical-align: top; | |
| 19552 padding: 3px 0 3px 1em; | |
| 19553 font: 400 14px 'Montserrat', sans-serif; | |
| 19554 } | |
| 19555 | |
| 19556 .memberSmall { | |
| 19557 display: table-cell; | |
| 19558 vertical-align: top; | |
| 19559 padding: 3px 0 3px 1em; | |
| 19560 font: 400 12px 'Montserrat', sans-serif; | |
| 19561 } | |
| 19562 | |
| 19563 .monospace { | |
| 19564 font-family: consolas, courier, monospace; | |
| 19565 font-size: 1em; | |
| 19566 line-height: 1.2em; | |
| 19567 white-space: nowrap; | |
| 19568 } | |
| 19569 | |
| 19570 a { | |
| 19571 color: #0489c3; | |
| 19572 text-decoration: none; | |
| 19573 } | |
| 19574 | |
| 19575 a:hover { | |
| 19576 text-decoration: underline; | |
| 19577 } | |
| 19578 | |
| 19579 em { | |
| 19580 color: inherit; | |
| 19581 font-style: italic; | |
| 19582 } | |
| 19583 | |
| 19584 b { | |
| 19585 color: inherit; | |
| 19586 font-weight: bold; | |
| 19587 } | |
| 19588 | |
| 19589 hr { | |
| 19590 margin-top: 20px; | |
| 19591 margin-bottom: 20px; | |
| 19592 border: 0; | |
| 19593 border-top: 1px solid #eee; | |
| 19594 height: 0; | |
| 19595 box-sizing: content-box; | |
| 19596 } | |
| 19597 | |
| 19598 .list-group { | |
| 19599 padding-left: 0; | |
| 19600 margin-bottom: 20px; | |
| 19601 } | |
| 19602 | |
| 19603 .list-group-item { | |
| 19604 position: relative; | |
| 19605 display: block; | |
| 19606 padding: 10px 15px; | |
| 19607 margin-bottom: -1px; | |
| 19608 background-color: #fff; | |
| 19609 } | |
| 19610 | |
| 19611 .list-group-item:first-child { | |
| 19612 /* rounded top corners */ | |
| 19613 border-top-right-radius:4px; | |
| 19614 border-top-left-radius:4px; | |
| 19615 } | |
| 19616 | |
| 19617 .list-group-item:last-child { | |
| 19618 margin-bottom: 0; | |
| 19619 /* rounded bottom corners */ | |
| 19620 border-bottom-right-radius: 4px; | |
| 19621 border-bottom-left-radius:4px; | |
| 19622 } | |
| 19623 | |
| 19624 /* Flex row container */ | |
| 19625 .flex-row { | |
| 19626 display: flex; | |
| 19627 flex-direction: row; | |
| 19628 } | |
| 19629 | |
| 19630 /* Flex column container */ | |
| 19631 .flex-column { | |
| 19632 display: flex; | |
| 19633 flex-direction: column; | |
| 19634 } | |
| 19635 | |
| 19636 .flex-item-fit { | |
| 19637 flex-grow: 1; | |
| 19638 flex-shrink: 1; | |
| 19639 flex-basis: auto; | |
| 19640 } | |
| 19641 | |
| 19642 .flex-item-no-shrink { | |
| 19643 flex-grow: 0; | |
| 19644 flex-shrink: 0; | |
| 19645 flex-basis: auto; | |
| 19646 } | |
| 19647 | |
| 19648 .flex-item-fill { | |
| 19649 flex-grow: 0; | |
| 19650 flex-shrink: 1; /* shrink when pressured */ | |
| 19651 flex-basis: 100%; /* try and take 100% */ | |
| 19652 } | |
| 19653 | |
| 19654 .flex-item-fixed-1-12 { | |
| 19655 flex-grow: 0; | |
| 19656 flex-shrink: 0; | |
| 19657 flex-basis: 8.3%; | |
| 19658 } | |
| 19659 | |
| 19660 .flex-item-fixed-2-12 { | |
| 19661 flex-grow: 0; | |
| 19662 flex-shrink: 0; | |
| 19663 flex-basis: 16.6%; | |
| 19664 } | |
| 19665 | |
| 19666 .flex-item-fixed-4-12 { | |
| 19667 flex-grow: 0; | |
| 19668 flex-shrink: 0; | |
| 19669 flex-basis: 33.3333%; | |
| 19670 } | |
| 19671 | |
| 19672 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 19673 flex-grow: 0; | |
| 19674 flex-shrink: 0; | |
| 19675 flex-basis: 50%; | |
| 19676 } | |
| 19677 | |
| 19678 .flex-item-fixed-8-12 { | |
| 19679 flex-grow: 0; | |
| 19680 flex-shrink: 0; | |
| 19681 flex-basis: 66.6666%; | |
| 19682 } | |
| 19683 | |
| 19684 .flex-item-fixed-9-12 { | |
| 19685 flex-grow: 0; | |
| 19686 flex-shrink: 0; | |
| 19687 flex-basis: 75%; | |
| 19688 } | |
| 19689 | |
| 19690 | |
| 19691 .flex-item-fixed-12-12 { | |
| 19692 flex-grow: 0; | |
| 19693 flex-shrink: 0; | |
| 19694 flex-basis: 100%; | |
| 19695 } | |
| 19696 | |
| 19697 .flex-item-10-percent { | |
| 19698 flex-grow: 0; | |
| 19699 flex-shrink: 0; | |
| 19700 flex-basis: 10%; | |
| 19701 } | |
| 19702 | |
| 19703 .flex-item-15-percent { | |
| 19704 flex-grow: 0; | |
| 19705 flex-shrink: 0; | |
| 19706 flex-basis: 15%; | |
| 19707 } | |
| 19708 | |
| 19709 .flex-item-20-percent { | |
| 19710 flex-grow: 0; | |
| 19711 flex-shrink: 0; | |
| 19712 flex-basis: 20%; | |
| 19713 } | |
| 19714 | |
| 19715 .flex-item-30-percent { | |
| 19716 flex-grow: 0; | |
| 19717 flex-shrink: 0; | |
| 19718 flex-basis: 30%; | |
| 19719 } | |
| 19720 | |
| 19721 .flex-item-40-percent { | |
| 19722 flex-grow: 0; | |
| 19723 flex-shrink: 0; | |
| 19724 flex-basis: 40%; | |
| 19725 } | |
| 19726 | |
| 19727 .flex-item-50-percent { | |
| 19728 flex-grow: 0; | |
| 19729 flex-shrink: 0; | |
| 19730 flex-basis: 50%; | |
| 19731 } | |
| 19732 | |
| 19733 .flex-item-60-percent { | |
| 19734 flex-grow: 0; | |
| 19735 flex-shrink: 0; | |
| 19736 flex-basis: 60%; | |
| 19737 } | |
| 19738 | |
| 19739 .flex-item-70-percent { | |
| 19740 flex-grow: 0; | |
| 19741 flex-shrink: 0; | |
| 19742 flex-basis: 70%; | |
| 19743 } | |
| 19744 | |
| 19745 .flex-item-80-percent { | |
| 19746 flex-grow: 0; | |
| 19747 flex-shrink: 0; | |
| 19748 flex-basis: 80%; | |
| 19749 } | |
| 19750 | |
| 19751 .well { | |
| 19752 min-height: 20px; | |
| 19753 padding: 19px; | |
| 19754 margin-bottom: 20px; | |
| 19755 background-color: #f5f5f5; | |
| 19756 border: 1px solid #e3e3e3; | |
| 19757 border-radius: 4px; | |
| 19758 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 19759 } | |
| 19760 | |
| 19761 .break-wrap { | |
| 19762 word-wrap: break-word; | |
| 19763 } | |
| 19764 </style> | |
| 19765 <nav-bar> | |
| 19766 <top-nav-menu></top-nav-menu> | |
| 19767 <isolate-nav-menu isolate="{{ profile.isolate }}"></isolate-nav-menu> | |
| 19768 <nav-menu link="{{ profile.isolate.relativeLink('profile') }}" anchor="cpu
profile" last="{{ true }}"></nav-menu> | |
| 19769 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 19770 <nav-control></nav-control> | |
| 19771 </nav-bar> | |
| 19772 <style> | |
| 19773 .table { | |
| 19774 border-collapse: collapse!important; | |
| 19775 width: 100%; | |
| 19776 margin-bottom: 20px | |
| 19777 } | |
| 19778 .table thead > tr > th, | |
| 19779 .table tbody > tr > th, | |
| 19780 .table tfoot > tr > th, | |
| 19781 .table thead > tr > td, | |
| 19782 .table tbody > tr > td, | |
| 19783 .table tfoot > tr > td { | |
| 19784 padding: 8px; | |
| 19785 vertical-align: top; | |
| 19786 } | |
| 19787 .table thead > tr > th { | |
| 19788 vertical-align: bottom; | |
| 19789 text-align: left; | |
| 19790 border-bottom:2px solid #ddd; | |
| 19791 } | |
| 19792 | |
| 19793 tr:hover > td { | |
| 19794 background-color: #FFF3E3; | |
| 19795 } | |
| 19796 .rowColor0 { | |
| 19797 background-color: #FFE9CC; | |
| 19798 } | |
| 19799 .rowColor1 { | |
| 19800 background-color: #FFDEB2; | |
| 19801 } | |
| 19802 .rowColor2 { | |
| 19803 background-color: #FFD399; | |
| 19804 } | |
| 19805 .rowColor3 { | |
| 19806 background-color: #FFC87F; | |
| 19807 } | |
| 19808 .rowColor4 { | |
| 19809 background-color: #FFBD66; | |
| 19810 } | |
| 19811 .rowColor5 { | |
| 19812 background-color: #FFB24C; | |
| 19813 } | |
| 19814 .rowColor6 { | |
| 19815 background-color: #FFA733; | |
| 19816 } | |
| 19817 .rowColor7 { | |
| 19818 background-color: #FF9C19; | |
| 19819 } | |
| 19820 .rowColor8 { | |
| 19821 background-color: #FF9100; | |
| 19822 } | |
| 19823 | |
| 19824 .tooltip { | |
| 19825 display: block; | |
| 19826 position: absolute; | |
| 19827 visibility: hidden; | |
| 19828 opacity: 0; | |
| 19829 transition: visibility 0s linear 0.5s; | |
| 19830 transition: opacity .4s ease-in-out; | |
| 19831 } | |
| 19832 | |
| 19833 tr:hover .tooltip { | |
| 19834 display: block; | |
| 19835 position: absolute; | |
| 19836 top: 100%; | |
| 19837 right: 100%; | |
| 19838 visibility: visible; | |
| 19839 z-index: 999; | |
| 19840 width: 400px; | |
| 19841 color: #ffffff; | |
| 19842 background-color: #0489c3; | |
| 19843 border-top-right-radius: 8px; | |
| 19844 border-top-left-radius: 8px; | |
| 19845 border-bottom-right-radius: 8px; | |
| 19846 border-bottom-left-radius: 8px; | |
| 19847 transition: visibility 0s linear 0.5s; | |
| 19848 transition: opacity .4s ease-in-out; | |
| 19849 opacity: 1; | |
| 19850 } | |
| 19851 | |
| 19852 .white { | |
| 19853 color: #ffffff; | |
| 19854 } | |
| 19855 | |
| 19856 </style> | |
| 19857 <div class="content"> | |
| 19858 <h1>Sampled CPU profile</h1> | |
| 19859 <div class="memberList"> | |
| 19860 <div class="memberItem"> | |
| 19861 <div class="memberName">Timestamp</div> | |
| 19862 <div class="memberValue">{{ refreshTime }}</div> | |
| 19863 </div> | |
| 19864 <div class="memberItem"> | |
| 19865 <div class="memberName">Time span</div> | |
| 19866 <div class="memberValue">{{ timeSpan }}</div> | |
| 19867 </div> | |
| 19868 <div class="memberItem"> | |
| 19869 <div class="memberName">Sample count</div> | |
| 19870 <div class="memberValue">{{ sampleCount }}</div> | |
| 19871 </div> | |
| 19872 <div class="memberItem"> | |
| 19873 <div class="memberName">Sample rate</div> | |
| 19874 <div class="memberValue">{{ sampleRate }} Hz</div> | |
| 19875 </div> | |
| 19876 <div class="memberItem"> | |
| 19877 <div class="memberName">Sample depth</div> | |
| 19878 <div class="memberValue">{{ sampleDepth }} stack frames</div> | |
| 19879 </div> | |
| 19880 <div class="memberItem"> | |
| 19881 <div class="memberName">Display cutoff</div> | |
| 19882 <div class="memberValue">{{ displayCutoff }}</div> | |
| 19883 </div> | |
| 19884 <div class="memberItem"> | |
| 19885 <div class="memberName">Tags</div> | |
| 19886 <div class="memberValue"> | |
| 19887 <select value="{{tagSelector}}"> | |
| 19888 <option value="uv">User > VM</option> | |
| 19889 <option value="u">User</option> | |
| 19890 <option value="vu">VM > User</option> | |
| 19891 <option value="v">VM</option> | |
| 19892 <option value="hide">None</option> | |
| 19893 </select> | |
| 19894 </div> | |
| 19895 </div> | |
| 19896 </div> | |
| 19897 <hr> | |
| 19898 <table id="tableTree" class="table"> | |
| 19899 <thead> | |
| 19900 <tr> | |
| 19901 <th>Method</th> | |
| 19902 <th>Self</th> | |
| 19903 </tr> | |
| 19904 </thead> | |
| 19905 <tbody> | |
| 19906 <tr template="" repeat="{{row in tree.rows }}" style="{{}}"> | |
| 19907 <td on-click="{{toggleExpanded}}" class="{{ coloring(row) }}" style=
"{{ padding(row) }}"> | |
| 19908 <span id="expand" style="{{ row.expanderStyle }}">{{ row.expander
}}</span> | |
| 19909 <div style="position: relative;display: inline"> | |
| 19910 {{row.columns[0]}} | |
| 19911 </div> | |
| 19912 <code-ref ref="{{ row.code }}"></code-ref> | |
| 19913 </td> | |
| 19914 <td class="{{ coloring(row) }}" style="position: relative"> | |
| 19915 {{row.columns[1]}} | |
| 19916 <div class="tooltip"> | |
| 19917 <div class="memberList"> | |
| 19918 <div class="memberItem"> | |
| 19919 <div class="memberName white">Kind</div> | |
| 19920 <div class="memberValue white">{{ row.tipKind }}</div> | |
| 19921 </div> | |
| 19922 <div class="memberItem"> | |
| 19923 <div class="memberName white">Percent of Parent</div> | |
| 19924 <div class="memberValue white">{{ row.tipParent }}</div> | |
| 19925 </div> | |
| 19926 <div class="memberItem"> | |
| 19927 <div class="memberName white">Sample Count</div> | |
| 19928 <div class="memberValue white">{{ row.tipTicks }} ({{ row.tip
Exclusive }})</div> | |
| 19929 </div> | |
| 19930 <div class="memberItem"> | |
| 19931 <div class="memberName white">Approximate Execution Time</div
> | |
| 19932 <div class="memberValue white">{{ row.tipTime }}</div> | |
| 19933 </div> | |
| 19934 </div> | |
| 19935 </div> | |
| 19936 </td> | |
| 19937 </tr> | |
| 19938 </tbody> | |
| 19939 </table> | |
| 19940 </div> | |
| 19941 </template> | |
| 19942 </polymer-element> | |
| 19943 | |
| 19944 | |
| 19945 | |
| 19946 | |
| 19947 | |
| 19948 | |
| 19949 | |
| 19950 | |
| 19951 | |
| 19952 | |
| 19953 <polymer-element name="script-view" extends="observatory-element"> | |
| 19954 <template> | |
| 19955 <style>/* Global styles */ | |
| 19956 * { | |
| 19957 margin: 0; | |
| 19958 padding: 0; | |
| 19959 font: 400 14px 'Montserrat', sans-serif; | |
| 19960 color: #333; | |
| 19961 box-sizing: border-box; | |
| 19962 } | |
| 19963 | |
| 19964 .content { | |
| 19965 padding-left: 10%; | |
| 19966 font: 400 14px 'Montserrat', sans-serif; | |
| 19967 } | |
| 19968 | |
| 19969 .content-centered { | |
| 19970 padding-left: 10%; | |
| 19971 padding-right: 10%; | |
| 19972 font: 400 14px 'Montserrat', sans-serif; | |
| 19973 } | |
| 19974 | |
| 19975 .content-centered-big { | |
| 19976 padding-left: 5%; | |
| 19977 padding-right: 5%; | |
| 19978 font: 400 14px 'Montserrat', sans-serif; | |
| 19979 } | |
| 19980 | |
| 19981 h1 { | |
| 19982 font: 400 18px 'Montserrat', sans-serif; | |
| 19983 } | |
| 19984 | |
| 19985 .memberList { | |
| 19986 display: table; | |
| 19987 } | |
| 19988 | |
| 19989 .memberItem { | |
| 19990 display: table-row; | |
| 19991 } | |
| 19992 | |
| 19993 .memberName, .memberValue { | |
| 19994 display: table-cell; | |
| 19995 vertical-align: top; | |
| 19996 padding: 3px 0 3px 1em; | |
| 19997 font: 400 14px 'Montserrat', sans-serif; | |
| 19998 } | |
| 19999 | |
| 20000 .memberSmall { | |
| 20001 display: table-cell; | |
| 20002 vertical-align: top; | |
| 20003 padding: 3px 0 3px 1em; | |
| 20004 font: 400 12px 'Montserrat', sans-serif; | |
| 20005 } | |
| 20006 | |
| 20007 .monospace { | |
| 20008 font-family: consolas, courier, monospace; | |
| 20009 font-size: 1em; | |
| 20010 line-height: 1.2em; | |
| 20011 white-space: nowrap; | |
| 20012 } | |
| 20013 | |
| 20014 a { | |
| 20015 color: #0489c3; | |
| 20016 text-decoration: none; | |
| 20017 } | |
| 20018 | |
| 20019 a:hover { | |
| 20020 text-decoration: underline; | |
| 20021 } | |
| 20022 | |
| 20023 em { | |
| 20024 color: inherit; | |
| 20025 font-style: italic; | |
| 20026 } | |
| 20027 | |
| 20028 b { | |
| 20029 color: inherit; | |
| 20030 font-weight: bold; | |
| 20031 } | |
| 20032 | |
| 20033 hr { | |
| 20034 margin-top: 20px; | |
| 20035 margin-bottom: 20px; | |
| 20036 border: 0; | |
| 20037 border-top: 1px solid #eee; | |
| 20038 height: 0; | |
| 20039 box-sizing: content-box; | |
| 20040 } | |
| 20041 | |
| 20042 .list-group { | |
| 20043 padding-left: 0; | |
| 20044 margin-bottom: 20px; | |
| 20045 } | |
| 20046 | |
| 20047 .list-group-item { | |
| 20048 position: relative; | |
| 20049 display: block; | |
| 20050 padding: 10px 15px; | |
| 20051 margin-bottom: -1px; | |
| 20052 background-color: #fff; | |
| 20053 } | |
| 20054 | |
| 20055 .list-group-item:first-child { | |
| 20056 /* rounded top corners */ | |
| 20057 border-top-right-radius:4px; | |
| 20058 border-top-left-radius:4px; | |
| 20059 } | |
| 20060 | |
| 20061 .list-group-item:last-child { | |
| 20062 margin-bottom: 0; | |
| 20063 /* rounded bottom corners */ | |
| 20064 border-bottom-right-radius: 4px; | |
| 20065 border-bottom-left-radius:4px; | |
| 20066 } | |
| 20067 | |
| 20068 /* Flex row container */ | |
| 20069 .flex-row { | |
| 20070 display: flex; | |
| 20071 flex-direction: row; | |
| 20072 } | |
| 20073 | |
| 20074 /* Flex column container */ | |
| 20075 .flex-column { | |
| 20076 display: flex; | |
| 20077 flex-direction: column; | |
| 20078 } | |
| 20079 | |
| 20080 .flex-item-fit { | |
| 20081 flex-grow: 1; | |
| 20082 flex-shrink: 1; | |
| 20083 flex-basis: auto; | |
| 20084 } | |
| 20085 | |
| 20086 .flex-item-no-shrink { | |
| 20087 flex-grow: 0; | |
| 20088 flex-shrink: 0; | |
| 20089 flex-basis: auto; | |
| 20090 } | |
| 20091 | |
| 20092 .flex-item-fill { | |
| 20093 flex-grow: 0; | |
| 20094 flex-shrink: 1; /* shrink when pressured */ | |
| 20095 flex-basis: 100%; /* try and take 100% */ | |
| 20096 } | |
| 20097 | |
| 20098 .flex-item-fixed-1-12 { | |
| 20099 flex-grow: 0; | |
| 20100 flex-shrink: 0; | |
| 20101 flex-basis: 8.3%; | |
| 20102 } | |
| 20103 | |
| 20104 .flex-item-fixed-2-12 { | |
| 20105 flex-grow: 0; | |
| 20106 flex-shrink: 0; | |
| 20107 flex-basis: 16.6%; | |
| 20108 } | |
| 20109 | |
| 20110 .flex-item-fixed-4-12 { | |
| 20111 flex-grow: 0; | |
| 20112 flex-shrink: 0; | |
| 20113 flex-basis: 33.3333%; | |
| 20114 } | |
| 20115 | |
| 20116 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 20117 flex-grow: 0; | |
| 20118 flex-shrink: 0; | |
| 20119 flex-basis: 50%; | |
| 20120 } | |
| 20121 | |
| 20122 .flex-item-fixed-8-12 { | |
| 20123 flex-grow: 0; | |
| 20124 flex-shrink: 0; | |
| 20125 flex-basis: 66.6666%; | |
| 20126 } | |
| 20127 | |
| 20128 .flex-item-fixed-9-12 { | |
| 20129 flex-grow: 0; | |
| 20130 flex-shrink: 0; | |
| 20131 flex-basis: 75%; | |
| 20132 } | |
| 20133 | |
| 20134 | |
| 20135 .flex-item-fixed-12-12 { | |
| 20136 flex-grow: 0; | |
| 20137 flex-shrink: 0; | |
| 20138 flex-basis: 100%; | |
| 20139 } | |
| 20140 | |
| 20141 .flex-item-10-percent { | |
| 20142 flex-grow: 0; | |
| 20143 flex-shrink: 0; | |
| 20144 flex-basis: 10%; | |
| 20145 } | |
| 20146 | |
| 20147 .flex-item-15-percent { | |
| 20148 flex-grow: 0; | |
| 20149 flex-shrink: 0; | |
| 20150 flex-basis: 15%; | |
| 20151 } | |
| 20152 | |
| 20153 .flex-item-20-percent { | |
| 20154 flex-grow: 0; | |
| 20155 flex-shrink: 0; | |
| 20156 flex-basis: 20%; | |
| 20157 } | |
| 20158 | |
| 20159 .flex-item-30-percent { | |
| 20160 flex-grow: 0; | |
| 20161 flex-shrink: 0; | |
| 20162 flex-basis: 30%; | |
| 20163 } | |
| 20164 | |
| 20165 .flex-item-40-percent { | |
| 20166 flex-grow: 0; | |
| 20167 flex-shrink: 0; | |
| 20168 flex-basis: 40%; | |
| 20169 } | |
| 20170 | |
| 20171 .flex-item-50-percent { | |
| 20172 flex-grow: 0; | |
| 20173 flex-shrink: 0; | |
| 20174 flex-basis: 50%; | |
| 20175 } | |
| 20176 | |
| 20177 .flex-item-60-percent { | |
| 20178 flex-grow: 0; | |
| 20179 flex-shrink: 0; | |
| 20180 flex-basis: 60%; | |
| 20181 } | |
| 20182 | |
| 20183 .flex-item-70-percent { | |
| 20184 flex-grow: 0; | |
| 20185 flex-shrink: 0; | |
| 20186 flex-basis: 70%; | |
| 20187 } | |
| 20188 | |
| 20189 .flex-item-80-percent { | |
| 20190 flex-grow: 0; | |
| 20191 flex-shrink: 0; | |
| 20192 flex-basis: 80%; | |
| 20193 } | |
| 20194 | |
| 20195 .well { | |
| 20196 min-height: 20px; | |
| 20197 padding: 19px; | |
| 20198 margin-bottom: 20px; | |
| 20199 background-color: #f5f5f5; | |
| 20200 border: 1px solid #e3e3e3; | |
| 20201 border-radius: 4px; | |
| 20202 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 20203 } | |
| 20204 | |
| 20205 .break-wrap { | |
| 20206 word-wrap: break-word; | |
| 20207 } | |
| 20208 </style> | |
| 20209 <nav-bar> | |
| 20210 <top-nav-menu></top-nav-menu> | |
| 20211 <isolate-nav-menu isolate="{{ script.isolate }}"> | |
| 20212 </isolate-nav-menu> | |
| 20213 <nav-menu link="{{ script.owningLibrary.link }}" anchor="{{ script.owningLib
rary.name }}"></nav-menu> | |
| 20214 <nav-menu link="{{ script.link }}" anchor="{{ script.name }}" last="{{ true
}}"></nav-menu> | |
| 20215 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></nav
-refresh> | |
| 20216 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 20217 <nav-control></nav-control> | |
| 20218 </nav-bar> | |
| 20219 | |
| 20220 <template if="{{ args['pos'] == null }}"> | |
| 20221 <script-inset id="scriptInset" script="{{ script }}"> | |
| 20222 <h1>script {{ script.name }}</h1> | |
| 20223 </script-inset> | |
| 20224 </template> | |
| 20225 | |
| 20226 <template if="{{ args['pos'] != null }}"> | |
| 20227 <script-inset id="scriptInset" script="{{ script }}" currentpos="{{ args['po
s'] | parseInt }}"> | |
| 20228 <h1>script {{ script.name }}</h1> | |
| 20229 </script-inset> | |
| 20230 </template> | |
| 20231 | |
| 20232 </template> | |
| 20233 </polymer-element> | |
| 20234 | |
| 20235 | |
| 20236 | |
| 20237 | |
| 20238 | |
| 20239 | |
| 20240 | |
| 20241 | |
| 20242 | |
| 20243 | |
| 20244 | |
| 20245 | |
| 20246 | |
| 20247 <polymer-element name="vm-view" extends="observatory-element"> | |
| 20248 <template> | |
| 20249 <style>/* Global styles */ | |
| 20250 * { | |
| 20251 margin: 0; | |
| 20252 padding: 0; | |
| 20253 font: 400 14px 'Montserrat', sans-serif; | |
| 20254 color: #333; | |
| 20255 box-sizing: border-box; | |
| 20256 } | |
| 20257 | |
| 20258 .content { | |
| 20259 padding-left: 10%; | |
| 20260 font: 400 14px 'Montserrat', sans-serif; | |
| 20261 } | |
| 20262 | |
| 20263 .content-centered { | |
| 20264 padding-left: 10%; | |
| 20265 padding-right: 10%; | |
| 20266 font: 400 14px 'Montserrat', sans-serif; | |
| 20267 } | |
| 20268 | |
| 20269 .content-centered-big { | |
| 20270 padding-left: 5%; | |
| 20271 padding-right: 5%; | |
| 20272 font: 400 14px 'Montserrat', sans-serif; | |
| 20273 } | |
| 20274 | |
| 20275 h1 { | |
| 20276 font: 400 18px 'Montserrat', sans-serif; | |
| 20277 } | |
| 20278 | |
| 20279 .memberList { | |
| 20280 display: table; | |
| 20281 } | |
| 20282 | |
| 20283 .memberItem { | |
| 20284 display: table-row; | |
| 20285 } | |
| 20286 | |
| 20287 .memberName, .memberValue { | |
| 20288 display: table-cell; | |
| 20289 vertical-align: top; | |
| 20290 padding: 3px 0 3px 1em; | |
| 20291 font: 400 14px 'Montserrat', sans-serif; | |
| 20292 } | |
| 20293 | |
| 20294 .memberSmall { | |
| 20295 display: table-cell; | |
| 20296 vertical-align: top; | |
| 20297 padding: 3px 0 3px 1em; | |
| 20298 font: 400 12px 'Montserrat', sans-serif; | |
| 20299 } | |
| 20300 | |
| 20301 .monospace { | |
| 20302 font-family: consolas, courier, monospace; | |
| 20303 font-size: 1em; | |
| 20304 line-height: 1.2em; | |
| 20305 white-space: nowrap; | |
| 20306 } | |
| 20307 | |
| 20308 a { | |
| 20309 color: #0489c3; | |
| 20310 text-decoration: none; | |
| 20311 } | |
| 20312 | |
| 20313 a:hover { | |
| 20314 text-decoration: underline; | |
| 20315 } | |
| 20316 | |
| 20317 em { | |
| 20318 color: inherit; | |
| 20319 font-style: italic; | |
| 20320 } | |
| 20321 | |
| 20322 b { | |
| 20323 color: inherit; | |
| 20324 font-weight: bold; | |
| 20325 } | |
| 20326 | |
| 20327 hr { | |
| 20328 margin-top: 20px; | |
| 20329 margin-bottom: 20px; | |
| 20330 border: 0; | |
| 20331 border-top: 1px solid #eee; | |
| 20332 height: 0; | |
| 20333 box-sizing: content-box; | |
| 20334 } | |
| 20335 | |
| 20336 .list-group { | |
| 20337 padding-left: 0; | |
| 20338 margin-bottom: 20px; | |
| 20339 } | |
| 20340 | |
| 20341 .list-group-item { | |
| 20342 position: relative; | |
| 20343 display: block; | |
| 20344 padding: 10px 15px; | |
| 20345 margin-bottom: -1px; | |
| 20346 background-color: #fff; | |
| 20347 } | |
| 20348 | |
| 20349 .list-group-item:first-child { | |
| 20350 /* rounded top corners */ | |
| 20351 border-top-right-radius:4px; | |
| 20352 border-top-left-radius:4px; | |
| 20353 } | |
| 20354 | |
| 20355 .list-group-item:last-child { | |
| 20356 margin-bottom: 0; | |
| 20357 /* rounded bottom corners */ | |
| 20358 border-bottom-right-radius: 4px; | |
| 20359 border-bottom-left-radius:4px; | |
| 20360 } | |
| 20361 | |
| 20362 /* Flex row container */ | |
| 20363 .flex-row { | |
| 20364 display: flex; | |
| 20365 flex-direction: row; | |
| 20366 } | |
| 20367 | |
| 20368 /* Flex column container */ | |
| 20369 .flex-column { | |
| 20370 display: flex; | |
| 20371 flex-direction: column; | |
| 20372 } | |
| 20373 | |
| 20374 .flex-item-fit { | |
| 20375 flex-grow: 1; | |
| 20376 flex-shrink: 1; | |
| 20377 flex-basis: auto; | |
| 20378 } | |
| 20379 | |
| 20380 .flex-item-no-shrink { | |
| 20381 flex-grow: 0; | |
| 20382 flex-shrink: 0; | |
| 20383 flex-basis: auto; | |
| 20384 } | |
| 20385 | |
| 20386 .flex-item-fill { | |
| 20387 flex-grow: 0; | |
| 20388 flex-shrink: 1; /* shrink when pressured */ | |
| 20389 flex-basis: 100%; /* try and take 100% */ | |
| 20390 } | |
| 20391 | |
| 20392 .flex-item-fixed-1-12 { | |
| 20393 flex-grow: 0; | |
| 20394 flex-shrink: 0; | |
| 20395 flex-basis: 8.3%; | |
| 20396 } | |
| 20397 | |
| 20398 .flex-item-fixed-2-12 { | |
| 20399 flex-grow: 0; | |
| 20400 flex-shrink: 0; | |
| 20401 flex-basis: 16.6%; | |
| 20402 } | |
| 20403 | |
| 20404 .flex-item-fixed-4-12 { | |
| 20405 flex-grow: 0; | |
| 20406 flex-shrink: 0; | |
| 20407 flex-basis: 33.3333%; | |
| 20408 } | |
| 20409 | |
| 20410 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 20411 flex-grow: 0; | |
| 20412 flex-shrink: 0; | |
| 20413 flex-basis: 50%; | |
| 20414 } | |
| 20415 | |
| 20416 .flex-item-fixed-8-12 { | |
| 20417 flex-grow: 0; | |
| 20418 flex-shrink: 0; | |
| 20419 flex-basis: 66.6666%; | |
| 20420 } | |
| 20421 | |
| 20422 .flex-item-fixed-9-12 { | |
| 20423 flex-grow: 0; | |
| 20424 flex-shrink: 0; | |
| 20425 flex-basis: 75%; | |
| 20426 } | |
| 20427 | |
| 20428 | |
| 20429 .flex-item-fixed-12-12 { | |
| 20430 flex-grow: 0; | |
| 20431 flex-shrink: 0; | |
| 20432 flex-basis: 100%; | |
| 20433 } | |
| 20434 | |
| 20435 .flex-item-10-percent { | |
| 20436 flex-grow: 0; | |
| 20437 flex-shrink: 0; | |
| 20438 flex-basis: 10%; | |
| 20439 } | |
| 20440 | |
| 20441 .flex-item-15-percent { | |
| 20442 flex-grow: 0; | |
| 20443 flex-shrink: 0; | |
| 20444 flex-basis: 15%; | |
| 20445 } | |
| 20446 | |
| 20447 .flex-item-20-percent { | |
| 20448 flex-grow: 0; | |
| 20449 flex-shrink: 0; | |
| 20450 flex-basis: 20%; | |
| 20451 } | |
| 20452 | |
| 20453 .flex-item-30-percent { | |
| 20454 flex-grow: 0; | |
| 20455 flex-shrink: 0; | |
| 20456 flex-basis: 30%; | |
| 20457 } | |
| 20458 | |
| 20459 .flex-item-40-percent { | |
| 20460 flex-grow: 0; | |
| 20461 flex-shrink: 0; | |
| 20462 flex-basis: 40%; | |
| 20463 } | |
| 20464 | |
| 20465 .flex-item-50-percent { | |
| 20466 flex-grow: 0; | |
| 20467 flex-shrink: 0; | |
| 20468 flex-basis: 50%; | |
| 20469 } | |
| 20470 | |
| 20471 .flex-item-60-percent { | |
| 20472 flex-grow: 0; | |
| 20473 flex-shrink: 0; | |
| 20474 flex-basis: 60%; | |
| 20475 } | |
| 20476 | |
| 20477 .flex-item-70-percent { | |
| 20478 flex-grow: 0; | |
| 20479 flex-shrink: 0; | |
| 20480 flex-basis: 70%; | |
| 20481 } | |
| 20482 | |
| 20483 .flex-item-80-percent { | |
| 20484 flex-grow: 0; | |
| 20485 flex-shrink: 0; | |
| 20486 flex-basis: 80%; | |
| 20487 } | |
| 20488 | |
| 20489 .well { | |
| 20490 min-height: 20px; | |
| 20491 padding: 19px; | |
| 20492 margin-bottom: 20px; | |
| 20493 background-color: #f5f5f5; | |
| 20494 border: 1px solid #e3e3e3; | |
| 20495 border-radius: 4px; | |
| 20496 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 20497 } | |
| 20498 | |
| 20499 .break-wrap { | |
| 20500 word-wrap: break-word; | |
| 20501 } | |
| 20502 </style> | |
| 20503 | |
| 20504 <nav-bar> | |
| 20505 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 20506 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 20507 <nav-control></nav-control> | |
| 20508 </nav-bar> | |
| 20509 | |
| 20510 <div class="content"> | |
| 20511 <h1>VM</h1> | |
| 20512 <div class="memberList"> | |
| 20513 <div class="memberItem"> | |
| 20514 <div class="memberName">version</div> | |
| 20515 <div class="memberValue">{{ vm.version }}</div> | |
| 20516 </div> | |
| 20517 <div class="memberItem"> | |
| 20518 <div class="memberName">uptime</div> | |
| 20519 <div class="memberValue">{{ vm.uptime | formatTime }}</div> | |
| 20520 </div> | |
| 20521 <div class="memberItem"> | |
| 20522 <div class="memberName">type checks enabled</div> | |
| 20523 <div class="memberValue">{{ vm.typeChecksEnabled }}</div> | |
| 20524 </div> | |
| 20525 <div class="memberItem"> | |
| 20526 <div class="memberName">asserts enabled</div> | |
| 20527 <div class="memberValue">{{ vm.assertsEnabled }}</div> | |
| 20528 </div> | |
| 20529 <div class="memberItem"> | |
| 20530 <div class="memberName">pid</div> | |
| 20531 <div class="memberValue">{{ vm.pid }}</div> | |
| 20532 </div> | |
| 20533 <div class="memberItem"> | |
| 20534 <div class="memberName">refreshed at</div> | |
| 20535 <div class="memberValue">{{ vm.lastUpdate }}</div> | |
| 20536 </div> | |
| 20537 <br> | |
| 20538 <div class="memberItem"> | |
| 20539 <div class="memberValue"> | |
| 20540 See <a on-click="{{ goto }}" _href="{{ gotoLink('/flags') }}">flags<
/a> | |
| 20541 </div> | |
| 20542 </div> | |
| 20543 </div> | |
| 20544 </div> | |
| 20545 | |
| 20546 <br> | |
| 20547 <hr> | |
| 20548 | |
| 20549 <ul class="list-group"> | |
| 20550 <template repeat="{{ isolate in vm.isolates }}"> | |
| 20551 <li class="list-group-item"> | |
| 20552 <isolate-summary isolate="{{ isolate }}"></isolate-summary> | |
| 20553 </li> | |
| 20554 <hr> | |
| 20555 </template> | |
| 20556 </ul> | |
| 20557 </template> | |
| 20558 </polymer-element> | |
| 20559 | |
| 20560 | |
| 20561 <polymer-element name="service-view" extends="observatory-element"> | |
| 20562 <!-- This element explicitly manages the child elements to avoid setting | |
| 20563 an observable property on the old element to an invalid type. --> | |
| 20564 </polymer-element> | |
| 20565 | |
| 20566 <polymer-element name="trace-view" extends="observatory-element"> | |
| 20567 <template> | |
| 20568 <style>/* Global styles */ | |
| 20569 * { | |
| 20570 margin: 0; | |
| 20571 padding: 0; | |
| 20572 font: 400 14px 'Montserrat', sans-serif; | |
| 20573 color: #333; | |
| 20574 box-sizing: border-box; | |
| 20575 } | |
| 20576 | |
| 20577 .content { | |
| 20578 padding-left: 10%; | |
| 20579 font: 400 14px 'Montserrat', sans-serif; | |
| 20580 } | |
| 20581 | |
| 20582 .content-centered { | |
| 20583 padding-left: 10%; | |
| 20584 padding-right: 10%; | |
| 20585 font: 400 14px 'Montserrat', sans-serif; | |
| 20586 } | |
| 20587 | |
| 20588 .content-centered-big { | |
| 20589 padding-left: 5%; | |
| 20590 padding-right: 5%; | |
| 20591 font: 400 14px 'Montserrat', sans-serif; | |
| 20592 } | |
| 20593 | |
| 20594 h1 { | |
| 20595 font: 400 18px 'Montserrat', sans-serif; | |
| 20596 } | |
| 20597 | |
| 20598 .memberList { | |
| 20599 display: table; | |
| 20600 } | |
| 20601 | |
| 20602 .memberItem { | |
| 20603 display: table-row; | |
| 20604 } | |
| 20605 | |
| 20606 .memberName, .memberValue { | |
| 20607 display: table-cell; | |
| 20608 vertical-align: top; | |
| 20609 padding: 3px 0 3px 1em; | |
| 20610 font: 400 14px 'Montserrat', sans-serif; | |
| 20611 } | |
| 20612 | |
| 20613 .memberSmall { | |
| 20614 display: table-cell; | |
| 20615 vertical-align: top; | |
| 20616 padding: 3px 0 3px 1em; | |
| 20617 font: 400 12px 'Montserrat', sans-serif; | |
| 20618 } | |
| 20619 | |
| 20620 .monospace { | |
| 20621 font-family: consolas, courier, monospace; | |
| 20622 font-size: 1em; | |
| 20623 line-height: 1.2em; | |
| 20624 white-space: nowrap; | |
| 20625 } | |
| 20626 | |
| 20627 a { | |
| 20628 color: #0489c3; | |
| 20629 text-decoration: none; | |
| 20630 } | |
| 20631 | |
| 20632 a:hover { | |
| 20633 text-decoration: underline; | |
| 20634 } | |
| 20635 | |
| 20636 em { | |
| 20637 color: inherit; | |
| 20638 font-style: italic; | |
| 20639 } | |
| 20640 | |
| 20641 b { | |
| 20642 color: inherit; | |
| 20643 font-weight: bold; | |
| 20644 } | |
| 20645 | |
| 20646 hr { | |
| 20647 margin-top: 20px; | |
| 20648 margin-bottom: 20px; | |
| 20649 border: 0; | |
| 20650 border-top: 1px solid #eee; | |
| 20651 height: 0; | |
| 20652 box-sizing: content-box; | |
| 20653 } | |
| 20654 | |
| 20655 .list-group { | |
| 20656 padding-left: 0; | |
| 20657 margin-bottom: 20px; | |
| 20658 } | |
| 20659 | |
| 20660 .list-group-item { | |
| 20661 position: relative; | |
| 20662 display: block; | |
| 20663 padding: 10px 15px; | |
| 20664 margin-bottom: -1px; | |
| 20665 background-color: #fff; | |
| 20666 } | |
| 20667 | |
| 20668 .list-group-item:first-child { | |
| 20669 /* rounded top corners */ | |
| 20670 border-top-right-radius:4px; | |
| 20671 border-top-left-radius:4px; | |
| 20672 } | |
| 20673 | |
| 20674 .list-group-item:last-child { | |
| 20675 margin-bottom: 0; | |
| 20676 /* rounded bottom corners */ | |
| 20677 border-bottom-right-radius: 4px; | |
| 20678 border-bottom-left-radius:4px; | |
| 20679 } | |
| 20680 | |
| 20681 /* Flex row container */ | |
| 20682 .flex-row { | |
| 20683 display: flex; | |
| 20684 flex-direction: row; | |
| 20685 } | |
| 20686 | |
| 20687 /* Flex column container */ | |
| 20688 .flex-column { | |
| 20689 display: flex; | |
| 20690 flex-direction: column; | |
| 20691 } | |
| 20692 | |
| 20693 .flex-item-fit { | |
| 20694 flex-grow: 1; | |
| 20695 flex-shrink: 1; | |
| 20696 flex-basis: auto; | |
| 20697 } | |
| 20698 | |
| 20699 .flex-item-no-shrink { | |
| 20700 flex-grow: 0; | |
| 20701 flex-shrink: 0; | |
| 20702 flex-basis: auto; | |
| 20703 } | |
| 20704 | |
| 20705 .flex-item-fill { | |
| 20706 flex-grow: 0; | |
| 20707 flex-shrink: 1; /* shrink when pressured */ | |
| 20708 flex-basis: 100%; /* try and take 100% */ | |
| 20709 } | |
| 20710 | |
| 20711 .flex-item-fixed-1-12 { | |
| 20712 flex-grow: 0; | |
| 20713 flex-shrink: 0; | |
| 20714 flex-basis: 8.3%; | |
| 20715 } | |
| 20716 | |
| 20717 .flex-item-fixed-2-12 { | |
| 20718 flex-grow: 0; | |
| 20719 flex-shrink: 0; | |
| 20720 flex-basis: 16.6%; | |
| 20721 } | |
| 20722 | |
| 20723 .flex-item-fixed-4-12 { | |
| 20724 flex-grow: 0; | |
| 20725 flex-shrink: 0; | |
| 20726 flex-basis: 33.3333%; | |
| 20727 } | |
| 20728 | |
| 20729 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 20730 flex-grow: 0; | |
| 20731 flex-shrink: 0; | |
| 20732 flex-basis: 50%; | |
| 20733 } | |
| 20734 | |
| 20735 .flex-item-fixed-8-12 { | |
| 20736 flex-grow: 0; | |
| 20737 flex-shrink: 0; | |
| 20738 flex-basis: 66.6666%; | |
| 20739 } | |
| 20740 | |
| 20741 .flex-item-fixed-9-12 { | |
| 20742 flex-grow: 0; | |
| 20743 flex-shrink: 0; | |
| 20744 flex-basis: 75%; | |
| 20745 } | |
| 20746 | |
| 20747 | |
| 20748 .flex-item-fixed-12-12 { | |
| 20749 flex-grow: 0; | |
| 20750 flex-shrink: 0; | |
| 20751 flex-basis: 100%; | |
| 20752 } | |
| 20753 | |
| 20754 .flex-item-10-percent { | |
| 20755 flex-grow: 0; | |
| 20756 flex-shrink: 0; | |
| 20757 flex-basis: 10%; | |
| 20758 } | |
| 20759 | |
| 20760 .flex-item-15-percent { | |
| 20761 flex-grow: 0; | |
| 20762 flex-shrink: 0; | |
| 20763 flex-basis: 15%; | |
| 20764 } | |
| 20765 | |
| 20766 .flex-item-20-percent { | |
| 20767 flex-grow: 0; | |
| 20768 flex-shrink: 0; | |
| 20769 flex-basis: 20%; | |
| 20770 } | |
| 20771 | |
| 20772 .flex-item-30-percent { | |
| 20773 flex-grow: 0; | |
| 20774 flex-shrink: 0; | |
| 20775 flex-basis: 30%; | |
| 20776 } | |
| 20777 | |
| 20778 .flex-item-40-percent { | |
| 20779 flex-grow: 0; | |
| 20780 flex-shrink: 0; | |
| 20781 flex-basis: 40%; | |
| 20782 } | |
| 20783 | |
| 20784 .flex-item-50-percent { | |
| 20785 flex-grow: 0; | |
| 20786 flex-shrink: 0; | |
| 20787 flex-basis: 50%; | |
| 20788 } | |
| 20789 | |
| 20790 .flex-item-60-percent { | |
| 20791 flex-grow: 0; | |
| 20792 flex-shrink: 0; | |
| 20793 flex-basis: 60%; | |
| 20794 } | |
| 20795 | |
| 20796 .flex-item-70-percent { | |
| 20797 flex-grow: 0; | |
| 20798 flex-shrink: 0; | |
| 20799 flex-basis: 70%; | |
| 20800 } | |
| 20801 | |
| 20802 .flex-item-80-percent { | |
| 20803 flex-grow: 0; | |
| 20804 flex-shrink: 0; | |
| 20805 flex-basis: 80%; | |
| 20806 } | |
| 20807 | |
| 20808 .well { | |
| 20809 min-height: 20px; | |
| 20810 padding: 19px; | |
| 20811 margin-bottom: 20px; | |
| 20812 background-color: #f5f5f5; | |
| 20813 border: 1px solid #e3e3e3; | |
| 20814 border-radius: 4px; | |
| 20815 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 20816 } | |
| 20817 | |
| 20818 .break-wrap { | |
| 20819 word-wrap: break-word; | |
| 20820 } | |
| 20821 </style> | |
| 20822 | |
| 20823 <template if="{{ tracer != null }}"> | |
| 20824 <div class="memberList"> | |
| 20825 <template repeat="{{ event in tracer.events }}"> | |
| 20826 <div class="memberItem"> | |
| 20827 <div class="memberSmall"> | |
| 20828 {{ event.timeStamp }} | |
| 20829 </div> | |
| 20830 <div class="memberSmall"> | |
| 20831 {{ event.message }} | |
| 20832 <template if="{{ event.map != null }}"> | |
| 20833 <br> | |
| 20834 <map-viewer map="{{ event.map }}"></map-viewer> | |
| 20835 </template> | |
| 20836 </div> | |
| 20837 </div> | |
| 20838 </template> | |
| 20839 </div> | |
| 20840 <br> | |
| 20841 <br> | |
| 20842 <br> | |
| 20843 </template> | |
| 20844 </template> | |
| 20845 </polymer-element> | |
| 20846 | |
| 20847 <polymer-element name="map-viewer" extends="observatory-element"> | |
| 20848 <template> | |
| 20849 <style>/* Global styles */ | |
| 20850 * { | |
| 20851 margin: 0; | |
| 20852 padding: 0; | |
| 20853 font: 400 14px 'Montserrat', sans-serif; | |
| 20854 color: #333; | |
| 20855 box-sizing: border-box; | |
| 20856 } | |
| 20857 | |
| 20858 .content { | |
| 20859 padding-left: 10%; | |
| 20860 font: 400 14px 'Montserrat', sans-serif; | |
| 20861 } | |
| 20862 | |
| 20863 .content-centered { | |
| 20864 padding-left: 10%; | |
| 20865 padding-right: 10%; | |
| 20866 font: 400 14px 'Montserrat', sans-serif; | |
| 20867 } | |
| 20868 | |
| 20869 .content-centered-big { | |
| 20870 padding-left: 5%; | |
| 20871 padding-right: 5%; | |
| 20872 font: 400 14px 'Montserrat', sans-serif; | |
| 20873 } | |
| 20874 | |
| 20875 h1 { | |
| 20876 font: 400 18px 'Montserrat', sans-serif; | |
| 20877 } | |
| 20878 | |
| 20879 .memberList { | |
| 20880 display: table; | |
| 20881 } | |
| 20882 | |
| 20883 .memberItem { | |
| 20884 display: table-row; | |
| 20885 } | |
| 20886 | |
| 20887 .memberName, .memberValue { | |
| 20888 display: table-cell; | |
| 20889 vertical-align: top; | |
| 20890 padding: 3px 0 3px 1em; | |
| 20891 font: 400 14px 'Montserrat', sans-serif; | |
| 20892 } | |
| 20893 | |
| 20894 .memberSmall { | |
| 20895 display: table-cell; | |
| 20896 vertical-align: top; | |
| 20897 padding: 3px 0 3px 1em; | |
| 20898 font: 400 12px 'Montserrat', sans-serif; | |
| 20899 } | |
| 20900 | |
| 20901 .monospace { | |
| 20902 font-family: consolas, courier, monospace; | |
| 20903 font-size: 1em; | |
| 20904 line-height: 1.2em; | |
| 20905 white-space: nowrap; | |
| 20906 } | |
| 20907 | |
| 20908 a { | |
| 20909 color: #0489c3; | |
| 20910 text-decoration: none; | |
| 20911 } | |
| 20912 | |
| 20913 a:hover { | |
| 20914 text-decoration: underline; | |
| 20915 } | |
| 20916 | |
| 20917 em { | |
| 20918 color: inherit; | |
| 20919 font-style: italic; | |
| 20920 } | |
| 20921 | |
| 20922 b { | |
| 20923 color: inherit; | |
| 20924 font-weight: bold; | |
| 20925 } | |
| 20926 | |
| 20927 hr { | |
| 20928 margin-top: 20px; | |
| 20929 margin-bottom: 20px; | |
| 20930 border: 0; | |
| 20931 border-top: 1px solid #eee; | |
| 20932 height: 0; | |
| 20933 box-sizing: content-box; | |
| 20934 } | |
| 20935 | |
| 20936 .list-group { | |
| 20937 padding-left: 0; | |
| 20938 margin-bottom: 20px; | |
| 20939 } | |
| 20940 | |
| 20941 .list-group-item { | |
| 20942 position: relative; | |
| 20943 display: block; | |
| 20944 padding: 10px 15px; | |
| 20945 margin-bottom: -1px; | |
| 20946 background-color: #fff; | |
| 20947 } | |
| 20948 | |
| 20949 .list-group-item:first-child { | |
| 20950 /* rounded top corners */ | |
| 20951 border-top-right-radius:4px; | |
| 20952 border-top-left-radius:4px; | |
| 20953 } | |
| 20954 | |
| 20955 .list-group-item:last-child { | |
| 20956 margin-bottom: 0; | |
| 20957 /* rounded bottom corners */ | |
| 20958 border-bottom-right-radius: 4px; | |
| 20959 border-bottom-left-radius:4px; | |
| 20960 } | |
| 20961 | |
| 20962 /* Flex row container */ | |
| 20963 .flex-row { | |
| 20964 display: flex; | |
| 20965 flex-direction: row; | |
| 20966 } | |
| 20967 | |
| 20968 /* Flex column container */ | |
| 20969 .flex-column { | |
| 20970 display: flex; | |
| 20971 flex-direction: column; | |
| 20972 } | |
| 20973 | |
| 20974 .flex-item-fit { | |
| 20975 flex-grow: 1; | |
| 20976 flex-shrink: 1; | |
| 20977 flex-basis: auto; | |
| 20978 } | |
| 20979 | |
| 20980 .flex-item-no-shrink { | |
| 20981 flex-grow: 0; | |
| 20982 flex-shrink: 0; | |
| 20983 flex-basis: auto; | |
| 20984 } | |
| 20985 | |
| 20986 .flex-item-fill { | |
| 20987 flex-grow: 0; | |
| 20988 flex-shrink: 1; /* shrink when pressured */ | |
| 20989 flex-basis: 100%; /* try and take 100% */ | |
| 20990 } | |
| 20991 | |
| 20992 .flex-item-fixed-1-12 { | |
| 20993 flex-grow: 0; | |
| 20994 flex-shrink: 0; | |
| 20995 flex-basis: 8.3%; | |
| 20996 } | |
| 20997 | |
| 20998 .flex-item-fixed-2-12 { | |
| 20999 flex-grow: 0; | |
| 21000 flex-shrink: 0; | |
| 21001 flex-basis: 16.6%; | |
| 21002 } | |
| 21003 | |
| 21004 .flex-item-fixed-4-12 { | |
| 21005 flex-grow: 0; | |
| 21006 flex-shrink: 0; | |
| 21007 flex-basis: 33.3333%; | |
| 21008 } | |
| 21009 | |
| 21010 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 21011 flex-grow: 0; | |
| 21012 flex-shrink: 0; | |
| 21013 flex-basis: 50%; | |
| 21014 } | |
| 21015 | |
| 21016 .flex-item-fixed-8-12 { | |
| 21017 flex-grow: 0; | |
| 21018 flex-shrink: 0; | |
| 21019 flex-basis: 66.6666%; | |
| 21020 } | |
| 21021 | |
| 21022 .flex-item-fixed-9-12 { | |
| 21023 flex-grow: 0; | |
| 21024 flex-shrink: 0; | |
| 21025 flex-basis: 75%; | |
| 21026 } | |
| 21027 | |
| 21028 | |
| 21029 .flex-item-fixed-12-12 { | |
| 21030 flex-grow: 0; | |
| 21031 flex-shrink: 0; | |
| 21032 flex-basis: 100%; | |
| 21033 } | |
| 21034 | |
| 21035 .flex-item-10-percent { | |
| 21036 flex-grow: 0; | |
| 21037 flex-shrink: 0; | |
| 21038 flex-basis: 10%; | |
| 21039 } | |
| 21040 | |
| 21041 .flex-item-15-percent { | |
| 21042 flex-grow: 0; | |
| 21043 flex-shrink: 0; | |
| 21044 flex-basis: 15%; | |
| 21045 } | |
| 21046 | |
| 21047 .flex-item-20-percent { | |
| 21048 flex-grow: 0; | |
| 21049 flex-shrink: 0; | |
| 21050 flex-basis: 20%; | |
| 21051 } | |
| 21052 | |
| 21053 .flex-item-30-percent { | |
| 21054 flex-grow: 0; | |
| 21055 flex-shrink: 0; | |
| 21056 flex-basis: 30%; | |
| 21057 } | |
| 21058 | |
| 21059 .flex-item-40-percent { | |
| 21060 flex-grow: 0; | |
| 21061 flex-shrink: 0; | |
| 21062 flex-basis: 40%; | |
| 21063 } | |
| 21064 | |
| 21065 .flex-item-50-percent { | |
| 21066 flex-grow: 0; | |
| 21067 flex-shrink: 0; | |
| 21068 flex-basis: 50%; | |
| 21069 } | |
| 21070 | |
| 21071 .flex-item-60-percent { | |
| 21072 flex-grow: 0; | |
| 21073 flex-shrink: 0; | |
| 21074 flex-basis: 60%; | |
| 21075 } | |
| 21076 | |
| 21077 .flex-item-70-percent { | |
| 21078 flex-grow: 0; | |
| 21079 flex-shrink: 0; | |
| 21080 flex-basis: 70%; | |
| 21081 } | |
| 21082 | |
| 21083 .flex-item-80-percent { | |
| 21084 flex-grow: 0; | |
| 21085 flex-shrink: 0; | |
| 21086 flex-basis: 80%; | |
| 21087 } | |
| 21088 | |
| 21089 .well { | |
| 21090 min-height: 20px; | |
| 21091 padding: 19px; | |
| 21092 margin-bottom: 20px; | |
| 21093 background-color: #f5f5f5; | |
| 21094 border: 1px solid #e3e3e3; | |
| 21095 border-radius: 4px; | |
| 21096 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 21097 } | |
| 21098 | |
| 21099 .break-wrap { | |
| 21100 word-wrap: break-word; | |
| 21101 } | |
| 21102 </style> | |
| 21103 | |
| 21104 <template if="{{ map.length > 0 }}"> | |
| 21105 <curly-block callback="{{ expander() }}"> | |
| 21106 <template if="{{ expand }}"> | |
| 21107 <div class="memberList"> | |
| 21108 <template repeat="{{ key in map.keys }}"> | |
| 21109 <div class="memberItem"> | |
| 21110 <div class="memberSmall">{{ key }}</div> | |
| 21111 <div class="memberSmall">:</div> | |
| 21112 <div class="memberSmall"> | |
| 21113 <template if="{{ isMap(map[key]) }}"> | |
| 21114 <map-viewer map="{{ map[key] }}"></map-viewer> | |
| 21115 </template> | |
| 21116 <template if="{{ isList(map[key]) }}"> | |
| 21117 <list-viewer list="{{ map[key] }}"></list-viewer> | |
| 21118 </template> | |
| 21119 <template if="{{ !isMap(map[key]) && !isList(map[key])
}}"> | |
| 21120 {{ map[key] }} | |
| 21121 </template> | |
| 21122 </div> | |
| 21123 </div> | |
| 21124 </template> | |
| 21125 </div> | |
| 21126 </template> | |
| 21127 </curly-block> | |
| 21128 </template> | |
| 21129 </template> | |
| 21130 </polymer-element> | |
| 21131 | |
| 21132 <polymer-element name="list-viewer" extends="observatory-element"> | |
| 21133 <template> | |
| 21134 <style>/* Global styles */ | |
| 21135 * { | |
| 21136 margin: 0; | |
| 21137 padding: 0; | |
| 21138 font: 400 14px 'Montserrat', sans-serif; | |
| 21139 color: #333; | |
| 21140 box-sizing: border-box; | |
| 21141 } | |
| 21142 | |
| 21143 .content { | |
| 21144 padding-left: 10%; | |
| 21145 font: 400 14px 'Montserrat', sans-serif; | |
| 21146 } | |
| 21147 | |
| 21148 .content-centered { | |
| 21149 padding-left: 10%; | |
| 21150 padding-right: 10%; | |
| 21151 font: 400 14px 'Montserrat', sans-serif; | |
| 21152 } | |
| 21153 | |
| 21154 .content-centered-big { | |
| 21155 padding-left: 5%; | |
| 21156 padding-right: 5%; | |
| 21157 font: 400 14px 'Montserrat', sans-serif; | |
| 21158 } | |
| 21159 | |
| 21160 h1 { | |
| 21161 font: 400 18px 'Montserrat', sans-serif; | |
| 21162 } | |
| 21163 | |
| 21164 .memberList { | |
| 21165 display: table; | |
| 21166 } | |
| 21167 | |
| 21168 .memberItem { | |
| 21169 display: table-row; | |
| 21170 } | |
| 21171 | |
| 21172 .memberName, .memberValue { | |
| 21173 display: table-cell; | |
| 21174 vertical-align: top; | |
| 21175 padding: 3px 0 3px 1em; | |
| 21176 font: 400 14px 'Montserrat', sans-serif; | |
| 21177 } | |
| 21178 | |
| 21179 .memberSmall { | |
| 21180 display: table-cell; | |
| 21181 vertical-align: top; | |
| 21182 padding: 3px 0 3px 1em; | |
| 21183 font: 400 12px 'Montserrat', sans-serif; | |
| 21184 } | |
| 21185 | |
| 21186 .monospace { | |
| 21187 font-family: consolas, courier, monospace; | |
| 21188 font-size: 1em; | |
| 21189 line-height: 1.2em; | |
| 21190 white-space: nowrap; | |
| 21191 } | |
| 21192 | |
| 21193 a { | |
| 21194 color: #0489c3; | |
| 21195 text-decoration: none; | |
| 21196 } | |
| 21197 | |
| 21198 a:hover { | |
| 21199 text-decoration: underline; | |
| 21200 } | |
| 21201 | |
| 21202 em { | |
| 21203 color: inherit; | |
| 21204 font-style: italic; | |
| 21205 } | |
| 21206 | |
| 21207 b { | |
| 21208 color: inherit; | |
| 21209 font-weight: bold; | |
| 21210 } | |
| 21211 | |
| 21212 hr { | |
| 21213 margin-top: 20px; | |
| 21214 margin-bottom: 20px; | |
| 21215 border: 0; | |
| 21216 border-top: 1px solid #eee; | |
| 21217 height: 0; | |
| 21218 box-sizing: content-box; | |
| 21219 } | |
| 21220 | |
| 21221 .list-group { | |
| 21222 padding-left: 0; | |
| 21223 margin-bottom: 20px; | |
| 21224 } | |
| 21225 | |
| 21226 .list-group-item { | |
| 21227 position: relative; | |
| 21228 display: block; | |
| 21229 padding: 10px 15px; | |
| 21230 margin-bottom: -1px; | |
| 21231 background-color: #fff; | |
| 21232 } | |
| 21233 | |
| 21234 .list-group-item:first-child { | |
| 21235 /* rounded top corners */ | |
| 21236 border-top-right-radius:4px; | |
| 21237 border-top-left-radius:4px; | |
| 21238 } | |
| 21239 | |
| 21240 .list-group-item:last-child { | |
| 21241 margin-bottom: 0; | |
| 21242 /* rounded bottom corners */ | |
| 21243 border-bottom-right-radius: 4px; | |
| 21244 border-bottom-left-radius:4px; | |
| 21245 } | |
| 21246 | |
| 21247 /* Flex row container */ | |
| 21248 .flex-row { | |
| 21249 display: flex; | |
| 21250 flex-direction: row; | |
| 21251 } | |
| 21252 | |
| 21253 /* Flex column container */ | |
| 21254 .flex-column { | |
| 21255 display: flex; | |
| 21256 flex-direction: column; | |
| 21257 } | |
| 21258 | |
| 21259 .flex-item-fit { | |
| 21260 flex-grow: 1; | |
| 21261 flex-shrink: 1; | |
| 21262 flex-basis: auto; | |
| 21263 } | |
| 21264 | |
| 21265 .flex-item-no-shrink { | |
| 21266 flex-grow: 0; | |
| 21267 flex-shrink: 0; | |
| 21268 flex-basis: auto; | |
| 21269 } | |
| 21270 | |
| 21271 .flex-item-fill { | |
| 21272 flex-grow: 0; | |
| 21273 flex-shrink: 1; /* shrink when pressured */ | |
| 21274 flex-basis: 100%; /* try and take 100% */ | |
| 21275 } | |
| 21276 | |
| 21277 .flex-item-fixed-1-12 { | |
| 21278 flex-grow: 0; | |
| 21279 flex-shrink: 0; | |
| 21280 flex-basis: 8.3%; | |
| 21281 } | |
| 21282 | |
| 21283 .flex-item-fixed-2-12 { | |
| 21284 flex-grow: 0; | |
| 21285 flex-shrink: 0; | |
| 21286 flex-basis: 16.6%; | |
| 21287 } | |
| 21288 | |
| 21289 .flex-item-fixed-4-12 { | |
| 21290 flex-grow: 0; | |
| 21291 flex-shrink: 0; | |
| 21292 flex-basis: 33.3333%; | |
| 21293 } | |
| 21294 | |
| 21295 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 21296 flex-grow: 0; | |
| 21297 flex-shrink: 0; | |
| 21298 flex-basis: 50%; | |
| 21299 } | |
| 21300 | |
| 21301 .flex-item-fixed-8-12 { | |
| 21302 flex-grow: 0; | |
| 21303 flex-shrink: 0; | |
| 21304 flex-basis: 66.6666%; | |
| 21305 } | |
| 21306 | |
| 21307 .flex-item-fixed-9-12 { | |
| 21308 flex-grow: 0; | |
| 21309 flex-shrink: 0; | |
| 21310 flex-basis: 75%; | |
| 21311 } | |
| 21312 | |
| 21313 | |
| 21314 .flex-item-fixed-12-12 { | |
| 21315 flex-grow: 0; | |
| 21316 flex-shrink: 0; | |
| 21317 flex-basis: 100%; | |
| 21318 } | |
| 21319 | |
| 21320 .flex-item-10-percent { | |
| 21321 flex-grow: 0; | |
| 21322 flex-shrink: 0; | |
| 21323 flex-basis: 10%; | |
| 21324 } | |
| 21325 | |
| 21326 .flex-item-15-percent { | |
| 21327 flex-grow: 0; | |
| 21328 flex-shrink: 0; | |
| 21329 flex-basis: 15%; | |
| 21330 } | |
| 21331 | |
| 21332 .flex-item-20-percent { | |
| 21333 flex-grow: 0; | |
| 21334 flex-shrink: 0; | |
| 21335 flex-basis: 20%; | |
| 21336 } | |
| 21337 | |
| 21338 .flex-item-30-percent { | |
| 21339 flex-grow: 0; | |
| 21340 flex-shrink: 0; | |
| 21341 flex-basis: 30%; | |
| 21342 } | |
| 21343 | |
| 21344 .flex-item-40-percent { | |
| 21345 flex-grow: 0; | |
| 21346 flex-shrink: 0; | |
| 21347 flex-basis: 40%; | |
| 21348 } | |
| 21349 | |
| 21350 .flex-item-50-percent { | |
| 21351 flex-grow: 0; | |
| 21352 flex-shrink: 0; | |
| 21353 flex-basis: 50%; | |
| 21354 } | |
| 21355 | |
| 21356 .flex-item-60-percent { | |
| 21357 flex-grow: 0; | |
| 21358 flex-shrink: 0; | |
| 21359 flex-basis: 60%; | |
| 21360 } | |
| 21361 | |
| 21362 .flex-item-70-percent { | |
| 21363 flex-grow: 0; | |
| 21364 flex-shrink: 0; | |
| 21365 flex-basis: 70%; | |
| 21366 } | |
| 21367 | |
| 21368 .flex-item-80-percent { | |
| 21369 flex-grow: 0; | |
| 21370 flex-shrink: 0; | |
| 21371 flex-basis: 80%; | |
| 21372 } | |
| 21373 | |
| 21374 .well { | |
| 21375 min-height: 20px; | |
| 21376 padding: 19px; | |
| 21377 margin-bottom: 20px; | |
| 21378 background-color: #f5f5f5; | |
| 21379 border: 1px solid #e3e3e3; | |
| 21380 border-radius: 4px; | |
| 21381 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 21382 } | |
| 21383 | |
| 21384 .break-wrap { | |
| 21385 word-wrap: break-word; | |
| 21386 } | |
| 21387 </style> | |
| 21388 | |
| 21389 <template if="{{ list.length > 0 }}"> | |
| 21390 <curly-block callback="{{ expander() }}"> | |
| 21391 <template if="{{ expand }}"> | |
| 21392 <div class="memberList"> | |
| 21393 <template repeat="{{ element in list }}"> | |
| 21394 <div class="memberItem"> | |
| 21395 <div class="memberSmall"> | |
| 21396 <template if="{{ isMap(element) }}"> | |
| 21397 <map-viewer map="{{ element }}"></map-viewer> | |
| 21398 </template> | |
| 21399 <template if="{{ isList(element) }}"> | |
| 21400 <list-viewer list="{{ element }}"></list-viewer> | |
| 21401 </template> | |
| 21402 <template if="{{ !isMap(element) && !isList(element) }
}"> | |
| 21403 {{ element }} | |
| 21404 </template> | |
| 21405 </div> | |
| 21406 </div> | |
| 21407 </template> | |
| 21408 </div> | |
| 21409 </template> | |
| 21410 </curly-block> | |
| 21411 </template> | |
| 21412 </template> | |
| 21413 </polymer-element> | |
| 21414 | |
| 21415 | |
| 21416 | |
| 21417 <polymer-element name="observatory-application" extends="observatory-element"> | |
| 21418 <!-- This element explicitly manages its child elements --> | |
| 21419 </polymer-element> | |
| 21420 | |
| 21421 | |
| 21422 | 4235 |
| 21423 | 4236 |
| 21424 | 4237 |
| 21425 | 4238 |
| 21426 | 4239 |
| 21427 | 4240 |
| 21428 | 4241 |
| 21429 | 4242 |
| 4243 <polymer-element name="sliding-checkbox"> |
| 4244 <template> |
| 4245 <style> |
| 4246 .switch { |
| 4247 position: relative; |
| 4248 width: 121px; |
| 4249 -webkit-user-select: none; |
| 4250 -moz-user-select: none; |
| 4251 -ms-user-select: none; |
| 4252 } |
| 4253 .hide { |
| 4254 display: none; |
| 4255 } |
| 4256 .label { |
| 4257 display: block; |
| 4258 overflow: hidden; |
| 4259 cursor: pointer; |
| 4260 border: 2px solid #999999; |
| 4261 border-radius: 15px; |
| 4262 } |
| 4263 .content { |
| 4264 width: 200%; |
| 4265 margin-left: -100%; |
| 4266 -moz-transition: margin 0.3s ease-in 0s; |
| 4267 -webkit-transition: margin 0.3s ease-in 0s; |
| 4268 -o-transition: margin 0.3s ease-in 0s; |
| 4269 transition: margin 0.3s ease-in 0s; |
| 4270 } |
| 4271 .content:before, .content:after { |
| 4272 float: left; |
| 4273 width: 50%; |
| 4274 height: 30px; |
| 4275 padding: 0; |
| 4276 line-height: 30px; |
| 4277 color: white; |
| 4278 font: 400 14px 'Montserrat', sans-serif; |
| 4279 -moz-box-sizing: border-box; |
| 4280 -webkit-box-sizing: border-box; |
| 4281 box-sizing: border-box; |
| 4282 } |
| 4283 .content:before { |
| 4284 content: {{ checkedText }}; |
| 4285 padding-left: 10px; |
| 4286 background-color: #0489C3; |
| 4287 } |
| 4288 .content:after { |
| 4289 content: {{ uncheckedText }}; |
| 4290 padding-right: 10px; |
| 4291 background-color: #EEEEEE; |
| 4292 color: #999999; |
| 4293 text-align: right; |
| 4294 } |
| 4295 .dot { |
| 4296 width: 14px; |
| 4297 margin: 8px; |
| 4298 background: #FFFFFF; |
| 4299 border: 2px solid #999999; |
| 4300 border-radius: 15px; |
| 4301 position: absolute; |
| 4302 top: 0; |
| 4303 bottom: 0; |
| 4304 right: 87px; |
| 4305 -moz-transition: all 0.3s ease-in 0s; |
| 4306 -webkit-transition: all 0.3s ease-in 0s; |
| 4307 -o-transition: all 0.3s ease-in 0s; |
| 4308 transition: all 0.3s ease-in 0s; |
| 4309 } |
| 4310 :checked + .label .content { |
| 4311 margin-left: 0; |
| 4312 } |
| 4313 :checked + .label .dot { |
| 4314 right: 0px; |
| 4315 } |
| 4316 </style> |
| 4317 <div class="switch"> |
| 4318 <input type="checkbox" class="hide" id="slide-switch" on-change="{{ change
}}"> |
| 4319 <label class="label" for="slide-switch"> |
| 4320 <div class="content"></div> |
| 4321 <div class="dot"></div> |
| 4322 </label> |
| 4323 </div> |
| 4324 </template> |
| 4325 </polymer-element> |
| 4326 |
| 4327 |
| 4328 |
| 4329 <polymer-element name="isolate-profile" extends="observatory-element"> |
| 4330 <template> |
| 4331 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4332 <nav-bar> |
| 4333 <top-nav-menu></top-nav-menu> |
| 4334 <isolate-nav-menu isolate="{{ profile.isolate }}"></isolate-nav-menu> |
| 4335 <nav-menu link="{{ profile.isolate.relativeLink('profile') }}" anchor="cpu
profile" last="{{ true }}"></nav-menu> |
| 4336 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4337 <nav-control></nav-control> |
| 4338 </nav-bar> |
| 4339 <style> |
| 4340 .table { |
| 4341 border-collapse: collapse!important; |
| 4342 width: 100%; |
| 4343 margin-bottom: 20px |
| 4344 } |
| 4345 .table thead > tr > th, |
| 4346 .table tbody > tr > th, |
| 4347 .table tfoot > tr > th, |
| 4348 .table thead > tr > td, |
| 4349 .table tbody > tr > td, |
| 4350 .table tfoot > tr > td { |
| 4351 padding: 8px; |
| 4352 vertical-align: top; |
| 4353 } |
| 4354 .table thead > tr > th { |
| 4355 vertical-align: bottom; |
| 4356 text-align: left; |
| 4357 border-bottom:2px solid #ddd; |
| 4358 } |
| 4359 |
| 4360 tr:hover > td { |
| 4361 background-color: #FFF3E3; |
| 4362 } |
| 4363 .rowColor0 { |
| 4364 background-color: #FFE9CC; |
| 4365 } |
| 4366 .rowColor1 { |
| 4367 background-color: #FFDEB2; |
| 4368 } |
| 4369 .rowColor2 { |
| 4370 background-color: #FFD399; |
| 4371 } |
| 4372 .rowColor3 { |
| 4373 background-color: #FFC87F; |
| 4374 } |
| 4375 .rowColor4 { |
| 4376 background-color: #FFBD66; |
| 4377 } |
| 4378 .rowColor5 { |
| 4379 background-color: #FFB24C; |
| 4380 } |
| 4381 .rowColor6 { |
| 4382 background-color: #FFA733; |
| 4383 } |
| 4384 .rowColor7 { |
| 4385 background-color: #FF9C19; |
| 4386 } |
| 4387 .rowColor8 { |
| 4388 background-color: #FF9100; |
| 4389 } |
| 4390 |
| 4391 .tooltip { |
| 4392 display: block; |
| 4393 position: absolute; |
| 4394 visibility: hidden; |
| 4395 opacity: 0; |
| 4396 transition: visibility 0s linear 0.5s; |
| 4397 transition: opacity .4s ease-in-out; |
| 4398 } |
| 4399 |
| 4400 tr:hover .tooltip { |
| 4401 display: block; |
| 4402 position: absolute; |
| 4403 top: 100%; |
| 4404 right: 100%; |
| 4405 visibility: visible; |
| 4406 z-index: 999; |
| 4407 width: 400px; |
| 4408 color: #ffffff; |
| 4409 background-color: #0489c3; |
| 4410 border-top-right-radius: 8px; |
| 4411 border-top-left-radius: 8px; |
| 4412 border-bottom-right-radius: 8px; |
| 4413 border-bottom-left-radius: 8px; |
| 4414 transition: visibility 0s linear 0.5s; |
| 4415 transition: opacity .4s ease-in-out; |
| 4416 opacity: 1; |
| 4417 } |
| 4418 |
| 4419 .white { |
| 4420 color: #ffffff; |
| 4421 } |
| 4422 |
| 4423 </style> |
| 4424 <div class="content"> |
| 4425 <h1>Sampled CPU profile</h1> |
| 4426 <div class="memberList"> |
| 4427 <div class="memberItem"> |
| 4428 <div class="memberName">Timestamp</div> |
| 4429 <div class="memberValue">{{ refreshTime }}</div> |
| 4430 </div> |
| 4431 <div class="memberItem"> |
| 4432 <div class="memberName">Time span</div> |
| 4433 <div class="memberValue">{{ timeSpan }}</div> |
| 4434 </div> |
| 4435 <div class="memberItem"> |
| 4436 <div class="memberName">Sample count</div> |
| 4437 <div class="memberValue">{{ sampleCount }}</div> |
| 4438 </div> |
| 4439 <div class="memberItem"> |
| 4440 <div class="memberName">Sample rate</div> |
| 4441 <div class="memberValue">{{ sampleRate }} Hz</div> |
| 4442 </div> |
| 4443 <div class="memberItem"> |
| 4444 <div class="memberName">Sample depth</div> |
| 4445 <div class="memberValue">{{ sampleDepth }} stack frames</div> |
| 4446 </div> |
| 4447 <div class="memberItem"> |
| 4448 <div class="memberName">Display cutoff</div> |
| 4449 <div class="memberValue">{{ displayCutoff }}</div> |
| 4450 </div> |
| 4451 <div class="memberItem"> |
| 4452 <div class="memberName">Tags</div> |
| 4453 <div class="memberValue"> |
| 4454 <select value="{{tagSelector}}"> |
| 4455 <option value="uv">User > VM</option> |
| 4456 <option value="u">User</option> |
| 4457 <option value="vu">VM > User</option> |
| 4458 <option value="v">VM</option> |
| 4459 <option value="hide">None</option> |
| 4460 </select> |
| 4461 </div> |
| 4462 </div> |
| 4463 </div> |
| 4464 <hr> |
| 4465 <table id="tableTree" class="table"> |
| 4466 <thead> |
| 4467 <tr> |
| 4468 <th>Method</th> |
| 4469 <th>Self</th> |
| 4470 </tr> |
| 4471 </thead> |
| 4472 <tbody> |
| 4473 <tr template="" repeat="{{row in tree.rows }}" style="{{}}"> |
| 4474 <td on-click="{{toggleExpanded}}" class="{{ coloring(row) }}" style=
"{{ padding(row) }}"> |
| 4475 <span id="expand" style="{{ row.expanderStyle }}">{{ row.expander
}}</span> |
| 4476 <div style="position: relative;display: inline"> |
| 4477 {{row.columns[0]}} |
| 4478 </div> |
| 4479 <code-ref ref="{{ row.code }}"></code-ref> |
| 4480 </td> |
| 4481 <td class="{{ coloring(row) }}" style="position: relative"> |
| 4482 {{row.columns[1]}} |
| 4483 <div class="tooltip"> |
| 4484 <div class="memberList"> |
| 4485 <div class="memberItem"> |
| 4486 <div class="memberName white">Kind</div> |
| 4487 <div class="memberValue white">{{ row.tipKind }}</div> |
| 4488 </div> |
| 4489 <div class="memberItem"> |
| 4490 <div class="memberName white">Percent of Parent</div> |
| 4491 <div class="memberValue white">{{ row.tipParent }}</div> |
| 4492 </div> |
| 4493 <div class="memberItem"> |
| 4494 <div class="memberName white">Sample Count</div> |
| 4495 <div class="memberValue white">{{ row.tipTicks }} ({{ row.tip
Exclusive }})</div> |
| 4496 </div> |
| 4497 <div class="memberItem"> |
| 4498 <div class="memberName white">Approximate Execution Time</div
> |
| 4499 <div class="memberValue white">{{ row.tipTime }}</div> |
| 4500 </div> |
| 4501 </div> |
| 4502 </div> |
| 4503 </td> |
| 4504 </tr> |
| 4505 </tbody> |
| 4506 </table> |
| 4507 </div> |
| 4508 </template> |
| 4509 </polymer-element> |
| 4510 |
| 4511 |
| 4512 |
| 4513 |
| 4514 |
| 4515 |
| 4516 |
| 4517 |
| 4518 |
| 4519 |
| 4520 <polymer-element name="script-view" extends="observatory-element"> |
| 4521 <template> |
| 4522 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.css"
> |
| 4523 <nav-bar> |
| 4524 <top-nav-menu></top-nav-menu> |
| 4525 <isolate-nav-menu isolate="{{ script.isolate }}"> |
| 4526 </isolate-nav-menu> |
| 4527 <nav-menu link="{{ script.owningLibrary.link }}" anchor="{{ script.owningLib
rary.name }}"></nav-menu> |
| 4528 <nav-menu link="{{ script.link }}" anchor="{{ script.name }}" last="{{ true
}}"></nav-menu> |
| 4529 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></nav
-refresh> |
| 4530 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4531 <nav-control></nav-control> |
| 4532 </nav-bar> |
| 4533 |
| 4534 <template if="{{ args['pos'] == null }}"> |
| 4535 <script-inset id="scriptInset" script="{{ script }}"> |
| 4536 <h1>script {{ script.name }}</h1> |
| 4537 </script-inset> |
| 4538 </template> |
| 4539 |
| 4540 <template if="{{ args['pos'] != null }}"> |
| 4541 <script-inset id="scriptInset" script="{{ script }}" currentpos="{{ args['po
s'] | parseInt }}"> |
| 4542 <h1>script {{ script.name }}</h1> |
| 4543 </script-inset> |
| 4544 </template> |
| 4545 |
| 4546 </template> |
| 4547 </polymer-element> |
| 4548 |
| 4549 |
| 4550 |
| 4551 |
| 4552 |
| 4553 |
| 4554 |
| 4555 |
| 4556 |
| 4557 |
| 4558 |
| 4559 |
| 4560 |
| 4561 <polymer-element name="vm-view" extends="observatory-element"> |
| 4562 <template> |
| 4563 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4564 |
| 4565 <nav-bar> |
| 4566 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 4567 <nav-refresh callback="{{ refresh }}"></nav-refresh> |
| 4568 <nav-control></nav-control> |
| 4569 </nav-bar> |
| 4570 |
| 4571 <div class="content"> |
| 4572 <h1>VM</h1> |
| 4573 <div class="memberList"> |
| 4574 <div class="memberItem"> |
| 4575 <div class="memberName">version</div> |
| 4576 <div class="memberValue">{{ vm.version }}</div> |
| 4577 </div> |
| 4578 <div class="memberItem"> |
| 4579 <div class="memberName">uptime</div> |
| 4580 <div class="memberValue">{{ vm.uptime | formatTime }}</div> |
| 4581 </div> |
| 4582 <div class="memberItem"> |
| 4583 <div class="memberName">type checks enabled</div> |
| 4584 <div class="memberValue">{{ vm.typeChecksEnabled }}</div> |
| 4585 </div> |
| 4586 <div class="memberItem"> |
| 4587 <div class="memberName">asserts enabled</div> |
| 4588 <div class="memberValue">{{ vm.assertsEnabled }}</div> |
| 4589 </div> |
| 4590 <div class="memberItem"> |
| 4591 <div class="memberName">pid</div> |
| 4592 <div class="memberValue">{{ vm.pid }}</div> |
| 4593 </div> |
| 4594 <div class="memberItem"> |
| 4595 <div class="memberName">refreshed at</div> |
| 4596 <div class="memberValue">{{ vm.lastUpdate }}</div> |
| 4597 </div> |
| 4598 <br> |
| 4599 <div class="memberItem"> |
| 4600 <div class="memberValue"> |
| 4601 See <a on-click="{{ goto }}" _href="{{ gotoLink('/flags') }}">flags<
/a> |
| 4602 </div> |
| 4603 </div> |
| 4604 </div> |
| 4605 </div> |
| 4606 |
| 4607 <br> |
| 4608 <hr> |
| 4609 |
| 4610 <ul class="list-group"> |
| 4611 <template repeat="{{ isolate in vm.isolates }}"> |
| 4612 <li class="list-group-item"> |
| 4613 <isolate-summary isolate="{{ isolate }}"></isolate-summary> |
| 4614 </li> |
| 4615 <hr> |
| 4616 </template> |
| 4617 </ul> |
| 4618 </template> |
| 4619 </polymer-element> |
| 4620 |
| 4621 |
| 4622 <polymer-element name="service-view" extends="observatory-element"> |
| 4623 <!-- This element explicitly manages the child elements to avoid setting |
| 4624 an observable property on the old element to an invalid type. --> |
| 4625 </polymer-element> |
| 4626 |
| 4627 <polymer-element name="trace-view" extends="observatory-element"> |
| 4628 <template> |
| 4629 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4630 |
| 4631 <template if="{{ tracer != null }}"> |
| 4632 <div class="memberList"> |
| 4633 <template repeat="{{ event in tracer.events }}"> |
| 4634 <div class="memberItem"> |
| 4635 <div class="memberSmall"> |
| 4636 {{ event.timeStamp }} |
| 4637 </div> |
| 4638 <div class="memberSmall"> |
| 4639 {{ event.message }} |
| 4640 <template if="{{ event.map != null }}"> |
| 4641 <br> |
| 4642 <map-viewer map="{{ event.map }}"></map-viewer> |
| 4643 </template> |
| 4644 </div> |
| 4645 </div> |
| 4646 </template> |
| 4647 </div> |
| 4648 <br> |
| 4649 <br> |
| 4650 <br> |
| 4651 </template> |
| 4652 </template> |
| 4653 </polymer-element> |
| 4654 |
| 4655 <polymer-element name="map-viewer" extends="observatory-element"> |
| 4656 <template> |
| 4657 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4658 |
| 4659 <template if="{{ map.length > 0 }}"> |
| 4660 <curly-block callback="{{ expander() }}"> |
| 4661 <template if="{{ expand }}"> |
| 4662 <div class="memberList"> |
| 4663 <template repeat="{{ key in map.keys }}"> |
| 4664 <div class="memberItem"> |
| 4665 <div class="memberSmall">{{ key }}</div> |
| 4666 <div class="memberSmall">:</div> |
| 4667 <div class="memberSmall"> |
| 4668 <template if="{{ isMap(map[key]) }}"> |
| 4669 <map-viewer map="{{ map[key] }}"></map-viewer> |
| 4670 </template> |
| 4671 <template if="{{ isList(map[key]) }}"> |
| 4672 <list-viewer list="{{ map[key] }}"></list-viewer> |
| 4673 </template> |
| 4674 <template if="{{ !isMap(map[key]) && !isList(map[key])
}}"> |
| 4675 {{ map[key] }} |
| 4676 </template> |
| 4677 </div> |
| 4678 </div> |
| 4679 </template> |
| 4680 </div> |
| 4681 </template> |
| 4682 </curly-block> |
| 4683 </template> |
| 4684 </template> |
| 4685 </polymer-element> |
| 4686 |
| 4687 <polymer-element name="list-viewer" extends="observatory-element"> |
| 4688 <template> |
| 4689 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 4690 |
| 4691 <template if="{{ list.length > 0 }}"> |
| 4692 <curly-block callback="{{ expander() }}"> |
| 4693 <template if="{{ expand }}"> |
| 4694 <div class="memberList"> |
| 4695 <template repeat="{{ element in list }}"> |
| 4696 <div class="memberItem"> |
| 4697 <div class="memberSmall"> |
| 4698 <template if="{{ isMap(element) }}"> |
| 4699 <map-viewer map="{{ element }}"></map-viewer> |
| 4700 </template> |
| 4701 <template if="{{ isList(element) }}"> |
| 4702 <list-viewer list="{{ element }}"></list-viewer> |
| 4703 </template> |
| 4704 <template if="{{ !isMap(element) && !isList(element) }
}"> |
| 4705 {{ element }} |
| 4706 </template> |
| 4707 </div> |
| 4708 </div> |
| 4709 </template> |
| 4710 </div> |
| 4711 </template> |
| 4712 </curly-block> |
| 4713 </template> |
| 4714 </template> |
| 4715 </polymer-element> |
| 4716 |
| 4717 |
| 4718 |
| 4719 <polymer-element name="observatory-application" extends="observatory-element"> |
| 4720 <!-- This element explicitly manages its child elements --> |
| 4721 </polymer-element> |
| 4722 |
| 4723 |
| 4724 |
| 4725 |
| 4726 |
| 4727 |
| 4728 |
| 4729 |
| 4730 |
| 4731 |
| 21430 | 4732 |
| 21431 <polymer-element name="service-exception-view" extends="observatory-element"> | 4733 <polymer-element name="service-exception-view" extends="observatory-element"> |
| 21432 <template> | 4734 <template> |
| 21433 <style>/* Global styles */ | 4735 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 21434 * { | |
| 21435 margin: 0; | |
| 21436 padding: 0; | |
| 21437 font: 400 14px 'Montserrat', sans-serif; | |
| 21438 color: #333; | |
| 21439 box-sizing: border-box; | |
| 21440 } | |
| 21441 | |
| 21442 .content { | |
| 21443 padding-left: 10%; | |
| 21444 font: 400 14px 'Montserrat', sans-serif; | |
| 21445 } | |
| 21446 | |
| 21447 .content-centered { | |
| 21448 padding-left: 10%; | |
| 21449 padding-right: 10%; | |
| 21450 font: 400 14px 'Montserrat', sans-serif; | |
| 21451 } | |
| 21452 | |
| 21453 .content-centered-big { | |
| 21454 padding-left: 5%; | |
| 21455 padding-right: 5%; | |
| 21456 font: 400 14px 'Montserrat', sans-serif; | |
| 21457 } | |
| 21458 | |
| 21459 h1 { | |
| 21460 font: 400 18px 'Montserrat', sans-serif; | |
| 21461 } | |
| 21462 | |
| 21463 .memberList { | |
| 21464 display: table; | |
| 21465 } | |
| 21466 | |
| 21467 .memberItem { | |
| 21468 display: table-row; | |
| 21469 } | |
| 21470 | |
| 21471 .memberName, .memberValue { | |
| 21472 display: table-cell; | |
| 21473 vertical-align: top; | |
| 21474 padding: 3px 0 3px 1em; | |
| 21475 font: 400 14px 'Montserrat', sans-serif; | |
| 21476 } | |
| 21477 | |
| 21478 .memberSmall { | |
| 21479 display: table-cell; | |
| 21480 vertical-align: top; | |
| 21481 padding: 3px 0 3px 1em; | |
| 21482 font: 400 12px 'Montserrat', sans-serif; | |
| 21483 } | |
| 21484 | |
| 21485 .monospace { | |
| 21486 font-family: consolas, courier, monospace; | |
| 21487 font-size: 1em; | |
| 21488 line-height: 1.2em; | |
| 21489 white-space: nowrap; | |
| 21490 } | |
| 21491 | |
| 21492 a { | |
| 21493 color: #0489c3; | |
| 21494 text-decoration: none; | |
| 21495 } | |
| 21496 | |
| 21497 a:hover { | |
| 21498 text-decoration: underline; | |
| 21499 } | |
| 21500 | |
| 21501 em { | |
| 21502 color: inherit; | |
| 21503 font-style: italic; | |
| 21504 } | |
| 21505 | |
| 21506 b { | |
| 21507 color: inherit; | |
| 21508 font-weight: bold; | |
| 21509 } | |
| 21510 | |
| 21511 hr { | |
| 21512 margin-top: 20px; | |
| 21513 margin-bottom: 20px; | |
| 21514 border: 0; | |
| 21515 border-top: 1px solid #eee; | |
| 21516 height: 0; | |
| 21517 box-sizing: content-box; | |
| 21518 } | |
| 21519 | |
| 21520 .list-group { | |
| 21521 padding-left: 0; | |
| 21522 margin-bottom: 20px; | |
| 21523 } | |
| 21524 | |
| 21525 .list-group-item { | |
| 21526 position: relative; | |
| 21527 display: block; | |
| 21528 padding: 10px 15px; | |
| 21529 margin-bottom: -1px; | |
| 21530 background-color: #fff; | |
| 21531 } | |
| 21532 | |
| 21533 .list-group-item:first-child { | |
| 21534 /* rounded top corners */ | |
| 21535 border-top-right-radius:4px; | |
| 21536 border-top-left-radius:4px; | |
| 21537 } | |
| 21538 | |
| 21539 .list-group-item:last-child { | |
| 21540 margin-bottom: 0; | |
| 21541 /* rounded bottom corners */ | |
| 21542 border-bottom-right-radius: 4px; | |
| 21543 border-bottom-left-radius:4px; | |
| 21544 } | |
| 21545 | |
| 21546 /* Flex row container */ | |
| 21547 .flex-row { | |
| 21548 display: flex; | |
| 21549 flex-direction: row; | |
| 21550 } | |
| 21551 | |
| 21552 /* Flex column container */ | |
| 21553 .flex-column { | |
| 21554 display: flex; | |
| 21555 flex-direction: column; | |
| 21556 } | |
| 21557 | |
| 21558 .flex-item-fit { | |
| 21559 flex-grow: 1; | |
| 21560 flex-shrink: 1; | |
| 21561 flex-basis: auto; | |
| 21562 } | |
| 21563 | |
| 21564 .flex-item-no-shrink { | |
| 21565 flex-grow: 0; | |
| 21566 flex-shrink: 0; | |
| 21567 flex-basis: auto; | |
| 21568 } | |
| 21569 | |
| 21570 .flex-item-fill { | |
| 21571 flex-grow: 0; | |
| 21572 flex-shrink: 1; /* shrink when pressured */ | |
| 21573 flex-basis: 100%; /* try and take 100% */ | |
| 21574 } | |
| 21575 | |
| 21576 .flex-item-fixed-1-12 { | |
| 21577 flex-grow: 0; | |
| 21578 flex-shrink: 0; | |
| 21579 flex-basis: 8.3%; | |
| 21580 } | |
| 21581 | |
| 21582 .flex-item-fixed-2-12 { | |
| 21583 flex-grow: 0; | |
| 21584 flex-shrink: 0; | |
| 21585 flex-basis: 16.6%; | |
| 21586 } | |
| 21587 | |
| 21588 .flex-item-fixed-4-12 { | |
| 21589 flex-grow: 0; | |
| 21590 flex-shrink: 0; | |
| 21591 flex-basis: 33.3333%; | |
| 21592 } | |
| 21593 | |
| 21594 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 21595 flex-grow: 0; | |
| 21596 flex-shrink: 0; | |
| 21597 flex-basis: 50%; | |
| 21598 } | |
| 21599 | |
| 21600 .flex-item-fixed-8-12 { | |
| 21601 flex-grow: 0; | |
| 21602 flex-shrink: 0; | |
| 21603 flex-basis: 66.6666%; | |
| 21604 } | |
| 21605 | |
| 21606 .flex-item-fixed-9-12 { | |
| 21607 flex-grow: 0; | |
| 21608 flex-shrink: 0; | |
| 21609 flex-basis: 75%; | |
| 21610 } | |
| 21611 | |
| 21612 | |
| 21613 .flex-item-fixed-12-12 { | |
| 21614 flex-grow: 0; | |
| 21615 flex-shrink: 0; | |
| 21616 flex-basis: 100%; | |
| 21617 } | |
| 21618 | |
| 21619 .flex-item-10-percent { | |
| 21620 flex-grow: 0; | |
| 21621 flex-shrink: 0; | |
| 21622 flex-basis: 10%; | |
| 21623 } | |
| 21624 | |
| 21625 .flex-item-15-percent { | |
| 21626 flex-grow: 0; | |
| 21627 flex-shrink: 0; | |
| 21628 flex-basis: 15%; | |
| 21629 } | |
| 21630 | |
| 21631 .flex-item-20-percent { | |
| 21632 flex-grow: 0; | |
| 21633 flex-shrink: 0; | |
| 21634 flex-basis: 20%; | |
| 21635 } | |
| 21636 | |
| 21637 .flex-item-30-percent { | |
| 21638 flex-grow: 0; | |
| 21639 flex-shrink: 0; | |
| 21640 flex-basis: 30%; | |
| 21641 } | |
| 21642 | |
| 21643 .flex-item-40-percent { | |
| 21644 flex-grow: 0; | |
| 21645 flex-shrink: 0; | |
| 21646 flex-basis: 40%; | |
| 21647 } | |
| 21648 | |
| 21649 .flex-item-50-percent { | |
| 21650 flex-grow: 0; | |
| 21651 flex-shrink: 0; | |
| 21652 flex-basis: 50%; | |
| 21653 } | |
| 21654 | |
| 21655 .flex-item-60-percent { | |
| 21656 flex-grow: 0; | |
| 21657 flex-shrink: 0; | |
| 21658 flex-basis: 60%; | |
| 21659 } | |
| 21660 | |
| 21661 .flex-item-70-percent { | |
| 21662 flex-grow: 0; | |
| 21663 flex-shrink: 0; | |
| 21664 flex-basis: 70%; | |
| 21665 } | |
| 21666 | |
| 21667 .flex-item-80-percent { | |
| 21668 flex-grow: 0; | |
| 21669 flex-shrink: 0; | |
| 21670 flex-basis: 80%; | |
| 21671 } | |
| 21672 | |
| 21673 .well { | |
| 21674 min-height: 20px; | |
| 21675 padding: 19px; | |
| 21676 margin-bottom: 20px; | |
| 21677 background-color: #f5f5f5; | |
| 21678 border: 1px solid #e3e3e3; | |
| 21679 border-radius: 4px; | |
| 21680 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 21681 } | |
| 21682 | |
| 21683 .break-wrap { | |
| 21684 word-wrap: break-word; | |
| 21685 } | |
| 21686 </style> | |
| 21687 <nav-bar> | 4736 <nav-bar> |
| 21688 <top-nav-menu last="{{ true }}"></top-nav-menu> | 4737 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 21689 <nav-control></nav-control> | 4738 <nav-control></nav-control> |
| 21690 </nav-bar> | 4739 </nav-bar> |
| 21691 <div class="content-centered"> | 4740 <div class="content-centered"> |
| 21692 <h1>{{ exception.kind }}</h1> | 4741 <h1>{{ exception.kind }}</h1> |
| 21693 <br> | 4742 <br> |
| 21694 <div class="well">{{ exception.message }}</div> | 4743 <div class="well">{{ exception.message }}</div> |
| 21695 <template if="{{ exception.response != '' }}"> | 4744 <template if="{{ exception.response != '' }}"> |
| 21696 <div class="well">{{ exception.response }}</div> | 4745 <div class="well">{{ exception.response }}</div> |
| 21697 </template> | 4746 </template> |
| 21698 </div> | 4747 </div> |
| 21699 </template> | 4748 </template> |
| 21700 </polymer-element> | 4749 </polymer-element> |
| 21701 | 4750 |
| 21702 | 4751 |
| 21703 | 4752 |
| 21704 | 4753 |
| 21705 | 4754 |
| 21706 | 4755 |
| 21707 | 4756 |
| 21708 <polymer-element name="service-error-view" extends="observatory-element"> | 4757 <polymer-element name="service-error-view" extends="observatory-element"> |
| 21709 <template> | 4758 <template> |
| 21710 <style>/* Global styles */ | 4759 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 21711 * { | |
| 21712 margin: 0; | |
| 21713 padding: 0; | |
| 21714 font: 400 14px 'Montserrat', sans-serif; | |
| 21715 color: #333; | |
| 21716 box-sizing: border-box; | |
| 21717 } | |
| 21718 | |
| 21719 .content { | |
| 21720 padding-left: 10%; | |
| 21721 font: 400 14px 'Montserrat', sans-serif; | |
| 21722 } | |
| 21723 | |
| 21724 .content-centered { | |
| 21725 padding-left: 10%; | |
| 21726 padding-right: 10%; | |
| 21727 font: 400 14px 'Montserrat', sans-serif; | |
| 21728 } | |
| 21729 | |
| 21730 .content-centered-big { | |
| 21731 padding-left: 5%; | |
| 21732 padding-right: 5%; | |
| 21733 font: 400 14px 'Montserrat', sans-serif; | |
| 21734 } | |
| 21735 | |
| 21736 h1 { | |
| 21737 font: 400 18px 'Montserrat', sans-serif; | |
| 21738 } | |
| 21739 | |
| 21740 .memberList { | |
| 21741 display: table; | |
| 21742 } | |
| 21743 | |
| 21744 .memberItem { | |
| 21745 display: table-row; | |
| 21746 } | |
| 21747 | |
| 21748 .memberName, .memberValue { | |
| 21749 display: table-cell; | |
| 21750 vertical-align: top; | |
| 21751 padding: 3px 0 3px 1em; | |
| 21752 font: 400 14px 'Montserrat', sans-serif; | |
| 21753 } | |
| 21754 | |
| 21755 .memberSmall { | |
| 21756 display: table-cell; | |
| 21757 vertical-align: top; | |
| 21758 padding: 3px 0 3px 1em; | |
| 21759 font: 400 12px 'Montserrat', sans-serif; | |
| 21760 } | |
| 21761 | |
| 21762 .monospace { | |
| 21763 font-family: consolas, courier, monospace; | |
| 21764 font-size: 1em; | |
| 21765 line-height: 1.2em; | |
| 21766 white-space: nowrap; | |
| 21767 } | |
| 21768 | |
| 21769 a { | |
| 21770 color: #0489c3; | |
| 21771 text-decoration: none; | |
| 21772 } | |
| 21773 | |
| 21774 a:hover { | |
| 21775 text-decoration: underline; | |
| 21776 } | |
| 21777 | |
| 21778 em { | |
| 21779 color: inherit; | |
| 21780 font-style: italic; | |
| 21781 } | |
| 21782 | |
| 21783 b { | |
| 21784 color: inherit; | |
| 21785 font-weight: bold; | |
| 21786 } | |
| 21787 | |
| 21788 hr { | |
| 21789 margin-top: 20px; | |
| 21790 margin-bottom: 20px; | |
| 21791 border: 0; | |
| 21792 border-top: 1px solid #eee; | |
| 21793 height: 0; | |
| 21794 box-sizing: content-box; | |
| 21795 } | |
| 21796 | |
| 21797 .list-group { | |
| 21798 padding-left: 0; | |
| 21799 margin-bottom: 20px; | |
| 21800 } | |
| 21801 | |
| 21802 .list-group-item { | |
| 21803 position: relative; | |
| 21804 display: block; | |
| 21805 padding: 10px 15px; | |
| 21806 margin-bottom: -1px; | |
| 21807 background-color: #fff; | |
| 21808 } | |
| 21809 | |
| 21810 .list-group-item:first-child { | |
| 21811 /* rounded top corners */ | |
| 21812 border-top-right-radius:4px; | |
| 21813 border-top-left-radius:4px; | |
| 21814 } | |
| 21815 | |
| 21816 .list-group-item:last-child { | |
| 21817 margin-bottom: 0; | |
| 21818 /* rounded bottom corners */ | |
| 21819 border-bottom-right-radius: 4px; | |
| 21820 border-bottom-left-radius:4px; | |
| 21821 } | |
| 21822 | |
| 21823 /* Flex row container */ | |
| 21824 .flex-row { | |
| 21825 display: flex; | |
| 21826 flex-direction: row; | |
| 21827 } | |
| 21828 | |
| 21829 /* Flex column container */ | |
| 21830 .flex-column { | |
| 21831 display: flex; | |
| 21832 flex-direction: column; | |
| 21833 } | |
| 21834 | |
| 21835 .flex-item-fit { | |
| 21836 flex-grow: 1; | |
| 21837 flex-shrink: 1; | |
| 21838 flex-basis: auto; | |
| 21839 } | |
| 21840 | |
| 21841 .flex-item-no-shrink { | |
| 21842 flex-grow: 0; | |
| 21843 flex-shrink: 0; | |
| 21844 flex-basis: auto; | |
| 21845 } | |
| 21846 | |
| 21847 .flex-item-fill { | |
| 21848 flex-grow: 0; | |
| 21849 flex-shrink: 1; /* shrink when pressured */ | |
| 21850 flex-basis: 100%; /* try and take 100% */ | |
| 21851 } | |
| 21852 | |
| 21853 .flex-item-fixed-1-12 { | |
| 21854 flex-grow: 0; | |
| 21855 flex-shrink: 0; | |
| 21856 flex-basis: 8.3%; | |
| 21857 } | |
| 21858 | |
| 21859 .flex-item-fixed-2-12 { | |
| 21860 flex-grow: 0; | |
| 21861 flex-shrink: 0; | |
| 21862 flex-basis: 16.6%; | |
| 21863 } | |
| 21864 | |
| 21865 .flex-item-fixed-4-12 { | |
| 21866 flex-grow: 0; | |
| 21867 flex-shrink: 0; | |
| 21868 flex-basis: 33.3333%; | |
| 21869 } | |
| 21870 | |
| 21871 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 21872 flex-grow: 0; | |
| 21873 flex-shrink: 0; | |
| 21874 flex-basis: 50%; | |
| 21875 } | |
| 21876 | |
| 21877 .flex-item-fixed-8-12 { | |
| 21878 flex-grow: 0; | |
| 21879 flex-shrink: 0; | |
| 21880 flex-basis: 66.6666%; | |
| 21881 } | |
| 21882 | |
| 21883 .flex-item-fixed-9-12 { | |
| 21884 flex-grow: 0; | |
| 21885 flex-shrink: 0; | |
| 21886 flex-basis: 75%; | |
| 21887 } | |
| 21888 | |
| 21889 | |
| 21890 .flex-item-fixed-12-12 { | |
| 21891 flex-grow: 0; | |
| 21892 flex-shrink: 0; | |
| 21893 flex-basis: 100%; | |
| 21894 } | |
| 21895 | |
| 21896 .flex-item-10-percent { | |
| 21897 flex-grow: 0; | |
| 21898 flex-shrink: 0; | |
| 21899 flex-basis: 10%; | |
| 21900 } | |
| 21901 | |
| 21902 .flex-item-15-percent { | |
| 21903 flex-grow: 0; | |
| 21904 flex-shrink: 0; | |
| 21905 flex-basis: 15%; | |
| 21906 } | |
| 21907 | |
| 21908 .flex-item-20-percent { | |
| 21909 flex-grow: 0; | |
| 21910 flex-shrink: 0; | |
| 21911 flex-basis: 20%; | |
| 21912 } | |
| 21913 | |
| 21914 .flex-item-30-percent { | |
| 21915 flex-grow: 0; | |
| 21916 flex-shrink: 0; | |
| 21917 flex-basis: 30%; | |
| 21918 } | |
| 21919 | |
| 21920 .flex-item-40-percent { | |
| 21921 flex-grow: 0; | |
| 21922 flex-shrink: 0; | |
| 21923 flex-basis: 40%; | |
| 21924 } | |
| 21925 | |
| 21926 .flex-item-50-percent { | |
| 21927 flex-grow: 0; | |
| 21928 flex-shrink: 0; | |
| 21929 flex-basis: 50%; | |
| 21930 } | |
| 21931 | |
| 21932 .flex-item-60-percent { | |
| 21933 flex-grow: 0; | |
| 21934 flex-shrink: 0; | |
| 21935 flex-basis: 60%; | |
| 21936 } | |
| 21937 | |
| 21938 .flex-item-70-percent { | |
| 21939 flex-grow: 0; | |
| 21940 flex-shrink: 0; | |
| 21941 flex-basis: 70%; | |
| 21942 } | |
| 21943 | |
| 21944 .flex-item-80-percent { | |
| 21945 flex-grow: 0; | |
| 21946 flex-shrink: 0; | |
| 21947 flex-basis: 80%; | |
| 21948 } | |
| 21949 | |
| 21950 .well { | |
| 21951 min-height: 20px; | |
| 21952 padding: 19px; | |
| 21953 margin-bottom: 20px; | |
| 21954 background-color: #f5f5f5; | |
| 21955 border: 1px solid #e3e3e3; | |
| 21956 border-radius: 4px; | |
| 21957 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 21958 } | |
| 21959 | |
| 21960 .break-wrap { | |
| 21961 word-wrap: break-word; | |
| 21962 } | |
| 21963 </style> | |
| 21964 <nav-bar> | 4760 <nav-bar> |
| 21965 <top-nav-menu last="{{ true }}"></top-nav-menu> | 4761 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 21966 <nav-control></nav-control> | 4762 <nav-control></nav-control> |
| 21967 </nav-bar> | 4763 </nav-bar> |
| 21968 <div class="content-centered"> | 4764 <div class="content-centered"> |
| 21969 <h1>{{ error.kind }}</h1> | 4765 <h1>{{ error.kind }}</h1> |
| 21970 <br> | 4766 <br> |
| 21971 <div class="well">{{ error.message }}</div> | 4767 <div class="well">{{ error.message }}</div> |
| 21972 </div> | 4768 </div> |
| 21973 </template> | 4769 </template> |
| (...skipping 10 matching lines...) Expand all Loading... |
| 21984 <style> | 4780 <style> |
| 21985 .delete-button { | 4781 .delete-button { |
| 21986 padding: 4px; | 4782 padding: 4px; |
| 21987 background: transparent; | 4783 background: transparent; |
| 21988 border: none !important; | 4784 border: none !important; |
| 21989 } | 4785 } |
| 21990 .delete-button:hover { | 4786 .delete-button:hover { |
| 21991 background: #ff0000; | 4787 background: #ff0000; |
| 21992 } | 4788 } |
| 21993 </style> | 4789 </style> |
| 21994 <style>/* Global styles */ | 4790 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 21995 * { | |
| 21996 margin: 0; | |
| 21997 padding: 0; | |
| 21998 font: 400 14px 'Montserrat', sans-serif; | |
| 21999 color: #333; | |
| 22000 box-sizing: border-box; | |
| 22001 } | |
| 22002 | |
| 22003 .content { | |
| 22004 padding-left: 10%; | |
| 22005 font: 400 14px 'Montserrat', sans-serif; | |
| 22006 } | |
| 22007 | |
| 22008 .content-centered { | |
| 22009 padding-left: 10%; | |
| 22010 padding-right: 10%; | |
| 22011 font: 400 14px 'Montserrat', sans-serif; | |
| 22012 } | |
| 22013 | |
| 22014 .content-centered-big { | |
| 22015 padding-left: 5%; | |
| 22016 padding-right: 5%; | |
| 22017 font: 400 14px 'Montserrat', sans-serif; | |
| 22018 } | |
| 22019 | |
| 22020 h1 { | |
| 22021 font: 400 18px 'Montserrat', sans-serif; | |
| 22022 } | |
| 22023 | |
| 22024 .memberList { | |
| 22025 display: table; | |
| 22026 } | |
| 22027 | |
| 22028 .memberItem { | |
| 22029 display: table-row; | |
| 22030 } | |
| 22031 | |
| 22032 .memberName, .memberValue { | |
| 22033 display: table-cell; | |
| 22034 vertical-align: top; | |
| 22035 padding: 3px 0 3px 1em; | |
| 22036 font: 400 14px 'Montserrat', sans-serif; | |
| 22037 } | |
| 22038 | |
| 22039 .memberSmall { | |
| 22040 display: table-cell; | |
| 22041 vertical-align: top; | |
| 22042 padding: 3px 0 3px 1em; | |
| 22043 font: 400 12px 'Montserrat', sans-serif; | |
| 22044 } | |
| 22045 | |
| 22046 .monospace { | |
| 22047 font-family: consolas, courier, monospace; | |
| 22048 font-size: 1em; | |
| 22049 line-height: 1.2em; | |
| 22050 white-space: nowrap; | |
| 22051 } | |
| 22052 | |
| 22053 a { | |
| 22054 color: #0489c3; | |
| 22055 text-decoration: none; | |
| 22056 } | |
| 22057 | |
| 22058 a:hover { | |
| 22059 text-decoration: underline; | |
| 22060 } | |
| 22061 | |
| 22062 em { | |
| 22063 color: inherit; | |
| 22064 font-style: italic; | |
| 22065 } | |
| 22066 | |
| 22067 b { | |
| 22068 color: inherit; | |
| 22069 font-weight: bold; | |
| 22070 } | |
| 22071 | |
| 22072 hr { | |
| 22073 margin-top: 20px; | |
| 22074 margin-bottom: 20px; | |
| 22075 border: 0; | |
| 22076 border-top: 1px solid #eee; | |
| 22077 height: 0; | |
| 22078 box-sizing: content-box; | |
| 22079 } | |
| 22080 | |
| 22081 .list-group { | |
| 22082 padding-left: 0; | |
| 22083 margin-bottom: 20px; | |
| 22084 } | |
| 22085 | |
| 22086 .list-group-item { | |
| 22087 position: relative; | |
| 22088 display: block; | |
| 22089 padding: 10px 15px; | |
| 22090 margin-bottom: -1px; | |
| 22091 background-color: #fff; | |
| 22092 } | |
| 22093 | |
| 22094 .list-group-item:first-child { | |
| 22095 /* rounded top corners */ | |
| 22096 border-top-right-radius:4px; | |
| 22097 border-top-left-radius:4px; | |
| 22098 } | |
| 22099 | |
| 22100 .list-group-item:last-child { | |
| 22101 margin-bottom: 0; | |
| 22102 /* rounded bottom corners */ | |
| 22103 border-bottom-right-radius: 4px; | |
| 22104 border-bottom-left-radius:4px; | |
| 22105 } | |
| 22106 | |
| 22107 /* Flex row container */ | |
| 22108 .flex-row { | |
| 22109 display: flex; | |
| 22110 flex-direction: row; | |
| 22111 } | |
| 22112 | |
| 22113 /* Flex column container */ | |
| 22114 .flex-column { | |
| 22115 display: flex; | |
| 22116 flex-direction: column; | |
| 22117 } | |
| 22118 | |
| 22119 .flex-item-fit { | |
| 22120 flex-grow: 1; | |
| 22121 flex-shrink: 1; | |
| 22122 flex-basis: auto; | |
| 22123 } | |
| 22124 | |
| 22125 .flex-item-no-shrink { | |
| 22126 flex-grow: 0; | |
| 22127 flex-shrink: 0; | |
| 22128 flex-basis: auto; | |
| 22129 } | |
| 22130 | |
| 22131 .flex-item-fill { | |
| 22132 flex-grow: 0; | |
| 22133 flex-shrink: 1; /* shrink when pressured */ | |
| 22134 flex-basis: 100%; /* try and take 100% */ | |
| 22135 } | |
| 22136 | |
| 22137 .flex-item-fixed-1-12 { | |
| 22138 flex-grow: 0; | |
| 22139 flex-shrink: 0; | |
| 22140 flex-basis: 8.3%; | |
| 22141 } | |
| 22142 | |
| 22143 .flex-item-fixed-2-12 { | |
| 22144 flex-grow: 0; | |
| 22145 flex-shrink: 0; | |
| 22146 flex-basis: 16.6%; | |
| 22147 } | |
| 22148 | |
| 22149 .flex-item-fixed-4-12 { | |
| 22150 flex-grow: 0; | |
| 22151 flex-shrink: 0; | |
| 22152 flex-basis: 33.3333%; | |
| 22153 } | |
| 22154 | |
| 22155 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 22156 flex-grow: 0; | |
| 22157 flex-shrink: 0; | |
| 22158 flex-basis: 50%; | |
| 22159 } | |
| 22160 | |
| 22161 .flex-item-fixed-8-12 { | |
| 22162 flex-grow: 0; | |
| 22163 flex-shrink: 0; | |
| 22164 flex-basis: 66.6666%; | |
| 22165 } | |
| 22166 | |
| 22167 .flex-item-fixed-9-12 { | |
| 22168 flex-grow: 0; | |
| 22169 flex-shrink: 0; | |
| 22170 flex-basis: 75%; | |
| 22171 } | |
| 22172 | |
| 22173 | |
| 22174 .flex-item-fixed-12-12 { | |
| 22175 flex-grow: 0; | |
| 22176 flex-shrink: 0; | |
| 22177 flex-basis: 100%; | |
| 22178 } | |
| 22179 | |
| 22180 .flex-item-10-percent { | |
| 22181 flex-grow: 0; | |
| 22182 flex-shrink: 0; | |
| 22183 flex-basis: 10%; | |
| 22184 } | |
| 22185 | |
| 22186 .flex-item-15-percent { | |
| 22187 flex-grow: 0; | |
| 22188 flex-shrink: 0; | |
| 22189 flex-basis: 15%; | |
| 22190 } | |
| 22191 | |
| 22192 .flex-item-20-percent { | |
| 22193 flex-grow: 0; | |
| 22194 flex-shrink: 0; | |
| 22195 flex-basis: 20%; | |
| 22196 } | |
| 22197 | |
| 22198 .flex-item-30-percent { | |
| 22199 flex-grow: 0; | |
| 22200 flex-shrink: 0; | |
| 22201 flex-basis: 30%; | |
| 22202 } | |
| 22203 | |
| 22204 .flex-item-40-percent { | |
| 22205 flex-grow: 0; | |
| 22206 flex-shrink: 0; | |
| 22207 flex-basis: 40%; | |
| 22208 } | |
| 22209 | |
| 22210 .flex-item-50-percent { | |
| 22211 flex-grow: 0; | |
| 22212 flex-shrink: 0; | |
| 22213 flex-basis: 50%; | |
| 22214 } | |
| 22215 | |
| 22216 .flex-item-60-percent { | |
| 22217 flex-grow: 0; | |
| 22218 flex-shrink: 0; | |
| 22219 flex-basis: 60%; | |
| 22220 } | |
| 22221 | |
| 22222 .flex-item-70-percent { | |
| 22223 flex-grow: 0; | |
| 22224 flex-shrink: 0; | |
| 22225 flex-basis: 70%; | |
| 22226 } | |
| 22227 | |
| 22228 .flex-item-80-percent { | |
| 22229 flex-grow: 0; | |
| 22230 flex-shrink: 0; | |
| 22231 flex-basis: 80%; | |
| 22232 } | |
| 22233 | |
| 22234 .well { | |
| 22235 min-height: 20px; | |
| 22236 padding: 19px; | |
| 22237 margin-bottom: 20px; | |
| 22238 background-color: #f5f5f5; | |
| 22239 border: 1px solid #e3e3e3; | |
| 22240 border-radius: 4px; | |
| 22241 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 22242 } | |
| 22243 | |
| 22244 .break-wrap { | |
| 22245 word-wrap: break-word; | |
| 22246 } | |
| 22247 </style> | |
| 22248 <span> | 4791 <span> |
| 22249 <template if="{{ isCurrentTarget }}"> | 4792 <template if="{{ isCurrentTarget }}"> |
| 22250 <a on-click="{{ connectToVm }}" _href="{{ gotoLink('/vm') }}">{{ target.
name }} (Connected)</a> | 4793 <a on-click="{{ connectToVm }}" _href="{{ gotoLink('/vm') }}">{{ target.
name }} (Connected)</a> |
| 22251 </template> | 4794 </template> |
| 22252 <template if="{{ !isCurrentTarget }}"> | 4795 <template if="{{ !isCurrentTarget }}"> |
| 22253 <a on-click="{{ connectToVm }}" _href="{{ gotoLink('/vm') }}">{{ target.
name }}</a> | 4796 <a on-click="{{ connectToVm }}" _href="{{ gotoLink('/vm') }}">{{ target.
name }}</a> |
| 22254 </template> | 4797 </template> |
| 22255 <template if="{{ !isChromeTarget }}"> | 4798 <template if="{{ !isChromeTarget }}"> |
| 22256 <button class="delete-button" on-click="{{ deleteVm }}">✖ Remove</button
> | 4799 <button class="delete-button" on-click="{{ deleteVm }}">✖ Remove</button
> |
| 22257 </template> | 4800 </template> |
| 22258 </span> | 4801 </span> |
| 22259 </template> | 4802 </template> |
| 22260 </polymer-element> | 4803 </polymer-element> |
| 22261 | 4804 |
| 22262 <polymer-element name="vm-connect" extends="observatory-element"> | 4805 <polymer-element name="vm-connect" extends="observatory-element"> |
| 22263 <template> | 4806 <template> |
| 22264 <style>/* Global styles */ | 4807 <link rel="stylesheet" href="packages/observatory/src/elements/css/shared.cs
s"> |
| 22265 * { | |
| 22266 margin: 0; | |
| 22267 padding: 0; | |
| 22268 font: 400 14px 'Montserrat', sans-serif; | |
| 22269 color: #333; | |
| 22270 box-sizing: border-box; | |
| 22271 } | |
| 22272 | |
| 22273 .content { | |
| 22274 padding-left: 10%; | |
| 22275 font: 400 14px 'Montserrat', sans-serif; | |
| 22276 } | |
| 22277 | |
| 22278 .content-centered { | |
| 22279 padding-left: 10%; | |
| 22280 padding-right: 10%; | |
| 22281 font: 400 14px 'Montserrat', sans-serif; | |
| 22282 } | |
| 22283 | |
| 22284 .content-centered-big { | |
| 22285 padding-left: 5%; | |
| 22286 padding-right: 5%; | |
| 22287 font: 400 14px 'Montserrat', sans-serif; | |
| 22288 } | |
| 22289 | |
| 22290 h1 { | |
| 22291 font: 400 18px 'Montserrat', sans-serif; | |
| 22292 } | |
| 22293 | |
| 22294 .memberList { | |
| 22295 display: table; | |
| 22296 } | |
| 22297 | |
| 22298 .memberItem { | |
| 22299 display: table-row; | |
| 22300 } | |
| 22301 | |
| 22302 .memberName, .memberValue { | |
| 22303 display: table-cell; | |
| 22304 vertical-align: top; | |
| 22305 padding: 3px 0 3px 1em; | |
| 22306 font: 400 14px 'Montserrat', sans-serif; | |
| 22307 } | |
| 22308 | |
| 22309 .memberSmall { | |
| 22310 display: table-cell; | |
| 22311 vertical-align: top; | |
| 22312 padding: 3px 0 3px 1em; | |
| 22313 font: 400 12px 'Montserrat', sans-serif; | |
| 22314 } | |
| 22315 | |
| 22316 .monospace { | |
| 22317 font-family: consolas, courier, monospace; | |
| 22318 font-size: 1em; | |
| 22319 line-height: 1.2em; | |
| 22320 white-space: nowrap; | |
| 22321 } | |
| 22322 | |
| 22323 a { | |
| 22324 color: #0489c3; | |
| 22325 text-decoration: none; | |
| 22326 } | |
| 22327 | |
| 22328 a:hover { | |
| 22329 text-decoration: underline; | |
| 22330 } | |
| 22331 | |
| 22332 em { | |
| 22333 color: inherit; | |
| 22334 font-style: italic; | |
| 22335 } | |
| 22336 | |
| 22337 b { | |
| 22338 color: inherit; | |
| 22339 font-weight: bold; | |
| 22340 } | |
| 22341 | |
| 22342 hr { | |
| 22343 margin-top: 20px; | |
| 22344 margin-bottom: 20px; | |
| 22345 border: 0; | |
| 22346 border-top: 1px solid #eee; | |
| 22347 height: 0; | |
| 22348 box-sizing: content-box; | |
| 22349 } | |
| 22350 | |
| 22351 .list-group { | |
| 22352 padding-left: 0; | |
| 22353 margin-bottom: 20px; | |
| 22354 } | |
| 22355 | |
| 22356 .list-group-item { | |
| 22357 position: relative; | |
| 22358 display: block; | |
| 22359 padding: 10px 15px; | |
| 22360 margin-bottom: -1px; | |
| 22361 background-color: #fff; | |
| 22362 } | |
| 22363 | |
| 22364 .list-group-item:first-child { | |
| 22365 /* rounded top corners */ | |
| 22366 border-top-right-radius:4px; | |
| 22367 border-top-left-radius:4px; | |
| 22368 } | |
| 22369 | |
| 22370 .list-group-item:last-child { | |
| 22371 margin-bottom: 0; | |
| 22372 /* rounded bottom corners */ | |
| 22373 border-bottom-right-radius: 4px; | |
| 22374 border-bottom-left-radius:4px; | |
| 22375 } | |
| 22376 | |
| 22377 /* Flex row container */ | |
| 22378 .flex-row { | |
| 22379 display: flex; | |
| 22380 flex-direction: row; | |
| 22381 } | |
| 22382 | |
| 22383 /* Flex column container */ | |
| 22384 .flex-column { | |
| 22385 display: flex; | |
| 22386 flex-direction: column; | |
| 22387 } | |
| 22388 | |
| 22389 .flex-item-fit { | |
| 22390 flex-grow: 1; | |
| 22391 flex-shrink: 1; | |
| 22392 flex-basis: auto; | |
| 22393 } | |
| 22394 | |
| 22395 .flex-item-no-shrink { | |
| 22396 flex-grow: 0; | |
| 22397 flex-shrink: 0; | |
| 22398 flex-basis: auto; | |
| 22399 } | |
| 22400 | |
| 22401 .flex-item-fill { | |
| 22402 flex-grow: 0; | |
| 22403 flex-shrink: 1; /* shrink when pressured */ | |
| 22404 flex-basis: 100%; /* try and take 100% */ | |
| 22405 } | |
| 22406 | |
| 22407 .flex-item-fixed-1-12 { | |
| 22408 flex-grow: 0; | |
| 22409 flex-shrink: 0; | |
| 22410 flex-basis: 8.3%; | |
| 22411 } | |
| 22412 | |
| 22413 .flex-item-fixed-2-12 { | |
| 22414 flex-grow: 0; | |
| 22415 flex-shrink: 0; | |
| 22416 flex-basis: 16.6%; | |
| 22417 } | |
| 22418 | |
| 22419 .flex-item-fixed-4-12 { | |
| 22420 flex-grow: 0; | |
| 22421 flex-shrink: 0; | |
| 22422 flex-basis: 33.3333%; | |
| 22423 } | |
| 22424 | |
| 22425 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 22426 flex-grow: 0; | |
| 22427 flex-shrink: 0; | |
| 22428 flex-basis: 50%; | |
| 22429 } | |
| 22430 | |
| 22431 .flex-item-fixed-8-12 { | |
| 22432 flex-grow: 0; | |
| 22433 flex-shrink: 0; | |
| 22434 flex-basis: 66.6666%; | |
| 22435 } | |
| 22436 | |
| 22437 .flex-item-fixed-9-12 { | |
| 22438 flex-grow: 0; | |
| 22439 flex-shrink: 0; | |
| 22440 flex-basis: 75%; | |
| 22441 } | |
| 22442 | |
| 22443 | |
| 22444 .flex-item-fixed-12-12 { | |
| 22445 flex-grow: 0; | |
| 22446 flex-shrink: 0; | |
| 22447 flex-basis: 100%; | |
| 22448 } | |
| 22449 | |
| 22450 .flex-item-10-percent { | |
| 22451 flex-grow: 0; | |
| 22452 flex-shrink: 0; | |
| 22453 flex-basis: 10%; | |
| 22454 } | |
| 22455 | |
| 22456 .flex-item-15-percent { | |
| 22457 flex-grow: 0; | |
| 22458 flex-shrink: 0; | |
| 22459 flex-basis: 15%; | |
| 22460 } | |
| 22461 | |
| 22462 .flex-item-20-percent { | |
| 22463 flex-grow: 0; | |
| 22464 flex-shrink: 0; | |
| 22465 flex-basis: 20%; | |
| 22466 } | |
| 22467 | |
| 22468 .flex-item-30-percent { | |
| 22469 flex-grow: 0; | |
| 22470 flex-shrink: 0; | |
| 22471 flex-basis: 30%; | |
| 22472 } | |
| 22473 | |
| 22474 .flex-item-40-percent { | |
| 22475 flex-grow: 0; | |
| 22476 flex-shrink: 0; | |
| 22477 flex-basis: 40%; | |
| 22478 } | |
| 22479 | |
| 22480 .flex-item-50-percent { | |
| 22481 flex-grow: 0; | |
| 22482 flex-shrink: 0; | |
| 22483 flex-basis: 50%; | |
| 22484 } | |
| 22485 | |
| 22486 .flex-item-60-percent { | |
| 22487 flex-grow: 0; | |
| 22488 flex-shrink: 0; | |
| 22489 flex-basis: 60%; | |
| 22490 } | |
| 22491 | |
| 22492 .flex-item-70-percent { | |
| 22493 flex-grow: 0; | |
| 22494 flex-shrink: 0; | |
| 22495 flex-basis: 70%; | |
| 22496 } | |
| 22497 | |
| 22498 .flex-item-80-percent { | |
| 22499 flex-grow: 0; | |
| 22500 flex-shrink: 0; | |
| 22501 flex-basis: 80%; | |
| 22502 } | |
| 22503 | |
| 22504 .well { | |
| 22505 min-height: 20px; | |
| 22506 padding: 19px; | |
| 22507 margin-bottom: 20px; | |
| 22508 background-color: #f5f5f5; | |
| 22509 border: 1px solid #e3e3e3; | |
| 22510 border-radius: 4px; | |
| 22511 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 22512 } | |
| 22513 | |
| 22514 .break-wrap { | |
| 22515 word-wrap: break-word; | |
| 22516 } | |
| 22517 </style> | |
| 22518 <style> | 4808 <style> |
| 22519 .textbox { | 4809 .textbox { |
| 22520 width: 20em; | 4810 width: 20em; |
| 22521 font: 400 16px 'Montserrat', sans-serif; | 4811 font: 400 16px 'Montserrat', sans-serif; |
| 22522 } | 4812 } |
| 22523 </style> | 4813 </style> |
| 22524 | 4814 |
| 22525 <nav-bar> | 4815 <nav-bar> |
| 22526 <top-nav-menu last="{{ true }}"></top-nav-menu> | 4816 <top-nav-menu last="{{ true }}"></top-nav-menu> |
| 22527 <nav-control></nav-control> | 4817 <nav-control></nav-control> |
| (...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 22575 </div> | 4865 </div> |
| 22576 </template> | 4866 </template> |
| 22577 </polymer-element> | 4867 </polymer-element> |
| 22578 | 4868 |
| 22579 | 4869 |
| 22580 | 4870 |
| 22581 | 4871 |
| 22582 | 4872 |
| 22583 | 4873 |
| 22584 <polymer-element name="vm-ref" extends="service-ref"> | 4874 <polymer-element name="vm-ref" extends="service-ref"> |
| 22585 <template><style>/* Global styles */ | 4875 <template><link rel="stylesheet" href="packages/observatory/src/elements/css/s
hared.css"> |
| 22586 * { | |
| 22587 margin: 0; | |
| 22588 padding: 0; | |
| 22589 font: 400 14px 'Montserrat', sans-serif; | |
| 22590 color: #333; | |
| 22591 box-sizing: border-box; | |
| 22592 } | |
| 22593 | |
| 22594 .content { | |
| 22595 padding-left: 10%; | |
| 22596 font: 400 14px 'Montserrat', sans-serif; | |
| 22597 } | |
| 22598 | |
| 22599 .content-centered { | |
| 22600 padding-left: 10%; | |
| 22601 padding-right: 10%; | |
| 22602 font: 400 14px 'Montserrat', sans-serif; | |
| 22603 } | |
| 22604 | |
| 22605 .content-centered-big { | |
| 22606 padding-left: 5%; | |
| 22607 padding-right: 5%; | |
| 22608 font: 400 14px 'Montserrat', sans-serif; | |
| 22609 } | |
| 22610 | |
| 22611 h1 { | |
| 22612 font: 400 18px 'Montserrat', sans-serif; | |
| 22613 } | |
| 22614 | |
| 22615 .memberList { | |
| 22616 display: table; | |
| 22617 } | |
| 22618 | |
| 22619 .memberItem { | |
| 22620 display: table-row; | |
| 22621 } | |
| 22622 | |
| 22623 .memberName, .memberValue { | |
| 22624 display: table-cell; | |
| 22625 vertical-align: top; | |
| 22626 padding: 3px 0 3px 1em; | |
| 22627 font: 400 14px 'Montserrat', sans-serif; | |
| 22628 } | |
| 22629 | |
| 22630 .memberSmall { | |
| 22631 display: table-cell; | |
| 22632 vertical-align: top; | |
| 22633 padding: 3px 0 3px 1em; | |
| 22634 font: 400 12px 'Montserrat', sans-serif; | |
| 22635 } | |
| 22636 | |
| 22637 .monospace { | |
| 22638 font-family: consolas, courier, monospace; | |
| 22639 font-size: 1em; | |
| 22640 line-height: 1.2em; | |
| 22641 white-space: nowrap; | |
| 22642 } | |
| 22643 | |
| 22644 a { | |
| 22645 color: #0489c3; | |
| 22646 text-decoration: none; | |
| 22647 } | |
| 22648 | |
| 22649 a:hover { | |
| 22650 text-decoration: underline; | |
| 22651 } | |
| 22652 | |
| 22653 em { | |
| 22654 color: inherit; | |
| 22655 font-style: italic; | |
| 22656 } | |
| 22657 | |
| 22658 b { | |
| 22659 color: inherit; | |
| 22660 font-weight: bold; | |
| 22661 } | |
| 22662 | |
| 22663 hr { | |
| 22664 margin-top: 20px; | |
| 22665 margin-bottom: 20px; | |
| 22666 border: 0; | |
| 22667 border-top: 1px solid #eee; | |
| 22668 height: 0; | |
| 22669 box-sizing: content-box; | |
| 22670 } | |
| 22671 | |
| 22672 .list-group { | |
| 22673 padding-left: 0; | |
| 22674 margin-bottom: 20px; | |
| 22675 } | |
| 22676 | |
| 22677 .list-group-item { | |
| 22678 position: relative; | |
| 22679 display: block; | |
| 22680 padding: 10px 15px; | |
| 22681 margin-bottom: -1px; | |
| 22682 background-color: #fff; | |
| 22683 } | |
| 22684 | |
| 22685 .list-group-item:first-child { | |
| 22686 /* rounded top corners */ | |
| 22687 border-top-right-radius:4px; | |
| 22688 border-top-left-radius:4px; | |
| 22689 } | |
| 22690 | |
| 22691 .list-group-item:last-child { | |
| 22692 margin-bottom: 0; | |
| 22693 /* rounded bottom corners */ | |
| 22694 border-bottom-right-radius: 4px; | |
| 22695 border-bottom-left-radius:4px; | |
| 22696 } | |
| 22697 | |
| 22698 /* Flex row container */ | |
| 22699 .flex-row { | |
| 22700 display: flex; | |
| 22701 flex-direction: row; | |
| 22702 } | |
| 22703 | |
| 22704 /* Flex column container */ | |
| 22705 .flex-column { | |
| 22706 display: flex; | |
| 22707 flex-direction: column; | |
| 22708 } | |
| 22709 | |
| 22710 .flex-item-fit { | |
| 22711 flex-grow: 1; | |
| 22712 flex-shrink: 1; | |
| 22713 flex-basis: auto; | |
| 22714 } | |
| 22715 | |
| 22716 .flex-item-no-shrink { | |
| 22717 flex-grow: 0; | |
| 22718 flex-shrink: 0; | |
| 22719 flex-basis: auto; | |
| 22720 } | |
| 22721 | |
| 22722 .flex-item-fill { | |
| 22723 flex-grow: 0; | |
| 22724 flex-shrink: 1; /* shrink when pressured */ | |
| 22725 flex-basis: 100%; /* try and take 100% */ | |
| 22726 } | |
| 22727 | |
| 22728 .flex-item-fixed-1-12 { | |
| 22729 flex-grow: 0; | |
| 22730 flex-shrink: 0; | |
| 22731 flex-basis: 8.3%; | |
| 22732 } | |
| 22733 | |
| 22734 .flex-item-fixed-2-12 { | |
| 22735 flex-grow: 0; | |
| 22736 flex-shrink: 0; | |
| 22737 flex-basis: 16.6%; | |
| 22738 } | |
| 22739 | |
| 22740 .flex-item-fixed-4-12 { | |
| 22741 flex-grow: 0; | |
| 22742 flex-shrink: 0; | |
| 22743 flex-basis: 33.3333%; | |
| 22744 } | |
| 22745 | |
| 22746 .flex-item-fixed-6-12, .flex-item-50-percent { | |
| 22747 flex-grow: 0; | |
| 22748 flex-shrink: 0; | |
| 22749 flex-basis: 50%; | |
| 22750 } | |
| 22751 | |
| 22752 .flex-item-fixed-8-12 { | |
| 22753 flex-grow: 0; | |
| 22754 flex-shrink: 0; | |
| 22755 flex-basis: 66.6666%; | |
| 22756 } | |
| 22757 | |
| 22758 .flex-item-fixed-9-12 { | |
| 22759 flex-grow: 0; | |
| 22760 flex-shrink: 0; | |
| 22761 flex-basis: 75%; | |
| 22762 } | |
| 22763 | |
| 22764 | |
| 22765 .flex-item-fixed-12-12 { | |
| 22766 flex-grow: 0; | |
| 22767 flex-shrink: 0; | |
| 22768 flex-basis: 100%; | |
| 22769 } | |
| 22770 | |
| 22771 .flex-item-10-percent { | |
| 22772 flex-grow: 0; | |
| 22773 flex-shrink: 0; | |
| 22774 flex-basis: 10%; | |
| 22775 } | |
| 22776 | |
| 22777 .flex-item-15-percent { | |
| 22778 flex-grow: 0; | |
| 22779 flex-shrink: 0; | |
| 22780 flex-basis: 15%; | |
| 22781 } | |
| 22782 | |
| 22783 .flex-item-20-percent { | |
| 22784 flex-grow: 0; | |
| 22785 flex-shrink: 0; | |
| 22786 flex-basis: 20%; | |
| 22787 } | |
| 22788 | |
| 22789 .flex-item-30-percent { | |
| 22790 flex-grow: 0; | |
| 22791 flex-shrink: 0; | |
| 22792 flex-basis: 30%; | |
| 22793 } | |
| 22794 | |
| 22795 .flex-item-40-percent { | |
| 22796 flex-grow: 0; | |
| 22797 flex-shrink: 0; | |
| 22798 flex-basis: 40%; | |
| 22799 } | |
| 22800 | |
| 22801 .flex-item-50-percent { | |
| 22802 flex-grow: 0; | |
| 22803 flex-shrink: 0; | |
| 22804 flex-basis: 50%; | |
| 22805 } | |
| 22806 | |
| 22807 .flex-item-60-percent { | |
| 22808 flex-grow: 0; | |
| 22809 flex-shrink: 0; | |
| 22810 flex-basis: 60%; | |
| 22811 } | |
| 22812 | |
| 22813 .flex-item-70-percent { | |
| 22814 flex-grow: 0; | |
| 22815 flex-shrink: 0; | |
| 22816 flex-basis: 70%; | |
| 22817 } | |
| 22818 | |
| 22819 .flex-item-80-percent { | |
| 22820 flex-grow: 0; | |
| 22821 flex-shrink: 0; | |
| 22822 flex-basis: 80%; | |
| 22823 } | |
| 22824 | |
| 22825 .well { | |
| 22826 min-height: 20px; | |
| 22827 padding: 19px; | |
| 22828 margin-bottom: 20px; | |
| 22829 background-color: #f5f5f5; | |
| 22830 border: 1px solid #e3e3e3; | |
| 22831 border-radius: 4px; | |
| 22832 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); | |
| 22833 } | |
| 22834 | |
| 22835 .break-wrap { | |
| 22836 word-wrap: break-word; | |
| 22837 } | |
| 22838 </style> | |
| 22839 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a> | 4876 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a> |
| 22840 </template> | 4877 </template> |
| 22841 </polymer-element> | 4878 </polymer-element> |
| 22842 | 4879 |
| 22843 | 4880 |
| 22844 | 4881 |
| 22845 | 4882 |
| 22846 </div> | 4883 </div> |
| 22847 <observatory-application></observatory-application> | 4884 <observatory-application></observatory-application> |
| 22848 | 4885 |
| 22849 | 4886 |
| 22850 <script src="index.html_bootstrap.dart.js" async=""></script></body></html> | 4887 <script src="index.html_bootstrap.dart.js" async=""></script></body></html> |
| OLD | NEW |