From c7ed094fdb4343225165ff0a58f67b43d97cfa79 Mon Sep 17 00:00:00 2001 From: jlukic Date: Fri, 19 Sep 2014 17:44:15 -0400 Subject: [PATCH] Adds localization dropdown, and nag --- server/documents/elements/button.html.eco | 2 +- server/documents/modules/dropdown.html.eco | 4 +- server/files/javascript/semantic.js | 51 +++++++++++++-- server/files/stylesheets/semantic.css | 7 ++- server/layouts/default.html.eco | 73 ++++++++++++++++++---- server/partials/header.html.eco | 17 ++++- 6 files changed, 127 insertions(+), 27 deletions(-) diff --git a/server/documents/elements/button.html.eco b/server/documents/elements/button.html.eco index e6432460f..23400a6e0 100755 --- a/server/documents/elements/button.html.eco +++ b/server/documents/elements/button.html.eco @@ -1,6 +1,6 @@ --- layout : 'default' -css : 'button' +css : 'button-page' element : 'button' elementType : 'element' diff --git a/server/documents/modules/dropdown.html.eco b/server/documents/modules/dropdown.html.eco index 6406c977c..68e342820 100755 --- a/server/documents/modules/dropdown.html.eco +++ b/server/documents/modules/dropdown.html.eco @@ -1421,9 +1421,9 @@ themes : ['Default'] - onChange(value, text) + onChange(value, text, $choice) Dropdown - Is called after a dropdown item is selected. receives the name and value of selection. + Is called after a dropdown item is selected. receives the name and value of selection and the active menu element onShow diff --git a/server/files/javascript/semantic.js b/server/files/javascript/semantic.js index bd8f179f7..67c152988 100755 --- a/server/files/javascript/semantic.js +++ b/server/files/javascript/semantic.js @@ -48,10 +48,13 @@ semantic.ready = function() { $footer = $('.page > .footer'), $menuPopup = $('.ui.main.menu .popup.item'), - $menuDropdown = $('.ui.main.menu .dropdown'), + $pageDropdown = $('.ui.main.menu .page.dropdown'), $pageTabMenu = $('.tab.header.segment .tabular.menu'), $pageTabs = $('.tab.header.segment .menu .item'), + $languageDropdown = $('.ui.main.menu .language.dropdown'), + $languageModal = $('.language.modal'), + $downloadDropdown = $('.download.buttons .dropdown'), $helpPopup = $('.header .help.icon'), @@ -59,9 +62,10 @@ semantic.ready = function() { $example = $('.example'), $shownExample = $example.filter('.shown'), - $developer = $('.developer.item'), - $overview = $('.overview.item, .overview.button'), - $designer = $('.designer.item'), + $mode = $('.header .mode.button'), + $developer = $('.header .developer.item'), + $overview = $('.header .overview.item'), + $designer = $('.header .designer.item'), $sidebarButton = $('.fixed.launch.button'), $code = $('div.code').not('.existing'), @@ -822,6 +826,10 @@ semantic.ready = function() { }) ; + $languageModal.modal({ + detachable: false + }); + $menu .sidebar('attach events', '.launch.button, .view-ui.button, .launch.item') .sidebar('attach events', $hideMenu, 'hide') @@ -875,6 +883,9 @@ semantic.ready = function() { .on('click', handler.swapStyle) ; + $mode + .dropdown() + ; $developer .on('click', handler.developerMode) ; @@ -894,13 +905,43 @@ semantic.ready = function() { }) ; - $menuDropdown + $pageDropdown .dropdown({ on : 'hover', action : 'nothing', allowTab : false }) ; + $languageDropdown + .popup() + .dropdown({ + on : 'click', + onShow: function() { + $(this).popup('hide'); + }, + onChange: function(value, text, $choice) { + var + percent = $choice.data('percent') || 0 + ; + window.Transifex.live.translateTo(value, true); + if(percent < 100) { + $('.language.modal') + .find('.header .name') + .html(text) + .end() + .find('.complete') + .html(percent) + .end() + .modal('show', function() { + $('.language.modal .progress .bar').css('width', percent + '%'); + }) + ; + } + } + }) + + ; + if($('body').hasClass('index') ) { $('.masthead') diff --git a/server/files/stylesheets/semantic.css b/server/files/stylesheets/semantic.css index 39b75871d..5db3765a3 100755 --- a/server/files/stylesheets/semantic.css +++ b/server/files/stylesheets/semantic.css @@ -706,7 +706,7 @@ body#example.hide { -----------------*/ #example.overview h2.ui.header { - margin-bottom: 0em; + margin-bottom: 0.5em; } #example.overview .example { display: table-row; @@ -726,6 +726,7 @@ body#example.hide { font-weight: normal; padding: 0em 0em 0em 0.5em; width: auto; + line-height: 1.4; } /*---------------- @@ -1731,8 +1732,8 @@ body.progress .ui.progress .bar { #example .masthead .mobile.buttons { display: block; } - #example.button .ui.buttons, - #example.button :not(.buttons) .ui.button { + #example.button-page .ui.buttons, + #example.button-page :not(.buttons) .ui.button { margin-bottom: 0.5em; } #example .masthead:before { diff --git a/server/layouts/default.html.eco b/server/layouts/default.html.eco index bae8f4ef1..0c4b55801 100755 --- a/server/layouts/default.html.eco +++ b/server/layouts/default.html.eco @@ -148,6 +148,20 @@ ga('send', 'pageview'); + + @@ -291,6 +313,31 @@ +
+ +
The Translation Needs Your Help
+
+
+ +
+
+

This translation is only % complete!

+
+
+
+

We need your help to make Semantic available to people who speak your language.

+

Our translation tools are easy to use and allow you to translate text without having to leave the site. If you are interested in joining our translation team, please e-mail me for access to our translation hub. +

+
+
+
+
No Thanks
+ + + Help Translate + +
+
diff --git a/server/partials/header.html.eco b/server/partials/header.html.eco index b08dbc557..f7453c619 100755 --- a/server/partials/header.html.eco +++ b/server/partials/header.html.eco @@ -12,9 +12,6 @@

<%=@document.description %>

<% if @document.type is 'UI Element' or @document.type is 'UI View' or @document.type is 'UI Collection': %>
-
- Definition -
<% end %> <% if @document.type is 'UI Module': %> @@ -22,6 +19,20 @@ <% end %> +
+ Change View +
+ + Definition + + + Designer + + + Developer + +
+
<% if @document.themes?: %>
Theme