Upgrades - v3.0 Theme Changes

Overview
Below are the template changes in v3.0. You will need to deploy the changes manually if you made template changes and are using a different theme. Note that the details will reference data in the original theme, so you'll need to find the corresponding information in your own templates. Language files should be copied to all language folders.

New files should be added to your setup from the latest download zip file.
New Files
The following are new and must be copied to your theme/language folders:
content/**theme**/html/comments/
content/**theme**/images/player/

content/**theme**/label.tpl.php
content/**theme**/news-view.tpl.php
content/**theme**/news.tpl.php

content/**theme**/html/account-exists-btn.tpl
content/**theme**/html/collection-single-track.tpl
content/**theme**/html/news-headlines.tpl
content/**theme**/html/news-item.tpl
content/**theme**/html/no-featured-music.tpl
content/**theme**/html/tax-calc-digital.tpl
content/**theme**/html/tax-calc-tangible.tpl
content/**theme**/html/tax-info.tpl

content/**theme**/images/favicon.ico
content/**theme**/images/menu-bg.png
content/**theme**/images/animated/balls.gif
content/**theme**/images/gateways/square.png

content/**theme**/js/plugins/jquery.jqloader.js
content/**theme**/js/soundmanager/360player.js
content/**theme**/js/soundmanager/berniecode-animator.js
content/**theme**/js/soundmanager/excanvas.js

