浏览代码

HUE-6077 [frontend] Centralize the app icons

This also adds svg markdown, scoop and scala icons
Johan Ahlen 8 年之前
父节点
当前提交
2608023e9c

+ 29 - 5
desktop/core/src/desktop/templates/hue_icons.mako

@@ -123,6 +123,12 @@
       % endif
     </symbol>
 
+    <symbol id="hi-markdown" viewBox="0 0 640 640">
+      <path d="M593.85,516.92H46.15A46.21,46.21,0,0,1,0,470.77V169.23a46.21,46.21,0,0,1,46.15-46.15H593.85A46.21,46.21,0,0,1,640,169.23V470.77A46.21,46.21,0,0,1,593.85,516.92ZM46.15,153.85a15.4,15.4,0,0,0-15.38,15.38V470.77a15.4,15.4,0,0,0,15.38,15.38H593.85a15.4,15.4,0,0,0,15.38-15.38V169.23a15.4,15.4,0,0,0-15.38-15.38Z"></path>
+      <path d="M92.31,424.62V215.38h61.54l61.54,76.92,61.54-76.92h61.54V424.62H276.92v-120l-61.54,76.92-61.54-76.92v120Z"></path>
+      <path d="M476.92,424.62,384.62,323.08h61.54V215.38h61.54V323.08h61.54Z"></path>
+    </symbol>
+
     <symbol id="hi-oozie" viewBox="0 0 640 640">
       <path d="M523.82,640H116.18A116.31,116.31,0,0,1,0,523.82V116.18A116.31,116.31,0,0,1,116.18,0H523.82A116.31,116.31,0,0,1,640,116.18V523.82A116.31,116.31,0,0,1,523.82,640ZM116.18,32.05a84.23,84.23,0,0,0-84.13,84.13V523.82a84.23,84.23,0,0,0,84.13,84.13H523.82a84.23,84.23,0,0,0,84.13-84.13V116.18a84.23,84.23,0,0,0-84.13-84.13Z"></path>
       <path d="M320,530c-115.79,0-210-94.21-210-210s94.21-210,210-210,210,94.21,210,210S435.79,530,320,530Zm0-388c-98.15,0-178,79.85-178,178s79.85,178,178,178,178-79.85,178-178S418.15,142,320,142Z"></path>
@@ -178,10 +184,18 @@
       <path d="M591.71,637H442.94c-43.88,0-45.44-25.47-45.44-39.08,0-23.9,5.68-47.56,7.49-53.24s12.5-42.75,51.4-42.75c1,0,3.58.94,7.15,3.64,24.32,18.36,46.19,20,53.79,20s26.36-.57,53.78-20c3.65-2.59,6.13-3.67,7.15-3.67,39.14,0,49.59,37.22,51.41,42.89s7.48,33.9,7.48,53.15C637.15,611.53,632.73,637,591.71,637Z"></path>
     </symbol>
 
