Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
erp5
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Iliya Manolov
erp5
Commits
a27baa7f
Commit
a27baa7f
authored
Mar 10, 2017
by
Romain Courteaud
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
[erp5_web_renderjs_ui] Prevent listbox flickering when updating it
parent
e2feb88b
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
86 additions
and
58 deletions
+86
-58
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js
...emplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js
+84
-56
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml
...mplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml
+2
-2
No files found.
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js
View file @
a27baa7f
...
@@ -49,7 +49,7 @@
...
@@ -49,7 +49,7 @@
}
}
function
renderEditableField
(
gadget
,
element
)
{
function
renderEditableField
(
gadget
,
element
,
column_list
)
{
var
i
,
var
i
,
promise_list
=
[],
promise_list
=
[],
uid_value_dict
=
{},
uid_value_dict
=
{},
...
@@ -85,26 +85,27 @@
...
@@ -85,26 +85,27 @@
}
}
}
}
promise_list
.
push
(
renderSubCell
(
element_list
[
i
],
promise_list
.
push
(
renderSubCell
(
element_list
[
i
],
gadget
.
props
.
result
.
data
.
rows
[
line
].
value
[
gadget
.
state
.
column_list
[
column
][
0
]]
||
""
));
gadget
.
props
.
result
.
data
.
rows
[
line
].
value
[
column_list
[
column
][
0
]]
||
""
));
}
}
return
RSVP
.
all
(
promise_list
);
return
RSVP
.
all
(
promise_list
);
}
}
function
renderListboxTbody
(
gadget
,
template
)
{
function
renderListboxTbody
(
gadget
,
template
)
{
var
tmp
;
var
tmp
,
column_list
=
JSON
.
parse
(
gadget
.
state
.
column_list_json
);
return
gadget
.
translateHtml
(
template
(
return
gadget
.
translateHtml
(
template
(
{
{
"
body_value
"
:
gadget
.
props
.
body_value
,
"
body_value
"
:
gadget
.
props
.
body_value
,
"
show_anchor
"
:
gadget
.
state
.
show_anchor
,
"
show_anchor
"
:
gadget
.
state
.
show_anchor
,
"
column_list
"
:
gadget
.
state
.
column_list
"
column_list
"
:
column_list
}
}
))
))
.
push
(
function
(
my_html
)
{
.
push
(
function
(
my_html
)
{
tmp
=
document
.
createElement
(
"
tbody
"
);
tmp
=
document
.
createElement
(
"
tbody
"
);
tmp
.
innerHTML
=
my_html
;
tmp
.
innerHTML
=
my_html
;
return
renderEditableField
(
gadget
,
tmp
);
return
renderEditableField
(
gadget
,
tmp
,
column_list
);
})
})
.
push
(
function
()
{
.
push
(
function
()
{
var
table
=
gadget
.
element
.
querySelector
(
"
table
"
),
var
table
=
gadget
.
element
.
querySelector
(
"
table
"
),
...
@@ -204,7 +205,7 @@
...
@@ -204,7 +205,7 @@
queue
queue
.
push
(
function
()
{
.
push
(
function
()
{
// Cancel previous line rendering to not conflict with the asynchronous render for now
// Cancel previous line rendering to not conflict with the asynchronous render for now
return
gadget
.
renderContent
(
true
);
return
gadget
.
renderContent
(
true
,
{}
);
})
})
.
push
(
function
()
{
.
push
(
function
()
{
// XXX Fix in case of multiple listboxes
// XXX Fix in case of multiple listboxes
...
@@ -220,7 +221,7 @@
...
@@ -220,7 +221,7 @@
editable
:
field_json
.
editable
,
editable
:
field_json
.
editable
,
begin_from
:
parseInt
(
result_list
[
0
]
||
'
0
'
,
10
)
||
0
,
begin_from
:
parseInt
(
result_list
[
0
]
||
'
0
'
,
10
)
||
0
,
sort_list
:
result_list
[
1
]
||
[]
,
sort_list
_json
:
JSON
.
stringify
(
result_list
[
1
]
||
[])
,
show_anchor
:
field_json
.
show_anchor
,
show_anchor
:
field_json
.
show_anchor
,
line_icon
:
field_json
.
line_icon
,
line_icon
:
field_json
.
line_icon
,
...
@@ -229,9 +230,10 @@
...
@@ -229,9 +230,10 @@
list_method
:
field_json
.
list_method
,
list_method
:
field_json
.
list_method
,
list_method_template
:
field_json
.
list_method_template
,
list_method_template
:
field_json
.
list_method_template
,
column_list
:
field_json
.
column_list
,
column_list_json
:
JSON
.
stringify
(
field_json
.
column_list
),
sort_column_list
:
sort_column_list
,
search_column_list
:
search_column_list
,
sort_column_list_json
:
JSON
.
stringify
(
sort_column_list
),
search_column_list_json
:
JSON
.
stringify
(
search_column_list
),
hide_sort
:
field_json
.
sort_column_list
.
length
?
""
:
"
ui-disabled
"
,
hide_sort
:
field_json
.
sort_column_list
.
length
?
""
:
"
ui-disabled
"
,
field_id
:
options
.
field_id
,
field_id
:
options
.
field_id
,
...
@@ -242,55 +244,72 @@
...
@@ -242,55 +244,72 @@
})
})
.
push
(
function
()
{
.
push
(
function
()
{
// Force line calculation in any case
// Force line calculation in any case
return
gadget
.
renderContent
();
return
gadget
.
renderContent
(
false
,
{
sort_list
:
JSON
.
parse
(
gadget
.
state
.
sort_list_json
),
column_list
:
field_json
.
column_list
,
sort_column_list
:
sort_column_list
,
search_column_list
:
search_column_list
});
});
});
return
queue
;
return
queue
;
})
})
.
onStateChange
(
function
()
{
.
onStateChange
(
function
(
modification_dict
)
{
var
gadget
=
this
,
var
gadget
=
this
,
head_value
=
[],
head_value
=
[],
class_value
,
class_value
,
sort_list
,
column_list
,
tmp
,
tmp
,
i
,
i
,
j
;
j
;
for
(
i
=
0
;
i
<
gadget
.
state
.
column_list
.
length
;
i
+=
1
)
{
if
((
modification_dict
.
hasOwnProperty
(
'
sort_list_json
'
))
||
class_value
=
""
;
(
modification_dict
.
hasOwnProperty
(
'
column_list_json
'
))
||
for
(
j
=
0
;
j
<
gadget
.
state
.
sort_list
.
length
;
j
+=
1
)
{
(
modification_dict
.
hasOwnProperty
(
'
title
'
))
||
tmp
=
gadget
.
state
.
sort_list
[
j
];
(
modification_dict
.
hasOwnProperty
(
'
hide_sort
'
))
||
if
(
tmp
[
0
]
===
gadget
.
state
.
column_list
[
i
][
0
])
{
(
modification_dict
.
hasOwnProperty
(
'
hide_class
'
)))
{
if
(
tmp
[
1
]
===
"
ascending
"
)
{
class_value
=
"
ui-icon ui-icon-arrow-up
"
;
sort_list
=
JSON
.
parse
(
gadget
.
state
.
sort_list_json
);
}
else
{
column_list
=
JSON
.
parse
(
gadget
.
state
.
column_list_json
);
class_value
=
"
ui-icon ui-icon-arrow-down
"
;
for
(
i
=
0
;
i
<
column_list
.
length
;
i
+=
1
)
{
class_value
=
""
;
for
(
j
=
0
;
j
<
sort_list
.
length
;
j
+=
1
)
{
tmp
=
sort_list
[
j
];
if
(
tmp
[
0
]
===
column_list
[
i
][
0
])
{
if
(
tmp
[
1
]
===
"
ascending
"
)
{
class_value
=
"
ui-icon ui-icon-arrow-up
"
;
}
else
{
class_value
=
"
ui-icon ui-icon-arrow-down
"
;
}
break
;
}
}
break
;
}
}
head_value
.
push
({
"
data-i18n
"
:
column_list
[
i
][
1
],
"
class_value
"
:
class_value
,
"
text
"
:
column_list
[
i
][
1
]
});
}
}
head_value
.
push
({
"
data-i18n
"
:
gadget
.
state
.
column_list
[
i
][
1
],
"
class_value
"
:
class_value
,
"
text
"
:
gadget
.
state
.
column_list
[
i
][
1
]
});
}
gadget
.
props
.
head_value
=
head_value
;
gadget
.
props
.
head_value
=
head_value
;
return
new
RSVP
.
Queue
()
return
new
RSVP
.
Queue
()
.
push
(
function
()
{
.
push
(
function
()
{
return
RSVP
.
all
([
return
RSVP
.
all
([
gadget
.
translateHtml
(
listbox_template
({
gadget
.
translateHtml
(
listbox_template
({
hide_class
:
gadget
.
state
.
hide_class
,
hide_class
:
gadget
.
state
.
hide_class
,
hide_sort
:
gadget
.
state
.
hide_sort
,
hide_sort
:
gadget
.
state
.
hide_sort
,
title
:
gadget
.
state
.
title
title
:
gadget
.
state
.
title
})),
})),
renderListboxThead
(
gadget
,
listbox_hidden_thead_template
)
renderListboxThead
(
gadget
,
listbox_hidden_thead_template
)
]);
]);
})
})
.
push
(
function
(
result_list
)
{
.
push
(
function
(
result_list
)
{
gadget
.
element
.
querySelector
(
"
.document_table
"
).
innerHTML
=
result_list
[
0
];
gadget
.
element
.
querySelector
(
"
.document_table
"
).
innerHTML
=
result_list
[
0
];
gadget
.
element
.
querySelector
(
"
.thead
"
).
innerHTML
=
result_list
[
1
];
gadget
.
element
.
querySelector
(
"
.thead
"
).
innerHTML
=
result_list
[
1
];
});
});
}
})
})
.
declareMethod
(
'
getListboxInfo
'
,
function
()
{
.
declareMethod
(
'
getListboxInfo
'
,
function
()
{
...
@@ -298,7 +317,7 @@
...
@@ -298,7 +317,7 @@
//construct search panel
//construct search panel
//hardcoded begin_from key to define search position
//hardcoded begin_from key to define search position
return
{
return
{
search_column_list
:
this
.
state
.
search_column_list
,
search_column_list
:
JSON
.
parse
(
this
.
state
.
search_column_list_json
)
,
begin_from
:
this
.
state
.
key
+
"
_begin_from
"
begin_from
:
this
.
state
.
key
+
"
_begin_from
"
};
};
})
})
...
@@ -306,7 +325,7 @@
...
@@ -306,7 +325,7 @@
//////////////////////////////////////////////
//////////////////////////////////////////////
// render the listbox in an asynchronous way
// render the listbox in an asynchronous way
//////////////////////////////////////////////
//////////////////////////////////////////////
.
declareJob
(
'
renderContent
'
,
function
(
only_cancel
)
{
.
declareJob
(
'
renderContent
'
,
function
(
only_cancel
,
parsed_json_options
)
{
var
gadget
=
this
,
var
gadget
=
this
,
// props = gadget.props,
// props = gadget.props,
// field_json = props.field_json,
// field_json = props.field_json,
...
@@ -319,7 +338,10 @@
...
@@ -319,7 +338,10 @@
counter
,
counter
,
limit_options
,
limit_options
,
loading_element_classList
=
gadget
.
element
.
querySelector
(
"
.listboxloader
"
).
classList
,
loading_element_classList
=
gadget
.
element
.
querySelector
(
"
.listboxloader
"
).
classList
,
tbody_classList
=
gadget
.
element
.
querySelector
(
"
table
"
).
querySelector
(
"
tbody
"
).
classList
,
loading_class_list
=
[
'
ui-icon-spinner
'
,
'
ui-btn-icon-left
'
],
loading_class_list
=
[
'
ui-icon-spinner
'
,
'
ui-btn-icon-left
'
],
disabled_class
=
'
ui-disabled
'
,
sort_list
=
parsed_json_options
.
sort_list
,
i
;
i
;
if
(
only_cancel
)
{
if
(
only_cancel
)
{
...
@@ -329,6 +351,7 @@
...
@@ -329,6 +351,7 @@
if
(
this
.
state
.
query
===
undefined
)
{
if
(
this
.
state
.
query
===
undefined
)
{
gadget
.
element
.
querySelector
(
'
tfoot
'
).
textContent
=
gadget
.
element
.
querySelector
(
'
tfoot
'
).
textContent
=
"
Unsupported list method: '
"
+
this
.
state
.
list_method
+
"
'
"
;
"
Unsupported list method: '
"
+
this
.
state
.
list_method
+
"
'
"
;
loading_element_classList
.
remove
.
apply
(
loading_element_classList
,
loading_class_list
);
return
;
return
;
}
}
// function buildQueryString(previous, next) {
// function buildQueryString(previous, next) {
...
@@ -345,8 +368,8 @@
...
@@ -345,8 +368,8 @@
}
}
}
}
for
(
i
=
0
;
i
<
this
.
state
.
column_list
.
length
;
i
+=
1
)
{
for
(
i
=
0
;
i
<
parsed_json_options
.
column_list
.
length
;
i
+=
1
)
{
select_list
.
push
(
this
.
state
.
column_list
[
i
][
0
]);
select_list
.
push
(
parsed_json_options
.
column_list
[
i
][
0
]);
}
}
select_list
.
push
(
"
uid
"
);
select_list
.
push
(
"
uid
"
);
...
@@ -356,6 +379,7 @@
...
@@ -356,6 +379,7 @@
limit_options
=
[
begin_from
,
lines
+
1
];
limit_options
=
[
begin_from
,
lines
+
1
];
}
}
loading_element_classList
.
add
.
apply
(
loading_element_classList
,
loading_class_list
);
loading_element_classList
.
add
.
apply
(
loading_element_classList
,
loading_class_list
);
tbody_classList
.
add
(
disabled_class
);
return
gadget
.
jio_allDocs
({
return
gadget
.
jio_allDocs
({
// XXX Not jIO compatible, but until a better api is found...
// XXX Not jIO compatible, but until a better api is found...
...
@@ -363,7 +387,7 @@
...
@@ -363,7 +387,7 @@
"
query
"
:
query_string
,
"
query
"
:
query_string
,
"
limit
"
:
limit_options
,
"
limit
"
:
limit_options
,
"
select_list
"
:
select_list
,
"
select_list
"
:
select_list
,
"
sort_on
"
:
gadget
.
state
.
sort_list
"
sort_on
"
:
sort_list
})
})
.
push
(
function
(
result
)
{
.
push
(
function
(
result
)
{
...
@@ -384,7 +408,7 @@
...
@@ -384,7 +408,7 @@
selection_index
:
begin_from
+
i
,
selection_index
:
begin_from
+
i
,
query
:
query_string
,
query
:
query_string
,
list_method_template
:
gadget
.
state
.
list_method_template
,
list_method_template
:
gadget
.
state
.
list_method_template
,
"
sort_list:json
"
:
gadget
.
state
.
sort_list
"
sort_list:json
"
:
sort_list
}
}
})
})
);
);
...
@@ -404,8 +428,8 @@
...
@@ -404,8 +428,8 @@
for
(
i
=
0
;
i
<
counter
;
i
+=
1
)
{
for
(
i
=
0
;
i
<
counter
;
i
+=
1
)
{
tmp_url
=
result_list
[
i
+
1
];
tmp_url
=
result_list
[
i
+
1
];
tr_value
=
[];
tr_value
=
[];
for
(
j
=
0
;
j
<
gadget
.
state
.
column_list
.
length
;
j
+=
1
)
{
for
(
j
=
0
;
j
<
parsed_json_options
.
column_list
.
length
;
j
+=
1
)
{
value
=
allDocs_result
.
data
.
rows
[
i
].
value
[
gadget
.
state
.
column_list
[
j
][
0
]]
||
""
;
value
=
allDocs_result
.
data
.
rows
[
i
].
value
[
parsed_json_options
.
column_list
[
j
][
0
]]
||
""
;
tr_value
.
push
({
tr_value
.
push
({
"
type
"
:
value
.
type
,
"
type
"
:
value
.
type
,
"
editable
"
:
value
.
editable
&&
gadget
.
state
.
editable
,
"
editable
"
:
value
.
editable
&&
gadget
.
state
.
editable
,
...
@@ -449,7 +473,7 @@
...
@@ -449,7 +473,7 @@
})
})
.
push
(
function
(
url_list
)
{
.
push
(
function
(
url_list
)
{
var
foot
=
{};
var
foot
=
{};
foot
.
colspan
=
gadget
.
state
.
column_list
.
length
+
gadget
.
state
.
show_anchor
+
foot
.
colspan
=
parsed_json_options
.
column_list
.
length
+
gadget
.
state
.
show_anchor
+
(
gadget
.
state
.
line_icon
?
1
:
0
);
(
gadget
.
state
.
line_icon
?
1
:
0
);
foot
.
default_colspan
=
foot
.
colspan
;
foot
.
default_colspan
=
foot
.
colspan
;
foot
.
previous_classname
=
"
ui-btn ui-icon-carat-l ui-btn-icon-left responsive ui-first-child
"
;
foot
.
previous_classname
=
"
ui-btn ui-icon-carat-l ui-btn-icon-left responsive ui-first-child
"
;
...
@@ -474,7 +498,6 @@
...
@@ -474,7 +498,6 @@
return
renderListboxTfoot
(
gadget
);
return
renderListboxTfoot
(
gadget
);
})
})
.
push
(
function
(
my_html
)
{
.
push
(
function
(
my_html
)
{
loading_element_classList
.
remove
.
apply
(
loading_element_classList
,
loading_class_list
);
gadget
.
element
.
querySelector
(
"
.tfoot
"
).
innerHTML
=
my_html
;
gadget
.
element
.
querySelector
(
"
.tfoot
"
).
innerHTML
=
my_html
;
});
});
...
@@ -501,6 +524,11 @@
...
@@ -501,6 +524,11 @@
.
push
(
function
(
html
)
{
.
push
(
function
(
html
)
{
gadget
.
element
.
querySelector
(
"
.document_table
"
).
innerHTML
=
html
;
gadget
.
element
.
querySelector
(
"
.document_table
"
).
innerHTML
=
html
;
});
});
})
.
push
(
function
(
result
)
{
loading_element_classList
.
remove
.
apply
(
loading_element_classList
,
loading_class_list
);
tbody_classList
.
remove
(
disabled_class
);
return
result
;
});
});
})
})
...
@@ -547,8 +575,8 @@
...
@@ -547,8 +575,8 @@
if
(
evt
.
target
===
sort_button
)
{
if
(
evt
.
target
===
sort_button
)
{
evt
.
preventDefault
();
evt
.
preventDefault
();
url
=
"
gadget_erp5_sort_editor.html
"
;
url
=
"
gadget_erp5_sort_editor.html
"
;
options
.
sort_column_list
=
gadget
.
state
.
sort_column_list
;
options
.
sort_column_list
=
JSON
.
parse
(
gadget
.
state
.
sort_column_list_json
)
;
options
.
sort_list
=
gadget
.
state
.
sort_list
;
options
.
sort_list
=
JSON
.
parse
(
gadget
.
state
.
sort_list_json
)
;
options
.
key
=
gadget
.
state
.
key
+
"
_sort_list:json
"
;
options
.
key
=
gadget
.
state
.
key
+
"
_sort_list:json
"
;
return
gadget
.
renderEditorPanel
(
url
,
options
);
return
gadget
.
renderEditorPanel
(
url
,
options
);
}
}
...
...
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml
View file @
a27baa7f
...
@@ -236,7 +236,7 @@
...
@@ -236,7 +236,7 @@
</item>
</item>
<item>
<item>
<key>
<string>
serial
</string>
</key>
<key>
<string>
serial
</string>
</key>
<value>
<string>
957.5
7991.29866.61081
</string>
</value>
<value>
<string>
957.5
8432.2656.37034
</string>
</value>
</item>
</item>
<item>
<item>
<key>
<string>
state
</string>
</key>
<key>
<string>
state
</string>
</key>
...
@@ -254,7 +254,7 @@
...
@@ -254,7 +254,7 @@
</tuple>
</tuple>
<state>
<state>
<tuple>
<tuple>
<float>
14890
52755.84
</float>
<float>
14890
79675.51
</float>
<string>
UTC
</string>
<string>
UTC
</string>
</tuple>
</tuple>
</state>
</state>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment