share

i18n/en_US.json

@@ -157,5 +157,6 @@
     "toggle_comment": "Toggle Comment",
     "find_in_files": "Find in Files",
     "email": "Email",
-    "no_empty": "Can not Empty!"
+    "no_empty": "Can not Empty!",
+    "change_avatar": "Avatar modify go"
 }

i18n/ja_JP.json

@@ -157,5 +157,6 @@
     "toggle_comment": "トグルコメント",
     "find_in_files": "ファイルから検索",
     "email": "Eメール",
-    "no_empty": "空ではありません"
+    "no_empty": "空ではありません",
+    "change_avatar": "アバターの変更は行く"
 }

i18n/zh_CN.json

@@ -157,5 +157,6 @@
     "toggle_comment": "注释",
     "find_in_files": "在文件中查找",
     "email": "电子邮件",
-    "no_empty": "不能为空"
+    "no_empty": "不能为空",
+    "change_avatar": "头像修改请到"
 }

i18n/zh_TW.json

@@ -157,5 +157,6 @@
     "toggle_comment": "註釋",
     "find_in_files": "在文件中查找",
     "email": "電子郵件",
-    "no_empty": "不能為空"
+    "no_empty": "不能為空",
+    "change_avatar": "頭像修改請到"
 }

static/css/base.css

@@ -57,6 +57,19 @@ ul {
     box-sizing: border-box;
 }
 
