gridx-rails 1.1.0

data/app/assets/stylesheets/gridx/resources/basic.css

@@ -0,0 +1,482 @@
+/*Header, Body, Scroller*/
+/*common*/
+.gridx {
+	position: relative;
+	overflow: hidden;
+	border: 1px solid #ddd;
+}
+
+.gridxHeader,
+.gridxFooter {
+	overflow: hidden;
+	background-color: #eee;
+}
+
+.gridxLoad {
+	display: none;
+	position: absolute;
+	top: 0;
+	left: 0;
+}
+.gridxLoading {
+	display: block;
+	width: 100%;
+	height: 100%;
+	background: url('images/treeExpand_loading.gif') #ddd center center no-repeat;
+	z-index: 99999;
+	opacity: 0.3;
+}
+
+/* Keep footer at bottom, so the grid won't distort too much when zoomed in/out*/
+.gridxFooter {
+	position: absolute;
+	left: 0;
+	bottom: 0;
+	width: 100%;
+}
+
+.gridxHScrollerInner {
+	display: none;
+}
+
+.gridxMain {
+	position: relative;
+}
+
+/*Header*/
+.gridxHeaderRow {
+	background-color: #eee;
+	border-bottom: 1px solid #ccc;
+	position: relative;
+}
+
+.gridxHeaderRowHidden {
+	height: 0;
+}
+
+.gridxHeaderRowInner {
+	overflow: hidden;
+	border-style: solid;
+	border-color: #ccc;
+	border-width: 0 1px 0 0;
+}
+.dj_ie7 .gridxHeaderRowInner,
+.dj_ie6 .gridxHeaderRowInner {
+	position: relative;
+}
+
+.gridxHeaderRow table {
+	border-collapse: separate;
+	border-spacing: 0;
+	border: none;
+	table-layout: fixed;
+	width: 1px;
+}
+.gridxGH .gridxHeaderRow table {
+	width: auto;
+}
+.gridxPercentColumnWidth .gridxHeaderRow table,
+.gridxPercentColumnWidth .gridxRow table.gridxRowTable {
+	width: 100%;
+}
+
+.gridxGroupHeader,
+.gridxHeaderRow .gridxCell {
+	border-width: 1px;
+	border-style: solid;
+	border-color: transparent #ccc transparent transparent;
+	padding: 3px;
+	text-align: left;
+	overflow: hidden;
+}
+
+.gridx .gridxHeader .gridxHeaderRow .gridxHeaderRowInner .gridxCell.gridxHeaderCellFocus {
+	border: 1px dashed darkblue;
+}
+
+.gridxHeaderRow :focus {
+	outline: none;
+}
+
+/*Body*/
+.gridxBody {
+	height: 100%;
+	width: 100%;
+	overflow: hidden;
+	position: absolute;
+	top: 0;
+	box-sizing: border-box; /* css3 rec */
+	-moz-box-sizing: border-box; /* ff2 */
+	-ms-box-sizing: border-box; /* ie8 */
+	-webkit-box-sizing: border-box; /* safari3 */
+	-khtml-box-sizing: border-box; /* konqueror */
+}
+
+.gridxBodyRowHoverEffect .gridxRowOver .gridxRowTable {
+	background-color: #cee8f2;
+}
+
+.gridxRow {
+	background-color: #fff;
+}
+
+.gridxRowHeaderRow table,
+.gridxRow .gridxRowTable {
+	border-collapse: separate;
+	border-spacing: 0;
+	border: none;
+	table-layout: fixed;
+	width: 1px;
+	empty-cells: show;
+}
+.dj_safari .gridxGH .gridxRow .gridxRowTable {
+	width: auto;
+}
+.dj_safari .gridxPercentColumnWidth .gridxRow .gridxRowTable {
+	width: 100%;
+}
+
+.gridxRow .gridxCell {
+	border-style: solid;
+	border-color: transparent #ccc #ccc transparent;
+	border-width: 1px;
+	padding: 3px;
+	text-align: left;
+	overflow: hidden;
+}
+
+.gridxCell.gridxCellChanged{
+	//background: url('images/gridxCellChanged.png') no-repeat top right;
+}
+
+.gridxRowDummy {
+	height: 24px;
+	width: 100%;
+	background: url('images/loadingAnimation.gif') no-repeat left;
+}
+
+.gridxBody .gridxCell:focus {
+	outline: none;
+}
+
+.gridx .gridxBody .gridxCellFocus {
+	border: 1px dashed darkblue !important;
+}
+
+.gridxBodyEmpty {
+	width: 100%;
+	height: 100px;
+	padding: 30px 0;
+	text-align: center;
+	position: absolute;
+	top: 0;
+	left: 0;
+}
+.gridxBodyEmpty:focus {
+	outline: 1px dotted #aaa;
+}
+
+/*HScroller*/
+.gridxHScrollerInner {
+	overflow: scroll;
+	overflow-y: hidden;
+	border: none;
+	outline: none;
+}
+
+/* ie6 will show the wrong height */
+.dj_ie6 .gridxHScrollerInner {
+	line-height: 0;
+}
+
+.gridxMac .gridxHScrollerInner::-webkit-scrollbar {
+	-webkit-appearance:none !important;
+	height:11px !important;
+}
+.gridxMac .gridxHScrollerInner::-webkit-scrollbar-thumb {
+	border-radius:8px !important;
+	border:2px solid white !important;
+	background-color:rgba(100,100,100,.5) !important;
+}
+.gridxMac .gridxHScrollerInner::-webkit-scrollbar-thumb:hover,
+.gridxMac .gridxHScrollerInner::-webkit-scrollbar-thumb:active,
+.gridxMac .gridxHScrollerInner::-webkit-scrollbar-thumb:focus {
+	background-color: rgba(0,0,0,.5) !important;
+}
+
+
+
+/*VScroller*/
+.gridxVScroller {
+	position: absolute;
+	top: 0px;
+	right: 0px;
+	overflow: scroll; 
+	overflow-x: hidden; 
+	border: none;
+	height: 100%;
+	outline: none;
+}
+
+.gridxMac .gridxVScroller::-webkit-scrollbar {
+	-webkit-appearance:none !important;
+	width:11px !important;
+	background-color: #eee !important;
+}
+.gridxMac .gridxVScroller::-webkit-scrollbar-thumb {
+	border-radius:8px !important;
+	border:2px solid white !important;
+	background-color:rgba(100,100,100,.5) !important;
+}
+.gridxMac .gridxVScroller::-webkit-scrollbar-thumb:hover,
+.gridxMac .gridxVScroller::-webkit-scrollbar-thumb:active,
+.gridxMac .gridxVScroller::-webkit-scrollbar-thumb:focus {
+	background-color: rgba(0,0,0,.5) !important;
+}
+
+
+/*RowHeader*/
+.gridxRowHeaderHeader,
+.gridxRowHeaderBody {
+	position: absolute;
+	left: 0;
+	top: 0;
+	height: 100%;
+	overflow: hidden;
+	border-right: 1px solid #E5DAC8;
+	box-sizing: border-box; /* css3 rec */
+	-moz-box-sizing: border-box; /* ff2 */
+	-ms-box-sizing: border-box; /* ie8 */
+	-webkit-box-sizing: border-box; /* safari3 */
+	-khtml-box-sizing: border-box; /* konqueror */	
+}
+
+.gridxRowHeaderBody table {
+	width: 100%;
+}
+.gridxRowHeaderHeader table {
+	height: 100%;
+}
+
+.gridxRowHeaderRow {
+	background: url("images/header.png") #EDF2F7 repeat-x bottom;
+	background: #edf2f7; /* Old browsers */
+	background: -moz-linear-gradient(top,  #edf2f7 0%, #d0dfea 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#edf2f7), color-stop(100%,#d0dfea)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* IE10+ */
+	background: linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* W3C */
+	width: 100%;
+	
+}
+
+.gridxRowHeaderHeader .gridxHeaderCellFocus {
+	border-top: 1px dashed darkblue;
+	border-bottom: 1px dashed darkblue;
+}
+	
+.gridxRowHeaderCell {
+	border-bottom: 1px solid #E5DAC8;
+}
+
+.gridxRowHeaderRow .gridxCellFocus {
+	border: 1px dashed darkblue !important;
+}
+
+/* Firefox can not fire onmouseover when mouse is "dragging" an "overflow: hidden" node. 
+ * This fix is for IndirectSelect working with ExtendedSelect only */
+.dj_gecko .gridx .gridxRowHeaderBody .gridxRowHeaderRow .gridxRowHeaderCell .dijitCheckBox {
+	overflow: visible;
+}
+
+
+/*Column Resizer*/
+/*Column resizing plugin*/
+.gridxColumnResizing {
+	cursor: ew-resize;
+}
+.dj_ie .gridxColumnResizing {
+	cursor: e-resize;
+}
+
+.gridxColumnResizer {
+	position: absolute;
+	height: 100%;
+	width: 2px;
+	background-color: #666;
+	z-index: 1000;
+	top: 0;
+}
+
+/*CellDijit*/
+.gridxCellWidget {
+	width: 100%;
+	height: 100%;
+}
+
+.gridxCellEditor,
+/* in IE dijitTextArea has width auto by default */
+.dj_ie [class~='dijitTextArea'].gridxCellEditor {
+	width: 100%;
+}
+
+[class~='dijitSliderV'].gridxCellEditor {
+	width: auto;
+}
+
+/* TouchVScroller */
+.gridxTouchVScroller .gridxVScroller {
+	display: none;
+}
+
+.gridxTouchVScroller .gridxMain {
+	overflow: hidden;
+}
+.gridxTouchVScroller .gridxBody {
+	height: auto !important;
+	width: auto !important;
+}
+
+.gridxTouchVScroller .gridxHeaderRowInner {
+	position: relative;
+}
+.gridxTouchVScroller .gridxHeaderRowInner > table {
+	position: absolute;
+}
+
+/* TouchScroll */
+.gridxTouchScrollVWrapper {
+    overflow: hidden;
+    position: absolute;
+    right: 2px;
+    top: 2px;
+    width: 5px;
+}
+
+.gridxTouchScrollHWrapper {
+    overflow: hidden;
+    position: absolute;
+	bottom: 2px;
+	left: 2px;
+	height: 5px;
+}
+
+.gridxTouchScrollVBar {
+    background-color: #606060;
+    opacity: 0;
+    position: absolute;
+    z-index: 999;
+    width: 5px;
+}
+
+.gridxTouchScrollHBar {
+    background-color: #606060;
+    opacity: 0;
+    position: absolute;
+    z-index: 999;
+	height: 5px;
+}
+
+.gridxTouchScrollVBar,
+.gridxTouchScrollHBar {
+	-webkit-transition-property: opacity;
+	-moz-transition-property: opacity;
+	-o-transition-property: opacity;
+	transition-property: opacity;
+	-webkit-transition-duration: 0.3s;
+	-moz-transition-duration: 0.3s;
+	-o-transition-duration: 0.3s;
+	transition-duration: 0.3s;
+}
+
+/* CSS Hidden Column */
+.gridxHiddenColumn {
+	display: none;
+}
+
+
+/*Header Menu*/
+.gridxHeaderMenu {
+	width: 100px;
+}
+.gridxHeaderMenuBtn {
+/*    float: right;*/
+/*    top: 1px;*/
+/*    bottom: 1px;*/
+	width: 10px;
+	height:13px;
+	border-left: 1px solid #fff;
+/*    display: none;*/
+/*    cursor: pointer;*/
+/*    background: transparent url(images/sprite_icons.png) no-repeat -97px 9px;*/
+	background: transparent url(images/sprite_icons.png) no-repeat -98px 5px;
+/*    margin-top:-4px;*/
+/*    margin-bottom: -4px;*/
+/*    margin-right: -3px;*/
+
+}
+.gridxHeaderMenuBtnInner {
+	display: none;
+}
+.dijit_a11y .gridxHeaderMenuBtnInner {
+	display: inline;
+}
+
+/*.gridxHeaderRow .gridxCell:hover .gridxHeaderMenuBtn{*/
+/*    display: block;*/
+/*}*/
+/*Header Menu End*/
+
+
+
+.gridxLoadMore {
+	padding: 10px;
+	text-align: center;
+}
+.gridxLoadMore button {
+	width: 100%;
+	min-height: 28px;
+}
+.gridxLoadingMore {
+	display: inline-block;
+	background-image: url('images/treeExpand_loading.gif');
+	vertical-align: middle;
+	width: 20px;
+	height: 20px;
+	margin: 0 5px;
+}
+
+/* header region */
+.gridxHeaderRegion {
+	float: right;
+	display: none;
+	cursor: pointer;
+}
+.gridxCell:hover .gridxHeaderRegion,
+.gridxHeaderRegionFocus .gridxHeaderRegion {
+	display: block;
+}
+.gridxHeaderRegionFocus .gridxSortNode:focus,
+.gridxHeaderRegionFocus .gridxHeaderRegion:focus {
+	outline: 1px dashed darkblue;
+}
+
+.gridxCellEditedBg{
+	background-image: url('images/gridxCellChanged.png');
+	height: 6px;
+	width: 6px;
+	position:absolute;
+	z-index:10
+}
+.gridxCellEditedBg span{
+	display: none;
+}
+
+.dijit_a11y .gridxCellEditedBg span{
+	position: relative;
+	display: block;
+	left: -3px;
+	color: white;
+	font-size: 8px;
+}

data/app/assets/stylesheets/gridx/resources/basic_rtl.css

@@ -0,0 +1,37 @@
+/* In IE7, if not set relative position, the margins can not be nagative.*/
+.dj_ie7 .gridxRtl .gridxHeaderRow table {
+	position: relative;
+}
+
+/* Body */
+.gridxRtl .gridxRow .gridxCell {
+	border-color: transparent transparent #ccc #ccc;
+	text-align: right;
+}
+
+/* VScroller */
+.gridxRtl .gridxVScroller {
+	right: auto;
+	left: 0;
+}
+
+/* some browsers do not automatically move the scroll bar to left, so we move for them */
+.dj_ff3 .gridxRtl .gridxVScroller,
+.dj_webkit .gridxRtl .gridxVScroller {
+	left: -1px;
+}
+
+/* RowHeader */
+.gridxRtl .gridxRowHeaderHeader,
+.gridxRtl .gridxRowHeaderBody {
+	right: 0;
+	left: auto;
+	border-right: none;
+	border-left: 1px solid #E5DAC8;
+}
+
+/* HeaderRegion */
+.gridxRtl .gridxHeaderRegion {
+	float: left;
+}
+

data/app/assets/stylesheets/gridx/resources/claro/Gridx.css

@@ -0,0 +1,16 @@
+@import url('../basic.css');
+@import url('../sort.css');
+@import url('../lock.css');
+@import url('../Tree.css');
+@import url('../Dod.css');
+@import url('../select.css');
+@import url('../bar.css');
+@import url('../dnd.css');
+@import url('../filter.css');
+@import url('../pagination.css');
+
+@import url('basic.css');
+@import url('filter.css');
+@import url('lock.css');
+@import url('select.css');
+@import url('pagination.css');

data/app/assets/stylesheets/gridx/resources/claro/Gridx_rtl.css

@@ -0,0 +1,7 @@
+@import url('../basic_rtl.css');
+@import url('../sort_rtl.css');
+@import url('../pagination_rtl.css');
+@import url('../Tree_rtl.css');
+@import url('../filter_rtl.css');
+
+@import url('basic_rtl.css');

data/app/assets/stylesheets/gridx/resources/claro/basic.css

@@ -0,0 +1,109 @@
+/*common*/
+.claro .gridx {
+	background-color: #fff;
+	border: 1px solid #DBDBDB;
+	color: #131313;
+}
+
+/*Body*/
+.claro .gridxCell{
+	border-color: transparent #E5DAC8 #E5DAC8 transparent;
+}
+.claro .gridxRowOdd .gridxRowTable {
+	background-color: #f1f8ff;
+}
+.claro .gridxBodyRowHoverEffect .gridxRowOver .gridxRowTable,
+.claro .gridxBodyRowHoverEffect .gridxRowOver .gridxCell {
+	background:url("../images/row_back.png") #ABD6FF repeat-x;
+}
+
+.claro .gridx .gridxBody .gridxRow .gridxCellFocus {
+	outline: none;
+	border: 1px dashed darkblue;
+}
+
+/*Header*/
+.claro .gridxHeaderRow {
+	border-top: 1px solid #FFFFFF;
+	border-bottom: 1px solid #FFFFFF;
+	clear: both;
+}
+.claro .gridx .gridxHeader .gridxHeaderRow .gridxHeaderCellFocus {
+	outline: none;
+	border: 1px dashed darkblue;
+}
+
+.claro .gridxHeaderRowHidden {
+	height: 0;
+	border-width: 0;
+}
+
+.dj_ie7 .claro .gridxRowHeaderRow table {
+	border-collapse: collapse;
+}
+
+.claro .gridxHeaderRowInner {
+	background-image: url('../images/claro-grid-header-onepixel.bmp');
+	background-position: right;
+	background-repeat: repeat-y;
+	border-right: 1px solid #FFFFFF;
+}
+
+.claro .gridxGroupHeader {
+	border-color: #EDF2F7 #BCBCBC #BCBCBC #FFFFFF;
+}
+.claro .gridxHeaderRow .gridxCell {
+	border-color: #EDF2F7 #BCBCBC #D0DFEA #FFFFFF;
+}
+.claro .gridxHeaderRow .gridxSubHeader {
+	border-top-color: #FFFFFF;
+}
+
+.claro .gridxHeaderRow {
+	background: #edf2f7; /* Old browsers */
+	background: -moz-linear-gradient(top,  #edf2f7 0%, #d0dfea 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#edf2f7), color-stop(100%,#d0dfea)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* IE10+ */
+	background: linear-gradient(top,  #edf2f7 0%,#d0dfea 100%); /* W3C */
+}
+
+.claro .gridxHeader .gridxHeaderRow .gridxCell:hover {
+	background: #9bcaf7;
+	border-top-color: #9BCAF7;
+}
+.claro .gridxHeader .gridxHeaderRow .gridxSubHeader.gridxCell:hover,
+.gridxColumnResizing .gridx .gridxHeader .gridxHeaderRow .gridxSubHeader.gridxCell:hover {
+	border-top-color: #FFFFFF;
+}
+.gridxColumnResizing .gridx .gridxHeader .gridxHeaderRow .gridxCell:hover {
+	background: transparent;
+	border-top-color: transparent;
+}
+.claro .gridx .gridxHeader .gridxHeaderRow .gridxSubHeader.gridxHeaderCellFocus,
+.claro .gridx .gridxHeader .gridxHeaderRow .gridxSubHeader.gridxHeaderCellFocus:hover {
+	border-top-color: darkblue;
+}
+
+/* Row header */
+.claro .gridxRowHeaderHeader .gridxHeaderCellFocus {
+	outline: none;
+	border: 1px dashed darkblue;
+}
+	
+.claro .gridxRowHeaderRow .gridxCellFocus {
+	outline: none;
+	border: 1px dashed darkblue;
+}
+
+/* toolbar */
+.claro .gridxBarToolBar .dijitToolbar {
+	background: none;
+	border-bottom: none;
+}
+
+/* PagedBody */
+.claro .gridxBodyFirstRow .gridxCell {
+	border-top-color: #E5DAC8;
+}

data/app/assets/stylesheets/gridx/resources/claro/basic_rtl.css

@@ -0,0 +1,21 @@
+/* Header */
+.claro .gridxRtl .gridxHeaderRow .gridxCell {
+	border-color: transparent #FFFFFF transparent #BCBCBC ;
+}
+.claro .gridxRtl .gridxGroupHeader {
+	border-color: transparent #FFFFFF #BCBCBC #BCBCBC;
+}
+.claro .gridxRtl .gridxHeaderRow .gridxSubHeader {
+	border-top-color: #FFFFFF;
+}
+
+.claro .gridxRtl .gridxHeaderRowInner {
+	background-position: left;
+	border-right: none;
+	border-left: 1px solid #FFFFFF;
+}
+
+/* Body */
+.claro .gridxRtl .gridxBody .gridxCell{
+	border-color: transparent transparent #E5DAC8 #E5DAC8;
+}

data/app/assets/stylesheets/gridx/resources/claro/filter.css

@@ -0,0 +1,47 @@
+/* Quick Filter */
+.claro .gridxQuickFilter {
+	padding: 2px;
+}
+
+.claro .gridxQuickFilterButton,
+.claro .gridxQuickFilterComboButton {
+	margin: 0;
+}
+
+.claro .gridxQuickFilterComboButton .dijitButtonNode,
+.claro .gridxQuickFilterButton .dijitButtonNode {
+	border: none;
+	background: none;
+	box-shadow: none;
+	padding: 1px;
+
+	-moz-transition-duration: 0.3s, 0.35s;
+    -moz-transition-property: background-color;
+	border-radius: 4px;
+}
+
+.claro .gridxQuickFilterComboButton .dijitButtonNode {
+	border-radius: 4px 0 0 4px;
+}
+.claro .gridxQuickFilterComboButton .dijitArrowButton {
+	border-radius: 0 4px 4px 0;
+}
+
+.claro .gridxQuickFilter .dijitComboButtonHover .dijitButtonNode,
+.claro .gridxQuickFilter .dijitButtonHover .dijitButtonNode {
+	background-color: #6bd6ff;
+    background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
+    background-repeat: repeat-x;
+	padding: 0;
+	border: 1px solid #759DC0;
+}
+
+.claro .gridxQuickFilter .dijitComboButtonActive .dijitButtonNode,
+.claro .gridxQuickFilter .dijitButtonActive .dijitButtonNode {
+	background-color: #7DBDFA;
+    background-image: -moz-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%);
+    background-repeat: repeat-x;
+	padding: 0;
+	border: 1px solid #759DC0;
+}
+