+    <symbol id="hi-scala" viewBox="0 0 640 640">
+      <path d="M516.92,147.69V0c0,61.54-393.85,86.15-393.85,98.46V246.15c0,5.29,72.63,12.84,155.5,24.62-82.88,11.77-155.5,19.33-155.5,24.61V443.08c0,5.29,72.63,12.84,155.5,24.62-82.88,11.77-155.5,19.33-155.5,24.61V640c0-12.31,393.85-36.92,393.85-98.46V393.85c0-9-8.37-17.14-22.65-24.61,14.28-7.47,22.65-15.65,22.65-24.62V196.92c0-9-8.37-17.14-22.65-24.61C508.55,164.84,516.92,156.66,516.92,147.69Zm-20,392.41c-1.47,1.79-7.78,7.93-29.66,16-18.13,6.71-43.17,13.39-74.44,19.84-58.61,12.1-127.46,21.21-182.78,28.54-26.12,3.46-48.67,6.44-64.86,9.07l-2.1.34V506.81c15.81-2.87,45.37-6.79,72.21-10.34,20.05-2.65,42.78-5.66,66.11-9,45.44-6.46,111.75-16.6,162.77-30.09,21.87-5.78,39.24-11.69,52.76-18Zm0-196.93c-1,1.17-4,4.17-11.92,8.34-50.32,26.33-185.51,44.23-275,56.08-26.12,3.46-48.67,6.44-64.86,9.07l-2.1.34V309.89c15.81-2.87,45.37-6.79,72.21-10.34,20.05-2.65,42.78-5.66,66.11-9,45.44-6.46,111.75-16.6,162.77-30.09,21.87-5.78,39.24-11.69,52.76-18Zm0-196.92c-1,1.17-4,4.17-11.92,8.34-50.32,26.33-185.51,44.23-275,56.07-26.12,3.46-48.67,6.44-64.86,9.07l-2.1.34V113c15.81-2.87,45.37-6.79,72.21-10.34,57-7.54,135-17.87,197.36-31.51,35.28-7.72,61.82-15.6,81.13-24.09.9-.4,2-.86,3.14-1.4Z"></path>
+    </symbol>
+
     <symbol id="hi-spark" viewBox="0 0 640 640">
       <path d="M292.14,50.44c.33.49.62,1.35,1,1.4,19.84,2.63,32.42,15.35,42.16,31.24,21.6,35.26,42.73,70.81,64.07,106.22,2.74,4.55,4.66,10.86,8.72,13,3.44,1.78,9.49-1.08,14.27-2.33,22-5.76,44-11.73,66-17.51q30.55-8,61.16-15.81c13.39-3.4,26.69-7.52,40.3-9.6,16.17-2.47,31.85.33,43.23,13.46,9.31,10.74,9.34,30.12-.27,44.4-8.89,13.21-19,25.66-29.08,38-13.75,16.81-28,33.23-42,49.78-17.94,21.1-35.72,42.34-54.06,63.07-4.2,4.75-3.79,8.3-1.25,13,9,16.7,18,33.41,26.75,50.21,14.83,28.37,30.59,56.31,44,85.35,15.72,34.13-5.19,70.46-43,74.78-20.52,2.34-38.38-5.36-57-10.69-24.55-7-48.95-14.63-73.4-22A131.23,131.23,0,0,1,391,552.28a6.21,6.21,0,0,1-3.1-4.08c-4.27-24.86-8.36-49.76-12.64-75.54l116.53,32.08c-3-6-5.25-10.77-7.74-15.48q-26-49.23-52-98.42c-3-5.65-6.35-11.15-8.73-17-.88-2.18-.39-6.1,1.09-7.86,20.83-24.77,42-49.27,63-73.9q21.16-24.82,42.14-49.79a14.84,14.84,0,0,0,1.16-2.89c-8.67,2.14-16.53,4-24.33,6q-48.45,12.78-96.87,25.68c-10.26,2.74-20.51,5.54-30.71,8.53-5.47,1.6-8.84.36-11.95-4.91-18-30.48-36.34-60.72-54.59-91-5.91-9.81-11.86-19.6-18.77-31-1.13,3.43-2,5.22-2.31,7.1q-9.47,53.31-18.84,106.64c-2.52,14.23-5,28.47-7.76,42.66a6.63,6.63,0,0,1-3.68,4.3c-39.11,12.54-78.28,24.88-117.44,37.28-12.5,4-25,8-39.4,12.62l123.05,49L202,428.46c-18.09,11.68-36.25,23.26-54.21,35.14-3.46,2.29-6.3,2.32-9.84.72-23.69-10.69-47.55-21-71.1-32-13.65-6.38-27.57-12.69-40-21.05C11,400.63.61,385.23,0,365.56a41.57,41.57,0,0,1,11.27-29.69,79.46,79.46,0,0,1,34.1-22c23.82-8,47.92-15.19,71.87-22.81,28-8.9,56-17.8,83.87-27,2.18-.72,4.54-3.94,5-6.35,3.69-19.21,6.91-38.5,10.35-57.76,3.73-20.88,7.75-41.72,11.23-62.64,2.62-15.76,5.13-31.44,11.85-46.17,8.87-19.45,20.9-35.17,43.5-39.38.52-.1.92-.85,1.38-1.3Z"></path>
     </symbol>
 
+    <symbol id="hi-sqoop" viewBox="0 0 640 640">
+      <path d="M320,640a321,321,0,0,1-148.87-36.83L147,590.46l21.75-21.75h-50l-5.62-4.79A319.71,319.71,0,0,1,0,320C0,143.56,143.56,0,320,0A319.64,319.64,0,0,1,485.87,46.7L507.71,60,467,100.67h85.67l6,6.71A319.46,319.46,0,0,1,640,320C640,496.44,496.44,640,320,640ZM215,579.3a276.5,276.5,0,0,0,105,20.49c154.3,0,279.81-125.49,279.81-279.79a279.08,279.08,0,0,0-65.29-179.15H370.06l72.23-72.23A278.32,278.32,0,0,0,320,40.21C165.7,40.21,40.19,165.7,40.19,320a279.44,279.44,0,0,0,93.45,208.52H265.71Z"></path>
+    </symbol>
+
     <symbol id="hi-warning" viewBox="-0.002 0 512.001 449.468">
       <path d="M507.747,413.145L275.868,11.503C271.763,4.392,264.163,0,255.947,0c-8.229,0-15.816,4.392-19.923,11.503L3.09,414.959   c-4.123,7.117-4.123,15.901,0,23.006c4.106,7.117,11.694,11.503,19.922,11.503h465.869c0.045,0,0.084,0,0.112,0   c12.71,0,23.006-10.301,23.006-23.006C511.999,421.503,510.426,416.908,507.747,413.145z M62.857,403.462l193.09-334.444   l193.078,334.438H62.857V403.462z" ></path>
       <path d="M232.941,171.853V274.48c0,12.705,10.301,23.006,23.006,23.006s23.006-10.301,23.006-23.006V171.853   c0-12.705-10.301-23.006-23.006-23.006S232.941,159.148,232.941,171.853z"></path>
@@ -219,20 +233,30 @@
 
   <script type="text/html" id="app-icon-template">
     <!-- ko switch: icon -->
+    <!-- ko case: 'dashboard' --><i class="fa fa-fw fa-area-chart"></i><!-- /ko -->
+    <!-- ko case: 'dist-cp' --><i class="fa fa-fw fa-files-o"></i><!-- /ko -->
     <!-- ko case: 'editor' --><i class="fa fa-fw fa-edit inline-block"></i><!-- /ko -->
-    <!-- ko case: 'pig' --><svg class="hi"><use xlink:href="#hi-pig"></use></svg><!-- /ko -->
+    <!-- ko case: 'hive' --><svg class="hi"><use xlink:href="#hi-hive"></use></svg><!-- /ko -->
+    <!-- ko case: 'impala' --><svg class="hi"><use xlink:href="#hi-impala"></use></svg><!-- /ko -->
+    <!-- ko case: 'jar' --><svg class="hi"><use xlink:href="#hi-spark"></use></svg><!-- /ko -->
+    <!-- ko case: 'java' --><i class="fa fa-file-code-o app-icon"></i><!-- /ko -->
+    <!-- ko case: 'mapreduce' --><i class="fa fa-fw fa-file-archive-o"></i><!-- /ko -->
+    <!-- ko case: 'markdown' --><svg class="hi"><use xlink:href="#hi-markdown"></use></svg><!-- /ko -->
     <!-- ko case: 'notebook' --><svg class="hi"><use xlink:href="#hi-file-notebook"></use></svg><!-- /ko -->
     <!-- ko case: 'oozie' --><svg class="hi"><use xlink:href="#hi-oozie"></use></svg><!-- /ko -->
     <!-- ko case: 'oozie-bundle' --><svg class="hi"><use xlink:href="#hi-oozie-bundle"></use></svg><!-- /ko -->
     <!-- ko case: 'oozie-coordinator' --><svg class="hi"><use xlink:href="#hi-oozie-coordinator"></use></svg><!-- /ko -->
     <!-- ko case: 'oozie-workflow' --><svg class="hi"><use xlink:href="#hi-oozie-workflow"></use></svg><!-- /ko -->
-    <!-- ko case: 'hive' --><svg class="hi"><use xlink:href="#hi-hive"></use></svg><!-- /ko -->
-    <!-- ko case: 'impala' --><svg class="hi"><use xlink:href="#hi-impala"></use></svg><!-- /ko -->
-    <!-- ko case: 'dashboard' --><i class="fa fa-fw fa-area-chart"></i><!-- /ko -->
+    <!-- ko case: 'pig' --><svg class="hi"><use xlink:href="#hi-pig"></use></svg><!-- /ko -->
     <!-- ko case: 'py' --><svg class="hi"><use xlink:href="#hi-py"></use></svg><!-- /ko -->