+a {
+    color: #4183c4;
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+img {
+    vertical-align: middle;
+}
+
 input,
 button {
     font-family: Helvetica;

static/css/fonts/icomoon.svg

@@ -29,7 +29,6 @@
 <glyph unicode="&#xe613;" d="M128 682.666v128h896v-640h-128v-128h-896v640h128zM896 256h42.668v469.334h-725.332v-42.666h682.668v-426.668zM85.332 128h725.332v469.334h-725.332v-469.334z" />
 <glyph unicode="&#xe614;" d="M0 544v-192c0-17.672 14.328-32 32-32h960c17.672 0 32 14.328 32 32v192c0 17.672-14.328 32-32 32h-960c-17.672 0-32-14.328-32-32z" />
 <glyph unicode="&#xe615;" d="M576 711.628v248.372l384-384-384-384v253.824c-446.75 10.482-427.588-303.792-313.86-509.824-280.712 303.414-221.1 789.57 313.86 775.628z" />
-<glyph unicode="&#xe616;" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM768 613.49l-165.488-165.49 165.488-165.488v-90.512h-90.512l-165.488 165.488-165.49-165.488h-90.51v90.512l165.49 165.488-165.49 165.49v90.51h90.51l165.49-165.49 165.488 165.49h90.512v-90.51z" />
 <glyph unicode="&#xe617;" d="M384 448h-320v128h320v128l192-192-192-192zM1024 960v-832l-384-192v192h-384v256h64v-192h320v576l256 128h-576v-256h-64v320z" />
 <glyph unicode="&#xe618;" d="M768 320v128h-320v128h320v128l192-192zM704 384v-256h-320v-192l-384 192v832h704v-320h-64v256h-512l256-128v-576h256v192z" />
 <glyph unicode="&#xe619;" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM256 704h512c9.138 0 18.004-1.962 26.144-5.662l-282.144-329.168-282.144 329.17c8.14 3.696 17.006 5.66 26.144 5.66zM192 256v384c0 1.34 0.056 2.672 0.14 4l187.664-218.942-185.598-185.598c-1.444 5.336-2.206 10.886-2.206 16.54zM768 192h-512c-5.654 0-11.202 0.762-16.54 2.208l182.118 182.118 90.422-105.498 90.424 105.494 182.116-182.12c-5.34-1.44-10.886-2.202-16.54-2.202zM832 256c0-5.654-0.762-11.2-2.206-16.54l-185.6 185.598 187.666 218.942c0.084-1.328 0.14-2.66 0.14-4v-384z" />
@@ -40,6 +39,8 @@
 <glyph unicode="&#xe61e;" d="M384 128h640v-128h-640zM384 512h640v-128h-640zM384 896h640v-128h-640zM192 960v-256h-64v192h-64v64zM128 434v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM256 256v-320h-192v64h128v64h-128v64h128v64h-128v64z" />
 <glyph unicode="&#xe61f;" d="M864 256c-45.16 0-85.92-18.738-115.012-48.83l-431.004 215.502c1.314 8.252 2.016 16.706 2.016 25.328s-0.702 17.076-2.016 25.326l431.004 215.502c29.092-30.090 69.852-48.828 115.012-48.828 88.366 0 160 71.634 160 160s-71.634 160-160 160-160-71.634-160-160c0-8.622 0.704-17.076 2.016-25.326l-431.004-215.504c-29.092 30.090-69.852 48.83-115.012 48.83-88.366 0-160-71.636-160-160 0-88.368 71.634-160 160-160 45.16 0 85.92 18.738 115.012 48.828l431.004-215.502c-1.312-8.25-2.016-16.704-2.016-25.326 0-88.368 71.634-160 160-160s160 71.632 160 160c0 88.364-71.634 160-160 160z" />
 <glyph unicode="&#xe620;" d="M0 343.808l321.344-206.624v149.152l-191.328 118.144 191.328 118.144v150.176l-321.344-207.68v-121.312zM389.312 64h110.592l162.048 768h-111.328l-161.312-768zM702.688 672.8v-150.176l191.264-118.144-191.264-118.112v-149.152l321.312 206.592v121.312l-321.312 207.68z" />
+<glyph unicode="&#xe621;" d="M428.222 493.19c-144.194-6.656-260.742-83.888-260.742-180.224 0-96.202 116.574-168.528 260.742-161.792 144.302 6.576 261.094 96.876 261.094 193.078 0 96.12-116.79 155.594-261.094 148.938zM526.472 250.88c-44.168-56.994-131.53-84.802-216.36-38.858-40.394 21.908-38.884 64.916-38.884 64.916s-16.76 135.842 128.27 152.818c145.192 16.816 171.116-121.856 126.976-178.876zM429.19 341.854c-9.298-6.736-11.182-19.618-6.144-27.62 4.85-8.22 16.142-9.162 25.276-2.318 8.974 7.086 12.45 19.428 7.572 27.62-4.798 7.976-15.952 10.294-26.704 2.318zM360.448 323.154c-27.108-2.802-46.484-26.408-46.484-48.99 0-22.636 21.826-38.264 48.882-35.086 26.974 3.072 48.908 23.928 48.908 46.484 0.054 22.636-20.184 40.582-51.308 37.592zM868.082 960h-712.22c-86.096 0-155.89-69.794-155.89-155.89v-712.22c0-86.096 69.794-155.89 155.89-155.89h712.22c86.096 0 155.89 69.794 155.89 155.89v712.22c0 86.096-69.768 155.89-155.89 155.89zM818.202 280.386c-59.446-126.274-255.462-187.716-400.734-176.344-138.050 10.86-315.526 56.724-333.878 223.798 0 0-9.7 75.668 63.65 173.568 0 0 105.498 147.322 228.378 189.36 122.988 41.85 137.35-28.968 137.35-70.818-6.548-35.49-18.782-56.374 27.38-42.038 0 0 120.886 56.076 170.658 6.332 40.126-40.152 6.63-95.42 6.63-95.42s-16.654-18.404 17.624-25.034c34.358-6.872 142.362-56.914 82.944-183.404zM698.988 629.274c-13.15 0-23.714 10.644-23.714 23.688 0 13.286 10.562 23.956 23.714 23.956 0 0 148.212 27.404 130.48-131.852 0-0.942-0.108-1.698-0.322-2.534-1.672-11.29-11.586-19.94-23.256-19.94-13.204 0-23.956 10.562-23.956 23.74 0-0.026 23.498 106.416-82.944 82.944zM949.518 501.894h-0.216c-3.908-26.948-17.274-29.104-33.198-29.104-19.052 0-34.438 11.964-34.438 31.044 0 16.52 6.846 33.308 6.846 33.308 2.020 6.952 18.136 50.176-10.644 114.796-52.708 88.522-158.856 89.816-171.384 84.776-12.638-4.958-31.286-7.436-31.286-7.436-19.188 0-34.548 15.602-34.548 34.572 0 15.926 10.644 29.4 25.196 33.524 0 0 0.322 0.538 0.808 0.62 1.052 0.216 2.13 1.268 3.26 1.374 14.794 2.83 67.476 13.178 118.702 1.186 91.648-21.396 217.52-110.026 160.904-298.658z" />
+<glyph unicode="&#xe622;" d="M1023.972 804.11c0 86.096-69.794 155.89-155.89 155.89h-712.22c-86.096 0-155.89-69.794-155.89-155.89v-712.22c0-86.096 69.794-155.89 155.89-155.89h712.22c86.096 0 155.89 69.794 155.89 155.89v712.22zM133.524 60.794c1.024-12.316-8.218-43.952-20.562-43.952h-2.264c-11.426 0-21.18 28.24-22.284 39.962-17.058 190.14 42.982 344.172 96.66 423.692 19.32 28.916 39.128 52.708 57.074 71.626-4.474 10.24-6.98 21.558-6.98 33.524 0 46.216 37.646 83.592 83.86 83.592 46.484 0 83.7-37.376 83.7-83.592 0-46.51-37.24-83.86-83.7-83.86-17.838 0-34.276 5.632-47.94 15.092-15.872-16.95-33.064-47.884-49.746-73.054-71.114-106.442-100.892-241.986-87.82-383.030zM315.31 328.004c-19.080 0-38.4 2.102-56.832 6.198-12.18 2.884-19.43 15.010-16.924 26.894 2.938 12.26 14.794 19.832 26.892 16.976 15.226-3.504 31.016-5.202 46.86-5.202 114.878 0 208.194 93.32 208.194 207.926 0 114.634-93.32 207.952-208.194 207.952-114.606 0-208.088-93.318-208.088-207.952 0-33.254 7.6-65.268 22.824-94.856 5.848-10.94 1.482-24.522-9.862-30.1-11.076-5.902-24.414-1.536-30.154 9.566-18.296 35.382-27.756 75.508-27.756 115.362 0 139.534 113.474 253.036 253.036 253.036 139.642 0 253.196-113.502 253.196-253.036-0.028-139.292-113.582-252.766-253.198-252.766zM785.866 622.162c-22.42-0.486-45.218 4.204-65.698 13.932-71.464 34.008-101.996 119.726-67.988 191.272 33.9 71.49 119.726 101.996 191.272 67.988 71.49-33.874 102.024-119.836 67.852-191.112-4.958-9.836-10.428-19.212-17.14-27.674-4.23-5.47-12.45-6.466-17.948-2.102s-6.36 12.45-1.994 17.948c5.496 6.846 10.212 14.712 13.958 22.798 28.024 58.718 3.1 129.346-55.808 156.968-58.798 28.024-129.186 3.126-156.968-55.942-28.294-58.664-3.26-129.052 55.7-157.076 17.058-8.004 35.462-11.992 54.056-11.236 7.086 0.134 13.068-5.336 13.204-12.45 0.322-7.114-5.308-12.934-12.504-13.312zM1001.284 534.448c-0.162-0.648-0.432-0.862-0.432-1.24-2.938-5.9-9.674-8.73-16.062-6.466-101.538 37.484-155.972 101.026-183.646 147.86-9.944 16.95-17.164 33.038-22.42 46.7-6.576 0.162-12.854 1.886-18.782 4.5-24.064 11.454-34.062 39.614-22.69 63.408 11.21 23.688 39.478 33.792 63.272 22.42 23.688-11.318 33.658-39.64 22.582-63.272-4.366-9-11.346-16.194-19.482-20.696 5.012-12.476 11.48-26.302 20.318-40.986 37.16-62.41 94.316-108.168 169.58-135.924 6.71-2.614 9.972-9.702 7.76-16.302z" />
 <glyph unicode="&#xf00a;" d="M512 960c-282.75 0-512-229.25-512-512 0-226.25 146.688-418.126 350.156-485.812 25.594-4.688 34.938 11.126 34.938 24.626 0 12.188-0.468 52.562-0.718 95.312-142.376-30.938-172.468 60.376-172.468 60.376-23.312 59.126-56.844 74.876-56.844 74.876-46.532 31.75 3.53 31.126 3.53 31.126 51.406-3.562 78.47-52.75 78.47-52.75 45.688-78.25 119.876-55.626 149-42.5 4.654 33 17.904 55.626 32.5 68.376-113.656 12.938-233.218 56.876-233.218 253.062 0 55.938 19.968 101.562 52.656 137.406-5.218 13-22.844 65.094 5.062 135.562 0 0 42.938 13.75 140.812-52.5 40.812 11.406 84.594 17.032 128.126 17.22 43.5-0.188 87.312-5.876 128.188-17.28 97.688 66.312 140.688 52.5 140.688 52.5 28-70.532 10.376-122.562 5.126-135.5 32.812-35.844 52.626-81.47 52.626-137.406 0-196.688-119.75-240-233.812-252.688 18.438-15.876 34.75-47 34.75-94.75 0-68.438-0.688-123.626-0.688-140.5 0-13.626 9.312-29.562 35.25-24.562 203.312 67.812 349.876 259.688 349.876 485.812 0 282.75-229.25 512-512 512z" />
 <glyph unicode="&#xf021;" d="M863.428 356.572q0-2.856-0.572-4-36.572-153.144-153.144-248.286t-273.142-95.144q-83.43 0-161.43 31.428t-139.144 89.714l-73.714-73.714q-10.856-10.856-25.714-10.856t-25.714 10.856-10.856 25.714v256q0 14.856 10.856 25.714t25.714 10.856h256q14.856 0 25.714-10.856t10.858-25.714-10.856-25.714l-78.286-78.286q40.57-37.714 92-58.286t106.858-20.572q76.572 0 142.856 37.144t106.286 102.286q6.286 9.714 30.286 66.856 4.572 13.144 17.144 13.144h109.714q7.428 0 12.856-5.428t5.428-12.856zM877.714 813.714v-256q0-14.856-10.856-25.714t-25.714-10.856h-256q-14.856 0-25.714 10.856t-10.856 25.714 10.856 25.714l78.856 78.856q-84.572 78.286-199.428 78.286-76.572 0-142.856-37.142t-106.286-102.286q-6.286-9.714-30.286-66.858-4.57-13.144-17.144-13.144h-113.714q-7.43 0-12.856 5.428t-5.43 12.856v4q37.144 153.144 154.286 248.286t274.286 95.142q83.428 0 162.286-31.714t140-89.428l74.286 73.714q10.856 10.856 25.714 10.856t25.714-10.856 10.856-25.714z" />
 <glyph unicode="&#xf05b;" d="M684 374.856h-62.286q-14.856 0-25.714 10.856t-10.856 25.714v73.144q0 14.856 10.856 25.714t25.714 10.858h62.286q-18.286 61.714-64.286 107.714t-107.714 64.286v-62.286q0-14.858-10.858-25.714t-25.714-10.856h-73.142q-14.856 0-25.714 10.856t-10.858 25.714v62.286q-61.714-18.286-107.714-64.286t-64.286-107.714h62.286q14.858 0 25.714-10.856t10.856-25.714v-73.142q0-14.856-10.856-25.714t-25.714-10.856h-62.286q18.286-61.714 64.286-107.714t107.714-64.286v62.286q0 14.856 10.856 25.714t25.714 10.856h73.142q14.856 0 25.714-10.856t10.858-25.714v-62.286q61.714 18.286 107.714 64.286t64.286 107.714zM877.714 484.572v-73.144q0-14.856-10.856-25.714t-25.714-10.856h-81.714q-21.144-92-88.286-159.144t-159.144-88.286v-81.714q0-14.856-10.856-25.714t-25.714-10.856h-73.142q-14.856 0-25.714 10.856t-10.858 25.714v81.714q-92 21.144-159.144 88.286t-88.286 159.144h-81.714q-14.856 0-25.714 10.856t-10.856 25.714v73.144q0 14.856 10.856 25.714t25.714 10.858h81.714q21.144 92 88.286 159.144t159.144 88.286v81.714q0 14.856 10.856 25.714t25.714 10.856h73.142q14.856 0 25.714-10.856t10.858-25.714v-81.714q92-21.142 159.144-88.286t88.286-159.144h81.714q14.856 0 25.714-10.856t10.856-25.714z" />

static/css/wide.css

@@ -36,6 +36,38 @@
     line-height: 20px;
 }
 
+.ico-share:before {
+    content: "\e61f";
+}
+
+.ico-github:before {
+    content: "\f00a";
+}
+
+.ico-tencent:before {
+    content: "\e622";
+}
+
+.ico-weibo:before {
+    content: "\e621";
+}
+
+.ico-googleplus:before {
+    content: "\e61a";
+}
+
+.ico-twitter:before {
+    content: "\e61c";
+}
+
+.ico-email:before {
+    content: "\e619";
+}
+
+.ico-facebook:before {
+    content: "\e61b";
+}
+
 .ico-moveup:before {
     content: "\f148";
 }
@@ -247,6 +279,11 @@
     margin: 0 5px 0 0px
 }
 
+.menu img.gravatar {
+    float: left;
+    margin: 2px 8px;
+}
+
 #buildRun {
     color: #6DB14C;
     padding: 0px 3px 0 5px;
@@ -258,6 +295,25 @@
     color: #9d0000;
     padding: 0 4px 0 4px;
 }
+
+.share-panel {
+    position: absolute;
+    z-index: 20;
+    width: 226px;
+    padding: 5px 0;
+    right: 0px;
+}
+
+.share-panel .font-ico {
+    font-size: 20px;
+    transition:all .2s ease-out 0s;
+    margin: 0 5px;
+    width: 24px;
+}
+
+.share-panel .font-ico:hover {
+    transform:rotate(360deg);
+}
 /* end menu */
 
 /* start editor */

static/js/menu.js

@@ -19,12 +19,39 @@ var menu = {
         this.subMenu();
         this._initPreference();
         this._initAbout();
+        this._initShare();
 
         // 点击子菜单后消失
         $(".frame li").click(function () {
             $(this).closest(".frame").hide();
             $(".menu > ul > li > a, .menu > ul> li > span").removeClass("selected");
         });
+
+
+    },
+    _initShare: function () {
+        $(".menu .ico-share").hover(function () {
+            $(".menu .share-panel").show();
+        });
+
+        $(".share-panel .font-ico").click(function () {
+            var key = $(this).attr('class').split('-')[2];
+            var title = encodeURIComponent($('title').text() + '. \n' + $('meta[name=description]').attr('content')),
+                    url = "http://wide.b3log.org",
+                    pic = 'http://wide.b3log.org/static/images/wide-logo.png';
+            var urls = {};
+            urls.email = "mailto:?subject=" + $('title').text() 
+                    + "body=" + $('meta[name=description]').attr('content') + ' ' + url;
+            urls.twitter = "https://twitter.com/intent/tweet?status=" 
+                    + $('meta[name=description]').attr('content') + " " + url;
+            urls.facebook = "https://www.facebook.com/sharer/sharer.php?u=" + url;
+            urls.googleplus = "https://plus.google.com/share?url=" + url;
+            urls.weibo = "http://v.t.sina.com.cn/share/share.php?title=" +
+                    title + "&url=" + url + "&pic=" + pic;
+            urls.tencent = "http://share.v.t.qq.com/index.php?c=share&a=index&title=" + title +
+                    "&url=" + url + "&pic=" + pic;
+            window.open(urls[key], "_blank", "top=100,left=200,width=648,height=618");
+        });
     },
     _initAbout: function () {
         $("#dialogAbout").load(config.context + '/about', function () {

views/index.html

@@ -7,6 +7,7 @@
         <meta name="keywords" content="Wide, Golang, IDE, Teaam, Cloud, B3log"/>
         <meta name="description" content="A Web-based IDE for Teams using Golang, do your development anytime, anywhere."/>
         <meta name="author" content="B3log">
+        <meta property="og:description" content="A Web-based IDE for Teams using Golang, do your development anytime, anywhere."/>
 
         <link rel="stylesheet" href="{{.conf.StaticServer}}/static/js/lib/codemirror-{{.codeMirrorVer}}/codemirror.css">
         <link rel="stylesheet" href="{{.conf.StaticServer}}/static/js/lib/codemirror-{{.codeMirrorVer}}/addon/hint/show-hint.css">
@@ -341,7 +342,25 @@
                     </div>                    
                 </li>
             </ul>
+            <span class="split"></span>
             <span id="buildRun" onclick="menu.run()" class="font-ico ico-buildrun" title="{{.i18n.build_n_run}}"></span>
+
+            <div class="fn-right">
+                <img class="gravatar"
+                     src="http://secure.gravatar.com/avatar/{{.user.Gravatar}}?s=17&d=http://symphony.b3log.org/images/user-thumbnail.png" 
+                     title="{{.user.Name}}"/>
+                <span class="font-ico ico-share"></span> &nbsp;
+                <span onclick="window.open('https://github.com/b3log/wide')"
+                      class="font-ico ico-github"></span>&nbsp;
+                <div class="share-panel frame">
+                    <span title="Email" class="font-ico ico-email"></span>
+                    <span title="Twitter" class="font-ico ico-twitter"></span>
+                    <span title="Facebook" class="font-ico ico-facebook"></span>
+                    <span title="G+" class="font-ico ico-googleplus"></span>
+                    <span title="微博" class="font-ico ico-weibo"></span>
+                    <span title="腾讯微博" class="font-ico ico-tencent"></span>
+                </div>
+            </div>
         </div>
 
         <div class="content">
@@ -519,7 +538,7 @@
         <script>
                     var config = {
                     "context": {{.conf.Context}},
-                            "staticServer": {{.conf.StaticServer}},
+                            "staticServer": '{{.conf.StaticServer}}',
                             "pathSeparator": '{{.pathSeparator}}',
                             "label": {
                             "restore_editor": "{{.i18n.restore_editor}}",

views/preference.html

@@ -90,6 +90,11 @@
                 {{.i18n.password}}{{.i18n.colon}}
                 <input data-value="{{.user.Password}}" value="{{.user.Password}}" name="password" type="password"/>
             </label>
+            <label class="fn-clear">
+                <img src="http://secure.gravatar.com/avatar/{{.user.Gravatar}}?s=48&d=http://symphony.b3log.org/images/user-thumbnail.png" 
+                     title="{{.user.Name}}"/>
+                <a href="http://gravatar.com/" target="_blank">{{.i18n.change_avatar}} Gravatar.com</a>
+            </label>
         </div>
     </div>
 </div>