Perform styling on the WOPI modal

This commit is contained in:
Jure Grabnar 2019-03-19 20:41:16 +01:00
parent 983f90ddf6
commit fddff9c627
12 changed files with 206 additions and 11 deletions

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>1DBED704-6E88-4AE3-B2F9-3410F58D52C1</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-XLSX-file-dialog" transform="translate(-224.000000, -172.000000)" fill="#FFFFFF">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-2" transform="translate(153.000000, 0.000000)">
<path d="M46.404,11.844 L35.684,11.844 L35.684,13.828 L38.844,13.828 L38.844,16.9666667 L35.684,16.9666667 L35.684,17.9666667 L38.844,17.9666667 L38.844,21.1093333 L35.684,21.1093333 L35.684,22.1373333 L38.844,22.1373333 L38.844,25.1093333 L35.684,25.1093333 L35.684,26.3 L38.844,26.3 L38.844,29.2786667 L35.684,29.2786667 L35.684,30.4693333 L38.844,30.4693333 L38.844,33.4653333 L35.684,33.4653333 L35.684,35.6506667 L46.404,35.6506667 C46.5733333,35.6 46.7146667,35.4 46.828,35.0533333 C46.9413333,34.704 47,34.42 47,34.2053333 L47,12.2066667 C47,12.036 46.9413333,11.9333333 46.828,11.8973333 C46.7146667,11.8626667 46.5733333,11.844 46.404,11.844 Z M45.0133333,33.4626667 L39.8706667,33.4626667 L39.8706667,30.4693333 L45.0133333,30.4693333 L45.0133333,33.4653333 L45.0133333,33.4626667 Z M45.0133333,29.2786667 L39.8706667,29.2786667 L39.8706667,26.2986667 L45.0133333,26.2986667 L45.0133333,29.2786667 Z M45.0133333,25.108 L39.8706667,25.108 L39.8706667,22.1493333 L45.0133333,22.1493333 L45.0133333,25.1106667 L45.0133333,25.108 Z M45.0133333,21.108 L39.8706667,21.108 L39.8706667,17.9693333 L45.0133333,17.9693333 L45.0133333,21.1093333 L45.0133333,21.108 L45.0133333,21.108 Z M45.0133333,16.9493333 L39.8706667,16.9493333 L39.8706667,13.8293333 L45.0133333,13.8293333 L45.0133333,16.9693333 L45.0133333,16.9493333 L45.0133333,16.9493333 Z M15,11.3493333 L15,36.1506667 L33.88,39.416 L33.88,8 L15,11.36 L15,11.3493333 Z M26.1906667,30.1106667 C26.1186667,29.916 25.78,29.0893333 25.18,27.6266667 C24.5813333,26.1653333 24.22,25.3146667 24.1146667,25.072 L24.0813333,25.072 L22.056,29.892 L19.3493333,29.7093333 L22.56,23.7093333 L19.62,17.7093333 L22.38,17.564 L24.204,22.2586667 L24.24,22.2586667 L26.3,17.3506667 L29.152,17.1706667 L25.756,23.664 L29.256,30.288 L26.1906667,30.108 L26.1906667,30.1106667 L26.1906667,30.1106667 Z" id="ms-excel-active"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>4C8BB196-A5E9-45E1-A350-99BB0AD162B7</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-PPTX-file-dialog" transform="translate(-224.000000, -172.000000)" fill="#217346">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-2" transform="translate(153.000000, 0.000000)">
<path d="M46.404,11.844 L35.684,11.844 L35.684,13.828 L38.844,13.828 L38.844,16.9666667 L35.684,16.9666667 L35.684,17.9666667 L38.844,17.9666667 L38.844,21.1093333 L35.684,21.1093333 L35.684,22.1373333 L38.844,22.1373333 L38.844,25.1093333 L35.684,25.1093333 L35.684,26.3 L38.844,26.3 L38.844,29.2786667 L35.684,29.2786667 L35.684,30.4693333 L38.844,30.4693333 L38.844,33.4653333 L35.684,33.4653333 L35.684,35.6506667 L46.404,35.6506667 C46.5733333,35.6 46.7146667,35.4 46.828,35.0533333 C46.9413333,34.704 47,34.42 47,34.2053333 L47,12.2066667 C47,12.036 46.9413333,11.9333333 46.828,11.8973333 C46.7146667,11.8626667 46.5733333,11.844 46.404,11.844 Z M45.0133333,33.4626667 L39.8706667,33.4626667 L39.8706667,30.4693333 L45.0133333,30.4693333 L45.0133333,33.4653333 L45.0133333,33.4626667 Z M45.0133333,29.2786667 L39.8706667,29.2786667 L39.8706667,26.2986667 L45.0133333,26.2986667 L45.0133333,29.2786667 Z M45.0133333,25.108 L39.8706667,25.108 L39.8706667,22.1493333 L45.0133333,22.1493333 L45.0133333,25.1106667 L45.0133333,25.108 Z M45.0133333,21.108 L39.8706667,21.108 L39.8706667,17.9693333 L45.0133333,17.9693333 L45.0133333,21.1093333 L45.0133333,21.108 L45.0133333,21.108 Z M45.0133333,16.9493333 L39.8706667,16.9493333 L39.8706667,13.8293333 L45.0133333,13.8293333 L45.0133333,16.9693333 L45.0133333,16.9493333 L45.0133333,16.9493333 Z M15,11.3493333 L15,36.1506667 L33.88,39.416 L33.88,8 L15,11.36 L15,11.3493333 Z M26.1906667,30.1106667 C26.1186667,29.916 25.78,29.0893333 25.18,27.6266667 C24.5813333,26.1653333 24.22,25.3146667 24.1146667,25.072 L24.0813333,25.072 L22.056,29.892 L19.3493333,29.7093333 L22.56,23.7093333 L19.62,17.7093333 L22.38,17.564 L24.204,22.2586667 L24.24,22.2586667 L26.3,17.3506667 L29.152,17.1706667 L25.756,23.664 L29.256,30.288 L26.1906667,30.108 L26.1906667,30.1106667 L26.1906667,30.1106667 Z" id="ms-excel-217346"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="31px" viewBox="0 0 32 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>20B71793-99D3-4CCE-9F03-A003272E0F54</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-PPTX-file-dialog" transform="translate(-378.000000, -173.000000)" fill="#FFFFFF">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-3" transform="translate(306.000000, 0.000000)">
<path d="M47.312,13.4933333 L35.9226667,13.4933333 L35.9226667,17.7413333 C36.6093333,17.2213333 37.432,16.9573333 38.396,16.9573333 L38.396,21.088 L42.4946667,21.088 C42.4746667,22.2466667 42.0746667,23.224 41.2933333,24.012 C40.5146667,24.8013333 39.536,25.2066667 38.376,25.2333333 C37.476,25.2066667 36.656,24.936 35.9373333,24.4133333 L35.9373333,27.252 L44.896,27.252 L44.896,28.6453333 L35.9346667,28.6453333 L35.9346667,30.3693333 L44.888,30.3693333 L44.888,31.7453333 L35.9293333,31.7453333 L35.9293333,34.8653333 L47.32,34.8653333 C47.7813333,34.8653333 48,34.6226667 48,34.1493333 L48,14.1733333 C48,13.7173333 47.7813333,13.4933333 47.32,13.4933333 L47.312,13.4933333 Z M39.04,20.408 L39.04,16.2426667 C40.2,16.2693333 41.1733333,16.672 41.9573333,17.456 C42.7386667,18.24 43.1453333,19.224 43.1653333,20.408 L39.04,20.408 Z M27.008,20.4773333 C26.9373333,20.2093333 26.8213333,20.0013333 26.6573333,19.848 C26.4973333,19.6986667 26.2813333,19.5893333 26.0133333,19.52 C25.7133333,19.4386667 25.404,19.4 25.0933333,19.4 L24.1333333,19.4186667 L24.1333333,23.4173333 L24.168,23.4173333 C24.516,23.4386667 24.8813333,23.4386667 25.268,23.4173333 C25.648,23.3973333 26.008,23.2973333 26.3466667,23.1173333 C26.764,22.8173333 27.0133333,22.4173333 27.0946667,21.8986667 C27.1746667,21.3773333 27.1466667,20.8773333 27.0093333,20.4173333 L27.0093333,20.4773333 L27.008,20.4773333 Z M16,12.2386667 L16,36.1666667 L34.2506667,39.32 L34.2506667,9 L16,12.2386667 Z M29.6173333,23.0213333 C29.1173333,24.18 28.3706667,24.9213333 27.372,25.2413333 C26.3733333,25.56 25.2946667,25.684 24.1333333,25.6133333 L24.1333333,30.176 L21.732,29.8973333 L21.732,17.3613333 L25.544,17.1626667 C26.2506667,17.1186667 26.9493333,17.196 27.632,17.4026667 C28.3186667,17.6053333 28.8613333,18.0146667 29.2626667,18.632 C29.6626667,19.2466667 29.888,19.96 29.9426667,20.772 C29.992,21.584 29.8853333,22.3346667 29.6173333,23.0213333 L29.6173333,23.0213333 Z" id="ms-pwrpt-active"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="31px" viewBox="0 0 32 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>7D86E2E5-6A35-46CC-B7FA-7880CD9FA8DB</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-XLSX-file-dialog" transform="translate(-378.000000, -173.000000)" fill="#D24726">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-3" transform="translate(306.000000, 0.000000)">
<path d="M47.312,13.4933333 L35.9226667,13.4933333 L35.9226667,17.7413333 C36.6093333,17.2213333 37.432,16.9573333 38.396,16.9573333 L38.396,21.088 L42.4946667,21.088 C42.4746667,22.2466667 42.0746667,23.224 41.2933333,24.012 C40.5146667,24.8013333 39.536,25.2066667 38.376,25.2333333 C37.476,25.2066667 36.656,24.936 35.9373333,24.4133333 L35.9373333,27.252 L44.896,27.252 L44.896,28.6453333 L35.9346667,28.6453333 L35.9346667,30.3693333 L44.888,30.3693333 L44.888,31.7453333 L35.9293333,31.7453333 L35.9293333,34.8653333 L47.32,34.8653333 C47.7813333,34.8653333 48,34.6226667 48,34.1493333 L48,14.1733333 C48,13.7173333 47.7813333,13.4933333 47.32,13.4933333 L47.312,13.4933333 Z M39.04,20.408 L39.04,16.2426667 C40.2,16.2693333 41.1733333,16.672 41.9573333,17.456 C42.7386667,18.24 43.1453333,19.224 43.1653333,20.408 L39.04,20.408 Z M27.008,20.4773333 C26.9373333,20.2093333 26.8213333,20.0013333 26.6573333,19.848 C26.4973333,19.6986667 26.2813333,19.5893333 26.0133333,19.52 C25.7133333,19.4386667 25.404,19.4 25.0933333,19.4 L24.1333333,19.4186667 L24.1333333,23.4173333 L24.168,23.4173333 C24.516,23.4386667 24.8813333,23.4386667 25.268,23.4173333 C25.648,23.3973333 26.008,23.2973333 26.3466667,23.1173333 C26.764,22.8173333 27.0133333,22.4173333 27.0946667,21.8986667 C27.1746667,21.3773333 27.1466667,20.8773333 27.0093333,20.4173333 L27.0093333,20.4773333 L27.008,20.4773333 Z M16,12.2386667 L16,36.1666667 L34.2506667,39.32 L34.2506667,9 L16,12.2386667 Z M29.6173333,23.0213333 C29.1173333,24.18 28.3706667,24.9213333 27.372,25.2413333 C26.3733333,25.56 25.2946667,25.684 24.1333333,25.6133333 L24.1333333,30.176 L21.732,29.8973333 L21.732,17.3613333 L25.544,17.1626667 C26.2506667,17.1186667 26.9493333,17.196 27.632,17.4026667 C28.3186667,17.6053333 28.8613333,18.0146667 29.2626667,18.632 C29.6626667,19.2466667 29.888,19.96 29.9426667,20.772 C29.992,21.584 29.8853333,22.3346667 29.6173333,23.0213333 L29.6173333,23.0213333 Z" id="ms-pwrpt-D24726"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="31px" viewBox="0 0 32 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>58A7CABD-8C13-4F38-A224-E58B3FEF6D9B</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-DOCX-file-dialog" transform="translate(-71.000000, -173.000000)" fill="#FFFFFF">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-1">
<path d="M46.9999783,13.1281692 L46.9999783,35.1917402 C46.9999783,35.3797479 46.9333089,35.5317542 46.8013035,35.6530925 C46.6666313,35.7784309 46.5066247,35.8371 46.3212838,35.8371 L34.908816,35.8371 L34.908816,32.7769746 L44.2185309,32.7769746 L44.2185309,31.3835841 L34.9008157,31.3835841 L34.9008157,29.6781809 L44.2105306,29.6781809 L44.2105306,28.2861238 L34.9074826,28.2861238 L34.9074826,26.5660533 L44.2145308,26.5660533 L44.2145308,25.1899969 L34.9074826,25.1899969 L34.9074826,23.4659263 L44.2145308,23.4659263 L44.2145308,22.0738692 L34.9074826,22.0738692 L34.9074826,20.368466 L44.2145308,20.368466 L44.2145308,18.9777423 L34.9074826,18.9777423 L34.9074826,17.237671 L44.2145308,17.237671 L44.2145308,15.9122833 L34.9074826,15.9122833 L34.9074826,12.4548083 L46.3239506,12.4548083 C46.5226254,12.4548083 46.6839653,12.5188109 46.8013035,12.6534831 C46.9413092,12.7854885 47.0013117,12.9468284 46.9999783,13.1281692 Z M33.200746,9.00533355 L33.200746,39.3025754 L15,36.153113 L15,12.2401328 L33.200746,9 L33.200746,9.00533355 Z M30.4539668,17.9497002 L28.1752067,18.0897059 L26.7138135,27.1367434 L26.6804788,27.1367434 C26.6084758,26.7087258 26.3404648,25.2099977 25.8604451,22.647226 L25.0084102,18.296381 L22.8696559,18.4030521 L22.0136208,22.647226 C21.5136003,25.1193274 21.2349222,26.558053 21.1615859,26.9620696 L21.1415851,26.9620696 L19.8415318,18.6283946 L17.8814514,18.7323989 L19.9815375,29.2434964 L22.1602935,29.3835021 L22.9803271,25.2926678 C23.4603468,22.8925694 23.7403583,21.4978456 23.8003607,21.1164966 L23.8603632,21.1164966 C23.9416998,21.52318 24.2017105,22.9485717 24.6803968,25.3966721 L25.5004304,29.6075113 L27.8605271,29.7475171 L30.5006353,17.9470334 L30.4539668,17.9470334 L30.4539668,17.9497002 Z" id="ms-word-active"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32px" height="31px" viewBox="0 0 32 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 53.2 (72643) - https://sketchapp.com -->
<title>31E0F97F-2288-43F7-8844-5D70AE3003E4</title>
<desc>Created with sketchtool.</desc>
<g id="sci-Tasks-roadmap" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Create-XLSX-file-dialog" transform="translate(-71.000000, -173.000000)" fill="#2B579A">
<g id="Type" transform="translate(56.000000, 164.000000)">
<g id="Button-1">
<path d="M46.9999783,13.1281692 L46.9999783,35.1917402 C46.9999783,35.3797479 46.9333089,35.5317542 46.8013035,35.6530925 C46.6666313,35.7784309 46.5066247,35.8371 46.3212838,35.8371 L34.908816,35.8371 L34.908816,32.7769746 L44.2185309,32.7769746 L44.2185309,31.3835841 L34.9008157,31.3835841 L34.9008157,29.6781809 L44.2105306,29.6781809 L44.2105306,28.2861238 L34.9074826,28.2861238 L34.9074826,26.5660533 L44.2145308,26.5660533 L44.2145308,25.1899969 L34.9074826,25.1899969 L34.9074826,23.4659263 L44.2145308,23.4659263 L44.2145308,22.0738692 L34.9074826,22.0738692 L34.9074826,20.368466 L44.2145308,20.368466 L44.2145308,18.9777423 L34.9074826,18.9777423 L34.9074826,17.237671 L44.2145308,17.237671 L44.2145308,15.9122833 L34.9074826,15.9122833 L34.9074826,12.4548083 L46.3239506,12.4548083 C46.5226254,12.4548083 46.6839653,12.5188109 46.8013035,12.6534831 C46.9413092,12.7854885 47.0013117,12.9468284 46.9999783,13.1281692 Z M33.200746,9.00533355 L33.200746,39.3025754 L15,36.153113 L15,12.2401328 L33.200746,9 L33.200746,9.00533355 Z M30.4539668,17.9497002 L28.1752067,18.0897059 L26.7138135,27.1367434 L26.6804788,27.1367434 C26.6084758,26.7087258 26.3404648,25.2099977 25.8604451,22.647226 L25.0084102,18.296381 L22.8696559,18.4030521 L22.0136208,22.647226 C21.5136003,25.1193274 21.2349222,26.558053 21.1615859,26.9620696 L21.1415851,26.9620696 L19.8415318,18.6283946 L17.8814514,18.7323989 L19.9815375,29.2434964 L22.1602935,29.3835021 L22.9803271,25.2926678 C23.4603468,22.8925694 23.7403583,21.4978456 23.8003607,21.1164966 L23.8603632,21.1164966 C23.9416998,21.52318 24.2017105,22.9485717 24.6803968,25.3966721 L25.5004304,29.6075113 L27.8605271,29.7475171 L30.5006353,17.9470334 L30.4539668,17.9470334 L30.4539668,17.9497002 Z" id="ms-word-2B579A"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View file

@ -3,6 +3,7 @@ function applyCreateWopiFileCallback() {
$(".create-wopi-file-btn").off().on('click', function(e){
var $modal = $('#new-office-file-modal');
$($modal).find('form').clearFormErrors();
$($modal).find('#new-wopi-file-name').val('');
// Append element info to which the new file will be attached
$modal.find('#element_id').val($(this).data('id'));
@ -19,6 +20,8 @@ function initCreateWopiFileModal() {
$("#new-office-file-modal form")
.on('ajax:success', function(ev, data) {
window.open(data.edit_url, '_blank');
$('#new-office-file-modal').modal('hide');
//location.reload();
})
.on('ajax:error', function(ev, response) {
@ -39,6 +42,26 @@ function initCreateWopiFileModal() {
});
}
// I couldn't make this work through CSS
function applyImageChangeOnButtons() {
var resetToInActive = function (modal) {
modal.find('img.act').hide();
modal.find('img.inactive').show();
};
var modal = $('#new-office-file-modal');
modal.find('.btn-group label').off().click(function () {
resetToInActive(modal);
$(this).find('img.act').show();
$(this).find('img.inactive').hide();
})
// Set default value
modal.find('label#word-btn').click();
}
$(document).ready(function() {
initCreateWopiFileModal();
applyImageChangeOnButtons();
});

View file

@ -31,6 +31,10 @@ $brand-warning-light: #fcf7e4;
$brand-danger-light: #efdfdf;
$brand-light-blue: #e3f1f9;
// MS Office colors:
$office-ms-word: #2B579A;
$office-ms-excel: #217346;
$office-ms-powerpoint: #D24726;
//==============================================================================
// Other

View file

@ -46,3 +46,59 @@
word-wrap: break-word;
}
}
/* Create wopi file */
.create-wopi-file-btn {
border: 0px;
}
#new-office-file-modal {
.modal-header {
border-bottom: none;
}
.modal-body {
margin-bottom: 80px;
}
.modal-footer {
border-top: none;
}
label.btn {
text-align: left;
padding-left: 15px;
background-color: $color-white;
color: $color-emperor;
&#word-btn.active {
background-color: $office-ms-word;
color: $color-white;
}
&#excel-btn.active {
background-color: $office-ms-excel;
color: $color-white;
}
&#powerpoint-btn.active {
background-color: $office-ms-powerpoint;
color: $color-white;
}
span {
display: inline-block;
vertical-align: middle;
text-align: left;
margin-left: 15px;
}
}
#submit-btn-cont {
padding: 0;
// Stretch button
.btn {
width: 100%;
}
}
}

