Skip to content

Commit 9339e59

Browse files
jDramaixjDramaix
committed
Merge pull request ArcBees#2 from ArcBees/jd_mutator
Add automatic layout during DOM mutation
2 parents 473812e + 9f34ea9 commit 9339e59

File tree

19 files changed

+855
-111
lines changed

19 files changed

+855
-111
lines changed

‎elastic-sample/pom.xml

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,10 @@
2323
<groupId>org.codehaus.mojo</groupId>
2424
<artifactId>gwt-maven-plugin</artifactId>
2525
<configuration>
26-
<module>com.arcbees.gquery.elastic.ElasticSample</module>
26+
<modules>
27+
<module>com.arcbees.gquery.elastic.htmlsample.ElasticSample</module>
28+
<module>com.arcbees.gquery.elastic.widgetsample.WidgetSample</module>
29+
</modules>
2730
</configuration>
2831
</plugin>
2932

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/ElasticSample.gwt.xml

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/client/ElasticSample.java

Lines changed: 0 additions & 25 deletions
This file was deleted.

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/htmlsample/ElasticSample.gwt.xml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<module rename-to='ElasticBasicSample'>
2+
<inherits name='com.arcbees.gquery.elastic.Elastic'/>
3+
<entry-point class='com.arcbees.gquery.elastic.htmlsample.client.ElasticSample'/>
4+
</module>

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/ElasticSampleSdm.gwt.xml renamed to ‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/htmlsample/ElasticSampleSdm.gwt.xml

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
<module rename-to='Elastic'>
2-
<inherits name='com.arcbees.gquery.elastic.ElasticSample'/>
1+
<module rename-to='ElasticBasicSample'>
2+
<inherits name='com.arcbees.gquery.elastic.basicsample.ElasticSample'/>
33

44
<add-linker name="xsiframe"/>
55
<set-configuration-property name="devModeRedirectEnabled" value="true"/>
66

77
</module>
8-

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/htmlsample/client/ElasticSample.java

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
/**
2+
* Copyright 2014 ArcBees Inc.
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
5+
* use this file except in compliance with the License. You may obtain a copy of
6+
* the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
12+
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
13+
* License for the specific language governing permissions and limitations under
14+
* the License.
15+
*/
16+
17+
package com.arcbees.gquery.elastic.htmlsample.client;
18+
19+
import com.arcbees.gquery.elastic.client.ElasticOption;
20+
import com.google.gwt.core.client.EntryPoint;
21+
import com.google.gwt.query.client.Function;
22+
23+
import static com.arcbees.gquery.elastic.client.Elastic.Elastic;
24+
import static com.google.gwt.query.client.GQuery.$;
25+
26+
/**
27+
* Example code for Elastic plugin for GwtQuery
28+
*/
29+
public class ElasticSample implements EntryPoint {
30+
public void onModuleLoad() {
31+
$("#go").click(new Function() {
32+
@Override
33+
public void f() {
34+
ElasticOption option = new ElasticOption()
35+
.setMinimumColumWidth(400)
36+
.setMinimalNumberOfColumn(2);
37+
38+
$("#container").as(Elastic).elastic(option);
39+
}
40+
});
41+
}
42+
}

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/public/ElasticLayoutSample.html renamed to ‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/htmlsample/public/ElasticLayoutSample.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
margin-bottom: 5px;
1515
}
1616
</style>
17-
<script language="javascript" src="Elastic.nocache.js"></script>
17+
<script language="javascript" src="ElasticBasicSample.nocache.js"></script>
1818
</head>
1919
<body>
2020
<button id="go">Elastic</button>

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/widgetsample/WidgetSample.gwt.xml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<module rename-to='ElasticWidgetSample'>
2+
<inherits name='com.arcbees.gquery.elastic.Elastic'/>
3+
<entry-point class='com.arcbees.gquery.elastic.widgetsample.client.WidgetSample'/>
4+
</module>

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/widgetsample/WidgetSampleSdm.gwt.xml

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<module rename-to='ElasticWidgetSample'>
2+
<inherits name='com.arcbees.gquery.elastic.widgetsample.WidgetSample'/>
3+
4+
<add-linker name="xsiframe"/>
5+
<set-configuration-property name="devModeRedirectEnabled" value="true"/>
6+
</module>

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/widgetsample/client/WidgetSample.java

