socialforge/app/views/open_source_projects/index.html.erb

<div class="top-content" >
	<%= form_tag(:controller => 'open_source_projects', :action => "search", :method => :get) do %>
	<table width="940px">
		<tr>
			<td class="info_font" style="width: 220px; color: #15bccf">开源项目社区</td>
			<td class="location-list"><strong><%= l(:label_user_location) %> :</strong></td>
			<td rowspan="2"></td>
			<td rowspan="2" >
			<div class="project-search" style="float: right">
				<%= text_field_tag 'name', params[:name], :size => 30 %>
				<%= submit_tag l(:label_search), :class => "enterprise", :name => nil %>
			</div></td>
		</tr>
		<tr>
			<td style="padding-left: 8px"><a><%= link_to request.host()+"/open_source_projects", :controller => 'open_source_projects', :action => 'index' %> </a></td>
			<td ><%= link_to l(:field_homepage), home_path %> > <%= link_to "开源项目社区", :controller => 'open_source_projects', :action => 'index' %></td>
		</tr>
	</table>
	<% end %>
</div>

<style type="text/css">
.tb-navigation {
	position: relative;
	z-index: 400;
}
/*blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
	margin: 0;
	padding: 0;
}*/

.navigation {
	color: #666;
	border: 2px solid #d7d6d6;
}

.nav-switch {
	position: absolute;
	top: 0;
	right: 0;
	border-width: 14px;
	border-color: #bdbdbd #bdbdbd transparent transparent;
	border-style: solid solid dashed dashed;
	z-index: 10;
}

.navigation .nav-switch-icon {
	background-position: -266px 3px;
}
.navigation .icon-search, .navigation .nav-pill-cancle, .navigation .nav-switch-icon, .navigation .nav-topbar .topbar-search .topbar-submit, .navigation .nav-topbar-arror {
	/*background: url()*/
}
.nav-switch-icon {
	width: 15px;
	height: 15px;
	position: absolute;
	top: -13px;
	right: -13px;
	cursor: pointer;
}
.nav-topbar, .type-min {
	position: relative;
}
.nav-category-group {
	clear: both;
}
.nav-topbar {
	background-color: #f5f4f4;
	border-bottom: 1px solid #e4e4e4;
	z-index: 4;
}
.nav-topbar .nav-topbar-content {
	line-height: 36px;
	padding: 0 16px;
	overflow: hidden;
}
.nav-topbar-content {
	margin: 0 4px;
	white-space: nowrap;
}
ol, ul {
	list-style: none;
}
ul, menu, dir {
	display: block;
	list-style-type: disc;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	-webkit-padding-start: 40px;
}
.nav-topbar .nav-topbar-content {
	line-height: 36px;
}
li {
	margin-right: 7px;
	float: left;
}