View file

@ -1,5 +1,5 @@
<%= link_to create_wopi_file_path,
class: 'btn btn-link create-wopi-file-btn',
class: 'btn btn-default create-wopi-file-btn',
target: '_blank',
title: 'Create_new_file',
style: 'display: inline-block',
@ -7,5 +7,8 @@
'id': element_id,
'type': element_type,
} do %>
'create file'
<svg>
<polygon xmlns="http://www.w3.org/2000/svg" fill="#DA4127" points="29,29 29,2.4 20.2,0 3,6.4 3,6.4 3,25.7 9,23 9,7.4 20,5 20,28 3,25.7 20.2,32 20.2,32 29,29 29,29 29,29 " style="scroll-behavior: unset;"/>
</svg>
<%= t('assets.create_wopi_file.button_text') %>
<% end %>

View file

@ -7,6 +7,10 @@
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title" id="new-office-file-modal-label">
<%= t('assets.create_wopi_file.modal_title') %>
</h4>
@ -24,15 +28,23 @@
<div class="btn-group btn-group-toggle btn-group-justified"
data-toggle="buttons">
<label class="btn btn-default active">
<%= image_tag 'office/Excel-xlsx_20x20x32.png' %>
<input type="radio" name="file_type" value='docx' checked> Word Online
<label class="btn btn-default active" id="word-btn">
<%= image_tag '/assets/office/ms-word-active.svg', class: 'act' %>
<%= image_tag '/assets/office/ms-word-inactive.svg', class: 'inactive' %>
<input type="radio" name="file_type" value='docx' checked>
<span><%= t('assets.create_wopi_file.ms_word').html_safe %></span>
</label>
<label class="btn btn-default">
<input type="radio" name="file_type" value='xlsx'> Excel Online
<label class="btn btn-default" id="excel-btn">
<%= image_tag '/assets/office/ms-excel-active.svg', class: 'act' %>
<%= image_tag '/assets/office/ms-excel-inactive.svg', class: 'inactive' %>
<input type="radio" name="file_type" value='xlsx'>
<span><%= t('assets.create_wopi_file.ms_excel').html_safe %></span>
</label>
<label class="btn btn-default">
<input type="radio" name="file_type" value='pptx'> PowerPoint Online
<label class="btn btn-default" id='powerpoint-btn'>
<%= image_tag '/assets/office/ms-pwrpt-active.svg', class: 'act' %>
<%= image_tag '/assets/office/ms-pwrpt-inactive.svg', class: 'inactive' %>
<input type="radio" name="file_type" value='pptx'>
<span><%= t('assets.create_wopi_file.ms_powerpoint').html_safe %></span>
</label>
</div>
@ -40,8 +52,11 @@
</div>
</div>
<div class="modal-footer">
<%= f.submit t('assets.create_wopi_file.create_document_button'),
class: 'btn btn-toggle' %>
<div class='col-md-4'></div>
<div class='col-md-4' id='submit-btn-cont'>
<%= f.submit t('assets.create_wopi_file.create_document_button'),
class: 'btn btn-toggle' %>
</div>
</div>
</div>
</div>

View file

@ -1888,9 +1888,13 @@ en:
wopi_supported_table_formats_title: 'Only .xlsx, .xlsm, .xlsb, .ods file formats are supported for editing in Excel Online.'
wopi_supported_presentation_formats_title: 'Only .pptx, ppsx, .odp file formats are supported for editing in Powerpoint Online.'
create_wopi_file:
button_text: 'New Office file'
modal_title: 'Create new Microsoft Office Online document'
text_field_label: 'Document name & type'
text_field_placeholder: 'New Document'
ms_word: 'Word<br/>Online'
ms_excel: 'Excel<br/>Online'
ms_powerpoint: 'PowerPoint<br/>Online'
create_document_button: 'Create Document'
errors:
forbidden: 'You do not have permission to add files.'