Skip to content

Commit 945752f

Browse files
committed
Revert "(mostly) update tabs to use Bootstrap's styles"
This reverts commit 6881631.
1 parent 4417e87 commit 945752f

5 files changed

Lines changed: 98 additions & 79 deletions

File tree

docs/tutorials/connecting-to-the-internet-via-bluetooth.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ using [tethering] instead.
1313
These instructions are for [brickman v0.5.0](http://www.ev3dev.org/news/2015/02/24/Package-Release/).
1414
If you are using an older version, please upgrade.
1515

16-
* {: data-tab-heading="Android"}Note: These instructions were written using Android 4.1.2
16+
* {: tab="Android"}Note: These instructions were written using Android 4.1.2
1717
but should work for other versions as well.
1818

1919
1. On the EV3, first verify that Bluetooth is powered on. In brickman,
@@ -84,7 +84,7 @@ If you are using an older version, please upgrade.
8484

8585
[ConnectBot]: https://connectbot.org/
8686

87-
* {: data-tab-heading="Mac OSX"}
87+
* {: tab="Mac OSX"}
8888

8989
1. On the EV3, first verify that Bluetooth is powered on. In brickman,
9090
open the *Wireless and Networks* menu and select *Bluetooth*. Make sure the
@@ -207,7 +207,7 @@ If you are using an older version, please upgrade.
207207
permitted by applicable law.
208208
root@ev3dev:~#
209209

210-
* {: data-tab-heading="Ubuntu"}
210+
* {: tab="Ubuntu"}
211211

212212
1. The default Bluetooth and network settings in Ubuntu do not have support for
213213
this, so first you need to install `blueman` on your host computer.
@@ -305,5 +305,5 @@ If you are using an older version, please upgrade.
305305
permitted by applicable law.
306306
root@ev3dev:~#
307307

308-
* {: data-tab-heading="Windows"}__HELP WANTED!__ See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
309-
{: .tab-group data-tab-topic="os"}
308+
* {: tab="Windows"}__HELP WANTED!__ See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
309+
{: tab-list="os"}

docs/tutorials/connecting-to-the-internet-via-usb.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ using [tethering] instead.
1414
These instructions are for [brickman v0.5.0](http://www.ev3dev.org/news/2015/02/24/Package-Release/).
1515
If you are using an older version, please upgrade.
1616

17-
* {: data-tab-heading="Mac OSX"}Note: These instructions were written using OSX version 10.9,
17+
* {: tab="Mac OSX"}Note: These instructions were written using OSX version 10.9,
1818
but should work for other versions as well.
1919

2020
1. On the EV3, first verify that the CDC driver is enabled. In brickman,
@@ -130,7 +130,7 @@ If you are using an older version, please upgrade.
130130
permitted by applicable law.
131131
root@ev3dev:~#
132132

133-
* {: data-tab-heading="Ubuntu"}Note: This instructions are written for Ubuntu 14.04 using
133+
* {: tab="Ubuntu"}Note: This instructions are written for Ubuntu 14.04 using
134134
the default desktop (aka Unity).
135135

136136
1. On the EV3, first verify that the CDC driver is enabled. In brickman,
@@ -219,7 +219,7 @@ If you are using an older version, please upgrade.
219219
root@ev3dev:~#
220220

221221

222-
* {: data-tab-heading="Windows"}Note: These instructions were written using Windows 7, but
222+
* {: tab="Windows"}Note: These instructions were written using Windows 7, but
223223
they will work for other versions too.
224224

225225
1. On the EV3, first verify that the RNDIS driver is enabled. In brickman,
@@ -370,4 +370,4 @@ If you are using an older version, please upgrade.
370370
{% include screenshot.html source="/images/WindowsRNDIS/WindowsRNDISPuttyConnected.png" %}
371371

372372
[PuTTY]: http://www.chiark.greenend.org.uk/%7Esgtatham/putty/
373-
{: .tab-group data-tab-topic="os"}
373+
{: tab-list="os"}

docs/tutorials/using-bluetooth-tethering.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ to set up another connection instead of or in addition to a tethering connection
1515
These instructions are for [brickman v0.5.0](http://www.ev3dev.org/news/2015/02/24/Package-Release/).
1616
If you are using an older version, please upgrade.
1717

18-
* {: data-tab-heading="Mac OSX"}
18+
* {: tab="Mac OSX"}
1919
1. On the EV3, first verify that Bluetooth is powered on. In brickman,
2020
open the *Wireless and Networks* menu and select *Bluetooth*. Make sure the
2121
*Powered* checkbox is checked. The Bluetooth icon next to the battery in the
@@ -109,21 +109,21 @@ If you are using an older version, please upgrade.
109109
permitted by applicable law.
110110
root@ev3dev:~#
111111

112-
* {: data-tab-heading="Ubuntu"}
112+
* {: tab="Ubuntu"}
113113
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
114114

115-
* {: data-tab-heading="Windows"}
115+
* {: tab="Windows"}
116116

117-
* {: data-tab-heading="7"}
117+
* {: tab="7"}
118118
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
119119

120120
This is mostly figured out for Windows 8 [here](https://github.com/ev3dev/ev3dev/issues/232#issuecomment-69801370).
121121
Windows 7 looks a bit different, so it needs its own instructions.
122122

123-
* {: data-tab-heading="8"}
123+
* {: tab="8"}
124124
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
125125

126126
This is mostly figured out [here](https://github.com/ev3dev/ev3dev/issues/232#issuecomment-69801370).
127127
We just need someone to make it pretty.
128-
{: .tab-group data-tab-topic="os-version"}
129-
{: .tab-group data-tab-topic="os"}
128+
{: tab-list="os-version"}
129+
{: tab-list="os"}

docs/tutorials/using-usb-tethering.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,12 @@ to set up another connection instead of or in addition to a tethering connection
1515
These instructions are for [brickman v0.5.0](http://www.ev3dev.org/news/2015/02/24/Package-Release/).
1616
If you are using an older version, please upgrade.
1717

18-
* {: data-tab-heading="Mac OSX"}
18+
* {: tab="Mac OSX"}
1919
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
2020

21-
* {: data-tab-heading="Ubuntu"}
21+
* {: tab="Ubuntu"}
2222
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
2323

24-
* {: data-tab-heading="Windows"}
24+
* {: tab="Windows"}
2525
HELP WANTED! See [issue #287](https://github.com/ev3dev/ev3dev/issues/287).
26-
{: .tab-group data-tab-topic="os"}
26+
{: tab-list="os"}

javascripts/tabs.js

Lines changed: 78 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -8,67 +8,86 @@ function supports_html5_storage() {
88
}
99
}
1010

11-
function makeValidId(text) {
12-
return text.toLowerCase().replace(' ', '_');
13-
}
14-
1511
$(document).ready(function () {
16-
// Get the elements that we need to separate (we want the content in a separate div)
17-
var $tabGroups = $('ul.tab-group');
18-
19-
// Iterate over each tab group
20-
$tabGroups.each(function () {
21-
// Get the header element (the ul that contains the headers and their content)
22-
var $tabGroupHeader = $(this);
23-
// Add proper style and other info for this to act as a tab header
24-
$tabGroupHeader.addClass('nav');
25-
$tabGroupHeader.addClass('nav-tabs');
26-
$tabGroupHeader.attr('role', 'tablist');
27-
28-
// Add a div to hold the content of each tab after the existing header
29-
var $tabGroupContent = $('<div/>').insertAfter($tabGroupHeader);
30-
$tabGroupContent.addClass('tab-content');
31-
32-
// Get the topic of the tab headers (e.g. 'os')
33-
var tabGroupTopic = $tabGroupHeader.data('tab-topic');
34-
35-
// Iterate over each tab header element in this group
36-
$tabGroupHeader.children('li').each(function () {
37-
// Get the header item and the text that was specified for it
38-
var $tabHeader = $(this);
39-
var tabHeadingText = $tabHeader.data('tab-heading');
40-
41-
// Generate the ID for this tab and its associated content
42-
var newTabId = 'tab-' + makeValidId(tabHeadingText);
43-
44-
// Add the content div for this tab to the group's content container
45-
var $tabContent = $('<div/>').appendTo($tabGroupContent);
46-
// Add info to link the tab header and the associated content
47-
$tabContent.addClass('tab-pane');
48-
$tabContent.attr('id', newTabId);
49-
$tabContent.attr('role', 'tabpanel');
50-
51-
// Move the tab contents from the original ul to the new div
52-
$tabContent.append($tabHeader.contents());
53-
54-
// Add a link to serve as the clickable header component
55-
var $headerLink = $('<a/>').appendTo($tabHeader);
56-
// Set the link target and style info
57-
$headerLink.attr('href', '#' + newTabId);
58-
$headerLink.attr('role', 'tab');
59-
$headerLink.data('toggle', 'tab');
60-
// Add the header text
61-
$headerLink.text(tabHeadingText);
62-
// Register the handler to show the content when the tab is clicked
63-
$headerLink.click(function (e) {
64-
e.preventDefault();
65-
$(this).tab('show');
12+
$('ul[tab-list]').each(function (i, element) {
13+
var $list = $(element);
14+
$list.wrap('<div tab-area="' + i + '"></div>');
15+
var $tabContentArea = $('<div tab-content-area="' + i +'"></div>');
16+
$tabContentArea.insertAfter ($list);
17+
$list.children('li[tab]').each(function (i, element) {
18+
var $tab = $(element);
19+
var tabValue = $tab.attr('tab');
20+
var $content = $tab.contents().detach();
21+
$tab.text(tabValue);
22+
$tabContentArea.append($content);
23+
$content.wrapAll('<div tab-content="' + tabValue + '"></div>');
24+
});
25+
});
26+
$('div[tab-area]').each(function (i, element) {
27+
var $tabArea = $(element);
28+
var tabAreaValue = $tabArea.attr ('tab-area');
29+
var $tabList = $tabArea.children('ul[tab-list]');
30+
var initialTabValue = $tabList.children('li[tab]:first-child').attr('tab');
31+
var tabListValue = $tabArea.children('ul[tab-list]').attr('tab-list');
32+
var urlParam = $(document).getUrlParam (tabListValue);
33+
if (tabListValue == 'os') {
34+
initialTabValue = $.ua.os.name || initialTabValue;
35+
} else if (tabListValue == 'os-version') {
36+
initialTabValue = osName = $.ua.os.version || initialTabValue;
37+
}
38+
if (tabListValue == 'os-version') {
39+
var $versionTab = $tabArea.parents('div[tab-content]');
40+
if ($versionTab) {
41+
var versionTabValue = $versionTab.attr('tab-content');
42+
var key = tabListValue + '.' + versionTabValue;
43+
if (localStorage.getItem(key)) {
44+
initialTabValue = localStorage.getItem(key) || initialTabValue;
45+
}
46+
}
47+
} else {
48+
if (supports_html5_storage() && localStorage.getItem(tabListValue)) {
49+
initialTabValue = localStorage.getItem(tabListValue) || initialTabValue;
50+
}
51+
}
52+
$tabList.children('li[tab]').each(function (i, element) {
53+
var $tab = $(element);
54+
var tabValue = $tab.attr('tab');
55+
$tab.on('click', function () {
56+
$('ul[tab-list="' + tabListValue + '"]').each(function (i, element) {
57+
var $tabArea2 = $(element).parent('div[tab-area]');
58+
var $tabList2 = $tabArea2.children('ul[tab-list]');
59+
var $tab2 = $tabList2.children('li[tab="' + tabValue + '"]');
60+
$tabList2.children('li[tab]').removeClass("tab-active");
61+
$tab2.addClass("tab-active");
62+
var $tabContentArea2 = $tabArea2.children('div[tab-content-area]');
63+
$tabContentArea2.children('div[tab-content]').hide ();
64+
var $content = $tabContentArea2.children('div[tab-content="' + tabValue + '"]');
65+
$content.show ();
66+
});
67+
if (supports_html5_storage() && tabListValue) {
68+
if (tabListValue == 'os-version') {
69+
var $versionTab = $tabArea.parents('div[tab-content]');
70+
if ($versionTab) {
71+
var versionTabValue = $versionTab.attr('tab-content');
72+
localStorage.setItem(tabListValue + '.' + versionTabValue, tabValue);
73+
}
74+
} else {
75+
localStorage.setItem(tabListValue, tabValue);
76+
}
77+
}
6678
});
67-
68-
// Show the current tab (this will hide all others)
69-
// TODO: This should be replaced with the old loader logic
70-
$headerLink.tab('show');
79+
if (urlParam && urlParam == tabValue) {
80+
initialTabValue = tabValue;
81+
}
82+
});
83+
$tabList.children('li[tab="' + initialTabValue + '"]').addClass("tab-active");
84+
var $tabContentArea = $tabArea.children('div[tab-content-area]');
85+
$tabContentArea.children('div[tab-content]').each(function (i, element) {
86+
var $content = $(element);
87+
var tabContentValue = $content.attr('tab-content');
88+
if (tabContentValue != initialTabValue) {
89+
$content.hide ();
90+
}
7191
});
72-
7392
});
7493
});

0 commit comments

Comments
 (0)