.type-line{
	overflow: hidden;
}
.nav-category-group{
	clear: both;
}
.type-line .nav-category{
	clear: both;
	position: relative;
	padding: 0 100px 0 107px;
	height: 20px;
	overflow: hidden;
	margin-top: 11px;
	margin-bottom: 11px;
}
.nav-category h4{
	position: absolute;
	color: #666;
	font-weight: 400;
	left: 22px;
	top: 0;
	overflow: hidden;
	max-width: 68px;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding-right: 5px;
	text-align: left;
}
.nav-search-con{
	padding-top: 7px;
}
</style>
<%= javascript_include_tag "ichart.1.2.min" %>
<%= stylesheet_link_tag  "buglist-div-use.css" %>
<%= stylesheet_link_tag  "buglist-ichart.css" %>
<%= stylesheet_link_tag  "buglist.css" %>

  <div class="mask">
    <div class="header2"></div>
    <div class="colleft">
      <div class="col1" >
        <h1>安全态势分析 </h1>
        <div id='canvasDiv' style="border-style:none"></div>
      </div>

      <div class="col2">
      <div> <span> <h1 style="fontsize:19px">软件安全态势</h1></span><span  style="margin-top: -30px; margin-right:70px;float: right; display: block;"><%= link_to '更多 >>', allbug_open_source_projects_path %></span></div>
        <div class="fixed"></div>
        <div class="li_list" style="margin-top:10px;margin-left:10px">
          <ul style="list-style-type: square;">
          	<% @bugs.each do |bug| %>
          	<li style="width:400px;"><span class="li_time">[<%= show_description_of_bug(bug) %>]</span><%= link_to bug.bug.subject, bug.bug.url, :target => '_blank' %></li>    		
          	<% end %>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <div style="clear:both; margin:0 0 10 0"></div>
 <script type="text/javascript">
                        $(function(){
                                var flow=[];
                                for(var i=0;i<24+5;i++){
                                        flow.push(Math.floor(Math.random()*(30+((i%12)*5)))+10);
                                        // t.push(Math.floor(Math.random()*(30+((i%12)*5)))+10);
                                }
                                
                                var data = [
                                                {
                                                        name : '',
                                                        value:flow,
                                                        color:'#0d8ecf',
                                                        line_width:2
                                                }

                                         ];

                                                   //创建x轴标签文本
                                  var date = new Date()

                                  var labels = [];
                                 /* labels.push(date.getFullYear()-2);
                                  labels.push(date.getFullYear()-1);
                                  labels.push(date.getFullYear());*/

                                  labels=["2012","","","","","","","","","","","","2013","","","","","","","","","","","","2014","","","",""];
                         
                                //var labels = ["","2010","2011","2012","2013","2014"];
                                
                                var line = new iChart.LineBasic2D({
                                        render : 'canvasDiv',
                                        data: data,
                                        align:'center',
                                        title : '',
                                        subtitle : '',
                                        footnote : '',
                                        width : 430, // 面板大小
                                        height : 210,
                                        shadow:true,
							//shadow_color : '#20262f',
							shadow_blur : 1,
							shadow_offsetx : 0,
							shadow_offsety : 2, 
							//background_color:null //'#383e46'设置透明背景

                                        tip:{
                                                enable:true,
                                                shadow:true,
                                                move_duration:400,
                                                border:{
										enable:true,
										radius : 5,
										width:2,
										color:'#3f8695'
										},  
							listeners:{
                                        //tip:提示框对象、name:数据名称、value:数据值、text:当前文本、i:数据点的索引
                                        parseText:function(tip,name,value,text,i){
                                        return name+"漏洞数:"+value;
                                            }
                                        }
                                        },   
                                        tipMocker:function(tips,i){
                                        	var index;
                                        	if (Math.floor(i/12)==0) {
                                        			index=0;
                                        	}else if (Math.floor(i/12)==1) {
										index=12;
                                        	}else{
                                        		index=24;
                                        	};
                                              return "<div style='font-weight:400'>"+
                                              labels[index]+" "+//日期
                                              ((i%12)==0?"1 月":((i%12+1))+"月")+  //时间
                                              "</div>"+tips.join("<br/>");
                                              }, 


                                        legend : {
								enable : true,
								row:1,//设置在一行上显示，与column配合使用
								column : 'max',
								valign:'top',
								sign:'bar',
								background_color:null,//设置透明背景
								offsetx:-80,//设置x轴偏移，满足位置需要
								border : true
							},
							  crosshair:{
                                                enable:true, //十字交叉线
                                                line_color:'#62bce9'
                                        },
                                        sub_option : {
                                        	     label:false, //是否显示数值
                                        	     // hollow_inside:false,
                                                smooth : true,//平滑曲线
                                                point_size:2 // 焦点大小
                                                // point_hollow : true,
                                                
                                                
                                        },                                    
                                         coordinate:{
                                                width:370, // 图表大小
                                                //valid_width:330,
                                                height:150,
                                                axis:{
                                                        // color:'#9f9f9f',
                                                        color:'#dcdcdc',
                                                        width:[0,0,2,2]
                                                },
                                                grids:{
                                                        vertical:{
                                                                way:'share_alike',
                                                                value:1  
                                                                // 改垂直线
                                                        }
                                                },
                                                scale:[{ 
                                                     position:'left',       
                                                     start_scale:0,
                                                     scale_space:50,
                                                     end_scale:70, 
                                                     scale_color:'#9f9f9f'
                                                    // label : {color:'#ffffff',fontsize:11},

                                                },{
                                                         position:'bottom',     
                                                         labels:labels
                                                }]
                                        }
                                });
                        //开始画图

                         /**
*自定义组件,画平均线。
*/
line.plugin(new iChart.Custom({
drawFn:function(){
/**
*计算平均值的高度(坐标Y值)
*计算高度还不会！ 会划线了！
*/
// var avg = line.total/5,
// coo = line.getCoordinate(),
// x = coo.get('originx'),
// W = coo.width,
// S = coo.getScale('left'),
// H = coo.height,
// h = (avg - S.start) * H / S.distance,
// y = line.y + H - h;
line.target.line(28,97,400,97,2,'#b32c0d')
.textAlign('start')
.textBaseline('middle')
.textFont('600 12px Verdana');
}
})); 
                        line.draw();
                });
                                
  //]]>
  </script>