+    <!-- ko case: 'pyspark' --><svg class="hi"><use xlink:href="#hi-spark"></use></svg><!-- /ko -->
     <!-- ko case: 'r' --><svg class="hi"><use xlink:href="#hi-r"></use></svg><!-- /ko -->
+    <!-- ko case: 'scala' --><svg class="hi"><use xlink:href="#hi-scala"></use></svg><!-- /ko -->
+    <!-- ko case: 'shell' --><i class="fa fa-fw fa-terminal"></i><!-- /ko -->
     <!-- ko case: 'spark' --><svg class="hi"><use xlink:href="#hi-spark"></use></svg><!-- /ko -->
-    <!-- ko case: $else --><svg class="hi"><use xlink:href="#hi-empty"></use></svg><!-- /ko -->
+    <!-- ko case: 'sqoop1' --><svg class="hi"><use xlink:href="#hi-sqoop"></use></svg><!-- /ko -->
+    <!-- ko case: 'text' --><i class="fa fa-fw fa-i-cursor"></i><!-- /ko -->
+    <!-- ko case: $else --><i class="fa fa-fw fa-database"></i><!-- /ko -->
     <!-- /ko -->
   </script>
 </%def>

+ 1 - 11
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -289,48 +289,38 @@ from notebook.conf import ENABLE_QUERY_BUILDER, ENABLE_QUERY_SCHEDULING, ENABLE_
           <li class="app-header">
             <!-- ko if: editorMode -->
               <a data-bind="attr: { href: '${ url('notebook:editor') }?type=' + editorType(), title: editorTypeTitle() + '${ _(' Editor') }' }" style="cursor: pointer">
+              <!-- ko template: { name: 'app-icon-template', data: { icon: editorType() } } --><!-- /ko -->
               <!-- ko if: editorType() == 'impala' -->
-                <svg class="svg-app-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#hi-impala"></use></svg>
                 Impala
               <!-- /ko -->
               <!-- ko if: editorType() == 'rdbms' -->
-                <img src="${ static('rdbms/art/icon_rdbms_48.png') }" class="app-icon" alt="${ _('DBQuery icon') }" />
                 DB Query
               <!-- /ko -->
               <!-- ko if: editorType() == 'pig' -->
-                <img src="${ static('pig/art/icon_pig_48.png') }" class="app-icon"  alt="${ _('Pig icon') }"/>
                 Pig
               <!-- /ko -->
               <!-- ko if: editorType() == 'java' -->
-                <i class="fa fa-file-code-o app-icon" style="vertical-align: middle"></i>
                 Java
               <!-- /ko -->
               <!-- ko if: editorType() == 'spark2' -->
-                <img src="${ static('spark/art/icon_spark_48.png') }" class="app-icon" alt="${ _('Spark icon') }" />
                 Spark
               <!-- /ko -->
               <!-- ko if: editorType() == 'sqoop1' -->
-                <img src="${ static('oozie/art/icon_sqoop_48.png') }" class="app-icon" alt="${ _('Sqoop icon') }" />
                 Sqoop 1
               <!-- /ko -->
               <!-- ko if: editorType() == 'distcp' -->
-                <i class="fa fa-files-o app-icon" style="vertical-align: middle"></i>
                 DistCp
               <!-- /ko -->
               <!-- ko if: editorType() == 'shell' -->
-                <i class="fa fa-terminal app-icon" style="vertical-align: middle"></i>
                 Shell
               <!-- /ko -->
               <!-- ko if: editorType() == 'mapreduce' -->
-                <i class="fa fa-file-archive-o app-icon" style="vertical-align: middle"></i>
                 MapReduce
               <!-- /ko -->
               <!-- ko if: editorType() == 'beeswax' || editorType() == 'hive' -->
-                <svg class="svg-app-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#hi-hive"></use></svg>
                 Hive
               <!-- /ko -->
               <!-- ko if: ['impala', 'pig', 'hive', 'beeswax', 'rdbms', 'java', 'spark2', 'sqoop1', 'distcp', 'shell', 'mapreduce'].indexOf(editorType()) == -1 -->
-                <img src="${ static('rdbms/art/icon_rdbms_48.png') }" class="app-icon" alt="${ _('SQL') }" />
                 SQL
               <!-- /ko -->
               </a>