Merge pull request #3900 from oliverguenther/fix/repository_labels

Proper repository scm_type labels

app/views/repositories/settings/_vendor_attribute_groups.html.erb

@@ -1,14 +1,14 @@
 <div class="description attributes-group">
   <div class="attributes-group--header">
     <div class="attributes-group--header-container">
-      <h3 class="attributes-group--header-text">
+      <h3 class="attributes-group--header-text"
+          tabindex="0">
+        <%= label_tag :scm_type, l("repositories.#{vendor}.#{type}_title"), class: 'hidden-for-sighted' %>
         <input type="radio"
            value="<%= type %>"
            name="scm_type"
            <%= existing ? 'disabled' : '' %>
-           <%= alone ? 'checked' : '' %>>
-        <%= l("repositories.#{vendor}.#{type}_title") %>
-      </h3>
+           <%= alone ? 'checked' : '' %>><%= l("repositories.#{vendor}.#{type}_title") %></h3>
     </div>
     <% unless repository.new_record? %>
     <div class="attributes-group--header-control">

app/views/repositories/settings/repository_form.js.erb

@@ -1,68 +1,72 @@
 (function($) {
 
-	<% content = render partial: 'repositories/settings' %>
-	$('#tab-content-repository').html('<%= escape_javascript content %>');
+  <% content = render partial: 'repositories/settings' %>
+  $('#tab-content-repository').html('<%= escape_javascript content %>');
 
-	<% unless flash.empty? %>
-	<%# TODO: Double flash from regular flash %>
-	var div_content = $('#content');
-	div_content.parent().find('.flash').remove();
-	div_content.before('<%= render_flash_messages %>');
-	<% end %>
+  <% unless flash.empty? %>
+  <%# TODO: Double flash from regular flash %>
+  var div_content = $('#content');
+  div_content.parent().find('.flash').remove();
+  div_content.before('<%= render_flash_messages %>');
+  <% end %>
 
-	var toggleContent = function(content, selected) {
-		var targetName = '#toggleable-attributes-group--content-' + selected,
-				oldTargets = content.not(targetName),
-				newTarget  = $(targetName);
+  var toggleContent = function(content, selected) {
+    var targetName = '#toggleable-attributes-group--content-' + selected,
+        oldTargets = content.not(targetName),
+        newTarget  = $(targetName);
 
-		// would work with fieldset#disabled, but that's bugged up unto IE11
-		// https://connect.microsoft.com/IE/feedbackdetail/view/962368/
-		//
-		// Ugly workaround: disable all inputs manually, but
-		// spare enabling inputs marked with `aria-disabled`
-		oldTargets
-			.slideUp(500)
-			.prop('hidden', true)
-			.find('input,select')
-			.prop('disabled', true);
+    // would work with fieldset#disabled, but that's bugged up unto IE11
+    // https://connect.microsoft.com/IE/feedbackdetail/view/962368/
+    //
+    // Ugly workaround: disable all inputs manually, but
+    // spare enabling inputs marked with `aria-disabled`
+    oldTargets
+      .slideUp(500)
+      .prop('hidden', true)
+      .find('input,select')
+      .prop('disabled', true);
 
-		newTarget
-			.slideDown(500)
-			.prop('hidden', false)
-			.find('input,select')
-			.not('[aria-disabled="true"]')
-			.prop('disabled', false);
-	};
+    newTarget
+      .slideDown(500)
+      .prop('hidden', false)
+      .find('input,select')
+      .not('[aria-disabled="true"]')
+      .prop('disabled', false);
+  };
 
-	$('#tab-content-repository')
-		.find('.attributes-group.-toggleable')
-		.each(function(_i, el) {
+  $('#tab-content-repository')
+    .find('.attributes-group.-toggleable')
+    .each(function(_i, el) {
 
-		var fs = $(el),
-			name = fs.attr('data-switch'),
-			switches = fs.find('[name="' + name + '"]'),
-			headers = fs.find('.attributes-group--header-text'),
-			content = fs.find('.attributes-group--content.-toggleable');
+    var fs = $(el),
+      name = fs.attr('data-switch'),
+      switches = fs.find('[name="' + name + '"]'),
+      headers = fs.find('.attributes-group--header-text'),
+      content = fs.find('.attributes-group--content.-toggleable');
 
-		// If only one choice, skip setup
-		if (switches.length === 1) {
-			return;
-		}
+    // If only one choice, skip setup
+    if (switches.length === 1) {
+      return;
+    }
 
-		// Clickable headers
-		headers.click(function() {
-			var input = $(this).find('input');
-			if (!input.prop('checked')) {
-				input
-					.prop('checked', true)
-					.trigger('change');
-			}
-		});
+    // Focus on first header
+    headers.first().focus();
 
-		// Toggle content
-		switches.on('change', function() {
-			toggleContent(content, this.value);
-		});
-	});
+    // Clickable headers
+    headers.on('click keydown', function (e) {
+      if (e.type == 'click' || e.keyCode == 13 || e.keyCode == 32) {
+        var input = $(this).find('input');
+        if (!input.prop('checked')) {
+          input.prop('checked', true)
+               .trigger('change');
+        }
+      }
+    });
+
+    // Toggle content
+    switches.on('change', function() {
+      toggleContent(content, this.value);
+    });
+  });
 
 }(jQuery));