Make the toggles themselves permalinks

This commit is contained in:
John Firebaugh 2013-07-31 14:07:28 -07:00
parent fa9b4a5f6a
commit 48775da938
2 changed files with 25 additions and 33 deletions

View file

@ -64,23 +64,31 @@ L.OSM.share = function (options) {
$('<div>')
.attr('class', 'share-tabs')
.appendTo($form)
.append($('<label>')
.append($('<a>')
.attr('class', 'active')
.attr('for', 'long_input')
.attr('id', 'long_link')
.text(I18n.t('javascripts.share.long_link')))
.append($('<label>')
.append($('<a>')
.attr('for', 'short_input')
.attr('id', 'short_link')
.text(I18n.t('javascripts.share.short_link')))
.append($('<label>')
.append($('<a>')
.attr('for', 'embed_html')
.attr('href', '#')
.text(I18n.t('javascripts.share.embed')))
.on('click', 'label', function() {
.on('click', 'a', function(e) {
e.preventDefault();
var id = '#' + $(this).attr('for');
$linkSection.find('.share-tabs label')
$linkSection.find('.share-tabs a')
.removeClass('active');
$(this).addClass('active');
$linkSection.find('.share-tab').hide();
$linkSection.find('.share-tab:has(' + id + ')').show();
$linkSection.find('.share-tab')
.hide();
$linkSection.find('.share-tab:has(' + id + ')')
.show()
.find('input, textarea')
.select();
});
$('<div>')
@ -90,12 +98,7 @@ L.OSM.share = function (options) {
.append($('<input>')
.attr('id', 'long_input')
.attr('type', 'text')
.on('click', select))
.append($('<a>')
.attr('id', 'long_link')
.on('click', function() { return false; })
.append($('<span>')
.attr('class', 'icon link')));
.on('click', select));
$('<div>')
.attr('class', 'form-row share-tab')
@ -103,12 +106,7 @@ L.OSM.share = function (options) {
.append($('<input>')
.attr('id', 'short_input')
.attr('type', 'text')
.on('click', select))
.append($('<a>')
.attr('id', 'short_link')
.on('click', function() { return false; })
.append($('<span>')
.attr('class', 'icon link')));
.on('click', select));
$('<div>')
.attr('class', 'form-row share-tab')

View file

@ -640,22 +640,24 @@ a.donate {
.share-tabs {
margin-bottom: 10px;
label {
a {
color: #fff;
text-decoration: none;
background-color: $lightblue;
padding: 5px 10px;
}
label:first-child {
a:first-child {
border-right: 1px solid #fff;
border-radius: 4px 0 0 4px;
}
label:last-child {
a:last-child {
border-left: 1px solid #fff;
border-radius: 0 4px 4px 0;
}
label.active {
a.active {
background-color: $blue;
}
}
@ -665,17 +667,9 @@ a.donate {
}
.share-link {
#long_input,
#short_input {
width: 190px;
}
a {
margin-left: 5px;
}
input,
input[type=text],
textarea {
width: 100%;
font-family: monospace;
font-size: small;
}