sselab website

Author: muxfe

.gitignore

@@ -0,0 +1,35 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+dist
+.tmp
+
+# Dependency directory
+node_modules
+
+# Optional npm cache directory
+.npm
+
+# Optional REPL history
+.node_repl_history

README.md

@@ -1,2 +1,48 @@
-# xdsselab.github.io
-Home page of SSELab.
+# sselab.org
+
+sselab.org - a static website build with angular
+
+# Getting Started
+
+```sh
+$ cd sselab.org
+# install npm packages
+$ npm install
+# compile
+$ grunt build:dist -v > grunt.log
+# test
+$ node web-server.js
+```
+
+# How To Write Blog
+
+1. add blog info to `src/app/blog/blog.controller.js`
+1. create blog markdown file in `src/data/blog/[blog_title].md`
+
+Example:
+
+1.`src/app/blog/blog.controller.js`
+```
+{"title": "blog template demo", "author": "x-web", "date": "2016-04-15", "digest": "This is a simple blog demo by angular-sap.", "tags": ["angular"]}
+```
+2.`src/data/blog/2016-04-15-blog-template-demo.md`
+```md
+# This is a blog demo
+
+Powered by markdown(marked).
+```
+3.browser `http://path/to/blog/2016-04-15-blog-template-demo`
+
+# Issue Tracker
+
+* [issues](https://github.com/xdsselab/sselab.org/issues)
+
+# TODO LIST
+
+- add disqus comment module
+- add test
+ 
+
+# LICENSE
+
+MIT

app/blog/blog.html

@@ -0,0 +1 @@
+<div ng-controller="BlogCtrl"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="main row" ng-if="!isDetail"> <div class="col-md-8 blog_left"> <div class="blog" ng-repeat="blog in blogs"> <h4><a href="#/blog/{{blog.date}}-{{blog.title | blogNameGenerator}}">{{blog.title}}</a></h4> <div class="blog_list"> <ul class="list-unstyled"> <li><i class="fa fa-calendar-o"></i><span>{{blog.date | date}}</span></li> <!-- <li><a href="#"><i class="fa fa-comment"></i><span>Comments</span></a></li> --> <li><a href="#"><i class="fa fa-user"></i><span>{{blog.author}}</span></a></li> <!-- <li><a href="#"><i class="fa fa-eye"></i><span>124 views</span></a></li> --> <li><i class="fa fa-tags"></i><span>{{blog.tags.join(', ')}}</span></li> </ul> </div> <p class="para">{{blog.digest}}</p> <div class="read_more"> <a href="#/blog/{{blog.date}}-{{blog.title | blogNameGenerator}}" class="fa-btn btn-1 btn-1e">view more</a> </div> </div> <ul class="pagination"> <!-- <li><a href="#">&laquo;</a></li> --> <li ng-repeat="page in pages" ng-class="{active: currentPage == ($index + 1)}" ng-click="currentPage = 1 + $index"><a href="#/blog?currentPage={{$index + 1}}">{{$index + 1}}</a></li> <!-- <li><a href="#">&raquo;</a></li> --> </ul> </div> <div class="col-md-4 blog_right"> <ul class="tag_nav list-unstyled"> <h4>tags</h4> <li><a href="#/blog">All</a></li> <li ng-repeat="tag in blogTags" ng-class="{active: currentTag == tag}" ng-click="currentTag = tag"><a href="#/blog?tag={{tag}}">{{tag}}</a></li> <div class="clearfix"></div> </ul> </div> <div class="clearfix"></div> </div> <div class="blog detail row" ng-if="isDetail"> <div class="blog_header"> <h1 class="title">{{blogData.title}}</h1> <ul class="list-unstyled"> <li><i class="fa fa-calendar-o"></i><span>{{blogData.date | date}}</span></li> <!-- <li><a href="#"><i class="fa fa-comment"></i><span>Comments</span></a></li> --> <li><a href="#"><i class="fa fa-user"></i><span>{{blogData.author}}</span></a></li> <!-- <li><a href="#"><i class="fa fa-eye"></i><span>124 views</span></a></li> --> <li><i class="fa fa-tags"></i><span>{{blogData.tags.join(', ')}}</span></li> </ul> </div> <div class="blog_body" data-ng-bind-html="blogData.content"></div> </div> </div> </div><!-- end main --> </div>

app/home/home.html

@@ -0,0 +1 @@
+<div ng-controller="HomeCtrl as home"> <div ng-include src="'components/header/header_home.html'"></div> <div class="slider_bg"><!-- start slider --> <div class="container"> <div id="da-slider" class="da-slider text-center"> <div class="da-slide"> <h2>Data Mining</h2> <p>Large scale logs analysis.<span class="hide_text">Some detail information.</span></p> <h3 class="da-link"><a href="detail.html" class="fa-btn btn-1 btn-1e">view more</a></h3> </div> <div class="da-slide"> <h2>Big Data</h2> <p>Cloud platform.<span class="hide_text">Some detail information.</span></p> <h3 class="da-link"><a href="detail.html" class="fa-btn btn-1 btn-1e">view more</a></h3> </div> <div class="da-slide"> <h2>Service-oriented Computing</h2> <!-- <p>Service-oriented computing.<span class="hide_text">Some detail information.</span></p> --> <h3 class="da-link"><a href="detail.html" class="fa-btn btn-1 btn-1e">view more</a></h3> </div> <div class="da-slide"> <h2>Cloud Computing</h2> <p>Cloud computing.<span class="hide_text">Some detail information.</span></p> <h3 class="da-link"><a href="detail.html" class="fa-btn btn-1 btn-1e">view more</a></h3> </div> </div> </div> </div><!-- end slider --> <div class="main_bg"><!-- start main --> <div class="container"> <div class="main row"> <div class="col-md-3 images_1_of_4 text-center"> <span class="bg"><i class="fa fa-globe"></i></span> <h4><a href="#">Data<br>Mining</a></h4> <p class="para">Large scale logs analysis..</p> <a href="detail.html" class="fa-btn btn-1 btn-1e">read more</a> </div> <div class="col-md-3 images_1_of_4 bg1 text-center"> <span class="bg"><i class="fa fa-database"></i></span> <h4><a href="#">Big<br>Data</a></h4> <p class="para">Spark, CloudStack, OpenStack, Hadoop.</p> <a href="detail.html" class="fa-btn btn-1 btn-1e">read more</a> </div> <div class="col-md-3 images_1_of_4 bg1 text-center"> <span class="bg"><i class="fa fa-server"></i></span> <h4><a href="#">Service-oriented<br>Computing</a></h4> <p class="para">Service-oriented Computing.</p> <a href="detail.html" class="fa-btn btn-1 btn-1e">read more</a> </div> <div class="col-md-3 images_1_of_4 bg1 text-center"> <span class="bg"><i class="fa fa-cloud"></i> </span> <h4><a href="#">Cloud<br>Computing</a></h4> <p class="para">Platform and Infrastructure Services.</p> <a href="detail.html" class="fa-btn btn-1 btn-1e">read more</a> </div> </div> </div> </div><!-- end main --> <div class="main_btm"><!-- start main_btm --> <div class="container"> <div class="main row"> <div class="col-md-6 content_left"> <img src="assets/images/pic1.jpg" alt="" class="img-responsive"> </div> <div class="col-md-6 content_right"> <h4> <span>SSELab </span>Overview </h4> <p class="para">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words. </p> <a href="detail.html" class="fa-btn btn-1 btn-1e">read more</a> </div> </div> <!--start-img-cursual--> <div id="owl-demo" class="owl-carousel text-center"> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c1.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">vehicula diam</a></h4> <p> Lorem ipsum dolor amet,consectetur adipisicing elit, sed do eiusmod tempor incididunt dolore magna aliqua. </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c2.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Morbi nunc</a></h4> <p> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c3.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> On the other hand, we denounce with righteous indignation and dislike men who are so beguiled pleasure of the moment, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c4.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Sed faucibus</a></h4> <p> Lorem ipsum dolor amet,consectetur adipisicing elit, sed do eiusmod tempor incididunt dolore magna aliqua. </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c2.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c3.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> On the other hand, we denounce with righteous indignation and dislike men who are so beguiled pleasure of the moment, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c4.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">vehicula diam</a></h4> <p> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c1.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> On the other hand, we denounce with righteous indignation and dislike men who are so beguiled pleasure of the moment, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c2.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> Lorem ipsum dolor amet,consectetur adipisicing elit, sed do eiusmod tempor incididunt dolore magna aliqua. </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c3.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">vehicula diam</a></h4> <p> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c1.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Lorem ipsum</a></h4> <p> On the other hand, we denounce with righteous indignation and dislike men who are so beguiled pleasure of the moment, </p> </div> </div> <div class="item"> <div class="cau_left"> <img class="lazyOwl" data-src="assets/images/c4.jpg" alt="Lazy Owl Image"> </div> <div class="cau_left"> <h4><a href="#">Morbi nunc</a></h4> <p> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, </p> </div> </div> </div> <!--//End-img-cursual--> </div> </div> </div>

app/paper/paper.html

@@ -0,0 +1 @@
+<div ng-controller="PaperCtrl as paper"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>Publications</h2> <div class="paper_list1" ng-repeat="paper in papers"> <h4>{{$index + 1}}. {{paper.title}}</h4> <div class="col-md-10 tech_para"> <p class="para"></p> </div> <div class="clearfix"></div> </div> </div> </div> </div><!-- end main --> </div>

app/people/people.html

@@ -0,0 +1 @@
+<div ng-controller="PeopleCtrl as people"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>People</h2> <legend></legend> <div class="group" ng-repeat="people_group in people_groups"> <h2>{{people_group.group}}</h2> <ul class="list col-md-12"> <li class="people col-md-3 text-center" ng-repeat="pp in people_group.people"> <div class="people_avatar"> <a href="{{pp.url}}"><img ng-src="{{pp.image}}" alt="{{pp.name}}"></a> </div> <div class="people_description"> <h5><a href="{{pp.url}}">{{pp.name}}</a></h5> <p>{{pp.title}}</p> <ul class="contact"> <li ng-repeat="ctt in pp.contact"><a href="{{ctt.url}}"><i class="fa fa-{{ctt.fa}}"></i></a></li> </ul> </div> </li> </ul> </div> <div class="clearfix"></div> </div> </div> </div><!-- end main --> </div>

app/photo/photo.html

@@ -0,0 +1 @@
+<div ng-controller="PhotoCtrl as photo"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>Photo</h2> <legend></legend> <div class="group"> <ul class="list col-md-12"> <li class="photo col-md-3 text-center" ng-repeat="photo in photoes"> <div class="photo_avatar"> <a href="{{photo.url}}"><img ng-src="{{photo.image}}" alt="photo"></a> </div> <div class="photo_description"> <h5><a href="{{photo.url}}">{{$index + 1}}. {{photo.title}}</a></h5> </div> </li> </ul> </div> <div class="clearfix"></div> </div> </div> </div><!-- end main --> </div>

app/project/project.html

@@ -0,0 +1 @@
+<div ng-controller="ProjectCtrl as project"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>Project</h2> <legend></legend> <div class="group"> <ul class="list col-md-12"> <li class="project col-md-3 text-center" ng-repeat="project in projects"> <div class="project_avatar"> <a href="{{project.url}}"><img ng-src="{{project.image}}" alt="project"></a> </div> <div class="project_description"> <h5><a href="{{project.url}}">{{$index + 1}}. {{project.title}}</a></h5> </div> </li> </ul> </div> <div class="clearfix"></div> </div> </div> </div><!-- end main --> </div>

app/software/software.html

@@ -0,0 +1 @@
+<div ng-controller="SoftwareCtrl as software"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>Software</h2> <legend></legend> <div class="group"> <ul class="list col-md-12"> <li class="project col-md-3 text-center" ng-repeat="software in softwares"> <div class="project_avatar"> <a href="{{software.url}}"><img ng-src="{{software.image}}" alt="project"></a> </div> <div class="project_description"> <h5><a href="{{software.url}}">{{$index + 1}}. {{software.title}}</a></h5> </div> </li> </ul> </div> <div class="clearfix"></div> </div> </div> </div><!-- end main --> </div>

app/sponsor/sponsor.html

@@ -0,0 +1 @@
+<div ng-controller="SponsorCtrl as sponsor"> <div ng-include src="'components/header/header.html'"></div> <div class="main_bg"><!-- start main --> <div class="container"> <div class="technology row"> <h2>Sponsor</h2> <legend></legend> <div class="group"> <ul class="list col-md-12"> <li class="people col-md-3 text-center" ng-repeat="sponsor in sponsors"> <div class="people_avatar"> <a href="{{sponsor.url}}"><img ng-src="{{sponsor.image}}" alt="{{sponsor.name}}"></a> </div> <div class="people_description"> <h5><a href="{{sponsor.url}}">{{sponsor.name}}</a></h5> <p>{{sponsor.title}}</p> <ul class="contact"> <li ng-repeat="ctt in sponsor.contact"><a href="{{ctt.url}}"><i class="fa fa-{{ctt.fa}}"></i></a></li> </ul> </div> </li> </ul> </div> <div class="clearfix"></div> </div> </div> </div><!-- end main --> </div>