content/language/lang3.0.php
JS File Updates
Open the 'content/**theme**/js/mmusic.js' file and add the following function:
function mswCheck(area, chk) {
  if (chk) {
    jQuery('.' + area + ' input[type="checkbox"]').prop('checked', true);
  } else {
    jQuery('.' + area + ' input[type="checkbox"]').prop('checked', false);
  }
}
Open the 'content/**theme**/js/mmusic-ops.js' file and add the following function:
function mswCptRld() {
  jQuery('input[name="cpt"]').val('').addClass('msw-box-spinner-left');
  setTimeout(function() {
    jQuery('input[name="cpt"]').removeClass('msw-box-spinner-left');
    jQuery('img[class="cim"]').attr('src', 'index.php?load_c=yes&new=' + Math.random());
  }, 500);
}
CSS Updates
Open the 'content/**theme**/css/plugins.css' file and add the following:
.ui360,.ui360 *{position:relative}.ui360,.sm2-360ui{width:44px;height:44px}.ui360{position:relative}.ui360 a{line-height:50px}.sm2-360ui{}.ui360{}.ui360,.ui360 *{vertical-align:middle}.sm2-360ui{position:relative;display:inline-block;float:left;*float:left;*display:inline;*clear:left}.sm2-360ui.sm2_playing,.sm2-360ui.sm2_paused{z-index:10}.ui360 a.sm2_link{position:relative}.ui360 a{color:#008097;text-decoration:none}.ui360 a,.ui360 a:hover,.ui360 a:focus{padding:2px;margin-left:-2px;margin-top:-2px}.ui360 a:hover,.ui360 a:focus{background:#ddd;-moz-border-radius:3px;-webkit-border-radius:3px;-khtml-border-radius:3px;border-radius:3px;outline:none}.ui360 .sm2-canvas{position:absolute;left:0;top:0}.ui360 .sm2-timing{position:absolute;display:block;left:0;top:5px;width:100%;height:100%;margin:0;font:11px helvetica neue,helvetica,monaco,lucida,terminal,monospace;color:#008198;text-align:center;line-height:34px}.ui360 .sm2-timing.alignTweak{text-indent:1px}.ui360 .sm2-cover{position:absolute;left:0;top:0;z-index:2;display:none}.ui360 .sm2-360btn{position:absolute;top:57%;left:57%;width:16px;height:16px;margin-left:-11px;margin-top:-11px;cursor:pointer;z-index:3}.ui360 .sm2-360btn-default{}.ui360 .sm2-360data{display:inline-block;font-family:helvetica}.ui360 .sm2-360ui.sm2_playing .sm2-cover,.ui360 .sm2-360ui.sm2_paused .sm2-cover{display:block}.ui360,.ui360 .sm2-360btn-default{background:transparent url(../images/player/360-button-play.png) no-repeat 50% 50%;_background:transparent url(../images/player/360-button-play.gif) no-repeat 50% 50%;cursor:pointer}.ui360{}.ui360 .sm2-360ui.sm2_paused .sm2-360btn{background:transparent url(../images/player/360-button-play.png) no-repeat 50% 50%;_background:transparent url(../images/player/360-button-play.gif) no-repeat 50% 50%;cursor:pointer}.ui360 .sm2-360btn-default:hover,.ui360 .sm2-360ui.sm2_paused .sm2-360btn:hover{background:transparent url(../images/player/360-button-play-light.png) no-repeat 50% 50%;_background:transparent url(../images/player/360-button-play.gif) no-repeat 50% 50%;cursor:pointer}.ui360 .sm2-360ui.sm2_playing .sm2-360btn:hover,.ui360 .sm2-360btn-playing:hover{background:transparent url(../images/player/360-button-pause-light.png) no-repeat 45% 45%;_background:transparent url(../images/player/360-button-pause-light.gif) no-repeat 45% 45%;cursor:pointer}.ui360 .sm2-360ui.sm2_playing .sm2-timing{visibility:visible}.ui360 .sm2-360ui.sm2_buffering .sm2-timing{visibility:hidden}.ui360 .sm2-360ui .sm2-timing,.ui360 .sm2-360ui .sm2-360btn:hover+.sm2-timing,.ui360 .sm2-360ui.sm2_paused .sm2-timing{visibility:hidden}.ui360 .sm2-360ui.sm2_dragging .sm2-timing,.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover+.sm2-timing{visibility:visible}.ui360 .sm2-360ui.sm2_playing .sm2-360btn,x.ui360 .sm2-360btn-playing,.ui360 .sm2-360ui.sm2_dragging .sm2-360btn,.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover,.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover{background:0 0;cursor:auto}.ui360 .sm2-360ui.sm2_buffering .sm2-360btn,.ui360 .sm2-360ui.sm2_buffering .sm2-360btn:hover{background:transparent url(../images/player/icon_loading_spinner.gif) no-repeat 50% 50%;opacity:.5;visibility:visible}.sm2-inline-list .ui360,.sm2-inline-block .ui360{position:relative;display:inline-block;float:left;_display:inline;margin-bottom:-15px}.sm2-inline-list .ui360{margin-bottom:0}.sm2-inline-block .ui360{margin-right:8px}.sm2-inline-list .ui360 a{display:none}ul.ui360playlist{list-style-type:none}ul.ui360playlist,ul.ui360playlist li{margin:0;padding:0}div.ui360 div.metadata{display:none}div.ui360 a span.metadata,div.ui360 a span.metadata *{vertical-align:baseline}canvas.sm2-canvas.hi-dpi{width:44px;height:44px}.ui360 .sm2-cover{width:100%;height:100%}
Open the 'content/**theme**/css/theme.css' file and add the following:
.preview_window_btn {
  padding-top:10px;
  padding-bottom:10px;
  background:#F5F5F5;
  border-width:2px;
  color:#555;
}
.preview_window_btn .cost {
  display:block;
  margin-top:10px;
  font-size:20px;
  border-top:1px dashed #ddd;
  padding-top:10px;
  padding-bottom:10px;
}
.preview_window_btn .fa-plus-circle {
  font-size:20px;
  color:#008097;
}
.capimg img {
   cursor:pointer;
   margin-bottom:10px;
   border:1px dashed #ccc;
   padding:1px;
}
.video-container {
   position: relative;
   padding-bottom: 56.25%;
   height: 0;
   overflow: hidden;
   max-width: 100%;
   border:1px solid #ddd;
}
.video-container iframe,
.video-container object,
.video-container embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border:0 !important;
}
.table-responsive { overflow-x: initial; }
.table-responsive thead tr th:last-child {
   text-align:right;
  }
.table-responsive tbody tr td:last-child {
   text-align:right;
  }
.prevbutton button {
   text-transform: uppercase;
  }
.prevmobarea button {
   margin-bottom:5px;
   text-align:right !important;
  }
.action_s {
   margin-bottom:10px;
   border-top:1px solid #c0c0c0;
   border-bottom:1px solid #c0c0c0;
   padding:10px 0 10px 0;
}
.action_s_top {
   margin-top:10px;
   border-top:1px solid #c0c0c0;
   border-bottom:1px solid #c0c0c0;
   padding:10px 0 10px 0;
   text-align: center;
}
.action_s_top i {
   font-size: 20px;
}
.news_headline .date {
   display:block;
   margin-top:5px;
   font-style:italic;
   font-size: 12px;
}
.news_headline .pull-right i {
   font-size: 24px;
}
.news_item .read {
   color:green;
}
.news_item .unread {
   color: #f66;
}
.newsfooter {
   font-style:italic !important;
   font-size: 12px;
}
Something Missing?
Was a template update not shown here that caused something to break? Please let us know, thank you.