Lines changed: 138 additions & 0 deletions
Large diffs are not rendered by default.

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/widgetsample/client/WidgetSample.ui.xml

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
2+
xmlns:g='urn:import:com.google.gwt.user.client.ui'
3+
xmlns:e='urn:import:com.arcbees.gquery.elastic.client'>
4+
<ui:style>
5+
.scroll {
6+
width: 90%;
7+
height: 800px;
8+
border: 1px solid black;
9+
padding: 10px;
10+
margin-left: auto;
11+
margin-right: auto;
12+
}
13+
14+
.container > div {
15+
padding: 5px;
16+
border: 1px solid black;
17+
18+
-moz-border-radius: 5px;
19+
-webkit-border-radius: 5px;
20+
border-radius: 5px;
21+
}
22+
</ui:style>
23+
<g:ScrollPanel ui:field="scrollPanel" styleName="{style.scroll}">
24+
<e:ElasticHtmlPanel ui:field="htmlPanel" maximalNumberOfColumn="5" minimalNumberOfColumn="2"
25+
styleName="{style.container}">
26+
<div>1. Lorem ipsum dolor sit amet, consectetur adipisicing
27+
elit, sed do eiusmod tempor incididunt ut labore et dolore
28+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
29+
commodo
30+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
31+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
32+
id est
33+
laborum
34+
</div>
35+
<div>2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
36+
et
37+
dolore
38+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
39+
commodo
40+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
41+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
42+
id est
43+
laborum
44+
</div>
45+
<div data-elastic-span="2">3.
46+
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
47+
dolore
48+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
49+
commodo
50+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
51+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
52+
id est
53+
laborum
54+
</div>
55+
<div>4. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
56+
et
57+
dolore
58+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
59+
commodo
60+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
61+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
62+
id est
63+
laborum
64+
</div>
65+
<div>5. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
66+
et
67+
dolore
68+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
69+
commodo
70+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
71+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
72+
id est
73+
laborum
74+
</div>
75+
<div>6. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
76+
et
77+
dolore
78+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
79+
commodo
80+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
81+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
82+
id est
83+
laborum
84+
</div>
85+
<div>7. Lorem ipsum dolor sit amet, consectetur adipisicing
86+
elit, sed do eiusmod tempor incididunt ut labore et dolore
87+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
88+
commodo
89+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
90+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
91+
id est
92+
laborum
93+
</div>
94+
<div>8. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
95+
et
96+
dolore
97+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
98+
commodo
99+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
100+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
101+
id est
102+
laborum
103+
</div>
104+
<div data-elastic-span="2">9. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
105+
tempor incididunt ut labore et
106+
dolore
107+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
108+
commodo
109+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
110+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
111+
id est
112+
laborum
113+
</div>
114+
<div>10.
115+
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
116+
dolore
117+
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
118+
commodo
119+
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
120+
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
121+
id est
122+
laborum
123+
</div>
124+
</e:ElasticHtmlPanel>
125+
</g:ScrollPanel>
126+
</ui:UiBinder>

‎elastic-sample/src/main/java/com/arcbees/gquery/elastic/widgetsample/public/WidgetSample.html

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<!doctype html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
5+
<title>GwtQuery: Elastic plugin example</title>
6+
<style type="text/css">
7+
#main {
8+
position: relative;
9+
}
10+
</style>
11+
<script language="javascript" src="ElasticWidgetSample.nocache.js"></script>
12+
</head>
13+
<body>
14+
<header>
15+
This is an infinite scroll panel widget. Each time you reach the the bottom of the scroll, new divs are added in the
16+
panel and are automatically laid out by the ElasticHtmlPanel.
17+
</header>
18+
<section id="main"></section>
19+
</body>
20+
</html>

‎elastic/src/main/java/com/arcbees/gquery/elastic/client/CssFeatureDetector.java

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
/**
2323
* The role of this class is to detect if the browser support css transform, translate3d and calc function.
2424
* and to know how these features are supported : prefixed or not ?
25-
*
25+
*
2626
* For instance, some browsers support translate3d but only if you prefix it : -webkit-translate3d
2727
*/
2828
public class CssFeatureDetector {

‎elastic/src/main/java/com/arcbees/gquery/elastic/client/Elastic.java

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,9 @@ public Elastic init(GQuery gq) {
2727
}
2828
});
2929

30+
public static String COLUMN_ATTRIBUTE = "data-elastic-column";
31+
public static String SPAN_ATTRIBUTE = "data-elastic-span";
32+
3033
static String ELASTIC_DATA_KEY = "__GQUERY_ARCBEES_ELASTIC";
3134

3235
public Elastic(GQuery gq) {
@@ -66,7 +69,7 @@ public Elastic updateLayout() {
6669
for (Element e : elements()) {
6770
ElasticImpl impl = getImpl(e);
6871
if (impl != null) {
69-
impl.update();
72+
impl.update(true);
7073
}
7174
}
7275
return this;

0 commit comments

Comments
 (0)