<%#======================================================================box before%>
<div class="tb-navigation" data-spm="a230r.1.3"  style="margin-top:20px">
	<div class="navigation">
		<div class="nav-switch">
				<a href="javascript:(function (){$('.nav-content').toggle();})();">
			<div class="nav-switch-icon J_Switch" trace="navHideButton" title="收起导航">
            </div>
				</a>
        </div>

        <div class="nav-container">
            <div  data-group="nav-topbar">
                <div class="nav-topbar-content">
                    <ul>
                        <li class="nav-search-con">查找条件><span class="nav-topbar-arror"></span>
                        </li>
                        <li>
                        	<span class="topbar-search J_TopbarSearch">
                                <%= show_condition(@app_dir, @language, @created_at, params[:name]) %>
                            </span>
                        </li>
						<li class="nav-search-con">共 <span class="h"><%= @os_project_count %></span> 个开源项目</li>
						<!-- <li class="related-count"><a href="/search?q=iphone&amp;app=vproduct&amp;vlist=1&amp;from_combo=true">8款相关产品</a></li> -->
					</ul>
				</div>
				<div class="nav-category-panel"></div>
			</div>
			<div class="nav-content">
				<!-- 推荐属性-->
				<div class="nav-category-group type-line" data-group="type-line">
					<div class="nav-category ">
						<h4 title="网络类型">应用方向<span>：</span></h4>
						<%= link_to "操作系统相关", open_source_projects_path(:app_dir => "操作系统相关", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "管理和监控", open_source_projects_path(:app_dir => "管理和监控", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "游戏/娱乐", open_source_projects_path(:app_dir => "游戏/娱乐", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "应用工具", open_source_projects_path(:app_dir => "应用工具", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "数据库相关", open_source_projects_path(:app_dir => "数据库相关", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "服务器软件", open_source_projects_path(:app_dir => "服务器软件", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "网站系统", open_source_projects_path(:app_dir => "网站系统", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "插件和扩展", open_source_projects_path(:app_dir => "插件和扩展", :language => @language, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
							<span class="arrow arrow-bottom"></span>
						</a>
					</div>	
					<div class="nav-category ">
						<h4 title="网络类型">开发语言<span>：</span></h4>
						<%= link_to "JAVA", open_source_projects_path(:language => "JAVA", :app_dir => @app_dir, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "C++", open_source_projects_path(:language => "c++", :app_dir => @app_dir, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "C", open_source_projects_path(:language => "c", :app_dir => @app_dir, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "C#", open_source_projects_path(:language => "c#", :app_dir => @app_dir, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "ruby", open_source_projects_path(:language => "ruby", :app_dir => @app_dir, :created_at => @created_at, :name => params[:name]), :class => "nav-more J_More show" %>
						<%#= link_to "其他", open_source_projects_path(:language => "其他", :app_dir => @app_dir, :created_at => @created_at), :class => "nav-more J_More show" %>
						
							<span class="arrow arrow-bottom"></span>
						</a>
					</div>
					<div class="nav-category ">
						<h4 title="网络类型">创立时间<span>：</span></h4>
						<%= link_to "2014", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "2014", :name => params[:name]), :class => "nav-more J_More show" %>						
						<%= link_to "2013", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "2013", :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "2012", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "2012", :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "2011", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "2011", :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "2010", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "2010", :name => params[:name]), :class => "nav-more J_More show" %>
						<%= link_to "更早", open_source_projects_path(:app_dir => @app_dir, :language => @language, :created_at => "更早", :name => params[:name]), :class => "nav-more J_More show" %>
						
							<span class="arrow arrow-bottom"></span>
						</a>
					</div>
				</div>
				<div class="nav-category-group type-block" data-group="type-block">
					<div class="nav-flexbox ">
					</div>
					<div class="nav-flexbox ">
					</div>
					<div class="nav-flexbox last">
						<div class="nav-category">
							<h4 title="上市时间"> </h4>
							<div class="nav-category-wrap ">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<%#======================================================================box after%>

<div id="projects-index">

	<ul class='projects'>
		<% @open_source_projects.each do |project| %>
		<li class='project-table'>
			<div class = 'root'>
				<%= link_to project.name, open_source_project_path(project), :class=>"project root leaf"%>
				<span style="float: right;"></span>
				<%= render :partial => 'open_source_projects/os_project', :locals => {:project => project}%>
			</div>
		</li>
		<% end %>
	</ul>
</div>

<div class="pagination">
	<ul>
		<%= pagination_links_full @os_project_pages, @os_project_count %>
	</ul>
</div>

<% html_title(l(:label_project_plural)) -%>