aboutsummaryrefslogtreecommitdiff
path: root/contexts/data/lib/closure-library/closure/goog/demos/tabpane.html
diff options
context:
space:
mode:
Diffstat (limited to 'contexts/data/lib/closure-library/closure/goog/demos/tabpane.html')
-rw-r--r--contexts/data/lib/closure-library/closure/goog/demos/tabpane.html302
1 files changed, 0 insertions, 302 deletions
diff --git a/contexts/data/lib/closure-library/closure/goog/demos/tabpane.html b/contexts/data/lib/closure-library/closure/goog/demos/tabpane.html
deleted file mode 100644
index 20aaf5d..0000000
--- a/contexts/data/lib/closure-library/closure/goog/demos/tabpane.html
+++ /dev/null
@@ -1,302 +0,0 @@
-<!DOCTYPE html>
-<html>
-<!--
-Copyright 2010 The Closure Library Authors. All Rights Reserved.
-
-Use of this source code is governed by the Apache License, Version 2.0.
-See the COPYING file for details.
--->
-<head>
- <title>goog.ui.TabPane</title>
- <meta charset="utf-8">
- <script src="../base.js"></script>
- <script>
- goog.require('goog.ui.TabPane');
- </script>
- <link rel="stylesheet" href="css/demo.css">
- <style>
- .goog-tabpane {
- background: threedface;
- padding-left: 1px;
- position: relative;
- }
-
- .goog-tabpane-tabs {
- list-style: none;
- margin: 0px;
- padding: 0px;
- height: 1ex;
- position: relative;
- }
-
- .goog-tabpane-left .goog-tabpane-tabs {
- float: left;
- }
-
- .goog-tabpane-right .goog-tabpane-tabs {
- float: right;
- }
-
- .goog-tabpane-cont {
- overflow: auto;
- background: threedface;
- border: 1px solid;
- border-color: threedhighlight threedshadow threedshadow threedhighlight;
- padding: 2px;
- height: 200px;
- }
-
- .goog-tabpane-tab, .goog-tabpane-tab-selected {
- display: block;
- padding: 0px 3ex;
- background: threedface;
- border: 1px solid;
- margin: 0px;
- }
-
- .goog-tabpane-top .goog-tabpane-tab,
- .goog-tabpane-top .goog-tabpane-tab-selected,
- .goog-tabpane-bottom .goog-tabpane-tab,
- .goog-tabpane-bottom .goog-tabpane-tab-selected {
- float: left;
- }
-
- .goog-tabpane-top .goog-tabpane-tab,
- .goog-tabpane-top .goog-tabpane-tab-selected {
- border-color: threedhighlight threedshadow threedface threedhighlight;
- }
-
- .goog-tabpane-bottom .goog-tabpane-tab,
- .goog-tabpane-bottom .goog-tabpane-tab-selected {
- border-color: threedface threedshadow threedshadow threedhighlight;
- }
-
- .goog-tabpane-left .goog-tabpane-tab,
- .goog-tabpane-left .goog-tabpane-tab-selected {
- border-color: threedhighlight threedface threedshadow threedhighlight;
- }
-
- .goog-tabpane-right .goog-tabpane-tab,
- .goog-tabpane-right .goog-tabpane-tab-selected {
- border-color: threedhighlight threedshadow threedshadow threedface;
- }
-
- .goog-tabpane-top .goog-tabpane-tab {
- margin-top: 3px;
- }
-
- .goog-tabpane-tab-selected {
- font-weight: bold;
- }
-
- .goog-tabpane-tab-selected,
- .goog-tabpane-tab-selected {
- padding-bottom: 2px;
- padding-top: 2px;
- }
-
- .goog-tabpane-top .goog-tabpane-tab-selected {
- position: relative;
- top: 1px;
- }
-
- .goog-tabpane-bottom .goog-tabpane-tab-selected {
- position: relative;
- top: -1px;
- }
-
- .goog-tabpane-left .goog-tabpane-tab-selected {
- position: relative;
- left: 1px;
- }
-
- .goog-tabpane-right .goog-tabpane-tab-selected {
- position: relative;
- left: -1px;
- }
-
- #tabpane2 .goog-tabpane-tab {
- margin-top: 0px;
- }
-
- p {
- margin-top: 0px;
- }
-
- </style>
-</head>
-<body>
- <h1>goog.ui.TabPane</h1>
-
- <div id="tabpane1"></div>
- <strong id="tabpane1index"></strong> selected in tab pane 1.<br/><br/>
-
- <h3>Bottom tabs</h3>
- <div id="tabpane2">
- <div>
- <h2>Initial page</h2>
- <p>
- Page created automatically from tab pane child node.
- </p>
- </div>
- </div>
-
- <h3>Left tabs</h3>
- <div id="tabpane3">
- <div>
- <h2>Front page!</h2>
- <p>
- Page created automatically from tab pane child node.
- </p>
- </div>
- </div>
-
- <h3>Right tabs</h3>
- <div id="tabpane4">
- <div>
- <h2>Right 1</h2>
- <p>
- Page created automatically from tab pane child node.
- </p>
- </div>
- <div>
- <h2>Right 2</h2>
- <p>
- So was this page.
- </p>
- </div>
- </div>
-
- <div id="page1">
- <h2>Page 1</h2>
- <p>
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ac augue sed
- massa placerat iaculis. Aliquam tempor dictum massa. Quisque vehicula justo
- ut tellus. Integer urna. Aliquam libero justo, ornare at, pretium ac,
- vulputate quis, ante. Sed arcu. Etiam sit amet turpis. Maecenas pede. Sed
- turpis. Sed ultricies commodo nisl. Morbi eget magna quis nisi euismod
- porttitor. Vivamus lacinia massa et sem. Donec consequat ligula sed tellus.
- Suspendisse enim sapien, vestibulum nec, eleifend id, placerat sit amet,
- risus. Mauris in pede ac lorem varius facilisis. Donec dui. Nam mollis nisi
- eu neque. Cras luctus nisl at sapien. Ut eleifend, odio id luctus
- pellentesque, lorem diam dictum velit, ac gravida lectus magna vel velit.
- </p>
- <p>
- Etiam tempus, ante semper iaculis ultrices, ligula eros lobortis tellus, sit
- amet luctus dolor nisl sit amet dolor. Donec in velit. Vivamus facilisis.
- Proin nisi felis, commodo ut, porta dignissim, vestibulum quis, ligula. Ut
- egestas porttitor tortor. Ut porttitor diam a est. Sed placerat. Aliquam
- luctus est a risus. Aenean blandit nibh et justo. Phasellus vel lectus ut
- leo dictum consequat. Nam tincidunt facilisis nulla. Nunc nonummy tempus
- quam. Aliquam id enim. Sed rhoncus cursus lorem. Curabitur ultricies, enim
- quis eleifend mattis, est velit dapibus dolor, quis laoreet arcu tortor
- volutpat tortor. Pellentesque habitant morbi tristique senectus et netus et
- malesuada fames ac turpis egestas. Curabitur nec mauris et purus aliquam
- mattis. Cras rhoncus posuere sapien. Class aptent taciti sociosqu ad litora
- torquent per conubia nostra, per inceptos hymenaeos.
- </p>
- <p>
- Mauris lacinia ornare nunc. Donec molestie. Sed nulla libero, tincidunt vel,
- porta sit amet, nonummy eget, augue. Class aptent taciti sociosqu ad litora
- torquent per conubia nostra, per inceptos hymenaeos. Donec ac risus. Cras
- euismod congue orci. Mauris mattis, ipsum at vestibulum bibendum, odio est
- rhoncus nisi, vel aliquam ante velit quis neque. Duis nonummy tortor id
- ante. Aenean auctor odio non nulla. Fusce hendrerit, mi et fringilla
- venenatis, sem ipsum fermentum lorem, vel posuere urna eros eget massa.
- </p>
- <p>
- Nulla nec sapien eget mauris pretium tempor. Phasellus scelerisque quam id
- mauris. Cras erat ante, pretium ut, vestibulum ac, tincidunt ut, nunc.
- Vivamus velit sapien, feugiat ac, elementum ac, viverra non, leo. Phasellus
- imperdiet, magna at placerat consectetuer, enim urna aliquam augue, nec
- tincidunt justo lectus nec lectus. Nam neque. Nullam ullamcorper euismod
- augue. Maecenas arcu purus, sollicitudin nec, consequat a, gravida quis,
- massa. Nullam bibendum viverra risus. Sed nibh. Morbi dapibus pellentesque
- erat.
- </p>
- <p>
- Cras non tellus. Maecenas nulla est, tincidunt sed, porta sit amet, placerat
- sed, diam. Morbi pulvinar. Vestibulum ante ipsum primis in faucibus orci
- luctus et ultrices posuere cubilia Curae; Praesent felis lacus, pretium at,
- egestas sed, fermentum at, est. Pellentesque sagittis feugiat orci. Nam
- augue. Sed eget dolor. Proin vitae metus scelerisque massa fermentum tempus.
- Nulla facilisi. Pellentesque habitant morbi tristique senectus et netus et
- malesuada fames ac turpis egestas. Aenean eleifend, leo gravida mollis
- tempor, tellus ipsum porttitor leo, eget condimentum tellus neque sit amet
- orci. Sed non lectus. Suspendisse nonummy purus ac massa. Sed quis elit
- dapibus nunc semper porta. Maecenas risus eros, euismod quis, sagittis eget,
- aliquet eget, dui. Donec vel nibh. Vivamus nunc purus, euismod in, feugiat
- in, sodales vitae, nunc. Nulla lobortis.
- </p>
- </div>
-
- <div id="page2">
- <p>
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras et nisi id
- lorem tempor semper. Suspendisse ante. Integer ligula urna, venenatis quis,
- placerat vitae, commodo quis, sapien. Quisque nec lectus. Sed non dolor. Sed
- congue, nisi in pharetra consequat, odio diam pulvinar arcu, in laoreet elit
- risus id ipsum. Class aptent taciti sociosqu ad litora torquent per conubia
- nostra, per inceptos hymenaeos. Praesent tellus enim, imperdiet a, sagittis
- id, pulvinar vel, tortor. Integer nulla. Sed nulla augue, lacinia id,
- vulputate eu, rhoncus non, ante. Integer lobortis eros vitae quam. Phasellus
- sagittis, ipsum sollicitudin bibendum laoreet, arcu erat luctus lacus, vel
- pharetra felis metus tincidunt diam. Cras ac augue in enim ultricies
- aliquam.
- </p>
- <input type="text" />
- <select><option>Select box</option></select>
- <button>Button</button>
- </div>
-
- <div id="page5">
- <h2>Page 5</h2>
- <p>
- This is page 5.
- </p>
- </div>
-
- <script>
-
- var tabPane = new goog.ui.TabPane(document.getElementById('tabpane1'));
- tabPane.addPage(new goog.ui.TabPane.TabPage(
- document.getElementById('page1')));
- tabPane.addPage(new goog.ui.TabPane.TabPage(
- document.getElementById('page2'), 'Page 2'));
- tabPane.addPage(new goog.ui.TabPane.TabPage(null, 'Page 3'));
- tabPane.addPage(new goog.ui.TabPane.TabPage('Page 5'));
- tabPane.addPage(new goog.ui.TabPane.TabPage('Page 4'), 3);
-
- var pg5 = new goog.ui.TabPane.TabPage(document.getElementById('page5'))
- tabPane.addPage(pg5);
- tabPane.addPage(new goog.ui.TabPane.TabPage('Page 6'));
- tabPane.removePage(pg5);
- tabPane.removePage(2);
-
- function tabChanged(event) {
- goog.dom.setTextContent(document.getElementById('tabpane1index'),
- event.page.getTitle());
- }
- goog.events.listen(tabPane, goog.ui.TabPane.Events.CHANGE, tabChanged);
-
- tabPane.setSelectedIndex(1);
-
-
- var tabPane2 = new goog.ui.TabPane(document.getElementById('tabpane2'),
- goog.ui.TabPane.TabLocation.BOTTOM);
- tabPane2.addPage(new goog.ui.TabPane.TabPage('Page 7'));
- tabPane2.addPage(pg5);
-
- pg5.select();
- pg5.setTitle('Renamed Page');
-
- var tabPane3 = new goog.ui.TabPane(document.getElementById('tabpane3'),
- goog.ui.TabPane.TabLocation.LEFT);
- tabPane3.addPage(new goog.ui.TabPane.TabPage('Page 7'));
-
- var tabPane4 = new goog.ui.TabPane(document.getElementById('tabpane4'),
- goog.ui.TabPane.TabLocation.RIGHT);
- tabPane4.addPage(new goog.ui.TabPane.TabPage('Page 99'));
- </script>
-</body>
-</html>