patch_file/app/views/admin/patchfiles/index.html.erb

<script src="/assets/lib/jquery-ui-1.12.1/jquery-ui.min.js"></script>
  <script type="text/javascript">
  /*     修正bootstap.js和jquery-ui.js間的衝突,使tab按鈕能正常運作                        */
  var Button = function (element, options) {
    this.$element = $(element)
    this.options = $.extend({}, $.fn.button.defaults, options)
  }

  Button.prototype.setState = function (state) {
    var d = 'disabled'
      , $el = this.$element
      , data = $el.data()
      , val = $el.is('input') ? 'val' : 'html'

    state = state + 'Text'
    data.resetText || $el.data('resetText', $el[val]())

    $el[val](data[state] || this.options[state])

    // push to event loop to allow forms to submit
    setTimeout(function () {
      state == 'loadingText' ?
        $el.addClass(d).attr(d, d) :
        $el.removeClass(d).removeAttr(d)
    }, 0)
  }

  Button.prototype.toggle = function () {
    var $parent = this.$element.closest('[data-toggle="buttons-radio"]')

    $parent && $parent
      .find('.active')
      .removeClass('active')

    this.$element.toggleClass('active')
  }

 /* BUTTON PLUGIN DEFINITION
  * ======================== */

  var old = $.fn.button

  $.fn.button = function (option) {
    return this.each(function () {
      var $this = $(this)
        , data = $this.data('button')
        , options = typeof option == 'object' && option
      if (!data) $this.data('button', (data = new Button(this, options)))
      if (option == 'toggle') data.toggle()
      else if (option) data.setState(option)
    })
  }
  /*     修正bootstap.js和jquery-ui.js間的衝突,使tab按鈕能正常運作                        */
  </script>
<link rel="stylesheet" href="/assets/lib/jquery-ui-1.12.1/jquery-ui.min.css">
<div style="clear:both;"></div>
<% @i = 0 %>
<button id="clickall"><%= (I18n.locale.to_s == "zh_tw") ? "全選" : "select all" %></button>
<button id="unclickall"><%= (I18n.locale.to_s == "zh_tw") ? "取消全選" : "unselect all" %></button>
<%=form_for @file_to_show ,:url=>{:controller=>"patchfiles" ,:action=>"edit"} do |file|%>
	<%= file.fields_for :file_show do |filefield|%>
		<div id="fileform">
		
		<% @file_to_show.file_show.each do |name,property| %>
			<span style="clear:both;">
			<%if property[:status].to_i == 1%>
				<%=filefield.check_box name,{:checked=>true,:id=>"checkbox"+@i.to_s,:class=>"checkbox",:style=>"float:left;"}%>
			<%else%>
				<%=filefield.check_box name,{:checked=>false,:id=>"checkbox"+@i.to_s,:class=>"checkbox",:style=>"float:left;"}%>
			<%end%>
			<label for="<%="checkbox"+@i.to_s%>" class="checklabel" style="float:left;"><%=name%></label>
			<div style="clear:both;"></div>
			<% @i = @i+1 %>
			<% @j = 0 %>
			<%= file.fields_for :sub_file_fields do |each_files|%>
				<%= each_files.fields_for name do |each_file|%>
					<% property[:files].each do |file_name,sub_property| %>
						<%if sub_property[:status].to_i == 1%>
							<%=each_file.check_box file_name,{:checked=>true,:id=>"checkbox"+@i.to_s,:class=>"sub_checkbox",:style=>"float:left;margin-left:1em;",:index=>@j}%>
						<%else%>
							<%=each_file.check_box file_name,{:checked=>false,:id=>"checkbox"+@i.to_s,:class=>"sub_checkbox",:style=>"float:left;margin-left:1em;",:index=>@j}%>
						<%end%>
						<% file_name = file_name.gsub("@",".") %>
						<label for="<%="checkbox"+@i.to_s%>" class="sub_checklabel" style="float:left;"><%=file_name%></label>
						<div style="clear:both;"></div>
						<% @i = @i+1 %>
						<% @j = @j+1 %>
					<% end %>
				<%end%>
			<%end%>
			</span>
		<%end%>
		</div>
	<%end%>
	<%=file.submit "#{t(:updatefont)}",{:id=>"updatebtn",:onclick=>"return updatefcn()"}%>
	<%=file.text_field :recovery_btn, {:id=>"hidden-recovery",:type => "hidden",:value=>"false"} %>
	<%=file.text_field :refresh_btn, {:id=>"hidden-refresh",:type => "hidden",:value=>"false"} %>
	<button id="seemessage" onclick="return seelogfcn()"><%=(I18n.locale.to_s =="zh_tw") ? "查看上次更新的logs" : "see logs of prev update "%></button>
	<button id="recoverybtn" onclick="return recoveryfcn()"><%=(I18n.locale.to_s =="zh_tw") ? "復原到上次更新的檔案狀態" : "recovery to prev file status"%></button>
	<button id="destroy_mongofield" onclick="return destroy_mongofield_fcn()"><%=(I18n.locale.to_s =="zh_tw") ? "刷新可更新的檔案狀態" : "refresh the status of the update files"%></button>
