From: honda Date: Fri, 23 Aug 2019 06:12:09 +0000 (+0900) Subject: wits update X-Git-Url: http://git.osdn.net/view?a=commitdiff_plain;h=HEAD;hp=f118c06c442c9984b3f3ea3e717279c0ff1a62ff;p=vem%2FWITs.git wits update --- diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..a882b68 Binary files /dev/null and b/.DS_Store differ diff --git a/CSS/.DS_Store b/CSS/.DS_Store new file mode 100644 index 0000000..5a06f0d Binary files /dev/null and b/CSS/.DS_Store differ diff --git a/CSS/bootstrap-grid.css b/CSS/bootstrap-grid.css new file mode 100644 index 0000000..a36cd32 --- /dev/null +++ b/CSS/bootstrap-grid.css @@ -0,0 +1,1912 @@ +/*! + * Bootstrap Grid v4.1.3 (https://getbootstrap.com/) + * Copyright 2011-2018 The Bootstrap Authors + * Copyright 2011-2018 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ +@-ms-viewport { + width: device-width; +} + +html { + box-sizing: border-box; + -ms-overflow-style: scrollbar; +} + +*, +*::before, +*::after { + box-sizing: inherit; +} + +.container { + width: 100%; + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; +} + +@media (min-width: 576px) { + .container { + max-width: 540px; + } +} + +@media (min-width: 768px) { + .container { + max-width: 720px; + } +} + +@media (min-width: 992px) { + .container { + max-width: 960px; + } +} + +@media (min-width: 1200px) { + .container { + max-width: 1140px; + } +} + +.container-fluid { + width: 100%; + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; +} + +.row { + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -15px; + margin-left: -15px; +} + +.no-gutters { + margin-right: 0; + margin-left: 0; +} + +.no-gutters > .col, +.no-gutters > [class*="col-"] { + padding-right: 0; + padding-left: 0; +} + +.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, +.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, +.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, +.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, +.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, +.col-xl-auto { + position: relative; + width: 100%; + min-height: 1px; + padding-right: 15px; + padding-left: 15px; +} + +.col { + -ms-flex-preferred-size: 0; + flex-basis: 0; + -ms-flex-positive: 1; + flex-grow: 1; + max-width: 100%; +} + +.col-auto { + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + max-width: none; +} + +.col-1 { + -ms-flex: 0 0 8.333333%; + flex: 0 0 8.333333%; + max-width: 8.333333%; +} + +.col-2 { + -ms-flex: 0 0 16.666667%; + flex: 0 0 16.666667%; + max-width: 16.666667%; +} + +.col-3 { + -ms-flex: 0 0 25%; + flex: 0 0 25%; + max-width: 25%; +} + +.col-4 { + -ms-flex: 0 0 33.333333%; + flex: 0 0 33.333333%; + max-width: 33.333333%; +} + +.col-5 { + -ms-flex: 0 0 41.666667%; + flex: 0 0 41.666667%; + max-width: 41.666667%; +} + +.col-6 { + -ms-flex: 0 0 50%; + flex: 0 0 50%; + max-width: 50%; +} + +.col-7 { + -ms-flex: 0 0 58.333333%; + flex: 0 0 58.333333%; + max-width: 58.333333%; +} + +.col-8 { + -ms-flex: 0 0 66.666667%; + flex: 0 0 66.666667%; + max-width: 66.666667%; +} + +.col-9 { + -ms-flex: 0 0 75%; + flex: 0 0 75%; + max-width: 75%; +} + +.col-10 { + -ms-flex: 0 0 83.333333%; + flex: 0 0 83.333333%; + max-width: 83.333333%; +} + +.col-11 { + -ms-flex: 0 0 91.666667%; + flex: 0 0 91.666667%; + max-width: 91.666667%; +} + +.col-12 { + -ms-flex: 0 0 100%; + flex: 0 0 100%; + max-width: 100%; +} + +.order-first { + -ms-flex-order: -1; + order: -1; +} + +.order-last { + -ms-flex-order: 13; + order: 13; +} + +.order-0 { + -ms-flex-order: 0; + order: 0; +} + +.order-1 { + -ms-flex-order: 1; + order: 1; +} + +.order-2 { + -ms-flex-order: 2; + order: 2; +} + +.order-3 { + -ms-flex-order: 3; + order: 3; +} + +.order-4 { + -ms-flex-order: 4; + order: 4; +} + +.order-5 { + -ms-flex-order: 5; + order: 5; +} + +.order-6 { + -ms-flex-order: 6; + order: 6; +} + +.order-7 { + -ms-flex-order: 7; + order: 7; +} + +.order-8 { + -ms-flex-order: 8; + order: 8; +} + +.order-9 { + -ms-flex-order: 9; + order: 9; +} + +.order-10 { + -ms-flex-order: 10; + order: 10; +} + +.order-11 { + -ms-flex-order: 11; + order: 11; +} + +.order-12 { + -ms-flex-order: 12; + order: 12; +} + +.offset-1 { + margin-left: 8.333333%; +} + +.offset-2 { + margin-left: 16.666667%; +} + +.offset-3 { + margin-left: 25%; +} + +.offset-4 { + margin-left: 33.333333%; +} + +.offset-5 { + margin-left: 41.666667%; +} + +.offset-6 { + margin-left: 50%; +} + +.offset-7 { + margin-left: 58.333333%; +} + +.offset-8 { + margin-left: 66.666667%; +} + +.offset-9 { + margin-left: 75%; +} + +.offset-10 { + margin-left: 83.333333%; +} + +.offset-11 { + margin-left: 91.666667%; +} + +@media (min-width: 576px) { + .col-sm { + -ms-flex-preferred-size: 0; + flex-basis: 0; + -ms-flex-positive: 1; + flex-grow: 1; + max-width: 100%; + } + .col-sm-auto { + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + max-width: none; + } + .col-sm-1 { + -ms-flex: 0 0 8.333333%; + flex: 0 0 8.333333%; + max-width: 8.333333%; + } + .col-sm-2 { + -ms-flex: 0 0 16.666667%; + flex: 0 0 16.666667%; + max-width: 16.666667%; + } + .col-sm-3 { + -ms-flex: 0 0 25%; + flex: 0 0 25%; + max-width: 25%; + } + .col-sm-4 { + -ms-flex: 0 0 33.333333%; + flex: 0 0 33.333333%; + max-width: 33.333333%; + } + .col-sm-5 { + -ms-flex: 0 0 41.666667%; + flex: 0 0 41.666667%; + max-width: 41.666667%; + } + .col-sm-6 { + -ms-flex: 0 0 50%; + flex: 0 0 50%; + max-width: 50%; + } + .col-sm-7 { + -ms-flex: 0 0 58.333333%; + flex: 0 0 58.333333%; + max-width: 58.333333%; + } + .col-sm-8 { + -ms-flex: 0 0 66.666667%; + flex: 0 0 66.666667%; + max-width: 66.666667%; + } + .col-sm-9 { + -ms-flex: 0 0 75%; + flex: 0 0 75%; + max-width: 75%; + } + .col-sm-10 { + -ms-flex: 0 0 83.333333%; + flex: 0 0 83.333333%; + max-width: 83.333333%; + } + .col-sm-11 { + -ms-flex: 0 0 91.666667%; + flex: 0 0 91.666667%; + max-width: 91.666667%; + } + .col-sm-12 { + -ms-flex: 0 0 100%; + flex: 0 0 100%; + max-width: 100%; + } + .order-sm-first { + -ms-flex-order: -1; + order: -1; + } + .order-sm-last { + -ms-flex-order: 13; + order: 13; + } + .order-sm-0 { + -ms-flex-order: 0; + order: 0; + } + .order-sm-1 { + -ms-flex-order: 1; + order: 1; + } + .order-sm-2 { + -ms-flex-order: 2; + order: 2; + } + .order-sm-3 { + -ms-flex-order: 3; + order: 3; + } + .order-sm-4 { + -ms-flex-order: 4; + order: 4; + } + .order-sm-5 { + -ms-flex-order: 5; + order: 5; + } + .order-sm-6 { + -ms-flex-order: 6; + order: 6; + } + .order-sm-7 { + -ms-flex-order: 7; + order: 7; + } + .order-sm-8 { + -ms-flex-order: 8; + order: 8; + } + .order-sm-9 { + -ms-flex-order: 9; + order: 9; + } + .order-sm-10 { + -ms-flex-order: 10; + order: 10; + } + .order-sm-11 { + -ms-flex-order: 11; + order: 11; + } + .order-sm-12 { + -ms-flex-order: 12; + order: 12; + } + .offset-sm-0 { + margin-left: 0; + } + .offset-sm-1 { + margin-left: 8.333333%; + } + .offset-sm-2 { + margin-left: 16.666667%; + } + .offset-sm-3 { + margin-left: 25%; + } + .offset-sm-4 { + margin-left: 33.333333%; + } + .offset-sm-5 { + margin-left: 41.666667%; + } + .offset-sm-6 { + margin-left: 50%; + } + .offset-sm-7 { + margin-left: 58.333333%; + } + .offset-sm-8 { + margin-left: 66.666667%; + } + .offset-sm-9 { + margin-left: 75%; + } + .offset-sm-10 { + margin-left: 83.333333%; + } + .offset-sm-11 { + margin-left: 91.666667%; + } +} + +@media (min-width: 768px) { + .col-md { + -ms-flex-preferred-size: 0; + flex-basis: 0; + -ms-flex-positive: 1; + flex-grow: 1; + max-width: 100%; + } + .col-md-auto { + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + max-width: none; + } + .col-md-1 { + -ms-flex: 0 0 8.333333%; + flex: 0 0 8.333333%; + max-width: 8.333333%; + } + .col-md-2 { + -ms-flex: 0 0 16.666667%; + flex: 0 0 16.666667%; + max-width: 16.666667%; + } + .col-md-3 { + -ms-flex: 0 0 25%; + flex: 0 0 25%; + max-width: 25%; + } + .col-md-4 { + -ms-flex: 0 0 33.333333%; + flex: 0 0 33.333333%; + max-width: 33.333333%; + } + .col-md-5 { + -ms-flex: 0 0 41.666667%; + flex: 0 0 41.666667%; + max-width: 41.666667%; + } + .col-md-6 { + -ms-flex: 0 0 50%; + flex: 0 0 50%; + max-width: 50%; + } + .col-md-7 { + -ms-flex: 0 0 58.333333%; + flex: 0 0 58.333333%; + max-width: 58.333333%; + } + .col-md-8 { + -ms-flex: 0 0 66.666667%; + flex: 0 0 66.666667%; + max-width: 66.666667%; + } + .col-md-9 { + -ms-flex: 0 0 75%; + flex: 0 0 75%; + max-width: 75%; + } + .col-md-10 { + -ms-flex: 0 0 83.333333%; + flex: 0 0 83.333333%; + max-width: 83.333333%; + } + .col-md-11 { + -ms-flex: 0 0 91.666667%; + flex: 0 0 91.666667%; + max-width: 91.666667%; + } + .col-md-12 { + -ms-flex: 0 0 100%; + flex: 0 0 100%; + max-width: 100%; + } + .order-md-first { + -ms-flex-order: -1; + order: -1; + } + .order-md-last { + -ms-flex-order: 13; + order: 13; + } + .order-md-0 { + -ms-flex-order: 0; + order: 0; + } + .order-md-1 { + -ms-flex-order: 1; + order: 1; + } + .order-md-2 { + -ms-flex-order: 2; + order: 2; + } + .order-md-3 { + -ms-flex-order: 3; + order: 3; + } + .order-md-4 { + -ms-flex-order: 4; + order: 4; + } + .order-md-5 { + -ms-flex-order: 5; + order: 5; + } + .order-md-6 { + -ms-flex-order: 6; + order: 6; + } + .order-md-7 { + -ms-flex-order: 7; + order: 7; + } + .order-md-8 { + -ms-flex-order: 8; + order: 8; + } + .order-md-9 { + -ms-flex-order: 9; + order: 9; + } + .order-md-10 { + -ms-flex-order: 10; + order: 10; + } + .order-md-11 { + -ms-flex-order: 11; + order: 11; + } + .order-md-12 { + -ms-flex-order: 12; + order: 12; + } + .offset-md-0 { + margin-left: 0; + } + .offset-md-1 { + margin-left: 8.333333%; + } + .offset-md-2 { + margin-left: 16.666667%; + } + .offset-md-3 { + margin-left: 25%; + } + .offset-md-4 { + margin-left: 33.333333%; + } + .offset-md-5 { + margin-left: 41.666667%; + } + .offset-md-6 { + margin-left: 50%; + } + .offset-md-7 { + margin-left: 58.333333%; + } + .offset-md-8 { + margin-left: 66.666667%; + } + .offset-md-9 { + margin-left: 75%; + } + .offset-md-10 { + margin-left: 83.333333%; + } + .offset-md-11 { + margin-left: 91.666667%; + } +} + +@media (min-width: 992px) { + .col-lg { + -ms-flex-preferred-size: 0; + flex-basis: 0; + -ms-flex-positive: 1; + flex-grow: 1; + max-width: 100%; + } + .col-lg-auto { + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + max-width: none; + } + .col-lg-1 { + -ms-flex: 0 0 8.333333%; + flex: 0 0 8.333333%; + max-width: 8.333333%; + } + .col-lg-2 { + -ms-flex: 0 0 16.666667%; + flex: 0 0 16.666667%; + max-width: 16.666667%; + } + .col-lg-3 { + -ms-flex: 0 0 25%; + flex: 0 0 25%; + max-width: 25%; + } + .col-lg-4 { + -ms-flex: 0 0 33.333333%; + flex: 0 0 33.333333%; + max-width: 33.333333%; + } + .col-lg-5 { + -ms-flex: 0 0 41.666667%; + flex: 0 0 41.666667%; + max-width: 41.666667%; + } + .col-lg-6 { + -ms-flex: 0 0 50%; + flex: 0 0 50%; + max-width: 50%; + } + .col-lg-7 { + -ms-flex: 0 0 58.333333%; + flex: 0 0 58.333333%; + max-width: 58.333333%; + } + .col-lg-8 { + -ms-flex: 0 0 66.666667%; + flex: 0 0 66.666667%; + max-width: 66.666667%; + } + .col-lg-9 { + -ms-flex: 0 0 75%; + flex: 0 0 75%; + max-width: 75%; + } + .col-lg-10 { + -ms-flex: 0 0 83.333333%; + flex: 0 0 83.333333%; + max-width: 83.333333%; + } + .col-lg-11 { + -ms-flex: 0 0 91.666667%; + flex: 0 0 91.666667%; + max-width: 91.666667%; + } + .col-lg-12 { + -ms-flex: 0 0 100%; + flex: 0 0 100%; + max-width: 100%; + } + .order-lg-first { + -ms-flex-order: -1; + order: -1; + } + .order-lg-last { + -ms-flex-order: 13; + order: 13; + } + .order-lg-0 { + -ms-flex-order: 0; + order: 0; + } + .order-lg-1 { + -ms-flex-order: 1; + order: 1; + } + .order-lg-2 { + -ms-flex-order: 2; + order: 2; + } + .order-lg-3 { + -ms-flex-order: 3; + order: 3; + } + .order-lg-4 { + -ms-flex-order: 4; + order: 4; + } + .order-lg-5 { + -ms-flex-order: 5; + order: 5; + } + .order-lg-6 { + -ms-flex-order: 6; + order: 6; + } + .order-lg-7 { + -ms-flex-order: 7; + order: 7; + } + .order-lg-8 { + -ms-flex-order: 8; + order: 8; + } + .order-lg-9 { + -ms-flex-order: 9; + order: 9; + } + .order-lg-10 { + -ms-flex-order: 10; + order: 10; + } + .order-lg-11 { + -ms-flex-order: 11; + order: 11; + } + .order-lg-12 { + -ms-flex-order: 12; + order: 12; + } + .offset-lg-0 { + margin-left: 0; + } + .offset-lg-1 { + margin-left: 8.333333%; + } + .offset-lg-2 { + margin-left: 16.666667%; + } + .offset-lg-3 { + margin-left: 25%; + } + .offset-lg-4 { + margin-left: 33.333333%; + } + .offset-lg-5 { + margin-left: 41.666667%; + } + .offset-lg-6 { + margin-left: 50%; + } + .offset-lg-7 { + margin-left: 58.333333%; + } + .offset-lg-8 { + margin-left: 66.666667%; + } + .offset-lg-9 { + margin-left: 75%; + } + .offset-lg-10 { + margin-left: 83.333333%; + } + .offset-lg-11 { + margin-left: 91.666667%; + } +} + +@media (min-width: 1200px) { + .col-xl { + -ms-flex-preferred-size: 0; + flex-basis: 0; + -ms-flex-positive: 1; + flex-grow: 1; + max-width: 100%; + } + .col-xl-auto { + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + max-width: none; + } + .col-xl-1 { + -ms-flex: 0 0 8.333333%; + flex: 0 0 8.333333%; + max-width: 8.333333%; + } + .col-xl-2 { + -ms-flex: 0 0 16.666667%; + flex: 0 0 16.666667%; + max-width: 16.666667%; + } + .col-xl-3 { + -ms-flex: 0 0 25%; + flex: 0 0 25%; + max-width: 25%; + } + .col-xl-4 { + -ms-flex: 0 0 33.333333%; + flex: 0 0 33.333333%; + max-width: 33.333333%; + } + .col-xl-5 { + -ms-flex: 0 0 41.666667%; + flex: 0 0 41.666667%; + max-width: 41.666667%; + } + .col-xl-6 { + -ms-flex: 0 0 50%; + flex: 0 0 50%; + max-width: 50%; + } + .col-xl-7 { + -ms-flex: 0 0 58.333333%; + flex: 0 0 58.333333%; + max-width: 58.333333%; + } + .col-xl-8 { + -ms-flex: 0 0 66.666667%; + flex: 0 0 66.666667%; + max-width: 66.666667%; + } + .col-xl-9 { + -ms-flex: 0 0 75%; + flex: 0 0 75%; + max-width: 75%; + } + .col-xl-10 { + -ms-flex: 0 0 83.333333%; + flex: 0 0 83.333333%; + max-width: 83.333333%; + } + .col-xl-11 { + -ms-flex: 0 0 91.666667%; + flex: 0 0 91.666667%; + max-width: 91.666667%; + } + .col-xl-12 { + -ms-flex: 0 0 100%; + flex: 0 0 100%; + max-width: 100%; + } + .order-xl-first { + -ms-flex-order: -1; + order: -1; + } + .order-xl-last { + -ms-flex-order: 13; + order: 13; + } + .order-xl-0 { + -ms-flex-order: 0; + order: 0; + } + .order-xl-1 { + -ms-flex-order: 1; + order: 1; + } + .order-xl-2 { + -ms-flex-order: 2; + order: 2; + } + .order-xl-3 { + -ms-flex-order: 3; + order: 3; + } + .order-xl-4 { + -ms-flex-order: 4; + order: 4; + } + .order-xl-5 { + -ms-flex-order: 5; + order: 5; + } + .order-xl-6 { + -ms-flex-order: 6; + order: 6; + } + .order-xl-7 { + -ms-flex-order: 7; + order: 7; + } + .order-xl-8 { + -ms-flex-order: 8; + order: 8; + } + .order-xl-9 { + -ms-flex-order: 9; + order: 9; + } + .order-xl-10 { + -ms-flex-order: 10; + order: 10; + } + .order-xl-11 { + -ms-flex-order: 11; + order: 11; + } + .order-xl-12 { + -ms-flex-order: 12; + order: 12; + } + .offset-xl-0 { + margin-left: 0; + } + .offset-xl-1 { + margin-left: 8.333333%; + } + .offset-xl-2 { + margin-left: 16.666667%; + } + .offset-xl-3 { + margin-left: 25%; + } + .offset-xl-4 { + margin-left: 33.333333%; + } + .offset-xl-5 { + margin-left: 41.666667%; + } + .offset-xl-6 { + margin-left: 50%; + } + .offset-xl-7 { + margin-left: 58.333333%; + } + .offset-xl-8 { + margin-left: 66.666667%; + } + .offset-xl-9 { + margin-left: 75%; + } + .offset-xl-10 { + margin-left: 83.333333%; + } + .offset-xl-11 { + margin-left: 91.666667%; + } +} + +.d-none { + display: none !important; +} + +.d-inline { + display: inline !important; +} + +.d-inline-block { + display: inline-block !important; +} + +.d-block { + display: block !important; +} + +.d-table { + display: table !important; +} + +.d-table-row { + display: table-row !important; +} + +.d-table-cell { + display: table-cell !important; +} + +.d-flex { + display: -ms-flexbox !important; + display: flex !important; +} + +.d-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; +} + +@media (min-width: 576px) { + .d-sm-none { + display: none !important; + } + .d-sm-inline { + display: inline !important; + } + .d-sm-inline-block { + display: inline-block !important; + } + .d-sm-block { + display: block !important; + } + .d-sm-table { + display: table !important; + } + .d-sm-table-row { + display: table-row !important; + } + .d-sm-table-cell { + display: table-cell !important; + } + .d-sm-flex { + display: -ms-flexbox !important; + display: flex !important; + } + .d-sm-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; + } +} + +@media (min-width: 768px) { + .d-md-none { + display: none !important; + } + .d-md-inline { + display: inline !important; + } + .d-md-inline-block { + display: inline-block !important; + } + .d-md-block { + display: block !important; + } + .d-md-table { + display: table !important; + } + .d-md-table-row { + display: table-row !important; + } + .d-md-table-cell { + display: table-cell !important; + } + .d-md-flex { + display: -ms-flexbox !important; + display: flex !important; + } + .d-md-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; + } +} + +@media (min-width: 992px) { + .d-lg-none { + display: none !important; + } + .d-lg-inline { + display: inline !important; + } + .d-lg-inline-block { + display: inline-block !important; + } + .d-lg-block { + display: block !important; + } + .d-lg-table { + display: table !important; + } + .d-lg-table-row { + display: table-row !important; + } + .d-lg-table-cell { + display: table-cell !important; + } + .d-lg-flex { + display: -ms-flexbox !important; + display: flex !important; + } + .d-lg-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; + } +} + +@media (min-width: 1200px) { + .d-xl-none { + display: none !important; + } + .d-xl-inline { + display: inline !important; + } + .d-xl-inline-block { + display: inline-block !important; + } + .d-xl-block { + display: block !important; + } + .d-xl-table { + display: table !important; + } + .d-xl-table-row { + display: table-row !important; + } + .d-xl-table-cell { + display: table-cell !important; + } + .d-xl-flex { + display: -ms-flexbox !important; + display: flex !important; + } + .d-xl-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; + } +} + +@media print { + .d-print-none { + display: none !important; + } + .d-print-inline { + display: inline !important; + } + .d-print-inline-block { + display: inline-block !important; + } + .d-print-block { + display: block !important; + } + .d-print-table { + display: table !important; + } + .d-print-table-row { + display: table-row !important; + } + .d-print-table-cell { + display: table-cell !important; + } + .d-print-flex { + display: -ms-flexbox !important; + display: flex !important; + } + .d-print-inline-flex { + display: -ms-inline-flexbox !important; + display: inline-flex !important; + } +} + +.flex-row { + -ms-flex-direction: row !important; + flex-direction: row !important; +} + +.flex-column { + -ms-flex-direction: column !important; + flex-direction: column !important; +} + +.flex-row-reverse { + -ms-flex-direction: row-reverse !important; + flex-direction: row-reverse !important; +} + +.flex-column-reverse { + -ms-flex-direction: column-reverse !important; + flex-direction: column-reverse !important; +} + +.flex-wrap { + -ms-flex-wrap: wrap !important; + flex-wrap: wrap !important; +} + +.flex-nowrap { + -ms-flex-wrap: nowrap !important; + flex-wrap: nowrap !important; +} + +.flex-wrap-reverse { + -ms-flex-wrap: wrap-reverse !important; + flex-wrap: wrap-reverse !important; +} + +.flex-fill { + -ms-flex: 1 1 auto !important; + flex: 1 1 auto !important; +} + +.flex-grow-0 { + -ms-flex-positive: 0 !important; + flex-grow: 0 !important; +} + +.flex-grow-1 { + -ms-flex-positive: 1 !important; + flex-grow: 1 !important; +} + +.flex-shrink-0 { + -ms-flex-negative: 0 !important; + flex-shrink: 0 !important; +} + +.flex-shrink-1 { + -ms-flex-negative: 1 !important; + flex-shrink: 1 !important; +} + +.justify-content-start { + -ms-flex-pack: start !important; + justify-content: flex-start !important; +} + +.justify-content-end { + -ms-flex-pack: end !important; + justify-content: flex-end !important; +} + +.justify-content-center { + -ms-flex-pack: center !important; + justify-content: center !important; +} + +.justify-content-between { + -ms-flex-pack: justify !important; + justify-content: space-between !important; +} + +.justify-content-around { + -ms-flex-pack: distribute !important; + justify-content: space-around !important; +} + +.align-items-start { + -ms-flex-align: start !important; + align-items: flex-start !important; +} + +.align-items-end { + -ms-flex-align: end !important; + align-items: flex-end !important; +} + +.align-items-center { + -ms-flex-align: center !important; + align-items: center !important; +} + +.align-items-baseline { + -ms-flex-align: baseline !important; + align-items: baseline !important; +} + +.align-items-stretch { + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.align-content-start { + -ms-flex-line-pack: start !important; + align-content: flex-start !important; +} + +.align-content-end { + -ms-flex-line-pack: end !important; + align-content: flex-end !important; +} + +.align-content-center { + -ms-flex-line-pack: center !important; + align-content: center !important; +} + +.align-content-between { + -ms-flex-line-pack: justify !important; + align-content: space-between !important; +} + +.align-content-around { + -ms-flex-line-pack: distribute !important; + align-content: space-around !important; +} + +.align-content-stretch { + -ms-flex-line-pack: stretch !important; + align-content: stretch !important; +} + +.align-self-auto { + -ms-flex-item-align: auto !important; + align-self: auto !important; +} + +.align-self-start { + -ms-flex-item-align: start !important; + align-self: flex-start !important; +} + +.align-self-end { + -ms-flex-item-align: end !important; + align-self: flex-end !important; +} + +.align-self-center { + -ms-flex-item-align: center !important; + align-self: center !important; +} + +.align-self-baseline { + -ms-flex-item-align: baseline !important; + align-self: baseline !important; +} + +.align-self-stretch { + -ms-flex-item-align: stretch !important; + align-self: stretch !important; +} + +@media (min-width: 576px) { + .flex-sm-row { + -ms-flex-direction: row !important; + flex-direction: row !important; + } + .flex-sm-column { + -ms-flex-direction: column !important; + flex-direction: column !important; + } + .flex-sm-row-reverse { + -ms-flex-direction: row-reverse !important; + flex-direction: row-reverse !important; + } + .flex-sm-column-reverse { + -ms-flex-direction: column-reverse !important; + flex-direction: column-reverse !important; + } + .flex-sm-wrap { + -ms-flex-wrap: wrap !important; + flex-wrap: wrap !important; + } + .flex-sm-nowrap { + -ms-flex-wrap: nowrap !important; + flex-wrap: nowrap !important; + } + .flex-sm-wrap-reverse { + -ms-flex-wrap: wrap-reverse !important; + flex-wrap: wrap-reverse !important; + } + .flex-sm-fill { + -ms-flex: 1 1 auto !important; + flex: 1 1 auto !important; + } + .flex-sm-grow-0 { + -ms-flex-positive: 0 !important; + flex-grow: 0 !important; + } + .flex-sm-grow-1 { + -ms-flex-positive: 1 !important; + flex-grow: 1 !important; + } + .flex-sm-shrink-0 { + -ms-flex-negative: 0 !important; + flex-shrink: 0 !important; + } + .flex-sm-shrink-1 { + -ms-flex-negative: 1 !important; + flex-shrink: 1 !important; + } + .justify-content-sm-start { + -ms-flex-pack: start !important; + justify-content: flex-start !important; + } + .justify-content-sm-end { + -ms-flex-pack: end !important; + justify-content: flex-end !important; + } + .justify-content-sm-center { + -ms-flex-pack: center !important; + justify-content: center !important; + } + .justify-content-sm-between { + -ms-flex-pack: justify !important; + justify-content: space-between !important; + } + .justify-content-sm-around { + -ms-flex-pack: distribute !important; + justify-content: space-around !important; + } + .align-items-sm-start { + -ms-flex-align: start !important; + align-items: flex-start !important; + } + .align-items-sm-end { + -ms-flex-align: end !important; + align-items: flex-end !important; + } + .align-items-sm-center { + -ms-flex-align: center !important; + align-items: center !important; + } + .align-items-sm-baseline { + -ms-flex-align: baseline !important; + align-items: baseline !important; + } + .align-items-sm-stretch { + -ms-flex-align: stretch !important; + align-items: stretch !important; + } + .align-content-sm-start { + -ms-flex-line-pack: start !important; + align-content: flex-start !important; + } + .align-content-sm-end { + -ms-flex-line-pack: end !important; + align-content: flex-end !important; + } + .align-content-sm-center { + -ms-flex-line-pack: center !important; + align-content: center !important; + } + .align-content-sm-between { + -ms-flex-line-pack: justify !important; + align-content: space-between !important; + } + .align-content-sm-around { + -ms-flex-line-pack: distribute !important; + align-content: space-around !important; + } + .align-content-sm-stretch { + -ms-flex-line-pack: stretch !important; + align-content: stretch !important; + } + .align-self-sm-auto { + -ms-flex-item-align: auto !important; + align-self: auto !important; + } + .align-self-sm-start { + -ms-flex-item-align: start !important; + align-self: flex-start !important; + } + .align-self-sm-end { + -ms-flex-item-align: end !important; + align-self: flex-end !important; + } + .align-self-sm-center { + -ms-flex-item-align: center !important; + align-self: center !important; + } + .align-self-sm-baseline { + -ms-flex-item-align: baseline !important; + align-self: baseline !important; + } + .align-self-sm-stretch { + -ms-flex-item-align: stretch !important; + align-self: stretch !important; + } +} + +@media (min-width: 768px) { + .flex-md-row { + -ms-flex-direction: row !important; + flex-direction: row !important; + } + .flex-md-column { + -ms-flex-direction: column !important; + flex-direction: column !important; + } + .flex-md-row-reverse { + -ms-flex-direction: row-reverse !important; + flex-direction: row-reverse !important; + } + .flex-md-column-reverse { + -ms-flex-direction: column-reverse !important; + flex-direction: column-reverse !important; + } + .flex-md-wrap { + -ms-flex-wrap: wrap !important; + flex-wrap: wrap !important; + } + .flex-md-nowrap { + -ms-flex-wrap: nowrap !important; + flex-wrap: nowrap !important; + } + .flex-md-wrap-reverse { + -ms-flex-wrap: wrap-reverse !important; + flex-wrap: wrap-reverse !important; + } + .flex-md-fill { + -ms-flex: 1 1 auto !important; + flex: 1 1 auto !important; + } + .flex-md-grow-0 { + -ms-flex-positive: 0 !important; + flex-grow: 0 !important; + } + .flex-md-grow-1 { + -ms-flex-positive: 1 !important; + flex-grow: 1 !important; + } + .flex-md-shrink-0 { + -ms-flex-negative: 0 !important; + flex-shrink: 0 !important; + } + .flex-md-shrink-1 { + -ms-flex-negative: 1 !important; + flex-shrink: 1 !important; + } + .justify-content-md-start { + -ms-flex-pack: start !important; + justify-content: flex-start !important; + } + .justify-content-md-end { + -ms-flex-pack: end !important; + justify-content: flex-end !important; + } + .justify-content-md-center { + -ms-flex-pack: center !important; + justify-content: center !important; + } + .justify-content-md-between { + -ms-flex-pack: justify !important; + justify-content: space-between !important; + } + .justify-content-md-around { + -ms-flex-pack: distribute !important; + justify-content: space-around !important; + } + .align-items-md-start { + -ms-flex-align: start !important; + align-items: flex-start !important; + } + .align-items-md-end { + -ms-flex-align: end !important; + align-items: flex-end !important; + } + .align-items-md-center { + -ms-flex-align: center !important; + align-items: center !important; + } + .align-items-md-baseline { + -ms-flex-align: baseline !important; + align-items: baseline !important; + } + .align-items-md-stretch { + -ms-flex-align: stretch !important; + align-items: stretch !important; + } + .align-content-md-start { + -ms-flex-line-pack: start !important; + align-content: flex-start !important; + } + .align-content-md-end { + -ms-flex-line-pack: end !important; + align-content: flex-end !important; + } + .align-content-md-center { + -ms-flex-line-pack: center !important; + align-content: center !important; + } + .align-content-md-between { + -ms-flex-line-pack: justify !important; + align-content: space-between !important; + } + .align-content-md-around { + -ms-flex-line-pack: distribute !important; + align-content: space-around !important; + } + .align-content-md-stretch { + -ms-flex-line-pack: stretch !important; + align-content: stretch !important; + } + .align-self-md-auto { + -ms-flex-item-align: auto !important; + align-self: auto !important; + } + .align-self-md-start { + -ms-flex-item-align: start !important; + align-self: flex-start !important; + } + .align-self-md-end { + -ms-flex-item-align: end !important; + align-self: flex-end !important; + } + .align-self-md-center { + -ms-flex-item-align: center !important; + align-self: center !important; + } + .align-self-md-baseline { + -ms-flex-item-align: baseline !important; + align-self: baseline !important; + } + .align-self-md-stretch { + -ms-flex-item-align: stretch !important; + align-self: stretch !important; + } +} + +@media (min-width: 992px) { + .flex-lg-row { + -ms-flex-direction: row !important; + flex-direction: row !important; + } + .flex-lg-column { + -ms-flex-direction: column !important; + flex-direction: column !important; + } + .flex-lg-row-reverse { + -ms-flex-direction: row-reverse !important; + flex-direction: row-reverse !important; + } + .flex-lg-column-reverse { + -ms-flex-direction: column-reverse !important; + flex-direction: column-reverse !important; + } + .flex-lg-wrap { + -ms-flex-wrap: wrap !important; + flex-wrap: wrap !important; + } + .flex-lg-nowrap { + -ms-flex-wrap: nowrap !important; + flex-wrap: nowrap !important; + } + .flex-lg-wrap-reverse { + -ms-flex-wrap: wrap-reverse !important; + flex-wrap: wrap-reverse !important; + } + .flex-lg-fill { + -ms-flex: 1 1 auto !important; + flex: 1 1 auto !important; + } + .flex-lg-grow-0 { + -ms-flex-positive: 0 !important; + flex-grow: 0 !important; + } + .flex-lg-grow-1 { + -ms-flex-positive: 1 !important; + flex-grow: 1 !important; + } + .flex-lg-shrink-0 { + -ms-flex-negative: 0 !important; + flex-shrink: 0 !important; + } + .flex-lg-shrink-1 { + -ms-flex-negative: 1 !important; + flex-shrink: 1 !important; + } + .justify-content-lg-start { + -ms-flex-pack: start !important; + justify-content: flex-start !important; + } + .justify-content-lg-end { + -ms-flex-pack: end !important; + justify-content: flex-end !important; + } + .justify-content-lg-center { + -ms-flex-pack: center !important; + justify-content: center !important; + } + .justify-content-lg-between { + -ms-flex-pack: justify !important; + justify-content: space-between !important; + } + .justify-content-lg-around { + -ms-flex-pack: distribute !important; + justify-content: space-around !important; + } + .align-items-lg-start { + -ms-flex-align: start !important; + align-items: flex-start !important; + } + .align-items-lg-end { + -ms-flex-align: end !important; + align-items: flex-end !important; + } + .align-items-lg-center { + -ms-flex-align: center !important; + align-items: center !important; + } + .align-items-lg-baseline { + -ms-flex-align: baseline !important; + align-items: baseline !important; + } + .align-items-lg-stretch { + -ms-flex-align: stretch !important; + align-items: stretch !important; + } + .align-content-lg-start { + -ms-flex-line-pack: start !important; + align-content: flex-start !important; + } + .align-content-lg-end { + -ms-flex-line-pack: end !important; + align-content: flex-end !important; + } + .align-content-lg-center { + -ms-flex-line-pack: center !important; + align-content: center !important; + } + .align-content-lg-between { + -ms-flex-line-pack: justify !important; + align-content: space-between !important; + } + .align-content-lg-around { + -ms-flex-line-pack: distribute !important; + align-content: space-around !important; + } + .align-content-lg-stretch { + -ms-flex-line-pack: stretch !important; + align-content: stretch !important; + } + .align-self-lg-auto { + -ms-flex-item-align: auto !important; + align-self: auto !important; + } + .align-self-lg-start { + -ms-flex-item-align: start !important; + align-self: flex-start !important; + } + .align-self-lg-end { + -ms-flex-item-align: end !important; + align-self: flex-end !important; + } + .align-self-lg-center { + -ms-flex-item-align: center !important; + align-self: center !important; + } + .align-self-lg-baseline { + -ms-flex-item-align: baseline !important; + align-self: baseline !important; + } + .align-self-lg-stretch { + -ms-flex-item-align: stretch !important; + align-self: stretch !important; + } +} + +@media (min-width: 1200px) { + .flex-xl-row { + -ms-flex-direction: row !important; + flex-direction: row !important; + } + .flex-xl-column { + -ms-flex-direction: column !important; + flex-direction: column !important; + } + .flex-xl-row-reverse { + -ms-flex-direction: row-reverse !important; + flex-direction: row-reverse !important; + } + .flex-xl-column-reverse { + -ms-flex-direction: column-reverse !important; + flex-direction: column-reverse !important; + } + .flex-xl-wrap { + -ms-flex-wrap: wrap !important; + flex-wrap: wrap !important; + } + .flex-xl-nowrap { + -ms-flex-wrap: nowrap !important; + flex-wrap: nowrap !important; + } + .flex-xl-wrap-reverse { + -ms-flex-wrap: wrap-reverse !important; + flex-wrap: wrap-reverse !important; + } + .flex-xl-fill { + -ms-flex: 1 1 auto !important; + flex: 1 1 auto !important; + } + .flex-xl-grow-0 { + -ms-flex-positive: 0 !important; + flex-grow: 0 !important; + } + .flex-xl-grow-1 { + -ms-flex-positive: 1 !important; + flex-grow: 1 !important; + } + .flex-xl-shrink-0 { + -ms-flex-negative: 0 !important; + flex-shrink: 0 !important; + } + .flex-xl-shrink-1 { + -ms-flex-negative: 1 !important; + flex-shrink: 1 !important; + } + .justify-content-xl-start { + -ms-flex-pack: start !important; + justify-content: flex-start !important; + } + .justify-content-xl-end { + -ms-flex-pack: end !important; + justify-content: flex-end !important; + } + .justify-content-xl-center { + -ms-flex-pack: center !important; + justify-content: center !important; + } + .justify-content-xl-between { + -ms-flex-pack: justify !important; + justify-content: space-between !important; + } + .justify-content-xl-around { + -ms-flex-pack: distribute !important; + justify-content: space-around !important; + } + .align-items-xl-start { + -ms-flex-align: start !important; + align-items: flex-start !important; + } + .align-items-xl-end { + -ms-flex-align: end !important; + align-items: flex-end !important; + } + .align-items-xl-center { + -ms-flex-align: center !important; + align-items: center !important; + } + .align-items-xl-baseline { + -ms-flex-align: baseline !important; + align-items: baseline !important; + } + .align-items-xl-stretch { + -ms-flex-align: stretch !important; + align-items: stretch !important; + } + .align-content-xl-start { + -ms-flex-line-pack: start !important; + align-content: flex-start !important; + } + .align-content-xl-end { + -ms-flex-line-pack: end !important; + align-content: flex-end !important; + } + .align-content-xl-center { + -ms-flex-line-pack: center !important; + align-content: center !important; + } + .align-content-xl-between { + -ms-flex-line-pack: justify !important; + align-content: space-between !important; + } + .align-content-xl-around { + -ms-flex-line-pack: distribute !important; + align-content: space-around !important; + } + .align-content-xl-stretch { + -ms-flex-line-pack: stretch !important; + align-content: stretch !important; + } + .align-self-xl-auto { + -ms-flex-item-align: auto !important; + align-self: auto !important; + } + .align-self-xl-start { + -ms-flex-item-align: start !important; + align-self: flex-start !important; + } + .align-self-xl-end { + -ms-flex-item-align: end !important; + align-self: flex-end !important; + } + .align-self-xl-center { + -ms-flex-item-align: center !important; + align-self: center !important; + } + .align-self-xl-baseline { + -ms-flex-item-align: baseline !important; + align-self: baseline !important; + } + .align-self-xl-stretch { + -ms-flex-item-align: stretch !important; + align-self: stretch !important; + } +} +/*# sourceMappingURL=bootstrap-grid.css.map */ \ No newline at end of file diff --git a/CSS/clem.css b/CSS/clem.css new file mode 100644 index 0000000..247aa24 --- /dev/null +++ b/CSS/clem.css @@ -0,0 +1,78 @@ + +body{ + background-color: #FAFAFA; + text-align: left; + margin:0px; +} +header{ + background-color: white; + padding: 2em 0 2em 0; +} +main{ + margin-top: 20px; +} +h1{ + +} +h2{ + text-align: left; + margin: 0px; +} +h3{ + text-align: left; + margin: 0px; +} +h4{ + text-align: left; + margin: 0px; +} +h5{ + text-align: left; + margin: 0px; +} +p{ + text-align: left; + margin: 0px; +} +footer{ + background: #EDEDED; + padding: 3em 0 2em 0; + margin-top: 2em; +} +#tbody_thumbnail_files tr:nth-child(odd){ + background-color: #F1F1F1 +} +#tbody_thumbnail_files tr:nth-child(even){ + background-color: #FFFFFF +} +#color_table_tbody tr:nth-child(odd){ + background-color: #F1F1F1 +} +#color_table_tbody tr:nth-child(even){ + background-color: #FFFFFF +} +input[type="number"]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} +canvas{ + flex: inherit; + padding-right: 0; + padding-left: 0; + background-color: white; + position: relative; +} +#canvasblock1{ + max-width:100%; +} +#canvasblock2{ + max-width:100%; +} +#canvasblock3{ + max-width:100%; +} +#blending{ + margin: 10px; +} + + diff --git a/CSS/em_control.css b/CSS/em_control.css new file mode 100644 index 0000000..41aaf60 --- /dev/null +++ b/CSS/em_control.css @@ -0,0 +1,20 @@ +body{ + background-color: #FAFAFA; + text-align: left; + margin:0px; +} +header{ + background-color: white; + padding: 2em 0 2em 0; +} +main{ + margin-top: 20px; +} +footer{ + background: #EDEDED; + padding: 3em 0 2em 0; + margin-top: 2em; +} +#em_canvas{ + background-color: white; +} \ No newline at end of file diff --git a/CSS/get_c.css b/CSS/get_c.css new file mode 100644 index 0000000..5931766 --- /dev/null +++ b/CSS/get_c.css @@ -0,0 +1,35 @@ + +.coordinate_canvas1, +.coordinate_canvas2{ + background-color: white; + border-collapse: collapse; + width: 12em; +} +.coordinate_canvas1 th, +.coordinate_canvas1 td{ + width: 12em; +} + +.coordinate_canvas2 th, +.coordinate_canvas2 td{ + /*table-layout: fixed;*/ + width: 8em; +} +.coordinate_tbody tr:nth-child(odd){ + background-color: #F1F1F1 + } +.coordinate_tbody tr:nth-child(even){ + background-color: #FFFFFF +} +.coordinate_thead{ + background-color: white; + text-align: center; + display: block; +} +.coordinate_tbody{ + display: block; + text-align: center; + height: 512px; + overflow-y: scroll; + overflow-x: scroll; +} diff --git a/CSS/get_coordinate.css b/CSS/get_coordinate.css new file mode 100644 index 0000000..a37d943 --- /dev/null +++ b/CSS/get_coordinate.css @@ -0,0 +1,119 @@ + +body{ + background-color: #FAFAFA; + margin: 0px; + text-align: left; +} + +header{ + background-color: white; + padding: 2em 0 2em 0; +} +main{ + margin-top: 20px; + margin-bottom: 20px; +} +h2{ + text-align: left; + margin: 0px; +} +p{ + text-align: left; + margin: 0px; +} +footer{ + background: #EDEDED; + padding: 3em 0 2em 0; + margin-top: 2em; +} + +input[type="number"]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} + +#coordinate_canvas_block{ + max-width: 100%; +} +#coordinate_canvas{ + flex: inherit; + padding-right: 0; + padding-left: 0; + background-color: white; + position: relative; +} +#manipulation_area{ + +} +#make_list_area{ + margin-top: 5px; +} + +#table_area{ + width: 90%; + margin-right: auto; + margin-left: auto; +} +#table{ + text-align: center; +} +#coordinate_table{ + background-color: white; + border-collapse: collapse; + border-spacing: 0; + margin-right: 0px; + max-height: 15em; +} + +#coordinate_table_thead{ + background-color: white; + text-align: center; + display: block; +} +#coordinate_table_tbody{ + display: block; + text-align: right; + height: 512px; + overflow-y: scroll; +} +#coordinate_table th, +#coordinate_table td{ + table-layout: fixed; +} +#coordinate_table_tbody tr:nth-child(odd){ + background-color: #F1F1F1 +} +#coordinate_table_tbody tr:nth-child(even){ + background-color: #FFFFFF +} +/*column of button*/ +#coordinate_table_tbody td{ + text-align: center; +} + +#coordinate_table td:nth-child(1), +#coordinate_table th:nth-child(1){ + width: 5em; +} + +#coordinate_table td:nth-child(2), +#coordinate_table th:nth-child(2){ + width: 7em; +} + +#coordinate_table td:nth-child(3), +#coordinate_table th:nth-child(3){ + width: 7em; +} + +#coordinate_table td:nth-child(4), +#coordinate_table th:nth-child(4){ + width: 7em; +} + +#coordinate_table td:nth-child(5), +#coordinate_table th:nth-child(5){ + width: 15em; +} +/*******/ + diff --git a/CSS/index.css b/CSS/index.css new file mode 100644 index 0000000..3df038a --- /dev/null +++ b/CSS/index.css @@ -0,0 +1,62 @@ +header{ + text-align: center; + background-color: white; + padding-top: 100px; + padding-bottom: 100px; +} +body{ + background-color: #FAFAFA; + margin: 0px; + text-align: left; +} +main{ + margin-top: 20px; +} +footer{ + background: #EDEDED; + padding: 3em 0 2em 0; + margin-top: 2em; +} +p{ + margin: 0px; +} +h1{ + margin: 0px; +} +h3{ + margin: 0px; +} +h5{ + margin: 0px; +} +a{ + margin: 3px; + text-align: center; + text-decoration: none; + display: block; + font-weight: 800; + font-size: 20px; + color: blue; +} +ul{ + list-style-type: none; +} +li{ + background-color: white; + width: 50%; + border: 1px solid black; + margin-top: inherit; + margin-right: auto; + margin-left: auto; +} +.nodelist_area{ + margin-left: 10px; +} +.nodelist{ + list-style-type: disc; +} +.nodelist li{ + border: none; + margin-left: 0; + width: 100%; +} diff --git a/CSS/input_em.css b/CSS/input_em.css new file mode 100644 index 0000000..debbc13 --- /dev/null +++ b/CSS/input_em.css @@ -0,0 +1,19 @@ +body{ + background-color: #FAFAFA; + text-align: left; + margin:0px; +} +header{ + background-color: white; + padding: 2em 0 2em 0; +} +main{ + margin-top: 20px; + text-align: center; +} + +table{ + + margin-left: auto; + margin-right: auto; +} \ No newline at end of file diff --git a/CSS/tab.css b/CSS/tab.css new file mode 100644 index 0000000..899fc9d --- /dev/null +++ b/CSS/tab.css @@ -0,0 +1,59 @@ +js-tabs ul.tab_menu{ + list-style-type:none; + margin:0px; + /*padding:0px; + */ + } + .js-tabs ul.tab_menu li{ + display: table-cell; + padding-left: auto; + padding-right: auto; + /* + background:#666; + margin:0px; + padding:2px; + */ + } + .js-tabs .tab_menu li a{ + padding: 9px; + padding-right: 50px; + padding-left: 50px; + border: solid 1px black; + } + .js-tabs .tab_menu li a:link, + .js-tabs .tab_menu li a:visited{ + background-color:rgb(228, 228, 228); + color:rgb(0, 0, 0); + } + .js-tabs .tab_menu li a.active:link, + .js-tabs .tab_menu li a.active:visited{ + background-color:rgb(0, 0, 0); + color:rgb(255, 255, 255); + } + .js-tabs .tab_menu li a:hover{ + background-color:rgb(194, 194, 194); + color:rgb(0, 0, 0); + } + .tab_content{ + position:relative; + /*height:200px;*/ + } + /* + .tab_content div.page{ + width:-webkit-fill-available; + height:-webkit-fill-available; + position:absolute; + color:#222; + } + */ + /* + #page1-1{ + background-color:#aaa;; + } + #page1-2{ + background-color:#aaa;; + } + #page1-3{ + background-color:#aaa;; + } + */ \ No newline at end of file diff --git a/JS/.DS_Store b/JS/.DS_Store new file mode 100644 index 0000000..c19b307 Binary files /dev/null and b/JS/.DS_Store differ diff --git a/JS/CLEM.js b/JS/CLEM.js deleted file mode 100644 index 972205c..0000000 --- a/JS/CLEM.js +++ /dev/null @@ -1,306 +0,0 @@ -$(function() { - var canvas = $('#canvasCLEM'); - var ctx = canvas[0].getContext("2d"); - - $('#CLEMimg').on('change', function CLEMmap() { //画像を選択時に呼び出される - - if (window.File) { //FileAPIを未対応ブラウザではアラート - - var files = $('#CLEMimg')[0].files[0]; - var reader = new FileReader(); - var img = new Image(); - - reader.onload = function(evt) { - img.onload = function() { - // 参考 https://qiita.com/PG0721/items/599ba2921b8339700fe3 - var imgAspect = img.width / img.height; - ctx.clearRect(0, 0, 512, 512); - if (imgAspect >= 1) { //画像が横長 - left = 0; - width = ctx.canvas.width; - height = ctx.canvas.height / imgAspect; - to = (ctx.canvas.height - height) / 2; - } else { //画像が縦長 - to = 0; - width = ctx.canvas.width * imgAspect; - height = ctx.canvas.height; - left = (ctx.canvas.width - width) / 2; - } - ctx.drawImage(img, 0, 0, img.width, img.height, left, to, width, height); //画像をアスペクト比を維持して中心に表示 - } - img.src = evt.target.result; - } - reader.readAsDataURL(files); - } else { - window.alert("本ブラウザではFile APIが使えません"); - } - }); //END CLEMmap() - - $('#setClemButton').on('click', function setClem() { - var tbody = document.getElementById("listCoord"); - var rowlen = tbody.rows.length; //行数 - // LM X Y EM X Y Mov Del - //cells 0 1 2 3 4 5 6 7 - - if (rowlen >= 2) { - - var LmVec = new Array(); - var EmVec = new Array(); - var rad = 0; - for (var i = 0; i < (rowlen - 1); i++) { - LmVec[i] = new Object(); - - LmVec[i].x = tbody.rows[i+1].cells[1].innerText - tbody.rows[0].cells[1].innerText; - LmVec[i].y = tbody.rows[i+1].cells[2].innerText - tbody.rows[0].cells[2].innerText; - // alert(LmVec[i].x+" , "+LmVec[i].y); - EmVec[i] = new Object(); - EmVec[i].x = tbody.rows[i+1].cells[4].innerText - tbody.rows[0].cells[4].innerText; - EmVec[i].y = tbody.rows[i+1].cells[5].innerText - tbody.rows[0].cells[5].innerText; - // alert(EmVec[i].x+" , "+EmVec[i].y); - var dist = Math.sqrt(LmVec[i].x * LmVec[i].x + LmVec[i].y * LmVec[i].y) * Math.sqrt(EmVec[i].x * EmVec[i].x + EmVec[i].y * EmVec[i].y); - if (dist == 0) { - alert("座標をセットし直して下さい"); - } else { - var cos = (LmVec[i].x * EmVec[i].x + LmVec[i].y * EmVec[i].y) / dist; - var sin = (LmVec[i].x * EmVec[i].y - LmVec[i].y * EmVec[i].x) / dist; - - //alert("cos:"+cos+" sin:"+sin); - var rad1 = Math.acos(cos); - var rad2 = Math.asin(sin); - - //alert("rad1:"+rad1+" rad2:"+rad2); - if (cos >= 0 && sin >= 0) { //0= 0 && sin < 0) { //-2/pi= 0) { //pi/2= 3) { - var target = { - x: innerTd.parentNode.parentNode.cells[1].innerText - tbody.rows[0].cells[1].innerText, - y: innerTd.parentNode.parentNode.cells[2].innerText -tbody.rows[0].cells[2].innerText - }; - var goal = { - x: 0, - y: 0 - }; - var LmVec = new Array(); - var EmVec = new Array(); - var rad = 0; - - alert("init x:" + goal.x + " ,y:" + goal.y); - for (var i = 0; i < (rowlen - 2); i++) { - LmVec[i] = new Object(); - - LmVec[i].x = tbody.rows[i+1].cells[1].innerText - tbody.rows[0].cells[1].innerText; - LmVec[i].y = tbody.rows[i+1].cells[2].innerText - tbody.rows[0].cells[2].innerText; - // alert(LmVec[i].x+" , "+LmVec[i].y); - EmVec[i] = new Object(); - EmVec[i].x = tbody.rows[i+1].cells[4].innerText - tbody.rows[0].cells[4].innerText; - EmVec[i].y = tbody.rows[i+1].cells[5].innerText - tbody.rows[0].cells[5].innerText; - } - - //target.x=LmVec.x*s+LmVec.y*t p=ax+by - //target.y=EmVec.x*s+EmVec.y*t q=cx+dy - for (var i = 0; i < (rowlen - 3); i++) { //解法：クラメルの公式 - - alert("a:"+LmVec[0].x +" d:"+ LmVec[i + 1].y +" b:"+ LmVec[0].y +" c:"+LmVec[i + 1].x); - var Det = LmVec[0].x * LmVec[i + 1].y - LmVec[0].y * LmVec[i + 1].x; //ad-bc - alert("det:" + Det); - if (Det == 0) { - //解が一位に定まらない - } else { - alert("target.x:"+target.x+"target.y:"+target.y); - var s = (target.x * LmVec[i + 1].y - LmVec[0].y * target.y) / Det; //ed-fb/det - var t = (LmVec[0].x * target.y - target.x * LmVec[i + 1].x) / Det; //af-ec/det - alert("s:" + s + " ,t:" + t); - goal.x += s * EmVec[0].x + t * EmVec[i + 1].x; - goal.y += s * EmVec[0].y + t * EmVec[i + 1].y; - } - } - - - - goal.x = goal.x / (rowlen - 3); - goal.y = goal.y / (rowlen - 3); - - alert("x:" + goal.x + " ,y:" + goal.y+" rowlen:"+(rowlen-3)); - alert("x0:" +tbody.rows[0].cells[4].innerText+ " ,y0:" + tbody.rows[0].cells[5].innerText); - goal.x=goal.x+parseInt(tbody.rows[0].cells[4].innerText); - goal.y=goal.y+parseInt(tbody.rows[0].cells[5].innerText); - goal.x = Math.round(goal.x); - goal.y = Math.round(goal.y); - alert("x:" + goal.x + " ,y:" + goal.y+" rowlen:"+(rowlen-3)); - - var movexr = $("#movex").val(); - var moveyr = $("#movey").val(); - var movezr = $("#movez").val(); - console.log("movex="+movexr); - console.log("movey="+moveyr); - movexr = goal.x; - moveyr = goal.y; - innerTd.parentNode.parentNode.cells[4].innerHTML=goal.x; - innerTd.parentNode.parentNode.cells[5].innerHTML=goal.y; - $("#movex").val(String(movexr)); - $("#movey").val(String(moveyr)); - - $.ajax({ - type:"GET", - url:"http://" +UrlElement['sendIpAddress']+ - ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+ - "/set/stagea?x="+encodeURIComponent(movexr)+ - "&y="+encodeURIComponent(moveyr)+ - "&z="+encodeURIComponent(movezr)+ - "&a="+encodeURIComponent(movezr), - success: function(data){ - console.log(data);//string型 - } - - }); - - } else { - alert("LM座標を3つ、EM座標を2つ以上指定して下さい"); - } -} // END moveEmCoordinate(innerTd); - - -//var txt=document.createTextNode("X:"+cod.x+" , Y:"+cod.y); -//first.appendChild(txt); -//coordinate.removeChild(); -// var txt=document.createTextNode(); -// coordinate.appendChild(txt); diff --git a/JS/Currentcondition.js b/JS/Currentcondition.js old mode 100644 new mode 100755 diff --git a/JS/unused/EucentricHeight.js b/JS/EucentricHeight.js old mode 100644 new mode 100755 similarity index 100% rename from JS/unused/EucentricHeight.js rename to JS/EucentricHeight.js diff --git a/JS/TemControl.js~ b/JS/TemControl.js similarity index 100% rename from JS/TemControl.js~ rename to JS/TemControl.js diff --git a/JS/unused/ajax.js b/JS/ajax.js similarity index 100% rename from JS/unused/ajax.js rename to JS/ajax.js diff --git a/JS/ajax.js~ b/JS/ajax.js~ deleted file mode 100755 index 0843b4f..0000000 --- a/JS/ajax.js~ +++ /dev/null @@ -1,17 +0,0 @@ -function getAjax(){ - var ajax = null; - try{ - ajax = new XMLHttpRequest(); - }catch(e){ - try{ - ajax = new ActiveXObject("Msxml2.XMLHTTP"); - }catch(e){ - try{ - ajax = new ActiveXObject("Microsoft.XMLHTTP"); - }catch(e){ - alert("Not Init"); - } - } - } - return ajax; -} diff --git a/JS/bootstrap-3.1.1.min.js b/JS/bootstrap-3.1.1.min.js deleted file mode 100755 index 93e0002..0000000 --- a/JS/bootstrap-3.1.1.min.js +++ /dev/null @@ -1,11 +0,0 @@ -/*! - * Bootstrap v3.2.0 (http://getbootstrap.com) - * Copyright 2011-2014 Twitter, Inc. - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) - */ - -/*! - * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=7f293a1dbd02eb1680cc) - * Config saved to config.json and https://gist.github.com/7f293a1dbd02eb1680cc - */ -if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery");+function(t){"use strict";function e(e){return this.each(function(){var i=t(this),s=i.data("bs.alert");s||i.data("bs.alert",s=new o(this)),"string"==typeof e&&s[e].call(i)})}var i='[data-dismiss="alert"]',o=function(e){t(e).on("click",i,this.close)};o.VERSION="3.2.0",o.prototype.close=function(e){function i(){n.detach().trigger("closed.bs.alert").remove()}var o=t(this),s=o.attr("data-target");s||(s=o.attr("href"),s=s&&s.replace(/.*(?=#[^\s]*$)/,""));var n=t(s);e&&e.preventDefault(),n.length||(n=o.hasClass("alert")?o:o.parent()),n.trigger(e=t.Event("close.bs.alert")),e.isDefaultPrevented()||(n.removeClass("in"),t.support.transition&&n.hasClass("fade")?n.one("bsTransitionEnd",i).emulateTransitionEnd(150):i())};var s=t.fn.alert;t.fn.alert=e,t.fn.alert.Constructor=o,t.fn.alert.noConflict=function(){return t.fn.alert=s,this},t(document).on("click.bs.alert.data-api",i,o.prototype.close)}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.button"),n="object"==typeof e&&e;s||o.data("bs.button",s=new i(this,n)),"toggle"==e?s.toggle():e&&s.setState(e)})}var i=function(e,o){this.$element=t(e),this.options=t.extend({},i.DEFAULTS,o),this.isLoading=!1};i.VERSION="3.2.0",i.DEFAULTS={loadingText:"loading..."},i.prototype.setState=function(e){var i="disabled",o=this.$element,s=o.is("input")?"val":"html",n=o.data();e+="Text",null==n.resetText&&o.data("resetText",o[s]()),o[s](null==n[e]?this.options[e]:n[e]),setTimeout(t.proxy(function(){"loadingText"==e?(this.isLoading=!0,o.addClass(i).attr(i,i)):this.isLoading&&(this.isLoading=!1,o.removeClass(i).removeAttr(i))},this),0)},i.prototype.toggle=function(){var t=!0,e=this.$element.closest('[data-toggle="buttons"]');if(e.length){var i=this.$element.find("input");"radio"==i.prop("type")&&(i.prop("checked")&&this.$element.hasClass("active")?t=!1:e.find(".active").removeClass("active")),t&&i.prop("checked",!this.$element.hasClass("active")).trigger("change")}t&&this.$element.toggleClass("active")};var o=t.fn.button;t.fn.button=e,t.fn.button.Constructor=i,t.fn.button.noConflict=function(){return t.fn.button=o,this},t(document).on("click.bs.button.data-api",'[data-toggle^="button"]',function(i){var o=t(i.target);o.hasClass("btn")||(o=o.closest(".btn")),e.call(o,"toggle"),i.preventDefault()})}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.carousel"),n=t.extend({},i.DEFAULTS,o.data(),"object"==typeof e&&e),r="string"==typeof e?e:n.slide;s||o.data("bs.carousel",s=new i(this,n)),"number"==typeof e?s.to(e):r?s[r]():n.interval&&s.pause().cycle()})}var i=function(e,i){this.$element=t(e).on("keydown.bs.carousel",t.proxy(this.keydown,this)),this.$indicators=this.$element.find(".carousel-indicators"),this.options=i,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter.bs.carousel",t.proxy(this.pause,this)).on("mouseleave.bs.carousel",t.proxy(this.cycle,this))};i.VERSION="3.2.0",i.DEFAULTS={interval:5e3,pause:"hover",wrap:!0},i.prototype.keydown=function(t){switch(t.which){case 37:this.prev();break;case 39:this.next();break;default:return}t.preventDefault()},i.prototype.cycle=function(e){return e||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(t.proxy(this.next,this),this.options.interval)),this},i.prototype.getItemIndex=function(t){return this.$items=t.parent().children(".item"),this.$items.index(t||this.$active)},i.prototype.to=function(e){var i=this,o=this.getItemIndex(this.$active=this.$element.find(".item.active"));return e>this.$items.length-1||0>e?void 0:this.sliding?this.$element.one("slid.bs.carousel",function(){i.to(e)}):o==e?this.pause().cycle():this.slide(e>o?"next":"prev",t(this.$items[e]))},i.prototype.pause=function(e){return e||(this.paused=!0),this.$element.find(".next, .prev").length&&t.support.transition&&(this.$element.trigger(t.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},i.prototype.next=function(){return this.sliding?void 0:this.slide("next")},i.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},i.prototype.slide=function(e,i){var o=this.$element.find(".item.active"),s=i||o[e](),n=this.interval,r="next"==e?"left":"right",a="next"==e?"first":"last",l=this;if(!s.length){if(!this.options.wrap)return;s=this.$element.find(".item")[a]()}if(s.hasClass("active"))return this.sliding=!1;var h=s[0],p=t.Event("slide.bs.carousel",{relatedTarget:h,direction:r});if(this.$element.trigger(p),!p.isDefaultPrevented()){if(this.sliding=!0,n&&this.pause(),this.$indicators.length){this.$indicators.find(".active").removeClass("active");var c=t(this.$indicators.children()[this.getItemIndex(s)]);c&&c.addClass("active")}var d=t.Event("slid.bs.carousel",{relatedTarget:h,direction:r});return t.support.transition&&this.$element.hasClass("slide")?(s.addClass(e),s[0].offsetWidth,o.addClass(r),s.addClass(r),o.one("bsTransitionEnd",function(){s.removeClass([e,r].join(" ")).addClass("active"),o.removeClass(["active",r].join(" ")),l.sliding=!1,setTimeout(function(){l.$element.trigger(d)},0)}).emulateTransitionEnd(1e3*o.css("transition-duration").slice(0,-1))):(o.removeClass("active"),s.addClass("active"),this.sliding=!1,this.$element.trigger(d)),n&&this.cycle(),this}};var o=t.fn.carousel;t.fn.carousel=e,t.fn.carousel.Constructor=i,t.fn.carousel.noConflict=function(){return t.fn.carousel=o,this},t(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(i){var o,s=t(this),n=t(s.attr("data-target")||(o=s.attr("href"))&&o.replace(/.*(?=#[^\s]+$)/,""));if(n.hasClass("carousel")){var r=t.extend({},n.data(),s.data()),a=s.attr("data-slide-to");a&&(r.interval=!1),e.call(n,r),a&&n.data("bs.carousel").to(a),i.preventDefault()}}),t(window).on("load",function(){t('[data-ride="carousel"]').each(function(){var i=t(this);e.call(i,i.data())})})}(jQuery),+function(t){"use strict";function e(e){e&&3===e.which||(t(s).remove(),t(n).each(function(){var o=i(t(this)),s={relatedTarget:this};o.hasClass("open")&&(o.trigger(e=t.Event("hide.bs.dropdown",s)),e.isDefaultPrevented()||o.removeClass("open").trigger("hidden.bs.dropdown",s))}))}function i(e){var i=e.attr("data-target");i||(i=e.attr("href"),i=i&&/#[A-Za-z]/.test(i)&&i.replace(/.*(?=#[^\s]*$)/,""));var o=i&&t(i);return o&&o.length?o:e.parent()}function o(e){return this.each(function(){var i=t(this),o=i.data("bs.dropdown");o||i.data("bs.dropdown",o=new r(this)),"string"==typeof e&&o[e].call(i)})}var s=".dropdown-backdrop",n='[data-toggle="dropdown"]',r=function(e){t(e).on("click.bs.dropdown",this.toggle)};r.VERSION="3.2.0",r.prototype.toggle=function(o){var s=t(this);if(!s.is(".disabled, :disabled")){var n=i(s),r=n.hasClass("open");if(e(),!r){"ontouchstart"in document.documentElement&&!n.closest(".navbar-nav").length&&t('
').insertAfter(t(this)).on("click",e);var a={relatedTarget:this};if(n.trigger(o=t.Event("show.bs.dropdown",a)),o.isDefaultPrevented())return;s.trigger("focus"),n.toggleClass("open").trigger("shown.bs.dropdown",a)}return!1}},r.prototype.keydown=function(e){if(/(38|40|27)/.test(e.keyCode)){var o=t(this);if(e.preventDefault(),e.stopPropagation(),!o.is(".disabled, :disabled")){var s=i(o),r=s.hasClass("open");if(!r||r&&27==e.keyCode)return 27==e.which&&s.find(n).trigger("focus"),o.trigger("click");var a=" li:not(.divider):visible a",l=s.find('[role="menu"]'+a+', [role="listbox"]'+a);if(l.length){var h=l.index(l.filter(":focus"));38==e.keyCode&&h>0&&h--,40==e.keyCode&&h').appendTo(this.$body),this.$element.on("click.dismiss.bs.modal",t.proxy(function(t){t.target===t.currentTarget&&("static"==this.options.backdrop?this.$element[0].focus.call(this.$element[0]):this.hide.call(this))},this)),s&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),!e)return;s?this.$backdrop.one("bsTransitionEnd",e).emulateTransitionEnd(150):e()}else if(!this.isShown&&this.$backdrop){this.$backdrop.removeClass("in");var n=function(){i.removeBackdrop(),e&&e()};t.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one("bsTransitionEnd",n).emulateTransitionEnd(150):n()}else e&&e()},i.prototype.checkScrollbar=function(){document.body.clientWidth>=window.innerWidth||(this.scrollbarWidth=this.scrollbarWidth||this.measureScrollbar())},i.prototype.setScrollbar=function(){var t=parseInt(this.$body.css("padding-right")||0,10);this.scrollbarWidth&&this.$body.css("padding-right",t+this.scrollbarWidth)},i.prototype.resetScrollbar=function(){this.$body.css("padding-right","")},i.prototype.measureScrollbar=function(){var t=document.createElement("div");t.className="modal-scrollbar-measure",this.$body.append(t);var e=t.offsetWidth-t.clientWidth;return this.$body[0].removeChild(t),e};var o=t.fn.modal;t.fn.modal=e,t.fn.modal.Constructor=i,t.fn.modal.noConflict=function(){return t.fn.modal=o,this},t(document).on("click.bs.modal.data-api",'[data-toggle="modal"]',function(i){var o=t(this),s=o.attr("href"),n=t(o.attr("data-target")||s&&s.replace(/.*(?=#[^\s]+$)/,"")),r=n.data("bs.modal")?"toggle":t.extend({remote:!/#/.test(s)&&s},n.data(),o.data());o.is("a")&&i.preventDefault(),n.one("show.bs.modal",function(t){t.isDefaultPrevented()||n.one("hidden.bs.modal",function(){o.is(":visible")&&o.trigger("focus")})}),e.call(n,r,this)})}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.tooltip"),n="object"==typeof e&&e;(s||"destroy"!=e)&&(s||o.data("bs.tooltip",s=new i(this,n)),"string"==typeof e&&s[e]())})}var i=function(t,e){this.type=this.options=this.enabled=this.timeout=this.hoverState=this.$element=null,this.init("tooltip",t,e)};i.VERSION="3.2.0",i.DEFAULTS={animation:!0,placement:"top",selector:!1,template:'',trigger:"hover focus",title:"",delay:0,html:!1,container:!1,viewport:{selector:"body",padding:0}},i.prototype.init=function(e,i,o){this.enabled=!0,this.type=e,this.$element=t(i),this.options=this.getOptions(o),this.$viewport=this.options.viewport&&t(this.options.viewport.selector||this.options.viewport);for(var s=this.options.trigger.split(" "),n=s.length;n--;){var r=s[n];if("click"==r)this.$element.on("click."+this.type,this.options.selector,t.proxy(this.toggle,this));else if("manual"!=r){var a="hover"==r?"mouseenter":"focusin",l="hover"==r?"mouseleave":"focusout";this.$element.on(a+"."+this.type,this.options.selector,t.proxy(this.enter,this)),this.$element.on(l+"."+this.type,this.options.selector,t.proxy(this.leave,this))}}this.options.selector?this._options=t.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},i.prototype.getDefaults=function(){return i.DEFAULTS},i.prototype.getOptions=function(e){return e=t.extend({},this.getDefaults(),this.$element.data(),e),e.delay&&"number"==typeof e.delay&&(e.delay={show:e.delay,hide:e.delay}),e},i.prototype.getDelegateOptions=function(){var e={},i=this.getDefaults();return this._options&&t.each(this._options,function(t,o){i[t]!=o&&(e[t]=o)}),e},i.prototype.enter=function(e){var i=e instanceof this.constructor?e:t(e.currentTarget).data("bs."+this.type);return i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i)),clearTimeout(i.timeout),i.hoverState="in",i.options.delay&&i.options.delay.show?void(i.timeout=setTimeout(function(){"in"==i.hoverState&&i.show()},i.options.delay.show)):i.show()},i.prototype.leave=function(e){var i=e instanceof this.constructor?e:t(e.currentTarget).data("bs."+this.type);return i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i)),clearTimeout(i.timeout),i.hoverState="out",i.options.delay&&i.options.delay.hide?void(i.timeout=setTimeout(function(){"out"==i.hoverState&&i.hide()},i.options.delay.hide)):i.hide()},i.prototype.show=function(){var e=t.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){this.$element.trigger(e);var i=t.contains(document.documentElement,this.$element[0]);if(e.isDefaultPrevented()||!i)return;var o=this,s=this.tip(),n=this.getUID(this.type);this.setContent(),s.attr("id",n),this.$element.attr("aria-describedby",n),this.options.animation&&s.addClass("fade");var r="function"==typeof this.options.placement?this.options.placement.call(this,s[0],this.$element[0]):this.options.placement,a=/\s?auto?\s?/i,l=a.test(r);l&&(r=r.replace(a,"")||"top"),s.detach().css({top:0,left:0,display:"block"}).addClass(r).data("bs."+this.type,this),this.options.container?s.appendTo(this.options.container):s.insertAfter(this.$element);var h=this.getPosition(),p=s[0].offsetWidth,c=s[0].offsetHeight;if(l){var d=r,f=this.$element.parent(),u=this.getPosition(f);r="bottom"==r&&h.top+h.height+c-u.scroll>u.height?"top":"top"==r&&h.top-u.scroll-c<0?"bottom":"right"==r&&h.right+p>u.width?"left":"left"==r&&h.left-pr.top+r.height&&(s.top=r.top+r.height-l)}else{var h=e.left-n,p=e.left+n+i;hr.width&&(s.left=r.left+r.width-p)}return s},i.prototype.getTitle=function(){var t,e=this.$element,i=this.options;return t=e.attr("data-original-title")||("function"==typeof i.title?i.title.call(e[0]):i.title)},i.prototype.getUID=function(t){do t+=~~(1e6*Math.random());while(document.getElementById(t));return t},i.prototype.tip=function(){return this.$tip=this.$tip||t(this.options.template)},i.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".tooltip-arrow")},i.prototype.validate=function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},i.prototype.enable=function(){this.enabled=!0},i.prototype.disable=function(){this.enabled=!1},i.prototype.toggleEnabled=function(){this.enabled=!this.enabled},i.prototype.toggle=function(e){var i=this;e&&(i=t(e.currentTarget).data("bs."+this.type),i||(i=new this.constructor(e.currentTarget,this.getDelegateOptions()),t(e.currentTarget).data("bs."+this.type,i))),i.tip().hasClass("in")?i.leave(i):i.enter(i)},i.prototype.destroy=function(){clearTimeout(this.timeout),this.hide().$element.off("."+this.type).removeData("bs."+this.type)};var o=t.fn.tooltip;t.fn.tooltip=e,t.fn.tooltip.Constructor=i,t.fn.tooltip.noConflict=function(){return t.fn.tooltip=o,this}}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.popover"),n="object"==typeof e&&e;(s||"destroy"!=e)&&(s||o.data("bs.popover",s=new i(this,n)),"string"==typeof e&&s[e]())})}var i=function(t,e){this.init("popover",t,e)};if(!t.fn.tooltip)throw new Error("Popover requires tooltip.js");i.VERSION="3.2.0",i.DEFAULTS=t.extend({},t.fn.tooltip.Constructor.DEFAULTS,{placement:"right",trigger:"click",content:"",template:''}),i.prototype=t.extend({},t.fn.tooltip.Constructor.prototype),i.prototype.constructor=i,i.prototype.getDefaults=function(){return i.DEFAULTS},i.prototype.setContent=function(){var t=this.tip(),e=this.getTitle(),i=this.getContent();t.find(".popover-title")[this.options.html?"html":"text"](e),t.find(".popover-content").empty()[this.options.html?"string"==typeof i?"html":"append":"text"](i),t.removeClass("fade top bottom left right in"),t.find(".popover-title").html()||t.find(".popover-title").hide()},i.prototype.hasContent=function(){return this.getTitle()||this.getContent()},i.prototype.getContent=function(){var t=this.$element,e=this.options;return t.attr("data-content")||("function"==typeof e.content?e.content.call(t[0]):e.content)},i.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},i.prototype.tip=function(){return this.$tip||(this.$tip=t(this.options.template)),this.$tip};var o=t.fn.popover;t.fn.popover=e,t.fn.popover.Constructor=i,t.fn.popover.noConflict=function(){return t.fn.popover=o,this}}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.tab");s||o.data("bs.tab",s=new i(this)),"string"==typeof e&&s[e]()})}var i=function(e){this.element=t(e)};i.VERSION="3.2.0",i.prototype.show=function(){var e=this.element,i=e.closest("ul:not(.dropdown-menu)"),o=e.data("target");if(o||(o=e.attr("href"),o=o&&o.replace(/.*(?=#[^\s]*$)/,"")),!e.parent("li").hasClass("active")){var s=i.find(".active:last a")[0],n=t.Event("show.bs.tab",{relatedTarget:s});if(e.trigger(n),!n.isDefaultPrevented()){var r=t(o);this.activate(e.closest("li"),i),this.activate(r,r.parent(),function(){e.trigger({type:"shown.bs.tab",relatedTarget:s})})}}},i.prototype.activate=function(e,i,o){function s(){n.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),e.addClass("active"),r?(e[0].offsetWidth,e.addClass("in")):e.removeClass("fade"),e.parent(".dropdown-menu")&&e.closest("li.dropdown").addClass("active"),o&&o()}var n=i.find("> .active"),r=o&&t.support.transition&&n.hasClass("fade");r?n.one("bsTransitionEnd",s).emulateTransitionEnd(150):s(),n.removeClass("in")};var o=t.fn.tab;t.fn.tab=e,t.fn.tab.Constructor=i,t.fn.tab.noConflict=function(){return t.fn.tab=o,this},t(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(i){i.preventDefault(),e.call(t(this),"show")})}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.affix"),n="object"==typeof e&&e;s||o.data("bs.affix",s=new i(this,n)),"string"==typeof e&&s[e]()})}var i=function(e,o){this.options=t.extend({},i.DEFAULTS,o),this.$target=t(this.options.target).on("scroll.bs.affix.data-api",t.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",t.proxy(this.checkPositionWithEventLoop,this)),this.$element=t(e),this.affixed=this.unpin=this.pinnedOffset=null,this.checkPosition()};i.VERSION="3.2.0",i.RESET="affix affix-top affix-bottom",i.DEFAULTS={offset:0,target:window},i.prototype.getPinnedOffset=function(){if(this.pinnedOffset)return this.pinnedOffset;this.$element.removeClass(i.RESET).addClass("affix");var t=this.$target.scrollTop(),e=this.$element.offset();return this.pinnedOffset=e.top-t},i.prototype.checkPositionWithEventLoop=function(){setTimeout(t.proxy(this.checkPosition,this),1)},i.prototype.checkPosition=function(){if(this.$element.is(":visible")){var e=t(document).height(),o=this.$target.scrollTop(),s=this.$element.offset(),n=this.options.offset,r=n.top,a=n.bottom;"object"!=typeof n&&(a=r=n),"function"==typeof r&&(r=n.top(this.$element)),"function"==typeof a&&(a=n.bottom(this.$element));var l=null!=this.unpin&&o+this.unpin<=s.top?!1:null!=a&&s.top+this.$element.height()>=e-a?"bottom":null!=r&&r>=o?"top":!1;if(this.affixed!==l){null!=this.unpin&&this.$element.css("top","");var h="affix"+(l?"-"+l:""),p=t.Event(h+".bs.affix");this.$element.trigger(p),p.isDefaultPrevented()||(this.affixed=l,this.unpin="bottom"==l?this.getPinnedOffset():null,this.$element.removeClass(i.RESET).addClass(h).trigger(t.Event(h.replace("affix","affixed"))),"bottom"==l&&this.$element.offset({top:e-this.$element.height()-a}))}}};var o=t.fn.affix;t.fn.affix=e,t.fn.affix.Constructor=i,t.fn.affix.noConflict=function(){return t.fn.affix=o,this},t(window).on("load",function(){t('[data-spy="affix"]').each(function(){var i=t(this),o=i.data();o.offset=o.offset||{},o.offsetBottom&&(o.offset.bottom=o.offsetBottom),o.offsetTop&&(o.offset.top=o.offsetTop),e.call(i,o)})})}(jQuery),+function(t){"use strict";function e(e){return this.each(function(){var o=t(this),s=o.data("bs.collapse"),n=t.extend({},i.DEFAULTS,o.data(),"object"==typeof e&&e);!s&&n.toggle&&"show"==e&&(e=!e),s||o.data("bs.collapse",s=new i(this,n)),"string"==typeof e&&s[e]()})}var i=function(e,o){this.$element=t(e),this.options=t.extend({},i.DEFAULTS,o),this.transitioning=null,this.options.parent&&(this.$parent=t(this.options.parent)),this.options.toggle&&this.toggle()};i.VERSION="3.2.0",i.DEFAULTS={toggle:!0},i.prototype.dimension=function(){var t=this.$element.hasClass("width");return t?"width":"height"},i.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var i=t.Event("show.bs.collapse");if(this.$element.trigger(i),!i.isDefaultPrevented()){var o=this.$parent&&this.$parent.find("> .panel > .in");if(o&&o.length){var s=o.data("bs.collapse");if(s&&s.transitioning)return;e.call(o,"hide"),s||o.data("bs.collapse",null)}var n=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[n](0),this.transitioning=1;var r=function(){this.$element.removeClass("collapsing").addClass("collapse in")[n](""),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!t.support.transition)return r.call(this);var a=t.camelCase(["scroll",n].join("-"));this.$element.one("bsTransitionEnd",t.proxy(r,this)).emulateTransitionEnd(350)[n](this.$element[0][a])}}},i.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var e=t.Event("hide.bs.collapse");if(this.$element.trigger(e),!e.isDefaultPrevented()){var i=this.dimension();this.$element[i](this.$element[i]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var o=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return t.support.transition?void this.$element[i](0).one("bsTransitionEnd",t.proxy(o,this)).emulateTransitionEnd(350):o.call(this)}}},i.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var o=t.fn.collapse;t.fn.collapse=e,t.fn.collapse.Constructor=i,t.fn.collapse.noConflict=function(){return t.fn.collapse=o,this},t(document).on("click.bs.collapse.data-api",'[data-toggle="collapse"]',function(i){var o,s=t(this),n=s.attr("data-target")||i.preventDefault()||(o=s.attr("href"))&&o.replace(/.*(?=#[^\s]+$)/,""),r=t(n),a=r.data("bs.collapse"),l=a?"toggle":s.data(),h=s.attr("data-parent"),p=h&&t(h);a&&a.transitioning||(p&&p.find('[data-toggle="collapse"][data-parent="'+h+'"]').not(s).addClass("collapsed"),s[r.hasClass("in")?"addClass":"removeClass"]("collapsed")),e.call(r,l)})}(jQuery),+function(t){"use strict";function e(i,o){var s=t.proxy(this.process,this);this.$body=t("body"),this.$scrollElement=t(t(i).is("body")?window:i),this.options=t.extend({},e.DEFAULTS,o),this.selector=(this.options.target||"")+" .nav li > a",this.offsets=[],this.targets=[],this.activeTarget=null,this.scrollHeight=0,this.$scrollElement.on("scroll.bs.scrollspy",s),this.refresh(),this.process()}function i(i){return this.each(function(){var o=t(this),s=o.data("bs.scrollspy"),n="object"==typeof i&&i;s||o.data("bs.scrollspy",s=new e(this,n)),"string"==typeof i&&s[i]()})}e.VERSION="3.2.0",e.DEFAULTS={offset:10},e.prototype.getScrollHeight=function(){return this.$scrollElement[0].scrollHeight||Math.max(this.$body[0].scrollHeight,document.documentElement.scrollHeight)},e.prototype.refresh=function(){var e="offset",i=0;t.isWindow(this.$scrollElement[0])||(e="position",i=this.$scrollElement.scrollTop()),this.offsets=[],this.targets=[],this.scrollHeight=this.getScrollHeight();var o=this;this.$body.find(this.selector).map(function(){var o=t(this),s=o.data("target")||o.attr("href"),n=/^#./.test(s)&&t(s);return n&&n.length&&n.is(":visible")&&[[n[e]().top+i,s]]||null}).sort(function(t,e){return t[0]-e[0]}).each(function(){o.offsets.push(this[0]),o.targets.push(this[1])})},e.prototype.process=function(){var t,e=this.$scrollElement.scrollTop()+this.options.offset,i=this.getScrollHeight(),o=this.options.offset+i-this.$scrollElement.height(),s=this.offsets,n=this.targets,r=this.activeTarget;if(this.scrollHeight!=i&&this.refresh(),e>=o)return r!=(t=n[n.length-1])&&this.activate(t);if(r&&e<=s[0])return r!=(t=n[0])&&this.activate(t);for(t=s.length;t--;)r!=n[t]&&e>=s[t]&&(!s[t+1]||e<=s[t+1])&&this.activate(n[t])},e.prototype.activate=function(e){this.activeTarget=e,t(this.selector).parentsUntil(this.options.target,".active").removeClass("active");var i=this.selector+'[data-target="'+e+'"],'+this.selector+'[href="'+e+'"]',o=t(i).parents("li").addClass("active");o.parent(".dropdown-menu").length&&(o=o.closest("li.dropdown").addClass("active")),o.trigger("activate.bs.scrollspy")};var o=t.fn.scrollspy;t.fn.scrollspy=i,t.fn.scrollspy.Constructor=e,t.fn.scrollspy.noConflict=function(){return t.fn.scrollspy=o,this},t(window).on("load.bs.scrollspy.data-api",function(){t('[data-spy="scroll"]').each(function(){var e=t(this);i.call(e,e.data())})})}(jQuery),+function(t){"use strict";function e(){var t=document.createElement("bootstrap"),e={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var i in e)if(void 0!==t.style[i])return{end:e[i]};return!1}t.fn.emulateTransitionEnd=function(e){var i=!1,o=this;t(this).one("bsTransitionEnd",function(){i=!0});var s=function(){i||t(o).trigger(t.support.transition.end)};return setTimeout(s,e),this},t(function(){t.support.transition=e(),t.support.transition&&(t.event.special.bsTransitionEnd={bindType:t.support.transition.end,delegateType:t.support.transition.end,handle:function(e){return t(e.target).is(this)?e.handleObj.handler.apply(this,arguments):void 0}})})}(jQuery); \ No newline at end of file diff --git a/JS/canvas.js b/JS/canvas.js deleted file mode 100644 index efb85a7..0000000 --- a/JS/canvas.js +++ /dev/null @@ -1,565 +0,0 @@ -window.addEventListener("load", eventWindowLoaded, false); - -var cancasmode = 0; - -function tabcheck() { - var introduce = document.getElementById('introduce'); - var ineh = document.getElementById('eucentricheightcontents'); - var inform = document.getElementById('form'); - var insingle = document.getElementById('simplephotecontents'); - var intomo = document.getElementById('tomography'); - var inmds = document.getElementById('mds'); - - if (insingle.style.display == "") { - canvasmode = 1; - //canvasApp(); - console.log("canvasmode=" + canvasmode); - }else if(intomo.style.display ==""){ - canvasmode = 2; - canvastomo(); - console.log("canvasmode=" + canvasmode); - }else if(inmds.style.display ==""){ - canvasmode =3; - canvasmds(); - console.log("canvasmode=" + canvasmode); - }else{ - canvasmode = 0; - console.log("canvasmode=" + canvasmode); - } -} - -function eventWindowLoaded() { - //画面がロードされたら、canvasAppを呼び出す - /* if (canvasmode == 1) { - //canvasApp(); - } else if (canvasmode == 2) { - canvastomo(); - } - */ - //canvasmds(); - //モード切り替えの初期formの色の設定 - document.getElementById("formmode").style.backgroundColor = '#e0ffff'; - document.getElementById("formmode2").style.backgroundColor = '#e0ffff'; - document.getElementById("formmode3").style.backgroundColor = '#e0ffff'; -} -/* - function canvasSupport(){ - return Modernizer.canvas; - } - */ -//var movex = document.forms.movestage.movex.value; -//var movey = document.forms.movestage.movey.value; -/* - function putTxt(){ - document.onkeydown = funcKey; - } - */ - -//キャンバスの初期値の設定 -var movex = 1; -var movey = 1; -var movez = 0; -var movea = 0; -var mode = 0; -var moveformx=0; -var moveformy=0; -var moveformz=0; -var moveformas=0; -var moveformat=0; -var movingdistance =1; -var tiltmode = 1; - -function gamepad() { - if (navigator.getGamepads) { - // ゲームパッドリストを取得する - var gamepad_list = navigator.getGamepads(); - // 出力テスト - console.log(gamepad_list); - } - console.log("function gamepad"); - window.addEventListener("gamepadconnected", function(e) { - console.log("gamepad connected!"); - }); - - if (window.GamepadEvent) { - - // ------------------------------------------------------------ - // ゲームパッドを接続すると実行されるイベント - // ------------------------------------------------------------ - window.addEventListener("gamepadconnected", function(e) { - console.log("ゲームパッドが接続された"); - console.log(e.gamepad); - }); - - // ------------------------------------------------------------ - // ゲームパッドの接続を解除すると実行されるイベント - // ------------------------------------------------------------ - window.addEventListener("gamepaddisconnected", function(e) { - console.log("ゲームパッドの接続が解除された"); - console.log(e.gamepad); - }); - - } - /* - setInterval(function(e){ - var gamepad = e.gamepad; - if (gamepad.axes[0] < -0.5) { - movex = parseInt(movex) + parseInt(10); - console.log("left!"); - ////canvasApp(); - } - if (gamepad.axes[0] > 0.5) { - movex = parseInt(movex) - parseInt(10); - //canvasApp(); - } - if (gamepad.axes[1] < -0.5) { - movey = parseInt(movey) - parseInt(10); - //canvasApp(); - } - if (gamepad.axes[1] > 0.5) { - movey = parseInt(movey) + parseInt(10); - //canvasApp(); - - } - },1000/60); - */ - - setInterval(function() { - var str = ""; - // ゲームパッドリストを取得する - var gamepad_list = navigator.getGamepads(); - // ゲームパッドリスト内のアイテム総数を取得する - var num = gamepad_list.length; - var i; - for (i = 0; i < num; i++) { - // Gamepad オブジェクトを取得 - var gamepad = gamepad_list[i]; - if (!gamepad) - continue; - // ゲームパッドのインデックス値 - str += "index: " + gamepad.index + "\n"; - // タイムスタンプ情報 - str += "timestamp: " + gamepad.timestamp + "\n"; - // ゲームパッドの識別名 - str += "id: \"" + gamepad.id + "\"\n"; - // ゲームパッドの物理的な接続状態 - str += "connected: " + gamepad.connected + "\n"; - // マッピングタイプ情報 - str += "mapping: \"" + gamepad.mapping + "\"\n"; - - // ボタンリスト - // ------------------------------------------------------------ - var buttons = gamepad.buttons; - str += "buttons: {\n"; - var j; - var n = buttons.length; - for (j = 0; j < n; j++) { - // GamepadButton オブジェクトを取得 - var button = buttons[j]; - str += " \"" + j + "\": { "; - // ボタン押下状態 - str += "pressed:" + button.pressed + " , "; - // ボタン入力強度 - str += "value:" + button.value + " }\n"; - } - str += "}\n"; - // 軸リスト - // ------------------------------------------------------------ - if (mode == 2) { - var axes = gamepad.axes; - str += "axes: {\n"; - var j; - var n = axes.length; - for (j = 0; j < n; j++) { - if (j == 0) { - if (axes[j] < -0.5) { - movex = parseInt(movex) - parseInt(1); - console.log(movex); - console.log(axes[j]); - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - if (canvasmode == 1) { - //canvasApp(); - } else if (canvasmode == 2) { - canvastomo(); - } else if (canvasmode == 3) { - canvasmds(); - } - } - if (axes[j] > 0.5) { - movex = parseInt(movex) + parseInt(1); - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - if (canvasmode == 1) { - //canvasApp(); - } else if (canvasmode == 2) { - canvastomo(); - } else if (canvasmode == 3){ - canvasmds(); - } - } - } else if (j == 1) { - if (axes[j] < -0.5) { - movey = parseInt(movey) + parseInt(1); - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - if (canvasmode == 1) { - //canvasApp(); - } else if (canvasmode == 2) { - canvastomo(); - } else if (canvasmode ==3 ) { - canvasmds(); - } - } - if (axes[j] > 0.5) { - movey = parseInt(movey) - parseInt(1); - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - if (canvasmode == 1) { - //canvasApp(); - } else if (canvasmode == 2) { - canvastomo(); - } else if (canvasmode == 3){ - canvasmds(); - } - } - } - } - } - } - }, 1000 / 60); - - - window.addEventListener("gamepaddisconnected", function(e) { - console.log("gamepad disconnected"); - }); - window.addEventListener("gamepadconnected", function(e) { - console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.", - e.gamepad.index, e.gamepad.id, - e.gamepad.buttons.length, e.gamepad.axes.length); - }); - -}; - - -function canvasApp() { - var theCanvas = document.getElementById("canvasOne"); - //canvasとして利用するhtmlのタグの場所を指定 - var context = theCanvas.getContext("2d"); - //2Dcontextの取得 - - function drawScreen() { - //実際に画面の描写を行っている部分 - context.fillStyle = "fffffaa"; - //描画画面の塗りつぶし、今回は黒 - context.fillRect(0, 0, 540, 605); - //画面上に形を作る - if (mode == 0) { - //if(document.forms.movestage.movex.value!=moveformx){ - moveformx = document.forms.movestage.movex.value; - movex=parseInt(moveformx); - //} - //if(document.forms.movestage.movey.value!=moveformy){ - moveformy = document.forms.movestage.movey.value; - movey=parseInt(moveformy); - - moveformz = document.forms.moveza.movez.value; - movez=parseInt(moveformz); - - - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - //} - //画面上に入力した数値から位置を取得 - } - /* - var movez = document.forms.s2.movez.value; - - if (movez == 0) { - movez = 1; - } - */ - var img = new Image(); - - img.onload = function() { - //イメージがロードするのを待つ必要があるのでonload - //context.scale(movez*0.1,movez*0.1); - //context.setTransform(movez*0.1,0,0,movez*0.1,0,0); - //context.translate(540/2,605/2); - context.drawImage(img, movex, movey); - //イメージを描写、引数は画像のオブジェクト,左端のx,y - document.getElementById("currentx").innerHTML = movex; - document.getElementById("currenty").innerHTML = movey; - console.log("x=" + movex); - console.log("y=" + movey); - var movingdistance = $("#movingdistance"); - console.log(movingdistance[0]); - } - - //見る画像 - img.src = "./image/CC124crudeダイニン.jpg"; - - //--ふちの設定--現在見えてない - context.strokeStyle = "#000000"; - //線の色 - context.strokeRect(5, 5, 505, 610); - //わくの輪郭を書く、引数は左端のx,y,幅,高さ - } - drawScreen(); -} - -function canvastomo() { - var theCanvas = document.getElementById("canvastomo"); - //canvasとして利用するhtmlのタグの場所を指定 - var context = theCanvas.getContext("2d"); - //2Dcontextの取得 - - function drawScreen() { - //実際に画面の描写を行っている部分 - context.fillStyle = "fffffaa"; - //描画画面の塗りつぶし、今回は黒 - context.fillRect(0, 0, 540, 605); - //画面上に形を作る - if (mode == 0) { - //if(document.forms.movestage.movex.value!=moveformx){ - moveformx = document.forms.movestagetomo.movex.value; - movex=parseInt(moveformx); - //} - //if(document.forms.movestage.movey.value!=moveformy){ - moveformy = document.forms.movestagetomo.movey.value; - movey=parseInt(moveformy); - - moveformz = document.forms.moveztomo.movez.value; - movez=parseInt(moveformz); - - if (tiltmode == 1) { - moveformas = document.forms.setting.standardnum.value; - movea = parseInt(moveformas); - stagecontrol('stage', movex, movey, movez, movea); - emcondition('request'); - } else if (tiltmode == 2) { - moveformat = document.forms.setting.tiltingnum.value; - movea = parseInt(moveformat); - stagecontrol('stage', movex, movey, movez, movea*(Math.cos(movea * (Math.PI / 180)))); - emcondition('request'); - } - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - //} - //画面上に入力した数値から位置を取得 - } - /* - var movez = document.forms.s2.movez.value; - - if (movez == 0) { - movez = 1; - } - */ - var img = new Image(); - - img.onload = function() { - //イメージがロードするのを待つ必要があるのでonload - //context.scale(movez*0.1,movez*0.1); - //context.setTransform(movez*0.1,0,0,movez*0.1,0,0); - //context.translate(540/2,605/2); - context.drawImage(img, movex, movey); - //イメージを描写、引数は画像のオブジェクト,左端のx,y - document.getElementById("currenttomox").innerHTML = movex; - document.getElementById("currenttomoy").innerHTML = movey; - console.log("x=" + movex); - console.log("y=" + movey); - } - - //見る画像 - img.src = "./image/axoF11-2 .jpg"; - - //--ふちの設定--現在見えてない - context.strokeStyle = "#000000"; - //線の色 - context.strokeRect(5, 5, 505, 610); - //わくの輪郭を書く、引数は左端のx,y,幅,高さ - } - drawScreen(); -} - -function controlmodeselect(modename){ - document.getElementById("key").style.backgroundColor = 'transparent'; - document.getElementById("key2").style.backgroundColor = 'transparent'; - document.getElementById("key3").style.backgroundColor = 'transparent'; - document.getElementById("formmode").style.backgroundColor = 'transparent'; - document.getElementById("formmode2").style.backgroundColor = 'transparent'; - document.getElementById("formmode3").style.backgroundColor = 'transparent'; - document.getElementById("gamepad").style.backgroundColor = 'transparent'; - document.getElementById("gamepad2").style.backgroundColor = 'transparent'; - document.getElementById("gamepad3").style.backgroundColor = 'transparent'; - - if(modename){ - document.getElementById(modename).style.backgroundColor = '#e0ffff'; - } -} - - -/* - * To change this license header, choose License Headers in Project Properties. - * To change this template file, choose Tools | Templates - * and open the template in the editor. - */ - -function tilt() { - radio = document.getElementsByName('tilting'); - document.getElementById('angurar').innerHTML= document.forms.setting.tiltingnum.value; - if (radio[0].checked) { - tiltmode=1; - document.getElementById('standard').style.display = ""; - document.getElementById('saxtorn').style.display = "none"; - } else if (radio[1].checked) { - tiltmode=2; - document.getElementById('standard').style.display = "none"; - document.getElementById('saxtorn').style.display = ""; - } -} - -function canvasmds() { - var theCanvas = document.getElementById("canvasmds"); - //canvasとして利用するhtmlのタグの場所を指定 - var context = theCanvas.getContext("2d"); - //2Dcontextの取得 - function drawScreen() { - //実際に画面の描写を行っている部分 - context.fillStyle = "fffffaa"; - //描画画面の塗りつぶし、今回は黒 - context.fillRect(0, 0, 540, 605); - //画面上に形を作る - if (mode == 0) { - //if(document.forms.movestage.movex.value!=moveformx){ - moveformx = document.forms.movestagemds.movex.value; - movex=parseInt(moveformx); - //} - //if(document.forms.movestage.movey.value!=moveformy){ - moveformy = document.forms.movestagemds.movey.value; - movey=parseInt(moveformy); - - moveformz = document.forms.movezmds.movez.value; - movez=parseInt(moveformz); - - - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - //} - //画面上に入力した数値から位置を取得 - } - /* - var movez = document.forms.s2.movez.value; - - if (movez == 0) { - movez = 1; - } - */ - var img = new Image(); - - img.onload = function() { - //イメージがロードするのを待つ必要があるのでonload - //context.scale(movez*0.1,movez*0.1); - //context.setTransform(movez*0.1,0,0,movez*0.1,0,0); - //context.translate(540/2,605/2); - context.drawImage(img, movex, movey); - //イメージを描写、引数は画像のオブジェクト,左端のx,y - document.getElementById("currentmdsx").innerHTML = movex; - document.getElementById("currentmdsy").innerHTML = movey; - console.log("x=" + movex); - console.log("y=" + movey); - } - - //見る画像 - img.src = "./image/flower.jpg"; - - //--ふちの設定--現在見えてない - context.strokeStyle = "#000000"; - //線の色 - context.strokeRect(5, 5, 505, 610); - //わくの輪郭を書く、引数は左端のx,y,幅,高さ - } - drawScreen(); -} - -function shiftplace() { - mode = 4; - movex = parseInt(movex) + parseInt(10); - stagecontrol('stage', movex, movey, movez, movea); - emcondition('request'); - canvasmds(); -} - -function replace() { - mode = 4; - movex = parseInt(movex) - parseInt(10); - stagecontrol('stage', movex, movey, movez, movea); - emcondition('request'); - canvasmds(); - -} - -function canvasroot() { - var theCanvas = document.getElementById("canvasroot"); - //canvasとして利用するhtmlのタグの場所を指定 - var context = theCanvas.getContext("2d"); - //2Dcontextの取得 - - function drawScreen() { - //実際に画面の描写を行っている部分 - context.fillStyle = "fffffaa"; - //描画画面の塗りつぶし、今回は黒 - context.fillRect(0, 0, 200, 200); - //画面上に形を作る - /* if (mode == 0) { - //if(document.forms.movestage.movex.value!=moveformx){ - moveformx = document.forms.movestage.movex.value; - movex=parseInt(moveformx); - //} - //if(document.forms.movestage.movey.value!=moveformy){ - moveformy = document.forms.movestage.movey.value; - movey=parseInt(moveformy); - - moveformz = document.forms.moveza.movez.value; - movez=parseInt(moveformz); - - - stagecontrol('stage',movex,movey,movez,movea); - emcondition('request'); - //} - //画面上に入力した数値から位置を取得 - }*/ - /* - var movez = document.forms.s2.movez.value; - - if (movez == 0) { - movez = 1; - } - */ - var img = new Image(); - - img.onload = function() { - //イメージがロードするのを待つ必要があるのでonload - //context.scale(movez*0.1,movez*0.1); - //context.setTransform(movez*0.1,0,0,movez*0.1,0,0); - //context.translate(540/2,605/2); - context.drawImage(img, movex, movey); - //イメージを描写、引数は画像のオブジェクト,左端のx,y - document.getElementById("currentx").innerHTML = movex; - document.getElementById("currenty").innerHTML = movey; - console.log("x=" + movex); - console.log("y=" + movey); - - } - - //見る画像 - img.src = "./image/ele.jpg"; - - //--ふちの設定--現在見えてない - context.strokeStyle = "#000000"; - //線の色 - context.strokeRect(5, 5, 505, 610); - //わくの輪郭を書く、引数は左端のx,y,幅,高さ - } - drawScreen(); -} diff --git a/JS/unused/changedisplay.js b/JS/changedisplay.js old mode 100644 new mode 100755 similarity index 100% rename from JS/unused/changedisplay.js rename to JS/changedisplay.js diff --git a/JS/color.js b/JS/color.js new file mode 100644 index 0000000..2ea55ea --- /dev/null +++ b/JS/color.js @@ -0,0 +1,202 @@ +/* +CANVAS_SIZEはdraw.jsにおいてグローバルに宣言しているためこのファイル内では宣言していない。 +*/ + + +function color(){ + var canvas = document.getElementById("canvas"); + var context = canvas.getContext("2d"); + + var canvas2 = document.getElementById("canvas2"); + var context2 = canvas2.getContext("2d"); + + var canvas3 = document.getElementById("blend_canvas"); + var context3 = canvas3.getContext("2d"); + canvas3.width = CANVAS_SIZE; + canvas3.height = CANVAS_SIZE; + + var image = context.getImageData(0,0,canvas.width,canvas.height); + var image2 = context2.getImageData(0,0,canvas2.width,canvas2.height); + image3 = context3.createImageData(canvas3.width,canvas3.height); + + + var image_rgba = image.data; + var image2_rgba = image2.data; + var image3_rgba = image3.data; + + image_rgba = color_change(image_rgba, 1); + image2_rgba = color_change(image2_rgba, 2); + image3_rgba = make_new_Image(image_rgba, image2_rgba, image3_rgba); + + context3.putImageData(image3, 0, 0); +} + + +//ピクセル配列の値(色情報)の書き換え +function color_change(image_rgba, mode){ + var max, min; + var R,G,B; + var H; + var before_color,after_color; + var diff_color; + + //canvas選択　1-display1のcanvas ,2-display2のcanvas + if(mode == 1){ + before_color = parseInt(form4.before_color.value); + after_color = parseInt(form4.after_color.value); + }else if(mode == 2){ + before_color = parseInt(form4.before_color2.value); + after_color = parseInt(form4.after_color2.value); + } + diff_color = after_color - before_color; + + /**************RGB->HSV*******************************/ + for (var i = 0; i < image_rgba.length ; i++){ + R = image_rgba[i * 4] / 255;//RGBAの値は0-255で与えられている + G = image_rgba[i * 4 + 1] / 255; + B = image_rgba[i * 4 + 2] / 255; + + if(R == G && G == B){ + continue; + }else if(R >= G && R >= B){ + if(G >= B){ + max = R; + min = B; + }else if(B > G){ + max = R; + min = G; + } + }else if(G >= R && G >= B){ + if(R >= B){ + max = G; + min = B; + }else if(B > R){ + max = G; + min = R; + } + }else if(B >= R && B >= G){ + if(R >= G){ + max = B; + min = G; + }else if(G > R){ + max = B; + min = R; + } + } + + if(max == R){ + H = 60 * (G - B)/(max - min); + H %= 360; + }else if(max == G){ + H = (60 * (B - R) / (max - min)) + 120; + H %= 360; + }else if(max == B){ + H = (60 * (R - G) / (max - min)) + 240; + H %= 360; + } + + /*****************color change*********************/ + //値書き換え（色相変換） + if (before_color != 1 && after_color != 1){ + if(H >= (before_color-1) * 60 -30 && H < (before_color * 60 -30)){ + H = H + 60 * diff_color; + } + }else if(before_color == 1 && after_color != 1){ + if(H >= 0 && H < 30){ + H = H + 60 * diff_color; + }else if(H >= 330 && H <= 360){ + H = H - 60 * (6 - diff_color); + } + }else if(before_color != 1 && after_color == 1){ + if(H >= (before_color - 1) * 60 -30 && H < (before_color - 1) * 60 ){ + H = H + 60 * (6 + diff_color); + }else if(H >= (before_color - 1) * 60 && H < before_color * 60 -30){ + H = H + 60 * diff_color; + } + }else{ + continue; + } + + /***********************HSV->RGB************************/ + if(H >= 0 && H < 60){ + R = max; + G = (H / 60) * (max - min) + min; + B = min; + }else if(H >= 60 && H < 120){ + R = -((H-120) / 60) * (max - min) + min; + G = max; + B = min; + }else if(H >= 120 && H < 180){ + R = min + G = max; + B = ((H-120) / 60) * (max - min) + min; + }else if(H >= 180 && H < 240){ + R = min + G = -((H-240) / 60) * (max - min) + min; + B = max; + }else if(H >= 240 && H < 300){ + R = ((H-240) / 60) * (max - min) + min; + G = min; + B = max; + }else if(H >= 300 && H <= 360){ + R = max; + G = min; + B = (-(H-360) / 60) * (max - min) + min; + }else{ + continue; + } + + image_rgba[i * 4] = R * 255; + image_rgba[i * 4 + 1] = G * 255; + image_rgba[i * 4 + 2] = B * 255; + + } + return image_rgba; +} + + +/*************create new image data*************/ + /* + image_rgba[count * 4] //R + image_rgba[count * 4 + 1] //G + image_rgba[count * 4 + 2] //B + image_rgba[count * 4 + 3] //A + + image2_rgba[count * 4] //R + image2_rgba[count * 4 + 1] //G + image2_rgba[count * 4 + 2] //B + image2_rgba[count * 4 + 3] //A + */ +function make_new_Image(image_rgba, image2_rgba, image3_rgba){ + + var alpha = parseFloat(form4.alpha.value); + var beta = parseFloat(form4.beta.value); + + for(var count = 0; count < image3_rgba.length; count++){ + image3_rgba[count * 4] = (image_rgba[count * 4] * alpha) + (image2_rgba[count * 4] * beta); + image3_rgba[count * 4 + 1] = (image_rgba[count * 4 + 1] * alpha) + (image2_rgba[count * 4 + 1] * beta); + image3_rgba[count * 4 + 2] = (image_rgba[count * 4 + 2] * alpha) + (image2_rgba[count * 4 + 2] * beta); + image3_rgba[count * 4 + 3] = 255; + } + return image3_rgba; +} + + + +function set_alpha(){ + var alpha = parseFloat(form4.alpha.value); + var beta = parseFloat(form4.beta.value); //beta = 1 - alpha + + var comp = 1.00 - alpha + form4.beta.value = comp.toFixed(2); +} + +function set_beta(){ + var alpha = parseFloat(form4.alpha.value); + var beta = parseFloat(form4.beta.value); + + var comp = 1.00 - beta; + form4.alpha.value = comp.toFixed(2); +} + + diff --git a/JS/coordinate.js b/JS/coordinate.js new file mode 100644 index 0000000..e2c947f --- /dev/null +++ b/JS/coordinate.js @@ -0,0 +1,453 @@ +var can; //canvas要素 +var ctx; //コンテキスト +var file=0;//画像ファイル 0は有無の判断のために格納 +var magnification = 1;//拡大縮小倍率 +var movx=0; +var movy=0; //平行移動のパラメータ +const CANVAS_SIZE = 512;//canvasのサイズ +var IMAGE_SIZE;//画像のサイズをCANVASSIZEにするからピクセル差を補正 + +/**********************canvasに表示*******************************/ +function main(){ + can = document.getElementById('coordinate_canvas'); + ctx = can.getContext('2d'); + can.width = CANVAS_SIZE; + can.height = CANVAS_SIZE; +} + +//ローカルファイルの読み取り +function loadFile(files){ + file = files[0]; + //ファイルアップロード2回目以降のcanvasの初期化 + ctx.clearRect(0,0,can.width,can.height); + reseting(); +} + +//ファイルを選択でローカルから画像ファイルを読み込んでcanvasに描画する +function displayImage(){ + var width; + var height; + var left; + var to; + var image = new Image(); + var reader = new FileReader(); + reader.onload = function(event){ + image.onload = function(){ + + //canvasのアンチエイリアスを無効 + ctx.mozImageSmoothingEnabled = false; + ctx.webkitImageSmoothingEnabled = false; + ctx.msImageSmoothingEnabled = false; + ctx.imageSmoothingEnabled = false + + if(image.width > image.height){ + IMAGE_SIZE = image.width; + }else{ + IMAGE_SIZE = image.height; + } + + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = can.width; + height = can.height / imageAspect; + to = (can.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = can.width * imageAspect; + height = can.height; + left = (can.width - width) / 2; + } + + //ファイルアップロード2回目以降のcanvasの初期化 + ctx.clearRect(0,0,can.width,can.height); + + /****************変換適用***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //倍率をコンテキストに反映 + ctx.scale(magnification,magnification); + + ctx.translate(-parseInt(can.width / 2),-parseInt(can.height / 2)); + + /**************************************************************************/ + + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + ctx.drawImage(image, 0, 0, image.width, image.height, left+movx, to-movy, width, height); + + /*****************変換調整***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //画像の倍率の初期化 + ctx.scale(1 / magnification,1 / magnification); + + ctx.translate(-parseInt(can.width / 2),-parseInt(can.height / 2)); + /****************************************************************************/ + } + image.src = event.target.result; + } + if(file && file.type.match('image.*')){ + reader.readAsDataURL(file); + }else{ + return false; + } +} + +//倍率の値を持ってくる関数 +function scaling(){ + if(file==0){ + window.alert("Please load image file."); + magnification_init(); + return false; + } + magnification = parseFloat(form1.magnification.value); + displayImage(); +} + +//倍率を１に戻す関数 +function magnification_init(){ + form1.magnification.value = 1.00; //htmlのフォームの中身を変える + magnification = parseFloat(form1.magnification.value); //実際の値を変える +} + +//平行移動のパラメータを持ってくる関数 +function moving(){ + if(file==0){ + window.alert("Please load image file."); + move_params_init(); + return false; + } + movx = parseFloat(form1.movex.value); + movy = parseFloat(form1.movey.value); + displayImage(); +} + +//平行移動パラメータの初期化 +function move_params_init(){ + form1.movex.value = 0; + movx = parseFloat(form1.movex.value); + form1.movey.value = 0; + movy = parseFloat(form1.movey.value); +} + +//画像変形のリセット +function reseting(){ + move_params_init(); + magnification_init(); + displayImage(); +} + + +/**********************canvasに表示********************************/ + +/********************************************/ +/****************coordinate******************/ +/********************************************/ + +//coordinate メンバー +function Coordinate(_number, _x, _y, _z){ + this.number = _number; + this.x = _x; + this.y = _y; + this.z = _z;//将来的に３次元での解析を見越してZ座標をメンバーとして加えている +} + +///////////////////////////////////// +//マウスカーソルのキャンバス内の座標計算// +///////////////////////////////////// +function calculate_xy(event){ + + var mouseX = 0; //coordinate x of mouse point + var mouseY = 0; //coordinate y of mouse point + var positionX = 0; //coordinate x of canvas + var positionY = 0; //coordinate y of canvas + var x = 0; //coordinate x of mouse point in canvas + var y = 0; //coordinate y of mouse point in canvas + + var order1 = parseInt(image_form.order1.value);//mm or μm or nm or A(ongstroom)//計算用 + var order2 = parseInt(list_form.order2.value);//mm or um or nm or A //表用 + + var pixel_length = image_form.pixel_length.value;//画像のピクセルの大きさ（サーバー側から受け取り可能） + + mouseX = event.pageX; + mouseY = event.pageY; + + clientRect = document.getElementById("coordinate_canvas").getBoundingClientRect(); + positionX = clientRect.left + window.pageXOffset; + positionY = clientRect.top + window.pageYOffset; + + //画像中心を原点としてピクセル座標計算（平行移動対応） + if(CANVAS_SIZE%2){//奇数 + x = mouseX - positionX - (can.width / 2) - movx; + y = -(mouseY - positionY - (can.height / 2)) - movy; + }else{//偶数（偶数の場合は原点は右上を採用） + x = mouseX - positionX - (can.width / 2) - movx; + y = -(mouseY - positionY - ((can.height / 2) - 1)) - movy; + } + + //小数点切り捨て + x = ~~x; + y = ~~y; + + //画像の実際の大きさのピクセルに戻す + x *= IMAGE_SIZE / CANVAS_SIZE; + y *= IMAGE_SIZE / CANVAS_SIZE; + + //px -> mm,mim,nm ...ピクセルの寸法と元画像の大きさから算出 + x *= pixel_length * Math.pow(10,-order1-(-order2)) / magnification; + y *= pixel_length * Math.pow(10,-order1-(-order2)) / magnification; + + var coordinate = new Coordinate(); + coordinate.x = parseFloat(x.toFixed(2)); + coordinate.y = parseFloat(y.toFixed(2)); + coordinate.z = 0; + + return coordinate; +} + +////////////////////////////// +//現在のマウスカーソル座標の表示// +////////////////////////////// +document.getElementById("coordinate_canvas").addEventListener("mousemove", function(event){ + var current_coordinate = document.getElementById("current_coordinate"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event); + if(!IMAGE_SIZE){ + return false; + }else{ + current_coordinate.innerHTML = "x: " + coordinate.x + " y:" + coordinate.y + " z:" + coordinate.z; + } +}); + +////////////////////////////// +//クリックしたマウスカーソル座標// +////////////////////////////// +document.getElementById("coordinate_canvas").addEventListener("click", function(event){ + if(!file){ + window.alert("Please load image file."); + move_params_init(); + return false; + }else{ + var current_coordinate = document.getElementById("click_coordinate"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event); + add_list(coordinate); + } + +}); + +/***************************************表(座標リストの処理)*****************************************/ + +var coordinate_database = []; //座標のオブジェクトを格納する配列 + +//add list +function add_list(coordinate){ + + var tbody = document.getElementById("coordinate_table_tbody"); + var new_tr = tbody.insertRow(-1); + var row_Index = new_tr.rowIndex; //row's index (start = 1) equal to table numbering + + var number_td = new_tr.insertCell(-1); + var x_td = new_tr.insertCell(-1); + var y_td = new_tr.insertCell(-1); + var z_td = new_tr.insertCell(-1); + var button_td = new_tr.insertCell(-1); + + coordinate.number = row_Index; + + //表に反映 + number_td.innerHTML = coordinate.number; + x_td.innerHTML = coordinate.x; + y_td.innerHTML = coordinate.y; + z_td.innerHTML = coordinate.z; + button_td.innerHTML = ''//this.parentNode.parentNode.rowIndex -> Row number in list + + //新しい座標データが来た時、coordinate_databaseに格納 + if(coordinate_database.length == row_Index - 1){ + coordinate_database[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + + for(var j = 0; j < coordinate_database.length; j++){ + console.log(coordinate_database[j]); + } +} + +//delete list by button +function dele_list(row_number){ + var tbody = document.getElementById("coordinate_table_tbody"); + var rows_length = tbody.rows.length; + for(var i=row_number; i <= rows_length; i++){ + tbody.deleteRow(row_number-1);//deleteRow(0) -> delete table's 1st row. + } + + coordinate_database.splice(row_number-1,1);//delete 1 data[row_number-1] from coordinate_database + + //ボタンを押した階層より後の同レベル階層を削除（Table） + //配列データ(coordinate database)は座標データを残しaddlistに送ってnumberを書き換えtableに反映 + for(j = row_number - 1; j < coordinate_database.length; j++){ + add_list(coordinate_database[j]) + } +} + +//all clear list +function all_clear(){ + var tbody = document.getElementById("coordinate_table_tbody"); + var rows_length = tbody.rows.length; + + for(var i=1; i <= rows_length; i++){ + tbody.deleteRow(-1); + coordinate_database.pop(); //最下層まで消す + } + //console.log(coordinate_database); +} + +//Download csv +function download(){ + var number; + var x; + var y; + var z; + + var text = ""; + //リストをテキストにする + for(var i=0; i= 1) { //画像が横長 + left = 0; + width = can.width; + height = can.height / imageAspect; + to = (can.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = can.width * imageAspect; + height = can.height; + left = (can.width - width) / 2; + } + + + + //ファイルアップロード2回目以降のcanvasの初期化 + ctx.clearRect(0,0,can.width,can.height); + + + /****************変換適用***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //倍率をコンテキストに反映 + ctx.scale(magnification,magnification); + //回転をコンテキストに反映 + ctx.rotate(angle / 180 * Math.PI); + + ctx.translate(-parseInt(can.width / 2),-parseInt(can.height / 2)); + + /**************************************************************************/ + + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + ctx.drawImage(image, 0, 0, image.width, image.height, left+movx, to-movy, width, height); + + /*****************変換調整***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //画像の倍率の初期化 + ctx.scale(1 / magnification,1 / magnification); + //角度の初期化 + ctx.rotate(-1 * angle / 180 * Math.PI); + ctx.translate(-parseInt(can.width / 2),-parseInt(can.height / 2)); + + /****************************************************************************/ + } + image.src = event.target.result; + } + if(file && file.type.match('image.*')){ + reader.readAsDataURL(file); + }else{ + return false; + } +} + +//倍率の値を持ってくる関数 +function scaling(){ + if(file==0){ + window.alert("Please load image file."); + magnification_init(); + return false; + } + magnification = parseFloat(form1.magnification.value); + displayImage(); +} + +//倍率を１に戻す関数 +function magnification_init(){ + form1.magnification.value = 1.00; //htmlのフォームの中身を変える + magnification = parseFloat(form1.magnification.value); //実際の値を変える +} + + + + +// 回転角を持ってくる関数 +function rotation(){ + if(file==0){ + window.alert("Please load image file."); + rotation_init(); + return false; + } + angle = parseFloat(form1.angle.value); + displayImage(); +} + +//回転角を０に戻す関数 +function rotation_init(){ + form1.angle.value = 0; + angle = parseFloat(form1.angle.value); +} + + + + //平行移動のパラメータを持ってくる関数 +function moving(){ + if(file==0){ + window.alert("Please load image file."); + move_params_init(); + return false; + } + movx = parseFloat(form1.movex.value); + movy = parseFloat(form1.movey.value); + displayImage(); +} + +//平行移動パラメータの初期化 +function move_params_init(){ + form1.movex.value = 0; + movx = parseFloat(form1.movex.value); + form1.movey.value = 0; + movy = parseFloat(form1.movey.value); +} + + +function reseting(){ + move_params_init(); + rotation_init(); + magnification_init(); + displayImage(); +} + + + +/************************************************Right canvas 's ACTION***************************************/ + +//ローカルファイルの読み取り +function loadFileR(files){ + fileR = files[0]; + console.log(fileR); + //ファイルアップロード2回目以降のcanvasの初期化 + ctxR.clearRect(0,0,can.width,can.height); + magnification_initR(); + rotation_initR(); + move_params_initR(); + displayImageR(); +} + + + +//ファイルを選択でローカルから画像ファイルを読み込んでcanvasに描画する +function displayImageR(){ + var width; + var height; + var left; + var to; + var imageAspectR = 0; + var imageR = new Image(); + var readerR = new FileReader(); + + readerR.onload = function(event){ + + imageR.onload = function(){ + + //canvasのアンチエイリアスを無効 + ctxR.mozImageSmoothingEnabled = false; + ctxR.webkitImageSmoothingEnabled = false; + ctxR.msImageSmoothingEnabled = false; + ctxR.imageSmoothingEnabled = false + + imageAspectR = imageR.width / imageR.height; + if (imageAspectR >= 1) { //画像が横長 + left = 0; + width = canR.width; + height = canR.height / imageAspectR; + to = (canR.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = canR.width * imageAspectR; + height = canR.height; + left = (canR.width - width) / 2; + } + + + + //ファイルアップロード2回目以降のcanvasの初期化 + ctxR.clearRect(0,0,canR.width,canR.height); + + + /****************変換適用***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctxR.translate(parseInt(canR.width / 2),parseInt(canR.height / 2)); + //倍率をコンテキストに反映 + ctxR.scale(magnificationR,magnificationR); + //回転をコンテキストに反映 + ctxR.rotate(angleR / 180 * Math.PI); + + ctxR.translate(-parseInt(canR.width / 2),-parseInt(canR.height / 2)); + + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + ctxR.drawImage(imageR, 0, 0, imageR.width, imageR.height, left+movxR, to-movyR, width, height); + + /*****************変換調整***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctxR.translate(parseInt(canR.width / 2),parseInt(canR.height / 2)); + //画像の倍率の初期化 + ctxR.scale(1 / magnificationR,1 / magnificationR); + //角度の初期化 + ctxR.rotate(-1 * angleR / 180 * Math.PI); + + ctxR.translate(-parseInt(canR.width / 2),-parseInt(canR.height / 2)); + /****************************************************************************/ + } + imageR.src = event.target.result; + } + if(fileR && fileR.type.match('image.*')){ + readerR.readAsDataURL(fileR); + }else{ + return false; + } +} + +//倍率の値を持ってくる関数 +function scalingR(){ + if(fileR==0){ + window.alert("Please load image file."); + magnification_initR(); + return false; + } + magnificationR = parseFloat(form2.magnification.value); + displayImageR(); +} + +//倍率を１に戻す関数 +function magnification_initR(){ + form2.magnification.value = 1.00; //htmlのフォームの中身を変える + magnificationR = parseFloat(form2.magnification.value); //実際の値を変える +} + +// 回転角を持ってくる関数 +function rotationR(){ + if(fileR==0){ + window.alert("Please load image file."); + rotation_initR(); + return false; + } + angleR = parseFloat(form2.angle.value); + displayImageR(); +} + +//回転角を０に戻す関数 +function rotation_initR(){ + form2.angle.value = 0; + angleR = parseFloat(form2.angle.value); + //console.log("executed rotation_initR()"); +} + + //平行移動のパラメータを持ってくる関数 +function movingR(){ + if(file==0){ + window.alert("Please load image file."); + move_params_initR(); + return false; + } + movxR = parseFloat(form2.movex.value); + movyR = parseFloat(form2.movey.value); + displayImageR(); +} + +//平行移動パラメータの初期化 +function move_params_initR(){ + form2.movex.value = 0; + movxR = parseFloat(form2.movex.value); + form2.movey.value = 0; + movyR = parseFloat(form2.movey.value); +} + + +function resetingR(){ + move_params_initR(); + rotation_initR(); + magnification_initR(); + displayImageR(); +} diff --git a/JS/drawImage.js b/JS/drawImage.js old mode 100644 new mode 100755 index 95b09d5..86d069e --- a/JS/drawImage.js +++ b/JS/drawImage.js @@ -1,5 +1,5 @@ function drawMycrograph(ddata){ - var canvas = document.getElementById("canvasSimplePhoto"); + var canvas = document.getElementById("em_canvas"); var length; var context; @@ -30,6 +30,7 @@ function drawMycrograph(ddata){ context.putImageData(imgData, 0, 0); } + $(function(){ var state="off" @@ -61,3 +62,4 @@ $(function(){ } }); }); + diff --git a/JS/draw_image.js b/JS/draw_image.js new file mode 100644 index 0000000..b7ad66a --- /dev/null +++ b/JS/draw_image.js @@ -0,0 +1,459 @@ +var CANVAS_SIZE = 512; + +function Display(_canvas,_context,_file,_image,_sorce){ + this.canvas = _canvas; + this.context = _context; + this.file = _file; + this.image = _image; + this.sorce = _sorce; + this.magnification = 1; + this.movx = 0; + this.movy = 0; + this.angle = 0; +} + +var display1 = new Display();//1 +var display2 = new Display();//2 +var display3 = new Display();//3 +var display4 = new Display();//4 + +function main(){ + display1.canvas = document.getElementById('canvas'); + display2.canvas = document.getElementById('canvas2'); + display3.canvas = document.getElementById('canvas3'); + display4.canvas = document.getElementById('canvas4'); + display1.context = display1.canvas.getContext('2d'); + display2.context = display2.canvas.getContext('2d'); + display3.context = display3.canvas.getContext('2d'); + display4.context = display4.canvas.getContext('2d'); + display1.canvas.height = CANVAS_SIZE; + display1.canvas.width = CANVAS_SIZE; + display2.canvas.height = CANVAS_SIZE; + display2.canvas.width = CANVAS_SIZE; + display3.canvas.height = CANVAS_SIZE; + display3.canvas.width = CANVAS_SIZE; + display4.canvas.height = CANVAS_SIZE; + display4.canvas.width = CANVAS_SIZE; +} + +//ローカルファイルの読み取り +function loadFile(files,number){ + file = files[0]; + if(number == 1){ + display1.file = file; + display1.context.clearRect(0,0,display1.canvas.width,display1.canvas.height); + magnification_init(display1); + rotation_init(display1); + move_params_init(display1); + displayImage(display1); + }else if(number == 2){ + display2.file = file; + display2.context.clearRect(0,0,display2.canvas.width,display2.canvas.height); + magnification_init(display2); + rotation_init(display2); + move_params_init(display2); + displayImage(display2); + } +} + +//ファイルを選択でローカルから画像ファイルを読み込んでcanvasに描画する +function displayImage(display){ + var width; + var height; + var left; + var to; + var imageAspect=0; + var image = new Image(); + var reader = new FileReader(); + + if(!display.file){//display4に対する描画 + console.log("no file"); + //canvasのアンチエイリアスを無効 + display.context.mozImageSmoothingEnabled = false; + display.context.webkitImageSmoothingEnabled = false; + display.context.msImageSmoothingEnabled = false; + display.context.imageSmoothingEnabled = false + + /* + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = display.canvas.width; + height = display.canvas.height / imageAspect; + to = (display.canvas.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = display.canvas.width * imageAspect; + height = display.canvas.height; + left = (display.canvas.width - width) / 2; + } + */ + //ファイルアップロード2回目以降のcanvasの初期化 + display.context.clearRect(0,0,display.canvas.width,display.canvas.height); + /****************変換適用***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2));//コンテキストに対する効果の始点を中心に移動 + display.context.scale(display.magnification,display.magnification);//倍率をコンテキストに反映 + display.context.rotate(display.angle / 180 * Math.PI);//回転をコンテキストに反映 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + display.context.drawImage(display3.canvas, 0, 0, display.canvas.width, display.canvas.height, display.movx, display.movy,display.canvas.width, display.canvas.height); + + /*****************変換調整***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(1 / display.magnification,1 / display.magnification);//画像の倍率の初期化 + display.context.rotate(-1 * display.angle / 180 * Math.PI);//角度の初期化 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /****************************************************************************/ + }else{ + console.log("no image"); + reader.onload = function(event){ + image.onload = function(){ + + //canvasのアンチエイリアスを無効 + display.context.mozImageSmoothingEnabled = false; + display.context.webkitImageSmoothingEnabled = false; + display.context.msImageSmoothingEnabled = false; + display.context.imageSmoothingEnabled = false + + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = display.canvas.width; + height = display.canvas.height / imageAspect; + to = (display.canvas.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = display.canvas.width * imageAspect; + height = display.canvas.height; + left = (display.canvas.width - width) / 2; + } + + //ファイルアップロード2回目以降のcanvasの初期化 + display.context.clearRect(0,0,display.canvas.width,display.canvas.height); + + /****************変換適用***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2));//コンテキストに対する効果の始点を中心に移動 + display.context.scale(display.magnification,display.magnification);//倍率をコンテキストに反映 + display.context.rotate(display.angle / 180 * Math.PI);//回転をコンテキストに反映 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + display.context.drawImage(image, 0, 0, image.width, image.height, left+display.movx, to-display.movy, width, height); + + /*****************変換調整***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(1 / display.magnification,1 / display.magnification);//画像の倍率の初期化 + display.context.rotate(-1 * display.angle / 180 * Math.PI);//角度の初期化 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /****************************************************************************/ + } + image.src = event.target.result; + } + if(display.file && display.file.type.match('image.*')){ + reader.readAsDataURL(display.file); + }else{ + return false; + } + } +} + +//倍率の値を持ってくる関数 +function scaling(number){ + if(number == 1){ + display1.magnification = parseFloat(form1.magnification.value); + displayImage(display1); + }else if(number == 2){ + display2.magnification = parseFloat(form2.magnification.value); + displayImage(display2); + }else if(number == 4){ + display4.magnification = parseFloat(form4.magnification.value); + displayImage(display4); + } +} + +// 回転角を持ってくる関数 +function rotation(number){ + if(number == 1){ + display1.angle = parseFloat(form1.angle.value); + displayImage(display1); + }else if(number == 2){ + display2.angle = parseFloat(form2.angle.value); + displayImage(display2); + } +} + + //平行移動のパラメータを持ってくる関数 +function moving(number){ + if(number == 1){ + display1.movx = parseFloat(form1.movex.value); + display1.movy = parseFloat(form1.movey.value); + displayImage(display1); + }else if(number == 2){ + display2.movx = parseFloat(form2.movex.value); + display2.movy = parseFloat(form2.movey.value); + displayImage(display2); + }else if(number == 4){ + display4.movx = parseFloat(form4.movex.value); + display4.movy = parseFloat(form4.movey.value); + displayImage(display4); + } +} + +//回転角を０に戻す関数 +function rotation_init(number,display){ + if(number == 1){ + form1.angle.value = 0; + display.angle = parseFloat(form1.angle.value); + }else if(number == 2){ + form2.angle.value = 0; + display.angle = parseFloat(form2.angle.value); + } +} + +//倍率を１に戻す関数 +function magnification_init(number,display){ + if(number == 1){ + form1.magnification.value = 1.00; + display.magnification = parseFloat(form1.magnification.value); + }else if(number == 2){ + form2.magnification.value = 1.00; + display.magnification = parseFloat(form2.magnification.value); + }else if(number == 4){ + form4.magnification.value = 1.00; + display.magnification = parseFloat(form4.magnification.value); + } +} + +//平行移動パラメータの初期化 +function move_params_init(number,display){ + if(number == 1){ + form1.movex.value = 0; + form1.movey.value = 0; + display.movx = parseFloat(form1.movex.value); + display.movy = parseFloat(form1.movey.value); + }else if(number == 2){ + form2.movex.value = 0; + form2.movey.value = 0; + display.movx = parseFloat(form2.movex.value); + display.movy = parseFloat(form2.movey.value); + }else if(number == 4){ + form4.movex.value = 0; + form4.movey.value = 0; + display.movx = parseFloat(form4.movex.value); + display.movy = parseFloat(form4.movey.value); + } +} + +function reseting(number){ + if(number == 1){ + move_params_init(number,display1); + rotation_init(number,display1); + magnification_init(number,display1); + displayImage(display1); + }else if(number == 2){ + move_params_init(number,display2); + rotation_init(number,display2); + magnification_init(number,display2); + displayImage(display2); + }else if(number == 4){ + move_params_init(number,display4); + magnification_init(number,display4); + displayImage(display4); + + } +} + + +/******* WITs *********************************************************** vem ******************** +******************* WITs ****************************************** vem ******** vem ************* +vem ************************ WITs **************************** vem ******************* vem ******* +****** vem ***************************** WITs ********* vem ****************************** vem *** +*************** vem **************************** vem WITs ************************************ vem +************************ vem ************* vem ***************** WITs **************************** +********************************* vem ***************************************** WITs ************/ + +function color(){ + + var image = display1.context.getImageData(0,0,display1.canvas.width,display1.canvas.height); + var image2 = display2.context.getImageData(0,0,display2.canvas.width,display2.canvas.height); + var image3 = display3.context.createImageData(display3.canvas.width,display3.canvas.height); + + var image_rgba = image.data; + var image2_rgba = image2.data; + var image3_rgba = image3.data; + + image_rgba = color_change(image_rgba, 1); + image2_rgba = color_change(image2_rgba, 2); + image3_rgba = make_new_Image(image_rgba, image2_rgba, image3_rgba); + + display3.context.putImageData(image3, 0, 0); + displayImage(display4); +} + +//ピクセル配列の値(色情報)の書き換え +function color_change(image_rgba, mode){ + var max, min; + var R,G,B; + var H; + var before_color,after_color; + var diff_color; + + //canvas選択　1-display1のcanvas ,2-display2のcanvas + if(mode == 1){ + before_color = parseInt(color_form.before_color.value); + after_color = parseInt(color_form.after_color.value); + }else if(mode == 2){ + before_color = parseInt(color_form.before_color2.value); + after_color = parseInt(color_form.after_color2.value); + } + diff_color = after_color - before_color; + + /**************RGB->HSV*******************************/ + for (var i = 0; i < image_rgba.length ; i++){ + R = image_rgba[i * 4] / 255;//RGBAの値は0-255で与えられている + G = image_rgba[i * 4 + 1] / 255; + B = image_rgba[i * 4 + 2] / 255; + + if(R == G && G == B){ + continue; + }else if(R >= G && R >= B){ + if(G >= B){ + max = R; + min = B; + }else if(B > G){ + max = R; + min = G; + } + }else if(G >= R && G >= B){ + if(R >= B){ + max = G; + min = B; + }else if(B > R){ + max = G; + min = R; + } + }else if(B >= R && B >= G){ + if(R >= G){ + max = B; + min = G; + }else if(G > R){ + max = B; + min = R; + } + } + + if(max == R){ + H = 60 * (G - B)/(max - min); + H %= 360; + }else if(max == G){ + H = (60 * (B - R) / (max - min)) + 120; + H %= 360; + }else if(max == B){ + H = (60 * (R - G) / (max - min)) + 240; + H %= 360; + } + + /*****************color change*********************/ + //値書き換え（色相変換） + if (before_color != 1 && after_color != 1){ + if(H >= (before_color-1) * 60 -30 && H < (before_color * 60 -30)){ + H = H + 60 * diff_color; + } + }else if(before_color == 1 && after_color != 1){ + if(H >= 0 && H < 30){ + H = H + 60 * diff_color; + }else if(H >= 330 && H <= 360){ + H = H - 60 * (6 - diff_color); + } + }else if(before_color != 1 && after_color == 1){ + if(H >= (before_color - 1) * 60 -30 && H < (before_color - 1) * 60 ){ + H = H + 60 * (6 + diff_color); + }else if(H >= (before_color - 1) * 60 && H < before_color * 60 -30){ + H = H + 60 * diff_color; + } + }else{ + continue; + } + + /***********************HSV->RGB************************/ + if(H >= 0 && H < 60){ + R = max; + G = (H / 60) * (max - min) + min; + B = min; + }else if(H >= 60 && H < 120){ + R = -((H-120) / 60) * (max - min) + min; + G = max; + B = min; + }else if(H >= 120 && H < 180){ + R = min + G = max; + B = ((H-120) / 60) * (max - min) + min; + }else if(H >= 180 && H < 240){ + R = min + G = -((H-240) / 60) * (max - min) + min; + B = max; + }else if(H >= 240 && H < 300){ + R = ((H-240) / 60) * (max - min) + min; + G = min; + B = max; + }else if(H >= 300 && H <= 360){ + R = max; + G = min; + B = (-(H-360) / 60) * (max - min) + min; + }else{ + continue; + } + + image_rgba[i * 4] = R * 255; + image_rgba[i * 4 + 1] = G * 255; + image_rgba[i * 4 + 2] = B * 255; + + } + return image_rgba; +} + + +/*************create new image data*************/ + /* + image_rgba[count * 4] //R + image_rgba[count * 4 + 1] //G + image_rgba[count * 4 + 2] //B + image_rgba[count * 4 + 3] //A + + image2_rgba[count * 4] //R + image2_rgba[count * 4 + 1] //G + image2_rgba[count * 4 + 2] //B + image2_rgba[count * 4 + 3] //A + */ +function make_new_Image(image_rgba, image2_rgba, image3_rgba){ + + var alpha = parseFloat(color_form.alpha.value); + var beta = parseFloat(color_form.beta.value); + + for(var count = 0; count < image3_rgba.length; count++){ + image3_rgba[count * 4] = (image_rgba[count * 4] * alpha) + (image2_rgba[count * 4] * beta); + image3_rgba[count * 4 + 1] = (image_rgba[count * 4 + 1] * alpha) + (image2_rgba[count * 4 + 1] * beta); + image3_rgba[count * 4 + 2] = (image_rgba[count * 4 + 2] * alpha) + (image2_rgba[count * 4 + 2] * beta); + image3_rgba[count * 4 + 3] = (image_rgba[count * 4 + 3] * alpha) + (image2_rgba[count * 4 + 3] * beta); + //image3_rgba[count * 4 + 3] = 255; + } + return image3_rgba; +} + +function set_alpha(){ + var alpha = parseFloat(color_form.alpha.value); + var beta = parseFloat(color_form.beta.value); //beta = 1 - alpha + var comp = 1.00 - alpha + color.beta.value = comp.toFixed(2); +} + +function set_beta(){ + var alpha = parseFloat(color_form.alpha.value); + var beta = parseFloat(color_form.beta.value); + var comp = 1.00 - beta; + color.alpha.value = comp.toFixed(2); +} + diff --git a/JS/draw_imagekai.js b/JS/draw_imagekai.js new file mode 100644 index 0000000..b88227a --- /dev/null +++ b/JS/draw_imagekai.js @@ -0,0 +1,1100 @@ +{ +const CANVAS_SIZE = 512; +//座標取得の際、元の画像の大きさをCANVAS_SIZEの寸法でリサイズしているからIMAZE_SIZEを記憶して、取得する座標値を正確にする +var IMAGE_SIZE;//合成画像におけるIMAZE_SIZEはdisplay1に依存する仕様 + + +function Display(_canvas,_context,_file,_image,_sorce,_number,_id){ + this.canvas = _canvas; + this.context = _context; + this.file = _file; + this.image = _image; + this.sorce = _sorce; + this.thumbnail_number = _number; + this.thumbnail_canvas_id = _id; + this.magnification = 1; + this.movx = 0; + this.movy = 0; + this.angle = 0; + this.config_x = "No Data."; + this.config_y = "No Data."; + this.config_z = "No Data."; + this.config_alfa = "No Data."; + this.config_beta = "No Data."; + this.config_offsetX = "No Data."; + this.config_offsetY = "No Data."; + this.config_angle = "No Data."; +} + +var display1 = new Display(); // LM +var display2 = new Display(); // EM +var display3 = new Display(); // Blend[Color] +var display4 = new Display(); // Scale&MoveXY + +var thumbnails = []; //サムネイルの配列 + +//main HTMLがロードされると呼び出される +function main(){ + display1.canvas = document.getElementById('canvas'); + display2.canvas = document.getElementById('canvas2'); + display3.canvas = document.getElementById('canvas3'); + display4.canvas = document.getElementById('canvas4'); + + display1.context = display1.canvas.getContext('2d'); + display2.context = display2.canvas.getContext('2d'); + display3.context = display3.canvas.getContext('2d'); + display4.context = display4.canvas.getContext('2d'); + + display1.canvas.height = CANVAS_SIZE; + display1.canvas.width = CANVAS_SIZE; + display2.canvas.height = CANVAS_SIZE; + display2.canvas.width = CANVAS_SIZE; + display3.canvas.height = CANVAS_SIZE; + display3.canvas.width = CANVAS_SIZE; + display4.canvas.height = CANVAS_SIZE; + display4.canvas.width = CANVAS_SIZE; +} + +//ローカルファイルの読み取り +function loadFile(files,number){ + file = files[0]; + if(number == -1){ + display1.file = file; + display1.context.clearRect(0,0,display1.canvas.width,display1.canvas.height); + magnification_init(display1); + rotation_init(display1); + move_params_init(display1); + displayImage(display1); + }else if(number != -1){ + thumbnails[number-1].file = file; + make_canvas(thumbnails[number-1]); + } +} + +//ファイルを選択でローカルから画像ファイルを読み込んでcanvasに描画する +function displayImage(display){ + var width; + var height; + var left; + var to; + var imageAspect=0; + var image = new Image(); + var reader = new FileReader(); + + if(!display.file){//display4に対する描画 + //canvasのアンチエイリアスを無効 + display.context.mozImageSmoothingEnabled = false; + display.context.webkitImageSmoothingEnabled = false; + display.context.msImageSmoothingEnabled = false; + display.context.imageSmoothingEnabled = false; + + /* + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = display.canvas.width; + height = display.canvas.height / imageAspect; + to = (display.canvas.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = display.canvas.width * imageAspect; + height = display.canvas.height; + left = (display.canvas.width - width) / 2; + } + */ + //ファイルアップロード2回目以降のcanvasの初期化 + display.context.clearRect(0,0,display.canvas.width,display.canvas.height); + /****************変換適用***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(display.magnification,display.magnification); //倍率をコンテキストに反映 + display.context.rotate(display.angle / 180 * Math.PI); //回転をコンテキストに反映 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + display.context.drawImage(display3.canvas, 0, 0, display.canvas.width, display.canvas.height, display.movx/display.magnification, display.movy/display.magnification, display.canvas.width, display.canvas.height); + + /*****************変換調整***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(1 / display.magnification,1 / display.magnification); //画像の倍率の初期化 + display.context.rotate(-1 * display.angle / 180 * Math.PI); //角度の初期化 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /****************************************************************************/ + }else{ + reader.onload = function(event){ + image.onload = function(){ + + //canvasのアンチエイリアスを無効 + display.context.mozImageSmoothingEnabled = false; + display.context.webkitImageSmoothingEnabled = false; + display.context.msImageSmoothingEnabled = false; + display.context.imageSmoothingEnabled = false; + + if(display == display1){ + if(image.width > image.height){ + IMAGE_SIZE = image.width; + }else{ + IMAGE_SIZE = image.height; + } + } + + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = display.canvas.width; + height = display.canvas.height / imageAspect; + to = (display.canvas.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = display.canvas.width * imageAspect; + height = display.canvas.height; + left = (display.canvas.width - width) / 2; + } + + //ファイルアップロード2回目以降のcanvasの初期化 + display.context.clearRect(0,0,display.canvas.width,display.canvas.height); + + /****************変換適用***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(display.magnification,display.magnification); //倍率をコンテキストに反映 + display.context.rotate(display.angle / 180 * Math.PI); //回転をコンテキストに反映 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + display.context.drawImage(image, 0, 0, image.width, image.height, (left+(display.movx)), (to-(display.movy)), width, height); + + /*****************変換調整***********************************************/ + display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + display.context.scale(1 / display.magnification,1 / display.magnification); //画像の倍率の初期化 + display.context.rotate(-1 * display.angle / 180 * Math.PI); //角度の初期化 + display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /****************************************************************************/ + if(display == display2 && display2.thumbnail_number){ + Display2ToThumbnails(display.thumbnail_number); //Display2のサムネイルごとにパラメータを保持 + } + } + image.src = event.target.result; + } + if(display.file && display.file.type.match('image.*')){ + reader.readAsDataURL(display.file); + }else{ + return false; + } + } +} + +//倍率の値を持ってくる関数 +function scaling(number){ + if(number == 1){ + display1.magnification = parseFloat(form1.magnification.value); + displayImage(display1); + }else if(number == 2){ + display2.magnification = parseFloat(form2.magnification.value); + displayImage(display2); + }else if(number == 4){ + display4.magnification = parseFloat(form4.magnification.value); + displayImage(display4); + } +} + +// 回転角を持ってくる関数 +function rotation(number){ + if(number == 1){ + display1.angle = parseFloat(form1.angle.value); + displayImage(display1); + }else if(number == 2){ + display2.angle = parseFloat(form2.angle.value); + displayImage(display2); + } +} + + //平行移動のパラメータを持ってくる関数 +function moving(number){ + if(number == 1){ + var pixel_length = d1_unit.pixel_length.value; //[unit]/px + var order = d1_unit.order.value; //[unit]の次数 + var orderx = form1.orderx.value; //movexの次数 + var ordery = form1.ordery.value; //moveyの次数 + + display1.movx = parseFloat(form1.movex.value)/pixel_length * Math.pow(10,-orderx-(-order));//px + display1.movy = parseFloat(form1.movey.value)/pixel_length * Math.pow(10,-ordery-(-order)); + displayImage(display1); + }else if(number == 2){ + var pixel_length = d2_unit.pixel_length.value; //[unit]/px + var order = d2_unit.order.value; //[unit]の次数 + var orderx = form2.orderx.value; //movexの次数 + var ordery = form2.ordery.value; //moveyの次数 + + display2.movx = parseFloat(form2.movex.value)/pixel_length * Math.pow(10,-orderx-(-order)); + display2.movy = parseFloat(form2.movey.value)/pixel_length * Math.pow(10,-ordery-(-order)); + displayImage(display2); + }else if(number == 4){ + var pixel_length = d4_unit.pixel_length.value; //[unit]/px + var order = d4_unit.order.value; //[unit]の次数 + var orderx = form4.orderx.value; //movexの次数 + var ordery = form4.ordery.value; //moveyの次数 + + display4.movx = parseFloat(form4.movex.value)/pixel_length * Math.pow(10,-orderx-(-order)); + display4.movy = parseFloat(form4.movey.value)/pixel_length * Math.pow(10,-ordery-(-order)); + displayImage(display4); + } +} + +//回転角を０に戻す関数 +function rotation_init(number,display){ + if(number == 1){ + form1.angle.value = 0; + display.angle = parseFloat(form1.angle.value); + }else if(number == 2){ + form2.angle.value = 0; + display.angle = parseFloat(form2.angle.value); + } +} + +//倍率を１に戻す関数 +function magnification_init(number,display){ + if(number == 1){ + form1.magnification.value = 1.00; + display.magnification = parseFloat(form1.magnification.value); + }else if(number == 2){ + form2.magnification.value = 1.00; + display.magnification = parseFloat(form2.magnification.value); + }else if(number == 4){ + form4.magnification.value = 1.00; + display.magnification = parseFloat(form4.magnification.value); + } +} + +//平行移動パラメータの初期化 +function move_params_init(number,display){ + if(number == 1){ + form1.movex.value = 0; + form1.movey.value = 0; + display.movx = parseFloat(form1.movex.value); + display.movy = parseFloat(form1.movey.value); + }else if(number == 2){ + form2.movex.value = 0; + form2.movey.value = 0; + display.movx = parseFloat(form2.movex.value); + display.movy = parseFloat(form2.movey.value); + }else if(number == 4){ + form4.movex.value = 0; + form4.movey.value = 0; + display.movx = parseFloat(form4.movex.value); + display.movy = parseFloat(form4.movey.value); + } +} + +//全パラメータのリセット +function reseting(number){ + if(number == 1){ + move_params_init(number,display1); + rotation_init(number,display1); + magnification_init(number,display1); + displayImage(display1); + }else if(number == 2){ + move_params_init(number,display2); + rotation_init(number,display2); + magnification_init(number,display2); + displayImage(display2); + }else if(number == 4){ + move_params_init(number,display4); + magnification_init(number,display4); + displayImage(display4); + } +} + +//テーブルに画像を受け付ける行を追加 +function add_table(){ + var tbody = document.getElementById("tbody_thumbnail_files"); + var tr = tbody.rows; + if(tr.length > 0 && !thumbnails[tr.length - 1].file){ + window.alert("Please upload image file at No." + (tr.length)); + return false; + } + + var new_tr = tbody.insertRow(-1); + var row_index = new_tr.rowIndex; + + var number_td = new_tr.insertCell(-1); + var imageflie_td = new_tr.insertCell(-1); + var configflie_td = new_tr.insertCell(-1); + var delete_button = new_tr.insertCell(-1); + + thumbnail_add(row_index); + + number_td.innerHTML = thumbnails[row_index - 1].thumbnail_number; + imageflie_td.innerHTML = ""; + configflie_td.innerHTML = "" + delete_button.innerHTML = ""; +} + +//テーブルから行削除 +function delete_table(row_index){ + var tbody = document.getElementById("tbody_thumbnail_files"); + var row_length = tbody.rowIndex; + + tbody.deleteRow(row_index - 1); + thumbnail_del(row_index); + + for(var j = 0; j <= thumbnails.length - row_index; j++){ + var tr = tbody.rows[row_index + j - 1]; + var number_td = tr.cells[0]; + number_td.innerHTML = thumbnails[row_index + j - 1].thumbnail_number; + } + //console.log(thumbnails); +} + +//テーブル全消去 +function clear_table(){ + var tbody = document.getElementById("tbody_thumbnail_files"); + var row_length = tbody.rows.length; + + for(var i = 0; i < Math.ceil(row_length / 2); i++){//6->3,7->4 + tbody.deleteRow(-1); + if(tbody.rows.length != 0){//奇数用 + tbody.deleteRow(-1); + } + thumbnail_clr(row_length - i - 1); + } +} + +//画像のデータ保持のための配列に追加 +function thumbnail_add(row_index){ + var thumbnail = new Display(); + thumbnail.thumbnail_number = row_index; + thumbnails.push(thumbnail); + //console.log(thumbnails); +} + +//削除 +function thumbnail_del(row_index){ + var tbody = document.getElementById("thumbnail_canvas"); + var row_length = tbody.rows.length; + if(row_index%2==1){ + for(var i=Math.ceil(row_index/2); i<=row_length; i++){ + tbody.deleteRow(-1); + } + }else if(row_index%2==0){ + for(var i=Math.ceil(row_index/2); i行追加,　even->列追加 + if(thumbnail.thumbnail_number % 2 == 1){ + var new_tr = tbody.insertRow(-1); + var odd_canvas_td = new_tr.insertCell(-1); + + odd_canvas_td.innerHTML = "
" + thumbnail.thumbnail_number; + thumbnail.canvas = document.getElementById(id); + thumbnail.context = thumbnail.canvas.getContext('2d'); + displayImage(thumbnail); + + }else if(thumbnail.thumbnail_number % 2 == 0){ + var tr = tbody.rows[thumbnail.thumbnail_number / 2 - 1]; + var even_canvas_td = tr.insertCell(-1); + + even_canvas_td.innerHTML = "
" + thumbnail.thumbnail_number; + thumbnail.canvas = document.getElementById(id); + thumbnail.context = thumbnail.canvas.getContext('2d'); + displayImage(thumbnail); + } +} + +//ThumbnailからクリックでDisplay2に反映 +function ThumbnailsToDisplay2(number){ + display2.file = thumbnails[number-1].file; + display2.magnification = thumbnails[number-1].magnification; + display2.angle = thumbnails[number-1].angle; + display2.movx = thumbnails[number-1].movx; + display2.movy = thumbnails[number-1].movy; + display2.thumbnail_number = number; + form2.magnification.value = thumbnails[number-1].magnification; + form2.angle.value = thumbnails[number-1].angle; + form2.movex.value = thumbnails[number-1].movx; + form2.movey.value = thumbnails[number-1].movy; + displayImage(display2); + show_config(number); +} + +//Display2で表示時に変更したパラメータをデータ保持配列に格納 +function Display2ToThumbnails(number){ + thumbnails[number-1].file = display2.file; + thumbnails[number-1].magnification = display2.magnification; + thumbnails[number-1].angle = display2.angle; + thumbnails[number-1].movx = display2.movx; + thumbnails[number-1].movy = display2.movy; +} + +//Blend Elementsの表示の削除とblend()の呼び出し +function blend_switch(what){ + if(what == 'thumbnails'){ + + var blend_elements_area = document.getElementById("blend_elements"); + blend_elements_area.innerHTML = ""; + + if(thumbnails.length == 0){ + window.alert("Please upload image to Imagelist."); + return false; + } + + blend(blend_elements,display3,1) + } +} + +var blend_elements = [];//BlendElementsのデータ保持 + +//BlendElementsの生成 +function make_blend_elements(){//他関数内でcanvasのdata配列を取得する時canvasに完全に描画済みでないといけないので関数として分けることで冗長性を出し実現させている。 + var blend_elements_area = document.getElementById("blend_elements"); + blend_elements = [];//初期化 + + for(var i=0; i<=thumbnails.length; i++){ + var id = "blend_elements" + i; + var text = ""; + + blend_elements_area.insertAdjacentHTML('beforeend',text); + blend_elements[i] = new Display(); + if(i==0){//dispolay1の写し + blend_elements[i].file = display1.file; + blend_elements[i].magnification = display1.magnification; + blend_elements[i].movx = display1.movx; + blend_elements[i].movy = display1.movy; + blend_elements[i].angle = display1.angle; + }else{//thumbnailの拡大写し + blend_elements[i].file = thumbnails[i-1].file; + blend_elements[i].magnification = thumbnails[i-1].magnification; + blend_elements[i].movx = thumbnails[i-1].movx; + blend_elements[i].movy = thumbnails[i-1].movy; + blend_elements[i].angle = thumbnails[i-1].angle; + } + blend_elements[i].canvas = document.getElementById(id); + blend_elements[i].context = blend_elements[i].canvas.getContext('2d'); + blend_elements[i].canvas.width = CANVAS_SIZE; + blend_elements[i].canvas.height = CANVAS_SIZE; + displayImage(blend_elements[i]); + //console.log(blend_elements[i]); + } +} + +//合成の下準備と合成画像の表示 +function blend(blend_resorce, display, color_change_flag){//配列（ブレンド元）,表示先,1有or0無 + + //元 + var image = []; + for(var i=0; i"; + arrow_td.innerHTML = "➡︎"; + after_color_td.innerHTML = ""; + } +} + +//color tableのcolorをリセット +function color_reset(){ + var before_id_d1 = "before_color_display1"; + var after_id_d1 = "after_color_display1"; + var before_id = "before_color_"; + var after_id = "after_color_"; + + for(var i=0; i<=thumbnails.length; i++){ + if(i==0){ + before_color = document.getElementById(before_id_d1); + after_color = document.getElementById(after_id_d1); + }else{ + before_color = document.getElementById(before_id + i); + after_color = document.getElementById(after_id + i); + } + before_color.value = 0; + after_color.value = 0; + } + blend_switch('thumbnails'); +} + +//ピクセル配列の値(色情報)の書き換え +function color_change(image_rgba, index){ + var max, min; + var R,G,B; + var H; + var before_color,after_color; + var diff_color; + + if(index==0){ + var before_id = "before_color_display1"; + var after_id = "after_color_display1"; + }else{ + var before_id = "before_color_" + index; + var after_id = "after_color_" + index; + } + + //console.log(index); + before_color = document.getElementById(before_id).value; + after_color = document.getElementById(after_id).value; + diff_color = after_color - before_color; + /* + console.log("before_color is..."+before_color); + console.log("after_color is..."+after_color); + console.log("diff_color is..."+diff_color); + */ + /**********RGB->HSV***********/ + for (var i = 0; i < image_rgba.length ; i++){ + R = image_rgba[i * 4] / 255;//RGBAの値は0-255で与えられている + G = image_rgba[i * 4 + 1] / 255; + B = image_rgba[i * 4 + 2] / 255; + + if(R == G && G == B){ + continue; + }else if(R >= G && R >= B){ + if(G >= B){ + max = R; + min = B; + }else if(B > G){ + max = R; + min = G; + } + }else if(G >= R && G >= B){ + if(R >= B){ + max = G; + min = B; + }else if(B > R){ + max = G; + min = R; + } + }else if(B >= R && B >= G){ + if(R >= G){ + max = B; + min = G; + }else if(G > R){ + max = B; + min = R; + } + } + + if(max == R){ + H = 60 * (G - B)/(max - min); + H %= 360; + }else if(max == G){ + H = (60 * (B - R) / (max - min)) + 120; + H %= 360; + }else if(max == B){ + H = (60 * (R - G) / (max - min)) + 240; + H %= 360; + } + + /*****************color change*************************/ + //値書き換え（色相変換） + if (before_color != 1 && after_color != 1){//両方赤でない + if(H >= (before_color-1) * 60 -30 && H < (before_color * 60 -30)){ + H = H + 60 * diff_color; + } + }else if(before_color == 1 && after_color != 1){//前者が赤 + if(H >= 0 && H < 30){ + H = H + 60 * diff_color; + }else if(H >= 330 && H <= 360){ + H = H - 60 * (6 - diff_color); + } + }else if(before_color != 1 && after_color == 1){//後者が赤 + if(H >= (before_color - 1) * 60 -30 && H < (before_color - 1) * 60 ){ + H = H + 60 * (6 + diff_color); + }else if(H >= (before_color - 1) * 60 && H < before_color * 60 -30){ + H = H + 60 * diff_color; + } + }else{ + continue; + } + + /***********************HSV->RGB************************/ + if(H >= 0 && H < 60){ + R = max; + G = (H / 60) * (max - min) + min; + B = min; + }else if(H >= 60 && H < 120){ + R = -((H-120) / 60) * (max - min) + min; + G = max; + B = min; + }else if(H >= 120 && H < 180){ + R = min + G = max; + B = ((H-120) / 60) * (max - min) + min; + }else if(H >= 180 && H < 240){ + R = min + G = -((H-240) / 60) * (max - min) + min; + B = max; + }else if(H >= 240 && H < 300){ + R = ((H-240) / 60) * (max - min) + min; + G = min; + B = max; + }else if(H >= 300 && H <= 360){ + R = max; + G = min; + B = (-(H-360) / 60) * (max - min) + min; + }else{ + continue; + } + + image_rgba[i * 4] = R * 255; + image_rgba[i * 4 + 1] = G * 255; + image_rgba[i * 4 + 2] = B * 255; + + } + return image_rgba; +} + + //getImageDataのdataで取り出される配列が持つ意味 + /* + image_rgba[count * 4] //R + image_rgba[count * 4 + 1] //G + image_rgba[count * 4 + 2] //B + image_rgba[count * 4 + 3] //A + */ + +//新しい画像の生成 +function make_new_Image(image_rgbas, new_image_rgba){ + var image_amount = 0; + var white_pixel_amount=0;//同座標上のピクセルでそのピクセルが白(0,0,0,0)である数 + //new_image_rgbaは255以上になるとカンストするからこれでクッションを置く + var new_image_r = 0; + var new_image_g = 0; + var new_image_b = 0; + var new_image_a = 0; + //console.log(new_image_rgba.length); + //縮小した際に画像ではないピクセルはRGBA(0,0,0,0)だから、合成色を求める計算で母数から外している。色は足しているが各値が０なので考慮しないのと同義。 + for(var j=0; j mm,mim,nm ...ピクセルの寸法と元画像の大きさから算出 + x *= pixel_length * Math.pow(10,-order1-(-order2)) / display4.magnification; + y *= pixel_length * Math.pow(10,-order1-(-order2)) / display4.magnification; + + var coordinate = new Coordinate(); + coordinate.x = parseFloat(x.toFixed(2)); + coordinate.y = parseFloat(y.toFixed(2)); + coordinate.z = 0; + + return coordinate; +} + +//現在のマウスカーソル座標の表示　マウスが動くと発火イベント +document.getElementById("canvas4").addEventListener("mousemove", function(event){ + var current_coordinate = document.getElementById("current_coordinate"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event); + if(!IMAGE_SIZE){ + return false; + }else{ + current_coordinate.innerHTML = "x: " + coordinate.x + " y:" + coordinate.y + " z:" + coordinate.z; + } +}); + +//クリックしたマウスカーソル座標を取得　クリックすると発火イベント +document.getElementById("canvas4").addEventListener("click", function(event){ + if(0){//display4に合成画像が表示されているかどうか + window.alert("Please load image file."); + move_params_init(); + return false; + }else{ + var current_coordinate = document.getElementById("click_coordinate"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event); + add_list(coordinate); + } +}); + +var coordinate_database = []; //座標のオブジェクトを格納する配列 + +//クリックした座標データを表に反映、データ保持配列に格納 +function add_list(coordinate){ + + var tbody = document.getElementById("coordinate_table_tbody"); + var new_tr = tbody.insertRow(-1); + var row_Index = new_tr.rowIndex; //row's index (start = 1) equal to table numbering + + var number_td = new_tr.insertCell(-1); + var x_td = new_tr.insertCell(-1); + var y_td = new_tr.insertCell(-1); + var z_td = new_tr.insertCell(-1); + var button_td = new_tr.insertCell(-1); + + coordinate.number = row_Index; + + //表に反映 + number_td.innerHTML = coordinate.number; + x_td.innerHTML = coordinate.x; + y_td.innerHTML = coordinate.y; + z_td.innerHTML = coordinate.z; + button_td.innerHTML = ''//this.parentNode.parentNode.rowIndex -> Row number in list + + //新しい座標データが来た時、coordinate_databaseに格納 + if(coordinate_database.length == row_Index - 1){ + coordinate_database[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + /* + for(var j = 0; j < coordinate_database.length; j++){ + console.log(coordinate_database[j]); + } + */ +} + +//クリックした座標行を削除、データ保持配列からの削除 +function dele_list(row_number){ + var tbody = document.getElementById("coordinate_table_tbody"); + var rows_length = tbody.rows.length; + for(var i=row_number; i <= rows_length; i++){ + tbody.deleteRow(row_number-1);//deleteRow(0) -> delete table's 1st row. + } + + coordinate_database.splice(row_number-1,1);//delete 1 data[row_number-1] from coordinate_database + + //ボタンを押した階層より後の同レベル階層を削除（Table） + //配列データ(coordinate database)は座標データを残しaddlistに送ってnumberを書き換えtableに反映 + for(j = row_number - 1; j < coordinate_database.length; j++){ + add_list(coordinate_database[j]) + } +} + +//座標行、データ保持配列の全消去 +function all_clear(){ + var tbody = document.getElementById("coordinate_table_tbody"); + var rows_length = tbody.rows.length; + + for(var i=1; i <= rows_length; i++){ + tbody.deleteRow(-1); + coordinate_database.pop(); //最下層まで消す + } + //console.log(coordinate_database); +} + +//座標データをファイルに書き出しローカルに保存 +function download(){ + var number; + var x; + var y; + var z; + + var text = ""; + //リストをテキストにする + for(var i=0; i mm,mim,nm ...ピクセルの寸法と元画像の大きさから算出 + x *= pixel_length * Math.pow(10,-order1-(-order2))/* / display4.magnification*/; + y *= pixel_length * Math.pow(10,-order1-(-order2))/* / display4.magnification*/; + + var coordinate = new Coordinate(); + coordinate.x = parseFloat(x.toFixed(2)); + coordinate.y = parseFloat(y.toFixed(2)); + coordinate.z = 0; + + return coordinate; +} + +//現在のマウスカーソル座標の表示　マウスが動くと発火イベント--canvas1 +document.getElementById("canvas1").addEventListener("mousemove", function(event){ + var current_coordinate = document.getElementById("current_coordinate_on_canvas1"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event,"canvas1"); + current_coordinate.innerHTML = "(" + coordinate.x + "," + coordinate.y + "," + coordinate.z + ")"; +}); + +//現在のマウスカーソル座標の表示　マウスが動くと発火イベント--canvas2 +document.getElementById("canvas2").addEventListener("mousemove", function(event){ + var current_coordinate = document.getElementById("current_coordinate_on_canvas2"); + var coordinate = new Coordinate(); + coordinate = calculate_xy(event,"canvas2"); + current_coordinate.innerHTML = "(" + coordinate.x + "," + coordinate.y + "," + coordinate.z + ")"; +}); + +//クリックしたマウスカーソル座標を取得　クリックすると発火イベント--canvas1 +document.getElementById("canvas1").addEventListener("click", function(event){ + if(0){//Displayに合成画像が表示されているかどうか　未搭載 + window.alert("Please load image file."); + //move_params_init(); + return false; + }else{ + var m_or_t = table1_mort.m_or_t.value; + var coordinate = new Coordinate(); + coordinate = calculate_xy(event,"canvas1"); + add_list(coordinate,"canvas1",m_or_t); + } +}); + +// +document.onkeydown=function(event){ + console.log(event.keyCode); + if(event.keyCode == 65){ + var m_or_t = table1_mort.m_or_t.value; + var coordinate = new Coordinate(); + coordinate = calculate_xy(event,"canvas1"); + add_list(coordinate,"canvas1",m_or_t); + } +} + + +//クリックしたマウスカーソル座標を取得　クリックすると発火イベント--canvas2 +document.getElementById("canvas2").addEventListener("click", function(event){ + if(0){//Displayに合成画像が表示されているかどうか + window.alert("Please load image file."); + //move_params_init(); + return false; + }else{ + var m_or_t = table2_mort.m_or_t.value; + var coordinate = new Coordinate(); + coordinate = calculate_xy(event,"canvas2"); + add_list(coordinate,"canvas2",m_or_t); + } +}); + +/***************************************/ +/*座標をやりっとりする場合この配列を扱えば良い*/ +//座標のオブジェクトを格納する配列 +var canvas1_marker_data = []; +var canvas1_target_data = []; +var canvas2_marker_data = []; +var canvas2_marker_ast_data = []; +var canvas2_target_ast_data = []; +/***************************************/ + + +//クリックした座標データを表に反映、データ保持配列に格納 +function add_list(coordinate,canvasid,m_or_t){ + if(canvasid=="canvas1"){ + if(m_or_t == "marker"){ + var tbody = document.getElementById("canvas1_marker_tbody"); + }else if(m_or_t == "target"){ + var tbody = document.getElementById("canvas1_target_tbody"); + } + }else if(canvasid="canvas2"){ + if(m_or_t == "marker"){ + var tbody = document.getElementById("canvas2_marker_tbody"); + }else if(m_or_t == "marker_ast"){ + var tbody = document.getElementById("canvas2_marker_ast_tbody"); + }else if(m_or_t == "target_ast"){ + var tbody = document.getElementById("canvas2_target_ast_tbody"); + } + } + + var new_tr = tbody.insertRow(-1); + var row_Index = new_tr.rowIndex; //row's index (start = 1) equal to table numbering + + var coordinate_td = new_tr.insertCell(-1); + + coordinate.number = row_Index; + + //表に反映 + if(canvasid == "canvas1"){ + coordinate_td.innerHTML = "No."+coordinate.number+ "
("+coordinate.x+","+coordinate.y+","+coordinate.z+")"; + }else if(canvasid == "canvas2"){ + coordinate_td.innerHTML = "No."+coordinate.number+ "
("+coordinate.x+","+coordinate.y+","+coordinate.z+")"; + } + + //新しい座標データが来た時、任意_dataに格納 + if(canvasid=="canvas1"){ + if(m_or_t == "marker"){ + if(canvas1_marker_data.length == row_Index - 1){ + canvas1_marker_data[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + }else if(m_or_t == "target"){ + if(canvas1_target_data.length == row_Index - 1){ + canvas1_target_data[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + } + }else if(canvasid="canvas2"){ + if(m_or_t == "marker"){ + if(canvas2_marker_data.length == row_Index - 1){ + canvas2_marker_data[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + }else if(m_or_t == "marker_ast"){ + if(canvas2_marker_ast_data.length == row_Index - 1){ + canvas2_marker_ast_data[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + }else if(m_or_t == "target_ast"){ + if(canvas2_target_ast_data.length == row_Index - 1){ + canvas2_target_ast_data[row_Index - 1] = new Coordinate(coordinate.number,coordinate.x,coordinate.y,coordinate.z); + } + } + } + /* + console.log(canvas1_marker_data); + console.log(canvas1_target_data); + console.log(canvas2_marker_data); + console.log(canvas2_marker_ast_data); + console.log(canvas2_target_ast_data); + */ +} + +function clearTable_canvas1(){ + if(table1_mort.m_or_t.value == "marker"){ + var tbody = document.getElementById("canvas1_marker_tbody"); + canvas1_marker_data = []; + }else if(table1_mort.m_or_t.value == "target"){ + var tbody = document.getElementById("canvas1_target_tbody"); + canvas1_target_data = []; + } + + var rows_length = tbody.rows.length; + for(var i=1; i <= rows_length; i++){ + tbody.deleteRow(-1); + } +} + +function deleteTable_canvas1(){ + if(table1_mort.m_or_t.value == "marker"){ + var tbody = document.getElementById("canvas1_marker_tbody"); + canvas1_marker_data.pop(); + }else if(table1_mort.m_or_t.value == "target"){ + var tbody = document.getElementById("canvas1_target_tbody"); + canvas1_target_data.pop(); + } + + tbody.deleteRow(-1); + +} + +function deleteTable_canvas2(){ + if(table2_mort.m_or_t.value == "marker"){ + var tbody = document.getElementById("canvas2_marker_tbody"); + canvas2_marker_data.pop(); + }else if(table2_mort.m_or_t.value == "marker_ast"){ + var tbody = document.getElementById("canvas2_marker_ast_tbody"); + canvas2_marker_ast_data.pop(); + }else if(table2_mort.m_or_t.value == "target_ast"){ + var tbody = document.getElementById("canvas2_target_ast_tbody"); + canvas2_target_ast_data.pop(); + } + tbody.deleteRow(-1); +} + +function deleteTable(rowIndex,canvasid){ + if(canvasid=="canvas1"){ + if(table1_mort.m_or_t.value == "marker"){ + var m_or_t = "marker"; + var tbody = document.getElementById("canvas1_marker_tbody"); + canvas1_marker_data.splice(rowIndex-1,1);//delete 1 data[row_number-1] from coordinate_data + }else if(table1_mort.m_or_t.value == "target"){ + var m_or_t = "target"; + var tbody = document.getElementById("canvas1_target_tbody"); + canvas1_target_data.splice(rowIndex-1,1); + } + }else if(canvasid=="canvas2"){ + if(table2_mort.m_or_t.value == "marker"){ + var m_or_t = "marker"; + var tbody = document.getElementById("canvas2_marker_tbody"); + canvas2_marker_data.splice(rowIndex-1,1); + }else if(table2_mort.m_or_t.value == "marker_ast"){ + var m_or_t = "marker_ast"; + var tbody = document.getElementById("canvas2_marker_ast_tbody"); + canvas2_marker_ast_data.splice(rowIndex-1,1); + }else if(table2_mort.m_or_t.value == "target_ast"){ + var m_or_t = "target_ast"; + var tbody = document.getElementById("canvas2_target_ast_tbody"); + canvas2_target_ast_data.splice(rowIndex-1,1); + } + } + + var rows_length = tbody.rows.length; + for(var i=rowIndex; i <= rows_length; i++){ + tbody.deleteRow(rowIndex-1);//deleteRow(0) -> delete table's 1st row. + } + + //coordinate_database.splice(row_number-1,1);//delete 1 data[row_number-1] from coordinate_database + + //ボタンを押した階層より後の同レベル階層を削除（Table） + //配列データ(coordinate database)は座標データを残しaddlistに送ってnumberを書き換えtableに反映 + if(canvasid=="canvas1"){ + if(table1_mort.m_or_t.value == "marker"){ + for(var j = rowIndex - 1; j < canvas1_marker_data.length; j++){ + add_list(canvas1_marker_data[j],canvasid,m_or_t) + } + }else if(table1_mort.m_or_t.value == "target"){ + for(var j = rowIndex - 1; j < canvas1_target_data.length; j++){ + add_list(canvas1_target_data[j],canvasid,m_or_t) + } + } + }else if(canvasid=="canvas2"){ + if(table2_mort.m_or_t.value == "marker"){ + for(var j = rowIndex - 1; j < canvas2_marker_data.length; j++){ + add_list(canvas2_marker_data[j],canvasid,m_or_t) + } + }else if(table2_mort.m_or_t.value == "marker_ast"){ + for(var j = rowIndex - 1; j < canvas2_marker_ast_data.length; j++){ + add_list(canvas2_marker_ast_data[j],canvasid,m_or_t) + } + }else if(table2_mort.m_or_t.value == "target_ast"){ + for(var j = rowIndex - 1; j < canvas2_target_ast_data.length; j++){ + add_list(canvas2_target_ast_data[j],canvasid,m_or_t) + } + } + } +} + +/*****************************************************************/ +/*****************************************************************/ +/*************************** canvas表示 ***************************/ +/*****************************************************************/ +/*****************************************************************/ + + +//ローカルファイルの読み取り +function loadFile(files,canvasid){ + file = files[0]; + + if(canvasid == "canvas1"){ + console.log("canvas1"); + canvas1Display.file = file; + canvas1Display.context.clearRect(0,0,canvas1Display.canvas.width,canvas1Display.canvas.height); + //magnification_init(display1); + //rotation_init(display1); + //move_params_init(display1); + displayImage(canvas1Display); + }else if(canvasid == "canvas2"){ + console.log("canvas2"); + canvas2Display.file = file; + canvas2Display.context.clearRect(0,0,canvas2Display.canvas.width,canvas2Display.canvas.height); + //magnification_init(display1); + //rotation_init(display1); + //move_params_init(display1); + displayImage(canvas2Display); + } +} + +function displayImage(display){ + var width; + var height; + var left; + var to; + var imageAspect=0; + var image = new Image(); + var reader = new FileReader(); + + + reader.onload = function(event){ + image.onload = function(){ + + //canvasのアンチエイリアスを無効 + display.context.mozImageSmoothingEnabled = false; + display.context.webkitImageSmoothingEnabled = false; + display.context.msImageSmoothingEnabled = false; + display.context.imageSmoothingEnabled = false + + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = display.canvas.width; + height = display.canvas.height / imageAspect; + to = (display.canvas.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = display.canvas.width * imageAspect; + height = display.canvas.height; + left = (display.canvas.width - width) / 2; + } + + //ファイルアップロード2回目以降のcanvasの初期化 + display.context.clearRect(0,0,display.canvas.width,display.canvas.height); + + + /****************変換適用***********************************************/ + //display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2));//コンテキストに対する効果の始点を中心に移動 + //display.context.scale(display.magnification,display.magnification);//倍率をコンテキストに反映 + //display.context.rotate(display.angle / 180 * Math.PI);//回転をコンテキストに反映 + //display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /**************************************************************************/ + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + //display.context.drawImage(image, 0, 0, image.width, image.height, left+display.movx, to-display.movy, width, height); + display.context.drawImage(image, 0, 0, image.width, image.height, left, to, width, height); + + /*****************変換調整***********************************************/ + //display.context.translate(parseInt(display.canvas.width / 2),parseInt(display.canvas.height / 2)); //コンテキストに対する効果の始点を中心に移動 + //display.context.scale(1 / display.magnification,1 / display.magnification);//画像の倍率の初期化 + //display.context.rotate(-1 * display.angle / 180 * Math.PI);//角度の初期化 + //display.context.translate(-parseInt(display.canvas.width / 2),-parseInt(display.canvas.height / 2)); + /****************************************************************************/ + } + image.src = event.target.result; + } + + //if(display.file && display.file.type.match('image.*')){ + if(display.file.type.match('image.*')){ + reader.readAsDataURL(display.file); + console.log("readasdataURL"); + } + //}else{ + // console.log("false"); + // return false; + // + //} +} \ No newline at end of file diff --git a/JS/html5shiv-3.7.0.js b/JS/html5shiv-3.7.0.js deleted file mode 100755 index e2e0015..0000000 --- a/JS/html5shiv-3.7.0.js +++ /dev/null @@ -1,8 +0,0 @@ -/* - HTML5 Shiv v3.7.0 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed -*/ -(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag(); -a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x"; -c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode|| -"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f); -if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d767){$('.vert-nav').css('height',logoHeight+60)}else{$('.vert-nav').css('height','auto')}}vertNavHeight();$(window).resize(vertNavHeight);function vertNavRightHeight(){var logoHeight1=$('.logo-l9 img').height();if($(window).width()>991){$('.vert-nav-whole-9').css('height',logoHeight1+60)}else{$('.vert-nav-whole-9').css('height','auto')}var logoHeight2=$('.logo-l10 img').height();if($(window).width()>991){$('.vert-nav-whole-10').css('height',logoHeight2+60)}else{$('.vert-nav-whole-10').css('height','auto')}}vertNavRightHeight();$(window).resize(vertNavRightHeight);$('body').append('
');$(window).scroll(function(){if($(this).scrollTop()!=0){$('#toTop').fadeIn()}else{$('#toTop').fadeOut()}});$('#toTop').click(function(){$('body,html').animate({scrollTop:0},600)})}); \ No newline at end of file diff --git a/JS/map.js b/JS/map.js old mode 100644 new mode 100755 diff --git a/JS/unused/mscontrol.js b/JS/mscontrol.js old mode 100644 new mode 100755 similarity index 100% rename from JS/unused/mscontrol.js rename to JS/mscontrol.js diff --git a/JS/realtimeCamera.js b/JS/realtimeCamera.js old mode 100644 new mode 100755 diff --git a/JS/respond-1.4.2.min.js b/JS/respond-1.4.2.min.js deleted file mode 100755 index 4bd176e..0000000 --- a/JS/respond-1.4.2.min.js +++ /dev/null @@ -1,5 +0,0 @@ -/*! Respond.js v1.4.2: min/max-width media query polyfill * Copyright 2013 Scott Jehl - * Licensed under https://github.com/scottjehl/Respond/blob/master/LICENSE-MIT - * */ - -!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='­',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){u(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))};if(c.ajax=f,c.queue=d,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\([\s]*min\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/,maxw:/\([\s]*max\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var g,h,i,j=a.document,k=j.documentElement,l=[],m=[],n=[],o={},p=30,q=j.getElementsByTagName("head")[0]||k,r=j.getElementsByTagName("base")[0],s=q.getElementsByTagName("link"),t=function(){var a,b=j.createElement("div"),c=j.body,d=k.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=j.createElement("body"),c.style.background="none"),k.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&k.insertBefore(c,k.firstChild),a=b.offsetWidth,f?k.removeChild(c):c.removeChild(b),k.style.fontSize=d,e&&(c.style.fontSize=e),a=i=parseFloat(a)},u=function(b){var c="clientWidth",d=k[c],e="CSS1Compat"===j.compatMode&&d||j.body[c]||d,f={},o=s[s.length-1],r=(new Date).getTime();if(b&&g&&p>r-g)return a.clearTimeout(h),h=a.setTimeout(u,p),void 0;g=r;for(var v in l)if(l.hasOwnProperty(v)){var w=l[v],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?i||t():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?i||t():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(m[w.rules]))}for(var C in n)n.hasOwnProperty(C)&&n[C]&&n[C].parentNode===q&&q.removeChild(n[C]);n.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=j.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,q.insertBefore(E,o.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(j.createTextNode(F)),n.push(E)}},v=function(a,b,d){var e=a.replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var g=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},h=!f&&d;b.length&&(b+="/"),h&&(f=1);for(var i=0;f>i;i++){var j,k,n,o;h?(j=d,m.push(g(a))):(j=e[i].match(c.regex.findStyles)&&RegExp.$1,m.push(RegExp.$2&&g(RegExp.$2))),n=j.split(","),o=n.length;for(var p=0;o>p;p++)k=n[p],l.push({media:k.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:m.length-1,hasquery:k.indexOf("(")>-1,minw:k.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:k.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},w=function(){if(d.length){var b=d.shift();f(b.href,function(c){v(c,b.href,b.media),o[b.href]=!0,a.setTimeout(function(){w()},0)})}},x=function(){for(var b=0;b 0) { - jQuery('.camera_slider').camera({ - fx: 'random', - playPause: true, - pagination: false, - height: '400', - random: false - }); - } - - ///////////////////////////////////////////////////////////////// - // Fancybox - ///////////////////////////////////////////////////////////////// - - //if ($('body#gallery').is('*')) { // Uncomment to run script on specific page only - if(jQuery.browser.mobile) { - var myPhotoSwipe = $(".fancybox").photoSwipe({ enableMouseWheel: false , enableKeyboard: false }); - } - else { - // Single Image - //$("a.fancybox").fancybox(); - - // Multiple Images - $("a.fancybox[rel='gallery_group']").fancybox({ - 'transitionIn' : 'elastic', - 'transitionOut' : 'elastic', - 'speedIn' : 600, - 'speedOut' : 200 - }); - } - //} - - ///////////////////////////////////////////////////////////////// - // Animated Entrances - ///////////////////////////////////////////////////////////////// - - $(window).scroll(function() { - $('.animatedEntrance').each(function(){ - var imagePos = $(this).offset().top; - - var topOfWindow = $(window).scrollTop(); - if (imagePos < topOfWindow+400) { - $(this).addClass("slideUp"); // slideUp, slideDown, slideLeft, slideRight, slideExpandUp, expandUp, fadeIn, expandOpen, bigEntrance, hatch - } - }); - }); - - ///////////////////////////////////////////////////////////////// - // Form Validation - ///////////////////////////////////////////////////////////////// - - $('#custom_form').formValidation({ - validateText: ["name","message"], - validateEmail: ["email"], - validateSpam: true, - captchaTheme: 'greyscale' // default, mini, dark, mini-dark, light, mini-light, greyscale, mini-greyscale - }); - - ///////////////////////////////////////////////////////////////// - // GOOGLE MAPS - ///////////////////////////////////////////////////////////////// - - function map() { - var myLatlng = new google.maps.LatLng(-12.47518, 130.99042); - var mapOptions = { - zoom: 14, - center: myLatlng, - mapTypeId: google.maps.MapTypeId.ROADMAP, - scrollwheel: false, - styles: - [ - { - "featureType": "all", - "stylers": [ - { - "saturation": -100 - }, - { - "gamma": 0.5 - } - ] - } - ] - } - // For Contact Page - if ($('#map').length > 0) { - var map = new google.maps.Map(document.getElementById('map'), mapOptions); - var image = 'img/mapicon.png'; - var marker = new google.maps.Marker({ - position: myLatlng, - map: map, - icon: image - }); - google.maps.event.addDomListener(window, 'resize orientationchange', function() { - map.setCenter(myLatlng); - }); - } - // For Footer - if ($('#footer-map').length > 0) { - var map = new google.maps.Map(document.getElementById('footer-map'), mapOptions); - var image = 'img/mapicon.png'; - var marker = new google.maps.Marker({ - position: myLatlng, - map: map, - icon: image - }); - google.maps.event.addDomListener(window, 'resize orientationchange', function() { - map.setCenter(myLatlng); - }); - } - } - google.maps.event.addDomListener(window, 'load', map); - - ///////////////////////////////////////////////////////////////// - // YAY FOR LOLLIES! - ///////////////////////////////////////////////////////////////// - -}); \ No newline at end of file diff --git a/JS/unused/ele.jpg b/JS/unused/ele.jpg deleted file mode 100644 index 3897aca..0000000 Binary files a/JS/unused/ele.jpg and /dev/null differ diff --git a/JS/unused/emcontrol.js b/JS/unused/emcontrol.js deleted file mode 100644 index 1a71903..0000000 --- a/JS/unused/emcontrol.js +++ /dev/null @@ -1,277 +0,0 @@ -var emname; -console.log("emcontrol"); - -function emnamecatch(name){ - console.log("emnamecatch"); - emname=name; - var ajax=getAjax(); - - // ajax.open("GET","//localhost:9090/"+emname+"/init",true); - - $.ajax({ - url: 'http://localhost:9090/fei/init', - type: "GET", - success: function(res){ - console.log("success"); - } - }); - - console.log(emname); - } - -function emcondition(command) { - -var ajax=getAjax(); - - if (command == "request") { - var position1 = document.getElementById("Position"); - var GonioX = document.getElementById("GonioX"); - var GonioY = document.getElementById("GonioY"); - var GonioZ = document.getElementById("GonioZ"); - var GonioA = document.getElementById("GonioA"); - var tem = document.getElementById("tem"); - var SpotSizeIndex = document.getElementById("SpotSizeIndex"); - var MagIndex = document.getElementById("MagIndex"); - var Obj = document.getElementById("Obj"); - var BeamTiltX = document.getElementById("BeamTiltX"); - var BeamTiltY = document.getElementById("BeamTiltY"); - var Speed = document.getElementById("Speed"); - var position2 = document.getElementById("Position2"); - var GonioX2 = document.getElementById("GonioX2"); - var GonioY2 = document.getElementById("GonioY2"); - var GonioZ2 = document.getElementById("GonioZ2"); - var GonioA2 = document.getElementById("GonioA2"); - var tem2 = document.getElementById("tem2"); - var SpotSizeIndex2 = document.getElementById("SpotSizeIndex2"); - var MagIndex2 = document.getElementById("MagIndex2"); - var Obj2 = document.getElementById("Obj2"); - var BeamTiltX2 = document.getElementById("BeamTiltX2"); - var BeamTiltY2 = document.getElementById("BeamTiltY2"); - var Speed2 = document.getElementById("Speed2"); - var position3 = document.getElementById("Position3"); - var GonioX3 = document.getElementById("GonioX3"); - var GonioY3 = document.getElementById("GonioY3"); - var GonioZ3 = document.getElementById("GonioZ3"); - var GonioA3 = document.getElementById("GonioA3"); - var tem3 = document.getElementById("tem3"); - var SpotSizeIndex3 = document.getElementById("SpotSizeIndex3"); - var MagIndex3 = document.getElementById("MagIndex3"); - var Obj3 = document.getElementById("Obj3"); - var BeamTiltX3 = document.getElementById("BeamTiltX3"); - var BeamTiltY3 = document.getElementById("BeamTiltY3"); - var Speed3 = document.getElementById("Speed3"); - } else { - var position1 = document.anchorsgetElementById("result"); - var position2 = document.anchorsgetElementById("result"); - var position3 = document.anchorsgetElementById('result'); - } - - if (ajax) { - try { - ajax.onreadystatechange = getData; - console.log("getData"); - } catch (e) { - position1.innerHTML = "Onreadystate change error."; - } - try { - ajax.open("GET", "//localhost:9090/"+encodeURIComponent(emname)+"/get", true); - //console.log("//localhost:9090/"+encodeURIComponent(emname)+"/get"); - } catch (e) { - position1.innerHTML = "ajax open error"; - } - try { - ajax.send(null); - } catch (e) { - position1.innerHTML = "send error"; - } - - } else { - position1.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState == 4) { - if (ajax.status == 200) { - console.log("Hello!"); - var resultjson = ajax.responseText; - console.log(resultjson); - resultjson = JSON.parse(resultjson); - console.log(resultjson); - console.log(typeof resultjson); - /* - for (key in resultjson) { - console.log(key+":"+resultjson(key)); - } - */ - //position1.innerHTML=resultjson; - console.log(resultjson['GonioX']);//undefined - //tem.innerHTML = resultjson["TEM"]; - GonioX.innerHTML = resultjson["x"]; - GonioY.innerHTML = resultjson['y']; - GonioZ.innerHTML = resultjson['z']; - GonioA.innerHTML = resultjson['a']; - SpotSizeIndex.innerHTML = resultjson['SpotSizeIndex']; - MagIndex.innerHTML = resultjson['MagIndex']; - Obj.innerHTML = resultjson['Obj']; - BeamTiltX.innerHTML = resultjson['BeamTiltX']; - BeamTiltY.innerHTML = resultjson['BeamTiltY']; - Speed.innerHTML = resultjson['Speed']; - //tem2.innerHTML = resultjson["TEM"]; - GonioX2.innerHTML = resultjson["x"]; - GonioY2.innerHTML = resultjson['y']; - GonioZ2.innerHTML = resultjson['z']; - GonioA2.innerHTML = resultjson['a']; - SpotSizeIndex2.innerHTML = resultjson['SpotSizeIndex']; - MagIndex2.innerHTML = resultjson['MagIndex']; - Obj2.innerHTML = resultjson['Obj']; - BeamTiltX2.innerHTML = resultjson['BeamTiltX']; - BeamTiltY2.innerHTML = resultjson['BeamTiltY']; - Speed2.innerHTML = resultjson['Speed']; - //tem3.innerHTML = resultjson["TEM"]; - GonioX3.innerHTML = resultjson["x"]; - GonioY3.innerHTML = resultjson['y']; - GonioZ3.innerHTML = resultjson['z']; - GonioA3.innerHTML = resultjson['a']; - SpotSizeIndex3.innerHTML = resultjson['SpotSizeIndex']; - MagIndex3.innerHTML = resultjson['MagIndex']; - Obj3.innerHTML = resultjson['Obj']; - BeamTiltX3.innerHTML = resultjson['BeamTiltX']; - BeamTiltY3.innerHTML = resultjson['BeamTiltY']; - Speed3.innerHTML = resultjson['Speed']; - - // result.innerHTML = ajax.responseText; - } else { - position1.innerHTML = "HTTP transmission...."; - position2.innerHTML = "HTTP transmission...."; - position3.innerHTML = "HTTP transmission...."; - } - } - } -} - -function stagecontrol(command,absolutex,absolutey,absolutez,absolutea) { - - var ajax=getAjax(); - - if(command == "stage"){ - var result = document.getElementById("stage"); - var result2 = document.getElementById("stagetomo"); - var result3 = document.getElementById("stagemds"); - console.log('move'); - }else { - var result = document.getElementById("stage"); - var result2 = document.getElementById("stagetomo"); - var result3 = document.getElementById("stagemds"); - } - - if (ajax) { - /* try{ - ajax.onreadystatechange = getData; - }catch(e){ - result.innerHTML="Onreadystate change error."; - result2.innerHTML="Onreadystate change error."; - result3.innerHTML="Onreadystate change error."; - }*/ - - try{ - ajax.open("GET","//localhost:9090/"+encodeURIComponent(emname)+"/set/stagea?x="+encodeURIComponent(absolutex)+"&y="+encodeURIComponent(absolutey)+"&z="+encodeURIComponent(absolutez)+"&a="+encodeURIComponent(absolutea),true); - //document.getElementById("mid").innerHTML="absolutex="+absolutex+" absolutey="+absolutey; - }catch(e){ - result.innerHTML = "ajax open error"; - result2.innerHTML = "ajax open error"; - result3.innerHTML = "ajax open error"; - - } - - try { - ajax.send(null); - }catch (e) { - result.innerHTML ="send error"; - result2.innerHTML ="send error"; - result3.innerHTML ="send error"; - } - - }else { - result.innerHTML = "you cannot use ajax...."; - result2.innerHTML = "you cannot use ajax...."; - result3.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState==4) { - if (ajax.status==200) { - result.innerHTML = ajax.responseText; - result2.innerHTML = ajax.responseText; - result3.innerHTML = ajax.responseText; - }else { - result.innerHTML = "HTTP transmission...."; - result2.innerHTML = "HTTP transmission...."; - result3.innerHTML = "HTTP transmission...."; - } - } - } - } - - function objcontrol(command,obj) { - - var ajax=getAjax(); - - if(command == "obj"){ - var result = document.getElementById("obj"); - var result2 = document.getElementById("objtomo"); - var result3 = document.getElementById("objmds"); - console.log('move'); - }else { - var result = document.getElementById("obj"); - var result2 = document.getElementById("objtomo"); - var result3 = document.getElementById("objmds"); - } - - if (ajax) { - try{ - ajax.onreadystatechange = getData; - }catch(e){ - result.innerHTML="Onreadystate change error."; - result2.innerHTML="Onreadystate change error."; - result3.innerHTML="Onreadystate change error."; - } - - try{ - ajax.open("GET","//localhost:9090/"+encodeURIComponent(emname)+"/set/obj?obj="+encodeURIComponent(obj),true); - //document.getElementById("mid").innerHTML="absolutex="+absolutex+" absolutey="+absolutey; - }catch(e){ - result.innerHTML = "ajax open error"; - result2.innerHTML = "ajax open error"; - result3.innerHTML = "ajax open error"; - - } - - try { - ajax.send(null); - }catch (e) { - result.innerHTML ="send error"; - result2.innerHTML ="send error"; - result3.innerHTML ="send error"; - } - - }else { - result.innerHTML = "you cannot use ajax...."; - result2.innerHTML = "you cannot use ajax...."; - result3.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState==4) { - console.log("getData2") - if (ajax.status==200) { - result.innerHTML = ajax.responseText; - result2.innerHTML = ajax.responseText; - result3.innerHTML = ajax.responseText; - }else { - result.innerHTML = "HTTP transmission...."; - result2.innerHTML = "HTTP transmission...."; - result3.innerHTML = "HTTP transmission...."; - } - } - } - } diff --git a/JS/unused/file.js b/JS/unused/file.js deleted file mode 100644 index a70d903..0000000 --- a/JS/unused/file.js +++ /dev/null @@ -1,207 +0,0 @@ -/* - if(window.File && window.FileReader) { - //File API - alert("ご使用のブラウザはFile APIを実装しています"); - }else{ - alert("ご使用のブラウザはFile APIをサポートしていません"); - } - */ - -function filemethod() { - document.getElementById("con").innerHTML = "Please input File."; - var obj1 = document.getElementById("exsample"); - //ダイアログでファイルが選択された時 - obj1.addEventListener("change", function(evt) { - document.getElementById("con").innerHTML = "Complete upload!"; - var file = evt.target.files; - //FileReaderの作成 - var reader = new FileReader(); - //テキスト形式で読み込む - reader.readAsText(file[0]); - - //読込終了後の処理 - reader.onload = function(ev) { - //テキストエリアに表示する - document.getElementById("change").innerHTML = reader.result; - //console.log(typeof reader.result); - var textvalue; - textvalue = JSON.parse(reader.result); - //console.log(typeof textvalue); - document.forms.eucentric.maxtilt.value = textvalue['maxtilt']; - document.forms.eucentric.speed.value = textvalue['speed']; - document.forms.eucentric.zshift.value = textvalue['zshift']; - }; - }, false); -} - -function filemethod2() { - console.log('move this problem2!'); - document.getElementById("con2").innerHTML = "Please input File."; - var obj2 = document.getElementById("exsample2"); - //ダイアログでファイルが選択された時 - obj2.addEventListener("change", function(evt) { - document.getElementById("con2").innerHTML = "Complete upload!"; - console.log('move this loop!'); - var file2 = evt.target.files; - //FileReaderの作成 - var reader2 = new FileReader(); - //テキスト形式で読み込む - reader2.readAsText(file2[0]); - - - reader2.onload = function(ev) { - //テキストエリアに表示する - document.getElementById("change2").innerHTML = reader2.result; - //console.log(typeof reader.result); - var textvalue; - textvalue = JSON.parse(reader2.result); - //console.log(typeof textvalue); - document.forms.eucentric.maxtilt.value = textvalue['maxtilt']; - document.forms.eucentric.speed.value = textvalue['speed']; - document.forms.eucentric.zshift.value = textvalue['zshift']; - }; - }, false); -} - -function filemethod3() { - console.log('move this problem3!'); - document.getElementById("con3").innerHTML = "Please input File."; - var obj3 = document.getElementById("exsample3"); - //ダイアログでファイルが選択された時 - obj3.addEventListener("change", function(evt) { - document.getElementById("con3").innerHTML = "Complete upload!"; - console.log('move this loop!'); - var file3 = evt.target.files; - //FileReaderの作成 - var reader3 = new FileReader(); - //テキスト形式で読み込む - reader3.readAsText(file3[0]); - - - reader3.onload = function(ev) { - //テキストエリアに表示する - document.getElementById("change3").innerHTML = reader3.result; - //console.log(typeof reader.result); - var textvalue; - textvalue = JSON.parse(reader3.result); - //console.log(typeof textvalue); - document.forms.eucentric.maxtilt.value = textvalue['maxtilt']; - document.forms.eucentric.speed.value = textvalue['speed']; - document.forms.eucentric.zshift.value = textvalue['zshift']; - }; - }, false); -} - -function TextSave() { -//文字を取得 - var text = document.getElementById('text').value; -//ファイル名を取得、デフォルトは「mytext」 - var name = document.getElementById('name').value || 'mytext'; - -//テキストファイルを作成 - var blob = new Blob([text], {type: 'text/plain'}); - -//リンクを取得 - var link = document.getElementById('DL_link'); -//リンクにダウンロードするファイルをセット - link.href = window.URL.createObjectURL(blob); - -//もしダウンロード属性に対応していたら - if ('download' in link) { -//リンクにダウンロードする名前をセット - link.download = name + '.txt'; -//リンクをクリックしてダウンロードさせる - link.click(); - -//もし対応してなかったら - } else { -//メッセージを表示する - link.textContent = '右クリックから名前を付けて保存してください'; - } -} - -function CanvasSave(canvasid) { -//ファイル名を取得、デフォルトは「mytext」 - var name = document.getElementById('namephoto2').value || 'myphoto'; -//テキストファイルを作成 - var cvs = document.getElementById(canvasid); - var canvasimage = cvs.toDataURL(); - - //var blob = new Blob([text], {type: 'text/plain'}); - -//リンクを取得 - var linkcanvas = document.getElementById('DL_link_canvas'); -//リンクにダウンロードするファイルをセット - linkcanvas.href =canvasimage; - -//もしダウンロード属性に対応していたら - if ('download' in linkcanvas) { -//リンクにダウンロードする名前をセット - linkcanvas.download = name + '.tif'; -//リンクをクリックしてダウンロードさせる - linkcanvas.click(); - -//もし対応してなかったら - } else { -//メッセージを表示する - linkcanvas.textContent = '右クリックから名前を付けて保存してください'; - } -} - - - -function SaveFileContents() { - smaxtilt = document.forms.eucentric.maxtilt.value; - sspeed = document.forms.eucentric.speed.value; - szshift = document.forms.eucentric.zshift.value; - console.log(smaxtilt); - document.forms.save.text.value = '{"maxtilt":' + smaxtilt + ',"speed":' + sspeed + ',"zshift":' + szshift + '}'; - console.log(document.forms.save.text.value); -} - -function ConditionFileSave() { - - var tem = document.getElementById("tem").innerHTML; - var GonioX = document.getElementById("GonioX").innerHTML; - var GonioY = document.getElementById("GonioY").innerHTML; - var GonioZ = document.getElementById("GonioZ").innerHTML; - var GonioA = document.getElementById("GonioA").innerHTML; - var SpotSizeIndex = document.getElementById("SpotSizeIndex").innerHTML; - var MagIndex = document.getElementById("MagIndex").innerHTML; - var Obj = document.getElementById("Obj").innerHTML; - var BeamTiltX = document.getElementById("BeamTiltX").innerHTML; - var BeamTiltY = document.getElementById("BeamTiltY").innerHTML; - var Speed = document.getElementById("Speed").innerHTML; - var date = new Date(); - var Year = date.getFullYear(); - var Month = date.getMonth() + 1; - var day = date.getDate(); - - // document.getElementById("daysdata").innerHTML = Year + "/" + Month + "/" + day ; - -//文字を取得ファイルにはいるやつ - var text = "{'TEM';'"+tem+"','GonioX':'"+GonioX+"','GonioY':'"+GonioY+"','GonioZ':'"+GonioZ+"','GonioA':'"+GonioA+"','SpotSizeIndex':'"+SpotSizeIndex+"','MagIndex':'"+MagIndex+"','Obj':'"+Obj+"','BeamTiltX':'"+BeamTiltX+"','BeamTiltY':'"+BeamTiltY+"','Speed':'"+Speed+"','Date':'"+Year+'/'+Month+'/'+day+"'}"; -//ファイル名を取得、デフォルトは「mytext」 - var name = document.getElementById('name1').value || 'mytext'; - -//テキストファイルを作成 - var blob = new Blob([text], {type: 'text/plain'}); - -//リンクを取得 - var linkcondition = document.getElementById('DL_link_condition'); -//リンクにダウンロードするファイルをセット - linkcondition.href = window.URL.createObjectURL(blob); - -//もしダウンロード属性に対応していたら - if ('download' in linkcondition) { -//リンクにダウンロードする名前をセット - linkcondition.download = name + '.txt'; -//リンクをクリックしてダウンロードさせる - linkcondition.click(); - -//もし対応してなかったら - } else { -//メッセージを表示する - linkcondition.textContent = '右クリックから名前を付けて保存してください'; - } -} diff --git a/JS/unused/filecontrol.js b/JS/unused/filecontrol.js deleted file mode 100755 index 199b197..0000000 --- a/JS/unused/filecontrol.js +++ /dev/null @@ -1,101 +0,0 @@ -function fileListDialog(files){ - var name = new Array(); - var urn = new Array(); - var type = new Array(); - var size = new Array(); - var latest = new Array(); - - - i=0 - name[i] = files[i].name; - urn[i] = files[i].urn; - type[i] = files[i].type; - size[i] = files[i].size; - latest[i] = files[i].lastModifiedDate; - - //display file status - var output = "
The number of files is "+files.length+"
"; - output+="Name:"+name[i]+"
"+"URN:"+urn[i]+"
"+"Type:"+type[i]+"
"+"Size:"+size[i]+"
"+"Date:"+latest[i]+"
" - document.getElementById("filestatus").innerHTML = output; - - document.getElementById("filecontent").innerHTML = ""; - //get file contents - fileread(files,"filecontent","file"); - -} - -function fileread(blob,place,variable){ - var f = blob[i]; - var reader = new FileReader(); - - if(f.type.match("text.*")){ - reader.onload = function(e){ - document.getElementById(place).innerHTML = reader.result; - document.getElementById(variable).value = reader.result; - document.getElementById("flag").value = "text"; - } - reader.readAsText(f,"utf-8"); - } - - if(f.type.match("image.*")){ - reader.onload = function(e){ - var img = document.createElement("img"); - img.src = reader.result; - document.getElementById(place).appendChild(img); - document.getElementById(variable).value = reader.result; - document.getElementById("flag").value = "image"; - } - reader.readAsDataURL(f); - } - -} - - -function onDrop(event){ - var files = event.dataTransfer.files; - var disp = document.getElementById("disp"); - disp.innerHTML = ""; - - for(i=0;idownload_link'; - }else{ - result.innerHTML = "HTTP error!"; - } - }else{ - result.innerHTML = "HTTP Transmission!"; - } - } - -} - diff --git a/JS/unused/gamepad.js b/JS/unused/gamepad.js deleted file mode 100644 index 041be6e..0000000 --- a/JS/unused/gamepad.js +++ /dev/null @@ -1,19 +0,0 @@ -if(window.GamepadEvent){ - - // ------------------------------------------------------------ - // ゲームパッドを接続すると実行されるイベント - // ------------------------------------------------------------ - window.addEventListener("gamepadconnected",function(e){ - console.log("ゲームパッドが接続された"); - console.log(e.gamepad); - }); - - // ------------------------------------------------------------ - // ゲームパッドの接続を解除すると実行されるイベント - // ------------------------------------------------------------ - window.addEventListener("gamepaddisconnected",function(e){ - console.log("ゲームパッドの接続が解除された"); - console.log(e.gamepad); - }); - -} \ No newline at end of file diff --git a/JS/unused/mscontrol.js~ b/JS/unused/mscontrol.js~ deleted file mode 100644 index 3b51dbd..0000000 --- a/JS/unused/mscontrol.js~ +++ /dev/null @@ -1,45 +0,0 @@ -function mscontrol(command,catchvalue) { - - var ajax=getAjax(); - - if(command == "Brightnessset"){ - var result = document.getElementById("Brightness"); - }else if (command == "Voltageset") { - var result = document.getElementById("Voltage"); - }else { - var result = document.getElementById("result"); - } - - if (ajax) { - try{ - ajax.onreadystatechange = getData; - }catch(e){ - result.innerHTML="Onreadystate change error."; - } - - try{ - ajax.open("GET","//localhost:8000/cgi-bin/vemclient.rb?command="+encodeURIComponent(command)+"&catchvalue="+encodeURIComponent(catchvalue),true); - }catch(e){ - result.innerHTML = "ajax open error"; - } - - try { - ajax.send(null); - }catch (e) { - result.innerHTML ="send error"; - } - - }else { - result.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState==4) { - if (ajax.status==200) { - result.innerHTML = ajax.responseText; - }else { - result.innerHTML = "HTTP transmission...."; - } - } - } - } \ No newline at end of file diff --git a/JS/unused/option.js b/JS/unused/option.js deleted file mode 100644 index b19b508..0000000 --- a/JS/unused/option.js +++ /dev/null @@ -1,56 +0,0 @@ -// 背景色赤 -function bgColChangeDefault() { - document.body.style.backgroundImage = 'url(./img/psbg.png)'; -} - -// 背景色青 -function bgColChangeWhite() { - document.body.style.backgroundImage = 'url(img/white_background.png)'; -} - -// 背景色緑 -function bgColChangeGrey() { - document.body.style.backgroundImage = 'url(img/wg.gif)'; -} - -function FocusTab(tabname) { - // タブの色 - document.getElementById('mtab1').style.backgroundColor = '#005b95'; - document.getElementById('mtab2').style.backgroundColor = '#005b95'; - document.getElementById('mtab3').style.backgroundColor = '#005b95'; - document.getElementById('mtab4').style.backgroundColor = '#005b95'; - document.getElementById('mtab5').style.backgroundColor = '#005b95'; - //document.getElementById('mtab6').style.backgroundColor = '#005b95'; - //document.getElementById('mtab7').style.backgroundColor = '#005b95'; - document.getElementById('mtab8').style.backgroundColor = '#005b95'; - // 指定箇所のみ色を変更 - if (tabname) { - document.getElementById(tabname).style.backgroundColor = '#008BBB'; - } -} - -function invalidtabh() { - console.log("invalidtab()"); - document.getElementById('mtab3').style.backgroundColor = '#005b95'; - var mtab31 = document.getElementById('mtab31'); - mtab31.disabled = true; - mtab31.removeAttribute( "href" ); -} - -function FocusTabh(tabname) { - // タブの色 - document.getElementById('mtab1').style.backgroundColor = '#005b95'; - document.getElementById('mtab2').style.backgroundColor = '#005b95'; - document.getElementById('mtab4').style.backgroundColor = '#005b95'; - document.getElementById('mtab3').style.backgroundColor = '#005b95'; - document.getElementById('mtab5').style.backgroundColor = '#005b95'; - //document.getElementById('mtab6').style.backgroundColor = '#005b95'; - //document.getElementById('mtab7').style.backgroundColor = '#005b95'; - document.getElementById('mtab8').style.backgroundColor = '#005b95'; - // 指定箇所のみ色を変更 - if (tabname) { - document.getElementById(tabname).style.backgroundColor = '#008BBB'; - } -} - - \ No newline at end of file diff --git a/JS/unused/practice.js b/JS/unused/practice.js deleted file mode 100644 index 31cf446..0000000 --- a/JS/unused/practice.js +++ /dev/null @@ -1,81 +0,0 @@ - -function cngTab(IDname) { - - var introduce = document.getElementById('introduce'); - var introducediv = introduce.getElementsByTagName('div'); - - var ineh = document.getElementById('eucentricheightcontents'); - var inehdiv = ineh.getElementsByTagName('div'); - - var inform = document.getElementById('form'); - var informdiv = inform.getElementsByTagName('div'); - - var insingle=document.getElementById('simplephotecontents'); - var insinglediv=document.getElementsByTagName('div'); - - var intomo=document.getElementById('tomography'); - - var inmds = document.getElementById('mds'); - - - if (IDname == 1) { - introduce.style.display = ""; - ineh.style.display = 'none'; - inform.style.display = 'none'; - insingle.style.display = 'none'; - intomo.style.display="none"; - inmds.style.display="none"; - } else if (IDname == 3) { - ineh.style.display = ""; - introduce.style.display = 'none'; - inform.style.display = 'none'; - insingle.style.display = 'none'; - intomo.style.display="none"; - inmds.style.display="none"; - } else if (IDname == 2 ) { - insingle.style.display=""; - ineh.style.display="none"; - introduce.style.display="none"; - inform.style.display="none"; - intomo.style.display="none"; - inmds.style.display="none"; - } else if (IDname == 4 ) { - insingle.style.display="none"; - ineh.style.display="none"; - introduce.style.display="none"; - inform.style.display="none"; - intomo.style.display=""; - inmds.style.display="none"; - } else if (IDname == 5) { - insingle.style.display="none"; - ineh.style.display="none"; - introduce.style.display="none"; - inform.style.display="none"; - intomo.style.display="none"; - inmds.style.display=""; - } -} - -function firsttab() { - var introduce = document.getElementById('introduce'); - var introducediv = introduce.getElementsByTagName('div'); - - var ineh = document.getElementById('eucentricheightcontents'); - var inehdiv = ineh.getElementsByTagName('div'); - - var inform = document.getElementById('form'); - var informdiv = inform.getElementsByTagName('div'); - - var insingle=document.getElementById('simplephotecontents'); - var insinglediv=document.getElementsByTagName('div'); - - var intomo=document.getElementById('tomography'); - - var inmds=document.getElementById('mds'); - - ineh.style.display = 'none'; - inform.style.display = 'none'; - insingle.style.display ='none'; - intomo.style.display = 'none'; - inmds.style.display = 'none'; -} diff --git a/JS/unused/renzset.js b/JS/unused/renzset.js deleted file mode 100644 index 77f6ca2..0000000 --- a/JS/unused/renzset.js +++ /dev/null @@ -1,55 +0,0 @@ -function renzset(){ - - var ajax=getAjax(); - - if(command == "renzset"){ - var result = document.getElementById("detail"); - }else { - var result = document.getElementById("result"); - } - - if (ajax) { - try{ - ajax.onreadystatechange = getData; - }catch(e){ - result.innerHTML="Onreadystate change error."; - } - - try{ - ajax.open("GET","//localhost:8000/cgi-bin/vemclient.rb?command="+encodeURIComponent(command)+"&x="+encodeURIComponent(absolutex),true); - //document.getElementById("mid").innerHTML="absolutex="+absolutex+" absolutey="+absolutey; - }catch(e){ - result.innerHTML = "ajax open error"; - } - - try { - ajax.send(null); - }catch (e) { - result.innerHTML ="send error"; - } - - }else { - result.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState==4) { - if (ajax.status==200) { - result.innerHTML = ajax.responseText; - }else { - result.innerHTML = "HTTP transmission...."; - } - } - } - } - - - - -/* - * To change this license header, choose License Headers in Project Properties. - * To change this template file, choose Tools | Templates - * and open the template in the editor. - */ - - diff --git a/JS/unused/stagecontrol.js~ b/JS/unused/stagecontrol.js~ deleted file mode 100644 index 7568b1a..0000000 --- a/JS/unused/stagecontrol.js~ +++ /dev/null @@ -1,45 +0,0 @@ - -function stagecontrol(command,absolutex,absolutey,absolutez,absolutea) { - - var ajax=getAjax(); - - if(command == "detailcatch"){ - var result = document.getElementById("detail"); - }else { - var result = document.anchorsgetElementById("result"); - } - - if (ajax) { - try{ - ajax.onreadystatechange = getData; - }catch(e){ - result.innerHTML="Onreadystate change error."; - } - - try{ - ajax.open("GET","//localhost:8000/cgi-bin/vemclient.rb?command="+encodeURIComponent(command)+"&x="+encodeURIComponent(absolutex)+"&y="+encodeURIComponent(absolutey)+"&z="+encodeURIComponent(absolutez)+"&a="+encodeURIComponent(absolutea),true); - //document.getElementById("mid").innerHTML="absolutex="+absolutex+" absolutey="+absolutey; - }catch(e){ - result.innerHTML = "ajax open error"; - } - - try { - ajax.send(null); - }catch (e) { - result.innerHTML ="send error"; - } - - }else { - result.innerHTML = "you cannot use ajax...."; - } - - function getData() { - if (ajax.readyState==4) { - if (ajax.status==200) { - result.innerHTML = ajax.responseText; - }else { - result.innerHTML = "HTTP transmission...."; - } - } - } - } \ No newline at end of file diff --git a/JS/unused/test.html b/JS/unused/test.html deleted file mode 100644 index c1a56d3..0000000 --- a/JS/unused/test.html +++ /dev/null @@ -1,19 +0,0 @@ - - - - - TODO supply a title - - - - - - - - Hello world! - - diff --git a/JS/url_dummy.js b/JS/url_dummy.js new file mode 100644 index 0000000..3eb8526 --- /dev/null +++ b/JS/url_dummy.js @@ -0,0 +1,721 @@ + +//フォームから入力された顕微鏡のIPアドレス、ポート番号、メーカー、顕微鏡名を記憶 +function UserSetting(){ + var ipAddress = document.getElementById("ip_address").value; + var port_number = document.getElementById("port_number").value; + var manufacturer = document.getElementById("manufacturer").value; + var em_name = document.getElementById("em_name").value; + //console.log(ipAddress+","+port_number+","+manufacturer+","+em_name); +} + +//ajaxの準備 +function getAjax(){ + var ajax = null; + try{ + ajax = new XMLHttpRequest(); + }catch(e){ + alert("Not Init"); + } + return ajax; +} + +//URLからパラメーターを取得 => URLの引数からパラメータをキーとデータに分けたオブジェクト +function GetUrlElement(){ + var argument = new Object(); + var key_data = location.search.substring(1).split('&');//頭に?がつくから2文字目から文字列を扱う + for(var i=0; ikey, value[1]->data + } + return { + GetUrlElementInstance: function() { + return argument; + } + } +} + +//URLのメーカーまでの生成 =>URLの頭 ex) http://192.168.4.146:9090/fei/ +function MakeUrlHead(){ + var userSetting = new GetUrlElement(); + var urlElement = userSetting.GetUrlElementInstance(); + + var urlHead = "http://"; + urlHead += urlElement['sendIpAddress']; + urlHead += ":"; + urlHead += urlElement['sendPortNumber']; + urlHead += "/"; + urlHead += urlElement['sendManufacturer']; + urlHead += "/"; + + return urlHead; +} + +//全パラメータを返す +function AllParams(){ + + /*vemapi* + # 全パラメーターを返す + # /:emname/get + 例 + URL：http://localhost:9090/fei/get + 返り値:{"x":0,"y":1,"z":1,"a":1,"spotSizeIndex":0,"MagIndex":0} + */ + + var url = MakeUrlHead(); + url += "get"; + + var on_off = document.getElementsByName("all_params_switch");//返り値は配列 + console.log(on_off); + + //on + if(on_off[0].checked){ + console.log("on(allparams)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + //off + }else{ + console.log("off(allparams)"); + //URL画面出力 + var show_url = document.getElementById("all_params_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("all_params_return"); + show_return.innerHTML = "..."; + } +} + +//ステージ移動　数値指定　絶対座標 +function setStage(){ + + var movex = document.getElementById("movex").value; + var movey = document.getElementById("movey").value; + var movez = document.getElementById("movez").value; + + var on_off = document.getElementsByName("move_stage_switch"); + + /* + # ステージ移動（絶対座標指定） + # /:emname/set/stagea + parameters x, y, z, a + + 例： + http://localhost:9090/fei/set/stagea?x=1&&y=0&&z=2&&a=0 + + 返り値： + {"x”:"1","y”:"0","z”:"2","a”:"0"} + */ + + var url = MakeUrlHead(); + url += "set/stagea"; + url += "?x="; + url += movex; + //url += encodeURIComponent(movex); + url += "&y="; + url += movey + //url += encodeURIComponent(movey); + url += "&z="; + url += movez + //url += encodeURIComponent(movez); + url += "&a="; + url += movez + //url += encodeURIComponent(movez); + + if(on_off[0].checked){ + console.log("on(setStage)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(setStage)"); + //URL画面出力 + var show_url = document.getElementById("move_stage_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("move_stage_return"); + show_return.innerHTML = "..."; + } + +} + +//ステージ移動　クリックのボタン移動 +function ClickMove(direction){ + + var movingDistance = document.getElementById('movingDistance').value; + + var movex = document.getElementById("movex").value; + var movey = document.getElementById("movey").value; + var movez = document.getElementById("movez").value; + + var value = 0; + + switch (direction){ + case 'Left': + value = parseInt(movex) + parseInt(movingDistance); + document.getElementById("movex").value = value; + console.log(value); + break; + case 'Right': + value = parseInt(movex) - parseInt(movingDistance); + document.getElementById("movex").value = value; + console.log(value); + break; + case 'Up': + value = parseInt(movey) + parseInt(movingDistance); + document.getElementById("movey").value = value; + console.log(movey); + break; + case 'Down': + value = parseInt(movey) - parseInt(movingDistance); + document.getElementById("movey").value = value; + console.log(movey); + break; + } + + setStage();//通信部を内包したステージ移動の関数を呼び出す + + + /* + var on_off = document.getElementsByName("move_stage_switch"); + + var url = MakeUrlHead(); + url += "set/stager"; + url += "?x="; + url += movex; + //url += encodeURIComponent(movex); + url += "&y"; + url += movey + //url += encodeURIComponent(movey); + url += "&z"; + url += movez + //url += encodeURIComponent(movez); + url += "&a"; + url += movez + //url += encodeURIComponent(movez); + + if(on_off[0].checked){ + console.log("on(ClickMove)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + //off + }else{ + console.log("off(ClickMove)"); + //URL画面出力 + var show_url = document.getElementById("move_stage_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("move_stage_return"); + show_return.innerHTML = "..."; + } + */ +} + +function setSpotsize(){ + + /* + # スポットサイズ指定（絶対値） + # /:emname/set/spotsizea + parameters sps + + 例： + http://localhost:9090/fei/set/spotsizea?sps=3 + + 返り値： + {"spotSizeIndex":"3"} + + # スポットサイズ指定（相対値） + # /:emname/set/spotsizer + parameters sps + + 例： + http://localhost:9090/fei/set/spotsizer?sps=3 + + 返り値： + {"spotSizeIndex":"3"} + */ + + var on_off = document.getElementsByName("spotsize_switch"); + var spotsize = document.getElementById("Spotsize").value; + + var url = MakeUrlHead(); + url += "set/spotsizea"; + url += "?sps="; + url += spotsize; + + if(on_off[0].checked){ + console.log("on(setSpotsize)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(setStage)"); + //URL画面出力 + var show_url = document.getElementById("spotsize_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("spotsize_return"); + show_return.innerHTML = "..."; + } +} + + +function setMagnificationA(){ + /* + # 倍率設定（絶対値） + # /:emname/set/magnificationa + parameters mag + + 例： + http://localhost:9090/fei/set/magnificationa?mag=1 + + 返り値： + {"magIndex":"1"} + */ + var on_off = document.getElementsByName("magnification_abs_switch"); + var mag = document.getElementById("magnificationa").value; + + var url = MakeUrlHead(); + url += "set/magnificationa"; + url += "?mag="; + url += mag; + + if(on_off[0].checked){ + console.log("on(setMagnificationA)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(setMagnificationA)"); + //URL画面出力 + var show_url = document.getElementById("magnification_abs_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("magnification_abs_return"); + show_return.innerHTML = "..."; + } +} + +function setMagnificationR(){ + /* + # 倍率設定（相対値） + # /:emname/set/magnificationr + parameters mag + + 例： + http://localhost:9090/fei/set/magnificationr?mag=1 + + 返り値： + {"magIndex":"1"} + */ + var on_off = document.getElementsByName("magnification_rel_switch"); + var mag = document.getElementById("magnificationr").value; + + var url = MakeUrlHead(); + url += "set/magnificationr"; + url += "?mag="; + url += mag; + + if(on_off[0].checked){ + console.log("on(setMagnificationR)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(setMagnificationR)"); + //URL画面出力 + var show_url = document.getElementById("magnification_rel_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("magnification_rel_return"); + show_return.innerHTML = "..."; + } +} + +function defocus(){ + /* + # フォーカス設定（相対値） + # /:emname/set/defocusr + parameters defocus + + 例: + http://localhost:9090/fei/set/defocusr?defocus=1 + + 返り値： + {"defocus":"1"} + */ + + var on_off = document.getElementsByName("focus_rel_switch"); + var defocus = document.getElementById("focusr").value; + + var url = MakeUrlHead(); + url += "set/defocusr"; + url += "?defocus="; + url += defocus; + + if(on_off[0].checked){ + console.log("on(defocus)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(defocus)"); + //URL画面出力 + var show_url = document.getElementById("focus_rel_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("focus_rel_return"); + show_return.innerHTML = "..."; + } +} + +function resetFocus(){ + /* + # フォーカスリセット + # /:emname/set/reset_defocus + parameters なし + + 例： + http://localhost:9090/fei/set/reset_defocus + + 返り値： + {"defocus":"1"} + */ + + var on_off = document.getElementsByName("focus_reset_switch"); + + var url = MakeUrlHead(); + url += "set/reset_defocus"; + + if(on_off[0].checked){ + console.log("on(resetFocus)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(resetFocus)"); + //URL画面出力 + var show_url = document.getElementById("focus_reset_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("focus_reset_return"); + show_return.innerHTML = "..."; + } +} + +function settingCam(){ + /* + # 撮影条件の設定（ビニング, 露光時間, 画像サイズ） + # /:emname/set/acq_init + parameters bng, exp, size + + 例： + http://localhost:9090/fei/set/acq_init?bng=2&&exp=0.25&&size=0 + + ビニング ：bng 1, 2, 4 + 露光時間 ：exp 1:0.25:0.07（推奨） + 画像サイズ：size 0, 1, 2 （0:full,1:half,2:quarter) + */ + + var on_off = document.getElementsByName("set_condition_switch"); + var bng = document.getElementById("binning").value; + var exp = document.getElementById("exptime").value; + var size = document.getElementById("image_size").value; + + var url = MakeUrlHead(); + url += "set/acq_init"; + url += "?bng="; + url += bng; + url += "&exp=" + url += exp; + url += "&size" + url += size; + + if(on_off[0].checked){ + console.log("on(settingCam)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(settingCam)"); + //URL画面出力 + var show_url = document.getElementById("set_condition_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("set_condition_return"); + show_return.innerHTML = "..."; + } +} + +//WebSocketをつなぐスイッチ +/* + # サーバーが送るメッセージ + + クライアントと通信確立時 + {"type":"connection", "data":"open"} + + 画像リクエスト時（画像データを返す） + {"type":"img", "data":画像の配列} + + # クライアントが送るメッセージ + + 画像リクエスト時 + {"type":"req", "data":"img"} + +*/ +function connectWebSocket(){ + var button_value = document.getElementById("ws_button"); + + var userSetting = new GetUrlElement(); + var urlElement = userSetting.GetUrlElementInstance(); + + if(button_value.value == "close"){ + ws.close(); + console.log('closed'); + //document.getElementById("wsConnectBtn").value = "websocket start"; + button_value.value = "close"; + } else { + + button_value.value = "start"; + ws = new WebSocket("ws://"+urlElement['sendIpAddress']+":3001"); + ws.onopen = function(){ + console.log('websocket connected'); + // ws.send('req'); + }; + //document.getElementById("wsConnectBtn").value = "websocket close"; + ws.onmessage = function(ture){ + data = JSON.parse(ture.data);//parseでオブジェクトに変換 + console.log('server:' + data["type"]); + switch(data["type"]){ + case "connection": + connection(data); + break; + + case "img": + //image(data); + //画像のリクエスト + ws.send('{"type":"req", "data":"img"}'); + //戻り値のJSONを + drawMycrograph(data.data); + break; + } + }; + } + /* + toggleSwitch ^= 1 ; + switch(toggleSwitch){ + case 1: + + }; + break; + + case 0: + + } + */ +} + +//URLを投げるスイッチ? vem docにはないが、開発段階のwitsに存在　（そのまま移植） +function connectApi(){ + + var url = MakeUrlHead(); + url += "set/"; + + var button = document.getElementById("api_button"); + if(button.value == "close"){//closeする処理分岐 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + button.value = "start"; + }else{//startの処理分岐 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + } +/////////// + /* + switch(toggleSwitch){ + case 1: + //start + + + $.ajax({ + type:"GET", + url:"http://" +UrlElement['sendIpAddress']+ + ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+ + "/set/", + success: function(data){ + console.log(data);//string型 + } + }); + document.getElementById("apiConnectBtn").value = "API close"; + break; + + case 0: + //stop + + $.ajax({ + type:"GET", + url:"http://" +UrlElement['sendIpAddress']+ + ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+ + "/set/", + success: function(data){ + console.log(data);//string型 + } + }); + document.getElementById("apiConnectBtn").value = "API start"; + break; + + } + */ +} + + +function takePhoto(){ + /* + # 撮影 + # /:emname/acq + + 例： + http://localhost:9090/fei/acq + + 返り値： + 画像の2次元配列 + */ + + var on_off = document.getElementsByName("capture_switch"); + + var url = MakeUrlHead(); + url += "acq"; + + if(on_off[0].checked){ + console.log("on(settingCam)"); + //送信 + var ajax = getAjax(); + ajax.open('GET', url); + ajax.send(); + + ajax.addEventListener('readystatechange', function(){ + if(ajax.readyState === 4 && ajax.status === 200){ + console.log(ajax.responseText); + } + }); + }else{ + console.log("off(settingCam)"); + //URL画面出力 + var show_url = document.getElementById("capture_url"); + show_url.innerHTML = url; + + var show_return = document.getElementById("capture_return"); + show_return.innerHTML = "..."; + } +} + +//電顕で撮って返ってくる画像の描画 +function drawMycrograph(ddata){ + var canvas = document.getElementById("em_capture"); + var length; + var context; + + data = JSON.parse(ddata); + + // context.scale(0.5,0.5); + if(!canvas || !canvas.getContext){ + return(false); + } + else if(canvas.getContext){ + context=canvas.getContext('2d') + } + console.log(data); + length = data.length; + console.log(length); + var imgData = context.createImageData(length,length); + + for (var i=0;iUserSetting + +電子顕微鏡のコンディション保存 +ファイル名前　セーブ->IndexSaveEmConditionoFile() +/*********/ +使用JSファイル +userSetting +**********/ + + + + + + +電子顕微鏡操作 +map -> canvasMap + + +-Setting- +image size +binning +exptime + +-Stage Control- +moving distance +move x +move y +move z +change current % +spot size +magnification absolute value +magnification relative value + +-Take Photo- +websocket +api + +-Save Photo- +[name].tiff Save + +-EMCondition- +[name].txt Save + +[log file name].txt Save + +/*********/ +使用JSファイル +userSetting +log +em +realtimeCamera +drawImage +map +CLEM +**********/ diff --git a/app/.DS_Store b/app/.DS_Store new file mode 100644 index 0000000..1ce14b0 Binary files /dev/null and b/app/.DS_Store differ diff --git a/app/config.rb b/app/config.rb old mode 100644 new mode 100755 diff --git a/app/test/feiserver.rb b/app/test/feiserver.rb old mode 100644 new mode 100755 diff --git a/app/test/test_feicontrol.rb b/app/test/test_feicontrol.rb old mode 100644 new mode 100755 diff --git a/app/test/vemapi_test.rb b/app/test/vemapi_test.rb old mode 100644 new mode 100755 diff --git a/app/vemapi.rb b/app/vemapi.rb old mode 100644 new mode 100755 diff --git a/clem.html b/clem.html new file mode 100644 index 0000000..37d6320 --- /dev/null +++ b/clem.html @@ -0,0 +1,188 @@ + + + + + + + + WITs-clem + + + +
+ Go to WITs -home +

CLEM

+

Correlative Light Electron Microscopy

+ +
+
+
+
+
+

Display1

+ +
+

+ image
+ +

+
+

+ Scaling ×
+ Rotation +

+

+ Move x
+ Move y +

+

+ +

+
+
+
+
+

Display2

+ +
+
+
+

+ image
+ +

+
+

+ Scaling ×
+ Rotation +

+

+ Move x
+ Move y +

+

+ +

+
+
+
+
+
+

+ configulation
+
+ x
+ y
+ z
+ α
+ β
+ offsetX
+ offsetY
+ angle +

+
+
+
+
+
+
+
+
+
+

Manipulate display

+

Blend display1 and display2

+
Set transparency value
+

+ Display1 transparency(0.00-1.00)
+ Display2 transparency(0.00-1.00)
+

+
Change color
+

+ Display1: area of + + into +
+ Display2: area of + + into +
+ +

+
+
+
+

Display3(color)

+ +
+
+
+
+
+

Display4(Scale,move(X,Y))

+ +
+
+

+ Scaling ×
+

+

+ Move x
+ Move y +

+

+ +

+
+
+
+
+
+
+
+
+
+

+
+ + + + + + diff --git a/clemkai.html b/clemkai.html new file mode 100644 index 0000000..5e5d621 --- /dev/null +++ b/clemkai.html @@ -0,0 +1,357 @@ + + + + + + + + + WITs-clem + + +
+

CLEM

+

Correlative Light Electron Microscopy

+
+
+
+
+
+

+ Preview display + show + hide +

+
+
+
+
+
+
+
+
+

Display1

+
+ pixel length + +
+ +
+

+ image
+ +

+
+

+ Scaling ×
+ Rotation +

+

+ Move x + +
+ Move y + +

+

+ +

+
+
+
+
+

Display2

+
+ pixel length + +
+ +
+
+
+

+ image
+

+
+

+ Scaling ×
+ Rotation +

+

+ Move x + +
+ Move y + +

+

+ +

+
+
+
+
+
+

+ configulation
+ x:
+ y:
+ z:
+ α:
+ β:
+ offsetX:
+ offsetY:
+ angle:

+

+
+
+
+
+
+
+
+
+
+ +
+
+ ⬆︎clicking thumbnail, reflect image +
+
+
+
+
+
+

Image list(Input Display2)

+ + + + + + + + + + + + +
No.image fileconfig file(csv format)
+
+
+

Thumbnails

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

Blend

+ Color table     + +
+ + + + + + + + + + + + + + + + + + +
DisplayColor➡︎Color
Display1 + + + ➡︎ + + +
+
+ + + + + + + + + + + +
No.Color➡︎Color
+
+
+

Display3(color)

+ + +
+
+
+
+

Blend Elements

+
+ +
+
+
+
+
+

Display4

+
+ [Mouse over in canvas] +
+
+ pixel length + +
+ +
+
+

+ Scaling ×
+

+

+ Move x + +
+ Move y + +

+

+ +

+
+
+
+
+
+

Coordinate list

+
+ -CSV format Upload- + +
+ unit [ + + ] + +
+
+ + + + + + + + + + + + +
No.xyzbutton
+
+
+ -CSV format Download-
+ .txt  + + +
+
+
+
+
+
+
+

+
+ + + + diff --git a/config/.DS_Store b/config/.DS_Store new file mode 100644 index 0000000..293e60c Binary files /dev/null and b/config/.DS_Store differ diff --git a/config/config.txt b/config/config.txt new file mode 100644 index 0000000..ea2a420 --- /dev/null +++ b/config/config.txt @@ -0,0 +1,2 @@ +"2","3","4","0","0","10","-8","120" + diff --git a/config/config2.txt b/config/config2.txt new file mode 100644 index 0000000..23c55a6 --- /dev/null +++ b/config/config2.txt @@ -0,0 +1 @@ +"7","1","8","0","0","3","15","240" \ No newline at end of file diff --git a/em_control.html b/em_control.html new file mode 100644 index 0000000..efc3362 --- /dev/null +++ b/em_control.html @@ -0,0 +1,162 @@ + + + + + + + WITs-controlEM + + +
+ Go to WITs -home +

Control Electron Microscpy

+

+
+
+
+
+
+

EM display

+
+ + +
+
+

map

+ +
+
+
+
+

Setting

+ image size: + + + binning: + + + exptime: + +
+
+

Stage control

+
+
+ moving distance + nm +
+
+ move x + nm + + +
+
+ move y + nm + + +
+
+
+
+ move z(keep magnificance)   + nm

+ change current(keep stage)   + %   + Current lenz: +
+
+
+ spot size + +
+

+ magnification absolute value + +

+
+ magnification relative value + +
+
+
+

Take photo

+ + +
+
+

Save photo

+ File name：.tiff     +
+ +
+
+

Electron Microscopy Condition

+ File name：.txt    + + +
+ LogFile name：.txt    +

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
TEM
Position + + x=
+ y=
+ z=
+ a=
+
SpotSizeIndex
MagIndex
Obj
BeamTiltX
BeamTiltY
Speed
+ +
+
+
+
+
+
+

+
+ + + + + + + + + + + \ No newline at end of file diff --git a/get_coo.html b/get_coo.html new file mode 100644 index 0000000..07b6667 --- /dev/null +++ b/get_coo.html @@ -0,0 +1,103 @@ + + + + + + + WITs-coordinate + + +
+ Go to WITs-home +

Get coordinate

+
+
+ +
+
+
+

Display

+
+ [Mouse over in canvas] +
+
+ + length of pixel + +
+ +
+

Manipulate Display

+
+ +

+ Scaling ×
+ Move x
+ Move y
+
+

+
+
+
+
+
+

Coordinate list

+
+ -CSV format Upload- + +
+ -STAR format Upload- + +
+ unit [ + + ] + +
+
+ + + + + + + + + + + + +
No.xyzbutton
+
+
+ -CSV format Download-
+ .txt  + +
+ -STAR format Download-
+ .txt  + + +
+
+
+
+
+
+
+

+
+ + + + \ No newline at end of file diff --git a/getc.html b/getc.html new file mode 100644 index 0000000..96b7d8c --- /dev/null +++ b/getc.html @@ -0,0 +1,168 @@ + + + + + WITs + + + + +
+
+
+

canvas1

+
+
+ pixel length + + +
+
+
+ [Mouse over in canvas] +
+ +

+ Import : + +

+
+
+

table1

+
+
+ table unit [ + + ] + + +
+
+ Choose marker or target + +
+
+
+
+ + + + + + + + +
marker
+
+
+ + + + + + + + +
target
+
+
+
+
+
+
+
+

canvas2

+
+
+ pixel length + + +
+ +
+
+ [Mouse over in canvas] +
+ +

+ Import : + +

+
+
+

table2

+
+
+ table unit [ + + ] + + +
+
+ Choose marker or target + +
+
+
+
+ + + + + + +
marker
+
+
+ + + + + + +
marker*
+
+
+ + + + + + +
target*
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/image/.DS_Store b/image/.DS_Store new file mode 100644 index 0000000..8856a80 Binary files /dev/null and b/image/.DS_Store differ diff --git a/image/blendingnow.png b/image/blendingnow.png new file mode 100644 index 0000000..fb8e28a Binary files /dev/null and b/image/blendingnow.png differ diff --git a/index.html b/index.html index 7ad5090..eef0972 100644 --- a/index.html +++ b/index.html @@ -1,73 +1,77 @@ - - - - - - - - - + + + + + + WITs-home + - - -
-
-
-
-

Please Input Your Electron Microscopes Data!

-
-
-
-
-
-
-
- -
-

IP Address :

-

port number :

-

manufacturer : - -

-

electron microscope name : -

-

-

-
- -

em condition save

- File name：.txt -     - -
- - -
-
-
-
- - - - - - - - - - - - - - - - - - + +
+

WITs

+

Web system Integrated Tems

+
+
+
    +
  • + Control Electron Microscopy +

    + This enable you to control electron microscopy.First, Input electron microscopes data. + After access, page is going to transit to control page. +

    + Electron microscopes data +
      +
    • IP address
      • +
    • Port number
      • +
    • Manufacturer
      • +
    • Erectron microscope name
      • +
    +
    +

    +
    • +
  • + CLEM(Correlative Light Electron Microscopy) +

    + This CLEM is for analyzing using 2 images of Light microscope and Electron microscope. + User can do effects to the image on canvas. +

    +
    + Effects +
      +
    • Scalling
      • +
    • Rotation
      • +
    • Move
      • +
    • Change color
      • +
    • blendeing 2 image
      • +
    +
    +
    • +
  • + Get coordinate +

    + This Get coordinate is making list of Light microscope image markers. + User can do several manipulation this list. +

    +
    + Available manipulate +
      +
    • Make list by clicking image
      • +
    • Make list by uploading text(CSV format) file
      • +
    • Save list at local PC
      • +
    +
    +
    CSV format +
    "data1","data2","data3","data4"
    + "data5","data6","data7","data8"
    + ... +
    +
    +
    • +
+
+
+

+
+ + \ No newline at end of file diff --git a/input_em.html b/input_em.html new file mode 100644 index 0000000..08d1dd5 --- /dev/null +++ b/input_em.html @@ -0,0 +1,54 @@ + + + + + + + + WITs-InputEM + + +
+ Go to WITs -home +

Input Electron Microscopes Data

+
+
+

Please Input Your Electron Microscopes Data!

+
+
+ + + + + + + + + + + + + + +
IP Address
Port number
Manufacturer + +
Electron microscope name
+ +
+
+ -EM condition save-
+ File name：.txt    + + +
+
+ + + + + + \ No newline at end of file diff --git a/picture/.DS_Store b/picture/.DS_Store new file mode 100644 index 0000000..e004a87 Binary files /dev/null and b/picture/.DS_Store differ diff --git a/picture/CLEM.pptx b/picture/CLEM.pptx new file mode 100644 index 0000000..3ae91f3 Binary files /dev/null and b/picture/CLEM.pptx differ diff --git a/picture/png image/EM1.png b/picture/png image/EM1.png new file mode 100644 index 0000000..8cb687c Binary files /dev/null and b/picture/png image/EM1.png differ diff --git a/picture/png image/EM2.png b/picture/png image/EM2.png new file mode 100644 index 0000000..5b8bb89 Binary files /dev/null and b/picture/png image/EM2.png differ diff --git a/picture/png image/EM3.png b/picture/png image/EM3.png new file mode 100644 index 0000000..0e23306 Binary files /dev/null and b/picture/png image/EM3.png differ diff --git a/picture/png image/LM1.png b/picture/png image/LM1.png new file mode 100644 index 0000000..8b01804 Binary files /dev/null and b/picture/png image/LM1.png differ diff --git a/picture/png image/LM1wide.png b/picture/png image/LM1wide.png new file mode 100644 index 0000000..cb5b653 Binary files /dev/null and b/picture/png image/LM1wide.png differ diff --git a/picture/png image/LM2.png b/picture/png image/LM2.png new file mode 100644 index 0000000..90805cc Binary files /dev/null and b/picture/png image/LM2.png differ diff --git a/picture/png image/LM3.png b/picture/png image/LM3.png new file mode 100644 index 0000000..dd9a12b Binary files /dev/null and b/picture/png image/LM3.png differ diff --git a/picture/tiff image/EM1.tiff b/picture/tiff image/EM1.tiff new file mode 100644 index 0000000..af847c7 Binary files /dev/null and b/picture/tiff image/EM1.tiff differ diff --git a/picture/tiff image/EM2.tiff b/picture/tiff image/EM2.tiff new file mode 100644 index 0000000..d8d6558 Binary files /dev/null and b/picture/tiff image/EM2.tiff differ diff --git a/picture/tiff image/EM3.tiff b/picture/tiff image/EM3.tiff new file mode 100644 index 0000000..c048d23 Binary files /dev/null and b/picture/tiff image/EM3.tiff differ diff --git a/picture/tiff image/LM1.tiff b/picture/tiff image/LM1.tiff new file mode 100644 index 0000000..704ec07 Binary files /dev/null and b/picture/tiff image/LM1.tiff differ diff --git a/picture/tiff image/LM1wide.tiff b/picture/tiff image/LM1wide.tiff new file mode 100644 index 0000000..2ddce8b Binary files /dev/null and b/picture/tiff image/LM1wide.tiff differ diff --git a/picture/tiff image/LM2.tiff b/picture/tiff image/LM2.tiff new file mode 100644 index 0000000..14e68e8 Binary files /dev/null and b/picture/tiff image/LM2.tiff differ diff --git a/picture/tiff image/LM3.tiff b/picture/tiff image/LM3.tiff new file mode 100644 index 0000000..91d7ad4 Binary files /dev/null and b/picture/tiff image/LM3.tiff differ diff --git a/tab.html b/tab.html new file mode 100644 index 0000000..1612620 --- /dev/null +++ b/tab.html @@ -0,0 +1,70 @@ + + + + + + + tab + + + + +

Web system Integreted Tems

+
+
+
+
+ +
+
+
+
+
+ This is page1 +
+ This is page1 + +
+
+ This is page2 +
+ This is page2 +
+
+ This is page3 +
+ This is page3 +
+
+ This is page4 +
+ This is page4 +
+
+ This is page5 +
+ This is page5 +
+
+ This is page6 +
+ This is page6 +
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/trash/.DS_Store b/trash/.DS_Store new file mode 100644 index 0000000..613c17f Binary files /dev/null and b/trash/.DS_Store differ diff --git a/trash/clem.html b/trash/clem.html new file mode 100644 index 0000000..a4a7c11 --- /dev/null +++ b/trash/clem.html @@ -0,0 +1,54 @@ + + + + + + + WITs-1mode + + + +
+

WITs for CLEM

+

Websystem Integrated Tems for Correlative Light and Electron Microscopy

+

[1 CANVAS MODE]

+ 2 CANVAS MODE +
+
+
+
+ + + +
+
+

+ +

+
+

+ scaling ×
+ rotation +

+

+ move x
+ move y +

+

+ +

+
+
+
+
+
+
+
+

+
+ + + + + + diff --git a/trash/draw.js b/trash/draw.js new file mode 100644 index 0000000..204fd80 --- /dev/null +++ b/trash/draw.js @@ -0,0 +1,182 @@ +var can; //canvas要素 +var ctx; //コンテキスト +var image = new Image(); +var reader = new FileReader(); +var imageAspect=0; //画像のアスペクト比 +var file=0;//画像ファイル 0は有無の判断のために格納 +var magnification = 1;//拡大縮小倍率 +var angle=0; //回転角(度) ユーザー入力の値 +var movx=0; +var movy=0; //平行移動のパラメータ + + +//bodyタグロード完了後、実行される +function main(){ + can = document.getElementById('canvas'); + ctx = can.getContext('2d'); + console.log("executed main()"); + console.log(can,ctx,image,reader,imageAspect,file,magnification,angle,movx,movy); +} + +//ローカルファイルの読み取り +function loadFile(files){ + file = files[0]; + //ファイルアップロード2回目以降のcanvasの初期化 + ctx.clearRect(0,0,can.width,can.height); + magnification_init(); + rotation_init(); + move_params_init(); + displayImage(); + console.log("executed loadFile()"); +} + + + +//ファイルを選択でローカルから画像ファイルを読み込んでcanvasに描画する +function displayImage(){ + //console.log("a"); + reader.onload = function(event){ + //console.log("aa"); + //safari,firefoxでは.onloadが発生しない + image.onload = function(){ + //console.log("aaa"); + + imageAspect = image.width / image.height; + if (imageAspect >= 1) { //画像が横長 + left = 0; + width = can.width; + height = can.height / imageAspect; + to = (can.height - height) / 2; + } else { //画像が縦長 + to = 0; + width = can.width * imageAspect; + height = can.height; + left = (can.width - width) / 2; + } + + + + //ファイルアップロード2回目以降のcanvasの初期化 + ctx.clearRect(0,0,can.width,can.height); + + + /****************変換適用***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //倍率をコンテキストに反映 + ctx.scale(magnification,magnification); + //回転をコンテキストに反映 + ctx.rotate(angle / 180 * Math.PI); + + ctx.translate(-parseInt(can.width / 2)+movx,-parseInt(can.height / 2)-movy); + + /**************************************************************************/ + + + + //画像をアスペクト比を維持して中心に表示(描画時は効果を元の位置に戻す) + ctx.drawImage(image, 0, 0, image.width, image.height, left, to, width, height); + console.log("drawing mag=%f,rot=%f",magnification,angle); + + //変換位置に影響が出ないように調整 + ctx.translate(-movx,movy); + + /*****************変換調整***********************************************/ + //コンテキストに対する効果の始点を中心に移動 + ctx.translate(parseInt(can.width / 2),parseInt(can.height / 2)); + //画像の倍率の初期化 + ctx.scale(1 / magnification,1 / magnification); + //角度の初期化 + ctx.rotate(-1 * angle / 180 * Math.PI); + ctx.translate(-parseInt(can.width / 2)+movx,-parseInt(can.height / 2)-movy); + + //平行移動 + ctx.translate(-movx,movy); + /****************************************************************************/ + + + console.log("executed drawImage()"); + } + image.src = event.target.result; + } + if(file && file.type.match('image.*')){ + reader.readAsDataURL(file); + }else{ + return false; + } +} + +//倍率の値を持ってくる関数 +function scaling(){ + if(file==0){ + window.alert("画像ファイルをアップロードしてください"); + magnification_init(); + return false; + } + magnification = parseFloat(form1.magnification.value); + displayImage(); + console.log("executed scaling()"); +} + +//倍率を１に戻す関数 +function magnification_init(){ + form1.magnification.value = 1.00; //htmlのフォームの中身を変える + magnification = parseFloat(form1.magnification.value); //実際の値を変える + console.log("executed magnification_init()"); +} + + + + +// 回転角を持ってくる関数 +function rotation(){ + if(file==0){ + window.alert("画像ファイルをアップロードしてください"); + rotation_init(); + return false; + } + angle = parseFloat(form1.angle.value); + displayImage(); + console.log("executed rotation()"); +} + +//回転角を０に戻す関数 +function rotation_init(){ + form1.angle.value = 0; + angle = parseFloat(form1.angle.value); + console.log("executed rotation_init()"); +} + + + + //平行移動のパラメータを持ってくる関数 +function moving(){ + if(file==0){ + window.alert("画像ファイルをアップロードしてください"); + move_params_init(); + return false; + } + movx = parseFloat(form1.movex.value); + movy = parseFloat(form1.movey.value); + displayImage(); + console.log("executed moving()"); +} + +//平行移動パラメータの初期化 +function move_params_init(){ + form1.movex.value = 0; + movx = parseFloat(form1.movex.value); + form1.movey.value = 0; + movy = parseFloat(form1.movey.value); + console.log("executed move_params_init()"); +} + + +function reseting(){ + move_params_init(); + rotation_init(); + magnification_init(); + displayImage(); + console.log("executed reseting()"); +} + diff --git a/url_dummy.html b/url_dummy.html new file mode 100644 index 0000000..d48e6b0 --- /dev/null +++ b/url_dummy.html @@ -0,0 +1,41 @@ + + + + + + + +

Intput EM info

+
+
+
+
+

IP Address :

+

port number :

+

manufacturer :

+

electron microscope name :

+
+
+
+

+

+

+ +

+

+ +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/url_dummy2.html b/url_dummy2.html new file mode 100644 index 0000000..dc08b55 --- /dev/null +++ b/url_dummy2.html @@ -0,0 +1,220 @@ + + + + + + + +

Control EM url

+
+
+
+
+

Return All Parameters

+

button

+

URL :

+

Return :

+
+

Move Stage

+

+ movingdistance
+ move x
+ move y
+ move z +

+

URL :

+

Return :

+
+ +

SetSpotsize

+

spotsize

+

URL :

+

Return :

+
+

Magnification absolute

+

value

+

URL :

+

Return :

+
+

Magnification relative

+

value

+

URL :

+

Return :

+
+

Defocus

+

value

+

URL :

+

Return :

+
+

Focus Reset

+

button

+

URL :

+

Return :

+
+

Setting

+

+ Binning
+ Exptime
+ ImageSize
+

+

URL :

+

Return :

+
+

Take Photo

+

webSocket

+

API

+

take photo

+

URL :

+

Return :

+
+
+ +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ nm +
+ nm + + +
+ nm + + +
+ nm +

+

[url]

+

[return]

+
+ + +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +
+ +
+ +

+

[url]

+

[return]

+
+ +

+ on + off +

+

+ +

+

+ +

+

+ +

+

[url]

+

[return]

+ +
+
+
+
+
+
+ + + \ No newline at end of file