xgplayer 2.32.2 → 2.32.5

package/src/skin/style/controls/danmu.scss

@@ -1,333 +0,0 @@
-.xgplayer-skin-default {
-  .danmu-switch {
-    order: 6;
-    z-index: 26;
-  }
-
-  .xgplayer-danmu {
-    display: none;
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    height: 100%;
-    overflow: hidden;
-    z-index: 9;
-    outline: none;
-    pointer-events: none;
-    > * {
-      position: absolute;
-      white-space: nowrap;
-      z-index: 9;
-      pointer-events: auto;
-    }
-  }
-}
-
-.xgplayer-skin-default {
-  .xgplayer-danmu.xgplayer-has-danmu {
-    display: block;
-  }
-}
-
-@mixin xgplayer($danmuHandle) {
-  .xgplayer-#{$danmuHandle}-line{
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    cursor: pointer;
-    outline: none;
-    width: 150px;
-    height: 4px;
-    background: #aaa;
-    border-radius: 4px;
-    border-style: none;
-    margin-left: 10px;
-    margin-top: -2px;
-  }
-  .xgplayer-#{$danmuHandle}-line::-moz-focus-outer {
-    border: 0!important;
-  }
-  .xgplayer-#{$danmuHandle}-color::-webkit-slider-runnable-track{
-    outline: none;
-    width: 150px;
-    height: 4px;
-    border-radius: 4px;
-  }
-  .xgplayer-#{$danmuHandle}-color::-moz-range-track{
-    outline: none;
-    background-color: #aaa;
-    border-color: transparent;
-    cursor: pointer;
-    width: 150px;
-    height: 4px;
-    border-radius: 4px;
-  }
-  .xgplayer-#{$danmuHandle}-color::-ms-track{
-    outline: none;
-    background-color: #aaa;
-    color: transparent;
-    border-color: transparent;
-    width: 150px;
-    height: 4px;
-    border-radius: 4px;
-  }
-  .xgplayer-#{$danmuHandle}-bar::-webkit-slider-thumb{
-    outline: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    border: 6px solid #f85959;
-    height: 6px;
-    width: 6px;
-    margin-top: -4px;
-    border-radius: 6px;
-    cursor: pointer;
-  }
-  .xgplayer-#{$danmuHandle}-bar::-moz-range-thumb{
-    outline: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    border: 6px solid #f85959;
-    height: 0;
-    width: 0;
-    border-radius: 6px;
-    cursor: pointer;
-  }
-  .xgplayer-#{$danmuHandle}-bar::-ms-thumb{
-    outline: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    border: 6px solid #f85959;
-    height: 6px;
-    width: 6px;
-    border-radius: 6px;
-    cursor: pointer;
-  }
-}
-@mixin dot($panelContent) {
-  .xgplayer-#{$panelContent}-dot{
-    width: 3px;
-    height: 3px;
-    border: 3px solid #aaa;
-    border-radius: 50%;
-    background-color: #aaa;
-    position: relative;
-    top: 16px;
-    z-index: -1;
-  }
-}
-.xgplayer-skin-default {
-  .xgplayer-panel{
-    outline: none;
-    order: 7;
-    width: 40px;
-    height: 40px;
-    display: inline-block;
-    position: relative;
-    font: {
-      family: PingFangSC-Regular;
-      size: 13px;
-    }
-    color: rgba(255, 255, 255, 0.80);
-    z-index: 36;
-    .xgplayer-panel-icon{
-      // margin-top: 14px;
-      cursor: pointer;
-      position: absolute;
-      margin-left: 5px;
-      top: 10px;
-    }
-  }
-  .xgplayer-panel-active {
-    display: block!important;
-    bottom: 30px;
-  }
-  // .selected-color {
-  //   color: #f85959;
-  // }
-  .xgplayer-panel-slider{
-    z-index: 36;
-    display: none;
-    position: absolute;
-    width: 230px;
-    height: 230px;
-    background: rgba(0, 0, 0, 0.54);
-    border-radius: 1px;
-    padding: 10px 20px;
-    outline: none;
-    left: -115px;
-    bottom: 40px;
-    .xgplayer-hidemode{
-      padding-bottom: 10px;
-      &-radio li{
-        display: inline;
-        list-style: none;
-        cursor: pointer;
-      }
-      ul{
-        display: flex;
-        justify-content: space-around;
-      }
-      li{
-        margin: 0 12px;
-        font-size: 11px;
-        color: #aaa;
-      }
-      &-font{
-        margin-bottom: 10px;
-      }
-    }
-    .xgplayer-transparency{
-      display: block;
-      margin-top: 10px;
-      @include xgplayer(transparency);
-      .xgplayer-transparency-bar::-moz-range-progress {
-        outline: none;
-        -webkit-appearance: none;
-        -moz-appearance: none;
-        appearance: none;
-        height: 4px;
-        border-radius: 4px;
-        background: linear-gradient(to right, #f85959, #f85959 100% , #aaa)
-      }
-    }
-    .xgplayer-showarea{
-      display: block;
-      margin-top: 8px;
-      &-name {
-        display: inline-block;
-        position: relative;
-        top: -10px;
-      }
-      &-control {
-        display: inline-block;
-        &-up {
-          width: 150px;
-          margin-left: 10px;
-          display: -moz-box;
-          display: -ms-flexbox;
-          display: -webkit-box;
-          display: flex;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-          color: #aaa;
-        }
-        &-down {
-          position: relative;
-          top: -10px;
-        }
-        &-down-dots {
-          display: -webkit-box;
-          display: -ms-flexbox;
-          display: flex;
-          width: 150px;
-          margin-left: 10px;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-        }
-      }
-      &-twoquarters {
-        margin-left: -6px;
-      }
-      &-threequarters {
-        margin-left: -6px;
-      }
-      &-full {
-        margin-right: 3px;
-      }
-      @include xgplayer(showarea);
-      @include dot(showarea-zero);
-      @include dot(showarea-onequarters);
-      @include dot(showarea-twoquarters);
-      @include dot(showarea-threequarters);
-      @include dot(showarea-full);
-    }
-    .xgplayer-danmuspeed{
-      display: block;
-      &-name {
-        display: inline-block;
-        position: relative;
-        top: -10px;
-      }
-      &-control {
-        display: inline-block;
-        &-up {
-          width: 150px;
-          margin-left: 10px;
-          display: -moz-box;
-          display: -ms-flexbox;
-          display: -webkit-box;
-          display: flex;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-          color: #aaa;
-        }
-        &-down {
-          position: relative;
-          top: -10px;
-        }
-        &-down-dots {
-          display: -webkit-box;
-          display: -ms-flexbox;
-          display: flex;
-          width: 150px;
-          margin-left: 10px;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-        }
-      }
-      @include xgplayer(danmuspeed);
-      @include dot(danmuspeed-small);
-      @include dot(danmuspeed-middle);
-      @include dot(danmuspeed-large);
-    }
-    .xgplayer-danmufont{
-      display: block;
-      &-name {
-        display: inline-block;
-        position: relative;
-        top: -10px;
-      }
-      &-control {
-        display: inline-block;
-        &-up {
-          width: 150px;
-          margin-left: 10px;
-          display: -moz-box;
-          display: -ms-flexbox;
-          display: -webkit-box;
-          display: flex;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-          color: #aaa;
-        }
-        &-down {
-          position: relative;
-          top: -10px;
-        }
-        &-down-dots {
-          display: -webkit-box;
-          display: -ms-flexbox;
-          display: flex;
-          width: 150px;
-          margin-left: 10px;
-          -webkit-box-pack: justify;
-          -ms-flex-pack: justify;
-          justify-content: space-between;
-        }
-      }
-      @include xgplayer(danmufont);
-      @include dot(danmufont-small);
-      @include dot(danmufont-middle);
-      @include dot(danmufont-large);
-    }
-  }
-}

package/src/skin/style/controls/definition.scss

@@ -1,76 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-definition {
-    order: 5;
-    width: 60px;
-    height: 150px;
-    z-index: 18;
-    position: relative;
-    outline: none;
-    display: none;
-    cursor: default;
-    margin-left: 10px;
-    margin-top: -119px;
-    ul {
-      display: none;
-      list-style: none;
-      width: 78px;
-      background: rgba(0, 0, 0, 0.54);
-      border-radius: 1px;
-      position: absolute;
-      bottom: 30px;
-      left: 0;
-      text-align: center;
-      white-space: nowrap;
-      margin-left: -10px;
-      z-index: 26;
-      cursor: pointer;
-      li {
-        opacity: 0.7;
-        font-family: PingFangSC-Regular;
-        font-size: 11px;
-        color: rgba(255, 255, 255, 0.80);
-        padding: 6px 13px;
-        &.selected{
-          color: #fff;
-          opacity: 1;
-        }
-        &:hover{
-          color: #fff;
-          opacity: 1;
-        }
-      }
-    }
-    .name {
-      text-align: center;
-      font-family: PingFangSC-Regular;
-      font-size: 13px;
-      line-height: 20px;
-      height: 20px;
-      cursor: pointer;
-      color: rgba(255, 255, 255, 0.80);
-      position: absolute;
-      bottom: 0px;
-      width: 60px;
-      height: 20px;
-      line-height: 20px;
-      background: rgba(0, 0, 0, 0.38);
-      border-radius: 10px;
-      display:inline-block;
-      vertical-align:middle;
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-definition-active {
-  .xgplayer-definition {
-    ul {
-      display: block;
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-is-definition {
-  .xgplayer-definition {
-    display: block;
-  }
-}

package/src/skin/style/controls/download.scss

@@ -1,45 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-download {
-    position: relative;
-    order: 9;
-    display: block;
-    cursor: pointer;
-    .xgplayer-icon {
-      margin-top: 3px;
-      div {
-        position: absolute;
-      }
-      svg {
-        position: relative;
-        top: 5px;
-        left: 5px;
-      }
-    }
-    .xgplayer-tips {
-      margin-left: -20px;
-      .xgplayer-tip-download {
-        display: block;
-      }
-    }
-    &:hover {
-      opacity: 0.85;
-      .xgplayer-tips {
-        display: block;
-      }
-    }
-  }
-}
-.xgplayer-lang-is-en {
-  .xgplayer-download {
-    .xgplayer-tips {
-      margin-left: -32px;
-    }
-  }
-}
-.xgplayer-lang-is-jp {
-  .xgplayer-download {
-    .xgplayer-tips {
-      margin-left: -40px;
-    }
-  }
-}

package/src/skin/style/controls/enter.scss

@@ -1,55 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-enter {
-    display: none;
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    background: black;
-    z-index: 120;
-    .xgplayer-enter-spinner {
-      display: block;
-      position: absolute;
-      left: 50%;
-      top: 50%;
-      height: 100px;
-      width: 100px;
-      position: relative;
-      transform: translate(-50%,-50%);
-    }
-
-    .xgplayer-enter-spinner div {
-      width: 12%;
-      height: 26%;
-      background-color: rgba(255,255,255,0.7);
-      position: absolute;
-      left: 44%;
-      top: 37%;
-      opacity: 0;
-      border-radius: 30px;
-      animation: fade 1s linear infinite;
-    }
-
-    @for $i from 1 to 12 {
-      .xgplayer-enter-spinner div.xgplayer-enter-bar#{$i} {
-        transform: rotate(#{($i - 1) * 30 }deg) translate(0, -142%);
-        animation-delay: -#{(13 - $i)%12 * 0.0833}s;
-      }
-    }
-    .xgplayer-enter-spinner div.xgplayer-enter-bar12 {
-      transform:rotate(330deg) translate(0, -142%);
-      animation-delay: -0.0833s;
-    }
-    @keyframes fade {
-      from {opacity: 1;}
-      to {opacity: 0.25;}
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-is-enter {
-  .xgplayer-enter {
-    display: block;
-  }
-}

package/src/skin/style/controls/error.scss

@@ -1,34 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-error {
-    background: #000;
-    display: none;
-    position: absolute;
-    left: 0;
-    top: 0;
-    width:100%;
-    height: 100%;
-    z-index: 125;
-    font-family: PingFangSC-Regular;
-    font-size: 14px;
-    color: #fff;
-    text-align: center;
-    line-height: 100%;
-    justify-content: center;
-    align-items: center;
-    .xgplayer-error-refresh {
-      color: #FA1F41;
-      padding: 0 3px;
-      cursor: pointer;
-    }
-    .xgplayer-error-text {
-      line-height: 18px;
-      margin: auto 6px;
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-is-error {
-  .xgplayer-error {
-    display: flex;
-  }
-}

package/src/skin/style/controls/fullscreen.scss

@@ -1,60 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-fullscreen, .xgplayer-fullscreen-img {
-    position: relative;
-    order: 13;
-    display: block;
-    cursor: pointer;
-    margin-left: 5px;
-    margin-right: 3px;
-    .xgplayer-icon {
-      margin-top: 3px;
-      div {
-        position: absolute;
-      }
-      .xgplayer-icon-requestfull {
-        display: block;
-      }
-      .xgplayer-icon-exitfull {
-        display: none;
-      }
-    }
-    .xgplayer-tips {
-      position: absolute;
-      right: 0;
-      left: auto;
-      .xgplayer-tip-requestfull {
-        display: block;
-      }
-      .xgplayer-tip-exitfull {
-        display: none;
-      }
-    }
-    &:hover {
-      opacity: 0.85;
-      .xgplayer-tips {
-        display: block;
-      }
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-is-fullscreen, .xgplayer-skin-default.xgplayer-rotate-fullscreen{
-  .xgplayer-fullscreen, .xgplayer-fullscreen-img {
-    .xgplayer-icon {
-      .xgplayer-icon-requestfull {
-        display: none;
-      }
-      .xgplayer-icon-exitfull {
-        display: block;
-      }
-    }
-    .xgplayer-tips {
-      .xgplayer-tip-requestfull {
-        display: none;
-      }
-      .xgplayer-tip-exitfull {
-        display: block;
-      }
-    }
-  }
-}

package/src/skin/style/controls/icon.scss

@@ -1,12 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-icon {
-      display: block;
-      width: 40px;
-      height: 40px;
-      overflow: hidden;
-      fill: #fff;
-      svg {
-        position: absolute;
-      }
-  }
-}

package/src/skin/style/controls/live.scss

@@ -1,9 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-live {
-    display: block;
-    font-size: 12px;
-    color: #fff;
-    line-height: 40px;
-    order: 1;
-  }
-}

package/src/skin/style/controls/loading.scss

@@ -1,44 +0,0 @@
-.xgplayer-skin-default {
-  .xgplayer-loading {
-    display: none;
-    width: 100px;
-    height: 100px;
-    overflow: hidden;
-    transform: scale(0.7);
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    margin: -50px auto auto -50px;
-    svg{
-      border-radius: 50%;
-      transform-origin: center;
-      animation: loadingRotate 1s linear infinite;
-      path{
-        stroke: #ddd;
-        stroke-dasharray: 236;
-        animation: loadingDashOffset 2s linear infinite;
-        animation-direction: alternate-reverse;
-        fill: none;
-        stroke-width: 12px;
-      }
-    }
-  }
-}
-
-.xgplayer-skin-default.xgplayer-nostart {
-  .xgplayer-loading{
-    display: none;
-  }
-}
-
-.xgplayer-skin-default.xgplayer-pause {
-  .xgplayer-loading{
-    display: none !important;
-  }
-}
-
-.xgplayer-skin-default.xgplayer-isloading {
-  .xgplayer-loading{
-    display: block;
-  }
-}

package/src/skin/style/controls/memoryPlay.scss

@@ -1,28 +0,0 @@
-.xgplayer-skin-default {
-    .xgplayer-memoryplay-spot{
-        position: absolute;
-        height: 32px;
-        left:10px;
-        bottom: 46px;
-        background: rgba(0,0,0,.5);
-        border-radius: 32px;
-        line-height: 32px;
-        color: #ddd;
-        z-index: 15;
-        padding: 0 32px 0 16px;
-        .xgplayer-lasttime{
-            color:red;
-            font-weight: bold;
-        }
-        .btn-close{
-            position: absolute;
-            width: 16px;
-            height: 16px;
-            right: 10px;
-            top: 2px;
-            cursor: pointer;
-            color: #fff;
-            font-size: 16px;
-        }
-    }
-}