Add extsys gui
authorsunqi310 <sun.qi310@zte.com.cn>
Wed, 14 Sep 2016 07:31:25 +0000 (15:31 +0800)
committersunqi310 <sun.qi310@zte.com.cn>
Wed, 14 Sep 2016 07:31:25 +0000 (15:31 +0800)
Change-Id: Ifd4007f7f41b6efcc5abb120a1edf3e81f213d6d
Signed-off-by: sunqi310 <sun.qi310@zte.com.cn>
35 files changed:
openo-portal/portal-extsys/pom.xml [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/css/sdn.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/loadi18nApp.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-en-US.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-zh-CN.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdn-validate.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnController.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnUtil.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/sdn/sdnView.html [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/bootstrap.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/skill.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vim.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vimChart.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/loadi18nApp.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-en-US.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-zh-CN.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/client-cometd.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vim-validate.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChart.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChartController.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimController.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimUtil.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimChart.html [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimView.html [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/animate.min.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/vnfm.css [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-en-US.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-zh-CN.properties [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/commonUtil.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfm-validate.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmController.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmUtil.js [new file with mode: 0644]
openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/vnfmView.html [new file with mode: 0644]

diff --git a/openo-portal/portal-extsys/pom.xml b/openo-portal/portal-extsys/pom.xml
new file mode 100644 (file)
index 0000000..fb21cd8
--- /dev/null
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>\r
+<!--\r
+\r
+    Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+\r
+    Licensed under the Apache License, Version 2.0 (the "License");\r
+    you may not use this file except in compliance with the License.\r
+    You may obtain a copy of the License at\r
+\r
+            http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+    Unless required by applicable law or agreed to in writing, software\r
+    distributed under the License is distributed on an "AS IS" BASIS,\r
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+    See the License for the specific language governing permissions and\r
+    limitations under the License.\r
+\r
+-->\r
+<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">\r
+    <modelVersion>4.0.0</modelVersion> \r
+    <parent>\r
+      <groupId>openo-portal</groupId>\r
+      <artifactId>openo-portal</artifactId>\r
+      <version>1.0.0-SNAPSHOT</version>\r
+      <relativePath></relativePath>\r
+    </parent>\r
+\r
+    <groupId>openo-portal.module.extsys</groupId>\r
+    <artifactId>module-extsys</artifactId>\r
+       <version>1.0.0-SNAPSHOT</version>\r
+    <packaging>pom</packaging>\r
+</project>\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/css/sdn.css b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/css/sdn.css
new file mode 100644 (file)
index 0000000..558ac20
--- /dev/null
@@ -0,0 +1,492 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+body {\r
+       font-family: microsoft yahei !important;\r
+}\r
+\r
+/* blue pill (inspired by iTunes)\r
+*******************************************************************************/\r
+\r
+.grey {\r
+  background-color: #e5e5e5;\r
+  color: #333;\r
+}\r
+\r
+.blue {\r
+\r
+       background-color: #5b9bd1;\r
+       border-radius: 20px;\r
+       color: #fff;\r
+       font-weight: bold;\r
+       padding: 8px 0;\r
+       text-align: center;\r
+       width: 100px;\r
+}\r
+\r
+.blue:hover {\r
+       background-color: #e8f3fd;\r
+       color: #5b9bd1;\r
+}\r
+\r
+.blue.selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+.blue.selected:hover {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+p {\r
+       color: #444;\r
+       font-size: 14px;\r
+       font-weight: normal;\r
+       line-height: 21px;\r
+       margin: 0 0 12px 0;\r
+}\r
+\r
+p.credit {\r
+       border-top: 1px solid #ccc;\r
+       font-size: 14px;\r
+       line-height: 140%;\r
+       margin: 36px 0 12px 0;\r
+       padding: 8px 0 0 0;\r
+       text-align: center;\r
+}\r
+\r
+ul.column {\r
+       float: left;\r
+       list-style: none;\r
+       width: 675px;\r
+}\r
+\r
+ul.column li {\r
+       background: #eee;\r
+       -webkit-border-radius: 5px;\r
+       border-radius: 5px;\r
+       -webkit-box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       float: left;\r
+       margin: 10px 0 0 10px;\r
+       display: block;\r
+       height: 150px;\r
+       text-align: center;\r
+       width: 215px;\r
+}\r
+\r
+/* Clear Floated Elements\r
+------------------------------------------------------------------------------*/\r
+.column:after,.button-collection:after,.clearfix:after,div.project-info:after\r
+       {\r
+       clear: both;\r
+       content: ' ';\r
+       display: block;\r
+       font-size: 0;\r
+       line-height: 0;\r
+       visibility: hidden;\r
+       width: 0;\r
+       height: 0;\r
+}\r
+\r
+.container-fluid {\r
+       background-color:white !important;\r
+       min-height:500px;\r
+}\r
+\r
+.nav-tabs {\r
+       border: 0;\r
+}\r
+\r
+.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus\r
+       {\r
+       border: 0;\r
+       border-top: 3px solid #F3565D;\r
+}\r
+\r
+.nav-tabs>li>a {\r
+       border-radius: 0;\r
+}\r
+\r
+.nav-tabs>li>a:hover {\r
+       background-color: #f1f3fa;\r
+       border: 1Px solid #f1f3fa;\r
+}\r
+\r
+.c3 {\r
+       margin-top: 120px;\r
+}\r
+\r
+.skills-chart-breadcrumb {\r
+       \r
+}\r
+\r
+.blue:selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+}\r
+\r
+.btn {\r
+       /* border-width: 0; */\r
+       /* padding: 7px 14px; */\r
+       /* font-size: 14px; */\r
+       /* outline: none !important; */\r
+       /* background-image: none !important; */\r
+       /* filter: none; */\r
+       /* -webkit-box-shadow: none; */\r
+       -moz-box-shadow: none;\r
+       /* box-shadow: none; */\r
+       /* text-shadow: none; */\r
+}\r
+\r
+select {\r
+       border-width: 1px;\r
+       padding: 4px 1px;\r
+       border-radius: 4px;\r
+}\r
+\r
+.input-sm {\r
+       padding: 4px 10px;\r
+}\r
+\r
+.btn-block {\r
+       display: block;\r
+       width: 100%;\r
+       padding-left: 0;\r
+       padding-right: 0;\r
+}\r
+\r
+/* Bootstrap buttons */\r
+\r
+\r
+.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active\r
+       {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.btn-default:active,.btn-default.active {\r
+       background-image: none;\r
+       background-color: #e0e0e0;\r
+       font-weight: bold;\r
+}\r
+\r
+.btn-default:active:hover,.btn-default.active:hover {\r
+       background-color: #e6e6e6;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       background-image: none;\r
+}\r
+\r
+.btn-default.disabled,.btn-default.disabled:hover,.btn-default.disabled:focus,.btn-default.disabled:active,.btn-default.disabled.active,.btn-default[disabled],.btn-default[disabled]:hover,.btn-default[disabled]:focus,.btn-default[disabled]:active,.btn-default[disabled].active,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default:hover,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default.active\r
+       {\r
+       background-color: #fff;\r
+       border-color: #ccc;\r
+}\r
+\r
+.btn-default .badge {\r
+       color: #fff;\r
+       background-color: #333;\r
+}\r
+\r
+\r
+.btn-default>i[class^="icon-"],.btn-default>i[class*="icon-"] {\r
+       color: #8c8c8c;\r
+}\r
+\r
+div[data-name="tab_zone"] div {\r
+       background-color: #f1f3fa;\r
+       padding: 0px;\r
+}\r
+\r
+div[data-name="cond_zone"] div {\r
+       background-color: #fff;\r
+       margin-top: 15px;\r
+       margin-bottom: 15px;\r
+}\r
+\r
+div[data-name="res-conds-zone"] {\r
+       display: inline;\r
+}\r
+\r
+div[data-name="res-conds-zone"] select,div[data-name="res-conds-zone"] span\r
+       {\r
+       /**height:33px;*/\r
+       margin-left: 15px;\r
+       color: #5b9bd1;\r
+       border-color: #ccc;\r
+       font-weight: bold;\r
+}\r
+\r
+.input{\r
+       width:250px;\r
+  height: 34px;\r
+  padding: 6px 12px;\r
+  font-size: 14px;\r
+  line-height: 1.42857143;\r
+  color: #555;\r
+  background-color: #fff;\r
+  background-image: none;\r
+  border: 1px solid #ccc;\r
+  border-radius: 4px;\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+}\r
+\r
+div.separator {\r
+       margin: 20px;\r
+}\r
+\r
+div.separator div {\r
+       text-align: center;\r
+       line-height: 0;\r
+}\r
+\r
+div.separator-line {\r
+       height: 1px !important;\r
+       width: 100%;\r
+       background: #ddd;\r
+       overflow: hidden;\r
+}\r
+\r
+.dropdown-toggle {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.calendar-date {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.range_inputs {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.btn.dropdown-toggle,.btn-group .btn.dropdown-toggle,.btn:hover,.btn:disabled,.btn[disabled],.btn:focus,.btn:active,.btn.active\r
+       {\r
+       outline: none !important;\r
+       background-image: none !important;\r
+       filter: none;\r
+       -webkit-box-shadow: none;\r
+       -moz-box-shadow: none;\r
+       box-shadow: none;\r
+       text-shadow: none;\r
+}\r
+\r
+#skills-chart-breadcrumb {\r
+       margin-bottom: 10px\r
+}\r
+\r
+/*增加daterangepicker的css*/\r
+input[name="daterange"] {\r
+       width: 220px;\r
+       line-height: 0;\r
+       height: 31px;\r
+       vertical-align: top;\r
+       margin-top: 2px;\r
+}\r
+\r
+.daterangepicker .ranges {\r
+       width: 205px;\r
+}\r
+\r
+.daterangepicker .ranges input {\r
+       width: 95px !important;\r
+}\r
+\r
+td.details-control {\r
+       background: url('../images/details_open.png') no-repeat center center;\r
+       cursor: pointer;\r
+}\r
+\r
+tr.shown td.details-control {\r
+       background: url('../images/details_close.png') no-repeat center center;\r
+}\r
+\r
+.details table td {\r
+       word-wrap: break-word;\r
+       word-break: normal;\r
+       border-top: 1px solid #dddddd;\r
+}\r
+\r
+.details table  tr:first-child td {\r
+       border-top: none;\r
+}\r
+\r
+.details table {\r
+       table-layout: fixed;\r
+       width: 100%;\r
+}\r
+\r
+td.title {\r
+       width: 10%;\r
+}\r
+\r
+table.dataTable tbody th,table.dataTable tbody td {\r
+       padding: 8px 10px;\r
+}\r
+\r
+div.dataTables_length,div.dataTables_info {\r
+       display: inline;\r
+}\r
+\r
+div.dataTables_paginate {\r
+       display: inline;\r
+       float: right;\r
+}\r
+\r
+div.pagination-panel {\r
+       margin-right: 10px;\r
+}\r
+\r
+input.pagination-panel-input {\r
+       width: 50px;\r
+}\r
+\r
+#ict_res_table_div {\r
+       margin-top: 15px;\r
+}\r
+\r
+#ict_res_table_div label {\r
+       font-weight: 100;\r
+}\r
+\r
+.daterangepicker .daterangepicker_start_input label,.daterangepicker .daterangepicker_end_input label\r
+       {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.daterangepicker .ranges .input-mini {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.cancelBtn {\r
+       padding: 5px 10px 5px 10px;\r
+}\r
+\r
+.btn:focus,.btn:active:focus,.btn.active:focus {\r
+       outline: 0;\r
+}\r
+\r
+#ict_res_table_div  table {\r
+       width: 100% !important;\r
+}\r
+\r
+.control-label .required {\r
+  color: #e02222;\r
+  font-size: 12px;\r
+  padding-left: 2px;\r
+}\r
+\r
+#ict_vim_table tbody tr{\r
+       cursor:pointer;\r
+}\r
+\r
+\r
+/*卡片面板样式*/\r
+.animated-panel {\r
+  -webkit-animation-duration: .5s;\r
+  animation-duration: .5s;\r
+  -webkit-animation-fill-mode: both;\r
+  animation-fill-mode: both;\r
+}\r
+\r
+.hpanel {\r
+  background-color: none;\r
+  border: none;\r
+  box-shadow: none;\r
+  margin-bottom: 25px;\r
+    \r
+}\r
+\r
+.hpanel .panel-body {\r
+  border: 1px solid #e4e5e7;\r
+  border-radius: 2px;\r
+  padding: 20px;\r
+  position: relative;\r
+}\r
+.h-200 {\r
+  min-height: 220px;\r
+}\r
+\r
+.m-t-xl {\r
+  margin-top: 40px;\r
+}\r
+\r
+.m-t-xl div {\r
+  margin-bottom: 15px;\r
+}\r
+\r
+.text-success {\r
+  color: #0d638f;\r
+}\r
+.hpanel > .panel-footer {\r
+  color: inherit;\r
+  border: 1px solid #e4e5e7;\r
+  border-top: none;\r
+  font-size: 90%;\r
+  background: #f7f9fa;\r
+  height:40px;\r
+  padding: 5px 15px;\r
+}\r
+.color_cloud{\r
+       color:#ccc;\r
+}\r
+.stats-title{\r
+\r
+}\r
+\r
+h3{\r
+  margin-top: 10px;\r
+  margin-bottom: 40px;\r
+  font-weight: 200;\r
+}\r
+\r
+.blue-font{\r
+       color:#428bca;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right a{\r
+       margin-left: 5px;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right .btn{\r
+       min-width: 30px !important;\r
+}\r
+\r
+.font-bold {\r
+  font-weight: 600;\r
+  margin-bottom: 15px;\r
+}\r
+\r
+.hpanel_show{\r
+       background-color: #f7f9fa;\r
+}\r
+\r
+.sdn-padding {\r
+       padding-left: 0;\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/loadi18nApp.js b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/loadi18nApp.js
new file mode 100644 (file)
index 0000000..df99343
--- /dev/null
@@ -0,0 +1,42 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+function loadPropertiesSideMenu(lang, propertiesFileNamePrefix, propertiesFilePath){\r
+    jQuery.i18n.properties({\r
+        language:lang,\r
+        name:propertiesFileNamePrefix,\r
+        path:propertiesFilePath,\r
+        mode:'map',\r
+        callback: function() {\r
+            var i18nItems = $('[name_i18n=org_openo_nfv_roc_ui_i18n]');\r
+            for(var i=0;i<i18nItems.length;i++){\r
+                var $item = $(i18nItems.eq(i));\r
+                var itemId = $item.attr('id');\r
+                var itemTitle = $item.attr('title');\r
+                if(typeof($item.attr("title")) == "string"){\r
+                    $item.attr("title", ($.i18n.prop(itemTitle)));\r
+                }\r
+                if(undefined != itemId && typeof($item.attr("placeholder"))=="undefined"){\r
+                    $item.text($.i18n.prop(itemId));\r
+                }else if(undefined != itemId && typeof($item.attr("placeholder"))!="undefined"){\r
+                    $item.attr("placeholder", $.i18n.prop(itemId));\r
+                }\r
+            }\r
+        }\r
+    });\r
+}\r
+var lang = getLanguage();\r
+loadPropertiesSideMenu(lang, 'roc-sdn-iui-i18n', 'i18n/');\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-en-US.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-en-US.properties
new file mode 100644 (file)
index 0000000..efdaea5
--- /dev/null
@@ -0,0 +1,49 @@
+#\r
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+#\r
+# Licensed under the Apache License, Version 2.0 (the "License");\r
+# you may not use this file except in compliance with the License.\r
+# You may obtain a copy of the License at\r
+#\r
+#         http://www.apache.org/licenses/LICENSE-2.0\r
+#\r
+# Unless required by applicable law or agreed to in writing, software\r
+# distributed under the License is distributed on an "AS IS" BASIS,\r
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+# See the License for the specific language governing permissions and\r
+# limitations under the License.\r
+#\r
+\r
+roc-sdn-iui-common-tip=Tip:\r
+\r
+roc-sdn-iui-text-register=Register SDN controller info\r
+\r
+roc-sdn-iui-message-growl-msg-title=SDN controller info\r
+roc-sdn-iui-message-query-fail=Query SDN controller failed.\r
+roc-sdn-iui-message-save-success=Save successfully.\r
+roc-sdn-iui-message-save-fail=Save failed.\r
+roc-sdn-iui-message-update-success=Update successfully.\r
+roc-sdn-iui-message-update-fail=Update failed.\r
+roc-sdn-iui-message-delete-confirm=Do you want to delete the current SDN controller?\r
+roc-sdn-iui-message-delete-success=SDN controller deleted successfully.\r
+roc-sdn-iui-message-delete-fail=SDN controller deleted failed.\r
+\r
+roc-sdn-iui-text-update=Modify SDN controller info\r
+roc-sdn-iui-text-registerBtn=Register\r
+roc-sdn-iui-text-name=Name\r
+roc-sdn-iui-text-type=Type\r
+roc-sdn-iui-text-userName=Username\r
+roc-sdn-iui-text-password=Password\r
+roc-sdn-iui-text-cancelBtn=Cancel\r
+roc-sdn-iui-text-saveBtn=Save\r
+roc-sdn-iui-text-status-normal=Normal\r
+roc-sdn-iui-text-status-fail=Alarm\r
+roc-sdn-iui-text-total=Total\r
+roc-sdn-iui-text-total-sdn= of SDN Controller\r
+\r
+roc-sdn-iui-validate-name=Please enter a name\r
+roc-sdn-iui-validate-url-required=Please enter the right URL\r
+roc-sdn-iui-validate-url=Example: http://10.0.0.1:8181\r
+roc-sdn-iui-validate-username=Please enter a username\r
+roc-sdn-iui-validate-password=Please enter a password\r
+roc-sdn-iui-text-url-tip=Example: http://10.0.0.1:8181
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-zh-CN.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/i18n/roc-sdn-iui-i18n-zh-CN.properties
new file mode 100644 (file)
index 0000000..a8e7dbc
--- /dev/null
@@ -0,0 +1,49 @@
+#\r
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+#\r
+# Licensed under the Apache License, Version 2.0 (the "License");\r
+# you may not use this file except in compliance with the License.\r
+# You may obtain a copy of the License at\r
+#\r
+#         http://www.apache.org/licenses/LICENSE-2.0\r
+#\r
+# Unless required by applicable law or agreed to in writing, software\r
+# distributed under the License is distributed on an "AS IS" BASIS,\r
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+# See the License for the specific language governing permissions and\r
+# limitations under the License.\r
+#\r
+\r
+roc-sdn-iui-common-tip=提示:\r
+\r
+roc-sdn-iui-text-register=注册SDN控制器信息\r
+\r
+roc-sdn-iui-message-growl-msg-title=SDN控制器信息\r
+roc-sdn-iui-message-query-fail=查询SDN控制器失败。\r
+roc-sdn-iui-message-save-success=保存成功。\r
+roc-sdn-iui-message-save-fail=保存失败。\r
+roc-sdn-iui-message-update-success=修改成功。\r
+roc-sdn-iui-message-update-fail=修改失败。\r
+roc-sdn-iui-message-delete-confirm=确定删除所选SDN控制器信息?\r
+roc-sdn-iui-message-delete-success=删除成功。\r
+roc-sdn-iui-message-delete-fail=删除失败。\r
+\r
+roc-sdn-iui-text-update=修改SDN控制器信息\r
+roc-sdn-iui-text-registerBtn=注册\r
+roc-sdn-iui-text-name=名称\r
+roc-sdn-iui-text-type=类型\r
+roc-sdn-iui-text-userName=用户名\r
+roc-sdn-iui-text-password=密码\r
+roc-sdn-iui-text-cancelBtn=取消\r
+roc-sdn-iui-text-saveBtn=保存\r
+roc-sdn-iui-text-status-normal=正常\r
+roc-sdn-iui-text-status-fail=报警\r
+roc-sdn-iui-text-total=共\r
+roc-sdn-iui-text-total-sdn= SDN控制器\r
+\r
+roc-sdn-iui-validate-name=请输入名称\r
+roc-sdn-iui-validate-url-required=请输入正确的URL\r
+roc-sdn-iui-validate-url=例如:http://10.0.0.1:8181\r
+roc-sdn-iui-validate-username=请输入用户名\r
+roc-sdn-iui-validate-password=请输入密码\r
+roc-sdn-iui-text-url-tip=例如:http://10.0.0.1:8181
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdn-validate.js b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdn-validate.js
new file mode 100644 (file)
index 0000000..21b711a
--- /dev/null
@@ -0,0 +1,67 @@
+$(function () {\r
+    var form = $('#sdn_form');\r
+    var error = $('.alert-danger', form);\r
+    var success = $('.alert-success', form);\r
+\r
+    form.validate({\r
+        doNotHideMessage : true, //this option enables to show the error/success messages on tab switch.\r
+        errorElement : 'span', //default input error message container\r
+        errorClass : 'help-block', // default input error message class\r
+        focusInvalid : false, // do not focus the last invalid input\r
+        rules : {\r
+            name : {\r
+                required : true,\r
+                maxlength : 20\r
+            },\r
+            url : {\r
+                required : true,\r
+                url : true\r
+            },\r
+            userName : {\r
+                required : true,\r
+                maxlength : 20\r
+            },\r
+            password : {\r
+                required : true,\r
+                maxlength : 20\r
+            }\r
+        },\r
+        messages : {\r
+            name : {\r
+                required : $.i18n.prop("roc-sdn-iui-validate-name")\r
+            },\r
+            url : {\r
+                required : $.i18n.prop("roc-sdn-iui-validate-url-required"),\r
+                url : $.i18n.prop("roc-sdn-iui-validate-url")\r
+            },\r
+            userName : {\r
+                required : $.i18n.prop('roc-sdn-iui-validate-username')\r
+            },\r
+            password : {\r
+                required : $.i18n.prop('roc-sdn-iui-validate-password')\r
+            }\r
+        },\r
+        errorPlacement : function (error, element) { // render error placement for each input type\r
+            error.insertAfter(element); // for other inputs, just perform default behavior\r
+        },\r
+        invalidHandler : function (event, validator) { //display error alert on form submit\r
+            success.hide();\r
+            error.show();\r
+        },\r
+        highlight : function (element) { // hightlight error inputs\r
+            $(element).closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group\r
+        },\r
+        unhighlight : function (element) { // revert the change done by hightlight\r
+            $(element).closest('.form-group').removeClass('has-error'); // set error class to the control group\r
+        },\r
+        success : function (label) {\r
+            label.addClass('valid') // mark the current input as valid and display OK icon\r
+            .closest('.form-group').removeClass('has-error'); // set success class to the control group\r
+        },\r
+        submitHandler : function (form) {\r
+            success.show();\r
+            error.hide();\r
+            //add here some ajax code to submit your form or just call form.submit() if you want to submit the form without ajax\r
+        }\r
+    });\r
+});\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnController.js b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnController.js
new file mode 100644 (file)
index 0000000..0b6c5c2
--- /dev/null
@@ -0,0 +1,202 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+\r
+var vm = avalon\r
+    .define({\r
+        $id : "sdnController",\r
+        sdnInfo : [],\r
+        server_rtn : {\r
+            info_block : false,\r
+            warning_block : false,\r
+            rtn_info : "",\r
+            $RTN_SUCCESS : "RTN_SUCCESS",\r
+            $RTN_FAILED : "RTN_FAILED"\r
+        },\r
+        $Status : {\r
+            success : "active",\r
+            failed : "inactive"\r
+        },\r
+        $restUrl : {\r
+            querySdnControllerInfoUrl : '/openoapi/extsys/v1/sdncontrollers',\r
+            addSdnControllerInfoUrl : '/openoapi/extsys/v1/sdncontrollers',\r
+            updateSdnControllerInfoUrl : '/openoapi/extsys/v1/sdncontrollers',\r
+            delSdnControllerInfoUrl : '/openoapi/extsys/v1/sdncontrollers'\r
+        },\r
+        $htmlText : {\r
+            saveSuccess : $.i18n.prop("roc-sdn-iui-message-save-success"),\r
+            saveFail : $.i18n.prop("roc-sdn-iui-message-save-fail"),\r
+            updateSuccess : $.i18n.prop("roc-sdn-iui-message-update-success"),\r
+            updateFail : $.i18n.prop("roc-sdn-iui-message-update-fail")\r
+        },\r
+        $initTable : function () {\r
+            $.ajax({\r
+                "type" : 'GET',\r
+                "url" : vm.$restUrl.querySdnControllerInfoUrl,\r
+                "dataType" : "json",\r
+                "success" : function (resp) {\r
+                    if (resp.operationResult == "SUCCESS") {\r
+                        vm.sdnInfo = (resp == null) ? [] : resp.data;\r
+                    } else {\r
+                        vm.sdnInfo = [];\r
+                        bootbox.alert($.i18n.prop("roc-sdn-iui-message-query-fail"));\r
+                        return;\r
+                    }\r
+                },\r
+                error : function (XMLHttpRequest, textStatus, errorThrown) {\r
+                    bootbox.alert($.i18n.prop("roc-sdn-iui-message-query-fail") + ":" + textStatus + ":" + errorThrown);\r
+                    return;\r
+                },\r
+                complete : function () {\r
+                    sdnUtil.tooltipSdnStatus();\r
+                }\r
+            });\r
+        },\r
+        $sdnType : {\r
+            condName : $.i18n.prop("roc-sdn-iui-text-type"),\r
+            component_type : 'select',\r
+            selectItems : [{\r
+                    cond_value : 'ODL',\r
+                    name : "ODL",\r
+                    value : true\r
+                }, {\r
+                    cond_value : 'ONOS',\r
+                    name : "ONOS",\r
+                    value : true\r
+                }\r
+            ]\r
+        },\r
+        addSdn : {\r
+            title : $.i18n.prop("roc-sdn-iui-text-register"),\r
+            sdnId : "",\r
+            name : "",\r
+            type : "ODL",\r
+            typeDisabled : false,\r
+            url : "",\r
+            urlTip : $.i18n.prop("roc-sdn-iui-text-url-tip"),\r
+            userName : "",\r
+            password : "",\r
+            saveType : "add"\r
+        },\r
+        $showSdnTable : function () {\r
+            vm.addSdn.title = $.i18n.prop("roc-sdn-iui-text-register"),\r
+            vm.addSdn.sdnId = "";\r
+            vm.addSdn.name = "";\r
+            vm.addSdn.type = "ODL";\r
+            vm.addSdn.typeDisabled = false;\r
+            vm.addSdn.url = "";\r
+            vm.addSdn.userName = "";\r
+            vm.addSdn.password = "";\r
+            vm.addSdn.saveType = "add";\r
+            vm.server_rtn.warning_block = false;\r
+            vm.server_rtn.info_block = false;\r
+\r
+            $(".form-group").each(function () {\r
+                $(this).removeClass('has-success');\r
+                $(this).removeClass('has-error');\r
+                $(this).find(".help-block[id]").remove();\r
+            });\r
+            $("#addSdnDlg").modal("show");\r
+        },\r
+        $saveSdn : function () {\r
+            var form = $('#sdn_form');\r
+            if (form.valid() == false) {\r
+                return false;\r
+            }\r
+            vm.server_rtn.info_block = true;\r
+            vm.server_rtn.warning_block = false;\r
+            vm.addSdn.status = vm.$Status.success;\r
+\r
+            var param = {\r
+                name : vm.addSdn.name,\r
+                controllerType : $("#type").val(),\r
+                url : vm.addSdn.url,\r
+                userName : vm.addSdn.userName,\r
+                password : vm.addSdn.password\r
+            }\r
+            if (vm.addSdn.saveType == "add") {
+                for( var i = 0; i < vm.sdnInfo.length; i ++ ){
+                    if(vm.addSdn.url == vm.sdnInfo[i].url){
+                        sdnUtil.growl($.i18n.prop("roc-sdn-iui-message-growl-msg-title") +  'already exist',"info");
+                        $('#addSdnDlg').modal('hide');
+                        return;
+                    }
+                }\r
+                $.ajax({\r
+                    type : "POST",\r
+                    url : vm.$restUrl.addSdnControllerInfoUrl,\r
+                    data : JSON.stringify(param),\r
+                    dataType : "json",\r
+                    contentType : "application/json",\r
+                    success : function (data) {\r
+                        vm.server_rtn.info_block = false;\r
+                        vm.server_rtn.warning_block = false;\r
+                        if (data) {\r
+                            vm.sdnInfo = [];\r
+                            vm.$initTable();\r
+\r
+                            $('#addSdnDlg').modal('hide');\r
+                            sdnUtil.showMessage(vm.$htmlText.saveSuccess, "success");\r
+                        } else {\r
+                            vm.server_rtn.warning_block = true;\r
+                            vm.server_rtn.rtn_info = vm.$htmlText.saveFail;\r
+                            sdnUtil.showMessage(vm.$htmlText.saveFail, "failed");\r
+                        }\r
+                    },\r
+                    error : function (XMLHttpRequest, textStatus, errorThrown) {\r
+                        vm.server_rtn.warning_block = true;\r
+                        vm.server_rtn.rtn_info = textStatus + ":" + errorThrown;\r
+                        vm.server_rtn.info_block = false;\r
+                    }\r
+                });\r
+            } else {\r
+                $.ajax({\r
+                    type : "PUT",\r
+                    url : vm.$restUrl.updateSdnControllerInfoUrl + vm.addSdn.sdnId,\r
+                    data : JSON.stringify(param),\r
+                    dataType : "json",\r
+                    contentType : "application/json",\r
+                    success : function (data) {\r
+                        vm.server_rtn.info_block = false;\r
+                        vm.server_rtn.warning_block = false;\r
+                        if (data) {\r
+                            for (var i = 0; i < vm.sdnInfo.length; i++) {\r
+                                if (vm.sdnInfo[i].sdnControllerInstanceId == vm.addSdn.sdnId) {\r
+                                    vm.sdnInfo[i].name = vm.addSdn.name;\r
+                                    vm.sdnInfo[i].type = $("#type").val();\r
+                                    vm.sdnInfo[i].url = vm.addSdn.url;\r
+                                    vm.sdnInfo[i].userName = vm.addSdn.userName;\r
+                                    vm.sdnInfo[i].password = vm.addSdn.password;\r
+                                }\r
+                            }\r
+                            $('#addSdnDlg').modal('hide');\r
+                            sdnUtil.showMessage(vm.$htmlText.updateSuccess, "success");\r
+                        } else {\r
+                            vm.server_rtn.warning_block = true;\r
+                            vm.server_rtn.rtn_info = vm.$htmlText.updateFail;\r
+                            sdnUtil.showMessage(vm.$htmlText.updateFail, "failed");\r
+                        }\r
+                    },\r
+                    error : function (XMLHttpRequest, textStatus, errorThrown) {\r
+                        vm.server_rtn.warning_block = true;\r
+                        vm.server_rtn.rtn_info = textStatus + ":" + errorThrown;\r
+                        vm.server_rtn.info_block = false;\r
+                    }\r
+                });\r
+            }\r
+        },\r
+    });\r
+avalon.scan();\r
+vm.$initTable();\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnUtil.js b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/js/sdnUtil.js
new file mode 100644 (file)
index 0000000..59062fc
--- /dev/null
@@ -0,0 +1,89 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var sdnUtil = {};\r
+\r
+sdnUtil.delSdn = function (el) {\r
+    bootbox.confirm($.i18n.prop("roc-sdn-iui-message-delete-confirm"), function (result) {\r
+        if (result) {\r
+            $.ajax({\r
+                type : "DELETE",\r
+                url : vm.$restUrl.delSdnControllerInfoUrl + el.sdnControllerInstanceId,\r
+                dataType : "json",\r
+                success : function (data) {\r
+                    if (data) {\r
+                        for (var i = 0; i < vm.sdnInfo.length; i++) {\r
+                            if (el.sdnControllerInstanceId == vm.sdnInfo[i].sdnControllerInstanceId) {\r
+                                vm.sdnInfo.splice(i, 1);\r
+                                break;\r
+                            }\r
+                        }\r
+                        sdnUtil.showMessage($.i18n.prop("roc-sdn-iui-message-delete-success"), "success");\r
+                    } else {\r
+                        sdnUtil.showMessage($.i18n.prop("roc-sdn-iui-message-delete-fail"), "warning");\r
+                    }\r
+                },\r
+                error : function () {\r
+                    sdnUtil.showMessage($.i18n.prop("roc-sdn-iui-message-delete-fail"), "warning");\r
+                }\r
+            });\r
+        }\r
+    });\r
+}\r
+\r
+sdnUtil.updateSdn = function (data) {\r
+    vm.addSdn.sdnId = data.sdnControllerInstanceId;\r
+    vm.addSdn.name = data.name;\r
+    vm.addSdn.type = data.controllerType;\r
+    vm.addSdn.typeDisabled = true;\r
+    vm.addSdn.url = data.url;\r
+    vm.addSdn.userName = data.userName;\r
+    vm.addSdn.password = data.password;\r
+    vm.addSdn.saveType = "update";\r
+    vm.addSdn.title = $.i18n.prop("roc-sdn-iui-text-update");\r
+    vm.server_rtn.info_block = false;\r
+    vm.server_rtn.warning_block = false;\r
+\r
+    $(".form-group").each(function () {\r
+        $(this).removeClass('has-success');\r
+        $(this).removeClass('has-error');\r
+        $(this).find(".help-block[id]").remove();\r
+    });\r
+    $("#addSdnDlg").modal("show");\r
+}\r
+\r
+sdnUtil.tooltipSdnStatus = function () {\r
+    $("[data-toggle='tooltip']").tooltip();\r
+}\r
+\r
+sdnUtil.growl = function (message, type) {\r
+    $.growl({\r
+        icon : "fa fa-envelope-o fa-lg",\r
+        title : "&nbsp;&nbsp;Notice: ",\r
+        message : message + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"\r
+    }, {\r
+        type : type\r
+    });\r
+}\r
+\r
+sdnUtil.showMessage = function(message, type) {\r
+    $.growl({\r
+        icon: "fa fa-envelope-o fa-lg",\r
+        title: "&nbsp;&nbsp;" + $.i18n.prop("roc-sdn-iui-common-tip"),\r
+        message: message\r
+    },{\r
+        type: type\r
+    });\r
+};\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/sdnView.html b/openo-portal/portal-extsys/src/main/webapp/extsys/sdn/sdnView.html
new file mode 100644 (file)
index 0000000..16fc12e
--- /dev/null
@@ -0,0 +1,173 @@
+<!--\r
+\r
+    Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+\r
+    Licensed under the Apache License, Version 2.0 (the "License");\r
+    you may not use this file except in compliance with the License.\r
+    You may obtain a copy of the License at\r
+\r
+            http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+    Unless required by applicable law or agreed to in writing, software\r
+    distributed under the License is distributed on an "AS IS" BASIS,\r
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+    See the License for the specific language governing permissions and\r
+    limitations under the License.\r
+\r
+-->\r
+<!DOCTYPE html>\r
+<html>\r
+<head lang="en">\r
+<meta charset="UTF-8">\r
+<title></title>\r
+<link href="../component/thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="../component/thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="../component/thirdparty/uniform/css/uniform.default.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="../component/css/ZteIctIcons/style.css" rel="stylesheet" type="text/css"/>\r
+<link href="../framework/css/ngict-component.css" rel="stylesheet" type="text/css"/>\r
+<link href="../vendor/animate/animate.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="css/sdn.css" rel="stylesheet" type="text/css"/>\r
+<style>\r
+.ms-controller {\r
+       visibility: hidden\r
+}\r
+</style>\r
+\r
+</head>\r
+<body>\r
+       <div class="ms-controller container-fluid" ms-controller="sdnController" >\r
+       <div id="addSdnDlg" class="modal  fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >\r
+               <div class="modal-dialog">\r
+                       <div class="modal-content Changepasswd">\r
+                               <div class="content">\r
+                                       <div class="modal-header">\r
+                                               <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>\r
+                                               <h4 id="myModalLabel">{{addSdn.title}}</h4>\r
+                                       </div>\r
+                                       <div class="modal-body">\r
+                                       <form class="form-horizontal" id="sdn_form" role="form">\r
+                                               <input type="hidden" ms-duplex="addSdn.sdnId"  name="sdnId" class="form-control" />\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="roc-sdn-iui-text-name" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addSdn.name"  name="name" class="form-control"/>\r
+                                                               <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="roc-sdn-iui-text-type" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                            <div class="col-sm-7">\r
+                                <select class="form-control" id="type" ms-each="$sdnType.selectItems" ms-duplex="addSdn.type" ms-attr-disabled="addSdn.typeDisabled">\r
+                                    <option ms-attr-value='el.cond_value'>{{el.name}}</option>\r
+                                </select>\r
+                                <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span>URL</span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addSdn.url" name="url" class="form-control" \r
+                                                                       ms-attr-placeholder="addSdn.urlTip"/> \r
+                                                               <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="roc-sdn-iui-text-userName" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addSdn.userName" name="userName" class="form-control" /> \r
+                                                               <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="roc-sdn-iui-text-password" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="password" ms-duplex="addSdn.password" name="password" class="form-control" /> \r
+                                                               <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                       </form>\r
+                                       </div>\r
+                                       <div class="modal-footer">\r
+                                               <button class="btn" data-dismiss="modal" aria-hidden="true" id="roc-sdn-iui-text-cancelBtn" name_i18n="org_openo_nfv_roc_ui_i18n"></button>\r
+                                               <button class="btn btn-primary" type="submit" ms-click="$saveSdn" id="roc-sdn-iui-text-saveBtn" name_i18n="org_openo_nfv_roc_ui_i18n"></button>\r
+                                       </div>\r
+                               </div>\r
+                       </div>\r
+               </div>\r
+       </div>\r
+       <div class="row-fluid" data-name="cond_zone">\r
+               <div class="col-md-12">\r
+                       <button class="btn white radius_l" id="app-new-btn" ms-click="$showSdnTable" >\r
+                       <i class="ict-new"></i> <span id="roc-sdn-iui-text-registerBtn" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                   </button>\r
+               </div>\r
+       </div>\r
+\r
+       <div class="col-sm-12 sdn-padding" ms-each-el="sdnInfo">\r
+\r
+               <div class="col-sm-4 animated-panel zoomIn" style="-webkit-animation-delay: 0.1s;">\r
+            <div class="hpanel stats" >\r
+                <div class="panel-body h-200"  ms-hover="hpanel_show" >\r
+                    <div class="pull-left">\r
+                        <span class="label label-success" id="roc-sdn-iui-text-status-normal" name_i18n="org_openo_nfv_roc_ui_i18n"></span>\r
+                    </div>\r
+                    <div class="stats-icon pull-right">\r
+                        <i class="fa fa-server  fa-5x color_cloud"></i>\r
+                    </div>\r
+                    <div class="m-t-xl">\r
+                        <h3 ms-text="el.name"></h3>   \r
+                        <div><span id="roc-sdn-iui-text-type" name_i18n="org_openo_nfv_roc_ui_i18n"></span> : <span ms-text="el.controllerType"></span></div>\r
+                        <div>URL : <span ms-text="el.url"></span></div>\r
+                    </div>\r
+                </div>\r
+                <div class="panel-footer">\r
+                    <div  class="pull-right">\r
+                        <a class="btn btn-default btn-sm" ms-click="sdnUtil.updateSdn(el.$model)"><i class="fa fa-pencil-square-o fa-lg"></i></a>\r
+                        <a class="btn btn-default btn-sm" ms-click="sdnUtil.delSdn(el)"><i class="fa fa-trash-o fa-lg"> </i></a>\r
+                    </div>\r
+                </div>\r
+            </div> \r
+        </div>\r
+    </div>\r
+    <div class="col-sm-12">\r
+        <div class="pull-left text-muted">\r
+               <small><span id="roc-sdn-iui-text-total" name_i18n="org_openo_nfv_roc_ui_i18n"></span> <span class="blue-font" ms-text="sdnInfo.size()"></span> <span id="roc-sdn-iui-text-total-sdn" name_i18n="org_openo_nfv_roc_ui_i18n"></span></small>\r
+        </div>  \r
+       </div>\r
+       </div>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery/jquery-1.10.2.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/bootstrap/js/bootstrap.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/bootbox/bootbox.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery-validation/js/jquery.validate.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery-validation/js/additional-methods.min.js"></script>\r
+       \r
+       <script type="text/javascript" src="../vendor/bootstrap-growl/bootstrap-growl.min.js"></script>\r
+       <script type="text/javascript" src="../vendor/cometd/cometd.js"></script>\r
+       <script type="text/javascript" src="../vendor/cometd/jquery.cometd.js"></script>\r
+       <script type="text/javascript" src="../vendor/avalon/avalon.js"></script>\r
+\r
+       <script type="text/javascript" src="../framework/js/tools.js"></script>\r
+       \r
+       <script type="text/javascript" src="i18n/loadi18nApp.js"></script> \r
+       \r
+       <script type="text/javascript" src="js/sdn-validate.js"></script>\r
+       <script type="text/javascript" src="js/sdnUtil.js"></script>\r
+       <script type="text/javascript" src="js/sdnController.js"></script>\r
+</body>\r
+</html>
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/bootstrap.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/bootstrap.css
new file mode 100644 (file)
index 0000000..0193ce7
--- /dev/null
@@ -0,0 +1,4965 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+article,\r
+aside,\r
+details,\r
+figcaption,\r
+figure,\r
+footer,\r
+header,\r
+hgroup,\r
+nav,\r
+section {\r
+  display: block;\r
+}\r
+\r
+audio,\r
+canvas,\r
+video {\r
+  display: inline-block;\r
+  *display: inline;\r
+  *zoom: 1;\r
+}\r
+\r
+audio:not([controls]) {\r
+  display: none;\r
+}\r
+\r
+html {\r
+  font-size: 100%;\r
+  -webkit-text-size-adjust: 100%;\r
+      -ms-text-size-adjust: 100%;\r
+}\r
+\r
+a:focus {\r
+  outline: thin dotted #333;\r
+  outline: 5px auto -webkit-focus-ring-color;\r
+  outline-offset: -2px;\r
+}\r
+\r
+a:hover,\r
+a:active {\r
+  outline: 0;\r
+}\r
+\r
+sub,\r
+sup {\r
+  position: relative;\r
+  font-size: 75%;\r
+  line-height: 0;\r
+  vertical-align: baseline;\r
+}\r
+\r
+sup {\r
+  top: -0.5em;\r
+}\r
+\r
+sub {\r
+  bottom: -0.25em;\r
+}\r
+\r
+img {\r
+  max-width: 100%;\r
+  vertical-align: middle;\r
+  border: 0;\r
+  -ms-interpolation-mode: bicubic;\r
+}\r
+\r
+button,\r
+input,\r
+select,\r
+textarea {\r
+  margin: 0;\r
+  font-size: 100%;\r
+  vertical-align: middle;\r
+}\r
+\r
+button,\r
+input {\r
+  *overflow: visible;\r
+  line-height: normal;\r
+}\r
+\r
+button::-moz-focus-inner,\r
+input::-moz-focus-inner {\r
+  padding: 0;\r
+  border: 0;\r
+}\r
+\r
+button,\r
+input[type="button"],\r
+input[type="reset"],\r
+input[type="submit"] {\r
+  cursor: pointer;\r
+  -webkit-appearance: button;\r
+}\r
+\r
+input[type="search"] {\r
+  -webkit-box-sizing: content-box;\r
+     -moz-box-sizing: content-box;\r
+          box-sizing: content-box;\r
+  -webkit-appearance: textfield;\r
+}\r
+\r
+input[type="search"]::-webkit-search-decoration,\r
+input[type="search"]::-webkit-search-cancel-button {\r
+  -webkit-appearance: none;\r
+}\r
+\r
+textarea {\r
+  overflow: auto;\r
+  vertical-align: top;\r
+}\r
+\r
+.clearfix {\r
+  *zoom: 1;\r
+}\r
+\r
+.clearfix:before,\r
+.clearfix:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.clearfix:after {\r
+  clear: both;\r
+}\r
+\r
+.hide-text {\r
+  font: 0/0 a;\r
+  color: transparent;\r
+  text-shadow: none;\r
+  background-color: transparent;\r
+  border: 0;\r
+}\r
+\r
+.input-block-level {\r
+  display: block;\r
+  width: 100%;\r
+  min-height: 28px;\r
+  -webkit-box-sizing: border-box;\r
+     -moz-box-sizing: border-box;\r
+      -ms-box-sizing: border-box;\r
+          box-sizing: border-box;\r
+}\r
+\r
+body {\r
+  margin: 0;\r
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;\r
+  font-size: 13px;\r
+  line-height: 18px;\r
+  color: #333333;\r
+  background-color: #ffffff;\r
+}\r
+\r
+a {\r
+  color: #0088cc;\r
+  text-decoration: none;\r
+}\r
+\r
+a:hover {\r
+  color: #005580;\r
+  text-decoration: underline;\r
+}\r
+\r
+.row {\r
+  margin-left: -20px;\r
+  *zoom: 1;\r
+}\r
+\r
+.row:before,\r
+.row:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.row:after {\r
+  clear: both;\r
+}\r
+\r
+[class*="span"] {\r
+  float: left;\r
+  margin-left: 20px;\r
+}\r
+\r
+.container,\r
+.navbar-fixed-top .container,\r
+.navbar-fixed-bottom .container {\r
+  width: 940px;\r
+}\r
+\r
+.span12 {\r
+  width: 940px;\r
+}\r
+\r
+.span11 {\r
+  width: 860px;\r
+}\r
+\r
+.span10 {\r
+  width: 780px;\r
+}\r
+\r
+.span9 {\r
+  width: 700px;\r
+}\r
+\r
+.span8 {\r
+  width: 620px;\r
+}\r
+\r
+.span7 {\r
+  width: 540px;\r
+}\r
+\r
+.span6 {\r
+  width: 460px;\r
+}\r
+\r
+.span5 {\r
+  width: 380px;\r
+}\r
+\r
+.span4 {\r
+  width: 300px;\r
+}\r
+\r
+.span3 {\r
+  width: 220px;\r
+}\r
+\r
+.span2 {\r
+  width: 140px;\r
+}\r
+\r
+.span1 {\r
+  width: 60px;\r
+}\r
+\r
+.offset12 {\r
+  margin-left: 980px;\r
+}\r
+\r
+.offset11 {\r
+  margin-left: 900px;\r
+}\r
+\r
+.offset10 {\r
+  margin-left: 820px;\r
+}\r
+\r
+.offset9 {\r
+  margin-left: 740px;\r
+}\r
+\r
+.offset8 {\r
+  margin-left: 660px;\r
+}\r
+\r
+.offset7 {\r
+  margin-left: 580px;\r
+}\r
+\r
+.offset6 {\r
+  margin-left: 500px;\r
+}\r
+\r
+.offset5 {\r
+  margin-left: 420px;\r
+}\r
+\r
+.offset4 {\r
+  margin-left: 340px;\r
+}\r
+\r
+.offset3 {\r\r
+  margin-left: 260px;\r
+}\r
+\r
+.offset2 {\r
+  margin-left: 180px;\r
+}\r
+\r
+.offset1 {\r
+  margin-left: 100px;\r
+}\r
+\r
+.row-fluid {\r
+  width: 100%;\r
+  *zoom: 1;\r
+}\r
+\r
+.row-fluid:before,\r
+.row-fluid:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.row-fluid:after {\r
+  clear: both;\r
+}\r
+\r
+.row-fluid [class*="span"] {\r
+  display: block;\r
+  float: left;\r
+  width: 100%;\r
+  min-height: 28px;\r
+  margin-left: 2.127659574%;\r
+  *margin-left: 2.0744680846382977%;\r
+  -webkit-box-sizing: border-box;\r
+     -moz-box-sizing: border-box;\r
+      -ms-box-sizing: border-box;\r
+          box-sizing: border-box;\r
+}\r
+\r
+.row-fluid [class*="span"]:first-child {\r
+  margin-left: 0;\r
+}\r
+\r
+.row-fluid .span12 {\r
+  width: 99.99999998999999%;\r
+  *width: 99.94680850063828%;\r
+}\r
+\r
+.row-fluid .span11 {\r
+  width: 91.489361693%;\r
+  *width: 91.4361702036383%;\r
+}\r
+\r
+.row-fluid .span10 {\r
+  width: 82.97872339599999%;\r
+  *width: 82.92553190663828%;\r
+}\r
+\r
+.row-fluid .span9 {\r
+  width: 74.468085099%;\r
+  *width: 74.4148936096383%;\r
+}\r
+\r
+.row-fluid .span8 {\r
+  width: 65.95744680199999%;\r
+  *width: 65.90425531263828%;\r
+}\r
+\r
+.row-fluid .span7 {\r
+  width: 57.446808505%;\r
+  *width: 57.3936170156383%;\r
+}\r
+\r
+.row-fluid .span6 {\r
+  width: 48.93617020799999%;\r
+  *width: 48.88297871863829%;\r
+}\r
+\r
+.row-fluid .span5 {\r
+  width: 40.425531911%;\r
+  *width: 40.3723404216383%;\r
+}\r
+\r
+.row-fluid .span4 {\r
+  width: 31.914893614%;\r
+  *width: 31.8617021246383%;\r
+}\r
+\r
+.row-fluid .span3 {\r
+  width: 23.404255317%;\r
+  *width: 23.3510638276383%;\r
+}\r
+\r
+.row-fluid .span2 {\r
+  width: 14.89361702%;\r
+  *width: 14.8404255306383%;\r
+}\r
+\r
+.row-fluid .span1 {\r
+  width: 6.382978723%;\r
+  *width: 6.329787233638298%;\r
+}\r
+\r
+.container {\r
+  margin-right: auto;\r
+  margin-left: auto;\r
+  *zoom: 1;\r
+}\r
+\r
+.container:before,\r
+.container:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.container:after {\r
+  clear: both;\r
+}\r
+\r
+.container-fluid {\r
+  padding-right: 20px;\r
+  padding-left: 20px;\r
+  *zoom: 1;\r
+}\r
+\r
+.container-fluid:before,\r
+.container-fluid:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.container-fluid:after {\r
+  clear: both;\r
+}\r
+\r
+p {\r
+  margin: 0 0 9px;\r
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;\r
+  font-size: 13px;\r
+  line-height: 18px;\r
+}\r
+\r
+p small {\r
+  font-size: 11px;\r
+  color: #999999;\r
+}\r
+\r
+.lead {\r
+  margin-bottom: 18px;\r
+  font-size: 20px;\r
+  font-weight: 200;\r
+  line-height: 27px;\r
+}\r
+\r
+h1,\r
+h2,\r
+h3,\r
+h4,\r
+h5,\r
+h6 {\r
+  margin: 0;\r
+  font-family: inherit;\r
+  font-weight: bold;\r
+  color: inherit;\r
+  text-rendering: optimizelegibility;\r
+}\r
+\r
+h1 small,\r
+h2 small,\r
+h3 small,\r
+h4 small,\r
+h5 small,\r
+h6 small {\r
+  font-weight: normal;\r
+  color: #999999;\r
+}\r
+\r
+h1 {\r
+  font-size: 30px;\r
+  line-height: 36px;\r
+}\r
+\r
+h1 small {\r
+  font-size: 18px;\r
+}\r
+\r
+h2 {\r
+  font-size: 24px;\r
+  line-height: 36px;\r
+}\r
+\r
+h2 small {\r
+  font-size: 18px;\r
+}\r
+\r
+h3 {\r
+  font-size: 18px;\r
+  line-height: 27px;\r
+}\r
+\r
+h3 small {\r
+  font-size: 14px;\r
+}\r
+\r
+h4,\r
+h5,\r
+h6 {\r
+  line-height: 18px;\r
+}\r
+\r
+h4 {\r
+  font-size: 14px;\r
+}\r
+\r
+h4 small {\r
+  font-size: 12px;\r
+}\r
+\r
+h5 {\r
+  font-size: 12px;\r
+}\r
+\r
+h6 {\r
+  font-size: 11px;\r
+  color: #999999;\r
+  text-transform: uppercase;\r
+}\r
+\r
+.page-header {\r
+  padding-bottom: 17px;\r
+  margin: 18px 0;\r
+  border-bottom: 1px solid #eeeeee;\r
+}\r
+\r
+.page-header h1 {\r
+  line-height: 1;\r
+}\r
+\r
+ul,\r
+ol {\r
+  padding: 0;\r
+  margin: 0 0 9px 25px;\r
+}\r
+\r
+ul ul,\r
+ul ol,\r
+ol ol,\r
+ol ul {\r
+  margin-bottom: 0;\r
+}\r
+\r
+ul {\r
+  list-style: disc;\r
+}\r
+\r
+ol {\r
+  list-style: decimal;\r
+}\r
+\r
+li {\r
+  line-height: 18px;\r
+}\r
+\r
+ul.unstyled,\r
+ol.unstyled {\r
+  margin-left: 0;\r
+  list-style: none;\r
+}\r
+\r
+dl {\r
+  margin-bottom: 18px;\r
+}\r
+\r
+dt,\r
+dd {\r
+  line-height: 18px;\r
+}\r
+\r
+dt {\r
+  font-weight: bold;\r
+  line-height: 17px;\r
+}\r
+\r
+dd {\r
+  margin-left: 9px;\r
+}\r
+\r
+.dl-horizontal dt {\r
+  float: left;\r
+  width: 120px;\r
+  overflow: hidden;\r
+  clear: left;\r
+  text-align: right;\r
+  text-overflow: ellipsis;\r
+  white-space: nowrap;\r
+}\r
+\r
+.dl-horizontal dd {\r
+  margin-left: 130px;\r
+}\r
+\r
+hr {\r
+  margin: 18px 0;\r
+  border: 0;\r
+  border-top: 1px solid #eeeeee;\r
+  border-bottom: 1px solid #ffffff;\r
+}\r
+\r
+strong {\r
+  font-weight: bold;\r
+}\r
+\r
+em {\r
+  font-style: italic;\r
+}\r
+\r
+.muted {\r
+  color: #999999;\r
+}\r
+\r
+abbr[title] {\r
+  cursor: help;\r
+  border-bottom: 1px dotted #ddd;\r
+}\r
+\r
+abbr.initialism {\r
+  font-size: 90%;\r
+  text-transform: uppercase;\r
+}\r
+\r
+blockquote {\r
+  padding: 0 0 0 15px;\r
+  margin: 0 0 18px;\r
+  border-left: 5px solid #eeeeee;\r
+}\r
+\r
+blockquote p {\r
+  margin-bottom: 0;\r
+  font-size: 16px;\r
+  font-weight: 300;\r
+  line-height: 22.5px;\r
+}\r
+\r
+blockquote small {\r
+  display: block;\r
+  line-height: 18px;\r
+  color: #999999;\r
+}\r
+\r
+blockquote small:before {\r
+  content: '\2014 \00A0';\r
+}\r
+\r
+blockquote.pull-right {\r
+  float: right;\r
+  padding-right: 15px;\r
+  padding-left: 0;\r
+  border-right: 5px solid #eeeeee;\r
+  border-left: 0;\r
+}\r
+\r
+blockquote.pull-right p,\r
+blockquote.pull-right small {\r
+  text-align: right;\r
+}\r
+\r
+q:before,\r
+q:after,\r
+blockquote:before,\r
+blockquote:after {\r
+  content: "";\r
+}\r
+\r
+address {\r
+  display: block;\r
+  margin-bottom: 18px;\r
+  font-style: normal;\r
+  line-height: 18px;\r
+}\r
+\r
+small {\r
+  font-size: 100%;\r
+}\r
+\r
+cite {\r
+  font-style: normal;\r
+}\r
+\r
+code,\r
+pre {\r
+  padding: 0 3px 2px;\r
+  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;\r
+  font-size: 12px;\r
+  color: #333333;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+}\r
+\r
+code {\r
+  padding: 2px 4px;\r
+  color: #d14;\r
+  background-color: #f7f7f9;\r
+  border: 1px solid #e1e1e8;\r
+}\r
+\r
+pre {\r
+  display: block;\r
+  padding: 8.5px;\r
+  margin: 0 0 9px;\r
+  font-size: 12.025px;\r
+  line-height: 18px;\r
+  word-break: break-all;\r
+  word-wrap: break-word;\r
+  white-space: pre;\r
+  white-space: pre-wrap;\r
+  background-color: #f5f5f5;\r
+  border: 1px solid #ccc;\r
+  border: 1px solid rgba(0, 0, 0, 0.15);\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+pre.prettyprint {\r
+  margin-bottom: 18px;\r
+}\r
+\r
+pre code {\r
+  padding: 0;\r
+  color: inherit;\r
+  background-color: transparent;\r
+  border: 0;\r
+}\r
+\r
+.pre-scrollable {\r
+  max-height: 340px;\r
+  overflow-y: scroll;\r
+}\r
+\r
+form {\r
+  margin: 0 0 18px;\r
+}\r
+\r
+fieldset {\r
+  padding: 0;\r
+  margin: 0;\r
+  border: 0;\r
+}\r
+\r
+legend {\r
+  display: block;\r
+  width: 100%;\r
+  padding: 0;\r
+  margin-bottom: 27px;\r
+  font-size: 19.5px;\r
+  line-height: 36px;\r
+  color: #333333;\r
+  border: 0;\r
+  border-bottom: 1px solid #eee;\r
+}\r
+\r
+legend small {\r
+  font-size: 13.5px;\r
+  color: #999999;\r
+}\r
+\r
+label,\r
+input,\r
+button,\r
+select,\r
+textarea {\r
+  font-size: 13px;\r
+  font-weight: normal;\r
+  line-height: 18px;\r
+}\r
+\r
+input,\r
+button,\r
+select,\r
+textarea {\r
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;\r
+}\r
+\r
+label {\r
+  display: block;\r
+  margin-bottom: 5px;\r
+  color: #333333;\r
+}\r
+\r
+input,\r
+textarea,\r
+select,\r
+.uneditable-input {\r
+  display: inline-block;\r
+  width: 210px;\r
+  height: 18px;\r
+  padding: 4px;\r
+  margin-bottom: 9px;\r
+  font-size: 13px;\r
+  line-height: 18px;\r
+  color: #555555;\r
+  background-color: #ffffff;\r
+  border: 1px solid #cccccc;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+}\r
+\r
+.uneditable-textarea {\r
+  width: auto;\r
+  height: auto;\r
+}\r
+\r
+label input,\r
+label textarea,\r
+label select {\r
+  display: block;\r
+}\r
+\r
+input[type="image"],\r
+input[type="checkbox"],\r
+input[type="radio"] {\r
+  width: auto;\r
+  height: auto;\r
+  padding: 0;\r
+  margin: 3px 0;\r
+  *margin-top: 0;\r
+  /* IE7 */\r
+\r
+  line-height: normal;\r
+  cursor: pointer;\r
+  background-color: transparent;\r
+  border: 0 \9;\r
+  /* IE9 and down */\r
+\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+input[type="image"] {\r
+  border: 0;\r
+}\r
+\r
+input[type="file"] {\r
+  width: auto;\r
+  padding: initial;\r
+  line-height: initial;\r
+  background-color: #ffffff;\r
+  background-color: initial;\r
+  border: initial;\r
+  -webkit-box-shadow: none;\r
+     -moz-box-shadow: none;\r
+          box-shadow: none;\r
+}\r
+\r
+input[type="button"],\r
+input[type="reset"],\r
+input[type="submit"] {\r
+  width: auto;\r
+  height: auto;\r
+}\r
+\r
+select,\r
+input[type="file"] {\r
+  height: 28px;\r
+  /* In IE7, the height of the select element cannot be changed by height, only font-size */\r
+\r
+  *margin-top: 4px;\r
+  /* For IE7, add top margin to align select with labels */\r
+\r
+  line-height: 28px;\r
+}\r
+\r
+input[type="file"] {\r
+  line-height: 18px \9;\r
+}\r
+\r
+select {\r
+  width: 220px;\r
+  background-color: #ffffff;\r
+}\r
+\r
+select[multiple],\r
+select[size] {\r
+  height: auto;\r
+}\r
+\r
+input[type="image"] {\r
+  -webkit-box-shadow: none;\r
+     -moz-box-shadow: none;\r
+          box-shadow: none;\r
+}\r
+\r
+textarea {\r
+  height: auto;\r
+}\r
+\r
+input[type="hidden"] {\r
+  display: none;\r
+}\r
+\r
+.radio,\r
+.checkbox {\r
+  min-height: 18px;\r
+  padding-left: 18px;\r
+}\r
+\r
+.radio input[type="radio"],\r
+.checkbox input[type="checkbox"] {\r
+  float: left;\r
+  margin-left: -18px;\r
+}\r
+\r
+.controls > .radio:first-child,\r
+.controls > .checkbox:first-child {\r
+  padding-top: 5px;\r
+}\r
+\r
+.radio.inline,\r
+.checkbox.inline {\r
+  display: inline-block;\r
+  padding-top: 5px;\r
+  margin-bottom: 0;\r
+  vertical-align: middle;\r
+}\r
+\r
+.radio.inline + .radio.inline,\r
+.checkbox.inline + .checkbox.inline {\r
+  margin-left: 10px;\r
+}\r
+\r
+input,\r
+textarea {\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);\r
+     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);\r
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);\r
+  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;\r
+     -moz-transition: border linear 0.2s, box-shadow linear 0.2s;\r
+      -ms-transition: border linear 0.2s, box-shadow linear 0.2s;\r
+       -o-transition: border linear 0.2s, box-shadow linear 0.2s;\r
+          transition: border linear 0.2s, box-shadow linear 0.2s;\r
+}\r
+\r
+input:focus,\r
+textarea:focus {\r
+  border-color: rgba(82, 168, 236, 0.8);\r
+  outline: 0;\r
+  outline: thin dotted \9;\r
+  /* IE6-9 */\r
+\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);\r
+     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);\r
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);\r
+}\r
+\r
+input[type="file"]:focus,\r
+input[type="radio"]:focus,\r
+input[type="checkbox"]:focus,\r
+select:focus {\r
+  outline: thin dotted #333;\r
+  outline: 5px auto -webkit-focus-ring-color;\r
+  outline-offset: -2px;\r
+  -webkit-box-shadow: none;\r
+     -moz-box-shadow: none;\r
+          box-shadow: none;\r
+}\r
+\r
+.input-mini {\r
+  width: 60px;\r
+}\r
+\r
+.input-small {\r
+  width: 90px;\r
+}\r
+\r
+.input-medium {\r
+  width: 150px;\r
+}\r
+\r
+.input-large {\r
+  width: 210px;\r
+}\r
+\r
+.input-xlarge {\r
+  width: 270px;\r
+}\r
+\r
+.input-xxlarge {\r
+  width: 530px;\r
+}\r
+\r
+input[class*="span"],\r
+select[class*="span"],\r
+textarea[class*="span"],\r
+.uneditable-input[class*="span"],\r
+.row-fluid input[class*="span"],\r
+.row-fluid select[class*="span"],\r
+.row-fluid textarea[class*="span"],\r
+.row-fluid .uneditable-input[class*="span"] {\r
+  float: none;\r
+  margin-left: 0;\r
+}\r
+\r
+input,\r
+textarea,\r
+.uneditable-input {\r
+  margin-left: 0;\r
+}\r
+\r
+input.span12,\r
+textarea.span12,\r
+.uneditable-input.span12 {\r
+  width: 930px;\r
+}\r
+\r
+input.span11,\r
+textarea.span11,\r
+.uneditable-input.span11 {\r
+  width: 850px;\r
+}\r
+\r
+input.span10,\r
+textarea.span10,\r
+.uneditable-input.span10 {\r
+  width: 770px;\r
+}\r
+\r
+input.span9,\r
+textarea.span9,\r
+.uneditable-input.span9 {\r
+  width: 690px;\r
+}\r
+\r
+input.span8,\r
+textarea.span8,\r
+.uneditable-input.span8 {\r
+  width: 610px;\r
+}\r
+\r
+input.span7,\r
+textarea.span7,\r
+.uneditable-input.span7 {\r
+  width: 530px;\r
+}\r
+\r
+input.span6,\r
+textarea.span6,\r
+.uneditable-input.span6 {\r
+  width: 450px;\r
+}\r
+\r
+input.span5,\r
+textarea.span5,\r
+.uneditable-input.span5 {\r
+  width: 370px;\r
+}\r
+\r
+input.span4,\r
+textarea.span4,\r
+.uneditable-input.span4 {\r
+  width: 290px;\r
+}\r
+\r
+input.span3,\r
+textarea.span3,\r
+.uneditable-input.span3 {\r
+  width: 210px;\r
+}\r
+\r
+input.span2,\r
+textarea.span2,\r
+.uneditable-input.span2 {\r
+  width: 130px;\r
+}\r
+\r
+input.span1,\r
+textarea.span1,\r
+.uneditable-input.span1 {\r
+  width: 50px;\r
+}\r
+\r
+input[disabled],\r
+select[disabled],\r
+textarea[disabled],\r
+input[readonly],\r
+select[readonly],\r
+textarea[readonly] {\r
+  cursor: not-allowed;\r
+  background-color: #eeeeee;\r
+  border-color: #ddd;\r
+}\r
+\r
+input[type="radio"][disabled],\r
+input[type="checkbox"][disabled],\r
+input[type="radio"][readonly],\r
+input[type="checkbox"][readonly] {\r
+  background-color: transparent;\r
+}\r
+\r
+.control-group.warning > label,\r
+.control-group.warning .help-block,\r
+.control-group.warning .help-inline {\r
+  color: #c09853;\r
+}\r
+\r
+.control-group.warning input,\r
+.control-group.warning select,\r
+.control-group.warning textarea {\r
+  color: #c09853;\r
+  border-color: #c09853;\r
+}\r
+\r
+.control-group.warning input:focus,\r
+.control-group.warning select:focus,\r
+.control-group.warning textarea:focus {\r
+  border-color: #a47e3c;\r
+  -webkit-box-shadow: 0 0 6px #dbc59e;\r
+     -moz-box-shadow: 0 0 6px #dbc59e;\r
+          box-shadow: 0 0 6px #dbc59e;\r
+}\r
+\r
+.control-group.warning .input-prepend .add-on,\r
+.control-group.warning .input-append .add-on {\r
+  color: #c09853;\r
+  background-color: #fcf8e3;\r
+  border-color: #c09853;\r
+}\r
+\r
+.control-group.error > label,\r
+.control-group.error .help-block,\r
+.control-group.error .help-inline {\r
+  color: #b94a48;\r
+}\r
+\r
+.control-group.error input,\r
+.control-group.error select,\r
+.control-group.error textarea {\r
+  color: #b94a48;\r
+  border-color: #b94a48;\r
+}\r
+\r
+.control-group.error input:focus,\r
+.control-group.error select:focus,\r
+.control-group.error textarea:focus {\r
+  border-color: #953b39;\r
+  -webkit-box-shadow: 0 0 6px #d59392;\r
+     -moz-box-shadow: 0 0 6px #d59392;\r
+          box-shadow: 0 0 6px #d59392;\r
+}\r
+\r
+.control-group.error .input-prepend .add-on,\r
+.control-group.error .input-append .add-on {\r
+  color: #b94a48;\r
+  background-color: #f2dede;\r
+  border-color: #b94a48;\r
+}\r
+\r
+.control-group.success > label,\r
+.control-group.success .help-block,\r
+.control-group.success .help-inline {\r
+  color: #468847;\r
+}\r
+\r
+.control-group.success input,\r
+.control-group.success select,\r
+.control-group.success textarea {\r
+  color: #468847;\r
+  border-color: #468847;\r
+}\r
+\r
+.control-group.success input:focus,\r
+.control-group.success select:focus,\r
+.control-group.success textarea:focus {\r
+  border-color: #356635;\r
+  -webkit-box-shadow: 0 0 6px #7aba7b;\r
+     -moz-box-shadow: 0 0 6px #7aba7b;\r
+          box-shadow: 0 0 6px #7aba7b;\r
+}\r
+\r
+.control-group.success .input-prepend .add-on,\r
+.control-group.success .input-append .add-on {\r
+  color: #468847;\r
+  background-color: #dff0d8;\r
+  border-color: #468847;\r
+}\r
+\r
+input:focus:required:invalid,\r
+textarea:focus:required:invalid,\r
+select:focus:required:invalid {\r
+  color: #b94a48;\r
+  border-color: #ee5f5b;\r
+}\r
+\r
+input:focus:required:invalid:focus,\r
+textarea:focus:required:invalid:focus,\r
+select:focus:required:invalid:focus {\r
+  border-color: #e9322d;\r
+  -webkit-box-shadow: 0 0 6px #f8b9b7;\r
+     -moz-box-shadow: 0 0 6px #f8b9b7;\r
+          box-shadow: 0 0 6px #f8b9b7;\r
+}\r
+\r
+.form-actions {\r
+  padding: 17px 20px 18px;\r
+  margin-top: 18px;\r
+  margin-bottom: 18px;\r
+  background-color: #f5f5f5;\r
+  border-top: 1px solid #ddd;\r
+  *zoom: 1;\r
+}\r
+\r
+.form-actions:before,\r
+.form-actions:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.form-actions:after {\r
+  clear: both;\r
+}\r
+\r
+.uneditable-input {\r
+  overflow: hidden;\r
+  white-space: nowrap;\r
+  cursor: not-allowed;\r
+  background-color: #ffffff;\r
+  border-color: #eee;\r
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);\r
+     -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);\r
+          box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);\r
+}\r
+\r
+:-moz-placeholder {\r
+  color: #999999;\r
+}\r
+\r
+::-webkit-input-placeholder {\r
+  color: #999999;\r
+}\r
+\r
+.help-block,\r
+.help-inline {\r
+  color: #555555;\r
+}\r
+\r
+.help-block {\r
+  display: block;\r
+  margin-bottom: 9px;\r
+}\r
+\r
+.help-inline {\r
+  display: inline-block;\r
+  *display: inline;\r
+  padding-left: 5px;\r
+  vertical-align: middle;\r
+  *zoom: 1;\r
+}\r
+\r
+.input-prepend,\r
+.input-append {\r
+  margin-bottom: 5px;\r
+}\r
+\r
+.input-prepend input,\r
+.input-append input,\r
+.input-prepend select,\r
+.input-append select,\r
+.input-prepend .uneditable-input,\r
+.input-append .uneditable-input {\r
+  position: relative;\r
+  margin-bottom: 0;\r
+  *margin-left: 0;\r
+  vertical-align: middle;\r
+  -webkit-border-radius: 0 3px 3px 0;\r
+     -moz-border-radius: 0 3px 3px 0;\r
+          border-radius: 0 3px 3px 0;\r
+}\r
+\r
+.input-prepend input:focus,\r
+.input-append input:focus,\r
+.input-prepend select:focus,\r
+.input-append select:focus,\r
+.input-prepend .uneditable-input:focus,\r
+.input-append .uneditable-input:focus {\r
+  z-index: 2;\r
+}\r
+\r
+.input-prepend .uneditable-input,\r
+.input-append .uneditable-input {\r
+  border-left-color: #ccc;\r
+}\r
+\r
+.input-prepend .add-on,\r
+.input-append .add-on {\r
+  display: inline-block;\r
+  width: auto;\r
+  height: 18px;\r
+  min-width: 16px;\r
+  padding: 4px 5px;\r
+  font-weight: normal;\r
+  line-height: 18px;\r
+  text-align: center;\r
+  text-shadow: 0 1px 0 #ffffff;\r
+  vertical-align: middle;\r
+  background-color: #eeeeee;\r
+  border: 1px solid #ccc;\r
+}\r
+\r
+.input-prepend .add-on,\r
+.input-append .add-on,\r
+.input-prepend .btn,\r
+.input-append .btn {\r
+  margin-left: -1px;\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+.input-prepend .active,\r
+.input-append .active {\r
+  background-color: #a9dba9;\r
+  border-color: #46a546;\r
+}\r
+\r
+.input-prepend .add-on,\r
+.input-prepend .btn {\r
+  margin-right: -1px;\r
+}\r
+\r
+.input-prepend .add-on:first-child,\r
+.input-prepend .btn:first-child {\r
+  -webkit-border-radius: 3px 0 0 3px;\r
+     -moz-border-radius: 3px 0 0 3px;\r
+          border-radius: 3px 0 0 3px;\r
+}\r
+\r
+.input-append input,\r
+.input-append select,\r
+.input-append .uneditable-input {\r
+  -webkit-border-radius: 3px 0 0 3px;\r
+     -moz-border-radius: 3px 0 0 3px;\r
+          border-radius: 3px 0 0 3px;\r
+}\r
+\r
+.input-append .uneditable-input {\r
+  border-right-color: #ccc;\r
+  border-left-color: #eee;\r
+}\r
+\r
+.input-append .add-on:last-child,\r
+.input-append .btn:last-child {\r
+  -webkit-border-radius: 0 3px 3px 0;\r
+     -moz-border-radius: 0 3px 3px 0;\r
+          border-radius: 0 3px 3px 0;\r
+}\r
+\r
+.input-prepend.input-append input,\r
+.input-prepend.input-append select,\r
+.input-prepend.input-append .uneditable-input {\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+.input-prepend.input-append .add-on:first-child,\r
+.input-prepend.input-append .btn:first-child {\r
+  margin-right: -1px;\r
+  -webkit-border-radius: 3px 0 0 3px;\r
+     -moz-border-radius: 3px 0 0 3px;\r
+          border-radius: 3px 0 0 3px;\r
+}\r
+\r
+.input-prepend.input-append .add-on:last-child,\r
+.input-prepend.input-append .btn:last-child {\r
+  margin-left: -1px;\r
+  -webkit-border-radius: 0 3px 3px 0;\r
+     -moz-border-radius: 0 3px 3px 0;\r
+          border-radius: 0 3px 3px 0;\r
+}\r
+\r
+.search-query {\r
+  padding-right: 14px;\r
+  padding-right: 4px \9;\r
+  padding-left: 14px;\r
+  padding-left: 4px \9;\r
+  /* IE7-8 doesn't have border-radius, so don't indent the padding */\r
+\r
+  margin-bottom: 0;\r
+  -webkit-border-radius: 14px;\r
+     -moz-border-radius: 14px;\r
+          border-radius: 14px;\r
+}\r
+\r
+.form-search input,\r
+.form-inline input,\r
+.form-horizontal input,\r
+.form-search textarea,\r
+.form-inline textarea,\r
+.form-horizontal textarea,\r
+.form-search select,\r
+.form-inline select,\r
+.form-horizontal select,\r
+.form-search .help-inline,\r
+.form-inline .help-inline,\r
+.form-horizontal .help-inline,\r
+.form-search .uneditable-input,\r
+.form-inline .uneditable-input,\r
+.form-horizontal .uneditable-input,\r
+.form-search .input-prepend,\r
+.form-inline .input-prepend,\r
+.form-horizontal .input-prepend,\r
+.form-search .input-append,\r
+.form-inline .input-append,\r
+.form-horizontal .input-append {\r
+  display: inline-block;\r
+  *display: inline;\r
+  margin-bottom: 0;\r
+  *zoom: 1;\r
+}\r
+\r
+.form-search .hide,\r
+.form-inline .hide,\r
+.form-horizontal .hide {\r
+  display: none;\r
+}\r
+\r
+.form-search label,\r
+.form-inline label {\r
+  display: inline-block;\r
+}\r
+\r
+.form-search .input-append,\r
+.form-inline .input-append,\r
+.form-search .input-prepend,\r
+.form-inline .input-prepend {\r
+  margin-bottom: 0;\r
+}\r
+\r
+.form-search .radio,\r
+.form-search .checkbox,\r
+.form-inline .radio,\r
+.form-inline .checkbox {\r
+  padding-left: 0;\r
+  margin-bottom: 0;\r
+  vertical-align: middle;\r
+}\r
+\r
+.form-search .radio input[type="radio"],\r
+.form-search .checkbox input[type="checkbox"],\r
+.form-inline .radio input[type="radio"],\r
+.form-inline .checkbox input[type="checkbox"] {\r
+  float: left;\r
+  margin-right: 3px;\r
+  margin-left: 0;\r
+}\r
+\r
+.control-group {\r
+  margin-bottom: 9px;\r
+}\r
+\r
+legend + .control-group {\r
+  margin-top: 18px;\r
+  -webkit-margin-top-collapse: separate;\r
+}\r
+\r
+.form-horizontal .control-group {\r
+  margin-bottom: 18px;\r
+  *zoom: 1;\r
+}\r
+\r
+.form-horizontal .control-group:before,\r
+.form-horizontal .control-group:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.form-horizontal .control-group:after {\r
+  clear: both;\r
+}\r
+\r
+.form-horizontal .control-label {\r
+  float: left;\r
+  width: 140px;\r
+  padding-top: 5px;\r
+  text-align: right;\r
+}\r
+\r
+.form-horizontal .controls {\r
+  *display: inline-block;\r
+  *padding-left: 20px;\r
+  margin-left: 160px;\r
+  *margin-left: 0;\r
+}\r
+\r
+.form-horizontal .controls:first-child {\r
+  *padding-left: 160px;\r
+}\r
+\r
+.form-horizontal .help-block {\r
+  margin-top: 9px;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.form-horizontal .form-actions {\r
+  padding-left: 160px;\r
+}\r
+\r
+table {\r
+  max-width: 100%;\r
+  background-color: transparent;\r
+  border-collapse: collapse;\r
+  border-spacing: 0;\r
+}\r
+\r
+.table {\r
+  width: 100%;\r
+  margin-bottom: 18px;\r
+}\r
+\r
+.table th,\r
+.table td {\r
+  padding: 8px;\r
+  line-height: 18px;\r
+  text-align: left;\r
+  vertical-align: top;\r
+  border-top: 1px solid #dddddd;\r
+}\r
+\r
+.table th {\r
+  font-weight: bold;\r
+}\r
+\r
+.table thead th {\r
+  vertical-align: bottom;\r
+}\r
+\r
+.table caption + thead tr:first-child th,\r
+.table caption + thead tr:first-child td,\r
+.table colgroup + thead tr:first-child th,\r
+.table colgroup + thead tr:first-child td,\r
+.table thead:first-child tr:first-child th,\r
+.table thead:first-child tr:first-child td {\r
+  border-top: 0;\r
+}\r
+\r
+.table tbody + tbody {\r
+  border-top: 2px solid #dddddd;\r
+}\r
+\r
+.table-condensed th,\r
+.table-condensed td {\r
+  padding: 4px 5px;\r
+}\r
+\r
+.table-bordered {\r
+  border: 1px solid #dddddd;\r
+  border-collapse: separate;\r
+  *border-collapse: collapsed;\r
+  border-left: 0;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.table-bordered th,\r
+.table-bordered td {\r
+  border-left: 1px solid #dddddd;\r
+}\r
+\r
+.table-bordered caption + thead tr:first-child th,\r
+.table-bordered caption + tbody tr:first-child th,\r
+.table-bordered caption + tbody tr:first-child td,\r
+.table-bordered colgroup + thead tr:first-child th,\r
+.table-bordered colgroup + tbody tr:first-child th,\r
+.table-bordered colgroup + tbody tr:first-child td,\r
+.table-bordered thead:first-child tr:first-child th,\r
+.table-bordered tbody:first-child tr:first-child th,\r
+.table-bordered tbody:first-child tr:first-child td {\r
+  border-top: 0;\r
+}\r
+\r
+.table-bordered thead:first-child tr:first-child th:first-child,\r
+.table-bordered tbody:first-child tr:first-child td:first-child {\r
+  -webkit-border-top-left-radius: 4px;\r
+          border-top-left-radius: 4px;\r
+  -moz-border-radius-topleft: 4px;\r
+}\r
+\r
+.table-bordered thead:first-child tr:first-child th:last-child,\r
+.table-bordered tbody:first-child tr:first-child td:last-child {\r
+  -webkit-border-top-right-radius: 4px;\r
+          border-top-right-radius: 4px;\r
+  -moz-border-radius-topright: 4px;\r
+}\r
+\r
+.table-bordered thead:last-child tr:last-child th:first-child,\r
+.table-bordered tbody:last-child tr:last-child td:first-child {\r
+  -webkit-border-radius: 0 0 0 4px;\r
+     -moz-border-radius: 0 0 0 4px;\r
+          border-radius: 0 0 0 4px;\r
+  -webkit-border-bottom-left-radius: 4px;\r
+          border-bottom-left-radius: 4px;\r
+  -moz-border-radius-bottomleft: 4px;\r
+}\r
+\r
+.table-bordered thead:last-child tr:last-child th:last-child,\r
+.table-bordered tbody:last-child tr:last-child td:last-child {\r
+  -webkit-border-bottom-right-radius: 4px;\r
+          border-bottom-right-radius: 4px;\r
+  -moz-border-radius-bottomright: 4px;\r
+}\r
+\r
+.table-striped tbody tr:nth-child(odd) td,\r
+.table-striped tbody tr:nth-child(odd) th {\r
+  background-color: #f9f9f9;\r
+}\r
+\r
+.table tbody tr:hover td,\r
+.table tbody tr:hover th {\r
+  background-color: #f5f5f5;\r
+}\r
+\r
+table .span1 {\r
+  float: none;\r
+  width: 44px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span2 {\r
+  float: none;\r
+  width: 124px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span3 {\r
+  float: none;\r
+  width: 204px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span4 {\r
+  float: none;\r
+  width: 284px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span5 {\r
+  float: none;\r
+  width: 364px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span6 {\r
+  float: none;\r
+  width: 444px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span7 {\r
+  float: none;\r
+  width: 524px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span8 {\r
+  float: none;\r
+  width: 604px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span9 {\r
+  float: none;\r
+  width: 684px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span10 {\r
+  float: none;\r
+  width: 764px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span11 {\r
+  float: none;\r
+  width: 844px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span12 {\r
+  float: none;\r
+  width: 924px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span13 {\r
+  float: none;\r
+  width: 1004px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span14 {\r
+  float: none;\r
+  width: 1084px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span15 {\r
+  float: none;\r
+  width: 1164px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span16 {\r
+  float: none;\r
+  width: 1244px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span17 {\r
+  float: none;\r
+  width: 1324px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span18 {\r
+  float: none;\r
+  width: 1404px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span19 {\r
+  float: none;\r
+  width: 1484px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span20 {\r
+  float: none;\r
+  width: 1564px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span21 {\r
+  float: none;\r
+  width: 1644px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span22 {\r
+  float: none;\r
+  width: 1724px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span23 {\r
+  float: none;\r
+  width: 1804px;\r
+  margin-left: 0;\r
+}\r
+\r
+table .span24 {\r
+  float: none;\r
+  width: 1884px;\r
+  margin-left: 0;\r
+}\r
+\r
+[class^="icon-"],\r
+[class*=" icon-"] {\r
+  display: inline-block;\r
+  width: 14px;\r
+  height: 14px;\r
+  *margin-right: .3em;\r
+  line-height: 14px;\r
+  vertical-align: text-top;\r
+  background-image: url("../img/glyphicons-halflings.png");\r
+  background-position: 14px 14px;\r
+  background-repeat: no-repeat;\r
+}\r
+\r
+[class^="icon-"]:last-child,\r
+[class*=" icon-"]:last-child {\r
+  *margin-left: 0;\r
+}\r
+\r
+.icon-white {\r
+  background-image: url("../img/glyphicons-halflings-white.png");\r
+}\r
+\r
+.icon-glass {\r
+  background-position: 0      0;\r
+}\r
+\r
+.icon-music {\r
+  background-position: -24px 0;\r
+}\r
+\r
+.icon-search {\r
+  background-position: -48px 0;\r
+}\r
+\r
+.icon-envelope {\r
+  background-position: -72px 0;\r
+}\r
+\r
+.icon-heart {\r
+  background-position: -96px 0;\r
+}\r
+\r
+.icon-star {\r
+  background-position: -120px 0;\r
+}\r
+\r
+.icon-star-empty {\r
+  background-position: -144px 0;\r
+}\r
+\r
+.icon-user {\r
+  background-position: -168px 0;\r
+}\r
+\r
+.icon-film {\r
+  background-position: -192px 0;\r
+}\r
+\r
+.icon-th-large {\r
+  background-position: -216px 0;\r
+}\r
+\r
+.icon-th {\r
+  background-position: -240px 0;\r
+}\r
+\r
+.icon-th-list {\r
+  background-position: -264px 0;\r
+}\r
+\r
+.icon-ok {\r
+  background-position: -288px 0;\r
+}\r
+\r
+.icon-remove {\r
+  background-position: -312px 0;\r
+}\r
+\r
+.icon-zoom-in {\r
+  background-position: -336px 0;\r
+}\r
+\r
+.icon-zoom-out {\r
+  background-position: -360px 0;\r
+}\r
+\r
+.icon-off {\r
+  background-position: -384px 0;\r
+}\r
+\r
+.icon-signal {\r
+  background-position: -408px 0;\r
+}\r
+\r
+.icon-cog {\r
+  background-position: -432px 0;\r
+}\r
+\r
+.icon-trash {\r
+  background-position: -456px 0;\r
+}\r
+\r
+.icon-home {\r
+  background-position: 0 -24px;\r
+}\r
+\r
+.icon-file {\r
+  background-position: -24px -24px;\r
+}\r
+\r
+.icon-time {\r
+  background-position: -48px -24px;\r
+}\r
+\r
+.icon-road {\r
+  background-position: -72px -24px;\r
+}\r
+\r
+.icon-download-alt {\r
+  background-position: -96px -24px;\r
+}\r
+\r
+.icon-download {\r
+  background-position: -120px -24px;\r
+}\r
+\r
+.icon-upload {\r
+  background-position: -144px -24px;\r
+}\r
+\r
+.icon-inbox {\r
+  background-position: -168px -24px;\r
+}\r
+\r
+.icon-play-circle {\r
+  background-position: -192px -24px;\r
+}\r
+\r
+.icon-repeat {\r
+  background-position: -216px -24px;\r
+}\r
+\r
+.icon-refresh {\r
+  background-position: -240px -24px;\r
+}\r
+\r
+.icon-list-alt {\r
+  background-position: -264px -24px;\r
+}\r
+\r
+.icon-lock {\r
+  background-position: -287px -24px;\r
+}\r
+\r
+.icon-flag {\r
+  background-position: -312px -24px;\r
+}\r
+\r
+.icon-headphones {\r
+  background-position: -336px -24px;\r
+}\r
+\r
+.icon-volume-off {\r
+  background-position: -360px -24px;\r
+}\r
+\r
+.icon-volume-down {\r
+  background-position: -384px -24px;\r
+}\r
+\r
+.icon-volume-up {\r
+  background-position: -408px -24px;\r
+}\r
+\r
+.icon-qrcode {\r
+  background-position: -432px -24px;\r
+}\r
+\r
+.icon-barcode {\r
+  background-position: -456px -24px;\r
+}\r
+\r
+.icon-tag {\r
+  background-position: 0 -48px;\r
+}\r
+\r
+.icon-tags {\r
+  background-position: -25px -48px;\r
+}\r
+\r
+.icon-book {\r
+  background-position: -48px -48px;\r
+}\r
+\r
+.icon-bookmark {\r
+  background-position: -72px -48px;\r
+}\r
+\r
+.icon-print {\r
+  background-position: -96px -48px;\r
+}\r
+\r
+.icon-camera {\r
+  background-position: -120px -48px;\r
+}\r
+\r
+.icon-font {\r
+  background-position: -144px -48px;\r
+}\r
+\r
+.icon-bold {\r
+  background-position: -167px -48px;\r
+}\r
+\r
+.icon-italic {\r
+  background-position: -192px -48px;\r
+}\r
+\r
+.icon-text-height {\r
+  background-position: -216px -48px;\r
+}\r
+\r
+.icon-text-width {\r
+  background-position: -240px -48px;\r
+}\r
+\r
+.icon-align-left {\r
+  background-position: -264px -48px;\r
+}\r
+\r
+.icon-align-center {\r
+  background-position: -288px -48px;\r
+}\r
+\r
+.icon-align-right {\r
+  background-position: -312px -48px;\r
+}\r
+\r
+.icon-align-justify {\r
+  background-position: -336px -48px;\r
+}\r
+\r
+.icon-list {\r
+  background-position: -360px -48px;\r
+}\r
+\r
+.icon-indent-left {\r
+  background-position: -384px -48px;\r
+}\r
+\r
+.icon-indent-right {\r
+  background-position: -408px -48px;\r
+}\r
+\r
+.icon-facetime-video {\r
+  background-position: -432px -48px;\r
+}\r
+\r
+.icon-picture {\r
+  background-position: -456px -48px;\r
+}\r
+\r
+.icon-pencil {\r
+  background-position: 0 -72px;\r
+}\r
+\r
+.icon-map-marker {\r
+  background-position: -24px -72px;\r
+}\r
+\r
+.icon-adjust {\r
+  background-position: -48px -72px;\r
+}\r
+\r
+.icon-tint {\r
+  background-position: -72px -72px;\r
+}\r
+\r
+.icon-edit {\r
+  background-position: -96px -72px;\r
+}\r
+\r
+.icon-share {\r
+  background-position: -120px -72px;\r
+}\r
+\r
+.icon-check {\r
+  background-position: -144px -72px;\r
+}\r
+\r
+.icon-move {\r
+  background-position: -168px -72px;\r
+}\r
+\r
+.icon-step-backward {\r
+  background-position: -192px -72px;\r
+}\r
+\r
+.icon-fast-backward {\r
+  background-position: -216px -72px;\r
+}\r
+\r
+.icon-backward {\r
+  background-position: -240px -72px;\r
+}\r
+\r
+.icon-play {\r
+  background-position: -264px -72px;\r
+}\r
+\r
+.icon-pause {\r
+  background-position: -288px -72px;\r
+}\r
+\r
+.icon-stop {\r
+  background-position: -312px -72px;\r
+}\r
+\r
+.icon-forward {\r
+  background-position: -336px -72px;\r
+}\r
+\r
+.icon-fast-forward {\r
+  background-position: -360px -72px;\r
+}\r
+\r
+.icon-step-forward {\r
+  background-position: -384px -72px;\r
+}\r
+\r
+.icon-eject {\r
+  background-position: -408px -72px;\r
+}\r
+\r
+.icon-chevron-left {\r
+  background-position: -432px -72px;\r
+}\r
+\r
+.icon-chevron-right {\r
+  background-position: -456px -72px;\r
+}\r
+\r
+.icon-plus-sign {\r
+  background-position: 0 -96px;\r
+}\r
+\r
+.icon-minus-sign {\r
+  background-position: -24px -96px;\r
+}\r
+\r
+.icon-remove-sign {\r
+  background-position: -48px -96px;\r
+}\r
+\r
+.icon-ok-sign {\r
+  background-position: -72px -96px;\r
+}\r
+\r
+.icon-question-sign {\r
+  background-position: -96px -96px;\r
+}\r
+\r
+.icon-info-sign {\r
+  background-position: -120px -96px;\r
+}\r
+\r
+.icon-screenshot {\r
+  background-position: -144px -96px;\r
+}\r
+\r
+.icon-remove-circle {\r
+  background-position: -168px -96px;\r
+}\r
+\r
+.icon-ok-circle {\r
+  background-position: -192px -96px;\r
+}\r
+\r
+.icon-ban-circle {\r
+  background-position: -216px -96px;\r
+}\r
+\r
+.icon-arrow-left {\r
+  background-position: -240px -96px;\r
+}\r
+\r
+.icon-arrow-right {\r
+  background-position: -264px -96px;\r
+}\r
+\r
+.icon-arrow-up {\r
+  background-position: -289px -96px;\r
+}\r
+\r
+.icon-arrow-down {\r
+  background-position: -312px -96px;\r
+}\r
+\r
+.icon-share-alt {\r
+  background-position: -336px -96px;\r
+}\r
+\r
+.icon-resize-full {\r
+  background-position: -360px -96px;\r
+}\r
+\r
+.icon-resize-small {\r
+  background-position: -384px -96px;\r
+}\r
+\r
+.icon-plus {\r
+  background-position: -408px -96px;\r
+}\r
+\r
+.icon-minus {\r
+  background-position: -433px -96px;\r
+}\r
+\r
+.icon-asterisk {\r
+  background-position: -456px -96px;\r
+}\r
+\r
+.icon-exclamation-sign {\r
+  background-position: 0 -120px;\r
+}\r
+\r
+.icon-gift {\r
+  background-position: -24px -120px;\r
+}\r
+\r
+.icon-leaf {\r
+  background-position: -48px -120px;\r
+}\r
+\r
+.icon-fire {\r
+  background-position: -72px -120px;\r
+}\r
+\r
+.icon-eye-open {\r
+  background-position: -96px -120px;\r
+}\r
+\r
+.icon-eye-close {\r
+  background-position: -120px -120px;\r
+}\r
+\r
+.icon-warning-sign {\r
+  background-position: -144px -120px;\r
+}\r
+\r
+.icon-plane {\r
+  background-position: -168px -120px;\r
+}\r
+\r
+.icon-calendar {\r
+  background-position: -192px -120px;\r
+}\r
+\r
+.icon-random {\r
+  background-position: -216px -120px;\r
+}\r
+\r
+.icon-comment {\r
+  background-position: -240px -120px;\r
+}\r
+\r
+.icon-magnet {\r
+  background-position: -264px -120px;\r
+}\r
+\r
+.icon-chevron-up {\r
+  background-position: -288px -120px;\r
+}\r
+\r
+.icon-chevron-down {\r
+  background-position: -313px -119px;\r
+}\r
+\r
+.icon-retweet {\r
+  background-position: -336px -120px;\r
+}\r
+\r
+.icon-shopping-cart {\r
+  background-position: -360px -120px;\r
+}\r
+\r
+.icon-folder-close {\r
+  background-position: -384px -120px;\r
+}\r
+\r
+.icon-folder-open {\r
+  background-position: -408px -120px;\r
+}\r
+\r
+.icon-resize-vertical {\r
+  background-position: -432px -119px;\r
+}\r
+\r
+.icon-resize-horizontal {\r
+  background-position: -456px -118px;\r
+}\r
+\r
+.icon-hdd {\r
+  background-position: 0 -144px;\r
+}\r
+\r
+.icon-bullhorn {\r
+  background-position: -24px -144px;\r
+}\r
+\r
+.icon-bell {\r
+  background-position: -48px -144px;\r
+}\r
+\r
+.icon-certificate {\r
+  background-position: -72px -144px;\r
+}\r
+\r
+.icon-thumbs-up {\r
+  background-position: -96px -144px;\r
+}\r
+\r
+.icon-thumbs-down {\r
+  background-position: -120px -144px;\r
+}\r
+\r
+.icon-hand-right {\r
+  background-position: -144px -144px;\r
+}\r
+\r
+.icon-hand-left {\r
+  background-position: -168px -144px;\r
+}\r
+\r
+.icon-hand-up {\r
+  background-position: -192px -144px;\r
+}\r
+\r
+.icon-hand-down {\r
+  background-position: -216px -144px;\r
+}\r
+\r
+.icon-circle-arrow-right {\r
+  background-position: -240px -144px;\r
+}\r
+\r
+.icon-circle-arrow-left {\r
+  background-position: -264px -144px;\r
+}\r
+\r
+.icon-circle-arrow-up {\r
+  background-position: -288px -144px;\r
+}\r
+\r
+.icon-circle-arrow-down {\r
+  background-position: -312px -144px;\r
+}\r
+\r
+.icon-globe {\r
+  background-position: -336px -144px;\r
+}\r
+\r
+.icon-wrench {\r
+  background-position: -360px -144px;\r
+}\r
+\r
+.icon-tasks {\r
+  background-position: -384px -144px;\r
+}\r
+\r
+.icon-filter {\r
+  background-position: -408px -144px;\r
+}\r
+\r
+.icon-briefcase {\r
+  background-position: -432px -144px;\r
+}\r
+\r
+.icon-fullscreen {\r
+  background-position: -456px -144px;\r
+}\r
+\r
+.dropup,\r
+.dropdown {\r
+  position: relative;\r
+}\r
+\r
+.dropdown-toggle {\r
+  *margin-bottom: -3px;\r
+}\r
+\r
+.dropdown-toggle:active,\r
+.open .dropdown-toggle {\r
+  outline: 0;\r
+}\r
+\r
+.caret {\r
+  display: inline-block;\r
+  width: 0;\r
+  height: 0;\r
+  vertical-align: top;\r
+  border-top: 4px solid #000000;\r
+  border-right: 4px solid transparent;\r
+  border-left: 4px solid transparent;\r
+  content: "";\r
+  opacity: 0.3;\r
+  filter: alpha(opacity=30);\r
+}\r
+\r
+.dropdown .caret {\r
+  margin-top: 8px;\r
+  margin-left: 2px;\r
+}\r
+\r
+.dropdown:hover .caret,\r
+.open .caret {\r
+  opacity: 1;\r
+  filter: alpha(opacity=100);\r
+}\r
+\r
+.dropdown-menu {\r
+  position: absolute;\r
+  top: 100%;\r
+  left: 0;\r
+  z-index: 1000;\r
+  display: none;\r
+  float: left;\r
+  min-width: 160px;\r
+  padding: 4px 0;\r
+  margin: 1px 0 0;\r
+  list-style: none;\r
+  background-color: #ffffff;\r
+  border: 1px solid #ccc;\r
+  border: 1px solid rgba(0, 0, 0, 0.2);\r
+  *border-right-width: 2px;\r
+  *border-bottom-width: 2px;\r
+  -webkit-border-radius: 5px;\r
+     -moz-border-radius: 5px;\r
+          border-radius: 5px;\r
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\r
+     -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\r
+          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\r
+  -webkit-background-clip: padding-box;\r
+     -moz-background-clip: padding;\r
+          background-clip: padding-box;\r
+}\r
+\r
+.dropdown-menu.pull-right {\r
+  right: 0;\r
+  left: auto;\r
+}\r
+\r
+.dropdown-menu .divider {\r
+  *width: 100%;\r
+  height: 1px;\r
+  margin: 8px 1px;\r
+  *margin: -5px 0 5px;\r
+  overflow: hidden;\r
+  background-color: #e5e5e5;\r
+  border-bottom: 1px solid #ffffff;\r
+}\r
+\r
+.dropdown-menu a {\r
+  display: block;\r
+  padding: 3px 15px;\r
+  clear: both;\r
+  font-weight: normal;\r
+  line-height: 18px;\r
+  color: #333333;\r
+  white-space: nowrap;\r
+}\r
+\r
+.dropdown-menu li > a:hover,\r
+.dropdown-menu .active > a,\r
+.dropdown-menu .active > a:hover {\r
+  color: #ffffff;\r
+  text-decoration: none;\r
+  background-color: #0088cc;\r
+}\r
+\r
+.open {\r
+  *z-index: 1000;\r
+}\r
+\r
+.open .dropdown-menu {\r
+  display: block;\r
+}\r
+\r
+.pull-right .dropdown-menu {\r
+  right: 0;\r
+  left: auto;\r
+}\r
+\r
+.dropup .caret,\r
+.navbar-fixed-bottom .dropdown .caret {\r
+  border-top: 0;\r
+  border-bottom: 4px solid #000000;\r
+  content: "\2191";\r
+}\r
+\r
+.dropup .dropdown-menu,\r
+.navbar-fixed-bottom .dropdown .dropdown-menu {\r
+  top: auto;\r
+  bottom: 100%;\r
+  margin-bottom: 1px;\r
+}\r
+\r
+.typeahead {\r
+  margin-top: 2px;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.well {\r
+  min-height: 20px;\r
+  padding: 19px;\r
+  margin-bottom: 20px;\r
+  background-color: #f5f5f5;\r
+  border: 1px solid #eee;\r
+  border: 1px solid rgba(0, 0, 0, 0.05);\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.well blockquote {\r
+  border-color: #ddd;\r
+  border-color: rgba(0, 0, 0, 0.15);\r
+}\r
+\r
+.well-large {\r
+  padding: 24px;\r
+  -webkit-border-radius: 6px;\r
+     -moz-border-radius: 6px;\r
+          border-radius: 6px;\r
+}\r
+\r
+.well-small {\r
+  padding: 9px;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+}\r
+\r
+.fade {\r
+  opacity: 0;\r
+  filter: alpha(opacity=0);\r
+  -webkit-transition: opacity 0.15s linear;\r
+     -moz-transition: opacity 0.15s linear;\r
+      -ms-transition: opacity 0.15s linear;\r
+       -o-transition: opacity 0.15s linear;\r
+          transition: opacity 0.15s linear;\r
+}\r
+\r
+.fade.in {\r
+  opacity: 1;\r
+  filter: alpha(opacity=100);\r
+}\r
+\r
+.collapse {\r
+  position: relative;\r
+  height: 0;\r
+  overflow: hidden;\r
+  -webkit-transition: height 0.35s ease;\r
+     -moz-transition: height 0.35s ease;\r
+      -ms-transition: height 0.35s ease;\r
+       -o-transition: height 0.35s ease;\r
+          transition: height 0.35s ease;\r
+}\r
+\r
+.collapse.in {\r
+  height: auto;\r
+}\r
+\r
+.close {\r
+  float: right;\r
+  font-size: 20px;\r
+  font-weight: bold;\r
+  line-height: 18px;\r
+  color: #000000;\r
+  text-shadow: 0 1px 0 #ffffff;\r
+  opacity: 0.2;\r
+  filter: alpha(opacity=20);\r
+}\r
+\r
+.close:hover {\r
+  color: #000000;\r
+  text-decoration: none;\r
+  cursor: pointer;\r
+  opacity: 0.4;\r
+  filter: alpha(opacity=40);\r
+}\r
+\r
+button.close {\r
+  padding: 0;\r
+  cursor: pointer;\r
+  background: transparent;\r
+  border: 0;\r
+  -webkit-appearance: none;\r
+}\r
+\r
+.btn {\r
+  display: inline-block;\r
+  *display: inline;\r
+  padding: 4px 10px 4px;\r
+  margin-bottom: 0;\r
+  *margin-left: .3em;\r
+  font-size: 13px;\r
+  line-height: 18px;\r
+  *line-height: 20px;\r
+  color: #333333;\r
+  text-align: center;\r
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);\r
+  vertical-align: middle;\r
+  cursor: pointer;\r
+  background-color: #f5f5f5;\r
+  *background-color: #e6e6e6;\r
+  background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));\r
+  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);\r
+  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);\r
+  background-image: linear-gradient(top, #ffffff, #e6e6e6);\r
+  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);\r
+  background-repeat: repeat-x;\r
+  border: 1px solid #cccccc;\r
+  *border: 0;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  border-color: #e6e6e6 #e6e6e6 #bfbfbf;\r
+  border-bottom-color: #b3b3b3;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+  *zoom: 1;\r
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.btn:hover,\r
+.btn:active,\r
+.btn.active,\r
+.btn.disabled,\r
+.btn[disabled] {\r
+  background-color: #e6e6e6;\r
+  *background-color: #d9d9d9;\r
+}\r
+\r
+.btn:active,\r
+.btn.active {\r
+  background-color: #cccccc \9;\r
+}\r
+\r
+.btn:first-child {\r
+  *margin-left: 0;\r
+}\r
+\r
+.btn:hover {\r
+  color: #333333;\r
+  text-decoration: none;\r
+  background-color: #e6e6e6;\r
+  *background-color: #d9d9d9;\r
+  /* Buttons in IE7 don't get borders, so darken on hover */\r
+\r
+  background-position: 0 -15px;\r
+  -webkit-transition: background-position 0.1s linear;\r
+     -moz-transition: background-position 0.1s linear;\r
+      -ms-transition: background-position 0.1s linear;\r
+       -o-transition: background-position 0.1s linear;\r
+          transition: background-position 0.1s linear;\r
+}\r
+\r
+.btn:focus {\r
+  outline: thin dotted #333;\r
+  outline: 5px auto -webkit-focus-ring-color;\r
+  outline-offset: -2px;\r
+}\r
+\r
+.btn.active,\r
+.btn:active {\r
+  background-color: #e6e6e6;\r
+  background-color: #d9d9d9 \9;\r
+  background-image: none;\r
+  outline: 0;\r
+  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+          box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.btn.disabled,\r
+.btn[disabled] {\r
+  cursor: default;\r
+  background-color: #e6e6e6;\r
+  background-image: none;\r
+  opacity: 0.65;\r
+  filter: alpha(opacity=65);\r
+  -webkit-box-shadow: none;\r
+     -moz-box-shadow: none;\r
+          box-shadow: none;\r
+}\r
+\r
+.btn-large {\r
+  padding: 9px 14px;\r
+  font-size: 15px;\r
+  line-height: normal;\r
+  -webkit-border-radius: 5px;\r
+     -moz-border-radius: 5px;\r
+          border-radius: 5px;\r
+}\r
+\r
+.btn-large [class^="icon-"] {\r
+  margin-top: 1px;\r
+}\r
+\r
+.btn-small {\r
+  padding: 5px 9px;\r
+  font-size: 11px;\r
+  line-height: 16px;\r
+}\r
+\r
+.btn-small [class^="icon-"] {\r
+  margin-top: -1px;\r
+}\r
+\r
+.btn-mini {\r
+  padding: 2px 6px;\r
+  font-size: 11px;\r
+  line-height: 14px;\r
+}\r
+\r
+.btn-primary,\r
+.btn-primary:hover,\r
+.btn-warning,\r
+.btn-warning:hover,\r
+.btn-danger,\r
+.btn-danger:hover,\r
+.btn-success,\r
+.btn-success:hover,\r
+.btn-info,\r
+.btn-info:hover,\r
+.btn-inverse,\r
+.btn-inverse:hover {\r
+  color: #ffffff;\r
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\r
+}\r
+\r
+.btn-primary.active,\r
+.btn-warning.active,\r
+.btn-danger.active,\r
+.btn-success.active,\r
+.btn-info.active,\r
+.btn-inverse.active {\r
+  color: rgba(255, 255, 255, 0.75);\r
+}\r
+\r
+.btn {\r
+  border-color: #ccc;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+}\r
+\r
+.btn-primary {\r
+  background-color: #0074cc;\r
+  *background-color: #0055cc;\r
+  background-image: -ms-linear-gradient(top, #0088cc, #0055cc);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0055cc));\r
+  background-image: -webkit-linear-gradient(top, #0088cc, #0055cc);\r
+  background-image: -o-linear-gradient(top, #0088cc, #0055cc);\r
+  background-image: -moz-linear-gradient(top, #0088cc, #0055cc);\r
+  background-image: linear-gradient(top, #0088cc, #0055cc);\r
+  background-repeat: repeat-x;\r
+  border-color: #0055cc #0055cc #003580;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#0088cc', endColorstr='#0055cc', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-primary:hover,\r
+.btn-primary:active,\r
+.btn-primary.active,\r
+.btn-primary.disabled,\r
+.btn-primary[disabled] {\r
+  background-color: #0055cc;\r
+  *background-color: #004ab3;\r
+}\r
+\r
+.btn-primary:active,\r
+.btn-primary.active {\r
+  background-color: #004099 \9;\r
+}\r
+\r
+.btn-warning {\r
+  background-color: #faa732;\r
+  *background-color: #f89406;\r
+  background-image: -ms-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));\r
+  background-image: -webkit-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -o-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -moz-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: linear-gradient(top, #fbb450, #f89406);\r
+  background-repeat: repeat-x;\r
+  border-color: #f89406 #f89406 #ad6704;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89406', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-warning:hover,\r
+.btn-warning:active,\r
+.btn-warning.active,\r
+.btn-warning.disabled,\r
+.btn-warning[disabled] {\r
+  background-color: #f89406;\r
+  *background-color: #df8505;\r
+}\r
+\r
+.btn-warning:active,\r
+.btn-warning.active {\r
+  background-color: #c67605 \9;\r
+}\r
+\r
+.btn-danger {\r
+  background-color: #da4f49;\r
+  *background-color: #bd362f;\r
+  background-image: -ms-linear-gradient(top, #ee5f5b, #bd362f);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));\r
+  background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);\r
+  background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);\r
+  background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);\r
+  background-image: linear-gradient(top, #ee5f5b, #bd362f);\r
+  background-repeat: repeat-x;\r
+  border-color: #bd362f #bd362f #802420;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#bd362f', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-danger:hover,\r
+.btn-danger:active,\r
+.btn-danger.active,\r
+.btn-danger.disabled,\r
+.btn-danger[disabled] {\r
+  background-color: #bd362f;\r
+  *background-color: #a9302a;\r
+}\r
+\r
+.btn-danger:active,\r
+.btn-danger.active {\r
+  background-color: #942a25 \9;\r
+}\r
+\r
+.btn-success {\r
+  background-color: #5bb75b;\r
+  *background-color: #51a351;\r
+  background-image: -ms-linear-gradient(top, #62c462, #51a351);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));\r
+  background-image: -webkit-linear-gradient(top, #62c462, #51a351);\r
+  background-image: -o-linear-gradient(top, #62c462, #51a351);\r
+  background-image: -moz-linear-gradient(top, #62c462, #51a351);\r
+  background-image: linear-gradient(top, #62c462, #51a351);\r
+  background-repeat: repeat-x;\r
+  border-color: #51a351 #51a351 #387038;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#62c462', endColorstr='#51a351', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-success:hover,\r
+.btn-success:active,\r
+.btn-success.active,\r
+.btn-success.disabled,\r
+.btn-success[disabled] {\r
+  background-color: #51a351;\r
+  *background-color: #499249;\r
+}\r
+\r
+.btn-success:active,\r
+.btn-success.active {\r
+  background-color: #408140 \9;\r
+}\r
+\r
+.btn-info {\r
+  background-color: #49afcd;\r
+  *background-color: #2f96b4;\r
+  background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));\r
+  background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);\r
+  background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);\r
+  background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);\r
+  background-image: linear-gradient(top, #5bc0de, #2f96b4);\r
+  background-repeat: repeat-x;\r
+  border-color: #2f96b4 #2f96b4 #1f6377;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-info:hover,\r
+.btn-info:active,\r
+.btn-info.active,\r
+.btn-info.disabled,\r
+.btn-info[disabled] {\r
+  background-color: #2f96b4;\r
+  *background-color: #2a85a0;\r
+}\r
+\r
+.btn-info:active,\r
+.btn-info.active {\r
+  background-color: #24748c \9;\r
+}\r
+\r
+.btn-inverse {\r
+  background-color: #414141;\r
+  *background-color: #222222;\r
+  background-image: -ms-linear-gradient(top, #555555, #222222);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#222222));\r
+  background-image: -webkit-linear-gradient(top, #555555, #222222);\r
+  background-image: -o-linear-gradient(top, #555555, #222222);\r
+  background-image: -moz-linear-gradient(top, #555555, #222222);\r
+  background-image: linear-gradient(top, #555555, #222222);\r
+  background-repeat: repeat-x;\r
+  border-color: #222222 #222222 #000000;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#555555', endColorstr='#222222', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+}\r
+\r
+.btn-inverse:hover,\r
+.btn-inverse:active,\r
+.btn-inverse.active,\r
+.btn-inverse.disabled,\r
+.btn-inverse[disabled] {\r
+  background-color: #222222;\r
+  *background-color: #151515;\r
+}\r
+\r
+.btn-inverse:active,\r
+.btn-inverse.active {\r
+  background-color: #080808 \9;\r
+}\r
+\r
+button.btn,\r
+input[type="submit"].btn {\r
+  *padding-top: 2px;\r
+  *padding-bottom: 2px;\r
+}\r
+\r
+button.btn::-moz-focus-inner,\r
+input[type="submit"].btn::-moz-focus-inner {\r
+  padding: 0;\r
+  border: 0;\r
+}\r
+\r
+button.btn.btn-large,\r
+input[type="submit"].btn.btn-large {\r
+  *padding-top: 7px;\r
+  *padding-bottom: 7px;\r
+}\r
+\r
+button.btn.btn-small,\r
+input[type="submit"].btn.btn-small {\r
+  *padding-top: 3px;\r
+  *padding-bottom: 3px;\r
+}\r
+\r
+button.btn.btn-mini,\r
+input[type="submit"].btn.btn-mini {\r
+  *padding-top: 1px;\r
+  *padding-bottom: 1px;\r
+}\r
+\r
+.btn-group {\r
+  position: relative;\r
+  *margin-left: .3em;\r
+  *zoom: 1;\r
+}\r
+\r
+.btn-group:before,\r
+.btn-group:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.btn-group:after {\r
+  clear: both;\r
+}\r
+\r
+.btn-group:first-child {\r
+  *margin-left: 0;\r
+}\r
+\r
+.btn-group + .btn-group {\r
+  margin-left: 5px;\r
+}\r
+\r
+.btn-toolbar {\r
+  margin-top: 9px;\r
+  margin-bottom: 9px;\r
+}\r
+\r
+.btn-toolbar .btn-group {\r
+  display: inline-block;\r
+  *display: inline;\r
+  /* IE7 inline-block hack */\r
+\r
+  *zoom: 1;\r
+}\r
+\r
+.btn-group > .btn {\r
+  position: relative;\r
+  float: left;\r
+  margin-left: -1px;\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+.btn-group > .btn:first-child {\r
+  margin-left: 0;\r
+  -webkit-border-bottom-left-radius: 4px;\r
+          border-bottom-left-radius: 4px;\r
+  -webkit-border-top-left-radius: 4px;\r
+          border-top-left-radius: 4px;\r
+  -moz-border-radius-bottomleft: 4px;\r
+  -moz-border-radius-topleft: 4px;\r
+}\r
+\r
+.btn-group > .btn:last-child,\r
+.btn-group > .dropdown-toggle {\r
+  -webkit-border-top-right-radius: 4px;\r
+          border-top-right-radius: 4px;\r
+  -webkit-border-bottom-right-radius: 4px;\r
+          border-bottom-right-radius: 4px;\r
+  -moz-border-radius-topright: 4px;\r
+  -moz-border-radius-bottomright: 4px;\r
+}\r
+\r
+.btn-group > .btn.large:first-child {\r
+  margin-left: 0;\r
+  -webkit-border-bottom-left-radius: 6px;\r
+          border-bottom-left-radius: 6px;\r
+  -webkit-border-top-left-radius: 6px;\r
+          border-top-left-radius: 6px;\r
+  -moz-border-radius-bottomleft: 6px;\r
+  -moz-border-radius-topleft: 6px;\r
+}\r
+\r
+.btn-group > .btn.large:last-child,\r
+.btn-group > .large.dropdown-toggle {\r
+  -webkit-border-top-right-radius: 6px;\r
+          border-top-right-radius: 6px;\r
+  -webkit-border-bottom-right-radius: 6px;\r
+          border-bottom-right-radius: 6px;\r
+  -moz-border-radius-topright: 6px;\r
+  -moz-border-radius-bottomright: 6px;\r
+}\r
+\r
+.btn-group > .btn:hover,\r
+.btn-group > .btn:focus,\r
+.btn-group > .btn:active,\r
+.btn-group > .btn.active {\r
+  z-index: 2;\r
+}\r
+\r
+.btn-group .dropdown-toggle:active,\r
+.btn-group.open .dropdown-toggle {\r
+  outline: 0;\r
+}\r
+\r
+.btn-group > .dropdown-toggle {\r
+  *padding-top: 4px;\r
+  padding-right: 8px;\r
+  *padding-bottom: 4px;\r
+  padding-left: 8px;\r
+  -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+          box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.btn-group > .btn-mini.dropdown-toggle {\r
+  padding-right: 5px;\r
+  padding-left: 5px;\r
+}\r
+\r
+.btn-group > .btn-small.dropdown-toggle {\r
+  *padding-top: 4px;\r
+  *padding-bottom: 4px;\r
+}\r
+\r
+.btn-group > .btn-large.dropdown-toggle {\r
+  padding-right: 12px;\r
+  padding-left: 12px;\r
+}\r
+\r
+.btn-group.open .dropdown-toggle {\r
+  background-image: none;\r
+  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+          box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.btn-group.open .btn.dropdown-toggle {\r
+  background-color: #e6e6e6;\r
+}\r
+\r
+.btn-group.open .btn-primary.dropdown-toggle {\r
+  background-color: #0055cc;\r
+}\r
+\r
+.btn-group.open .btn-warning.dropdown-toggle {\r
+  background-color: #f89406;\r
+}\r
+\r
+.btn-group.open .btn-danger.dropdown-toggle {\r
+  background-color: #bd362f;\r
+}\r
+\r
+.btn-group.open .btn-success.dropdown-toggle {\r
+  background-color: #51a351;\r
+}\r
+\r
+.btn-group.open .btn-info.dropdown-toggle {\r
+  background-color: #2f96b4;\r
+}\r
+\r
+.btn-group.open .btn-inverse.dropdown-toggle {\r
+  background-color: #222222;\r
+}\r
+\r
+.btn .caret {\r
+  margin-top: 7px;\r
+  margin-left: 0;\r
+}\r
+\r
+.btn:hover .caret,\r
+.open.btn-group .caret {\r
+  opacity: 1;\r
+  filter: alpha(opacity=100);\r
+}\r
+\r
+.btn-mini .caret {\r
+  margin-top: 5px;\r
+}\r
+\r
+.btn-small .caret {\r
+  margin-top: 6px;\r
+}\r
+\r
+.btn-large .caret {\r
+  margin-top: 6px;\r
+  border-top-width: 5px;\r
+  border-right-width: 5px;\r
+  border-left-width: 5px;\r
+}\r
+\r
+.dropup .btn-large .caret {\r
+  border-top: 0;\r
+  border-bottom: 5px solid #000000;\r
+}\r
+\r
+.btn-primary .caret,\r
+.btn-warning .caret,\r
+.btn-danger .caret,\r
+.btn-info .caret,\r
+.btn-success .caret,\r
+.btn-inverse .caret {\r
+  border-top-color: #ffffff;\r
+  border-bottom-color: #ffffff;\r
+  opacity: 0.75;\r
+  filter: alpha(opacity=75);\r
+}\r
+\r
+.alert {\r
+  padding: 8px 35px 8px 14px;\r
+  margin-bottom: 18px;\r
+  color: #c09853;\r
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);\r
+  background-color: #fcf8e3;\r
+  border: 1px solid #fbeed5;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.alert-heading {\r
+  color: inherit;\r
+}\r
+\r
+.alert .close {\r
+  position: relative;\r
+  top: -2px;\r
+  right: -21px;\r
+  line-height: 18px;\r
+}\r
+\r
+.alert-success {\r
+  color: #468847;\r
+  background-color: #dff0d8;\r
+  border-color: #d6e9c6;\r
+}\r
+\r
+.alert-danger,\r
+.alert-error {\r
+  color: #b94a48;\r
+  background-color: #f2dede;\r
+  border-color: #eed3d7;\r
+}\r
+\r
+.alert-info {\r
+  color: #3a87ad;\r
+  background-color: #d9edf7;\r
+  border-color: #bce8f1;\r
+}\r
+\r
+.alert-block {\r
+  padding-top: 14px;\r
+  padding-bottom: 14px;\r
+}\r
+\r
+.alert-block > p,\r
+.alert-block > ul {\r
+  margin-bottom: 0;\r
+}\r
+\r
+.alert-block p + p {\r
+  margin-top: 5px;\r
+}\r
+\r
+.nav {\r
+  margin-bottom: 18px;\r
+  margin-left: 0;\r
+  list-style: none;\r
+}\r
+\r
+.nav > li > a {\r
+  display: block;\r
+}\r
+\r
+.nav > li > a:hover {\r
+  text-decoration: none;\r
+  background-color: #eeeeee;\r
+}\r
+\r
+.nav > .pull-right {\r
+  float: right;\r
+}\r
+\r
+.nav .nav-header {\r
+  display: block;\r
+  padding: 3px 15px;\r
+  font-size: 11px;\r
+  font-weight: bold;\r
+  line-height: 18px;\r
+  color: #999999;\r
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);\r
+  text-transform: uppercase;\r
+}\r
+\r
+.nav li + .nav-header {\r
+  margin-top: 9px;\r
+}\r
+\r
+.nav-list {\r
+  padding-right: 15px;\r
+  padding-left: 15px;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.nav-list > li > a,\r
+.nav-list .nav-header {\r
+  margin-right: -15px;\r
+  margin-left: -15px;\r
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);\r
+}\r
+\r
+.nav-list > li > a {\r
+  padding: 3px 15px;\r
+}\r
+\r
+.nav-list > .active > a,\r
+.nav-list > .active > a:hover {\r
+  color: #ffffff;\r
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);\r
+  background-color: #0088cc;\r
+}\r
+\r
+.nav-list [class^="icon-"] {\r
+  margin-right: 2px;\r
+}\r
+\r
+.nav-list .divider {\r
+  *width: 100%;\r
+  height: 1px;\r
+  margin: 8px 1px;\r
+  *margin: -5px 0 5px;\r
+  overflow: hidden;\r
+  background-color: #e5e5e5;\r
+  border-bottom: 1px solid #ffffff;\r
+}\r
+\r
+.nav-tabs,\r
+.nav-pills {\r
+  *zoom: 1;\r
+}\r
+\r
+.nav-tabs:before,\r
+.nav-pills:before,\r
+.nav-tabs:after,\r
+.nav-pills:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.nav-tabs:after,\r
+.nav-pills:after {\r
+  clear: both;\r
+}\r
+\r
+.nav-tabs > li,\r
+.nav-pills > li {\r
+  float: left;\r
+}\r
+\r
+.nav-tabs > li > a,\r
+.nav-pills > li > a {\r
+  padding-right: 12px;\r
+  padding-left: 12px;\r
+  margin-right: 2px;\r
+  line-height: 14px;\r
+}\r
+\r
+.nav-tabs {\r
+  border-bottom: 1px solid #ddd;\r
+}\r
+\r
+.nav-tabs > li {\r
+  margin-bottom: -1px;\r
+}\r
+\r
+.nav-tabs > li > a {\r
+  padding-top: 8px;\r
+  padding-bottom: 8px;\r
+  line-height: 18px;\r
+  border: 1px solid transparent;\r
+  -webkit-border-radius: 4px 4px 0 0;\r
+     -moz-border-radius: 4px 4px 0 0;\r
+          border-radius: 4px 4px 0 0;\r
+}\r
+\r
+.nav-tabs > li > a:hover {\r
+  border-color: #eeeeee #eeeeee #dddddd;\r
+}\r
+\r
+.nav-tabs > .active > a,\r
+.nav-tabs > .active > a:hover {\r
+  color: #555555;\r
+  cursor: default;\r
+  background-color: #ffffff;\r
+  border: 1px solid #ddd;\r
+  border-bottom-color: transparent;\r
+}\r
+\r
+.nav-pills > li > a {\r
+  padding-top: 8px;\r
+  padding-bottom: 8px;\r
+  margin-top: 2px;\r
+  margin-bottom: 2px;\r
+  -webkit-border-radius: 5px;\r
+     -moz-border-radius: 5px;\r
+          border-radius: 5px;\r
+}\r
+\r
+.nav-pills > .active > a,\r
+.nav-pills > .active > a:hover {\r
+  color: #ffffff;\r
+  background-color: #0088cc;\r
+}\r
+\r
+.nav-stacked > li {\r
+  float: none;\r
+}\r
+\r
+.nav-stacked > li > a {\r
+  margin-right: 0;\r
+}\r
+\r
+.nav-tabs.nav-stacked {\r
+  border-bottom: 0;\r
+}\r
+\r
+.nav-tabs.nav-stacked > li > a {\r
+  border: 1px solid #ddd;\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+.nav-tabs.nav-stacked > li:first-child > a {\r
+  -webkit-border-radius: 4px 4px 0 0;\r
+     -moz-border-radius: 4px 4px 0 0;\r
+          border-radius: 4px 4px 0 0;\r
+}\r
+\r
+.nav-tabs.nav-stacked > li:last-child > a {\r
+  -webkit-border-radius: 0 0 4px 4px;\r
+     -moz-border-radius: 0 0 4px 4px;\r
+          border-radius: 0 0 4px 4px;\r
+}\r
+\r
+.nav-tabs.nav-stacked > li > a:hover {\r
+  z-index: 2;\r
+  border-color: #ddd;\r
+}\r
+\r
+.nav-pills.nav-stacked > li > a {\r
+  margin-bottom: 3px;\r
+}\r
+\r
+.nav-pills.nav-stacked > li:last-child > a {\r
+  margin-bottom: 1px;\r
+}\r
+\r
+.nav-tabs .dropdown-menu {\r
+  -webkit-border-radius: 0 0 5px 5px;\r
+     -moz-border-radius: 0 0 5px 5px;\r
+          border-radius: 0 0 5px 5px;\r
+}\r
+\r
+.nav-pills .dropdown-menu {\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.nav-tabs .dropdown-toggle .caret,\r
+.nav-pills .dropdown-toggle .caret {\r
+  margin-top: 6px;\r
+  border-top-color: #0088cc;\r
+  border-bottom-color: #0088cc;\r
+}\r
+\r
+.nav-tabs .dropdown-toggle:hover .caret,\r
+.nav-pills .dropdown-toggle:hover .caret {\r
+  border-top-color: #005580;\r
+  border-bottom-color: #005580;\r
+}\r
+\r
+.nav-tabs .active .dropdown-toggle .caret,\r
+.nav-pills .active .dropdown-toggle .caret {\r
+  border-top-color: #333333;\r
+  border-bottom-color: #333333;\r
+}\r
+\r
+.nav > .dropdown.active > a:hover {\r
+  color: #000000;\r
+  cursor: pointer;\r
+}\r
+\r
+.nav-tabs .open .dropdown-toggle,\r
+.nav-pills .open .dropdown-toggle,\r
+.nav > li.dropdown.open.active > a:hover {\r
+  color: #ffffff;\r
+  background-color: #999999;\r
+  border-color: #999999;\r
+}\r
+\r
+.nav li.dropdown.open .caret,\r
+.nav li.dropdown.open.active .caret,\r
+.nav li.dropdown.open a:hover .caret {\r
+  border-top-color: #ffffff;\r
+  border-bottom-color: #ffffff;\r
+  opacity: 1;\r
+  filter: alpha(opacity=100);\r
+}\r
+\r
+.tabs-stacked .open > a:hover {\r
+  border-color: #999999;\r
+}\r
+\r
+.tabbable {\r
+  *zoom: 1;\r
+}\r
+\r
+.tabbable:before,\r
+.tabbable:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.tabbable:after {\r
+  clear: both;\r
+}\r
+\r
+.tab-content {\r
+  overflow: auto;\r
+}\r
+\r
+.tabs-below > .nav-tabs,\r
+.tabs-right > .nav-tabs,\r
+.tabs-left > .nav-tabs {\r
+  border-bottom: 0;\r
+}\r
+\r
+.tab-content > .tab-pane,\r
+.pill-content > .pill-pane {\r
+  display: none;\r
+}\r
+\r
+.tab-content > .active,\r
+.pill-content > .active {\r
+  display: block;\r
+}\r
+\r
+.tabs-below > .nav-tabs {\r
+  border-top: 1px solid #ddd;\r
+}\r
+\r
+.tabs-below > .nav-tabs > li {\r
+  margin-top: -1px;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.tabs-below > .nav-tabs > li > a {\r
+  -webkit-border-radius: 0 0 4px 4px;\r
+     -moz-border-radius: 0 0 4px 4px;\r
+          border-radius: 0 0 4px 4px;\r
+}\r
+\r
+.tabs-below > .nav-tabs > li > a:hover {\r
+  border-top-color: #ddd;\r
+  border-bottom-color: transparent;\r
+}\r
+\r
+.tabs-below > .nav-tabs > .active > a,\r
+.tabs-below > .nav-tabs > .active > a:hover {\r
+  border-color: transparent #ddd #ddd #ddd;\r
+}\r
+\r
+.tabs-left > .nav-tabs > li,\r
+.tabs-right > .nav-tabs > li {\r
+  float: none;\r
+}\r
+\r
+.tabs-left > .nav-tabs > li > a,\r
+.tabs-right > .nav-tabs > li > a {\r
+  min-width: 74px;\r
+  margin-right: 0;\r
+  margin-bottom: 3px;\r
+}\r
+\r
+.tabs-left > .nav-tabs {\r
+  float: left;\r
+  margin-right: 19px;\r
+  border-right: 1px solid #ddd;\r
+}\r
+\r
+.tabs-left > .nav-tabs > li > a {\r
+  margin-right: -1px;\r
+  -webkit-border-radius: 4px 0 0 4px;\r
+     -moz-border-radius: 4px 0 0 4px;\r
+          border-radius: 4px 0 0 4px;\r
+}\r
+\r
+.tabs-left > .nav-tabs > li > a:hover {\r
+  border-color: #eeeeee #dddddd #eeeeee #eeeeee;\r
+}\r
+\r
+.tabs-left > .nav-tabs .active > a,\r
+.tabs-left > .nav-tabs .active > a:hover {\r
+  border-color: #ddd transparent #ddd #ddd;\r
+  *border-right-color: #ffffff;\r
+}\r
+\r
+.tabs-right > .nav-tabs {\r
+  float: right;\r
+  margin-left: 19px;\r
+  border-left: 1px solid #ddd;\r
+}\r
+\r
+.tabs-right > .nav-tabs > li > a {\r
+  margin-left: -1px;\r
+  -webkit-border-radius: 0 4px 4px 0;\r
+     -moz-border-radius: 0 4px 4px 0;\r
+          border-radius: 0 4px 4px 0;\r
+}\r
+\r
+.tabs-right > .nav-tabs > li > a:hover {\r
+  border-color: #eeeeee #eeeeee #eeeeee #dddddd;\r
+}\r
+\r
+.tabs-right > .nav-tabs .active > a,\r
+.tabs-right > .nav-tabs .active > a:hover {\r
+  border-color: #ddd #ddd #ddd transparent;\r
+  *border-left-color: #ffffff;\r
+}\r
+\r
+.navbar {\r
+  *position: relative;\r
+  *z-index: 2;\r
+  margin-bottom: 18px;\r
+  overflow: visible;\r
+}\r
+\r
+.navbar-inner {\r
+  min-height: 40px;\r
+  padding-right: 20px;\r
+  padding-left: 20px;\r
+  background-color: #2c2c2c;\r
+  background-image: -moz-linear-gradient(top, #333333, #222222);\r
+  background-image: -ms-linear-gradient(top, #333333, #222222);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), to(#222222));\r
+  background-image: -webkit-linear-gradient(top, #333333, #222222);\r
+  background-image: -o-linear-gradient(top, #333333, #222222);\r
+  background-image: linear-gradient(top, #333333, #222222);\r
+  background-repeat: repeat-x;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);\r
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);\r
+     -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);\r
+          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);\r
+}\r
+\r
+.navbar .container {\r
+  width: auto;\r
+}\r
+\r
+.nav-collapse.collapse {\r
+  height: auto;\r
+}\r
+\r
+.navbar {\r
+  color: #999999;\r
+}\r
+\r
+.navbar .brand:hover {\r
+  text-decoration: none;\r
+}\r
+\r
+.navbar .brand {\r
+  display: block;\r
+  float: left;\r
+  padding: 8px 20px 12px;\r
+  margin-left: -20px;\r
+  font-size: 20px;\r
+  font-weight: 200;\r
+  line-height: 1;\r
+  color: #999999;\r
+}\r
+\r
+.navbar .navbar-text {\r
+  margin-bottom: 0;\r
+  line-height: 40px;\r
+}\r
+\r
+.navbar .navbar-link {\r
+  color: #999999;\r
+}\r
+\r
+.navbar .navbar-link:hover {\r
+  color: #ffffff;\r
+}\r
+\r
+.navbar .btn,\r
+.navbar .btn-group {\r
+  margin-top: 5px;\r
+}\r
+\r
+.navbar .btn-group .btn {\r
+  margin: 0;\r
+}\r
+\r
+.navbar-form {\r
+  margin-bottom: 0;\r
+  *zoom: 1;\r
+}\r
+\r
+.navbar-form:before,\r
+.navbar-form:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.navbar-form:after {\r
+  clear: both;\r
+}\r
+\r
+.navbar-form input,\r
+.navbar-form select,\r
+.navbar-form .radio,\r
+.navbar-form .checkbox {\r
+  margin-top: 5px;\r
+}\r
+\r
+.navbar-form input,\r
+.navbar-form select {\r
+  display: inline-block;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.navbar-form input[type="image"],\r
+.navbar-form input[type="checkbox"],\r
+.navbar-form input[type="radio"] {\r
+  margin-top: 3px;\r
+}\r
+\r
+.navbar-form .input-append,\r
+.navbar-form .input-prepend {\r
+  margin-top: 6px;\r
+  white-space: nowrap;\r
+}\r
+\r
+.navbar-form .input-append input,\r
+.navbar-form .input-prepend input {\r
+  margin-top: 0;\r
+}\r
+\r
+.navbar-search {\r
+  position: relative;\r
+  float: left;\r
+  margin-top: 6px;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.navbar-search .search-query {\r
+  padding: 4px 9px;\r
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;\r
+  font-size: 13px;\r
+  font-weight: normal;\r
+  line-height: 1;\r
+  color: #ffffff;\r
+  background-color: #626262;\r
+  border: 1px solid #151515;\r
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);\r
+     -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);\r
+          box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);\r
+  -webkit-transition: none;\r
+     -moz-transition: none;\r
+      -ms-transition: none;\r
+       -o-transition: none;\r
+          transition: none;\r
+}\r
+\r
+.navbar-search .search-query:-moz-placeholder {\r
+  color: #cccccc;\r
+}\r
+\r
+.navbar-search .search-query::-webkit-input-placeholder {\r
+  color: #cccccc;\r
+}\r
+\r
+.navbar-search .search-query:focus,\r
+.navbar-search .search-query.focused {\r
+  padding: 5px 10px;\r
+  color: #333333;\r
+  text-shadow: 0 1px 0 #ffffff;\r
+  background-color: #ffffff;\r
+  border: 0;\r
+  outline: 0;\r
+  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);\r
+     -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);\r
+          box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);\r
+}\r
+\r
+.navbar-fixed-top,\r
+.navbar-fixed-bottom {\r
+  position: fixed;\r
+  right: 0;\r
+  left: 0;\r
+  z-index: 1030;\r
+  margin-bottom: 0;\r
+}\r
+\r
+.navbar-fixed-top .navbar-inner,\r
+.navbar-fixed-bottom .navbar-inner {\r
+  padding-right: 0;\r
+  padding-left: 0;\r
+  -webkit-border-radius: 0;\r
+     -moz-border-radius: 0;\r
+          border-radius: 0;\r
+}\r
+\r
+.navbar-fixed-top .container,\r
+.navbar-fixed-bottom .container {\r
+  width: 940px;\r
+}\r
+\r
+.navbar-fixed-top {\r
+  top: 0;\r
+}\r
+\r
+.navbar-fixed-bottom {\r
+  bottom: 0;\r
+}\r
+\r
+.navbar .nav {\r
+  position: relative;\r
+  left: 0;\r
+  display: block;\r
+  float: left;\r
+  margin: 0 10px 0 0;\r
+}\r
+\r
+.navbar .nav.pull-right {\r
+  float: right;\r
+}\r
+\r
+.navbar .nav > li {\r
+  display: block;\r
+  float: left;\r
+}\r
+\r
+.navbar .nav > li > a {\r
+  float: none;\r
+  padding: 9px 10px 11px;\r
+  line-height: 19px;\r
+  color: #999999;\r
+  text-decoration: none;\r
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\r
+}\r
+\r
+.navbar .btn {\r
+  display: inline-block;\r
+  padding: 4px 10px 4px;\r
+  margin: 5px 5px 6px;\r
+  line-height: 18px;\r
+}\r
+\r
+.navbar .btn-group {\r
+  padding: 5px 5px 6px;\r
+  margin: 0;\r
+}\r
+\r
+.navbar .nav > li > a:hover {\r
+  color: #ffffff;\r
+  text-decoration: none;\r
+  background-color: transparent;\r
+}\r
+\r
+.navbar .nav .active > a,\r
+.navbar .nav .active > a:hover {\r
+  color: #ffffff;\r
+  text-decoration: none;\r
+  background-color: #222222;\r
+}\r
+\r
+.navbar .divider-vertical {\r
+  width: 1px;\r
+  height: 40px;\r
+  margin: 0 9px;\r
+  overflow: hidden;\r
+  background-color: #222222;\r
+  border-right: 1px solid #333333;\r
+}\r
+\r
+.navbar .nav.pull-right {\r
+  margin-right: 0;\r
+  margin-left: 10px;\r
+}\r
+\r
+.navbar .btn-navbar {\r
+  display: none;\r
+  float: right;\r
+  padding: 7px 10px;\r
+  margin-right: 5px;\r
+  margin-left: 5px;\r
+  background-color: #2c2c2c;\r
+  *background-color: #222222;\r
+  background-image: -ms-linear-gradient(top, #333333, #222222);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), to(#222222));\r
+  background-image: -webkit-linear-gradient(top, #333333, #222222);\r
+  background-image: -o-linear-gradient(top, #333333, #222222);\r
+  background-image: linear-gradient(top, #333333, #222222);\r
+  background-image: -moz-linear-gradient(top, #333333, #222222);\r
+  background-repeat: repeat-x;\r
+  border-color: #222222 #222222 #000000;\r
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);\r
+  filter: progid:dximagetransform.microsoft.gradient(enabled=false);\r
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);\r
+     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);\r
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);\r
+}\r
+\r
+.navbar .btn-navbar:hover,\r
+.navbar .btn-navbar:active,\r
+.navbar .btn-navbar.active,\r
+.navbar .btn-navbar.disabled,\r
+.navbar .btn-navbar[disabled] {\r
+  background-color: #222222;\r
+  *background-color: #151515;\r
+}\r
+\r
+.navbar .btn-navbar:active,\r
+.navbar .btn-navbar.active {\r
+  background-color: #080808 \9;\r
+}\r
+\r
+.navbar .btn-navbar .icon-bar {\r
+  display: block;\r
+  width: 18px;\r
+  height: 2px;\r
+  background-color: #f5f5f5;\r
+  -webkit-border-radius: 1px;\r
+     -moz-border-radius: 1px;\r
+          border-radius: 1px;\r
+  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);\r
+     -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);\r
+          box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);\r
+}\r
+\r
+.btn-navbar .icon-bar + .icon-bar {\r
+  margin-top: 3px;\r
+}\r
+\r
+.navbar .dropdown-menu:before {\r
+  position: absolute;\r
+  top: -7px;\r
+  left: 9px;\r
+  display: inline-block;\r
+  border-right: 7px solid transparent;\r
+  border-bottom: 7px solid #ccc;\r
+  border-left: 7px solid transparent;\r
+  border-bottom-color: rgba(0, 0, 0, 0.2);\r
+  content: '';\r
+}\r
+\r
+.navbar .dropdown-menu:after {\r
+  position: absolute;\r
+  top: -6px;\r
+  left: 10px;\r
+  display: inline-block;\r
+  border-right: 6px solid transparent;\r
+  border-bottom: 6px solid #ffffff;\r
+  border-left: 6px solid transparent;\r
+  content: '';\r
+}\r
+\r
+.navbar-fixed-bottom .dropdown-menu:before {\r
+  top: auto;\r
+  bottom: -7px;\r
+  border-top: 7px solid #ccc;\r
+  border-bottom: 0;\r
+  border-top-color: rgba(0, 0, 0, 0.2);\r
+}\r
+\r
+.navbar-fixed-bottom .dropdown-menu:after {\r
+  top: auto;\r
+  bottom: -6px;\r
+  border-top: 6px solid #ffffff;\r
+  border-bottom: 0;\r
+}\r
+\r
+.navbar .nav li.dropdown .dropdown-toggle .caret,\r
+.navbar .nav li.dropdown.open .caret {\r
+  border-top-color: #ffffff;\r
+  border-bottom-color: #ffffff;\r
+}\r
+\r
+.navbar .nav li.dropdown.active .caret {\r
+  opacity: 1;\r
+  filter: alpha(opacity=100);\r
+}\r
+\r
+.navbar .nav li.dropdown.open > .dropdown-toggle,\r
+.navbar .nav li.dropdown.active > .dropdown-toggle,\r
+.navbar .nav li.dropdown.open.active > .dropdown-toggle {\r
+  background-color: transparent;\r
+}\r
+\r
+.navbar .nav li.dropdown.active > .dropdown-toggle:hover {\r
+  color: #ffffff;\r
+}\r
+\r
+.navbar .pull-right .dropdown-menu,\r
+.navbar .dropdown-menu.pull-right {\r
+  right: 0;\r
+  left: auto;\r
+}\r
+\r
+.navbar .pull-right .dropdown-menu:before,\r
+.navbar .dropdown-menu.pull-right:before {\r
+  right: 12px;\r
+  left: auto;\r
+}\r
+\r
+.navbar .pull-right .dropdown-menu:after,\r
+.navbar .dropdown-menu.pull-right:after {\r
+  right: 13px;\r
+  left: auto;\r
+}\r
+\r
+.breadcrumb {\r
+  padding: 7px 14px;\r
+  margin: 0 0 18px;\r
+  list-style: none;\r
+  background-color: #fbfbfb;\r
+  background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5);\r
+  background-image: -ms-linear-gradient(top, #ffffff, #f5f5f5);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f5f5f5));\r
+  background-image: -webkit-linear-gradient(top, #ffffff, #f5f5f5);\r
+  background-image: -o-linear-gradient(top, #ffffff, #f5f5f5);\r
+  background-image: linear-gradient(top, #ffffff, #f5f5f5);\r
+  background-repeat: repeat-x;\r
+  border: 1px solid #ddd;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);\r
+  -webkit-box-shadow: inset 0 1px 0 #ffffff;\r
+     -moz-box-shadow: inset 0 1px 0 #ffffff;\r
+          box-shadow: inset 0 1px 0 #ffffff;\r
+}\r
+\r
+.breadcrumb li {\r
+  display: inline-block;\r
+  *display: inline;\r
+  text-shadow: 0 1px 0 #ffffff;\r
+  *zoom: 1;\r
+}\r
+\r
+.breadcrumb .divider {\r
+  padding: 0 5px;\r
+  color: #999999;\r
+}\r
+\r
+.breadcrumb .active a {\r
+  color: #333333;\r
+}\r
+\r
+.pagination {\r
+  height: 36px;\r
+  margin: 18px 0;\r
+}\r
+\r
+.pagination ul {\r
+  display: inline-block;\r
+  *display: inline;\r
+  margin-bottom: 0;\r
+  margin-left: 0;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+  *zoom: 1;\r
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\r
+     -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\r
+          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\r
+}\r
+\r
+.pagination li {\r
+  display: inline;\r
+}\r
+\r
+.pagination a {\r
+  float: left;\r
+  padding: 0 14px;\r
+  line-height: 34px;\r
+  text-decoration: none;\r
+  border: 1px solid #ddd;\r
+  border-left-width: 0;\r
+}\r
+\r
+.pagination a:hover,\r
+.pagination .active a {\r
+  background-color: #f5f5f5;\r
+}\r
+\r
+.pagination .active a {\r
+  color: #999999;\r
+  cursor: default;\r
+}\r
+\r
+.pagination .disabled span,\r
+.pagination .disabled a,\r
+.pagination .disabled a:hover {\r
+  color: #999999;\r
+  cursor: default;\r
+  background-color: transparent;\r
+}\r
+\r
+.pagination li:first-child a {\r
+  border-left-width: 1px;\r
+  -webkit-border-radius: 3px 0 0 3px;\r
+     -moz-border-radius: 3px 0 0 3px;\r
+          border-radius: 3px 0 0 3px;\r
+}\r
+\r
+.pagination li:last-child a {\r
+  -webkit-border-radius: 0 3px 3px 0;\r
+     -moz-border-radius: 0 3px 3px 0;\r
+          border-radius: 0 3px 3px 0;\r
+}\r
+\r
+.pagination-centered {\r
+  text-align: center;\r
+}\r
+\r
+.pagination-right {\r
+  text-align: right;\r
+}\r
+\r
+.pager {\r
+  margin-bottom: 18px;\r
+  margin-left: 0;\r
+  text-align: center;\r
+  list-style: none;\r
+  *zoom: 1;\r
+}\r
+\r
+.pager:before,\r
+.pager:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.pager:after {\r
+  clear: both;\r
+}\r
+\r
+.pager li {\r
+  display: inline;\r
+}\r
+\r
+.pager a {\r
+  display: inline-block;\r
+  padding: 5px 14px;\r
+  background-color: #fff;\r
+  border: 1px solid #ddd;\r
+  -webkit-border-radius: 15px;\r
+     -moz-border-radius: 15px;\r
+          border-radius: 15px;\r
+}\r
+\r
+.pager a:hover {\r
+  text-decoration: none;\r
+  background-color: #f5f5f5;\r
+}\r
+\r
+.pager .next a {\r
+  float: right;\r
+}\r
+\r
+.pager .previous a {\r
+  float: left;\r
+}\r
+\r
+.pager .disabled a,\r
+.pager .disabled a:hover {\r
+  color: #999999;\r
+  cursor: default;\r
+  background-color: #fff;\r
+}\r
+\r
+.modal-open .dropdown-menu {\r
+  z-index: 2050;\r
+}\r
+\r
+.modal-open .dropdown.open {\r
+  *z-index: 2050;\r
+}\r
+\r
+.modal-open .popover {\r
+  z-index: 2060;\r
+}\r
+\r
+.modal-open .tooltip {\r
+  z-index: 2070;\r
+}\r
+\r
+.modal-backdrop {\r
+  position: fixed;\r
+  top: 0;\r
+  right: 0;\r
+  bottom: 0;\r
+  left: 0;\r
+  z-index: 1040;\r
+  background-color: #000000;\r
+}\r
+\r
+.modal-backdrop.fade {\r
+  opacity: 0;\r
+}\r
+\r
+.modal-backdrop,\r
+.modal-backdrop.fade.in {\r
+  opacity: 0.8;\r
+  filter: alpha(opacity=80);\r
+}\r
+\r
+.modal {\r
+  position: fixed;\r
+  top: 50%;\r
+  left: 50%;\r
+  z-index: 1050;\r
+  width: 560px;\r
+  margin: -250px 0 0 -280px;\r
+  overflow: auto;\r
+  background-color: #ffffff;\r
+  border: 1px solid #999;\r
+  border: 1px solid rgba(0, 0, 0, 0.3);\r
+  *border: 1px solid #999;\r
+  -webkit-border-radius: 6px;\r
+     -moz-border-radius: 6px;\r
+          border-radius: 6px;\r
+  -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+     -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+          box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+  -webkit-background-clip: padding-box;\r
+     -moz-background-clip: padding-box;\r
+          background-clip: padding-box;\r
+}\r
+\r
+.modal.fade {\r
+  top: -25%;\r
+  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;\r
+     -moz-transition: opacity 0.3s linear, top 0.3s ease-out;\r
+      -ms-transition: opacity 0.3s linear, top 0.3s ease-out;\r
+       -o-transition: opacity 0.3s linear, top 0.3s ease-out;\r
+          transition: opacity 0.3s linear, top 0.3s ease-out;\r
+}\r
+\r
+.modal.fade.in {\r
+  top: 50%;\r
+}\r
+\r
+.modal-header {\r
+  padding: 9px 15px;\r
+  border-bottom: 1px solid #eee;\r
+}\r
+\r
+.modal-header .close {\r
+  margin-top: 2px;\r
+}\r
+\r
+.modal-body {\r
+  max-height: 400px;\r
+  padding: 15px;\r
+  overflow-y: auto;\r
+}\r
+\r
+.modal-form {\r
+  margin-bottom: 0;\r
+}\r
+\r
+.modal-footer {\r
+  padding: 14px 15px 15px;\r
+  margin-bottom: 0;\r
+  text-align: right;\r
+  background-color: #f5f5f5;\r
+  border-top: 1px solid #ddd;\r
+  -webkit-border-radius: 0 0 6px 6px;\r
+     -moz-border-radius: 0 0 6px 6px;\r
+          border-radius: 0 0 6px 6px;\r
+  *zoom: 1;\r
+  -webkit-box-shadow: inset 0 1px 0 #ffffff;\r
+     -moz-box-shadow: inset 0 1px 0 #ffffff;\r
+          box-shadow: inset 0 1px 0 #ffffff;\r
+}\r
+\r
+.modal-footer:before,\r
+.modal-footer:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.modal-footer:after {\r
+  clear: both;\r
+}\r
+\r
+.modal-footer .btn + .btn {\r
+  margin-bottom: 0;\r
+  margin-left: 5px;\r
+}\r
+\r
+.modal-footer .btn-group .btn + .btn {\r
+  margin-left: -1px;\r
+}\r
+\r
+.tooltip {\r
+  position: absolute;\r
+  z-index: 1020;\r
+  display: block;\r
+  padding: 5px;\r
+  font-size: 11px;\r
+  opacity: 0;\r
+  filter: alpha(opacity=0);\r
+  visibility: visible;\r
+}\r
+\r
+.tooltip.in {\r
+  opacity: 0.8;\r
+  filter: alpha(opacity=80);\r
+}\r
+\r
+.tooltip.top {\r
+  margin-top: -2px;\r
+}\r
+\r
+.tooltip.right {\r
+  margin-left: 2px;\r
+}\r
+\r
+.tooltip.bottom {\r
+  margin-top: 2px;\r
+}\r
+\r
+.tooltip.left {\r
+  margin-left: -2px;\r
+}\r
+\r
+.tooltip.top .tooltip-arrow {\r
+  bottom: 0;\r
+  left: 50%;\r
+  margin-left: -5px;\r
+  border-top: 5px solid #000000;\r
+  border-right: 5px solid transparent;\r
+  border-left: 5px solid transparent;\r
+}\r
+\r
+.tooltip.left .tooltip-arrow {\r
+  top: 50%;\r
+  right: 0;\r
+  margin-top: -5px;\r
+  border-top: 5px solid transparent;\r
+  border-bottom: 5px solid transparent;\r
+  border-left: 5px solid #000000;\r
+}\r
+\r
+.tooltip.bottom .tooltip-arrow {\r
+  top: 0;\r
+  left: 50%;\r
+  margin-left: -5px;\r
+  border-right: 5px solid transparent;\r
+  border-bottom: 5px solid #000000;\r
+  border-left: 5px solid transparent;\r
+}\r
+\r
+.tooltip.right .tooltip-arrow {\r
+  top: 50%;\r
+  left: 0;\r
+  margin-top: -5px;\r
+  border-top: 5px solid transparent;\r
+  border-right: 5px solid #000000;\r
+  border-bottom: 5px solid transparent;\r
+}\r
+\r
+.tooltip-inner {\r
+  max-width: 200px;\r
+  padding: 3px 8px;\r
+  color: #ffffff;\r
+  text-align: center;\r
+  text-decoration: none;\r
+  background-color: #000000;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.tooltip-arrow {\r
+  position: absolute;\r
+  width: 0;\r
+  height: 0;\r
+}\r
+\r
+.popover {\r
+  position: absolute;\r
+  top: 0;\r
+  left: 0;\r
+  z-index: 1010;\r
+  display: none;\r
+  padding: 5px;\r
+}\r
+\r
+.popover.top {\r
+  margin-top: -5px;\r
+}\r
+\r
+.popover.right {\r
+  margin-left: 5px;\r
+}\r
+\r
+.popover.bottom {\r
+  margin-top: 5px;\r
+}\r
+\r
+.popover.left {\r
+  margin-left: -5px;\r
+}\r
+\r
+.popover.top .arrow {\r
+  bottom: 0;\r
+  left: 50%;\r
+  margin-left: -5px;\r
+  border-top: 5px solid #000000;\r
+  border-right: 5px solid transparent;\r
+  border-left: 5px solid transparent;\r
+}\r
+\r
+.popover.right .arrow {\r
+  top: 50%;\r
+  left: 0;\r
+  margin-top: -5px;\r
+  border-top: 5px solid transparent;\r
+  border-right: 5px solid #000000;\r
+  border-bottom: 5px solid transparent;\r
+}\r
+\r
+.popover.bottom .arrow {\r
+  top: 0;\r
+  left: 50%;\r
+  margin-left: -5px;\r
+  border-right: 5px solid transparent;\r
+  border-bottom: 5px solid #000000;\r
+  border-left: 5px solid transparent;\r
+}\r
+\r
+.popover.left .arrow {\r
+  top: 50%;\r
+  right: 0;\r
+  margin-top: -5px;\r
+  border-top: 5px solid transparent;\r
+  border-bottom: 5px solid transparent;\r
+  border-left: 5px solid #000000;\r
+}\r
+\r
+.popover .arrow {\r
+  position: absolute;\r
+  width: 0;\r
+  height: 0;\r
+}\r
+\r
+.popover-inner {\r
+  width: 280px;\r
+  padding: 3px;\r
+  overflow: hidden;\r
+  background: #000000;\r
+  background: rgba(0, 0, 0, 0.8);\r
+  -webkit-border-radius: 6px;\r
+     -moz-border-radius: 6px;\r
+          border-radius: 6px;\r
+  -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+     -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+          box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);\r
+}\r
+\r
+.popover-title {\r
+  padding: 9px 15px;\r
+  line-height: 1;\r
+  background-color: #f5f5f5;\r
+  border-bottom: 1px solid #eee;\r
+  -webkit-border-radius: 3px 3px 0 0;\r
+     -moz-border-radius: 3px 3px 0 0;\r
+          border-radius: 3px 3px 0 0;\r
+}\r
+\r
+.popover-content {\r
+  padding: 14px;\r
+  background-color: #ffffff;\r
+  -webkit-border-radius: 0 0 3px 3px;\r
+     -moz-border-radius: 0 0 3px 3px;\r
+          border-radius: 0 0 3px 3px;\r
+  -webkit-background-clip: padding-box;\r
+     -moz-background-clip: padding-box;\r
+          background-clip: padding-box;\r
+}\r
+\r
+.popover-content p,\r
+.popover-content ul,\r
+.popover-content ol {\r
+  margin-bottom: 0;\r
+}\r
+\r
+.thumbnails {\r
+  margin-left: -20px;\r
+  list-style: none;\r
+  *zoom: 1;\r
+}\r
+\r
+.thumbnails:before,\r
+.thumbnails:after {\r
+  display: table;\r
+  content: "";\r
+}\r
+\r
+.thumbnails:after {\r
+  clear: both;\r
+}\r
+\r
+.row-fluid .thumbnails {\r
+  margin-left: 0;\r
+}\r
+\r
+.thumbnails > li {\r
+  float: left;\r
+  margin-bottom: 18px;\r
+  margin-left: 20px;\r
+}\r
+\r
+.thumbnail {\r
+  display: block;\r
+  padding: 4px;\r
+  line-height: 1;\r
+  border: 1px solid #ddd;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);\r
+     -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);\r
+          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);\r
+}\r
+\r
+a.thumbnail:hover {\r
+  border-color: #0088cc;\r
+  -webkit-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);\r
+     -moz-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);\r
+          box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);\r
+}\r
+\r
+.thumbnail > img {\r
+  display: block;\r
+  max-width: 100%;\r
+  margin-right: auto;\r
+  margin-left: auto;\r
+}\r
+\r
+.thumbnail .caption {\r
+  padding: 9px;\r
+}\r
+\r
+.label,\r
+.badge {\r
+  font-size: 10.998px;\r
+  font-weight: bold;\r
+  line-height: 14px;\r
+  color: #ffffff;\r
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\r
+  white-space: nowrap;\r
+  vertical-align: baseline;\r
+  background-color: #999999;\r
+}\r
+\r
+.label {\r
+  padding: 1px 4px 2px;\r
+  -webkit-border-radius: 3px;\r
+     -moz-border-radius: 3px;\r
+          border-radius: 3px;\r
+}\r
+\r
+.badge {\r
+  padding: 1px 9px 2px;\r
+  -webkit-border-radius: 9px;\r
+     -moz-border-radius: 9px;\r
+          border-radius: 9px;\r
+}\r
+\r
+a.label:hover,\r
+a.badge:hover {\r
+  color: #ffffff;\r
+  text-decoration: none;\r
+  cursor: pointer;\r
+}\r
+\r
+.label-important,\r
+.badge-important {\r
+  background-color: #b94a48;\r
+}\r
+\r
+.label-important[href],\r
+.badge-important[href] {\r
+  background-color: #953b39;\r
+}\r
+\r
+.label-warning,\r
+.badge-warning {\r
+  background-color: #f89406;\r
+}\r
+\r
+.label-warning[href],\r
+.badge-warning[href] {\r
+  background-color: #c67605;\r
+}\r
+\r
+.label-success,\r
+.badge-success {\r
+  background-color: #468847;\r
+}\r
+\r
+.label-success[href],\r
+.badge-success[href] {\r
+  background-color: #356635;\r
+}\r
+\r
+.label-info,\r
+.badge-info {\r
+  background-color: #3a87ad;\r
+}\r
+\r
+.label-info[href],\r
+.badge-info[href] {\r
+  background-color: #2d6987;\r
+}\r
+\r
+.label-inverse,\r
+.badge-inverse {\r
+  background-color: #333333;\r
+}\r
+\r
+.label-inverse[href],\r
+.badge-inverse[href] {\r
+  background-color: #1a1a1a;\r
+}\r
+\r
+@-webkit-keyframes progress-bar-stripes {\r
+  from {\r
+    background-position: 40px 0;\r
+  }\r
+  to {\r
+    background-position: 0 0;\r
+  }\r
+}\r
+\r
+@-moz-keyframes progress-bar-stripes {\r
+  from {\r
+    background-position: 40px 0;\r
+  }\r
+  to {\r
+    background-position: 0 0;\r
+  }\r
+}\r
+\r
+@-ms-keyframes progress-bar-stripes {\r
+  from {\r
+    background-position: 40px 0;\r
+  }\r
+  to {\r
+    background-position: 0 0;\r
+  }\r
+}\r
+\r
+@-o-keyframes progress-bar-stripes {\r
+  from {\r
+    background-position: 0 0;\r
+  }\r
+  to {\r
+    background-position: 40px 0;\r
+  }\r
+}\r
+\r
+@keyframes progress-bar-stripes {\r
+  from {\r
+    background-position: 40px 0;\r
+  }\r
+  to {\r
+    background-position: 0 0;\r
+  }\r
+}\r
+\r
+.progress {\r
+  height: 18px;\r
+  margin-bottom: 18px;\r
+  overflow: hidden;\r
+  background-color: #f7f7f7;\r
+  background-image: -moz-linear-gradient(top, #f5f5f5, #f9f9f9);\r
+  background-image: -ms-linear-gradient(top, #f5f5f5, #f9f9f9);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));\r
+  background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);\r
+  background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);\r
+  background-image: linear-gradient(top, #f5f5f5, #f9f9f9);\r
+  background-repeat: repeat-x;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#f9f9f9', GradientType=0);\r
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);\r
+     -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);\r
+          box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);\r
+}\r
+\r
+.progress .bar {\r
+  width: 0;\r
+  height: 18px;\r
+  font-size: 12px;\r
+  color: #ffffff;\r
+  text-align: center;\r
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\r
+  background-color: #0e90d2;\r
+  background-image: -moz-linear-gradient(top, #149bdf, #0480be);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#0480be));\r
+  background-image: -webkit-linear-gradient(top, #149bdf, #0480be);\r
+  background-image: -o-linear-gradient(top, #149bdf, #0480be);\r
+  background-image: linear-gradient(top, #149bdf, #0480be);\r
+  background-image: -ms-linear-gradient(top, #149bdf, #0480be);\r
+  background-repeat: repeat-x;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#149bdf', endColorstr='#0480be', GradientType=0);\r
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);\r
+     -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);\r
+          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);\r
+  -webkit-box-sizing: border-box;\r
+     -moz-box-sizing: border-box;\r
+      -ms-box-sizing: border-box;\r
+          box-sizing: border-box;\r
+  -webkit-transition: width 0.6s ease;\r
+     -moz-transition: width 0.6s ease;\r
+      -ms-transition: width 0.6s ease;\r
+       -o-transition: width 0.6s ease;\r
+          transition: width 0.6s ease;\r
+}\r
+\r
+.progress-striped .bar {\r
+  background-color: #149bdf;\r
+  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));\r
+  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  -webkit-background-size: 40px 40px;\r
+     -moz-background-size: 40px 40px;\r
+       -o-background-size: 40px 40px;\r
+          background-size: 40px 40px;\r
+}\r
+\r
+.progress.active .bar {\r
+  -webkit-animation: progress-bar-stripes 2s linear infinite;\r
+     -moz-animation: progress-bar-stripes 2s linear infinite;\r
+      -ms-animation: progress-bar-stripes 2s linear infinite;\r
+       -o-animation: progress-bar-stripes 2s linear infinite;\r
+          animation: progress-bar-stripes 2s linear infinite;\r
+}\r
+\r
+.progress-danger .bar {\r
+  background-color: #dd514c;\r
+  background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);\r
+  background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#c43c35));\r
+  background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);\r
+  background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);\r
+  background-image: linear-gradient(top, #ee5f5b, #c43c35);\r
+  background-repeat: repeat-x;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);\r
+}\r
+\r
+.progress-danger.progress-striped .bar {\r
+  background-color: #ee5f5b;\r
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));\r
+  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+}\r
+\r
+.progress-success .bar {\r
+  background-color: #5eb95e;\r
+  background-image: -moz-linear-gradient(top, #62c462, #57a957);\r
+  background-image: -ms-linear-gradient(top, #62c462, #57a957);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#57a957));\r
+  background-image: -webkit-linear-gradient(top, #62c462, #57a957);\r
+  background-image: -o-linear-gradient(top, #62c462, #57a957);\r
+  background-image: linear-gradient(top, #62c462, #57a957);\r
+  background-repeat: repeat-x;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);\r
+}\r
+\r
+.progress-success.progress-striped .bar {\r
+  background-color: #62c462;\r
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));\r
+  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+}\r
+\r
+.progress-info .bar {\r
+  background-color: #4bb1cf;\r
+  background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);\r
+  background-image: -ms-linear-gradient(top, #5bc0de, #339bb9);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#339bb9));\r
+  background-image: -webkit-linear-gradient(top, #5bc0de, #339bb9);\r
+  background-image: -o-linear-gradient(top, #5bc0de, #339bb9);\r
+  background-image: linear-gradient(top, #5bc0de, #339bb9);\r
+  background-repeat: repeat-x;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);\r
+}\r
+\r
+.progress-info.progress-striped .bar {\r
+  background-color: #5bc0de;\r
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));\r
+  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+}\r
+\r
+.progress-warning .bar {\r
+  background-color: #faa732;\r
+  background-image: -moz-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -ms-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));\r
+  background-image: -webkit-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: -o-linear-gradient(top, #fbb450, #f89406);\r
+  background-image: linear-gradient(top, #fbb450, #f89406);\r
+  background-repeat: repeat-x;\r
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fbb450', endColorstr='#f89406', GradientType=0);\r
+}\r
+\r
+.progress-warning.progress-striped .bar {\r
+  background-color: #fbb450;\r
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));\r
+  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\r
+}\r
+\r
+.accordion {\r
+  margin-bottom: 18px;\r
+}\r
+\r
+.accordion-group {\r
+  margin-bottom: 2px;\r
+  border: 1px solid #e5e5e5;\r
+  -webkit-border-radius: 4px;\r
+     -moz-border-radius: 4px;\r
+          border-radius: 4px;\r
+}\r
+\r
+.accordion-heading {\r
+  border-bottom: 0;\r
+}\r
+\r
+.accordion-heading .accordion-toggle {\r
+  display: block;\r
+  padding: 8px 15px;\r
+}\r
+\r
+.accordion-toggle {\r
+  cursor: pointer;\r
+}\r
+\r
+.accordion-inner {\r
+  padding: 9px 15px;\r
+  border-top: 1px solid #e5e5e5;\r
+}\r
+\r
+.carousel {\r
+  position: relative;\r
+  margin-bottom: 18px;\r
+  line-height: 1;\r
+}\r
+\r
+.carousel-inner {\r
+  position: relative;\r
+  width: 100%;\r
+  overflow: hidden;\r
+}\r
+\r
+.carousel .item {\r
+  position: relative;\r
+  display: none;\r
+  -webkit-transition: 0.6s ease-in-out left;\r
+     -moz-transition: 0.6s ease-in-out left;\r
+      -ms-transition: 0.6s ease-in-out left;\r
+       -o-transition: 0.6s ease-in-out left;\r
+          transition: 0.6s ease-in-out left;\r
+}\r
+\r
+.carousel .item > img {\r
+  display: block;\r
+  line-height: 1;\r
+}\r
+\r
+.carousel .active,\r
+.carousel .next,\r
+.carousel .prev {\r
+  display: block;\r
+}\r
+\r
+.carousel .active {\r
+  left: 0;\r
+}\r
+\r
+.carousel .next,\r
+.carousel .prev {\r
+  position: absolute;\r
+  top: 0;\r
+  width: 100%;\r
+}\r
+\r
+.carousel .next {\r
+  left: 100%;\r
+}\r
+\r
+.carousel .prev {\r
+  left: -100%;\r
+}\r
+\r
+.carousel .next.left,\r
+.carousel .prev.right {\r
+  left: 0;\r
+}\r
+\r
+.carousel .active.left {\r
+  left: -100%;\r
+}\r
+\r
+.carousel .active.right {\r
+  left: 100%;\r
+}\r
+\r
+.carousel-control {\r
+  position: absolute;\r
+  top: 40%;\r
+  left: 15px;\r
+  width: 40px;\r
+  height: 40px;\r
+  margin-top: -20px;\r
+  font-size: 60px;\r
+  font-weight: 100;\r
+  line-height: 30px;\r
+  color: #ffffff;\r
+  text-align: center;\r
+  background: #222222;\r
+  border: 3px solid #ffffff;\r
+  -webkit-border-radius: 23px;\r
+     -moz-border-radius: 23px;\r
+          border-radius: 23px;\r
+  opacity: 0.5;\r
+  filter: alpha(opacity=50);\r
+}\r
+\r
+.carousel-control.right {\r
+  right: 15px;\r
+  left: auto;\r
+}\r
+\r
+.carousel-control:hover {\r
+  color: #ffffff;\r
+  text-decoration: none;\r
+  opacity: 0.9;\r
+  filter: alpha(opacity=90);\r
+}\r
+\r
+.carousel-caption {\r
+  position: absolute;\r
+  right: 0;\r
+  bottom: 0;\r
+  left: 0;\r
+  padding: 10px 15px 5px;\r
+  background: #333333;\r
+  background: rgba(0, 0, 0, 0.75);\r
+}\r
+\r
+.carousel-caption h4,\r
+.carousel-caption p {\r
+  color: #ffffff;\r
+}\r
+\r
+.hero-unit {\r
+  padding: 60px;\r
+  margin-bottom: 30px;\r
+  background-color: #eeeeee;\r
+  -webkit-border-radius: 6px;\r
+     -moz-border-radius: 6px;\r
+          border-radius: 6px;\r
+}\r
+\r
+.hero-unit h1 {\r
+  margin-bottom: 0;\r
+  font-size: 60px;\r
+  line-height: 1;\r
+  letter-spacing: -1px;\r
+  color: inherit;\r
+}\r
+\r
+.hero-unit p {\r
+  font-size: 18px;\r
+  font-weight: 200;\r
+  line-height: 27px;\r
+  color: inherit;\r
+}\r
+\r
+.pull-right {\r
+  float: right;\r
+}\r
+\r
+.pull-left {\r
+  float: left;\r
+}\r
+\r
+.hide {\r
+  display: none;\r
+}\r
+\r
+.show {\r
+  display: block;\r
+}\r
+\r
+.invisible {\r
+  visibility: hidden;\r
+}\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/skill.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/skill.css
new file mode 100644 (file)
index 0000000..092c7be
--- /dev/null
@@ -0,0 +1,89 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+body {\r
+  font-family: 'Open Sans', sans-serif;  \r
+  /*background-color: #f1f3fa;*/\r
+  width: '100%';\r
+  height: '100%';\r
+  margin-top: 10px;\r
+}\r
+div.skills-sunburst{\r
+       font-size: 12px;\r
+       font-weight: 400;\r
+       text-align:center;\r
+}\r
+\r
+#skillmap .skills-wrapper {\r
+  margin-top: 10px;\r
+  overflow: auto;\r
+}\r
+#skillmap .skills-sunburst {\r
+  float: left;\r
+  width: 500px;\r
+  margin-left: -80px;\r
+}\r
+#skillmap .skills-sunburst svg {\r
+  font: 11px 'Source Sans Pro', sans-serif;\r
+  font-weight: 900;\r
+  \r
+  cursor: pointer;\r
+}\r
+#skillmap .skills-chart {\r
+  float: right;\r
+  font-family: 'Source Sans Pro', sans-serif;\r
+  font-size: 15px;\r
+  margin: 80px 20px 0 0;\r
+}\r
+#skillmap .skills-chart .breadcumb-text {\r
+  font-size: 13px;\r
+  font-weight: 700;\r
+}\r
+#skillmap .skills-chart #skills-chart-line {\r
+  fill: none;\r
+  stroke-width: 3.5px;\r
+}\r
+#skillmap .skills-chart .axis path,\r
+#skillmap .skills-chart .axis line {\r
+  fill: none;\r
+}\r
+#skillmap .skills-chart .x-axis path,\r
+#skillmap .skills-chart .y-axis path {\r
+  stroke: #444;\r
+  stroke-width: 1px;\r
+  shape-rendering: geometricPrecision;\r
+}\r
+\r
+#explanation {\r
+  position: absolute;\r
+  top: 165px;\r
+  left: 170px;\r
+  width: 140px;\r
+  text-align: center;\r
+  color: #666;\r
+  margin-top:30px;\r
+}\r
+\r
+#percentage {\r
+  font-size: 2em;\r
+}\r
+\r
+#endlabel{\r
+       font-sizte:1.5em;\r
+}\r
+\r
+div.skills-sunburst text{\r
+        text-anchor: middle;\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vim.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vim.css
new file mode 100644 (file)
index 0000000..72de455
--- /dev/null
@@ -0,0 +1,482 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+body {\r
+       font-family: microsoft yahei !important;\r
+}\r
+\r
+/* blue pill (inspired by iTunes)\r
+*******************************************************************************/\r
+\r
+.grey {\r
+  background-color: #e5e5e5;\r
+  color: #333;\r
+}\r
+\r
+.blue {\r
+\r
+       background-color: #5b9bd1;\r
+       border-radius: 20px;\r
+       color: #fff;\r
+       font-weight: bold;\r
+       padding: 8px 0;\r
+       text-align: center;\r
+       width: 100px;\r
+}\r
+\r
+.blue:hover {\r
+       background-color: #e8f3fd;\r
+       color: #5b9bd1;\r
+}\r
+\r
+.blue.selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+.blue.selected:hover {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+a {\r
+       font-weight: bold;\r
+       text-decoration: none;\r
+}\r
+\r
+p {\r
+       color: #444;\r
+       font-size: 14px;\r
+       font-weight: normal;\r
+       line-height: 21px;\r
+       margin: 0 0 12px 0;\r
+}\r
+\r
+p.credit {\r
+       border-top: 1px solid #ccc;\r
+       font-size: 14px;\r
+       line-height: 140%;\r
+       margin: 36px 0 12px 0;\r
+       padding: 8px 0 0 0;\r
+       text-align: center;\r
+}\r
+\r
+ul.column {\r
+       float: left;\r
+       list-style: none;\r
+       width: 675px;\r
+}\r
+\r
+ul.column li {\r
+       background: #eee;\r
+       -webkit-border-radius: 5px;\r
+       border-radius: 5px;\r
+       -webkit-box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       float: left;\r
+       margin: 10px 0 0 10px;\r
+       display: block;\r
+       height: 150px;\r
+       text-align: center;\r
+       width: 215px;\r
+}\r
+\r
+/* Clear Floated Elements\r
+------------------------------------------------------------------------------*/\r
+.column:after,.button-collection:after,.clearfix:after,div.project-info:after\r
+       {\r
+       clear: both;\r
+       content: ' ';\r
+       display: block;\r
+       font-size: 0;\r
+       line-height: 0;\r
+       visibility: hidden;\r
+       width: 0;\r
+       height: 0;\r
+}\r
+\r
+.container-fluid {\r
+       background-color: white !important;\r
+       min-height: 500px;\r
+}\r
+\r
+.nav-tabs {\r
+       border: 0;\r
+}\r
+\r
+.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus\r
+       {\r
+       border: 0;\r
+       border-top: 3px solid #F3565D;\r
+}\r
+\r
+.nav-tabs>li>a {\r
+       border-radius: 0;\r
+}\r
+\r
+.nav-tabs>li>a:hover {\r
+       background-color: #f1f3fa;\r
+       border: 1Px solid #f1f3fa;\r
+}\r
+\r
+.c3 {\r
+       margin-top: 120px;\r
+}\r
+\r
+.skills-chart-breadcrumb {\r
+       \r
+}\r
+\r
+.blue:selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+}\r
+\r
+.btn {\r
+       /* border-width: 0; */\r
+       /* padding: 7px 14px; */\r
+       /* font-size: 14px; */\r
+       /* outline: none !important; */\r
+       /* background-image: none !important; */\r
+       /* filter: none; */\r
+       /* -webkit-box-shadow: none; */\r
+       -moz-box-shadow: none;\r
+       /* box-shadow: none; */\r
+       /* text-shadow: none; */\r
+}\r
+\r
+select {\r
+       border-width: 1px;\r
+       padding: 4px 1px;\r
+       border-radius: 4px;\r
+}\r
+\r
+.input-sm {\r
+       padding: 4px 10px;\r
+}\r
+\r
+.btn-block {\r
+       display: block;\r
+       width: 100%;\r
+       padding-left: 0;\r
+       padding-right: 0;\r
+}\r
+\r
+/* Bootstrap buttons */\r
+\r
+\r
+.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active\r
+       {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.btn-default:active,.btn-default.active {\r
+       background-image: none;\r
+       background-color: #e0e0e0;\r
+       font-weight: bold;\r
+}\r
+\r
+.btn-default:active:hover,.btn-default.active:hover {\r
+       background-color: #e6e6e6;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       background-image: none;\r
+}\r
+\r
+.btn-default.disabled,.btn-default.disabled:hover,.btn-default.disabled:focus,.btn-default.disabled:active,.btn-default.disabled.active,.btn-default[disabled],.btn-default[disabled]:hover,.btn-default[disabled]:focus,.btn-default[disabled]:active,.btn-default[disabled].active,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default:hover,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default.active\r
+       {\r
+       background-color: #fff;\r
+       border-color: #ccc;\r
+}\r
+\r
+.btn-default .badge {\r
+       color: #fff;\r
+       background-color: #333;\r
+}\r
+\r
+\r
+.btn-default>i[class^="icon-"],.btn-default>i[class*="icon-"] {\r
+       color: #8c8c8c;\r
+}\r
+\r
+div[data-name="tab_zone"] div {\r
+       background-color: #f1f3fa;\r
+       padding: 0px;\r
+}\r
+\r
+div[data-name="cond_zone"] div {\r
+       background-color: #fff;\r
+       margin-top: 15px;\r
+       margin-bottom: 15px;\r
+}\r
+\r
+\r
+\r
+\r
+.input{\r
+       width:250px;\r
+  height: 34px;\r
+  padding: 6px 12px;\r
+  font-size: 14px;\r
+  line-height: 1.42857143;\r
+  color: #555;\r
+  background-color: #fff;\r
+  background-image: none;\r
+  border: 1px solid #ccc;\r
+  border-radius: 4px;\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+}\r
+\r
+div.separator {\r
+       margin: 20px;\r
+}\r
+\r
+div.separator div {\r
+       text-align: center;\r
+       line-height: 0;\r
+}\r
+\r
+div.separator-line {\r
+       height: 1px !important;\r
+       width: 100%;\r
+       background: #ddd;\r
+       overflow: hidden;\r
+}\r
+\r
+.dropdown-toggle {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.calendar-date {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.range_inputs {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.btn.dropdown-toggle,.btn-group .btn.dropdown-toggle,.btn:hover,.btn:disabled,.btn[disabled],.btn:focus,.btn:active,.btn.active\r
+       {\r
+       outline: none !important;\r
+       background-image: none !important;\r
+       filter: none;\r
+       -webkit-box-shadow: none;\r
+       -moz-box-shadow: none;\r
+       box-shadow: none;\r
+       text-shadow: none;\r
+}\r
+\r
+#skills-chart-breadcrumb {\r
+       margin-bottom: 10px\r
+}\r
+\r
+/*增加daterangepicker的css*/\r
+input[name="daterange"] {\r
+       width: 220px;\r
+       line-height: 0;\r
+       height: 31px;\r
+       vertical-align: top;\r
+       margin-top: 2px;\r
+}\r
+\r
+.daterangepicker .ranges {\r
+       width: 205px;\r
+}\r
+\r
+.daterangepicker .ranges input {\r
+       width: 95px !important;\r
+}\r
+\r
+td.details-control {\r
+       background: url('../images/details_open.png') no-repeat center center;\r
+       cursor: pointer;\r
+}\r
+\r
+tr.shown td.details-control {\r
+       background: url('../images/details_close.png') no-repeat center center;\r
+}\r
+\r
+.details table td {\r
+       word-wrap: break-word;\r
+       word-break: normal;\r
+       border-top: 1px solid #dddddd;\r
+}\r
+\r
+.details table  tr:first-child td {\r
+       border-top: none;\r
+}\r
+\r
+.details table {\r
+       table-layout: fixed;\r
+       width: 100%;\r
+}\r
+\r
+td.title {\r
+       width: 10%;\r
+}\r
+\r
+table.dataTable tbody th,table.dataTable tbody td {\r
+       padding: 8px 10px;\r
+}\r
+\r
+div.dataTables_length,div.dataTables_info {\r
+       display: inline;\r
+}\r
+\r
+div.dataTables_paginate {\r
+       display: inline;\r
+       float: right;\r
+}\r
+\r
+div.pagination-panel {\r
+       margin-right: 10px;\r
+}\r
+\r
+input.pagination-panel-input {\r
+       width: 50px;\r
+}\r
+\r
+#ict_res_table_div {\r
+       margin-top: 15px;\r
+}\r
+\r
+#ict_res_table_div label {\r
+       font-weight: 100;\r
+}\r
+\r
+.daterangepicker .daterangepicker_start_input label,.daterangepicker .daterangepicker_end_input label\r
+       {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.daterangepicker .ranges .input-mini {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.cancelBtn {\r
+       padding: 5px 10px 5px 10px;\r
+}\r
+\r
+.btn:focus,.btn:active:focus,.btn.active:focus {\r
+       outline: 0;\r
+}\r
+\r
+#ict_res_table_div  table {\r
+       width: 100% !important;\r
+}\r
+\r
+.control-label .required {\r
+  color: #e02222;\r
+  font-size: 12px;\r
+  padding-left: 2px;\r
+}\r
+\r
+#ict_vim_table tbody tr{\r
+       cursor:pointer;\r
+}\r
+\r
+\r
+/*卡片面板样式*/\r
+.animated-panel {\r
+  -webkit-animation-duration: .5s;\r
+  animation-duration: .5s;\r
+  -webkit-animation-fill-mode: both;\r
+  animation-fill-mode: both;\r
+}\r
+\r
+.hpanel {\r
+  background-color: none;\r
+  border: none;\r
+  box-shadow: none;\r
+  margin-bottom: 25px;\r
+    \r
+}\r
+\r
+.hpanel .panel-body {\r
+  border: 1px solid #e4e5e7;\r
+  border-radius: 2px;\r
+  padding: 20px;\r
+  position: relative;\r
+}\r
+.h-200 {\r
+  min-height: 220px;\r
+}\r
+.m-t-xl {\r
+  margin-top: 40px;\r
+}\r
+.text-success {\r
+  color: #0d638f;\r
+}\r
+.hpanel > .panel-footer {\r
+  color: inherit;\r
+  border: 1px solid #e4e5e7;\r
+  border-top: none;\r
+  font-size: 90%;\r
+  background: #f7f9fa;\r
+  height:40px;\r
+  padding: 5px 15px;\r
+}\r
+.color_cloud{\r
+       color:#ccc;\r
+}\r
+.stats-title{\r
+\r
+}\r
+\r
+h3{\r
+  margin-top: 10px;\r
+  margin-bottom: 40px;\r
+  font-weight: 200;\r
+}\r
+\r
+.blue-font{\r
+       color:#428bca;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right a{\r
+       margin-left: 5px;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right .btn{\r
+    min-width: 30px !important;\r
+}\r
+\r
+.refresh-status-text{\r
+       float: right;\r
+}\r
+\r
+.font {\r
+  margin-bottom: 15px;\r
+}\r
+\r
+.hpanel_show{\r
+       cursor: pointer;\r
+       background-color: #f7f9fa;\r
+}\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vimChart.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/css/vimChart.css
new file mode 100644 (file)
index 0000000..842ff48
--- /dev/null
@@ -0,0 +1,54 @@
+body {\r
+  color: #333;\r
+  font-family: "Microsoft yahei", Verdana, Arial, Helvetica, sans-serif !important;\r
+  padding: 0px !important;\r
+  margin: 0px !important;\r
+  direction: ltr;\r
+  background-color: #f1f3fa !important; \r
+}\r
+\r
+.row{\r
+     margin-left: 0px; \r
+  margin-right: 0px; \r
+}\r
+\r
+select {\r
+  border-width: 1px;\r
+  padding: 4px 1px;\r
+  border-radius: 4px;\r
+}\r
+\r
+.container-fluid {\r
+  background-color: #fff;\r
+}\r
+\r
+\r
+.titlefont {\r
+  font-size: 16px;\r
+   margin-left: 10px;\r
+}\r
+\r
+.separator-line {\r
+    height: 1px;\r
+    width: 100%;\r
+    background: #ddd;\r
+    overflow: hidden;\r
+    margin-bottom: 15px;\r
+    margin-top: 6px;\r
+    opacity: 0.6;\r
+}\r
+\r
+.main {\r
+    height: 400px;\r
+    /* width: 778px !important; */\r
+    overflow: hidden;\r
+    padding: 10px;\r
+    margin-bottom: 10px;\r
+    border: 1px solid #e3e3e3;\r
+    -webkit-border-radius: 4px;\r
+    -moz-border-radius: 4px;\r
+    border-radius: 4px;\r
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/loadi18nApp.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/loadi18nApp.js
new file mode 100644 (file)
index 0000000..4f18870
--- /dev/null
@@ -0,0 +1,43 @@
+*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+function loadPropertiesSideMenu(lang, propertiesFileNamePrefix, propertiesFilePath){\r
+    jQuery.i18n.properties({\r
+        language:lang,\r
+        name:propertiesFileNamePrefix,\r
+        path:propertiesFilePath, // 资源文件路径\r
+        mode:'map', // 用 Map 的方式使用资源文件中的值\r
+        callback: function() {// 加载成功后设置显示内容\r
+            var i18nItems = $('[name_i18n=com_zte_conductor_ui_i18n]');\r
+            for(var i=0;i<i18nItems.length;i++){\r
+                var $item = $(i18nItems.eq(i));\r
+                var itemId = $item.attr('id_i18n');\r
+                var itemTitle = $item.attr('title');\r
+                /** id存在时元素内容需要国际化,title存在时元素title需要国际化 */\r
+                if(typeof($item.attr("title")) == "string"){\r
+                    $item.attr("title", ($.i18n.prop(itemTitle)));\r
+                }\r
+                if(undefined != itemId && typeof($item.attr("placeholder"))=="undefined"){\r
+                    $item.text($.i18n.prop(itemId));\r
+                }else if(undefined != itemId && typeof($item.attr("placeholder"))!="undefined"){\r
+                    $item.attr("placeholder", $.i18n.prop(itemId));\r
+                }\r
+            }\r
+        }\r
+    });\r
+}\r
+var lang = getLanguage();\r
+loadPropertiesSideMenu(lang, 'roc-vim-iui-i18n', 'i18n/');\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-en-US.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-en-US.properties
new file mode 100644 (file)
index 0000000..35cdb63
--- /dev/null
@@ -0,0 +1,92 @@
+#\r
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+#\r
+# Licensed under the Apache License, Version 2.0 (the "License");\r
+# you may not use this file except in compliance with the License.\r
+# You may obtain a copy of the License at\r
+#\r
+#         http://www.apache.org/licenses/LICENSE-2.0\r
+#\r
+# Unless required by applicable law or agreed to in writing, software\r
+# distributed under the License is distributed on an "AS IS" BASIS,\r
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+# See the License for the specific language governing permissions and\r
+# limitations under the License.\r
+#\r
+\r
+############## vimView.html i18n ##############\r
+com_zte_ums_eco_roc_vim_checking_status=Checking vim status...\r
+com_zte_ums_eco_roc_vim_name=Display name\r
+com_zte_ums_eco_roc_vim_auth_url=Auth URL\r
+com_zte_ums_eco_roc_vim_username=Username\r
+com_zte_ums_eco_roc_vim_password=Password\r
+com_zte_ums_eco_roc_vim_tenant=Tenant\r
+com_zte_ums_eco_roc_vim_vendor=Vendor\r
+com_zte_ums_eco_roc_vim_type=Type\r
+com_zte_ums_eco_roc_vim_version=Version\r
+com_zte_ums_eco_roc_vim_cancel=Cancel\r
+com_zte_ums_eco_roc_vim_save=Save\r
+com_zte_ums_eco_roc_vim_status_update_time=Status update time:\r
+com_zte_ums_eco_roc_vim_register=Register\r
+com_zte_ums_eco_roc_vim_normal=Normal\r
+com_zte_ums_eco_roc_vim_abnormal=Abnormal\r
+com_zte_ums_eco_roc_vim_display_type=Type:\r
+com_zte_ums_eco_roc_vim_total=Total\r
+com_zte_ums_eco_roc_vim_metric=vims\r
+com_zte_ums_eco_roc_vim_register_info=Register\r
+com_zte_ums_eco_roc_vim_modify_info=Modify\r
+com_zte_ums_eco_roc_vim_domain=domain \r
+com_zte_ums_eco_roc_vim_description=description  \r
+############## js  ######################\r
+com_zte_ums_eco_roc_vim_auth_url_require_message=please input auth url\r
+com_zte_ums_eco_roc_vim_auth_url_alarm_message=example: http://xx.xx.xx.xx:5000/v2.0\r
+com_zte_ums_eco_roc_vim_name_alarm_message=please input vim name\r
+com_zte_ums_eco_roc_vim_username_alarm_message=please input username\r
+com_zte_ums_eco_roc_vim_password_alarm_message=please input password\r
+com_zte_ums_eco_roc_vim_tenant_alarm_message=please input tenant\r
+com_zte_ums_eco_roc_vim_version_alarm_message=please input version\r
+com_zte_ums_eco_roc_vim_vendor_alarm_message=please input vendor\r
+com_zte_ums_eco_roc_vim_getting_info=getting info...\r
+com_zte_ums_eco_roc_vim_dealing_info=dealing\r
+com_zte_ums_eco_roc_vim_confirm_delete_vim_record=Do you want to delete this instance?\r
+com_zte_ums_eco_roc_vim_vdu_isExists=This VIM's VUDs are used, you can't remove it.\r
+com_zte_ums_eco_roc_vim_growl_msg_query_vdu_failed=query VDU failed\r
+\r
+com_zte_ums_eco_roc_vim_growl_msg_title=vim info\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_success=delete success\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_failed=delete failed\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_server_success=delete server success:\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_server_failed=delete server falied:\r
+com_zte_ums_eco_roc_vim_growl_msg_query_failed=query faile\r
+\r
+com_zte_ums_eco_roc_vim_growl_msg_save_success=save success\r
+com_zte_ums_eco_roc_vim_growl_msg_save_failed=save failed\r
+com_zte_ums_eco_roc_vim_growl_msg_add_server_success=add server success, access port:\r
+com_zte_ums_eco_roc_vim_growl_msg_add_server_failed=add server falied:\r
+\r
+\r
+############## vimChart.html i18n ##############\r
+\r
+com_zte_ums_eco_roc_vim_resource_use=-resource using status\r
+com_zte_ums_eco_roc_vim_resource_vim_use=virtual machine manager resource using status\r
+com_zte_ums_eco_roc_vim_resource_tenant_use=-tenant quota using status\r
+\r
+com_zte_ums_eco_roc_vim_resource_chart_used=used:\r
+com_zte_ums_eco_roc_vim_resource_chart_total=total:\r
+com_zte_ums_eco_roc_vim_resource_chart_return=return\r
+com_zte_ums_eco_roc_vim_resource_chart_save_picture=save picture as\r
+com_zte_ums_eco_roc_vim_resource_chart_click_save=click save\r
+\r
+com_zte_ums_eco_roc_vim_resource_vim_cpu=CPU\r
+com_zte_ums_eco_roc_vim_resource_vim_memory=Memory\r
+com_zte_ums_eco_roc_vim_resource_vim_disk=Disk\r
+\r
+com_zte_ums_eco_roc_vim_resource_tenant_cpu=CPU\r
+com_zte_ums_eco_roc_vim_resource_tenant_memoryMb=Memory\r
+com_zte_ums_eco_roc_vim_resource_tenant_instances=Instances\r
+com_zte_ums_eco_roc_vim_resource_tenant_floatingIps=FloatingIps\r
+com_zte_ums_eco_roc_vim_resource_tenant_securityGroups=securityGroup\r
+com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage=volumeStorage\r
+com_zte_ums_eco_roc_vim_resource_tenant_volumes=Volumes\r
+\r
+com_zte_ums_eco_roc_vim_title_notice=Notice:\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-zh-CN.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/i18n/roc-vim-iui-i18n-zh-CN.properties
new file mode 100644 (file)
index 0000000..eeba672
--- /dev/null
@@ -0,0 +1,94 @@
+#\r
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+#\r
+# Licensed under the Apache License, Version 2.0 (the "License");\r
+# you may not use this file except in compliance with the License.\r
+# You may obtain a copy of the License at\r
+#\r
+#         http://www.apache.org/licenses/LICENSE-2.0\r
+#\r
+# Unless required by applicable law or agreed to in writing, software\r
+# distributed under the License is distributed on an "AS IS" BASIS,\r
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+# See the License for the specific language governing permissions and\r
+# limitations under the License.\r
+#\r
+\r
+############## vimView.html i18n ##############\r
+com_zte_ums_eco_roc_vim_checking_status=vim连接状态检查中...\r
+com_zte_ums_eco_roc_vim_name=名称\r
+com_zte_ums_eco_roc_vim_auth_url=接入URL\r
+com_zte_ums_eco_roc_vim_username=用户名\r
+com_zte_ums_eco_roc_vim_password=密码\r
+com_zte_ums_eco_roc_vim_tenant=租户\r
+com_zte_ums_eco_roc_vim_vendor=厂商\r
+com_zte_ums_eco_roc_vim_type=类型\r
+com_zte_ums_eco_roc_vim_version=版本\r
+com_zte_ums_eco_roc_vim_cancel=取消\r
+com_zte_ums_eco_roc_vim_save=保存\r
+com_zte_ums_eco_roc_vim_status_update_time=状态更新时间:\r
+com_zte_ums_eco_roc_vim_register=注册VIM\r
+com_zte_ums_eco_roc_vim_normal=正常\r
+com_zte_ums_eco_roc_vim_abnormal=报警\r
+com_zte_ums_eco_roc_vim_display_type=类型:\r
+com_zte_ums_eco_roc_vim_total=共\r
+com_zte_ums_eco_roc_vim_metric=个vim\r
+com_zte_ums_eco_roc_vim_register_info=注册vim信息\r
+com_zte_ums_eco_roc_vim_modify_info=修改vim信息\r
+com_zte_ums_eco_roc_vim_domain=域信息 \r
+com_zte_ums_eco_roc_vim_description=描述\r
+############## js  ######################\r
+com_zte_ums_eco_roc_vim_auth_url_require_message=请输入url\r
+com_zte_ums_eco_roc_vim_auth_url_alarm_message=url格式有误(参考:http://xx.xx.xx.xx:5000/v2.0)\r
+com_zte_ums_eco_roc_vim_name_alarm_message=请输入名称\r
+com_zte_ums_eco_roc_vim_username_alarm_message=请输入用户名\r
+com_zte_ums_eco_roc_vim_password_alarm_message=请输入密码\r
+com_zte_ums_eco_roc_vim_tenant_alarm_message=请输入租户\r
+com_zte_ums_eco_roc_vim_version_alarm_message=请输入版本号\r
+com_zte_ums_eco_roc_vim_vendor_alarm_message=请输入厂商\r
+\r
+com_zte_ums_eco_roc_vim_getting_info=获取中...\r
+com_zte_ums_eco_roc_vim_dealing_info=处理中...\r
+\r
+com_zte_ums_eco_roc_vim_confirm_delete_vim_record=确定删除所选vim信息?\r
+com_zte_ums_eco_roc_vim_vdu_isExists=业务编排仍在使用此VIM上的VDU,不能删除它\r
+com_zte_ums_eco_roc_vim_growl_msg_query_vdu_failed=查询VDU失败\r
+\r
+\r
+com_zte_ums_eco_roc_vim_growl_msg_title=vim信息\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_success=删除成功\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_failed=删除失败\r
+com_zte_ums_eco_roc_vim_growl_msg_save_success=保存成功\r
+com_zte_ums_eco_roc_vim_growl_msg_save_failed=保存失败\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_server_success=删除Server成功:\r
+com_zte_ums_eco_roc_vim_growl_msg_remove_server_failed=删除Server失败:\r
+com_zte_ums_eco_roc_vim_growl_msg_query_failed=查询失败\r
+com_zte_ums_eco_roc_vim_growl_msg_add_server_success=增加Server成功,端口号:\r
+com_zte_ums_eco_roc_vim_growl_msg_add_server_failed=增加Server失败:\r
+\r
+\r
+############## vimChart.html i18n ##############\r
+\r
+com_zte_ums_eco_roc_vim_resource_use=-资源使用情况\r
+com_zte_ums_eco_roc_vim_resource_vim_use=虚拟机管理器资源使用情况\r
+com_zte_ums_eco_roc_vim_resource_tenant_use=-租户配额使用情况\r
+\r
+com_zte_ums_eco_roc_vim_resource_chart_used=已用:\r
+com_zte_ums_eco_roc_vim_resource_chart_total=总共:\r
+com_zte_ums_eco_roc_vim_resource_chart_return=返回\r
+com_zte_ums_eco_roc_vim_resource_chart_save_picture=保存为图片\r
+com_zte_ums_eco_roc_vim_resource_chart_click_save=点击保存\r
+\r
+com_zte_ums_eco_roc_vim_resource_vim_cpu=虚拟内核\r
+com_zte_ums_eco_roc_vim_resource_vim_memory=内存\r
+com_zte_ums_eco_roc_vim_resource_vim_disk=磁盘\r
+\r
+com_zte_ums_eco_roc_vim_resource_tenant_cpu=虚拟内核\r
+com_zte_ums_eco_roc_vim_resource_tenant_memoryMb=内存\r
+com_zte_ums_eco_roc_vim_resource_tenant_instances=实例\r
+com_zte_ums_eco_roc_vim_resource_tenant_floatingIps=浮动IP\r
+com_zte_ums_eco_roc_vim_resource_tenant_securityGroups=安全组\r
+com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage=卷存储\r
+com_zte_ums_eco_roc_vim_resource_tenant_volumes=云硬盘\r
+\r
+com_zte_ums_eco_roc_vim_title_notice=提示:
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/client-cometd.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/client-cometd.js
new file mode 100644 (file)
index 0000000..660cd6f
--- /dev/null
@@ -0,0 +1,63 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+/**\r
+ * Created by 10184303 on 15-11-17.\r
+ */\r
+       \r
+$(function(){\r
+    var registerCometdMessage = function(url, callback) {\r
+        var cometd = new $.Cometd(); \r
+        var cometdURL = location.protocol + "//" + location.host + "/api/nsocnotification/v1";\r
+        cometd.configure({\r
+            url : cometdURL,\r
+            logLevel : "debug"\r
+        });\r
+\r
+        cometd.addListener("/meta/handshake", function(handshake){\r
+            if(handshake.successful === true) {\r
+                cometd.batch(function(){\r
+                    cometd.subscribe(url, function(message){\r
+                        callback.call(this, message.data);\r
+                    });\r
+                });\r
+            }\r
+        });\r
+        cometd.handshake();\r
+}\r
+    registerCometdMessage("/VIMstatus", function(data){\r
+                    var alarmArray= JSON.parse(data.greeting);\r
+                    console.log(data.greeting);\r
+                    for(var i=0;i<alarmArray.length;i++){\r
+                                               vm.vimStatusTime = alarmArray[i].checkTime;\r
+                        for(var n=0;n<vm.vimInfo.length;n++){\r
+                            if(alarmArray[i].id==vm.vimInfo[n].oid && alarmArray[i].hostStorageInfo == ""){\r
+                                vm.vimInfo[n].status=alarmArray[i].status;\r
+                                vm.vimInfo[n].errorInfo=alarmArray[i].alarmContent;\r
+                                break;\r
+                            } \r
+                                                       if(alarmArray[i].id==vm.vimInfo[n].oid && alarmArray[i].hostStorageInfo.length != ""){\r
+                                                               vm.vimInfo[n].status= "inactive";\r
+                                vm.vimInfo[n].errorInfo = alarmArray[i].hostStorageInfo;\r
+                                break;\r
+                                                       }\r
+\r
+                        }\r
+                    }\r
+\r
+                    setTimeout('resUtil.tooltipVimStatus()',5000);\r
+     });\r
+});\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js
new file mode 100644 (file)
index 0000000..e590a09
--- /dev/null
@@ -0,0 +1,927 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+/* jqBootstrapValidation\r
+ * A plugin for automating validation on Twitter Bootstrap formatted forms.\r
+ *\r
+ * v1.3.6\r
+ *\r
+ * License: MIT <http://opensource.org/licenses/mit-license.php> - see LICENSE file\r
+ *\r
+ * http://ReactiveRaven.github.com/jqBootstrapValidation/\r
+ */\r
+\r
+(function( $ ){\r
+\r
+       var createdElements = [];\r
+\r
+       var defaults = {\r
+               options: {\r
+                       prependExistingHelpBlock: false,\r
+                       sniffHtml: true, // sniff for 'required', 'maxlength', etc\r
+                       preventSubmit: true, // stop the form submit event from firing if validation fails\r
+                       submitError: false, // function called if there is an error when trying to submit\r
+                       submitSuccess: false, // function called just before a successful submit event is sent to the server\r
+            semanticallyStrict: false, // set to true to tidy up generated HTML output\r
+                       autoAdd: {\r
+                               helpBlocks: true\r
+                       },\r
+            filter: function () {\r
+                // return $(this).is(":visible"); // only validate elements you can see\r
+                return true; // validate everything\r
+            }\r
+               },\r
+    methods: {\r
+      init : function( options ) {\r
+\r
+        var settings = $.extend(true, {}, defaults);\r
+\r
+        settings.options = $.extend(true, settings.options, options);\r
+\r
+        var $siblingElements = this;\r
+\r
+        var uniqueForms = $.unique(\r
+          $siblingElements.map( function () {\r
+            return $(this).parents("form")[0];\r
+          }).toArray()\r
+        );\r
+\r
+        $(uniqueForms).bind("submit", function (e) {\r
+          var $form = $(this);\r
+          var warningsFound = 0;\r
+          var $inputs = $form.find("input,textarea,select").not("[type=submit],[type=image]").filter(settings.options.filter);\r
+          $inputs.trigger("submit.validation").trigger("validationLostFocus.validation");\r
+\r
+          $inputs.each(function (i, el) {\r
+            var $this = $(el),\r
+              $controlGroup = $this.parents(".control-group").first();\r
+            if (\r
+              $controlGroup.hasClass("warning")\r
+            ) {\r
+              $controlGroup.removeClass("warning").addClass("error");\r
+              warningsFound++;\r
+            }\r
+          });\r
+\r
+          $inputs.trigger("validationLostFocus.validation");\r
+\r
+          if (warningsFound) {\r
+            if (settings.options.preventSubmit) {\r
+              e.preventDefault();\r
+            }\r
+            $form.addClass("error");\r
+            if ($.isFunction(settings.options.submitError)) {\r
+              settings.options.submitError($form, e, $inputs.jqBootstrapValidation("collectErrors", true));\r
+            }\r
+          } else {\r
+            $form.removeClass("error");\r
+            if ($.isFunction(settings.options.submitSuccess)) {\r
+              settings.options.submitSuccess($form, e);\r
+            }\r
+          }\r
+        });\r
+\r
+        return this.each(function(){\r
+\r
+          // Get references to everything we're interested in\r
+          var $this = $(this),\r
+            $controlGroup = $this.parents(".control-group").first(),\r
+            $helpBlock = $controlGroup.find(".help-block").first(),\r
+            $form = $this.parents("form").first(),\r
+            validatorNames = [];\r
+\r
+          // create message container if not exists\r
+          if (!$helpBlock.length && settings.options.autoAdd && settings.options.autoAdd.helpBlocks) {\r
+              $helpBlock = $('<div class="help-block" />');\r
+              $controlGroup.find('.controls').append($helpBlock);\r
+                                                       createdElements.push($helpBlock[0]);\r
+          }\r
+\r
+          // =============================================================\r
+          //                                     SNIFF HTML FOR VALIDATORS\r
+          // =============================================================\r
+\r
+          // *snort sniff snuffle*\r
+\r
+          if (settings.options.sniffHtml) {\r
+            var message = "";\r
+            // ---------------------------------------------------------\r
+            //                                                   PATTERN\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("pattern") !== undefined) {\r
+              message = "Not in the expected format<!-- data-validation-pattern-message to override -->";\r
+              if ($this.data("validationPatternMessage")) {\r
+                message = $this.data("validationPatternMessage");\r
+              }\r
+              $this.data("validationPatternMessage", message);\r
+              $this.data("validationPatternRegex", $this.attr("pattern"));\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                       MAX\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("max") !== undefined || $this.attr("aria-valuemax") !== undefined) {\r
+              var max = ($this.attr("max") !== undefined ? $this.attr("max") : $this.attr("aria-valuemax"));\r
+              message = "Too high: Maximum of '" + max + "'<!-- data-validation-max-message to override -->";\r
+              if ($this.data("validationMaxMessage")) {\r
+                message = $this.data("validationMaxMessage");\r
+              }\r
+              $this.data("validationMaxMessage", message);\r
+              $this.data("validationMaxMax", max);\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                       MIN\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("min") !== undefined || $this.attr("aria-valuemin") !== undefined) {\r
+              var min = ($this.attr("min") !== undefined ? $this.attr("min") : $this.attr("aria-valuemin"));\r
+              message = "Too low: Minimum of '" + min + "'<!-- data-validation-min-message to override -->";\r
+              if ($this.data("validationMinMessage")) {\r
+                message = $this.data("validationMinMessage");\r
+              }\r
+              $this.data("validationMinMessage", message);\r
+              $this.data("validationMinMin", min);\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                 MAXLENGTH\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("maxlength") !== undefined) {\r
+              message = "Too long: Maximum of '" + $this.attr("maxlength") + "' characters<!-- data-validation-maxlength-message to override -->";\r
+              if ($this.data("validationMaxlengthMessage")) {\r
+                message = $this.data("validationMaxlengthMessage");\r
+              }\r
+              $this.data("validationMaxlengthMessage", message);\r
+              $this.data("validationMaxlengthMaxlength", $this.attr("maxlength"));\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                 MINLENGTH\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("minlength") !== undefined) {\r
+              message = "Too short: Minimum of '" + $this.attr("minlength") + "' characters<!-- data-validation-minlength-message to override -->";\r
+              if ($this.data("validationMinlengthMessage")) {\r
+                message = $this.data("validationMinlengthMessage");\r
+              }\r
+              $this.data("validationMinlengthMessage", message);\r
+              $this.data("validationMinlengthMinlength", $this.attr("minlength"));\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                  REQUIRED\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("required") !== undefined || $this.attr("aria-required") !== undefined) {\r
+              message = settings.builtInValidators.required.message;\r
+              if ($this.data("validationRequiredMessage")) {\r
+                message = $this.data("validationRequiredMessage");\r
+              }\r
+              $this.data("validationRequiredMessage", message);\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                    NUMBER\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "number") {\r
+              message = settings.builtInValidators.number.message;\r
+              if ($this.data("validationNumberMessage")) {\r
+                message = $this.data("validationNumberMessage");\r
+              }\r
+              $this.data("validationNumberMessage", message);\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                     EMAIL\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "email") {\r
+              message = "Not a valid email address<!-- data-validator-validemail-message to override -->";\r
+              if ($this.data("validationValidemailMessage")) {\r
+                message = $this.data("validationValidemailMessage");\r
+              } else if ($this.data("validationEmailMessage")) {\r
+                message = $this.data("validationEmailMessage");\r
+              }\r
+              $this.data("validationValidemailMessage", message);\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                MINCHECKED\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("minchecked") !== undefined) {\r
+              message = "Not enough options checked; Minimum of '" + $this.attr("minchecked") + "' required<!-- data-validation-minchecked-message to override -->";\r
+              if ($this.data("validationMincheckedMessage")) {\r
+                message = $this.data("validationMincheckedMessage");\r
+              }\r
+              $this.data("validationMincheckedMessage", message);\r
+              $this.data("validationMincheckedMinchecked", $this.attr("minchecked"));\r
+            }\r
+            // ---------------------------------------------------------\r
+            //                                                MAXCHECKED\r
+            // ---------------------------------------------------------\r
+            if ($this.attr("maxchecked") !== undefined) {\r
+              message = "Too many options checked; Maximum of '" + $this.attr("maxchecked") + "' required<!-- data-validation-maxchecked-message to override -->";\r
+              if ($this.data("validationMaxcheckedMessage")) {\r
+                message = $this.data("validationMaxcheckedMessage");\r
+              }\r
+              $this.data("validationMaxcheckedMessage", message);\r
+              $this.data("validationMaxcheckedMaxchecked", $this.attr("maxchecked"));\r
+            }\r
+          }\r
+\r
+          // =============================================================\r
+          //                                       COLLECT VALIDATOR NAMES\r
+          // =============================================================\r
+\r
+          // Get named validators\r
+          if ($this.data("validation") !== undefined) {\r
+            validatorNames = $this.data("validation").split(",");\r
+          }\r
+\r
+          // Get extra ones defined on the element's data attributes\r
+          $.each($this.data(), function (i, el) {\r
+            var parts = i.replace(/([A-Z])/g, ",$1").split(",");\r
+            if (parts[0] === "validation" && parts[1]) {\r
+              validatorNames.push(parts[1]);\r
+            }\r
+          });\r
+\r
+          // =============================================================\r
+          //                                     NORMALISE VALIDATOR NAMES\r
+          // =============================================================\r
+\r
+          var validatorNamesToInspect = validatorNames;\r
+          var newValidatorNamesToInspect = [];\r
+\r
+          do // repeatedly expand 'shortcut' validators into their real validators\r
+          {\r
+            // Uppercase only the first letter of each name\r
+            $.each(validatorNames, function (i, el) {\r
+              validatorNames[i] = formatValidatorName(el);\r
+            });\r
+\r
+            // Remove duplicate validator names\r
+            validatorNames = $.unique(validatorNames);\r
+\r
+            // Pull out the new validator names from each shortcut\r
+            newValidatorNamesToInspect = [];\r
+            $.each(validatorNamesToInspect, function(i, el) {\r
+              if ($this.data("validation" + el + "Shortcut") !== undefined) {\r
+                // Are these custom validators?\r
+                // Pull them out!\r
+                $.each($this.data("validation" + el + "Shortcut").split(","), function(i2, el2) {\r
+                  newValidatorNamesToInspect.push(el2);\r
+                });\r
+              } else if (settings.builtInValidators[el.toLowerCase()]) {\r
+                // Is this a recognised built-in?\r
+                // Pull it out!\r
+                var validator = settings.builtInValidators[el.toLowerCase()];\r
+                if (validator.type.toLowerCase() === "shortcut") {\r
+                  $.each(validator.shortcut.split(","), function (i, el) {\r
+                    el = formatValidatorName(el);\r
+                    newValidatorNamesToInspect.push(el);\r
+                    validatorNames.push(el);\r
+                  });\r
+                }\r
+              }\r
+            });\r
+\r
+            validatorNamesToInspect = newValidatorNamesToInspect;\r
+\r
+          } while (validatorNamesToInspect.length > 0)\r
+\r
+          // =============================================================\r
+          //                                       SET UP VALIDATOR ARRAYS\r
+          // =============================================================\r
+\r
+          var validators = {};\r
+\r
+          $.each(validatorNames, function (i, el) {\r
+            // Set up the 'override' message\r
+            var message = $this.data("validation" + el + "Message");\r
+            var hasOverrideMessage = (message !== undefined);\r
+            var foundValidator = false;\r
+            message =\r
+              (\r
+                message\r
+                  ? message\r
+                  : "'" + el + "' validation failed <!-- Add attribute 'data-validation-" + el.toLowerCase() + "-message' to input to change this message -->"\r
+              )\r
+            ;\r
+\r
+            $.each(\r
+              settings.validatorTypes,\r
+              function (validatorType, validatorTemplate) {\r
+                if (validators[validatorType] === undefined) {\r
+                  validators[validatorType] = [];\r
+                }\r
+                if (!foundValidator && $this.data("validation" + el + formatValidatorName(validatorTemplate.name)) !== undefined) {\r
+                  validators[validatorType].push(\r
+                    $.extend(\r
+                      true,\r
+                      {\r
+                        name: formatValidatorName(validatorTemplate.name),\r
+                        message: message\r
+                      },\r
+                      validatorTemplate.init($this, el)\r
+                    )\r
+                  );\r
+                  foundValidator = true;\r
+                }\r
+              }\r
+            );\r
+\r
+            if (!foundValidator && settings.builtInValidators[el.toLowerCase()]) {\r
+\r
+              var validator = $.extend(true, {}, settings.builtInValidators[el.toLowerCase()]);\r
+              if (hasOverrideMessage) {\r
+                validator.message = message;\r
+              }\r
+              var validatorType = validator.type.toLowerCase();\r
+\r
+              if (validatorType === "shortcut") {\r
+                foundValidator = true;\r
+              } else {\r
+                $.each(\r
+                  settings.validatorTypes,\r
+                  function (validatorTemplateType, validatorTemplate) {\r
+                    if (validators[validatorTemplateType] === undefined) {\r
+                      validators[validatorTemplateType] = [];\r
+                    }\r
+                    if (!foundValidator && validatorType === validatorTemplateType.toLowerCase()) {\r
+                      $this.data("validation" + el + formatValidatorName(validatorTemplate.name), validator[validatorTemplate.name.toLowerCase()]);\r
+                      validators[validatorType].push(\r
+                        $.extend(\r
+                          validator,\r
+                          validatorTemplate.init($this, el)\r
+                        )\r
+                      );\r
+                      foundValidator = true;\r
+                    }\r
+                  }\r
+                );\r
+              }\r
+            }\r
+\r
+            if (! foundValidator) {\r
+              $.error("Cannot find validation info for '" + el + "'");\r
+            }\r
+          });\r
+\r
+          // =============================================================\r
+          //                                         STORE FALLBACK VALUES\r
+          // =============================================================\r
+\r
+          $helpBlock.data(\r
+            "original-contents",\r
+            (\r
+              $helpBlock.data("original-contents")\r
+                ? $helpBlock.data("original-contents")\r
+                : $helpBlock.html()\r
+            )\r
+          );\r
+\r
+          $helpBlock.data(\r
+            "original-role",\r
+            (\r
+              $helpBlock.data("original-role")\r
+                ? $helpBlock.data("original-role")\r
+                : $helpBlock.attr("role")\r
+            )\r
+          );\r
+\r
+          $controlGroup.data(\r
+            "original-classes",\r
+            (\r
+              $controlGroup.data("original-clases")\r
+                ? $controlGroup.data("original-classes")\r
+                : $controlGroup.attr("class")\r
+            )\r
+          );\r
+\r
+          $this.data(\r
+            "original-aria-invalid",\r
+            (\r
+              $this.data("original-aria-invalid")\r
+                ? $this.data("original-aria-invalid")\r
+                : $this.attr("aria-invalid")\r
+            )\r
+          );\r
+\r
+          // =============================================================\r
+          //                                                    VALIDATION\r
+          // =============================================================\r
+\r
+          $this.bind(\r
+            "validation.validation",\r
+            function (event, params) {\r
+\r
+              var value = getValue($this);\r
+\r
+              // Get a list of the errors to apply\r
+              var errorsFound = [];\r
+\r
+              $.each(validators, function (validatorType, validatorTypeArray) {\r
+                if (value || value.length || (params && params.includeEmpty) || (!!settings.validatorTypes[validatorType].blockSubmit && params && !!params.submitting)) {\r
+                  $.each(validatorTypeArray, function (i, validator) {\r
+                    if (settings.validatorTypes[validatorType].validate($this, value, validator)) {\r
+                      errorsFound.push(validator.message);\r
+                    }\r
+                  });\r
+                }\r
+              });\r
+\r
+              return errorsFound;\r
+            }\r
+          );\r
+\r
+          $this.bind(\r
+            "getValidators.validation",\r
+            function () {\r
+              return validators;\r
+            }\r
+          );\r
+\r
+          // =============================================================\r
+          //                                             WATCH FOR CHANGES\r
+          // =============================================================\r
+          $this.bind(\r
+            "submit.validation",\r
+            function () {\r
+              return $this.triggerHandler("change.validation", {submitting: true});\r
+            }\r
+          );\r
+          $this.bind(\r
+            [\r
+              "keyup",\r
+              "focus",\r
+              "blur",\r
+              "click",\r
+              "keydown",\r
+              "keypress",\r
+              "change"\r
+            ].join(".validation ") + ".validation",\r
+            function (e, params) {\r
+\r
+              var value = getValue($this);\r
+\r
+              var errorsFound = [];\r
+\r
+              $controlGroup.find("input,textarea,select").each(function (i, el) {\r
+                var oldCount = errorsFound.length;\r
+                $.each($(el).triggerHandler("validation.validation", params), function (j, message) {\r
+                  errorsFound.push(message);\r
+                });\r
+                if (errorsFound.length > oldCount) {\r
+                  $(el).attr("aria-invalid", "true");\r
+                } else {\r
+                  var original = $this.data("original-aria-invalid");\r
+                  $(el).attr("aria-invalid", (original !== undefined ? original : false));\r
+                }\r
+              });\r
+\r
+              $form.find("input,select,textarea").not($this).not("[name=\"" + $this.attr("name") + "\"]").trigger("validationLostFocus.validation");\r
+\r
+              errorsFound = $.unique(errorsFound.sort());\r
+\r
+              // Were there any errors?\r
+              if (errorsFound.length) {\r
+                // Better flag it up as a warning.\r
+                $controlGroup.removeClass("success error").addClass("warning");\r
+\r
+                // How many errors did we find?\r
+                if (settings.options.semanticallyStrict && errorsFound.length === 1) {\r
+                  // Only one? Being strict? Just output it.\r
+                  $helpBlock.html(errorsFound[0] + \r
+                    ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));\r
+                } else {\r
+                  // Multiple? Being sloppy? Glue them together into an UL.\r
+                  $helpBlock.html("<ul role=\"alert\"><li>" + errorsFound.join("</li><li>") + "</li></ul>" +\r
+                    ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));\r
+                }\r
+              } else {\r
+                $controlGroup.removeClass("warning error success");\r
+                if (value.length > 0) {\r
+                  $controlGroup.addClass("success");\r
+                }\r
+                $helpBlock.html($helpBlock.data("original-contents"));\r
+              }\r
+\r
+              if (e.type === "blur") {\r
+                $controlGroup.removeClass("success");\r
+              }\r
+            }\r
+          );\r
+          $this.bind("validationLostFocus.validation", function () {\r
+            $controlGroup.removeClass("success");\r
+          });\r
+        });\r
+      },\r
+      destroy : function( ) {\r
+\r
+        return this.each(\r
+          function() {\r
+\r
+            var\r
+              $this = $(this),\r
+              $controlGroup = $this.parents(".control-group").first(),\r
+              $helpBlock = $controlGroup.find(".help-block").first();\r
+\r
+            // remove our events\r
+            $this.unbind('.validation'); // events are namespaced.\r
+            // reset help text\r
+            $helpBlock.html($helpBlock.data("original-contents"));\r
+            // reset classes\r
+            $controlGroup.attr("class", $controlGroup.data("original-classes"));\r
+            // reset aria\r
+            $this.attr("aria-invalid", $this.data("original-aria-invalid"));\r
+            // reset role\r
+            $helpBlock.attr("role", $this.data("original-role"));\r
+                                               // remove all elements we created\r
+                                               if (createdElements.indexOf($helpBlock[0]) > -1) {\r
+                                                       $helpBlock.remove();\r
+                                               }\r
+\r
+          }\r
+        );\r
+\r
+      },\r
+      collectErrors : function(includeEmpty) {\r
+\r
+        var errorMessages = {};\r
+        this.each(function (i, el) {\r
+          var $el = $(el);\r
+          var name = $el.attr("name");\r
+          var errors = $el.triggerHandler("validation.validation", {includeEmpty: true});\r
+          errorMessages[name] = $.extend(true, errors, errorMessages[name]);\r
+        });\r
+\r
+        $.each(errorMessages, function (i, el) {\r
+          if (el.length === 0) {\r
+            delete errorMessages[i];\r
+          }\r
+        });\r
+\r
+        return errorMessages;\r
+\r
+      },\r
+      hasErrors: function() {\r
+\r
+        var errorMessages = [];\r
+\r
+        this.each(function (i, el) {\r
+          errorMessages = errorMessages.concat(\r
+            $(el).triggerHandler("getValidators.validation") ? $(el).triggerHandler("validation.validation", {submitting: true}) : []\r
+          );\r
+        });\r
+\r
+        return (errorMessages.length > 0);\r
+      },\r
+      override : function (newDefaults) {\r
+        defaults = $.extend(true, defaults, newDefaults);\r
+      }\r
+    },\r
+               validatorTypes: {\r
+      callback: {\r
+        name: "callback",\r
+        init: function ($this, name) {\r
+          return {\r
+            validatorName: name,\r
+            callback: $this.data("validation" + name + "Callback"),\r
+            lastValue: $this.val(),\r
+            lastValid: true,\r
+            lastFinished: true\r
+          };\r
+        },\r
+        validate: function ($this, value, validator) {\r
+          if (validator.lastValue === value && validator.lastFinished) {\r
+            return !validator.lastValid;\r
+          }\r
+\r
+          if (validator.lastFinished === true)\r
+          {\r
+            validator.lastValue = value;\r
+            validator.lastValid = true;\r
+            validator.lastFinished = false;\r
+\r
+            var rrjqbvValidator = validator;\r
+            var rrjqbvThis = $this;\r
+            executeFunctionByName(\r
+              validator.callback,\r
+              window,\r
+              $this,\r
+              value,\r
+              function (data) {\r
+                if (rrjqbvValidator.lastValue === data.value) {\r
+                  rrjqbvValidator.lastValid = data.valid;\r
+                  if (data.message) {\r
+                    rrjqbvValidator.message = data.message;\r
+                  }\r
+                  rrjqbvValidator.lastFinished = true;\r
+                  rrjqbvThis.data("validation" + rrjqbvValidator.validatorName + "Message", rrjqbvValidator.message);\r
+                  // Timeout is set to avoid problems with the events being considered 'already fired'\r
+                  setTimeout(function () {\r
+                    rrjqbvThis.trigger("change.validation");\r
+                  }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst\r
+                }\r
+              }\r
+            );\r
+          }\r
+\r
+          return false;\r
+\r
+        }\r
+      },\r
+      ajax: {\r
+        name: "ajax",\r
+        init: function ($this, name) {\r
+          return {\r
+            validatorName: name,\r
+            url: $this.data("validation" + name + "Ajax"),\r
+            lastValue: $this.val(),\r
+            lastValid: true,\r
+            lastFinished: true\r
+          };\r
+        },\r
+        validate: function ($this, value, validator) {\r
+          if (""+validator.lastValue === ""+value && validator.lastFinished === true) {\r
+            return validator.lastValid === false;\r
+          }\r
+\r
+          if (validator.lastFinished === true)\r
+          {\r
+            validator.lastValue = value;\r
+            validator.lastValid = true;\r
+            validator.lastFinished = false;\r
+            $.ajax({\r
+              url: validator.url,\r
+              data: "value=" + value + "&field=" + $this.attr("name"),\r
+              dataType: "json",\r
+              success: function (data) {\r
+                if (""+validator.lastValue === ""+data.value) {\r
+                  validator.lastValid = !!(data.valid);\r
+                  if (data.message) {\r
+                    validator.message = data.message;\r
+                  }\r
+                  validator.lastFinished = true;\r
+                  $this.data("validation" + validator.validatorName + "Message", validator.message);\r
+                  // Timeout is set to avoid problems with the events being considered 'already fired'\r
+                  setTimeout(function () {\r
+                    $this.trigger("change.validation");\r
+                  }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst\r
+                }\r
+              },\r
+              failure: function () {\r
+                validator.lastValid = true;\r
+                validator.message = "ajax call failed";\r
+                validator.lastFinished = true;\r
+                $this.data("validation" + validator.validatorName + "Message", validator.message);\r
+                // Timeout is set to avoid problems with the events being considered 'already fired'\r
+                setTimeout(function () {\r
+                  $this.trigger("change.validation");\r
+                }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst\r
+              }\r
+            });\r
+          }\r
+\r
+          return false;\r
+\r
+        }\r
+      },\r
+                       regex: {\r
+                               name: "regex",\r
+                               init: function ($this, name) {\r
+                                       return {regex: regexFromString($this.data("validation" + name + "Regex"))};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (!validator.regex.test(value) && ! validator.negative)\r
+                                               || (validator.regex.test(value) && validator.negative);\r
+                               }\r
+                       },\r
+                       required: {\r
+                               name: "required",\r
+                               init: function ($this, name) {\r
+                                       return {};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return !!(value.length === 0  && ! validator.negative)\r
+                                               || !!(value.length > 0 && validator.negative);\r
+                               },\r
+        blockSubmit: true\r
+                       },\r
+                       match: {\r
+                               name: "match",\r
+                               init: function ($this, name) {\r
+                                       var element = $this.parents("form").first().find("[name=\"" + $this.data("validation" + name + "Match") + "\"]").first();\r
+                                       element.bind("validation.validation", function () {\r
+                                               $this.trigger("change.validation", {submitting: true});\r
+                                       });\r
+                                       return {"element": element};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (value !== validator.element.val() && ! validator.negative)\r
+                                               || (value === validator.element.val() && validator.negative);\r
+                               },\r
+        blockSubmit: true\r
+                       },\r
+                       max: {\r
+                               name: "max",\r
+                               init: function ($this, name) {\r
+                                       return {max: $this.data("validation" + name + "Max")};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (parseFloat(value, 10) > parseFloat(validator.max, 10) && ! validator.negative)\r
+                                               || (parseFloat(value, 10) <= parseFloat(validator.max, 10) && validator.negative);\r
+                               }\r
+                       },\r
+                       min: {\r
+                               name: "min",\r
+                               init: function ($this, name) {\r
+                                       return {min: $this.data("validation" + name + "Min")};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (parseFloat(value) < parseFloat(validator.min) && ! validator.negative)\r
+                                               || (parseFloat(value) >= parseFloat(validator.min) && validator.negative);\r
+                               }\r
+                       },\r
+                       maxlength: {\r
+                               name: "maxlength",\r
+                               init: function ($this, name) {\r
+                                       return {maxlength: $this.data("validation" + name + "Maxlength")};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return ((value.length > validator.maxlength) && ! validator.negative)\r
+                                               || ((value.length <= validator.maxlength) && validator.negative);\r
+                               }\r
+                       },\r
+                       minlength: {\r
+                               name: "minlength",\r
+                               init: function ($this, name) {\r
+                                       return {minlength: $this.data("validation" + name + "Minlength")};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return ((value.length < validator.minlength) && ! validator.negative)\r
+                                               || ((value.length >= validator.minlength) && validator.negative);\r
+                               }\r
+                       },\r
+                       maxchecked: {\r
+                               name: "maxchecked",\r
+                               init: function ($this, name) {\r
+                                       var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");\r
+                                       elements.bind("click.validation", function () {\r
+                                               $this.trigger("change.validation", {includeEmpty: true});\r
+                                       });\r
+                                       return {maxchecked: $this.data("validation" + name + "Maxchecked"), elements: elements};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (validator.elements.filter(":checked").length > validator.maxchecked && ! validator.negative)\r
+                                               || (validator.elements.filter(":checked").length <= validator.maxchecked && validator.negative);\r
+                               },\r
+        blockSubmit: true\r
+                       },\r
+                       minchecked: {\r
+                               name: "minchecked",\r
+                               init: function ($this, name) {\r
+                                       var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");\r
+                                       elements.bind("click.validation", function () {\r
+                                               $this.trigger("change.validation", {includeEmpty: true});\r
+                                       });\r
+                                       return {minchecked: $this.data("validation" + name + "Minchecked"), elements: elements};\r
+                               },\r
+                               validate: function ($this, value, validator) {\r
+                                       return (validator.elements.filter(":checked").length < validator.minchecked && ! validator.negative)\r
+                                               || (validator.elements.filter(":checked").length >= validator.minchecked && validator.negative);\r
+                               },\r
+        blockSubmit: true\r
+                       }\r
+               },\r
+               builtInValidators: {\r
+                       email: {\r
+                               name: "Email",\r
+                               type: "shortcut",\r
+                               shortcut: "validemail"\r
+                       },\r
+                       validemail: {\r
+                               name: "Validemail",\r
+                               type: "regex",\r
+                               regex: "[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\\.[A-Za-z]{2,4}",\r
+                               message: "Not a valid email address<!-- data-validator-validemail-message to override -->"\r
+                       },\r
+                       passwordagain: {\r
+                               name: "Passwordagain",\r
+                               type: "match",\r
+                               match: "password",\r
+                               message: "Does not match the given password<!-- data-validator-paswordagain-message to override -->"\r
+                       },\r
+                       positive: {\r
+                               name: "Positive",\r
+                               type: "shortcut",\r
+                               shortcut: "number,positivenumber"\r
+                       },\r
+                       negative: {\r
+                               name: "Negative",\r
+                               type: "shortcut",\r
+                               shortcut: "number,negativenumber"\r
+                       },\r
+                       number: {\r
+                               name: "Number",\r
+                               type: "regex",\r
+                               regex: "([+-]?\\\d+(\\\.\\\d*)?([eE][+-]?[0-9]+)?)?",\r
+                               message: "Must be a number<!-- data-validator-number-message to override -->"\r
+                       },\r
+                       integer: {\r
+                               name: "Integer",\r
+                               type: "regex",\r
+                               regex: "[+-]?\\\d+",\r
+                               message: "No decimal places allowed<!-- data-validator-integer-message to override -->"\r
+                       },\r
+                       positivenumber: {\r
+                               name: "Positivenumber",\r
+                               type: "min",\r
+                               min: 0,\r
+                               message: "Must be a positive number<!-- data-validator-positivenumber-message to override -->"\r
+                       },\r
+                       negativenumber: {\r
+                               name: "Negativenumber",\r
+                               type: "max",\r
+                               max: 0,\r
+                               message: "Must be a negative number<!-- data-validator-negativenumber-message to override -->"\r
+                       },\r
+                       required: {\r
+                               name: "Required",\r
+                               type: "required",\r
+                               message: "This is required<!-- data-validator-required-message to override -->"\r
+                       },\r
+                       checkone: {\r
+                               name: "Checkone",\r
+                               type: "minchecked",\r
+                               minchecked: 1,\r
+                               message: "Check at least one option<!-- data-validation-checkone-message to override -->"\r
+                       }\r
+               }\r
+       };\r
+\r
+       var formatValidatorName = function (name) {\r
+               return name\r
+                       .toLowerCase()\r
+                       .replace(\r
+                               /(^|\s)([a-z])/g ,\r
+                               function(m,p1,p2) {\r
+                                       return p1+p2.toUpperCase();\r
+                               }\r
+                       )\r
+               ;\r
+       };\r
+\r
+       var getValue = function ($this) {\r
+               // Extract the value we're talking about\r
+               var value = $this.val();\r
+               var type = $this.attr("type");\r
+               if (type === "checkbox") {\r
+                       value = ($this.is(":checked") ? value : "");\r
+               }\r
+               if (type === "radio") {\r
+                       value = ($('input[name="' + $this.attr("name") + '"]:checked').length > 0 ? value : "");\r
+               }\r
+               return value;\r
+       };\r
+\r
+  function regexFromString(inputstring) {\r
+               return new RegExp("^" + inputstring + "$");\r
+       }\r
+\r
+  /**\r
+   * Thanks to Jason Bunting via StackOverflow.com\r
+   *\r
+   * http://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string#answer-359910\r
+   * Short link: http://tinyurl.com/executeFunctionByName\r
+  **/\r
+  function executeFunctionByName(functionName, context /*, args*/) {\r
+    var args = Array.prototype.slice.call(arguments).splice(2);\r
+    var namespaces = functionName.split(".");\r
+    var func = namespaces.pop();\r
+    for(var i = 0; i < namespaces.length; i++) {\r
+      context = context[namespaces[i]];\r
+    }\r
+    return context[func].apply(this, args);\r
+  }\r
+\r
+       $.fn.jqBootstrapValidation = function( method ) {\r
+\r
+               if ( defaults.methods[method] ) {\r
+                       return defaults.methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));\r
+               } else if ( typeof method === 'object' || ! method ) {\r
+                       return defaults.methods.init.apply( this, arguments );\r
+               } else {\r
+               $.error( 'Method ' +  method + ' does not exist on jQuery.jqBootstrapValidation' );\r
+                       return null;\r
+               }\r
+\r
+       };\r
+\r
+  $.jqBootstrapValidation = function (options) {\r
+    $(":input").not("[type=image],[type=submit]").jqBootstrapValidation.apply(this,arguments);\r
+  };\r
+\r
+})( jQuery );\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vim-validate.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vim-validate.js
new file mode 100644 (file)
index 0000000..5e3c9c9
--- /dev/null
@@ -0,0 +1,116 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+/**\r
+ * Created by 10184303 on 15-11-17.\r
+ */\r
+var form = $('#vim_form');\r
+var error = $('.alert-danger', form);\r
+var success = $('.alert-success', form);\r
+form.validate({\r
+    doNotHideMessage: true, //this option enables to show the error/success messages on tab switch.\r
+    errorElement: 'span', //default input error message container\r
+    errorClass: 'help-block', // default input error message class\r
+    focusInvalid: false, // do not focus the last invalid input\r
+    rules: {\r
+        url: {\r
+            required: true,\r
+            url:true,\r
+            maxlength:50\r
+            //,repeatedName: true\r
+        },\r
+        vimName:{\r
+            required: true,\r
+            maxlength:20\r
+        },\r
+        version:{\r
+            required: true,\r
+            maxlength:20\r
+        },\r
+        vendor:{\r
+            required: true,\r
+            maxlength:20\r
+        },\r
+        userName:{\r
+            required: true,\r
+            maxlength:20\r
+        },\r
+        password:{\r
+            required: true,\r
+            maxlength:20\r
+        },\r
+        tenant:{\r
+            required: true,\r
+            maxlength:20\r
+        }\r
+    },\r
+    messages: {\r
+        url: {\r
+            //required: $.i18n.prop('com_zte_ums_zenic_topology_connectmanager_enter_name')\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_auth_url_require_message'),\r
+            url: $.i18n.prop('com_zte_ums_eco_roc_vim_auth_url_alarm_message')\r
+        },\r
+        vimName:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_name_alarm_message')\r
+        },\r
+        userName:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_username_alarm_message')\r
+        },\r
+        password:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_password_alarm_message')\r
+        },\r
+         version:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_version_alarm_message')\r
+        },\r
+         vendor:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_vendor_alarm_message')\r
+        },\r
+        tenant:{\r
+            required: $.i18n.prop('com_zte_ums_eco_roc_vim_tenant_alarm_message')\r
+        }\r
+    },\r
+    errorPlacement: function (error, element) { // render error placement for each input type\r
+        error.insertAfter(element); // for other inputs, just perform default behavior\r
+    },\r
+\r
+    invalidHandler: function (event, validator) { //display error alert on form submit\r
+        success.hide();\r
+        error.show();\r
+        //ZteFrameWork.scrollTo(error, -200);\r
+    },\r
+\r
+    highlight: function (element) { // hightlight error inputs\r
+        $(element)\r
+            .closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group\r
+    },\r
+\r
+    unhighlight: function (element) { // revert the change done by hightlight\r
+        $(element)\r
+            .closest('.form-group').removeClass('has-error'); // set error class to the control group\r
+    },\r
+\r
+    success: function (label) {\r
+        label\r
+            .addClass('valid') // mark the current input as valid and display OK icon\r
+            .closest('.form-group').removeClass('has-error'); // set success class to the control group\r
+    },\r
+\r
+    submitHandler: function (form) {\r
+        success.show();\r
+        error.hide();\r
+        //add here some ajax code to submit your form or just call form.submit() if you want to submit the form without ajax\r
+    }\r
+\r
+});\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChart.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChart.js
new file mode 100644 (file)
index 0000000..259f83d
--- /dev/null
@@ -0,0 +1,383 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var vimChart = {};\r
+\r
+\r
+\r
+ var labelTop = {\r
+    normal : {\r
+        label : {\r
+            show : true,\r
+            position : 'outer',\r
+            formatter :function (params){\r
+                var total=params.series.data[1].value+params.series.data[0].value;\r
+                var util=params.series.data[0].util;\r
+                // return total+util+"中的"+"\n"+params.value+util+"已使用" ;\r
+                return $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_used')+params.value+util+"\n"+\r
+                $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_total')+ total+util;\r
+            }, \r
+            textStyle: {\r
+                baseline : 'bottom',\r
+                fontWeight:'normal'\r
+\r
+            }\r
+        },\r
+        labelLine : {\r
+            show : true\r
+        }\r
+    }\r
+};\r
+\r
+\r
+var labelFromatter = {\r
+    normal : {\r
+        label : {\r
+            formatter :function (params){\r
+                return params.series.data[0].name+"\n"+(100-params.percent).toFixed(0) + '%'\r
+            },  \r
+            textStyle: {\r
+                baseline : 'center',\r
+                  color:"#000",\r
+                  fontWeight:'bold'\r
+\r
+               \r
+            }\r
+        }\r
+    }\r
+}\r
+var labelBottom = {\r
+    normal : {\r
+        color: '#ccc',\r
+        label : {\r
+            show : true,\r
+            position : 'center'\r
+        },\r
+        labelLine : {\r
+            show : false\r
+        }\r
+    },\r
+    emphasis: {\r
+        color: 'rgba(0,0,0,0)'\r
+    }\r
+};\r
+\r
+var radius = [40, 55];\r
+\r
+ var vimPieChart;\r
+\r
+vimChart.vimPieChartInit = function(){\r
+   vimPieChart = echarts.init(document.getElementById('vimPieChartDiv')); \r
+   vimPieChart.showLoading({\r
+    text : "Loading",\r
+    effect :"whirling",\r
+    textStyle : {\r
+        fontSize : 20\r
+    }\r
+});\r
+\r
+}\r
+\r
+vimChart.vimPieChart = function(data){\r
\r
+var option = {\r
+    animation:true,\r
+    legend: {\r
+        x : 'left',\r
+        y:"top",\r
+        data:[\r
+            $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_cpu'),\r
+            $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_memory'),\r
+            $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_disk')\r
+        ],\r
+        orient: 'vertical'\r
+    },\r
+     color:["#578ebe","#44b6ae","#DABA36"],\r
+    title : {\r
+        text: '',\r
+        subtext: '',\r
+        x: 'center'\r
+    },   \r
+    toolbox: {\r
+        show : true,\r
+\r
+        feature : {       \r
+            saveAsImage : {\r
+            show : true,\r
+            title : $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_save_picture'),\r
+            type : 'png',\r
+            lang : [$.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_click_save')]\r
+            }\r
+        }\r
+    },\r
+    series : [\r
+        {\r
+            type : 'pie',\r
+            center : ['15%', '55%'],\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_cpu'), value:data.usage.cpu,itemStyle : labelTop,util:''},\r
+                {name:'other', value:data.resource.cpu -data.usage.cpu, itemStyle : labelBottom}\r
+                \r
+            ]\r
+        },\r
+        {\r
+            type : 'pie',\r
+            center : ['40%', '55%'],\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_memory'), value:data.usage.memoryMb,itemStyle : labelTop,util:'MB' },\r
+                {name:'other', value:data.resource.memoryMb - data.usage.memoryMb,itemStyle : labelBottom}\r
+                \r
+            ]\r
+        },\r
+        {\r
+            type : 'pie',\r
+            center : ['65%', '55%'],\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_disk'), value:data.usage.diskGb,itemStyle : labelTop,util:'GB'},\r
+                {name:'other', value:data.resource.diskGb -data.usage.diskGb,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        }\r
+         \r
+    ]\r
+};\r
+                    \r
+\r
+        // 为echarts对象加载数据 \r
+    vimPieChart.hideLoading();\r
+    vimPieChart.setOption(option);\r
+    window.onresize = vimPieChart.resize;\r
+\r
+\r
+}\r
+\r
+vimChart.getPieCenter=function(n){\r
+    var center;\r
+    switch(n)\r
+    {\r
+    case 1:\r
+      center=['15%', '30%'];\r
+      break;\r
+    case 2:\r
+      center=['40%', '30%'];\r
+      break;\r
+    case 3:\r
+      center=['65%', '30%'];\r
+      break;\r
+    case 4:\r
+      center=['15%', '80%'];\r
+      break;\r
+    case 5:\r
+      center=['40%', '80%'];\r
+      break;\r
+    case 6:\r
+      center=['65%', '80%'];\r
+      break;  \r
+    case 7:\r
+      center=['90%', '80%'];\r
+      break;         \r
+\r
+    }\r
+    return center;\r
+}\r
+\r
+\r
+ var tenantPieChart;\r
+vimChart.tenantPieChartInit = function(){\r
+    tenantPieChart= echarts.init(document.getElementById('tenantPieChartDiv')); \r
+\r
+   tenantPieChart.showLoading({\r
+    text : "Loading",\r
+    effect :"whirling",\r
+    textStyle : {\r
+        fontSize : 20\r
+    }\r
+});\r
+}\r
+vimChart.tenantPieChart = function(data){\r
+\r
+var  legend_data=new Array();\r
+var series=new Array();\r
+var n=0;\r
+\r
+if(data.quota.instances!=-1){\r
+    n++;\r
+\r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_instances'));\r
+var instances_series={\r
+            type : 'pie',\r
+            center : vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_instances'), value:data.usage.instances,itemStyle : labelTop,util:''},\r
+                {name:'other', value:data.quota.instances -data.usage.instances, itemStyle : labelBottom}\r
+                \r
+            ]\r
+        };\r
+ series.push(instances_series);     \r
+\r
+}   \r
+if(data.quota.cpu!=-1){\r
+n++;\r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_cpu'));\r
+var cpu_series={\r
+            type : 'pie',\r
+            center : vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_cpu'), value:data.usage.cpu,itemStyle : labelTop,util:'' },\r
+                {name:'other', value:data.quota.cpu -data.usage.cpu,itemStyle : labelBottom}\r
+                \r
+            ]\r
+        };\r
+ series.push(cpu_series);\r
+} \r
+if(data.quota.memoryMb!=-1){\r
+  n++;    \r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_memoryMb'));\r
+var memoryMb_series={\r
+            type : 'pie',\r
+            center : vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_memoryMb'), value:data.usage.memoryMb,itemStyle : labelTop,util:'MB'},\r
+                {name:'other', value:data.quota.memoryMb -data.usage.memoryMb,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        };\r
+ series.push(memoryMb_series);\r
+} \r
+if(data.quota.floatingIps!=-1){\r
+  n++;    \r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_floatingIps'));\r
+var floatingIps_series={\r
+            type : 'pie',\r
+            center :vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_floatingIps'), value:data.usage.floatingIps,itemStyle : labelTop,util:''},\r
+                {name:'other', value:data.quota.floatingIps -data.usage.floatingIps,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        };\r
+ series.push(floatingIps_series);\r
+} \r
+if(data.quota.securityGroups!=-1){\r
+  n++;    \r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_securityGroups'));\r
+var securityGroups_series={\r
+            type : 'pie',\r
+            center :vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_securityGroups'), value:data.usage.securityGroups,itemStyle : labelTop,util:''},\r
+                 {name:'other', value:data.quota.securityGroups -data.usage.securityGroups,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        };\r
+ series.push(securityGroups_series);\r
+} \r
+if(data.quota.volumes!=-1){\r
+  n++;    \r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumes'));\r
+var volumes_series={\r
+            type : 'pie',\r
+            center :vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumes'), value:data.usage.volumes,itemStyle : labelTop,util:''},\r
+                 {name:'other', value:data.quota.volumes -data.usage.volumes,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        };\r
+ series.push(volumes_series);\r
+} \r
+if(data.quota.volumeStorage!=-1){\r
+  n++;    \r
+legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage'));\r
+var volumeStorage_series={\r
+            type : 'pie',\r
+            center :vimChart.getPieCenter(n),\r
+            radius : radius,\r
+            itemStyle : labelFromatter,\r
+            data : [\r
+                 {name:$.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage'), value:data.usage.volumeStorage,itemStyle : labelTop,util:'GB'},\r
+                 {name:'other', value:data.quota.volumeStorage -data.usage.volumeStorage,  itemStyle : labelBottom}\r
+               \r
+            ]\r
+        };\r
+ series.push(volumeStorage_series);\r
+} \r
+\r
+\r
+var option = {\r
+    animation:true,\r
+    legend: {\r
+        x : 'left',\r
+        y:"top",\r
+        data:legend_data,\r
+        orient: 'vertical'\r
+    },\r
+     color:["#578ebe","#44b6ae","#DABA36","#F79695","#9699e0","#57b5e3","#48c79c"],\r
+    title : {\r
+        text: '',\r
+        subtext: '',\r
+        x: 'center'\r
+    },   \r
+    toolbox: {\r
+        show : true,       \r
+        feature : {       \r
+            saveAsImage : {\r
+            show : true,\r
+            title : $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_save_picture'),\r
+            type : 'png',\r
+            lang : [$.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_click_save')]\r
+            }\r
+        }\r
+    },\r
+    series : series\r
+};\r
+                    \r
+      \r
+        // 为echarts对象加载数据 \r
+         tenantPieChart.hideLoading();\r
+         tenantPieChart.setOption(option);\r
+         window.onresize = tenantPieChart.resize;\r
+\r
+\r
+}\r
+\r
+vimChart.growl=function(message,type){\r
+      $.growl({\r
+        icon: "fa fa-envelope-o fa-lg",\r
+        title: "&nbsp;&nbsp;" + $.i18n.prop('com_zte_ums_eco_roc_vim_title_notice'),\r
+        message: message+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"\r
+            },{\r
+                type: type,\r
+                               delay:0\r
+            });\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChartController.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimChartController.js
new file mode 100644 (file)
index 0000000..1e9126b
--- /dev/null
@@ -0,0 +1,162 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var vm = avalon\r
+               .define({\r
+                       $id : "vimChartController",\r
+                       $vimChartUrl : '../../api/vim/v1/{vim_id}/resource',\r
+                       $tenantChartUrl : '../../api/vim/v1/{vim_id}/resource/{tenant_name}',\r
+                       $tenantListUrl : '../../api/vim/v1/{vim_id}/tenants',\r
+                       $tenantRoleUrl : '../../api/vim/v1/{vim_id}/roles',\r
+                       vimInfo:{\r
+                               name:name,\r
+                               id:id,\r
+                               tenant:tenant,\r
+                               isAdmin:true\r
+                       },      \r
+                       tenantSelectList:  {\r
+                                       condName : $.i18n.prop("com_zte_ums_eco_roc_vim_type"),\r
+                                       component_type : 'select',\r
+                                       selectItems : []\r
+                       },\r
+                       initChart : function() {\r
+\r
+                               //判断租户是否有admin权限\r
+                               var tenantRoleUrl=vm.$tenantRoleUrl.replace("{vim_id}",vm.vimInfo.id); \r
+                                $.ajax({\r
+                       "type": 'get',\r
+                       "url": tenantRoleUrl,\r
+                       "dataType": "json",\r
+                       success: function (resp) {  \r
+                            vm.vimInfo.isAdmin= (resp==null)?false:resp.isAdminRole; \r
+                                               \r
+                       },\r
+                        error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                                  vimChart.growl("get [tenant Role] is error :"+textStatus+":"+errorThrown,"danger"); \r
+                        },\r
+                         complete: function() { \r
+                               if(vm.vimInfo.isAdmin==true){\r
+\r
+                                       //获取全部资源使用情况 \r
+                                       vm.vimChartLoad();\r
+\r
+                                        //获取租户列表\r
+                                       vm.vimListLoad();\r
+                               }\r
+\r
+                        }\r
+                   });\r
+                               //获取租户资源使用情况 \r
+                               vm.tenantChartLoad();\r
+                       },\r
+                       gotoVimPage:function(){\r
+                                       window.parent.ZteFrameWork.goToURLByIDAndNewAction('eco_roc_vimmgr');\r
+                       },\r
+                       vimListLoad:function(){\r
+                                var tenantListUrl=vm.$tenantListUrl.replace("{vim_id}",vm.vimInfo.id); \r
+                                $.ajax({\r
+                       "type": 'get',\r
+                       "url": tenantListUrl,\r
+                       "dataType": "json",\r
+                       success: function (resp) {  \r
+                             vm.tenantSelectList.selectItems= (resp==null)?[]:resp;                    \r
+                       },\r
+                        error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                                   vimChart.growl("get [tenant List] is error :"+textStatus+":"+errorThrown,"danger"); \r
+                        }\r
+                   });\r
+                       },\r
+                       vimChartLoad:function(){\r
+                               var viminitData={\r
+                                           "resource": {\r
+                                               "cpu": 0,\r
+                                               "memoryMb": 503,\r
+                                               "diskGb": 9.8\r
+                                           },\r
+                                           "usage": {\r
+                                               "cpu": 0,\r
+                                               "memoryMb": 0,\r
+                                               "diskGb": 0\r
+                                           }\r
+                                       }\r
+\r
+                                 vimChart.vimPieChartInit();\r
+\r
+                                 var vimChartUrl=vm.$vimChartUrl.replace("{vim_id}",vm.vimInfo.id); \r
+                                 \r
+\r
+                                \r
+                                $.ajax({\r
+                       "type": 'get',\r
+                       "url": vimChartUrl,\r
+                       "dataType": "json",\r
+                       success: function (resp) {  \r
+                            var vimData= (resp==null)?viminitData:resp;  \r
+                            vimChart.vimPieChart(vimData);                     \r
+                       },\r
+                        error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                                  vimChart.growl("get [virtual machine manager resource using status] is error :"+textStatus+":"+errorThrown,"danger"); \r
+                        }\r
+                   });\r
+       \r
+                       },\r
+                       tenantChartLoad:function(){\r
+                                var tenantChartUrl=vm.$tenantChartUrl.replace("{vim_id}",vm.vimInfo.id).replace("{tenant_name}",vm.vimInfo.tenant);\r
+\r
+                               var tenantinitData={\r
+                                                   "tenant_name": "",\r
+                                                       "errormsg":"",\r
+                                                   "quota": {\r
+                                                       "cpu": 0,\r
+                                                       "memoryMb": 0,\r
+                                                       "instances": 0,\r
+                                                       "floatingIps": 0,\r
+                                                       "securityGroups": 0,\r
+                                                       "volumeStorage": 0,\r
+                                                       "volumes": 0\r
+                                                   },\r
+                                                   "usage": {\r
+                                                       "cpu": 0,\r
+                                                       "memoryMb": 0,\r
+                                                       "instances": 0,\r
+                                                       "floatingIps": 0,\r
+                                                       "securityGroups": 0,\r
+                                                       "volumeStorage": 0,\r
+                                                               "volumes": 0\r
+                                                   }\r
+                                               };\r
+                               vimChart.tenantPieChartInit();\r
+                                $.ajax({\r
+                       "type": 'get',\r
+                       "url": tenantChartUrl,\r
+                       "dataType": "json",\r
+                       success: function (resp) {  \r
+                            var tenantData= (resp==null)?tenantinitData:resp;  \r
+                                                if(tenantData.errormsg!=null)\r
+                                                {\r
+                                                  vimChart.growl(tenantData.errormsg,"danger");\r
+                                                }\r
+                             vimChart.tenantPieChart(tenantData);                      \r
+                       },\r
+                        error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                                  vimChart.growl("get [tenant quota using status] occur error :"+textStatus+":"+errorThrown,"danger"); \r
+                        }\r
+                   });\r
+\r
+                       }\r
+\r
+});\r
+avalon.scan();\r
+vm.initChart();
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimController.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimController.js
new file mode 100644 (file)
index 0000000..ccade47
--- /dev/null
@@ -0,0 +1,302 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var vm = avalon\r
+               .define({\r
+                       $id : "vimController",\r
+                       vimInfo :  [],\r
+                       //vimStatusTime:$.i18n.prop('com_zte_ums_eco_roc_vim_getting_info'),\r
+                       // ifSearch : 0,\r
+                       // server_rtn:{\r
+                       //      info_block:false,\r
+                       //      warning_block:false,\r
+                       //      rtn_info:"",\r
+                       //      $RTN_SUCCESS:"RTN_SUCCESS",\r
+                       //      $RTN_FAILED:"RTN_FAILED",\r
+   //              wait : $.i18n.prop('com_zte_ums_eco_roc_vim_checking_status')\r
+                       // },\r
+             executeWait : {clazz : 'alert-info', visible : true, text : $.i18n.prop('com_zte_ums_eco_roc_vim_checking_status')},\r
+             executeError : {clazz : 'alert-danger', visible : true, text : 'error'},\r
+                       $Status :{\r
+                success:"active",\r
+                failed:"inactive",\r
+                               displayActive: $.i18n.prop('com_zte_ums_eco_roc_vim_normal'),\r
+                               displayInactive: $.i18n.prop('com_zte_ums_eco_roc_vim_abnormal')\r
+                       },\r
+            isSave : true,\r
+            action : {ADD : 'add', UPDATE : 'update'},\r
+                       $queryVimInfoUrl : '../../openoapi/extsys/v1/vims',\r
+            $addVimInfoUrl : '../../openoapi/extsys/v1/vims/',\r
+                       $updateVimInfoUrl : '../../openoapi/extsys/v1/vims/',\r
+                       $delVimInfoUrl : '../../openoapi/extsys/v1/vims/{vim_id}',\r
+                       $initTable : function() {\r
+                $.ajax({\r
+                    "type": 'get',\r
+                    "url": vm.$queryVimInfoUrl,\r
+                    //"dataType": "json",\r
+                    "success": function (resp,statusText,jqXHR) {\r
+                       if(jqXHR.status=="200")\r
+                       {\r
+                         vm.vimInfo = resp;\r
+                       }\r
+                       else{\r
+                        vm.vimInfo=[];\r
+                        bootbox.alert($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_query_failed"));\r
+                        return;\r
+                       }\r
+                    },\r
+                     error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                           bootbox.alert($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_query_failed") + textStatus+":"+errorThrown);\r
+                           return;\r
+                     },\r
+                     complete: function() {\r
+                       resUtil.tooltipVimStatus();\r
+                     }\r
+                });\r
+                               \r
+                       },               \r
+                       $vimType:  {\r
+                                       condName : $.i18n.prop("com_zte_ums_eco_roc_vim_type"),\r
+                                       component_type : 'select',\r
+                                       selectItems : [\r
+                                                       {\r
+                                                               cond_value : 'vmware',\r
+                                                               name : "vmware",\r
+                                                               value : true\r
+                                                       },\r
+                                                       {\r
+                                                               cond_value : 'openstack',\r
+                                                               name :"openstack",\r
+                                                               value : true\r
+                                                       }\r
+                                                       ]\r
+                               },\r
+                       addVim : {\r
+                               titleName: $.i18n.prop("com_zte_ums_eco_roc_vim_register_info"),\r
+                vimId : "",\r
+                vimName : "",\r
+                domain : '',\r
+                               userName : "",\r
+                tenant : "",\r
+                               password : "",               \r
+                               url : "",\r
+                               saveType :"add",\r
+                               description : "",               \r
+                vimType :"openstack",\r
+                vendor :""\r
+                       },\r
+        $showVimTable : function(el, action) {\r
+            vm.isSave = false;\r
+            if(vm.action.ADD == action){\r
+                vm.addVim.vimId = "";\r
+                vm.addVim.vimName = "";\r
+                vm.addVim.userName = "";\r
+                vm.addVim.password = "";\r
+                vm.addVim.url = "";\r
+                vm.addVim.domain = "";\r
+                vm.addVim.description = "";\r
+                vm.addVim.tenant = "";\r
+                vm.addVim.vendor = "";\r
+                vm.addVim.saveType = "add";\r
+                vm.addVim.vimType = "openstack";\r
+                vm.addVim.titleName = $.i18n.prop("com_zte_ums_eco_roc_vim_register_info");\r
+\r
+            } else {\r
+                vm.addVim.vimId = el.vimId;\r
+                vm.addVim.vimName = el.name;\r
+                vm.addVim.url = el.url;\r
+                vm.addVim.description = el.description;\r
+                vm.addVim.userName = el.userName;\r
+                vm.addVim.password = el.password;\r
+                vm.addVim.tenant = el.tenant;\r
+                vm.addVim.domain = el.domain;\r
+                vm.addVim.saveType = "update";\r
+                vm.addVim.titleName = $.i18n.prop('com_zte_ums_eco_roc_vim_modify_info');\r
+                vm.addVim.vimType = el.type;\r
+                vm.addVim.vendor = el.vendor;\r
+            }\r
+            vm.executeError.visible=false;\r
+            vm.executeWait.visible=false;\r
+            $(".form-group").each(function () {\r
+                $(this).removeClass('has-success');\r
+                $(this).removeClass('has-error');\r
+                $(this).find(".help-block[id]").remove();\r
+            });\r
+            $("#addVimDlg").modal("show");\r
+               },\r
+\r
+        $saveVimTable : function() {\r
+            vm.isSave = true;\r
+            success.hide();\r
+            error.hide();\r
+            if (form.valid() == false) {\r
+                vm.isSave = false;\r
+                return false;\r
+            }\r
+            vm.executeWait.visible = true;\r
+            vm.executeError.visible = false;\r
+            if(vm.addVim.saveType=="add") {\r
+                //不能重复添加\r
+                               /*\r
+                for( var i = 0; i < vm.vimInfo.length; i ++ ){\r
+                    if(vm.addVim.url == vm.vimInfo[i].url){\r
+                        resUtil.growl($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_title") +  'already exists',"info");\r
+                        $('#addVimDlg').modal('hide');\r
+                        return;\r
+                    }\r
+                }\r
+                               */\r
+                vm.persistVim();\r
+            } else if( vm.addVim.saveType == "update" ){\r
+                vm.updateVim();\r
+            }\r
+        },\r
+        //新增vim\r
+        persistVim : function(){\r
+            $.ajax({\r
+                type : "Post",\r
+                url : vm.$addVimInfoUrl,\r
+                data : JSON.stringify({\r
+                    name       : vm.addVim.vimName, \r
+                    url        : vm.addVim.url,                 \r
+                    userName   : vm.addVim.userName,\r
+                    password   : vm.addVim.password,\r
+                    tenant     : vm.addVim.tenant,\r
+                    domain     : vm.addVim.domain,\r
+                    vendor     : vm.addVim.vendor,\r
+                    version    : vm.addVim.version, \r
+                    description: vm.addVim.description,  \r
+                    type       : vm.addVim.vimType,                    \r
+                }),\r
+                async : false,\r
+                dataType : "json",\r
+                contentType : 'application/json',\r
+                success : function(data,statusText,jqXHR) {\r
+                    vm.executeWait.visible=false;\r
+                    vm.executeError.visible=false;\r
+                    if ( jqXHR.status=="201" ) {\r
+                        vm.addVim.vimId = data.vimId;                       \r
+                        vm.addVim.name = data.name;\r
+                        vm.addVim.tenant = data.tenant;\r
+                        vm.addVim.type = data.type;\r
+                        var newVim=jQuery.extend({}, vm.addVim);\r
+                        vm.vimInfo.push(newVim);\r
+\r
+                        $('#addVimDlg').modal('hide');\r
+                        resUtil.growl($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_title") + $.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_save_success"),"success");\r
+                                       } else{\r
+                                               vm.executeError.visible=true;\r
+                                               vm.executeError.text = $.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_save_failed");\r
+                    }\r
+                },\r
+                error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                  vm.executeError.visible = true;\r
+                  vm.executeError.text = textStatus+":"+errorThrown;\r
+                  vm.executeWait.visible = false;\r
+                                 vm.isSave = false;\r
+               }\r
+            });\r
+        },\r
+        //更新vim\r
+        updateVim : function(){\r
+            $.ajax({\r
+                type : "Put",\r
+                url : vm.$updateVimInfoUrl+vm.addVim.vimId,\r
+                               contentType : 'application/json',\r
+                data : JSON.stringify({\r
+                    name : vm.addVim.vimName,\r
+                    userName : vm.addVim.userName,\r
+                    password : vm.addVim.password,\r
+                    domain   : vm.addVim.domain,\r
+                    version   : vm.addVim.version,\r
+                    description   : vm.addVim.description,\r
+                    url : vm.addVim.url,\r
+                    tenant:vm.addVim.tenant,\r
+                    type : vm.addVim.vimType,\r
+                    vendor : vm.addVim.vendor,\r
+                }),\r
+                dataType : "json",\r
+                async : false,\r
+                success : function(data,statusText,jqXHR) {\r
+                    vm.executeWait.visible=false;\r
+                    vm.executeError.visible=false;\r
+                    if (jqXHR.status=="200") {\r
+                        for(var i=0;i<vm.vimInfo.length;i++){\r
+                            if(vm.vimInfo[i].vimId == vm.addVim.vimId)\r
+                            {\r
+                                vm.vimInfo[i].name = vm.addVim.vimName;\r
+                                vm.vimInfo[i].userName = vm.addVim.userName;\r
+                                vm.vimInfo[i].password = vm.addVim.password;\r
+                                vm.vimInfo[i].url = vm.addVim.url;\r
+                                vm.vimInfo[i].tenant = vm.addVim.tenant;\r
+                                vm.vimInfo[i].domain = vm.addVim.domain;\r
+                                vm.vimInfo[i].description = vm.addVim.description;                               \r
+                                vm.vimInfo[i].type=vm.addVim.vimType;\r
+                            }\r
+                         }\r
+                        $('#addVimDlg').modal('hide');\r
+                     resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_save_success'),"success");\r
+                    }\r
+                    else{\r
+                        vm.executeError.visible = true;\r
+                        vm.executeError.text = $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_save_failed');\r
+                    }\r
+                },\r
+                error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                    vm.isSave = false;\r
+                    vm.executeError.visible=true;\r
+                    vm.executeError.text = textStatus+":"+errorThrown;\r
+                    vm.executeWait.visible = false;\r
+               }\r
+            });\r
+        },\r
+        delVim : function(el){\r
+            bootbox.confirm($.i18n.prop('com_zte_ums_eco_roc_vim_confirm_delete_vim_record'),function(result){\r
+                if(result){\r
+                    $.ajax({\r
+                        type : "DELETE",\r
+                        url : vm.$delVimInfoUrl.replace('{vim_id}', el.vimId),\r
+                        success : function(data,statusText,jqXHR) {\r
+                            if( jqXHR.status=="204")\r
+                            {\r
+                                for(var i=0;i<vm.vimInfo.length;i++){\r
+                                    if(el.vimId == vm.vimInfo[i].vimId){\r
+                                        vm.vimInfo.splice(i, 1);\r
+                                        break;\r
+                                    }\r
+                                }\r
+                                resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_remove_success'),"success");\r
+                            }\r
+                            else{\r
+                                resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_remove_failed'),"warning");\r
+                            }\r
+                        },\r
+                        error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                            resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') +  errorThrown, "danger");\r
+                        }\r
+                    });\r
+                }\r
+            });\r
+        },\r
+        gotoChartPage:function(oid,name,tenant){\r
+            window.location.href = "vimChart.html?"+oid+"&"+name+"&"+tenant;\r
+        }\r
+});\r
+avalon.scan();\r
+vm.$initTable();\r
+\r
+\r
+\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimUtil.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/js/vimUtil.js
new file mode 100644 (file)
index 0000000..bab4f3b
--- /dev/null
@@ -0,0 +1,51 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var resUtil = {};\r
+\r
+resUtil.tooltipVimStatus=function(){\r
+ $("[data-toggle='tooltip']").tooltip();\r
+\r
+}\r
+\r
+resUtil.growl=function(message,type){\r
+    $.growl({\r
+        icon: "fa fa-envelope-o fa-lg",\r
+        title: "&nbsp;&nbsp;Notice: ",\r
+        message: message+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"\r
+    },{\r
+        type: type\r
+    });\r
+    /*\r
+    $.bootstrapGrowl(message, {\r
+        ele: 'body', // which element to append to\r
+        type: type, // (null, 'info', 'danger', 'success')\r
+        offset: {from: 'bottom', amount: 20}, // 'top', or 'bottom'\r
+        align: 'right', // ('left', 'right', or 'center')\r
+        width: 'auto', // (integer, or 'auto')\r
+        delay: 3000, // Time while the message will be displayed. It's not equivalent to the *demo* timeOut!\r
+        allow_dismiss: false, // If true then will display a cross to close the popup.\r
+        stackup_spacing: 10 // spacing between consecutively stacked growls.\r
+    });\r
+    */\r
+}\r
+\r
+\r
+\r
+\r
+\r
+\r
+\r
+\r
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimChart.html b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimChart.html
new file mode 100644 (file)
index 0000000..1bb1373
--- /dev/null
@@ -0,0 +1,113 @@
+<!DOCTYPE html>\r
+<!--\r
+\r
+Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+\r
+Licensed under the Apache License, Version 2.0 (the "License");\r
+you may not use this file except in compliance with the License.\r
+You may obtain a copy of the License at\r
+\r
+    http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+Unless required by applicable law or agreed to in writing, software\r
+distributed under the License is distributed on an "AS IS" BASIS,\r
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+See the License for the specific language governing permissions and\r
+limitations under the License.\r
+\r
+-->\r
+<html>\r
+<head lang="en">\r
+<meta charset="UTF-8">\r
+<title></title>\r
+<link href="../component/thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="../component/thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>\r
+<link href="../framework/css/ngict-component.css" rel="stylesheet" type="text/css">\r
+<link href="../component/css/ZteIctIcons/style.css" rel="stylesheet" type="text/css">\r
+<link href="../vendor/animate/animate.min.css" rel="stylesheet" type="text/css" />\r
+<link href="./css/vimChart.css" rel="stylesheet" type="text/css"/>\r
+<style>\r
+.ms-controller {\r
+       visibility: hidden\r
+}\r
+</style>\r
+<script>\r
+var id,name,tenant;\r
+  if (window.location.search && window.location.search.length > 1) {\r
+    var arr=window.location.search.split("&");\r
+        id = arr[0].replace("?","");\r
+        name = arr[1];\r
+        tenant = arr[2];\r
+    }\r
+</script>\r
+</head>\r
+<body>\r
+<div class="ms-controller" ms-controller="vimChartController">\r
+ <div class="container-fluid">\r
+\r
+  <div class="row" style=" margin-top: 15px;">\r
+         <div class="col-xs-6 col-md-6 col-sm-6 col-lg-6 titlefont">\r
+          {{vimInfo.name}}<span  id_i18n="com_zte_ums_eco_roc_vim_resource_use" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+         </div>  \r
+         <div class="pull-right">  \r
+          <a href="#" ms-click="gotoVimPage()" id_i18n="com_zte_ums_eco_roc_vim_resource_chart_return" name_i18n="com_zte_conductor_ui_i18n"></a>\r
+\r
+         </div>      \r
+   </div>\r
+   <div class="separator-line"></div>\r
+\r
+    <div class="row row-fluid">\r
+\r
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 " ms-if="vimInfo.isAdmin==true" >\r
+\r
+ <div class="form-body">\r
+      <div class="form-title">\r
+        <span id_i18n="com_zte_ums_eco_roc_vim_resource_vim_use" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+      </div>\r
+      <div  id="vimPieChartDiv" style="width:100%;height:200px" class="main"></div>\r
+                  \r
+      </div>  \r
+  </div>\r
+\r
+        \r
+\r
+   <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 " >\r
+   <div class="form-body">\r
+      <div class="form-title">\r
+        {{vimInfo.tenant}}<span id_i18n="com_zte_ums_eco_roc_vim_resource_tenant_use" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+        <div class="pull-right">\r
+         <select class="form-control m-b" ms-if="vimInfo.isAdmin==true"  ms-each="tenantSelectList.selectItems"   ms-duplex="vimInfo.tenant" ms-change="tenantChartLoad()">             \r
+                            <option ms-attr-value='el.name'>{{el.name}}</option>\r
+                        </select>\r
+\r
+        \r
+         </div>\r
+      </div>\r
+    \r
+      <div  id="tenantPieChartDiv" style="width:100%;height:400px" class="main"></div>\r
+                  \r
+      </div> \r
+     \r
+   </div>\r
+\r
+    </div>\r
+\r
+ </div>\r
+\r
+\r
+</div>\r
+\r
+<script type="text/javascript" src="../component/thirdparty/jquery/jquery-1.10.2.min.js"></script>\r
+<script type="text/javascript" src="../framework/js/tools.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/bootstrap/js/bootstrap.min.js"></script>\r
+<script src="../vendor/bootstrap-growl/bootstrap-growl.min.js"></script>\r
+<script type="text/javascript" src="./i18n/loadi18nApp.js"></script> \r
+<script src="../vendor/echarts/echarts-all.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/bootbox/bootbox.min.js"></script>\r
+<script src="../vendor/avalon/avalon.js"></script>\r
+<script type="text/javascript" src="./js/vimChart.js"></script>\r
+<script type="text/javascript" src="./js/vimChartController.js"></script>\r
+<script type="text/javascript" src="../framework/js/core/hk.min.js" ></script>\r
+</body>\r
+</html>
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimView.html b/openo-portal/portal-extsys/src/main/webapp/extsys/vim/vimView.html
new file mode 100644 (file)
index 0000000..b638cac
--- /dev/null
@@ -0,0 +1,242 @@
+<!DOCTYPE html>\r
+<!--\r
+\r
+Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+\r
+Licensed under the Apache License, Version 2.0 (the "License");\r
+you may not use this file except in compliance with the License.\r
+You may obtain a copy of the License at\r
+\r
+    http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+Unless required by applicable law or agreed to in writing, software\r
+distributed under the License is distributed on an "AS IS" BASIS,\r
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+See the License for the specific language governing permissions and\r
+limitations under the License.\r
+\r
+-->\r
+<html>\r
+<head lang="en">\r
+<meta charset="UTF-8">\r
+<title></title>\r
+<link href="../component/thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>\r
+<link href="../component/thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet"/>\r
+<link href="../component/thirdparty/uniform/css/uniform.default.css" rel="stylesheet"/>\r
+<link href="../framework/css/ngict-component.css" rel="stylesheet" type="text/css">\r
+<link href="../component/css/ZteIctIcons/style.css" rel="stylesheet" type="text/css">\r
+<link href="./css/vim.css" rel="stylesheet" type="text/css"/>\r
+<link href="./css/skill.css" rel="stylesheet" type="text/css"/>\r
+<link href="../vendor/animate/animate.min.css" rel="stylesheet" type="text/css"/>\r
+\r
+\r
+<style>\r
+.ms-controller {\r
+       visibility: hidden\r
+}\r
+</style>\r
+\r
+</head>\r
+<body>\r
+<div class="ms-controller container-fluid" ms-controller="vimController">\r
+\r
+<div id="addVimDlg" class="modal  fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >\r
+               <div class="modal-dialog">\r
+                       <div class="modal-content Changepasswd">\r
+                               <div class="content">\r
+                                       <div class="modal-header">\r
+                                               <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>\r
+                                               <h4 id="myModalLabel" ms-text="addVim.titleName"></h4>\r
+                                       </div>\r
+                    <!-- modal body begin-->\r
+                                       <div class="modal-body">\r
+                                       <div class="alert alert-info" ms-visible="executeWait.visible">{{executeWait.text}}</div>\r
+                                       <div class="alert alert-danger " ms-visible="executeError.visible">{{executeError.text}}</div>\r
+\r
+                                       <form class="form-horizontal" id="vim_form" role="form">\r
+                                               <input type="hidden" ms-duplex="addVim.vimId"  name="vimId" class="form-control"/>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                <span id_i18n="com_zte_ums_eco_roc_vim_name" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.vimName"  name="vimName" class="form-control"/>\r
+                                                               <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                                <div class="form-group">\r
+                            <label class="control-label col-sm-3">\r
+                                <span id_i18n="com_zte_ums_eco_roc_vim_auth_url" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                            </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.url" placeholder="http://xx.xx.xx.xx:5000/v2.0" name="url" class="form-control"/> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                                       \r
+                                               </div>\r
+                                                <div class="form-group">\r
+                                                               <label class="control-label col-sm-3">\r
+                                                                       <span id_i18n="com_zte_ums_eco_roc_vim_username" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                                                       <span class="required" aria-required="true">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.userName" name="userName" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+\r
+                                                <div class="form-group">\r
+                                                               <label class="control-label col-sm-3">\r
+                                                                       <span id_i18n="com_zte_ums_eco_roc_vim_password" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                                                       <span class="required" aria-required="true">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="password" ms-duplex="addVim.password"  name="password"  class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                               <label class="control-label col-sm-3">\r
+                                                                       <span id_i18n="com_zte_ums_eco_roc_vim_tenant" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                                                       <span class="required" aria-required="true">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.tenant"  name="tenant"  class="form-control" />\r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id_i18n="com_zte_ums_eco_roc_vim_version" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.version"  name="version"  class="form-control" />\r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>                  \r
+                                               <div class="form-group">\r
+                            <label class="control-label col-sm-3">\r
+                                <span id_i18n="com_zte_ums_eco_roc_vim_vendor" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                            </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.vendor"  name="vendor"  class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id_i18n="com_zte_ums_eco_roc_vim_domain" name_i18n="com_zte_conductor_ui_i18n"></span>                                                            \r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVim.domain"  name="domain"  class="form-control" />\r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>  \r
+                                                <div class="form-group">\r
+                            <label class="control-label col-sm-3">\r
+                                <span id_i18n="com_zte_ums_eco_roc_vim_type" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                <span class="required" aria-required="true">*</span>\r
+                            </label>\r
+                                                       <div class="col-sm-7">\r
+                                <select id="vimTypeSelect"  ms-each="$vimType.selectItems" ms-duplex="addVim.vimType" >\r
+                                    <option ms-attr-value='el.cond_value'>{{el.name}}</option>\r
+                                </select>\r
+                                <span class="help-block"></span>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id_i18n="com_zte_ums_eco_roc_vim_description" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                                               <span class="" aria-required="" style="visibility: hidden;">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <textarea class="form-control" rows="3"  ms-duplex="addVim.description"  name="description"></textarea>\r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                       </form>\r
+                                       </div>\r
+                    <!-- modal body end-->\r
+                                       <div class="modal-footer">\r
+                                               <button class="btn" data-dismiss="modal" aria-hidden="true"><span id_i18n="com_zte_ums_eco_roc_vim_cancel" name_i18n="com_zte_conductor_ui_i18n"></span></button>\r
+                                               <button class="btn btn-primary" type="submit" ms-disabled="isSave" ms-click="$saveVimTable()"><span id_i18n="com_zte_ums_eco_roc_vim_save" name_i18n="com_zte_conductor_ui_i18n"></span></button>\r
+                                       </div>\r
+                               </div>\r
+\r
+                       </div>\r
+               </div>\r
+       </div>\r
+\r
+               <div class="row-fluid col-sm-12" data-name="cond_zone">\r
+            <div class="col-sm-4">\r
+                <button class= "btn white radius_l" id="app-new-btn"  ms-click="$showVimTable('', 'add')">\r
+                    <i class="ict-new"></i> <span id_i18n="com_zte_ums_eco_roc_vim_register" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                </button>\r
+            </div>\r
+           <!-- <div class="fa fa-refresh text-muted refresh-status-text"><small><span id_i18n="com_zte_ums_eco_roc_vim_status_update_time" name_i18n="com_zte_conductor_ui_i18n"></span></small><small ms-text="vimStatusTime"></small></div>-->\r
+        </div>\r
+\r
+    <div class="row-fluid col-sm-12 " ms-each-el="vimInfo">\r
+               <div class="col-sm-4 animated-panel zoomIn" style="-webkit-animation-delay: 0.1s;">\r
+                <div class="hpanel stats" >\r
+                               \r
+                    <div class="panel-body h-200" ms-hover="hpanel_show">\r
+                        <div class="pull-left">\r
+                            <span class="label label-success"  ms-text="$Status.displayActive"></span>\r
+                        </div>\r
+                        <div class="stats-icon pull-right">\r
+                            <i class="fa fa-cloud  fa-5x color_cloud"></i>\r
+                        </div>\r
+                        <div class="m-t-xl">\r
+                            <h3 ms-text="el.name"></h3>   \r
+                            <div class="font">  \r
+                                <span id_i18n="com_zte_ums_eco_roc_vim_display_type" name_i18n="com_zte_conductor_ui_i18n"></span>\r
+                                <span ms-text="el.type"></span>\r
+                                        </div>             \r
+                            <div  ms-text="el.url"></div>\r
+                         </div>\r
+                    </div>                                     \r
+                    <div class="panel-footer">\r
+                        <div  class="pull-right">\r
+                         <a class="btn btn-default btn-sm" ms-click="$showVimTable(el, 'update')"><i class="fa fa-pencil-square-o fa-lg"></i></a>\r
+                         <a class="btn btn-default btn-sm" ms-click="delVim(el)"><i class="fa fa-trash-o fa-lg"> </i></a>\r
+                         <!--<a class="btn btn-default btn-sm" ms-click="gotoChartPage(el.oid,el.name,el.user)"><i class="fa fa-pie-chart fa-lg"> </i></a>-->\r
+                        </div>\r
+                    </div>\r
+                </div>\r
+            </div>\r
+          \r
+    </div>\r
+    <div class="row-fluid">\r
+                       <div class="col-md-12">\r
+                <div class="pull-left text-muted"><small><span id_i18n="com_zte_ums_eco_roc_vim_total" name_i18n="com_zte_conductor_ui_i18n"></span> \r
+                        <span class="blue-font" ms-text="vimInfo.size()"></span> \r
+                        <span id_i18n="com_zte_ums_eco_roc_vim_metric" name_i18n="com_zte_conductor_ui_i18n"></span></small></div>  \r
+                       </div>\r
+       </div>\r
+               \r
+       </div>\r
+<script type="text/javascript" src="../component/thirdparty/jquery/jquery-1.10.2.min.js"></script>\r
+<script type="text/javascript" src="../framework/js/tools.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
+<script type="text/javascript" src="../framework/js/json2.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/bootstrap/js/bootstrap.min.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/jquery-validation/js/jquery.validate.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/jquery-validation/js/additional-methods.min.js"></script>\r
+<script type="text/javascript" src="../component/thirdparty/bootbox/bootbox.min.js"></script>\r
+<!--<script type="text/javascript" src="../component/thirdparty/cometd/cometd.js"></script>-->\r
+<!--<script type="text/javascript" src="../component/thirdparty/cometd/jquery/jquery.cometd.js"></script>-->\r
+<script type="text/javascript" src="js/loadi18nApp.js"></script> \r
+<script type="text/javascript" src="js/vim-validate.js"></script>\r
+<!--<script type="text/javascript" src="./js/client-cometd.js"></script>-->\r
+<script src="../vendor/avalon/avalon.js"></script>\r
+<script type="text/javascript" src="js/vimUtil.js"></script>\r
+<script type="text/javascript" src="js/vimController.js"></script>\r
+<script src="../vendor/bootstrap-growl/bootstrap-growl.min.js"></script>\r
+<script type="text/javascript" src="../framework/js/core/hk.min.js" ></script>\r
+</body>\r
+</html>
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/animate.min.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/animate.min.css
new file mode 100644 (file)
index 0000000..b007c1b
--- /dev/null
@@ -0,0 +1,21 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+@charset "UTF-8";/*!\r
+Animate.css - http://daneden.me/animate\r
+Licensed under the MIT license - http://opensource.org/licenses/MIT\r
+\r
+Copyright (c) 2014 Daniel Eden\r
+*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);-ms-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);-ms-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);-ms-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);-ms-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);-ms-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);-ms-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);-ms-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);-ms-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);-ms-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);-ms-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);-ms-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);-ms-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);-ms-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);-ms-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);-ms-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);-ms-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes tada{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);-ms-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);-ms-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);-ms-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}@keyframes wobble{0%{-webkit-transform:none;-ms-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);-ms-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);-ms-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);-ms-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);-ms-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);-ms-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);-ms-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);-ms-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);-ms-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);-ms-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);-ms-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);-ms-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);-ms-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);-ms-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);-ms-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);-ms-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);-ms-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);-ms-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);-ms-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);-ms-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);-ms-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);-ms-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);-ms-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);-ms-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);-ms-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);-ms-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);-ms-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);-ms-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);-ms-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);-ms-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);-ms-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);-ms-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);-ms-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);-ms-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);-ms-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);-ms-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);-ms-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);-ms-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);-ms-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);-ms-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-ms-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-ms-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);-ms-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);-ms-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);-ms-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);-ms-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);-ms-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);-ms-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);-ms-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);-ms-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);-ms-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);-ms-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);-ms-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);-ms-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);-ms-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);-ms-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);-ms-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);-ms-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0,0,1,45deg);transform:rotate(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0,0,1,45deg);-ms-transform:rotate(0,0,1,45deg);transform:rotate(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);-ms-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);-ms-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);-ms-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);-ms-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);-ms-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);-ms-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-ms-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-ms-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);-ms-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);-ms-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;-ms-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/vnfm.css b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/css/vnfm.css
new file mode 100644 (file)
index 0000000..c4b588b
--- /dev/null
@@ -0,0 +1,492 @@
+/**\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+body {\r
+       font-family: microsoft yahei !important;\r
+}\r
+\r
+/* blue pill (inspired by iTunes)\r
+*******************************************************************************/\r
+\r
+.grey {\r
+  background-color: #e5e5e5;\r
+  color: #333;\r
+}\r
+\r
+.blue {\r
+\r
+       background-color: #5b9bd1;\r
+       border-radius: 20px;\r
+       color: #fff;\r
+       font-weight: bold;\r
+       padding: 8px 0;\r
+       text-align: center;\r
+       width: 100px;\r
+}\r
+\r
+.blue:hover {\r
+       background-color: #e8f3fd;\r
+       color: #5b9bd1;\r
+}\r
+\r
+.blue.selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+.blue.selected:hover {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+       color: #fff;\r
+}\r
+\r
+p {\r
+       color: #444;\r
+       font-size: 14px;\r
+       font-weight: normal;\r
+       line-height: 21px;\r
+       margin: 0 0 12px 0;\r
+}\r
+\r
+p.credit {\r
+       border-top: 1px solid #ccc;\r
+       font-size: 14px;\r
+       line-height: 140%;\r
+       margin: 36px 0 12px 0;\r
+       padding: 8px 0 0 0;\r
+       text-align: center;\r
+}\r
+\r
+ul.column {\r
+       float: left;\r
+       list-style: none;\r
+       width: 675px;\r
+}\r
+\r
+ul.column li {\r
+       background: #eee;\r
+       -webkit-border-radius: 5px;\r
+       border-radius: 5px;\r
+       -webkit-box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       box-shadow: inset 0 1px 1px 0 #c7c7c7;\r
+       float: left;\r
+       margin: 10px 0 0 10px;\r
+       display: block;\r
+       height: 150px;\r
+       text-align: center;\r
+       width: 215px;\r
+}\r
+\r
+/* Clear Floated Elements\r
+------------------------------------------------------------------------------*/\r
+.column:after,.button-collection:after,.clearfix:after,div.project-info:after\r
+       {\r
+       clear: both;\r
+       content: ' ';\r
+       display: block;\r
+       font-size: 0;\r
+       line-height: 0;\r
+       visibility: hidden;\r
+       width: 0;\r
+       height: 0;\r
+}\r
+\r
+.container-fluid {\r
+       background-color:white !important;\r
+       min-height:500px;\r
+}\r
+\r
+.nav-tabs {\r
+       border: 0;\r
+}\r
+\r
+.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus\r
+       {\r
+       border: 0;\r
+       border-top: 3px solid #F3565D;\r
+}\r
+\r
+.nav-tabs>li>a {\r
+       border-radius: 0;\r
+}\r
+\r
+.nav-tabs>li>a:hover {\r
+       background-color: #f1f3fa;\r
+       border: 1Px solid #f1f3fa;\r
+}\r
+\r
+.c3 {\r
+       margin-top: 120px;\r
+}\r
+\r
+.skills-chart-breadcrumb {\r
+       \r
+}\r
+\r
+.blue:selected {\r
+       border: 0;\r
+       background-color: #5b9bd1;\r
+}\r
+\r
+.btn {\r
+       /* border-width: 0; */\r
+       /* padding: 7px 14px; */\r
+       /* font-size: 14px; */\r
+       /* outline: none !important; */\r
+       /* background-image: none !important; */\r
+       /* filter: none; */\r
+       /* -webkit-box-shadow: none; */\r
+       -moz-box-shadow: none;\r
+       /* box-shadow: none; */\r
+       /* text-shadow: none; */\r
+}\r
+\r
+select {\r
+       border-width: 1px;\r
+       padding: 4px 1px;\r
+       border-radius: 4px;\r
+}\r
+\r
+.input-sm {\r
+       padding: 4px 10px;\r
+}\r
+\r
+.btn-block {\r
+       display: block;\r
+       width: 100%;\r
+       padding-left: 0;\r
+       padding-right: 0;\r
+}\r
+\r
+/* Bootstrap buttons */\r
+\r
+\r
+.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active\r
+       {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       color: #333;\r
+       background-color: #ededed;\r
+       border-color: #b3b3b3;\r
+}\r
+\r
+.btn-default:active,.btn-default.active {\r
+       background-image: none;\r
+       background-color: #e0e0e0;\r
+       font-weight: bold;\r
+}\r
+\r
+.btn-default:active:hover,.btn-default.active:hover {\r
+       background-color: #e6e6e6;\r
+}\r
+\r
+.open .btn-default.dropdown-toggle {\r
+       background-image: none;\r
+}\r
+\r
+.btn-default.disabled,.btn-default.disabled:hover,.btn-default.disabled:focus,.btn-default.disabled:active,.btn-default.disabled.active,.btn-default[disabled],.btn-default[disabled]:hover,.btn-default[disabled]:focus,.btn-default[disabled]:active,.btn-default[disabled].active,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default:hover,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default.active\r
+       {\r
+       background-color: #fff;\r
+       border-color: #ccc;\r
+}\r
+\r
+.btn-default .badge {\r
+       color: #fff;\r
+       background-color: #333;\r
+}\r
+\r
+\r
+.btn-default>i[class^="icon-"],.btn-default>i[class*="icon-"] {\r
+       color: #8c8c8c;\r
+}\r
+\r
+div[data-name="tab_zone"] div {\r
+       background-color: #f1f3fa;\r
+       padding: 0px;\r
+}\r
+\r
+div[data-name="cond_zone"] div {\r
+       background-color: #fff;\r
+       margin-top: 15px;\r
+       margin-bottom: 15px;\r
+}\r
+\r
+div[data-name="res-conds-zone"] {\r
+       display: inline;\r
+}\r
+\r
+div[data-name="res-conds-zone"] select,div[data-name="res-conds-zone"] span\r
+       {\r
+       /**height:33px;*/\r
+       margin-left: 15px;\r
+       color: #5b9bd1;\r
+       border-color: #ccc;\r
+       font-weight: bold;\r
+}\r
+\r
+.input{\r
+       width:250px;\r
+  height: 34px;\r
+  padding: 6px 12px;\r
+  font-size: 14px;\r
+  line-height: 1.42857143;\r
+  color: #555;\r
+  background-color: #fff;\r
+  background-image: none;\r
+  border: 1px solid #ccc;\r
+  border-radius: 4px;\r
+  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);\r
+  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;\r
+}\r
+\r
+div.separator {\r
+       margin: 20px;\r
+}\r
+\r
+div.separator div {\r
+       text-align: center;\r
+       line-height: 0;\r
+}\r
+\r
+div.separator-line {\r
+       height: 1px !important;\r
+       width: 100%;\r
+       background: #ddd;\r
+       overflow: hidden;\r
+}\r
+\r
+.dropdown-toggle {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.calendar-date {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.range_inputs {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.btn.dropdown-toggle,.btn-group .btn.dropdown-toggle,.btn:hover,.btn:disabled,.btn[disabled],.btn:focus,.btn:active,.btn.active\r
+       {\r
+       outline: none !important;\r
+       background-image: none !important;\r
+       filter: none;\r
+       -webkit-box-shadow: none;\r
+       -moz-box-shadow: none;\r
+       box-shadow: none;\r
+       text-shadow: none;\r
+}\r
+\r
+#skills-chart-breadcrumb {\r
+       margin-bottom: 10px\r
+}\r
+\r
+/*增加daterangepicker的css*/\r
+input[name="daterange"] {\r
+       width: 220px;\r
+       line-height: 0;\r
+       height: 31px;\r
+       vertical-align: top;\r
+       margin-top: 2px;\r
+}\r
+\r
+.daterangepicker .ranges {\r
+       width: 205px;\r
+}\r
+\r
+.daterangepicker .ranges input {\r
+       width: 95px !important;\r
+}\r
+\r
+td.details-control {\r
+       background: url('../images/details_open.png') no-repeat center center;\r
+       cursor: pointer;\r
+}\r
+\r
+tr.shown td.details-control {\r
+       background: url('../images/details_close.png') no-repeat center center;\r
+}\r
+\r
+.details table td {\r
+       word-wrap: break-word;\r
+       word-break: normal;\r
+       border-top: 1px solid #dddddd;\r
+}\r
+\r
+.details table  tr:first-child td {\r
+       border-top: none;\r
+}\r
+\r
+.details table {\r
+       table-layout: fixed;\r
+       width: 100%;\r
+}\r
+\r
+td.title {\r
+       width: 10%;\r
+}\r
+\r
+table.dataTable tbody th,table.dataTable tbody td {\r
+       padding: 8px 10px;\r
+}\r
+\r
+div.dataTables_length,div.dataTables_info {\r
+       display: inline;\r
+}\r
+\r
+div.dataTables_paginate {\r
+       display: inline;\r
+       float: right;\r
+}\r
+\r
+div.pagination-panel {\r
+       margin-right: 10px;\r
+}\r
+\r
+input.pagination-panel-input {\r
+       width: 50px;\r
+}\r
+\r
+#ict_res_table_div {\r
+       margin-top: 15px;\r
+}\r
+\r
+#ict_res_table_div label {\r
+       font-weight: 100;\r
+}\r
+\r
+.daterangepicker .daterangepicker_start_input label,.daterangepicker .daterangepicker_end_input label\r
+       {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.daterangepicker .ranges .input-mini {\r
+       color: #5b9bd1;\r
+}\r
+\r
+.cancelBtn {\r
+       padding: 5px 10px 5px 10px;\r
+}\r
+\r
+.btn:focus,.btn:active:focus,.btn.active:focus {\r
+       outline: 0;\r
+}\r
+\r
+#ict_res_table_div  table {\r
+       width: 100% !important;\r
+}\r
+\r
+.control-label .required {\r
+  color: #e02222;\r
+  font-size: 12px;\r
+  padding-left: 2px;\r
+}\r
+\r
+#ict_vim_table tbody tr{\r
+       cursor:pointer;\r
+}\r
+\r
+\r
+/*卡片面板样式*/\r
+.animated-panel {\r
+  -webkit-animation-duration: .5s;\r
+  animation-duration: .5s;\r
+  -webkit-animation-fill-mode: both;\r
+  animation-fill-mode: both;\r
+}\r
+\r
+.hpanel {\r
+  background-color: none;\r
+  border: none;\r
+  box-shadow: none;\r
+  margin-bottom: 25px;\r
+    \r
+}\r
+\r
+.hpanel .panel-body {\r
+  border: 1px solid #e4e5e7;\r
+  border-radius: 2px;\r
+  padding: 20px;\r
+  position: relative;\r
+}\r
+.h-200 {\r
+  min-height: 220px;\r
+}\r
+\r
+.m-t-xl {\r
+  margin-top: 40px;\r
+}\r
+\r
+.m-t-xl div {\r
+  margin-bottom: 15px;\r
+}\r
+\r
+.text-success {\r
+  color: #0d638f;\r
+}\r
+.hpanel > .panel-footer {\r
+  color: inherit;\r
+  border: 1px solid #e4e5e7;\r
+  border-top: none;\r
+  font-size: 90%;\r
+  background: #f7f9fa;\r
+  height:40px;\r
+  padding: 5px 15px;\r
+}\r
+.color_cloud{\r
+       color:#ccc;\r
+}\r
+.stats-title{\r
+\r
+}\r
+\r
+h3{\r
+  margin-top: 10px;\r
+  margin-bottom: 40px;\r
+  font-weight: 200;\r
+}\r
+\r
+.blue-font{\r
+       color:#428bca;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right a{\r
+       margin-left: 5px;\r
+}\r
+\r
+.hpanel > .panel-footer .pull-right .btn{\r
+       min-width: 30px !important;\r
+}\r
+\r
+.font-bold {\r
+  font-weight: 600;\r
+  margin-bottom: 15px;\r
+}\r
+\r
+.hpanel_show{\r
+       background-color: #f7f9fa;\r
+}\r
+\r
+.vnfm-padding {\r
+       padding-left: 0;\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-en-US.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-en-US.properties
new file mode 100644 (file)
index 0000000..6a1f354
--- /dev/null
@@ -0,0 +1,54 @@
+#
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#         http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+
+//vnfm
+nfv-vnfm-iui-title=VNFM Manage
+nfv-vnfm-iui-message-title=vnfm info
+nfv-vnfm-iui-message-query-fail=Query vnfm failed.
+nfv-vnfm-iui-message-save-success=Save successfully.
+nfv-vnfm-iui-message-save-fail=Save failed.
+nfv-vnfm-iui-message-update-success=Update successfully.
+nfv-vnfm-iui-message-update-fail=Update failed.
+nfv-vnfm-iui-message-delete-confirm=Do you want to delete the current vnfm?
+nfv-vnfm-iui-message-delete-success=Vnfm deleted successfully.
+nfv-vnfm-iui-message-delete-fail=Vnfm deleted failed.
+
+nfv-vnfm-iui-test-update=Modify vnfm info
+nfv-vnfm-iui-text-register=Register vnfm info
+nfv-vnfm-iui-text-name=Name
+nfv-vnfm-iui-text-type=type
+nfv-vnfm-iui-text-version=version
+nfv-vnfm-iui-text-certificateUrl=certificate URL
+nfv-vnfm-iui-text-vendor=Vendor
+nfv-vnfm-iui-text-userName=Username
+nfv-vnfm-iui-text-password=Password
+nfv-vnfm-iui-text_description=description
+nfv-vnfm-iui-text-cancelBtn=cancel
+nfv-vnfm-iui-text-saveBtn=save
+nfv-vnfm-iui-text-registerBtn=Register
+nfv-vnfm-iui-text-status-normal=Normal
+nfv-vnfm-iui-text-status-fail=Alarm
+nfv-vnfm-iui-text-total=Total
+nfv-vnfm-iui-text-total-vnfm= of vnfm
+
+nfv-vnfm-iui-validate-name=Please enter a name
+nfv-vnfm-iui-validate-type=Please enter the vnfm type
+nfv-vnfm-iui-validate-version=Please enter version
+nfv-vnfm-iui-validate-vendor=Please enter vendor
+nfv-vnfm-iui-validate-vim=Please select a VIM
+nfv-vnfm-iui-validate-url-required=Please enter the URL
+nfv-vnfm-iui-validate-url=Please enter the right URL
+nfv-vnfm-iui-text-url-tip=Example: http://10.0.0.1
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-zh-CN.properties b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/i18n/nfv-nso-iui-i18n-zh-CN.properties
new file mode 100644 (file)
index 0000000..39ed473
--- /dev/null
@@ -0,0 +1,54 @@
+#
+# Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#         http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+
+//vnfm
+nfv-vnfm-iui-title=VNFM管理
+nfv-vnfm-iui-message-title=vnfm信息
+nfv-vnfm-iui-message-query-fail=查询vnfm失败。
+nfv-vnfm-iui-message-save-success=保存成功。
+nfv-vnfm-iui-message-save-fail=保存失败。
+nfv-vnfm-iui-message-update-success=修改成功。
+nfv-vnfm-iui-message-update-fail=修改失败。
+nfv-vnfm-iui-message-delete-confirm=确定删除所选vnfm信息?
+nfv-vnfm-iui-message-delete-success=删除成功
+nfv-vnfm-iui-message-delete-fail=删除失败
+
+nfv-vnfm-iui-test-update=修改vnfm信息
+nfv-vnfm-iui-text-register=注册vnfm信息
+nfv-vnfm-iui-text-name=名称
+nfv-vnfm-iui-text-type=类型
+nfv-vnfm-iui-text-version=版本
+nfv-vnfm-iui-text-certificateUrl=认证url
+nfv-vnfm-iui-text_description=描述
+nfv-vnfm-iui-text-vendor=厂商
+nfv-vnfm-iui-text-userName=接入用户
+nfv-vnfm-iui-text-password=接入密码
+nfv-vnfm-iui-text-cancelBtn=取消
+nfv-vnfm-iui-text-saveBtn=保存
+nfv-vnfm-iui-text-registerBtn=注册vnfm
+nfv-vnfm-iui-text-status-normal=正常
+nfv-vnfm-iui-text-status-fail=报警
+nfv-vnfm-iui-text-total=共
+nfv-vnfm-iui-text-total-vnfm= vnfm
+
+nfv-vnfm-iui-validate-name=请输入名称
+nfv-vnfm-iui-validate-type=请输入vnfm类型
+nfv-vnfm-iui-validate-version=请输入版本号
+nfv-vnfm-iui-validate-vendor=请输入厂商
+nfv-vnfm-iui-validate-vim=请选择VIM
+nfv-vnfm-iui-validate-url-required=请输入URL
+nfv-vnfm-iui-validate-url=请输入正确的URL
+nfv-vnfm-iui-text-url-tip=例如:http://10.0.0.1
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/commonUtil.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/commonUtil.js
new file mode 100644 (file)
index 0000000..abc4cd6
--- /dev/null
@@ -0,0 +1,128 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var commonUtil = {};\r
+commonUtil.arrayRemove = function( aryInstance , index ){\r
+    if(aryInstance == undefined || aryInstance == null){\r
+        return;\r
+    }\r
+    for(var i=0,n=0;i<aryInstance.length;i++) {\r
+        if(aryInstance[i]!=aryInstance[dx]) {\r
+            aryInstance[n++]=aryInstance[i];\r
+        }\r
+    }\r
+    aryInstance.length-=1;\r
+};\r
+\r
+//For the expansion of the Date, convert the Date to specify the format String\r
+// examples:\r
+// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423\r
+// (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2006-7-2 8:9:4.18\r
+commonUtil.parseDate = function( dateObj , format){\r
+    var o = {\r
+        "M+" : dateObj.getMonth()+1, //month\r
+        "d+" : dateObj.getDate(),    //day\r
+        "h+" : dateObj.getHours(),   //hour\r
+        "m+" : dateObj.getMinutes(), //minute\r
+        "s+" : dateObj.getSeconds(), //second\r
+        "q+" : Math.floor((dateObj.getMonth()+3)/3),  //quarter\r
+        "S" : dateObj.getMilliseconds() //millisecond\r
+    }\r
+    if(/(y+)/.test(format)) format=format.replace(RegExp.$1,\r
+        (dateObj.getFullYear()+"").substr(4 - RegExp.$1.length));\r
+    for(var k in o)\r
+        if(new RegExp("("+ k +")").test(format))\r
+            format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] :\r
+                    ("00"+ o[k]).substr((""+ o[k]).length));\r
+    return format;\r
+};\r
+\r
+//tooltip\r
+commonUtil.showMessage = function(message, type) {\r
+    $.growl({\r
+        icon: "fa fa-envelope-o fa-lg",\r
+        title: "&nbsp;&nbsp;" + $.i18n.prop("nfv-nso-iui-common-tip"),\r
+        message: message\r
+    },{\r
+        type: type\r
+    });\r
+};\r
+\r
+commonUtil.registerCometdMessage = function(url, channel, callback) {\r
+    var cometd = new $.Cometd();\r
+    var cometdURL = location.protocol + "//" + location.host + url;\r
+    cometd.configure({\r
+        url : cometdURL,\r
+        logLevel : "info"\r
+    });\r
+    // unregister websocket transport, use long-polling transport\r
+    cometd.unregisterTransport('websocket');\r
+    // store channel object parameters(this object include channel and callback function), start from arguments[1]\r
+    var _args = arguments;  \r
+\r
+    cometd.addListener("/meta/handshake", function(handshake){\r
+        if(handshake.successful === true) {\r
+            cometd.batch(function() {\r
+                //subscribe channel\r
+                cometd.subscribe(channel, function(message){\r
+                    callback.call(this, message.data);\r
+                });\r
+            });\r
+        }\r
+    });\r
+    cometd.handshake();\r
+}\r
+\r
+commonUtil.format = function() {\r
+    if(arguments.length == 0) {\r
+        return null;\r
+    }\r
+    var str = arguments[0];\r
+    for(var i=0; i<arguments.length; i++) {\r
+        var reg = new RegExp("\\{" + (i - 1) + "\\}" , "gm");\r
+        str = str.replace(reg, arguments[i]);\r
+    }\r
+    return str;\r
+}\r
+\r
+commonUtil.get = function(url, params, callback) {\r
+    $.ajax({\r
+        type : "GET",\r
+        url : url,\r
+        //contentType : contentType || "application/x-www-form-urlencoded; charset=UTF-8",\r
+        dataType : "json",\r
+        data : params || {},\r
+        success : callback\r
+    });\r
+}\r
+\r
+commonUtil.post = function(url, params, callback, contentType) {\r
+    $.ajax({\r
+        type : "POST",\r
+        url : url,\r
+        contentType : contentType || "application/x-www-form-urlencoded; charset=UTF-8",\r
+        data : params || {},\r
+        success : callback\r
+    });\r
+}\r
+\r
+commonUtil.delete = function(url, callback, contentType) {\r
+    $.ajax({\r
+        type : "DELETE",\r
+        url : url,\r
+        contentType : contentType || "application/x-www-form-urlencoded; charset=UTF-8",\r
+        success : callback\r
+    });\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js
new file mode 100644 (file)
index 0000000..c809aa2
--- /dev/null
@@ -0,0 +1,23 @@
+function loadPropertiesSideMenu(lang, fileNamePrefix, filePath){\r
+       jQuery.i18n.properties({\r
+           language:lang,\r
+           name:fileNamePrefix,\r
+           path:filePath,\r
+           mode:'map',\r
+           callback: function() {\r
+               var i18nItems = $("[name_i18n=com_zte_nfv_nsoc_i18n]");\r
+               for(var i=0;i<i18nItems.length;i++) {\r
+                       var $item = $(i18nItems.eq(i));\r
+                       var itemId = $item.attr("id");\r
+                       var itemTitle = $item.attr("title");\r
+                       if(typeof(itemTitle) != "undefined") {\r
+                               $item.attr("title", $.i18n.prop(itemId));\r
+                       } else {\r
+                               $item.text($.i18n.prop(itemId));\r
+                       }\r
+               }\r
+           }\r
+       });\r
+}\r
+var lang = getLanguage();\r
+loadPropertiesSideMenu(lang, 'nfv-nso-iui-i18n', 'i18n/');
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfm-validate.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfm-validate.js
new file mode 100644 (file)
index 0000000..ff99b9d
--- /dev/null
@@ -0,0 +1,74 @@
+$(function(){\r
+       var form = $('#vnfm_form');\r
+       var error = $('.alert-danger', form);\r
+       var success = $('.alert-success', form);\r
+\r
+       form.validate({\r
+               doNotHideMessage: true, //this option enables to show the error/success messages on tab switch.\r
+               errorElement: 'span', //default input error message container\r
+               errorClass: 'help-block', // default input error message class\r
+               focusInvalid: false, // do not focus the last invalid input\r
+               rules: {                        \r
+                       name:{\r
+                               required: true,\r
+                               maxlength:20\r
+                       },\r
+                       type:{\r
+                               required: true,\r
+                               maxlength:20\r
+                       },\r
+                       version:{\r
+                               required: true,\r
+                               maxlength:20\r
+                       },\r
+                       vendor:{\r
+                               required: true,\r
+                               maxlength:20\r
+                       },\r
+                       url:{\r
+                               required: true,\r
+                               url: true\r
+                       }\r
+               },\r
+               messages: {             \r
+                       name:{\r
+                               required: $.i18n.prop("nfv-vnfm-iui-validate-name")\r
+                       },\r
+                       type:{\r
+                               required: $.i18n.prop("nfv-vnfm-iui-validate-type")\r
+                       },\r
+                       version:{\r
+                               required: $.i18n.prop("nfv-vnfm-iui-validate-version")\r
+                       },\r
+                       vendor:{\r
+                               required: $.i18n.prop("nfv-vnfm-iui-validate-vendor")\r
+                       },\r
+                       url:{\r
+                               required: $.i18n.prop("nfv-vnfm-iui-validate-url-required"),\r
+                               url: $.i18n.prop("nfv-vnfm-iui-validate-url")\r
+                       }\r
+               },\r
+               errorPlacement: function (error, element) { // render error placement for each input type\r
+                       error.insertAfter(element); // for other inputs, just perform default behavior\r
+               },\r
+               invalidHandler: function (event, validator) { //display error alert on form submit   \r
+                       success.hide();\r
+                       error.show();\r
+               },\r
+               highlight: function (element) { // hightlight error inputs\r
+                       $(element).closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group\r
+               },\r
+               unhighlight: function (element) { // revert the change done by hightlight\r
+                       $(element).closest('.form-group').removeClass('has-error'); // set error class to the control group\r
+               },\r
+               success: function (label) {\r
+                       label.addClass('valid') // mark the current input as valid and display OK icon\r
+                               .closest('.form-group').removeClass('has-error'); // set success class to the control group\r
+               },\r
+               submitHandler: function (form) {\r
+                       success.show();\r
+                       error.hide();\r
+                       //add here some ajax code to submit your form or just call form.submit() if you want to submit the form without ajax\r
+               }\r
+       });\r
+});
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmController.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmController.js
new file mode 100644 (file)
index 0000000..8e1f8ac
--- /dev/null
@@ -0,0 +1,293 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+\r
+var vm = avalon\r
+               .define({\r
+                       $id : "vnfmController",\r
+                       vnfmInfo :  [], \r
+                       //mocSelectItems : [],\r
+                       vimSelectItems : [],    \r
+                       server_rtn:{\r
+                               info_block:false,\r
+                               warning_block:false,\r
+                               rtn_info:"",\r
+                               $RTN_SUCCESS:"RTN_SUCCESS",\r
+                               $RTN_FAILED:"RTN_FAILED"\r
+                       },      \r
+                       $Status :{\r
+                success:"active",\r
+                failed:"inactive"\r
+                       },      \r
+                       $restUrl : {\r
+                               queryVnfmInfoUrl : '/openoapi/extsys/v1/vnfms',\r
+                               addVnfmInfoUrl : '/openoapi/extsys/v1/vnfms',\r
+                               updateVnfmInfoUrl : '/openoapi/extsys/v1/vnfms/',\r
+                               delVnfmInfoUrl : '/openoapi/extsys/v1/vnfms/',\r
+                               queryMocUrl : '',\r
+                               queryVimUrl : '/openoapi/extsys/v1/vims'\r
+                       },\r
+                       $htmlText:{\r
+                               saveSuccess:$.i18n.prop("nfv-vnfm-iui-message-save-success"),\r
+                               saveFail:$.i18n.prop("nfv-vnfm-iui-message-save-fail"),\r
+                               updateSuccess:$.i18n.prop("nfv-vnfm-iui-message-update-success"),\r
+                               updateFail:$.i18n.prop("nfv-vnfm-iui-message-update-fail")\r
+                       },\r
+                       $initTable : function() {                               \r
+                               $.ajax({\r
+                       "type": 'GET',\r
+                       "url": vm.$restUrl.queryVnfmInfoUrl,\r
+                       //"dataType": "json",\r
+                       "success": function (resp) {\r
+                               for(var i=0;i<resp.length;i++){ \r
+                                        resp[i].status = vm.$Status.success;                                           \r
+                                          }\r
+                               vm.vnfmInfo = resp;                             \r
+                       },\r
+                       error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                               bootbox.alert($.i18n.prop("nfv-vnfm-iui-message-query-fail") + ":"+textStatus+":"+errorThrown);                       \r
+                           return;\r
+                       },\r
+                       complete: function() {    \r
+                               vnfmUtil.tooltipVnfmStatus();\r
+                       }\r
+                   }); \r
+                       },\r
+                       // $initMoc : function() {\r
+                       //      /*var url = vm.$restUrl.queryMocUrl;\r
+                       //     commonUtil.get(url, null, function(resp) {\r
+                       //         if (resp) {\r
+                       //             vm.addVnfm.moc = resp.data;\r
+                       //         }\r
+                       //     });*/\r
+                       //     var resp = [\r
+                       //      { id : "nfv.vnfm.eco", name : "VNFM(ECO)"},\r
+                       //      { id : "nfv.vnfm.tacker", name : "VNFM(Tacker)"},\r
+                       //      { id : "nfv.vnfm.cmcc", name : "VNFM(CMCC)"},\r
+                       //      { id : "nfv.vnfm.etsi", name : "VNFM(ETSI)"}\r
+                       //     ]\r
+                       //     vm.mocSelectItems = resp;\r
+                       // },\r
+                       $initVim : function() {\r
+                               $.ajax({\r
+                                       type : 'get',\r
+                                       url : vm.$restUrl.queryVimUrl,\r
+                                       dataType : 'json',\r
+                                       success : function(resp) {\r
+                                               if(resp) {\r
+                                                       vm.vimSelectItems = resp;\r
+                                               }\r
+                                               vm.vimSelectItems.push({"vimId":"","name":""});                                         \r
+                                       }\r
+                               });\r
+                       },\r
+                       addVnfm : {\r
+                               title : $.i18n.prop("nfv-vnfm-iui-text-register"),\r
+                               vnfmId : "",\r
+                               name : "",\r
+                               type :"",\r
+                               //moc : "",\r
+                               //mocDisabled : false,\r
+                               vimId : "",\r
+                               //vimVisiable : false,\r
+                               vendor : "",\r
+                               version :"",\r
+                               description:"",\r
+                               certificateUrl:"",\r
+                               url : "",\r
+                               urlTip : $.i18n.prop("nfv-vnfm-iui-text-url-tip"),\r
+                               userName : "",\r
+                               password : "",\r
+                               saveType :"add",\r
+                               status: ""\r
+                       },\r
+                       $showVnfmTable : function() { \r
+                               vm.addVnfm.title = $.i18n.prop("nfv-vnfm-iui-text-register"),                           \r
+                               vm.addVnfm.vnfmId = "";\r
+                               vm.addVnfm.name = "";\r
+                               vm.addVnfm.type = "";\r
+                               //vm.addVnfm.moc = "";\r
+                               //vm.addVnfm.mocDisabled = false;\r
+                               vm.addVnfm.vimId = "";\r
+                               //vm.addVnfm.vimVisiable = false;\r
+                               vm.addVnfm.vendor = "";\r
+                               vm.addVnfm.version = "";\r
+                               vm.addVnfm.description = "";\r
+                               vm.addVnfm.certificateUrl = "";\r
+                               vm.addVnfm.url = "";\r
+                               vm.addVnfm.userName = "";\r
+                               vm.addVnfm.password = "";\r
+                               vm.addVnfm.saveType = "add";\r
+                               vm.server_rtn.warning_block=false;\r
+                               vm.server_rtn.info_block=false;\r
+                               //vm.$initMoc();\r
+                               vm.$initVim();\r
+                               //vm.$mocChange();\r
+                               \r
+                               $(".form-group").each(function () {\r
+                                       $(this).removeClass('has-success');\r
+                                       $(this).removeClass('has-error');\r
+                                       $(this).find(".help-block[id]").remove();\r
+                               });\r
+                               $("#addVnfmDlg").modal("show");\r
+                       },                      \r
+                       // $getMocName : function(mocId) {\r
+         //            var items = vm.mocSelectItems;\r
+         //           for(var i=0;i<items.length;i++) {\r
+                //             if(items[i].id == mocId) {\r
+                //                     return items[i].name;\r
+                //             }\r
+                //     }\r
+                //     return "";\r
+                       // },\r
+                       $saveVnfm : function() {\r
+                               var form = $('#vnfm_form');\r
+                               if (form.valid() == false) {\r
+                                       return false;\r
+                               }                               \r
+                           vm.server_rtn.info_block=true;\r
+                vm.server_rtn.warning_block=false;                  \r
+                               vm.addVnfm.status=vm.$Status.success;\r
+\r
+                               var param = {\r
+                                       name : vm.addVnfm.name,                                                                         \r
+                                       //status : vm.addVnfm.status,\r
+                                       //moc : $("#moc").val(),\r
+                                       //vimId : vm.$getVimId($("#moc").val()),\r
+                                       vimId : $("#vimId").val(),\r
+                                       vendor : vm.addVnfm.vendor,\r
+                                       version : vm.addVnfm.version,\r
+                                       type : vm.addVnfm.type,\r
+                                       description : vm.addVnfm.description,\r
+                                       certificateUrl : vm.addVnfm.certificateUrl,\r
+                                       url : vm.addVnfm.url,\r
+                                       userName : vm.addVnfm.userName,\r
+                                       password : vm.addVnfm.password \r
+                               }\r
+                               //save VIM info\r
+                               if(vm.addVnfm.saveType == "add") {\r
+                                       $.ajax({\r
+                                               type : "POST",\r
+                                               url : vm.$restUrl.addVnfmInfoUrl,\r
+                                               data : JSON.stringify(param),\r
+                                               dataType : "json",\r
+                                               contentType : "application/json",\r
+                                               success : function(data) {\r
+                                                       vm.server_rtn.info_block=false;\r
+                                                       vm.server_rtn.warning_block=false;\r
+                                                       if (data) {\r
+                                                               vm.vnfmInfo = [];\r
+                                                               vm.$initTable();\r
+\r
+                                                               $('#addVnfmDlg').modal('hide');                                                 \r
+                                                               commonUtil.showMessage(vm.$htmlText.saveSuccess, "success");\r
+                                                       } else {\r
+                                                               vm.server_rtn.warning_block=true;\r
+                                                               vm.server_rtn.rtn_info=vm.$htmlText.saveFail;\r
+                                                               commonUtil.showMessage(vm.$htmlText.saveFail, "failed");\r
+                                                       }\r
+                                               },\r
+                                           error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                               vm.server_rtn.warning_block=true;\r
+                                               vm.server_rtn.rtn_info=textStatus+":"+errorThrown;\r
+                               vm.server_rtn.info_block=false;\r
+                        }\r
+                                       });\r
+                               } else {\r
+                                       $.ajax({\r
+                                               type : "PUT",\r
+                                               url : vm.$restUrl.updateVnfmInfoUrl+vm.addVnfm.vnfmId,\r
+                                               data : JSON.stringify(param),\r
+                                               dataType : "json",\r
+                                               contentType : "application/json",\r
+                                               success : function(data) {\r
+                                                       vm.server_rtn.info_block=false;\r
+                                                       vm.server_rtn.warning_block=false;\r
+                                                       if (data) {\r
+                                                               for(var i=0;i<vm.vnfmInfo.length;i++){\r
+                                               if(vm.vnfmInfo[i].vnfmId == vm.addVnfm.vnfmId) {\r
+                                                   vm.vnfmInfo[i].name = vm.addVnfm.name;                                                  \r
+                                                   vm.vnfmInfo[i].vimId = $("#vimId").val();\r
+                                                   vm.vnfmInfo[i].vendor = vm.addVnfm.vendor;\r
+                                                   vm.vnfmInfo[i].version = vm.addVnfm.version;\r
+                                                   vm.vnfmInfo[i].certificateUrl = vm.addVnfm.certificateUrl;\r
+                                                   vm.vnfmInfo[i].description = vm.addVnfm.description;\r
+                                                   vm.vnfmInfo[i].url = vm.addVnfm.url;\r
+                                                   vm.vnfmInfo[i].userName = vm.addVnfm.userName;\r
+                                                   vm.vnfmInfo[i].password = vm.addVnfm.password;                                                  \r
+                                               }\r
+                                               }\r
+                                                               $('#addVnfmDlg').modal('hide');                                                                         \r
+                                                               commonUtil.showMessage(vm.$htmlText.updateSuccess,"success");                                                                                   \r
+                                                       } else {\r
+                                                               vm.server_rtn.warning_block=true;\r
+                                                               vm.server_rtn.rtn_info=vm.$htmlText.updateFail;\r
+                                                               commonUtil.showMessage(vm.$htmlText.updateFail, "failed");\r
+                                                       } \r
+                                               },\r
+                                           error: function(XMLHttpRequest, textStatus, errorThrown) {\r
+                                               vm.server_rtn.warning_block=true;       \r
+                                               vm.server_rtn.rtn_info=textStatus+":"+errorThrown;                       \r
+                               vm.server_rtn.info_block=false;                                              \r
+                               }\r
+                                       });\r
+                               }                                       \r
+                       },\r
+         //            mocRendered : function(action) {\r
+                       //      if(vm.addVnfm.saveType === "update" && vm.addVnfm.moc) {\r
+                       //              var items = vm.mocSelectItems;\r
+                       //              for(var i=0;i<items.length;i++) {\r
+                       //              if(items[i].id == vm.addVnfm.moc) {\r
+                       //                      $("#moc")[0].selectedIndex = i;\r
+                       //                      vm.$mocChange();\r
+                       //                      break;\r
+                       //              }\r
+                       //      }\r
+                       //      } else {\r
+                       //              $("#moc")[0].selectedIndex = 0;\r
+                       //      }\r
+                       // },\r
+                       vimRendered : function(action) {\r
+                var items = vm.vimSelectItems;\r
+                               if(vm.addVnfm.saveType === "update") {  \r
+                                       for(var i=0;i<items.length;i++) {\r
+                                       if(items[i].vimId == vm.addVnfm.vimId) {\r
+                                               $("#vimId")[0].selectedIndex = i;\r
+                                               break;\r
+                                       }\r
+                               }\r
+                               } else {\r
+                                       $("#vimId")[0].selectedIndex = items.length-1;\r
+                               }\r
+                       },\r
+                       // $mocChange : function() {\r
+                       //      var mocId = $('#moc').val();\r
+                       //      if(mocId == "nfv.vnfm.tacker") {\r
+                       //              vm.addVnfm.vimVisiable = true;\r
+                       //      } else {\r
+                       //              vm.addVnfm.vimVisiable = false;\r
+                       //      }\r
+                       // },\r
+                       // $getVimId : function(mocId) {\r
+                       //      if(vm.addVnfm.vimVisiable) {\r
+                       //              return $("#vimId").val();\r
+                       //      } else {\r
+                       //              return "";\r
+                       //      }\r
+                       // }\r
+       });\r
+avalon.scan();\r
+vm.$initTable();\r
+//vm.$initMoc();
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmUtil.js b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/js/vnfmUtil.js
new file mode 100644 (file)
index 0000000..fc3fe17
--- /dev/null
@@ -0,0 +1,77 @@
+/*\r
+ * Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+ *\r
+ * Licensed under the Apache License, Version 2.0 (the "License");\r
+ * you may not use this file except in compliance with the License.\r
+ * You may obtain a copy of the License at\r
+ *\r
+ *         http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software\r
+ * distributed under the License is distributed on an "AS IS" BASIS,\r
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ * See the License for the specific language governing permissions and\r
+ * limitations under the License.\r
+ */\r
+var vnfmUtil = {};\r
+\r
+vnfmUtil.delVnfm = function(vnfmId) {\r
+       bootbox.confirm($.i18n.prop("nfv-vnfm-iui-message-delete-confirm"), function(result){\r
+               if(result){\r
+                       $.ajax({\r
+                               type : "DELETE",\r
+                               url : vm.$restUrl.delVnfmInfoUrl + vnfmId,\r
+                               dataType : "json",\r
+                               success : function(data,statusText,jqXHR) {\r
+                                       if(jqXHR.status=="204") {\r
+                                               for(var i=0;i<vm.vnfmInfo.length;i++){\r
+                               if(vnfmId == vm.vnfmInfo[i].vnfmId){\r
+                                       //delete the vnfm object from vnfm array\r
+                                   vm.vnfmInfo.splice(i, 1);\r
+                                   break;\r
+                               }\r
+                           }\r
+                           commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-success"), "success");\r
+                                       } else {\r
+                                               commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-fail"), "warning");\r
+                                       }\r
+                               }, \r
+                               error : function() {\r
+                                       commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-fail"), "warning");\r
+                               }\r
+                       });\r
+           }\r
+       });\r
+}\r
+\r
+vnfmUtil.updateVnfm = function(data) {\r
+       vm.addVnfm.vnfmId = data.vnfmId;\r
+       vm.addVnfm.name = data.name;\r
+       //vm.addVnfm.moc = data.moc;\r
+       //vm.addVnfm.mocDisabled = true;\r
+       vm.addVnfm.vendor = data.vendor;\r
+       vm.addVnfm.version = data.version;\r
+       vm.addVnfm.description = data.description;\r
+       vm.addVnfm.type = data.type;\r
+       vm.addVnfm.vimId = data.vimId;\r
+       vm.addVnfm.url = data.url;\r
+       vm.addVnfm.userName = data.userName;\r
+       vm.addVnfm.password = data.password;\r
+       vm.addVnfm.saveType = "update";\r
+       vm.addVnfm.title = $.i18n.prop("nfv-vnfm-iui-test-update");\r
+       vm.server_rtn.info_block=false;\r
+       vm.server_rtn.warning_block=false;\r
+       //vm.$initMoc();\r
+       vm.$initVim();\r
+\r
+       $(".form-group").each(function () {\r
+               $(this).removeClass('has-success');\r
+               $(this).removeClass('has-error');\r
+               $(this).find(".help-block[id]").remove();\r
+       });\r
+       $("#addVnfmDlg").modal("show");\r
+}\r
+\r
+vnfmUtil.tooltipVnfmStatus = function() {\r
+       $("[data-toggle='tooltip']").tooltip();\r
+}
\ No newline at end of file
diff --git a/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/vnfmView.html b/openo-portal/portal-extsys/src/main/webapp/extsys/vnfm/vnfmView.html
new file mode 100644 (file)
index 0000000..75bb025
--- /dev/null
@@ -0,0 +1,222 @@
+<!--\r
+\r
+    Copyright (C) 2015 ZTE, Inc. and others. All rights reserved. (ZTE)\r
+\r
+    Licensed under the Apache License, Version 2.0 (the "License");\r
+    you may not use this file except in compliance with the License.\r
+    You may obtain a copy of the License at\r
+\r
+            http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+    Unless required by applicable law or agreed to in writing, software\r
+    distributed under the License is distributed on an "AS IS" BASIS,\r
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+    See the License for the specific language governing permissions and\r
+    limitations under the License.\r
+\r
+-->\r
+<!DOCTYPE html>\r
+<html>\r
+<head lang="en">\r
+<meta charset="UTF-8">\r
+<title></title>\r
+<link href="../component/thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet" />\r
+<link href="../component/thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet" />\r
+<link href="../component/thirdparty/uniform/css/uniform.default.min.css" rel="stylesheet" />\r
+<link href="../component/css/ZteIctIcons/style.css" rel="stylesheet"/>\r
+<link href="../framework/css/ngict-component.css" rel="stylesheet"/>\r
+<link href="css/animate.min.css" rel="stylesheet"/>\r
+<link href="css/vnfm.css" rel="stylesheet" />\r
+<style>\r
+.ms-controller {\r
+       visibility: hidden\r
+}\r
+</style>\r
+\r
+</head>\r
+<body>\r
+       <div ms-controller="vnfmController" class="container-fluid ms-controller">\r
+       <div id="addVnfmDlg" class="modal  fade" tabindex="-1" role="dialog"\r
+               aria-labelledby="myModalLabel" aria-hidden="true" >\r
+               <div class="modal-dialog">\r
+                       <div class="modal-content Changepasswd">\r
+                               <div class="content">\r
+                                       <div class="modal-header">\r
+                                               <button type="button" class="close" data-dismiss="modal"\r
+                                                       aria-hidden="true">×</button>\r
+                                               <h4 id="myModalLabel">{{addVnfm.title}}</h4>\r
+                                       </div>\r
+                                       <div class="modal-body">                                \r
+                                       <form class="form-horizontal" id="vnfm_form" role="form">\r
+                                               <input type="hidden" ms-duplex="addVnfm.vnfmId"  name="vnfmId" class="form-control" />\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-name" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.name"  name="name" class="form-control"/>\r
+                                                               <span class="help-block"></span>\r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.type"  name="type" class="form-control"/>\r
+                                                               <span class="help-block"></span>\r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-vendor" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.vendor" name="vendor" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-version" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.version" name="version" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span>URL</span>\r
+                                                               <span class="required" aria-required="true">*</span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.url" name="url" class="form-control" \r
+                                                                       ms-attr-placeholder="addVnfm.urlTip"/> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group" >\r
+                                                       <label class="col-sm-3 control-label">VIM\r
+                                                               <span></span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <select class="form-control" id="vimId" name="vimId">\r
+                                                                       <option ms-repeat-vim="vimSelectItems" ms-attr-value="vim.vimId" data-repeat-rendered="vimRendered">{{vim.name}}</option>\r
+                                                               </select>\r
+                                                       </div>\r
+                                               </div>                                          \r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-certificateUrl" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.certificateUrl" name="certificateUrl" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>                                          \r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-userName" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="text" ms-duplex="addVnfm.userName" name="userName" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text-password" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                       </label>\r
+                                                       <div class="col-sm-7">\r
+                                                               <input type="password" ms-duplex="addVnfm.password" name="password" class="form-control" /> \r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="form-group">\r
+                                                       <label class="control-label col-sm-3">\r
+                                                               <span id="nfv-vnfm-iui-text_description" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                                                               <span class="" aria-required="" style="visibility: hidden;">*</span>\r
+                                                               </label>\r
+                                                        <div class="col-sm-7">\r
+                                                               <textarea class="form-control" rows="3"  ms-duplex="addVnfm.description"  name="description"></textarea>\r
+                                                               <span class="help-block"></span>                        \r
+                                                       </div>                                                  \r
+                                               </div>\r
+                                       </form>\r
+\r
+                                       </div>\r
+                                       <div class="modal-footer">\r
+                                               <button class="btn" data-dismiss="modal" aria-hidden="true" id="nfv-vnfm-iui-text-cancelBtn" name_i18n="com_zte_nfv_nsoc_i18n"></button>\r
+                                               <button class="btn btn-primary" type="submit" ms-click="$saveVnfm" id="nfv-vnfm-iui-text-saveBtn" name_i18n="com_zte_nfv_nsoc_i18n"></button>\r
+                                       </div>\r
+                               </div>\r
+                       </div>\r
+               </div>\r
+       </div>\r
+       <div class="row-fluid" data-name="cond_zone">\r
+               <div class="col-md-12">                         \r
+                       <button class="btn white radius_l" id="app-new-btn" ms-click="$showVnfmTable" >\r
+                       <i class="ict-new"></i> <span id="nfv-vnfm-iui-text-registerBtn" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                   </button>\r
+               </div>\r
+       </div>\r
+\r
+       <div class="col-sm-12 vnfm-padding" ms-each-el="vnfmInfo">\r
+               <div class="col-sm-4 animated-panel zoomIn" style="-webkit-animation-delay: 0.1s;">\r
+            <div class="hpanel stats" >\r
+                <div class="panel-body h-200"  ms-hover="hpanel_show" >\r
+                    <div class="pull-left">\r
+                        <span class="label label-success" ms-if="el.status === $Status.success" id="nfv-vnfm-iui-text-status-normal" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                        <span class="label label-danger" ms-attr-title="el.errorInfo"   data-toggle="tooltip"   ms-if="el.status === $Status.failed" id="nfv-vnfm-iui-text-status-fail" name_i18n="com_zte_nfv_nsoc_i18n"></span>\r
+                    </div>\r
+                    <div class="stats-icon pull-right">\r
+                        <i class="fa fa-server  fa-5x color_cloud"></i>\r
+                    </div>\r
+                    <div class="m-t-xl">\r
+                        <h3 ms-text="el.name"></h3>   \r
+                        <div><span id="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>:<span ms-text="el.type"></span></div>\r
+                        <div>URL:<span ms-text="el.url"></span></div>\r
+                    </div>\r
+                </div>\r
+                <div class="panel-footer">\r
+                    <div  class="pull-right">\r
+                       <a class="btn btn-default btn-sm" ms-click="vnfmUtil.updateVnfm(el.$model)"><i class="fa fa-pencil-square-o fa-lg"></i></a>\r
+                       <a class="btn btn-default btn-sm" ms-click="vnfmUtil.delVnfm(el.vnfmId)"><i class="fa fa-trash-o fa-lg"> </i></a>\r
+                    </div>\r
+                </div>\r
+            </div>\r
+        </div>       \r
+    </div>\r
+    <div class="col-sm-12">\r
+        <div class="pull-left text-muted">\r
+               <small><span id="nfv-vnfm-iui-text-total" name_i18n="com_zte_nfv_nsoc_i18n"></span> <span class="blue-font" ms-text="vnfmInfo.size()"></span> <span id="nfv-vnfm-iui-text-total-vnfm" name_i18n="com_zte_nfv_nsoc_i18n"></span></small>\r
+        </div>  \r
+       </div>\r
+       </div>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery/jquery-1.10.2.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/bootstrap/js/bootstrap.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/bootbox/bootbox.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery-validation/js/jquery.validate.min.js"></script>\r
+       <script type="text/javascript" src="../component/thirdparty/jquery-validation/js/additional-methods.min.js"></script>\r
+       \r
+       <script type="text/javascript" src="../vendor/bootstrap-growl/bootstrap-growl.min.js"></script>\r
+       <script type="text/javascript" src="../vendor/cometd/cometd.js"></script>\r
+       <script type="text/javascript" src="../vendor/cometd/jquery.cometd.js"></script>\r
+       <script type="text/javascript" src="../vendor/avalon/avalon.js"></script>\r
+\r
+       <script type="text/javascript" src="../framework/js/tools.js"></script>\r
+       \r
+       <script type="text/javascript" src="js/commonUtil.js"></script>\r
+       <script type="text/javascript" src="js/loadi18n_nsoc.js"></script>\r
+       \r
+       <script type="text/javascript" src="js/vnfm-validate.js"></script>\r
+       <script type="text/javascript" src="js/vnfmUtil.js"></script>\r
+       <script type="text/javascript" src="js/vnfmController.js"></script>\r
+</body>\r
+</html>
\ No newline at end of file