Dev/offsite2014

tv/offsite2014.html

@@ -23,11 +23,16 @@
             var configRequire = {};
             configRequire[config.app + '/project/offsite2014/widget/get-data/main'] = {
                 handler: {
-                    "new-comers": "http://10.128.34.240:8099/newsletter"
+                    "new-comers": "http://10.128.34.240:8099/newcommer",
+                    "meet-our-people": "http://10.128.34.240:8099/meetourpeople"
                 }
             };
             configRequire[config.app + '/project/offsite2014/page/index/main'] = {
-                span: 5000
+                span: 1000
+            };
+            configRequire[config.app + '/project/offsite2014/page/index/widget/qa-dashboard/main'] = {
+                handler: "http://jenkins.englishtown.com:8080",
+                span: 10000
             };
             require.config({
                 context: config.context || '_',
@@ -46,7 +51,10 @@
         <div class="header-bar"></div>
         <div class="new-comers"></div>
         <div class="meet-our-people"></div>
+        <div class="qa-dashboard"></div>
     </div>
 
+    <div class="console"></div>
+
 </body>
 </html>

tv/src/project/offsite2014/page/index/main.css

@@ -12,6 +12,21 @@ body {
     height: 1080px;
     */
 }
+.console {
+  position: absolute;
+  z-index: 10;
+  left: 0;
+  bottom: 0.5em;
+  width: 100%;
+  height: 2em;
+  font-size: 12px;
+  line-height: 1em;
+  color: Red;
+  text-align: center;
+  background-color: transparent;
+  opacity: 0.2;
+  filter: alpha(opacity=20);
+}
 @media (max-width: 768px) {
   body {
     font-size: 12px;

tv/src/project/offsite2014/page/index/main.js

@@ -8,7 +8,8 @@
     'when',
     './widget/header-bar/main',
     './widget/new-comers/main',
-    './widget/meet-our-people/main'
+    './widget/meet-our-people/main',
+    './widget/qa-dashboard/main'
 ], function (
     module,
     $,
@@ -19,7 +20,8 @@
     when,
     headerbar,
     newcomers,
-    meetourpeople
+    meetourpeople,
+    qadashboard
 ) {
     (new tagger()).tag({more: true});
 
@@ -29,20 +31,31 @@
         $(domReady);
     }
 
+    function getParameterByURL(n){var qs=window.location.href.toLowerCase().match(/[^\?#]+?\?(.*?)(?:#.*?)?$/i),m=qs?(new RegExp('(?:^|&)'+n+'=([^&]*?)(?:&|$)','i')).exec(qs[1]):qs;return m?m[1]:undefined};
+
     function domReady($) {
         var config = module.config(),
             tabs = [{
                 $container: $('.new-comers'),
                 tab: newcomers
-            },{
-                $container: $('.meet-our-people'),
-                tab: meetourpeople
             }],
             isHeaderBarInit = false,
             isFirstTabInit = false,
             span = (config && config.span) ? config.span : 1000,
             iCurrentTab = 0;
 
+        if (getParameterByURL('meetourpeople')) {
+            tabs.push({
+                $container: $('.meet-our-people'),
+                tab: meetourpeople
+            });
+        }
+
+        tabs.push({
+            $container: $('.qa-dashboard'),
+            tab: qadashboard
+        });
+
         function switchTab() {
             var tabCurrent = tabs[iCurrentTab].tab,
                 $containerCurrent = tabs[iCurrentTab].$container,

tv/src/project/offsite2014/page/index/main.less

@@ -14,6 +14,22 @@
     */
 }
 
+.console {
+    position: absolute;
+    z-index: 10;
+    left: 0;
+    bottom: 0.5em;
+    width: 100%;
+    height: 2em;
+    font-size: 12px;
+    line-height: 1em;
+    color: Red;
+    text-align: center;
+    background-color: transparent;
+    opacity: 0.2;
+    filter: alpha(opacity=20);
+}
+
 @media (max-width: 768px) {
     body {
         font-size: 12px;

tv/src/project/offsite2014/page/index/widget/header-bar/main.html

@@ -1,7 +1,7 @@
 <div class="row">
     <div class="col-xs-12 item">
         <div class="title"></div>
-        <div class="subtitle"></div>
+        <!-- <div class="subtitle"></div> -->
         <div class="pre-line"></div>
         <div class="icon"></div>
         <div class="next-line"></div>

tv/src/project/offsite2014/page/index/widget/meet-our-people/main.js

@@ -23,6 +23,7 @@
         deferCssReady = when.defer(),
         deferDomReady = when.defer(),
         span = 3000,
+        numberOfDisplay = 12,
         $container,
         callbackData,
         dataMeetOurPeople,
@@ -41,6 +42,9 @@
             if (pConfig.span) {
                 span = pConfig.span;
             }
+            if (pConfig.numberOfDisplay) {
+                numberOfDisplay = pConfig.numberOfDisplay;
+            }
         }
     }
 
@@ -71,7 +75,14 @@
                         detail: false,
                     };
                 callbackData = function(data) {
-                    dataMeetOurPeople = data['new-comers'];
+                    if (!data['meet-our-people'] && !(data['meet-our-people'] instanceof Array)) {
+                        return;
+                    }
+                    var arrDataMeetOurPeople = [];
+                    for (var i = 0, len = data['meet-our-people'].length; i < len && i < numberOfDisplay; i++) {
+                        arrDataMeetOurPeople.push(data['meet-our-people'][i]);
+                    }
+                    dataMeetOurPeople = arrDataMeetOurPeople;
                     list.update(dataMeetOurPeople).then(function () {
                         if (!isInit.list) {
                             if (!isInit.detail && dataMeetOurPeople.length > indexCurrent) {
@@ -94,7 +105,7 @@
                         }
                     });
                 };
-                pollingData.on('new-comers', callbackData);
+                pollingData.on('meet-our-people', callbackData);
                 $(window).on('resize', onResize);
                 onResize();
             });

tv/src/project/offsite2014/page/index/widget/meet-our-people/widget/detail/main.css

@@ -5,64 +5,53 @@
 .meet-our-people .detail .columns {
   display: none;
   position: relative;
-  height: 100%;
-  /*
-            -moz-column-count: 2;
-            -webkit-column-count: 2;
-            column-count: 2;
-            -moz-column-gap: 4em;
-            -webkit-column-gap: 4em;
-            column-gap: 4em;
-            */
-}
-.meet-our-people .detail .columns .left,
-.meet-our-people .detail .columns .right {
+  min-height: 100%;
+  -moz-column-count: 2;
+  -webkit-column-count: 2;
+  column-count: 2;
+  -moz-column-gap: 4em;
+  -webkit-column-gap: 4em;
+  column-gap: 4em;
+}
+.meet-our-people .detail .columns .header {
   position: absolute;
-  top: 0;
-  width: 49%;
-  height: 100%;
-  overflow: hidden;
-}
-.meet-our-people .detail .columns .left {
+  top: 11em;
   left: 0;
-  background-color: transparent;
-}
-.meet-our-people .detail .columns .left .header {
-  margin-top: 10em;
+  padding-right: 2em;
+  width: 50%;
 }
-.meet-our-people .detail .columns .left .header .pic {
+.meet-our-people .detail .columns .header .pic {
   width: 100%;
 }
-.meet-our-people .detail .columns .left .header .info {
+.meet-our-people .detail .columns .header .info {
   font-family: Georgia;
   font-size: 1em;
   font-style: italic;
 }
-.meet-our-people .detail .columns .left .header .info .name {
+.meet-our-people .detail .columns .header .info .name {
   font-family: Myriad Pro;
-  font-size: 3.6em;
+  font-size: 2.2em;
   font-weight: bold;
 }
-.meet-our-people .detail .columns .left .touch {
-  margin-top: 4em;
+.meet-our-people .detail .columns .body {
+  /* margin-top: 2.6em; */
+}
+.meet-our-people .detail .columns .body .desc {
+  font-family: Myriad Pro;
+  font-size: 1em;
+  line-height: 1.4em;
+}
+.meet-our-people .detail .columns .body .touch {
+  margin-top: 2em;
   line-height: 1.4em;
   color: #45A39A;
 }
-.meet-our-people .detail .columns .left .touch .touch-label {
+.meet-our-people .detail .columns .body .touch .touch-label {
   font-weight: bold;
 }
-.meet-our-people .detail .columns .left .touch .touch-mobile {
+.meet-our-people .detail .columns .body .touch .touch-mobile {
   margin-top: 1.4em;
 }
-.meet-our-people .detail .columns .left .touch .two-dimensional-code {
+.meet-our-people .detail .columns .body .touch .two-dimensional-code {
   width: 100%;
 }
-.meet-our-people .detail .columns .right {
-  right: 0;
-}
-.meet-our-people .detail .columns .right .desc {
-  margin-left: 2em;
-  font-family: Myriad Pro;
-  font-size: 1em;
-  line-height: 1.4em;
-}

tv/src/project/offsite2014/page/index/widget/meet-our-people/widget/detail/main.html

@@ -1,17 +1,19 @@
 <div class="columns">
-    <div class="left">
-        <div class="row header">
-            <div class="col-xs-6">
-                <img class="pic" src="" />
-            </div>
-            <div class="col-xs-1"></div>
-            <div class="col-xs-5 info">
-                <div class="label"></div>
-                <div class="name"></div>
-                <div class="position"></div>
-                <div class="date"></div>
-            </div>
+    <div class="row header">
+        <div class="col-xs-6">
+            <img class="pic" src="" />
         </div>
+        <div class="col-xs-1"></div>
+        <div class="col-xs-5 info">
+            <!-- <div class="label"></div> -->
+            <div class="name"></div>
+            <div class="position"></div>
+            <!-- <div class="date"></div> -->
+        </div>
+    </div>
+    <div class="body">
+        <div class="desc"></div>
+        <!--
         <div class="row touch">
             <div class="col-xs-9">
                 <div class="touch-label">How to get in touch:</div>
@@ -22,8 +24,6 @@
                 <img class="two-dimensional-code pic2" src="" />
             </div>
         </div>
-    </div>
-    <div class="right body">
-        <div class="desc"></div>
+        -->
     </div>
 </div>

tv/src/project/offsite2014/page/index/widget/meet-our-people/widget/detail/main.js

@@ -37,6 +37,14 @@
 
             function fadeIn($item) {
                 templateEngine($item, data);
+                var $desc = $item.find('.desc');
+                $desc.html((function () {
+                    var strBR = '';
+                    for (var i = 0; i < 19; i++) {
+                        strBR += '<br />';
+                    }
+                    return strBR;
+                })() + $desc.html());
                 $item.fadeIn(function () {
                     deferShow.resolve();
                 });