Ver código fonte

HUE-27. Convert collection of JFrameFilters to Behaviors

* Fixing Tabs UI
* Cleaning up some old ccs-data_table usage
* Pulling art-widgets to pick up a fix to splitview
Aaron Newton 15 anos atrás
pai
commit
a8f638f7e7

+ 3 - 3
apps/beeswax/src/beeswax/templates/describe_table.mako

@@ -91,8 +91,8 @@ ${wrappers.head("Beeswax Table Metadata: " + table.tableName, section='tables')}
       </div>
     </div>dd
     <div class="right_col">
-      <div class="ccs-tab_ui">
-        <ul class="toolbar ccs-tabs">
+      <div data-filters="Tabs">
+        <ul class="toolbar tabs">
           % if top_rows is not None:
             <li><span>Sample</span></li>
           % endif
@@ -101,7 +101,7 @@ ${wrappers.head("Beeswax Table Metadata: " + table.tableName, section='tables')}
             <li><span>Partition Columns</span></li>
           % endif
         </ul>
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           % if top_rows is not None:
             <li class="bw-table_sample">
               <table data-filters="HtmlTable" cellpadding="0" cellspacing="0">

+ 3 - 3
apps/beeswax/src/beeswax/templates/execute.mako

@@ -231,8 +231,8 @@ ${wrappers.head('Hive Query', section='query')}
         % endif
 
         % if error_messages or log:
-          <div class="ccs-tab_ui">
-            <ul class="toolbar bw-results_tabs ccs-tabs ccs-right clearfix">
+          <div data-filters="Tabs">
+            <ul class="toolbar bw-results_tabs ccs-right clearfix tabs" data-filters="Tabs">
               <li><span>Query</span></li>
               % if error_message or log:
               <li><span>
@@ -242,7 +242,7 @@ ${wrappers.head('Hive Query', section='query')}
               </span></li>
               % endif
             </ul>
-            <ul class="ccs-tab_sections ccs-clear">
+            <ul class="tab_sections ccs-clear">
               <li>
                 ${query()}
               </li>

+ 3 - 3
apps/beeswax/src/beeswax/templates/explain.mako

@@ -23,13 +23,13 @@ ${wrappers.head('Query Explanation', section='saved queries')}
       ${util.render_query_context(query_context)}
     </div>
     <div class="right_col jframe_padded">
-      <div class="ccs-tab_ui">
-        <ul class="toolbar bw-results_tabs ccs-tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+        <ul class="toolbar bw-results_tabs tabs ccs-right clearfix">
           <li><span>Explanation</span></li>
           <li><span>Query</span></li>
         </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             <pre>${explanation}</pre>
           </li>

+ 3 - 3
apps/beeswax/src/beeswax/templates/my_queries.mako

@@ -25,13 +25,13 @@ ${wrappers.head("Beeswax: My Queries", section='my queries')}
 ## ----------------- Saved queries -------------------
 ##
 <div id="my_queries" class="view">
-  <div class="ccs-tab_ui">
-    <ul class="toolbar bw-my_queries_tabs ccs-tabs clearfix">
+  <div data-filters="Tabs">
+    <ul class="toolbar bw-my_queries_tabs tabs clearfix">
       <li><span>Recent Saved Queries</span></li>
       <li><span>Recent Run Queries</span></li>
     </ul>
 
-    <ul class="ccs-tab_sections ccs-clear">
+    <ul class="tab_sections ccs-clear">
       <li>
         <table data-filters="HtmlTable" class="selectable" cellpadding="0" cellspacing="0">
           <thead>

+ 3 - 3
apps/beeswax/src/beeswax/templates/watch_results.mako

@@ -82,8 +82,8 @@ ${wrappers.head("Beeswax: Query Results", section='query')}
         </dl>
     </div>
     <div class="right_col">
-      <div class="ccs-tab_ui">
-          <ul class="toolbar bw-results_tabs ccs-tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+          <ul class="toolbar bw-results_tabs tabs ccs-right clearfix">
             <li><span>
                 % if error:
                   Error
