<!-- ############ PAGE START-->
<div class="white bg b-b p-x">
    <div class="row">
        <div class="col-sm-6 push-sm-6">
            <div class="p-y text-center text-sm-right">
                <a href="#" class="inline p-x text-center">
                    <span class="h4 block m-a-0 player-num"><?=get_count('player',"only='{$GLOBALS['users']['only']}'",'id')?></span>
                    <small class="text-xs text-muted">播放器</small>
                </a>
                <a href="#" class="inline p-x b-l b-r text-center">
                    <span class="h4 block m-a-0 song-num"><?=get_count('player_song',"only='{$GLOBALS['users']['only']}'",'id')?></span>
                    <small class="text-xs text-muted">歌单</small>
                </a>
                <a href="#" class="inline p-x text-center">
                    <span class="h4 block m-a-0 music-num"><?=get_count('player_music',"only='{$GLOBALS['users']['only']}'",'music_id')?></span>
                    <small class="text-xs text-muted">音乐</small>
                </a>
            </div>
        </div>
        <div class="col-sm-6 pull-sm-6">
            <div class="p-y-md clearfix nav-active-info">
                <ul class="nav nav-pills nav-sm">
                    <li class="nav-item <?=GET('id')?'':'active'?>">
                        <a class="nav-link" href="#" data-toggle="tab" data-target="#tab_1">创建播放器</a>
                    </li>
                    <li class="nav-item <?=GET('id')?'active':''?>">
                        <a class="nav-link" href="#" data-toggle="tab" data-target="#tab_2">播放器管理</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-toggle="tab" data-target="#tab_3">创建歌单区</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-toggle="tab" data-target="#tab_4">歌曲管理区</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="padding">
    <div class="row">
        <div class="col-sm-12">
            <div class="tab-content">
                <div class="tab-pane p-v-sm <?=GET('id')?'':'active'?>" id="tab_1">
                    <div class="col-sm-9">
                        <div class="row-col" style="min-height:700px" id="hall">
                            <div class="row-row light dk">
                                <div class="row-body">
                                    <div class="row-inner">
                                        <div class="streamline m-b" id="load_hall">

                                            <div class="sl-item">
                                                <div class="sl-left"><img src="http://q2.qlogo.cn/headimg_dl?bs=<?=TFYT('qq')?>&dst_uin=<?=TFYT('qq')?>&dst_uin=<?=TFYT('qq')?>&;dst_uin=<?=TFYT('qq')?>&spec=100&url_enc=0&referer=bu_interface&term_type=PC" alt="." class="img-circle"></div>
                                                <div class="sl-content">
                                                    <div class="sl-date text-muted"><a>超级管理员</a> 1分钟前</div>
                                                    <div class="sl-author">播放器样式克隆即将上线，请耐心等待，谢谢！</div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box" id="found" style="display:none;">
                            <div class="box-header b-b">
                                <h3>创建一个播放器</h3>
                            </div>
                            <div class="box-body">
                                <form data-ui-jp="parsley" id="form">
                                    <div id="rootwizard" data-ui-jp="bootstrapWizard">
                                        <ul class="nav nav-pills clearfix m-b">
                                            <li class="nav-item"><a class="nav-link" href="#tab1" data-toggle="tab">第一步</a></li>
                                            <li class="nav-item"><a class="nav-link" href="#tab2" data-toggle="tab">完成</a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div class="tab-pane" id="tab1">
                                                <div class="form-group">
                                                    <label>播放器名称</label>
                                                    <input type="text" name="name" class="form-control" placeholder="请输入播放器名称">
                                                </div>
                                                <div class="form-group">
                                                    <label>自动播放</label>
                                                    <select name="auto_play" multiple class="form-control">
                                                        <optgroup label="是否要自动播放">
                                                            <option value="1">1-是</option>
                                                            <option value="0">0-否</option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label>播放模式</label>
                                                    <select name="play_mode" multiple class="form-control">
                                                        <optgroup label="请选择播放模式">
                                                            <option value="1">1-歌单循环</option>
                                                            <option value="2">2-随机播放</option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label>允许克隆</label>
                                                    <select name="is_clone" multiple class="form-control">
                                                        <optgroup label="是否允许克隆">
                                                            <option value="1">1-是</option>
                                                            <option value="0">0-否</option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="tab-pane" id="tab2">
                                                <div class="form-group">
                                                    <label>播放器样式</label>
                                                    <select name="style" class="form-control">
                                                        <option value="0" >请选择播放器样式</option>
                                                        <?php if(!empty($GLOBALS['player_style'])){ foreach($GLOBALS['player_style'] as $item){ ?>
                                                            <option value="<?=$item->style?>" img="<?=$item->image?>"><?=$item->id?>-<?=$item->name?></option>
                                                        <?php } }?>
                                                    </select>
                                                </div>
                                                <div class="form-group text-center" id="img"></div>
                                            </div>
                                            <ul class="list-inline pager wizard" value="1">
                                                <li class="previous"><a href="#" class="btn white">上一步</a></li>
                                                <li class="next"><a href="#" class="btn white">下一步</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="box">
                            <div class="box-header">
                                <h2><i class="fa fa-hospital-o"></i> 公告</h2>
                            </div>
                            <div class="box-divider m-a-0"></div>
                            <div class="box-body">
                                <p class="m-a-0"><?=TFYT('palyer_notice')?></p>
                            </div>
                        </div>
                        <div class="streamline m-b">
                            <div class="sl-item">
                                <div class="sl-left">
                                    <img src="http://q2.qlogo.cn/headimg_dl?bs=<?=TFYT('qq')?>&dst_uin=<?=TFYT('qq')?>&dst_uin=<?=TFYT('qq')?>&;dst_uin=<?=TFYT('qq')?>&spec=100&url_enc=0&referer=bu_interface&term_type=PC" class="img-circle">
                                </div>
                                <div class="sl-content">
                                    <div class="sl-date text-muted">超级管理员</div>
                                    <div class="sl-author">尊敬的<?=$GLOBALS['users']['name']?>，您共可以创建<font color="red"><?=$GLOBALS['users']['p_quota']?></font>个播放器，目前已经创建<font color="green"><?=get_count('player',"only='{$GLOBALS['users']['only']}'",'id')?></font> 个，如果您需要创建播放器，请看这里哦！</div>
                                    <div class="sl-footer" name="found" value="0">
                                        <a class="btn info btn-xs active found" style="color: #eeeeee;">
                                            <i class="fa fa-fw fa fa-plus text-muted"></i> 创建一个播放器
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane p-v-sm <?=GET('id')?'active':''?>" id="tab_2">
                    <div class="row row-sm">
                        <div class="col-sm-3 tab_2"></div>
                        <?php if (GET('id')!=''){?>
                        <div class="col-sm-9">
                            <form data-ui-jp="parsley" action="?Mould=Player" method="post">
                                <input type="hidden" name="id" value="<?=GET('id')?>">
                                <div class="box">
                                    <div class="box-header">
                                        <h2>播放器配置[<a href="?Mould=Player">返回</a>] - <b><?=$GLOBALS['player_info']->name?></b></h2>
                                    </div>
                                    <div class="box-body">
                                        <p class="text-muted">你目前是<code><?php if(get_isvip($GLOBALS['users']['vip'],$GLOBALS['users']['vipend'])){echo 'VIP会员';}else{echo '普通会员';}?></code>，VIP会员可以使用全部功能，普通会员部分功能将不可用。</p>
                                        <div class="form-group">
                                            <label>播放器名称</label>
                                            <input type="text" name="name" class="form-control" value="<?=$GLOBALS['player_info']->name?>" placeholder="请输入播放器名称">
                                        </div>
                                        <div class="form-group">
                                            <label>创建时间</label>
                                            <input type="text" class="form-control" value="<?=$GLOBALS['player_info']->addtime?>" placeholder="播放器创建时间" disabled>
                                        </div>
                                        <div class="form-group">
                                            <label>歌单配额</label>
                                            <input type="text" class="form-control" placeholder="播放器配额" value="共：<?=$GLOBALS['player_info']->song_quota?>个/已用<?=get_count('player_song',"player_id='{$GLOBALS['player_info']->id}'")?>个" disabled>
                                        </div>
                                        <div class="form-group">
                                            <label>自动播放</label>
                                            <select name="auto_play" multiple class="form-control">
                                                <optgroup label="是否要自动播放">
                                                    <option value="1" <?php if ($GLOBALS['player_info']->auto_play==1)echo 'selected = "selected"';?>>1-是</option>
                                                    <option value="0" <?php if ($GLOBALS['player_info']->auto_play==0)echo 'selected = "selected"';?>>0-否</option>
                                                </optgroup>
                                            </select>
                                        </div>
                                        <div class="form-group">
                                            <label>播放模式</label>
                                            <select name="play_mode" multiple class="form-control">
                                                <optgroup label="请选择播放模式">
                                                    <option value="1" <?php if ($GLOBALS['player_info']->play_mode==1)echo 'selected = "selected"';?>>1-歌单循环</option>
                                                    <option value="2" <?php if ($GLOBALS['player_info']->play_mode==0)echo 'selected = "selected"';?>>2-随机播放</option>
                                                </optgroup>
                                            </select>
                                        </div>
                                        <div class="form-group">
                                            <label>允许克隆</label>
                                            <select name="is_clone" multiple class="form-control">
                                                <optgroup label="是否允许克隆">
                                                    <option value="1" <?php if ($GLOBALS['player_info']->is_clone==1)echo 'selected = "selected"';?>>1-是</option>
                                                    <option value="0" <?php if ($GLOBALS['player_info']->is_clone==0)echo 'selected = "selected"';?>>0-否</option>
                                                </optgroup>
                                            </select>
                                        </div>
                                        <div class="form-group">
                                            <label>播放器样式</label>
                                            <select name="style" class="form-control">
                                                <option value="0" >请选择播放器样式</option>
                                                <?php if(!empty($GLOBALS['player_style'])){ foreach($GLOBALS['player_style'] as $item){ ?>
                                                    <option value="<?=$item->style?>" img="<?=$item->image?>" <?php if ($GLOBALS['player_info']->style==$item->style)echo 'selected = "selected"';?>><?=$item->id?>-<?=$item->name?></option>
                                                <?php } }?>
                                            </select>
                                        </div>
                                        <div class="form-group text-center" id="img"></div>
                                        <?php if (get_isvip($GLOBALS['users']['vip'],$GLOBALS['users']['vipend'])){?>
                                        <div class="form-group">
                                            <label>字体颜色</label>
                                            <textarea type="text" class="form-control" name="font_color" placeholder="播放器字体颜色"><?=$GLOBALS['player_info']->font_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>播放器边框阴影色</label>
                                            <textarea type="text" class="form-control" name="external_box_shadow" placeholder="播放器边框阴影色"><?=$GLOBALS['player_info']->external_box_shadow?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>播放器背景</label>
                                            <textarea type="text" class="form-control" name="background" placeholder="播放器背景"><?=$GLOBALS['player_info']->background?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>播放器透明度</label>
                                            <textarea type="text" class="form-control" name="transparent" placeholder="播放器透明度"><?=$GLOBALS['player_info']->transparent?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>播放器开关阴影色</label>
                                            <textarea type="text" class="form-control" name="switch_box_shadow" placeholder="播放器开关阴影色"><?=$GLOBALS['player_info']->switch_box_shadow?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>按钮背景颜色</label>
                                            <textarea type="text" class="form-control" name="switch_background" placeholder="按钮背景颜色"><?=$GLOBALS['player_info']->switch_background?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>鼠标滑过按钮颜色</label>
                                            <textarea type="text" class="form-control" name="hover_btn_coler" placeholder="鼠标滑过按钮颜色"><?=$GLOBALS['player_info']->hover_btn_coler?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>封面边框颜色</label>
                                            <textarea type="text" class="form-control" name="cover_frame_color" placeholder="封面边框颜色"><?=$GLOBALS['player_info']->cover_frame_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>进度槽颜色</label>
                                            <textarea type="text" class="form-control" name="progress_color" placeholder="进度槽颜色"><?=$GLOBALS['player_info']->progress_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>进度条颜色</label>
                                            <textarea type="text" class="form-control" name="progress_back_color" placeholder="进度条颜色"><?=$GLOBALS['player_info']->progress_back_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>进度按钮颜色</label>
                                            <textarea type="text" class="form-control" name="progress_btn_color" placeholder="进度按钮颜色"><?=$GLOBALS['player_info']->progress_btn_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>滚动槽颜色</label>
                                            <textarea type="text" class="form-control" name="roll_color" placeholder="滚动槽颜色"><?=$GLOBALS['player_info']->roll_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>滚动条颜色</label>
                                            <textarea type="text" class="form-control" name="scroll_bar_color" placeholder="滚动条颜色"><?=$GLOBALS['player_info']->scroll_bar_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>歌词容器颜色</label>
                                            <textarea type="text" class="form-control" name="lyric_container_color" placeholder="歌词容器颜色"><?=$GLOBALS['player_info']->lyric_container_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>歌词艺术字文件</label>
                                            <textarea type="text" class="form-control" name="lyric_art_font_file" placeholder="歌词艺术字文件"><?=$GLOBALS['player_info']->lyric_art_font_file?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>歌词阴影颜色</label>
                                            <textarea type="text" class="form-control" name="lyric_text_shadow" placeholder="歌词阴影颜色"><?=$GLOBALS['player_info']->lyric_text_shadow?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>歌词颜色</label>
                                            <textarea type="text" class="form-control" name="lyric_font_color" placeholder="歌词颜色"><?=$GLOBALS['player_info']->lyric_font_color?></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>歌词滑过的颜色</label>
                                            <textarea type="text" class="form-control" name="lyric_hover_color" placeholder="歌词滑过的颜色"><?=$GLOBALS['player_info']->lyric_hover_color?></textarea>
                                        </div>
                                        <?php }?>
                                    </div>
                                    <div class=" p-a text-right">
                                        <button type="submit" name="player_edit_submit" class="btn info">点击保存</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <?php }?>
                    </div>
                </div>
                <div class="tab-pane p-v-sm" id="tab_3">
                    <div class="row row-sm">
                        <div class="col-sm-12">
                            <div class="box">
                                <div class="box-header">
                                    <h2>创建歌单</h2>
                                </div>
                                <div class="box-divider m-a-0"></div>
                                <div class="box-body p-v-md">
                                    <div class="form-inline">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <div class="input-group-addon">歌单名称：</div>
                                                <input type="text" class="form-control" name="song_name" placeholder="请输入歌单名称">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="input-group">
                                                <div class="input-group-addon">歌单封面图片：</div>
                                                <input type="text" class="form-control" name="song_img" placeholder="歌单封面图片链接地址">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="input-group">
                                                <div class="input-group-addon">歌曲配额：</div>
                                                <input type="text" class="form-control" placeholder="能储存<?=$GLOBALS['users']['u_quota']?>首歌" disabled>
                                            </div>
                                        </div>
                                        <button type="button" name="submit_song" class="btn white">点击添加</button>
                                        <div class="pull-right">
                                            <button type="button" name="submit_song_edit" class="btn info m-r-md">编辑</button>
                                            <button type="button" name="submit_song_del" class="m-r-md btn danger">移除</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row col-md-8" id="song_list"></div>
                        <div class="row col-md-4" id="song_info" style="display:none;" value="0">
                            <div class="box">
                                <div class="box-header">
                                    <h2>编辑歌单</h2>
                                </div>
                                <div class="box-body">
                                    <p class="text-muted">在这里，你可以编辑歌单的基本信息</p>
                                    <div class="form-group">
                                        <label>歌单名称</label>
                                        <input type="text" class="form-control" name="song_name2" placeholder="请输入歌单名称" required>
                                    </div>
                                    <div class="form-group">
                                        <label>歌单封面</label>
                                        <input type="text" class="form-control" name="song_img2" placeholder="歌单封面图片链接地址" required>
                                    </div>
                                    <div class="form-group">
                                        <label>绑定播放器 [目前：<font color="green" id="player_name3"></font>]</label>
                                        <select name="payer_id2" class="form-control"></select>
                                    </div>
                                </div>
                                <div class=" p-a text-right">
                                    <button type="button" name="submit_song3" class="btn info">点击保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane p-v-sm" id="tab_4">
                    <div class="row">
                        <div class="col-sm-4">
                            <div class="box">
                                <div class="box-header light lt">
                                    <h3>歌单列表</h3>
                                </div>
                                <div class="box-tool">
                                    <ul class="nav">
                                        <li class="nav-item inline">
                                            <a class="nav-link" id="song_list_refresh">
                                                <i class="fa fa-fw fa-refresh load-song_list_refresh"></i>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <ul class="list-group m-b tab_4_song_list"></ul>
                            </div>
                        </div>
                        <div class="col-sm-8">
                            <div class="box">
                                <div class="box-header light lt">
                                    <h3>歌曲列表</h3>
                                </div>
                                <div class="box-tool">
                                    <ul class="nav">
                                        <li class="nav-item inline">
                                            <a class="nav-link" id="music_list_home2">
                                                <i class="fa fa-fw fa-home load_music_list_home2"></i>
                                            </a>
                                            <a class="nav-link" id="music_list_refresh2">
                                                <i class="fa fa-fw fa-refresh load_music_list_refresh2"></i>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <ul class="list-group m-b tab_4_music_list" value="0"></ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- ############ PAGE END-->