<%end%>
<a>網站目錄根路徑:<%=Dir.pwd.to_s%></a>
<li id ="ckeditorFont" class="show_li">
	<a title="CKEDITOR現有字形">CKEDITOR現有字形</a>
	<% @ckicktosee_str = (I18n.locale.to_s == "en") ? "click me to see all font which CKEDITOR have now" : "點擊我來查看編輯器所有目前擁有的字形" %>
	<a id="clicktosee" title="<%= @ckicktosee_str %>" class="Toggleclass"><%= @ckicktosee_str %></a>
	<ul>
	<% @font_array.each do |font|%>
		<li><a title="<%= font %>"><%= font %></a></li>
	<%end%>
	</ul>
</li>
<a></a>
<style type="text/css">
	.show_li,.show_li *{
		list-style:none;
		color:balck;
	}
	.show_li  ul{
		display:none;
	}
	#clicktosee{
		color:blue;
		cursor:pointer;
	}
</style>
<script>
	$('.Toggleclass').off("click").on("click",function(){
		$(this).parent().find(">ul").slideToggle();
	});
	$('.checkbox').off('click').on('click',function(){
		for(var i = 0;i<$(this).parent().find('.sub_checkbox').length;i++){
			if($(this).is(":checked") == false){
				if($(this).parent().find('.sub_checkbox').eq(i).is(":checked") == true)
					$(this).parent().find('.sub_checkbox').eq(i).click();
			}else{
				if($(this).parent().find('.sub_checkbox').eq(i).is(":checked") == false)
					$(this).parent().find('.sub_checkbox').eq(i).click();
			};
		};
	});
	$('.sub_checkbox').off('click').on('click',function(){
		var num = 0;
		var index = 0;
		for(var i = 0;i<$(this).parent().find('.sub_checkbox').length;i++){
			if($(this).parent().find('.sub_checkbox').eq(i).is(":checked") == true){
				num += 1;
			};
		};
		if( num == $(this).parent().find('.sub_checkbox').length){
			if( $(this).parent().find('.checkbox').is(":checked") == false)
				$(this).parent().find('.checkbox').click();
		}else{
			if( $(this).parent().find('.checkbox').is(":checked") == true){
				$(this).parent().find('.checkbox').click();
				for(var i = 0;i<$(this).parent().find('.sub_checkbox').length;i++){
					if($(this).parent().find('.sub_checkbox').eq(i).attr('id') != $(this).attr('id'))
						$(this).parent().find('.sub_checkbox').eq(i).click();
				}
			};
		}
	});
	$("#clickall").off("click").on("click",function(){
		for(var i =0;i<$(".sub_checkbox").length ; i++){
			if($(".checkbox").eq(i).is(":checked") == false)
				$(".checkbox").eq(i).click();
		}
	});
	$("#unclickall").off("click").on("click",function(){
		for(var i =0;i<$(".sub_checkbox").length ; i++){
			if($(".checkbox").eq(i).is(":checked") == true)
				$(".checkbox").eq(i).click();
		}
	});
	function seelogfcn(){
		if($( "#dialog-confirm" ).length != 0)
			$( "#dialog-confirm" ).remove();
		if(I18n.locale == "zh_tw"){
			$('body').after("<div id='dialog-confirm' title='上次更新的logs'></div>");
		}else{
			$('body').after("<div id='dialog-confirm' title='logs of prev update？'></div>");
		};
		$( "#dialog-confirm" ).append($.parseHTML("<%= @file_to_show.last_message.gsub("\"","\'").html_safe %>"));
		$( "#dialog-confirm" ).dialog({
		  resizable: true,
		  height:200,
		  modal: true,
		  buttons: {
			<%=(I18n.locale == "zh_tw") ? "確認" : "confirm"%>: function(){
				$( this ).dialog( "close" );
			},
			<%=(I18n.locale == "zh_tw") ? "取消" : "Cancel"%>: function() {
			  $( this ).dialog( "close" );
			}
		  }
		});
		return false;
	};
	function updatefcn(){
		var str="";
		var num =1;
		for(var i =0;i<$(".sub_checkbox").length ; i++){
			if($(".sub_checkbox").eq(i).is(":checked") == true){
				str += ("</br><i style='color:red;'>"+num+". "+$(".sub_checklabel").eq(i).html()+"</i>");
				num += 1;
			}
		}
		if($( "#dialog-confirm" ).length != 0)
			$( "#dialog-confirm" ).remove();
		if(I18n.locale == "zh_tw"){
			$('body').after("<div id='dialog-confirm' title='你確定要更新嗎？'>"+
										"<p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 0 0;'></span>"+
										"按下確認鍵後，你將更新你所選的檔案。"+str+"</p>"
										+"</div>");
		}else{
			$('body').after("<div id='dialog-confirm' title='Are you sure to update？'>"+
										"<p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 0 0;'></span>"+
										"After click confirm button,you will update the selected file."+str+"</p>"
										+"</div>");
		};
		$( "#dialog-confirm" ).dialog({
		  resizable: true,
		  height:200,
		  modal: true,
		  buttons: {
			<%=(I18n.locale == "zh_tw") ? "確認" : "confirm"%>: function(){
				$( this ).dialog( "close" );
				$('.edit_filefield').submit();
			},
			<%=(I18n.locale == "zh_tw") ? "取消" : "Cancel"%>: function() {
			  $( this ).dialog( "close" );
			}
		  }
		});
		return false;
	};
	function recoveryfcn(){
		var str="";
		var num =1;
		for(var i =0;i<$(".sub_checkbox").length ; i++){
			if($(".sub_checkbox").eq(i).is(":checked") == true){
				str += ("</br><i style='color:red;'>"+num+". "+$(".sub_checklabel").eq(i).html()+"</i>");
				num += 1;
			}
		}
		if($( "#dialog-confirm" ).length != 0)
			$( "#dialog-confirm" ).remove();
		if(I18n.locale == "zh_tw"){
			$('body').after("<div id='dialog-confirm' title='你確定要還原嗎？'>"+
										"<p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 0 0;'></span>"+
										"按下確認鍵後，你將還原你所選的檔案。"+str+"</p>"
										+"</div>");
		}else{
			$('body').after("<div id='dialog-confirm' title='Are you sure to recover？'>"+
										"<p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 0 0;'></span>"+
										"After click confirm button,you will recover the selected file."+str+"</p>"
										+"</div>");
		}
		$( "#dialog-confirm" ).dialog({
		  resizable: true,
		  height:200,
		  modal: true,
		  buttons: {
			<%=(I18n.locale == "zh_tw") ? "確認" : "confirm"%>: function(){
				$('#hidden-recovery').val("true");
				$( this ).dialog( "close" );
				$('.edit_filefield').submit();
			},
			<%=(I18n.locale == "zh_tw") ? "取消" : "Cancel"%>: function() {
			  $('#hidden-recovery').val("false");
			  $( this ).dialog( "close" );
			}
		  }
		});
		return false;
	};
	function destroy_mongofield_fcn(){
		$('#hidden-refresh').val('true');
	};
</script>