@@ -95,7 +95,7 @@ ${wrappers.head("Beeswax: Query Results", section='query')}
             <li><span>Log</span></li>
           </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             % if error:
               <div class="ccs-error jframe_padded">

+ 3 - 3
apps/beeswax/src/beeswax/templates/watch_wait.mako

@@ -56,13 +56,13 @@ ${wrappers.head("Beeswax: Waiting for query...", section='query')}
       </dl>
     </div>
     <div class="right_col jframe_padded">
-      <div class="ccs-tab_ui">
-        <ul class="toolbar bw-results_tabs ccs-tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+        <ul class="toolbar bw-results_tabs tabs ccs-right clearfix">
           <li><span>Log</span></li>
           <li><span>Query</span></li>
         </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             <h3 class="ccs-hidden">Server Log</h3>
             <pre data-partial-id="log">${log}</pre>

+ 3 - 3
apps/beeswax/static/css/beeswax.css

@@ -648,7 +648,7 @@ div.beeswax a.bw-install_samples, div.beeswax a.bw-new_table {
 /* table page */
 div.beeswax .bw-col_table_wrapper, div.beeswax .bw-table_sample {
 }
-div.beeswax .describe_table .ccs-tabs {
+div.beeswax .describe_table .tabs {
 	margin: 10px 10px 0px 0px;
 }
 div.beeswax .bw-location_link a:hover {
@@ -733,7 +733,7 @@ div.beeswax .bw-view_result {
 	background: url(/static/art/icons/magnifier.png);
 	margin: 2px 0;
 }
-div.beeswax .ccs-tabs li {
+div.beeswax .tabs li {
 	margin: 0px 2px;
 }
 div.beeswax .watch_results .bw-result_nav {
@@ -787,7 +787,7 @@ div.beeswax .bw-actions ul li a.bw-download_csv {
 div.beeswax .bw-actions ul li a.bw-download_xls {
 	background: #9acef5 url(/static/art/led-icons/doc_excel_table.png) no-repeat 4px 50%;
 }
-div.beeswax .ccs-window-toolbar .ccs-tabs {
+div.beeswax .ccs-window-toolbar .tabs {
 	left:206px;
 	position:absolute;
 	top:69px;

+ 4 - 4
apps/jframegallery/src/jframegallery/templates/tabs-toolbar.html

@@ -22,14 +22,14 @@ limitations under the License.
 	</head>
 	<body>
 		<div class="jframe_padded">
-			<div class="ccs-tab_ui">
-				<ul class="toolbar ccs-tabs" style="position: absolute; top:69px; left: 30px;">
+			<div data-filters="Tabs">
+				<ul class="toolbar tabs" style="position: absolute; top:69px; left: 30px;">
 					<li><span>Tab 1</span></li>
 					<li><span>Tab 2</span></li>
 				</ul>
-				<ul class="ccs-tab_sections ccs-clear">
+				<ul class="tab_sections ccs-clear">
 					<li>
-						<p>I'm the section for Tab 1. Note that my UL has both a .ccs-tab_sections.</p>
+						<p>I'm the section for Tab 1. Note that my UL has both a .tab_sections.</p>
 						<p>My tabs are in the header of the window. I get this effect by just adding the .toolbar class to the UL of the tabs. I have to position the bar myself to get it snug up against the content.</p>
 					</li>
 					<li>

+ 4 - 4
apps/jframegallery/src/jframegallery/templates/tabs.html

@@ -22,14 +22,14 @@ limitations under the License.
 	</head>
 	<body>
 		<div class="jframe_padded">
-			<div class="ccs-tab_ui">
-				<ul class="ccs-tabs ccs-right clearfix">
+			<div data-filters="Tabs">
+				<ul class="tabs ccs-right clearfix">
 					<li><span>Tab 1</span></li>
 					<li><span>Tab 2</span></li>
 				</ul>
-				<ul class="ccs-tab_sections ccs-clear" style="border-top: 1px solid #999; padding: 10px">
+				<ul class="tab_sections ccs-clear" style="border-top: 1px solid #999; padding: 10px">
 					<li>
-						<p>I'm the section for Tab 1. Note that my UL has both a .ccs-tab_sections class but also a .ccs-clear; that's because the tabs are aligned to the right, so we need to clear that float.</p>
+						<p>I'm the section for Tab 1. Note that my UL has both a .tab_sections class but also a .ccs-clear; that's because the tabs are aligned to the right, so we need to clear that float.</p>
 						<p>
 							The tabs are right aligned because their UL has the class .ccs-right; to fix the firefox height bug with floating elements, we also give it the class .clearfix (<a href="http://www.positioniseverything.net/easyclearing.html">details on this</a>). Note that if we didn't want the tabs on the right we just wouldn't give it the .ccs-right class, and in that case we wouldn't need the .clearfix or .ccs-clear classes in there either.
 						</p>

+ 3 - 3
apps/jobbrowser/src/jobbrowser/templates/attempt.mako

@@ -35,14 +35,14 @@
         </dl>
       </div>
 
-      <div class="ccs-tab_ui">
-        <ul class="ccs-tabs jtv_tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+        <ul class="tabs jtv_tabs ccs-right clearfix">
           <li><span>Metadata</span></li>
           <li><span>Counters</span></li>
           <li><span>Logs</span></li>
         </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             <table data-filters="HtmlTable" class="jt_meta_table sortable" cellpadding="0" cellspacing="0">
               <thead>

+ 3 - 3
apps/jobbrowser/src/jobbrowser/templates/job.mako

@@ -113,14 +113,14 @@
 
       </div>
 
-      <div class="ccs-tab_ui">
-        <ul class="ccs-tabs jtv_tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+        <ul class="tabs jtv_tabs ccs-right clearfix">
           <li><span>Tasks</span></li>
           <li><span>Metadata</span></li>
           <li><span>Counters</span></li>
         </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             <div class="jt_mr_display">
               <dl class="jtv_graph">

+ 3 - 3
apps/jobbrowser/src/jobbrowser/templates/task.mako

@@ -31,14 +31,14 @@
         </dl>
       </div>
 
-      <div class="ccs-tab_ui">
-        <ul class="ccs-tabs jtv_tabs ccs-right clearfix">
+      <div data-filters="Tabs">
+        <ul class="tabs jtv_tabs ccs-right clearfix">
           <li><span>Attempts</span></li>
           <li><span>Metadata</span></li>
           <li><span>Counters</span></li>
         </ul>
 
-        <ul class="ccs-tab_sections ccs-clear">
+        <ul class="tab_sections ccs-clear">
           <li>
             <table border="0" cellpadding="0" cellspacing="0" data-filters="HtmlTable" class="jt_meta_table sortable">
               <thead>

+ 2 - 6
apps/jobbrowser/static/css/jobbrowser.css

@@ -238,15 +238,11 @@ div.job_browser_job div.jt_mr_display .jt_maps, div.job_browser_job div.jt_mr_di
 div.job_browser_job span.jt_reduces_complete, div.job_browser_job span.jt_maps_complete {
 	border-left: 1px solid #fff;
 }
-div.job_browser_job div.ccs-tab_ui {
-/*	width: 50%;*/
-}
-div.job_browser_job div.ccs-tab_ui ul.ccs-tab_sections {
+div.job_browser_job ul.tab_sections {
 	border-top: 1px solid #666;
 }
-div.job_browser_job div.ccs-tab_ui ul.ccs-tab_sections .ccs-data_table {
+div.job_browser_job ul.tab_sections [data-filters*=HtmlTable] {
 	border-top: none;
-	
 }
 div.job_browser_job .task_table_type {
 	width: 100px;

+ 12 - 12
desktop/core/static/css/shared.css

@@ -114,34 +114,34 @@
 /* tabbed layout */
 /* .css-tabs, a ul; container for the tabs 
 
-<ul class="ccs-tabs">
+<ul class="tabs">
 <li><span>Tab 1</span></li>
 <li><span>Tab 2</span></li>
 <li><span>Tab 3</span></li>
 </ul>
-<ul class="ccs-tab_sections">
+<ul class="tab_sections">
 	<li> section for tab 1 </li>
 	<li> section for tab 2 </li>
 	<li> section for tab 3 </li>
 </ul>
 
 */
-.ccs-shared ul.ccs-tabs {
+.ccs-shared ul.tabs {
 	margin: none;
 	padding: none;
 }
 .ccs-shared .right_col pre {
 	overflow: visible;
 }
-.ccs-shared .right_col ul.ccs-tab_sections {
+.ccs-shared .right_col ul.tab_sections {
 	overflow: visible;
 }
 
-.ccs-shared ul.ccs-tab_sections {
+.ccs-shared ul.tab_sections {
 	overflow: visible;
 }
 /* the tab elements, li elements */
-.ccs-shared .ccs-tabs li {
+.ccs-shared .tabs li {
 	cursor: pointer;
 	height: 19px;
 	line-height: 19px;
@@ -150,7 +150,7 @@
 	color: #444;
 }
 /* each tab's text/html is wrapped in a span */
-.ccs-tabs li span {
+.tabs li span {
 	height: 18px;
 	display: block;
 	background: url(/static/art/tabs.png) right top;
@@ -158,22 +158,22 @@
 	left: 6px;
 	padding: 1px 6px 0px 0px;
 }
-.ccs-shared .ccs-tabs > li {
+.ccs-shared .tabs > li {
 	list-style: none;
 	float: left;
 }
-.ccs-shared .ccs-tabs li.tabSelected {
+.ccs-shared .tabs li.tabSelected {
 	color: #000;
 	background: url(/static/art/tabs.png) left 38px;
 }
-.ccs-shared .ccs-tabs li.tabSelected span {
+.ccs-shared .tabs li.tabSelected span {
 	background: url(/static/art/tabs.png) right 38px;
 }
-.ccs-shared .ccs-tabs li:hover {
+.ccs-shared .tabs li:hover {
 	color: #000;
 	background: url(/static/art/tabs.png) left 19px;
 }
-.ccs-shared .ccs-tabs li:hover span {
+.ccs-shared .tabs li:hover span {
 	background: url(/static/art/tabs.png) right 19px;
 }
 

+ 1 - 1
desktop/core/static/js/Source/BehaviorFilters/Behavior.Tabs.js

@@ -1,6 +1,6 @@
 /*
 ---
-description: Adds a tab interface (TabSwapper instance) for elements with .css-tab_ui. Matched with tab elements that are .ccs-tabs and sections that are .ccs-tab_sections.
+description: Adds a tab interface (TabSwapper instance) for elements with .css-tab_ui. Matched with tab elements that are .tabs and sections that are .tab_sections.
 provides: [Behavior.Tabs]
 requires: [Widgets/Behavior, clientcide/TabSwapper]
 script: Behavior.Tabs.js

+ 2 - 0
desktop/core/static/js/Source/JFrameFilters/CCS.JFrame.Deprecated.js

@@ -165,6 +165,8 @@ script: CCS.JFrame.ArtButtons.js
 			container.getElements('.ccs-tab_ui').each(function(element){
 				dbug.warn('you are using a deprecated JFrame filter (ccs-tab_ui) on %o, use the Tabs data-filter instead.', element);
 				element.addDataFilter('Tabs');
+				element.getElements('.ccs-tabs').addClass('tabs');
+				element.getElements('.ccs-tab_sections').addClass('tab_sections');
 			});
 		},
 

+ 1 - 1
ext/thirdparty/js/art-widgets.hash

@@ -1 +1 @@
-1e84c9987aca61b74b3c0458fedfcb99a6a1bef8
+79bed724187ab2c8de6d687476b02332c7ded40b