$(function () {
$(".menu .sub li").click(function() {
	   var lang = $(this).attr("type");
       $.post("/api/designer/setLang", {
                lang: lang
       }, function (data) {
          if (data['code'] == 200) {
             window.location.reload();
          } else {

          }
       }, 'json');
});
$('.menu').hover(function(){
		 $('.sub').show()
		},function(){
		    $('.sub').hide()
});
$(".sub li").click(function(){ 
			console.log($(this).text())
			$('.sub').hide()
});	
$('#play-btn').on('click', function () {
      if($('#audio')[0].paused){
        $('#audio')[0].play();
        $(this).toggleClass('play-icon pause-icon');
      }else {
        $('#audio')[0].pause();
      }
});	
function g_alert1(msg){
        //定义弹出层
        var html = '<div class="alert-mask"></div>\
                     <div id="g_box" class="col-xs-8 col-sm-4 col-md-4 col-lg-3">\
                       <div id="g_title">\
                          提示\
                          <span class="alert-close-btn"></span> \
                       </div>\
                       <div class="alert-content-dx">\
                          <p id="g_msg">'+msg+'</p>\
                       </div>\
                       <div id="g_buttom">\
                           <span class="butt" id="ok">确定</span>\
                       </div>\
                     </div>';

        //定义CSS
        var css = "<style id='g_css'>\n" +
          "      * {\n" +
          "        padding: 0;\n" +
          "        margin: 0;\n" +
          "        border: none;\n" +
          "      }\n" +
          "      .alert-mask {\n" +
          "        z-index:999;\n" +
          "        position:fixed;\n" +
            "        top: 0;\n" +
          "        left: 0;\n" +
          "        width: 100%;\n" +
          "        height: 100%;\n" +
          "        background-color: #ebebeb;\n" +
          "      }\n" +
          "      #g_box {\n" +
          "        z-index: 1000;\n" +
          "        position:fixed;\n" +
          // "        width: 444px;\n" +
          "        height: 180px;\n" +
          "        padding: 20px;\n" +
          "        top: 50%;\n" +
          "        left: 50%;\n" +
          "        transform: translate3d(-50%,-50%,0);\n" +
          "        background-color: #fff;\n" +
          "        border-radius: 10px;\n" +
          "        box-shadow:0px 0px 5px #dcdcdc;\n" +
          "      }\n" +
          "      #g_title {\n" +
          "        overflow: hidden;\n" +
          "        text-align: left;\n" +
          "      }\n" +
          "      .alert-close-btn {\n" +
          "        float: right;\n" +
          "        font-size: 14px;\n" +
          "        cursor: pointer;\n" +
          "      }\n" +
          "      .alert-close-btn:before {\n" +
          "        content: \"\\2716\";\n" +
          "      }\n" +
          "      .alert-content-dx {\n" +
          "        margin: 20px 0 60px;\n" +
          "      }\n" +
          "      #g_buttom {\n" +
          "        overflow: hidden;\n" +
          "      }\n" +
          "      #g_buttom #ok{\n" +
          "        display: inline-block;\n" +
          "        background-color: #13b7f6;\n" +
          "        color: #ffffff;\n" +
          "        border-radius: 12px;\n" +
          "        text-align: center;\n" +
          "        padding: 5px 10px;\n" +
          "        float: right;\n" +
          "        cursor: pointer;\n" +
          "      }\n" +
          "    </style>";
        //插入CSS
        $('head').append(css);
        //插入html
        $('body').append(html);
        //弹出层消失函数
        function removediv(){
          $('.alert-mask').remove();
          $('#g_box').remove();
        }
        //确定按钮事件 x按钮事件 遮罩层点击事件
        $('#ok,.alert-close-btn,.alert-mask').click(function(){
          removediv();
        });
      }

        function g_alert2(msg){
            //定义弹出层
            var html = '<div class="alert-mask"></div>\
                     <div id="g_box" class="col-xs-8 col-sm-4 col-md-4 col-lg-3">\
                       <div id="g_title">\
                          <span class="alert-close-btn"></span> \
                       </div>\
                       <div class="alert-content-dx">\
                          <p id="g_msg">'+msg+'</p>\
                       </div>\
                       <div id="g_buttom">\
                           <span class="butt" id="ok">确定</span>\
                       </div>\
                     </div>';

            //定义CSS
            var css = '<style>\n' +
                '      * {\n' +
                '        padding: 0;\n' +
                '        margin: 0;\n' +
                '        border: none;\n' +
                '      }\n' +
                '      .alert-mask {\n' +
                '        z-index:999;\n' +
                '        position:fixed;\n' +
                  '        top: 0;\n' +
                '        left: 0;\n' +
                '        width: 100%;\n' +
                '        height: 100%;\n' +
                '        background-color: #ebebeb;\n' +
                '      }\n' +
                '      #g_box {\n' +
                '        z-index: 1000;\n' +
                '        position:fixed;\n' +
                // '        width: 444px;\n' +
                '        height: 180px;\n' +
                '        padding: 20px;\n' +
                '        top: 50%;\n' +
                '        left: 50%;\n' +
                '        transform: translate3d(-50%,-50%,0);\n' +
                '        background-color: #fff;\n' +
                '        box-shadow:0px 0px 5px #dcdcdc;\n' +
                '      }\n' +
                '      #g_title {\n' +
                '        overflow: hidden;\n' +
                '      }\n' +
                '      .alert-close-btn {\n' +
                '        float: right;\n' +
                '        font-size: 14px;\n' +
                '        cursor: pointer;\n' +
                '      }\n' +
                '      .alert-close-btn:before {\n' +
                '        content: \'\\2716\';\n' +
                '      }\n' +
                '      .alert-content-dx {\n' +
                '        margin: 20px 0 60px;\n' +
                '      }\n' +
                '      #g_msg {\n' +
                '        text-align: center;\n' +
                '      }\n' +
                '      #g_buttom {\n' +
                '        overflow: hidden;\n' +
                '        text-align: center;\n' +
                '      }\n' +
                '      #g_buttom #ok{\n' +
                '        display: inline-block;\n' +
                '        background-color: #34c601;\n' +
                '        color: #ffffff;\n' +
                '        border-radius: 12px;\n' +
                '        text-align: center;\n' +
                '        padding: 5px 20px;\n' +
                '        cursor: pointer;\n' +
                '      }\n' +
                '    </style>' ;
            //插入CSS
            $('head').append(css);
            //插入html
            $('body').append(html);
            //弹出层消失函数
            function removediv(){
                $('.alert-mask').remove();
                $('#g_box').remove();
            }
            //确定按钮事件 x按钮事件
            //确定按钮事件 x按钮事件 遮罩层点击事件
            $('#ok,.alert-close-btn,.alert-mask').click(function(){
                removediv();
            });
        }
            
        function g_alert3(msg){
            //定义弹出层
            var html = '<div class="alert-mask"></div>\
                     <div id="g_box" class="col-xs-8 col-sm-4 col-md-4 col-lg-3">\
                       <div id="g_title">\
                          提示\
                          <span class="alert-close-btn"></span> \
                       </div>\
                       <div class="alert-content-dx">\
                          <p id="g_msg">'+msg+'</p>\
                       </div>\
                       <div id="g_buttom">\
                           <span class="butt" id="ok">确定</span>\
                       </div>\
                     </div>';

            //定义CSS
            var css = '<style>\n' +
                '      * {\n' +
                '        padding: 0;\n' +
                '        margin: 0;\n' +
                '        border: none;\n' +
                '      }\n' +
                '      .alert-mask {\n' +
                '        z-index:999;\n' +
                '        position:fixed;\n' +
                        '        top: 0;\n' +
                '        left: 0;\n' +
                '        width: 100%;\n' +
                '        height: 100%;\n' +
                '        background-color: #a2a2a2;\n' +
                '      }\n' +
                '      #g_box {\n' +
                '        z-index: 1000;\n' +
                '        position:fixed;\n' +
                // '        width: 444px;\n' +
                '        height: 180px;\n' +
                '        padding: 20px;\n' +
                '        top: 50%;\n' +
                '        left: 50%;\n' +
                '        transform: translate3d(-50%,-50%,0);\n' +
                '        background-color: #fff;\n' +
                '        box-shadow:0px 0px 5px #dcdcdc;\n' +
                '      }\n' +
                '      #g_title {\n' +
                '        overflow: hidden;\n' +
                '        text-align: center;\n' +
                '        font-size: 20px;\n' +
                '      }\n' +
                '      .alert-close-btn {\n' +
                '        float: right;\n' +
                '        font-size: 14px;\n' +
                '        cursor: pointer;\n' +
                '      }\n' +
                '      .alert-close-btn:before {\n' +
                '        content: \'\\2716\';\n' +
                '      }\n' +
                '      .alert-content-dx {\n' +
                '        margin: 20px 0 40px;\n' +
                '      }\n' +
                '      #g_msg {\n' +
                '        text-align: center;\n' +
                '      }\n' +
                '      #g_buttom {\n' +
                '        overflow: hidden;\n' +
                '        text-align: center;\n' +
                '      }\n' +
                '      #g_buttom #ok{\n' +
                '        display: inline-block;\n' +
                '        color: #51caf7;\n' +
                '        border: 1px solid #51caf7 ;\n' +
                '        border-radius: 12px;\n' +
                '        text-align: center;\n' +
                '        padding: 5px 20px;\n' +
                '        cursor: pointer;\n' +
                '      }\n' +
                '    </style>';
            //插入CSS
            $('head').append(css);
            //插入html
            $('body').append(html);
            //弹出层消失函数
            function removediv(){
                $('.alert-mask').remove();
                $('#g_box').remove();
            }
            //确定按钮事件 x按钮事件
            //确定按钮事件 x按钮事件 遮罩层点击事件
            $('#ok,.alert-close-btn,.alert-mask').click(function(){
                removediv();
            });
        }
        function g_alert4(msg){
            //定义弹出层
            var html = '<div class="alert-mask"></div>\
                     <div id="g_box" class="col-xs-8 col-sm-4 col-md-4 col-lg-3">\
                       <div id="g_title">\
                          提示\
                          <span class="alert-close-btn"></span> \
                       </div>\
                       <div class="alert-content-dx">\
                          <p id="g_msg">'+msg+'</p>\
                       </div>\
                       <div id="g_buttom">\
                           <span class="butt" id="ok">确定</span>\
                       </div>\
                     </div>';

            //定义CSS
            var css = '<style>\n' +
                '      * {\n' +
                '        padding: 0;\n' +
                '        margin: 0;\n' +
                '        border: none;\n' +
                '      }\n' +
                '      .alert-mask {\n' +
                '        z-index:999;\n' +
                '        position:fixed;\n' +
                '        top: 0;\n' +
                '        left: 0;\n' +
                '        width: 100%;\n' +
                '        height: 100%;\n' +
                '        background-color: #a2a2a2;\n' +
                '      }\n' +
                '      #g_box {\n' +
                '        z-index: 1000;\n' +
                '        position:fixed;\n' +
                // '        width: 444px;\n' +
                '        height: 180px;\n' +
                '        padding: 20px;\n' +
                '        top: 50%;\n' +
                '        left: 50%;\n' +
                '        transform: translate3d(-50%,-50%,0);\n' +
                '        background-color: #fff;\n' +
                '        box-shadow:0px 0px 5px #dcdcdc;\n' +
                '      }\n' +
                '      #g_title {\n' +
                '        overflow: hidden;\n' +
                '        text-align: center;\n' +
                '        font-size: 20px;\n' +
                '      }\n' +
                '      .alert-close-btn {\n' +
                '        float: right;\n' +
                '        font-size: 14px;\n' +
                '        cursor: pointer;\n' +
                '      }\n' +
                '      .alert-close-btn:before {\n' +
                '        content: \'\\2716\';\n' +
                '      }\n' +
                '      .alert-content-dx {\n' +
                '        margin: 20px 0 40px;\n' +
                '      }\n' +
                '      #g_msg {\n' +
                '        text-align: center;\n' +
                '      }\n' +
                '      #g_buttom {\n' +
                '        overflow: hidden;\n' +
                '      }\n' +
                '      #g_buttom #ok{\n' +
                '        display: inline-block;\n' +
                '        background-color: #32c500;\n' +
                '        color: #fff;\n' +
                '        border-radius: 12px;\n' +
                '        text-align: center;\n' +
                '        padding: 5px 20px;\n' +
                '        cursor: pointer;\n' +
                '        float: right;\n' +
                '      }\n' +
                '    </style>';
            //插入CSS
            $('head').append(css);
            //插入html
            $('body').append(html);
            //弹出层消失函数
            function removediv(){
                $('.alert-mask').remove();
                $('#g_box').remove();
            }
            //确定按钮事件 x按钮事件 遮罩层点击事件
            $('#ok,.alert-close-btn,.alert-mask').click(function(){
                removediv();
            });
        }
        switch (dailogId) {
            case 1:
                window.alert = g_alert1;
                break;
            case 2:
                window.alert = g_alert2;
                break;
            case 3:
                window.alert = g_alert3;
                break;
            case 4:
                window.alert = g_alert4;
                break;
        }
     });