Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Front using new API v2 #159

Closed
wants to merge 12 commits into from
Closed

Front using new API v2 #159

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
4fb1dab
WIP support api V2
cmdelatorre Jun 22, 2024
bbc645e
Create from API v2
cmdelatorre Jun 22, 2024
39ec3c2
support pyenv in gitignore
cmdelatorre Jun 22, 2024
7f67cb0
WIP
cmdelatorre Jun 23, 2024
320cc2c
Backend for frontend: tree display
cmdelatorre Jun 23, 2024
074d73c
WIP, removing unnecessary data from API
cmdelatorre Jun 23, 2024
b28b582
WIP on frotnend based on API v2
cmdelatorre Jun 23, 2024
7563b64
cleanup
cmdelatorre Jun 23, 2024
897f42c
Use the children attribute that now the api v2 sends
cmdelatorre Jun 23, 2024
59f47d1
cleanup
cmdelatorre Jun 23, 2024
a44e619
Delete unused dev endpoint
cmdelatorre Jun 23, 2024
9a09f83
update tests
cmdelatorre Jun 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,3 +10,4 @@ tmp/
.fuse*
.directory
.idea/
.python-version
1 change: 1 addition & 0 deletions kilink/backend.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -266,6 +266,7 @@ def build_tree_from_root_id(self, linkode_id):
'timestamp': str(treenode.timestamp),
'linkode_id': treenode.linkode_id,
'parent': treenode.parent,
'order': treenode.order,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

estaría genial actualizar el docstring del endpoint con el nuevo campo (acá)

}
if treenode.parent is None:
root_node = node_dict
Expand Down
152 changes: 86 additions & 66 deletions kilink/static/js/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,8 +54,7 @@ var linkode = (function (){
if (new_linkode_id) {
window.location.hash = new_linkode_id;
current_linkode_id = new_linkode_id;
}
else {
} else {
if(!current_linkode_id){
hash = window.location.hash.replace("#", "");
path = window.location.pathname.split("/").pop();
Expand All @@ -82,45 +81,49 @@ var linkode = (function (){
function api_post(current_retry){
var api_post_url = API_URL;
var text_type = $("#selectlang").val().replace("auto_", "");
var post_data = {
'content': editor.val(),
'text_type': text_type
var creation_params = {
content: editor.val(),
text_type: text_type,
};

if(first_load_success && linkode_id_val()){
api_post_url = api_post_url + linkode_id_val();
post_data.parent = linkode_id_val();
}

$.post(api_post_url,post_data)
.done(function(data) {
var posted_linkode = data;
if(first_load_success){
linkode_id_val(posted_linkode.revno);
$("#selectlang").val(text_type);
editor.selectMode();
api_after_post_get(posted_linkode.revno);
$("#btn-submit").text(text_update_submit);
show_success_noty(posted_linkode.revno);
}
else{
window.location.replace(URL_BASE + "/#" + posted_linkode.revno);
}
})
.fail(function(data, error) {
current_retry = current_retry ? current_retry : 0;
if (current_retry < RETRY_TIMES && data.status != 404 && data.status != 413){
retry_delay = RETRY_DELAYS[current_retry];
current_retry++;
show_retry_noty(retry_delay);
setTimeout(function(){
api_post(current_retry);
}, retry_delay);
}
else{
show_error_noty(data.status, true, api_post, []);
}
});
$.ajax({
url: api_post_url,
type: "POST",
data: JSON.stringify(creation_params),
contentType: "application/json; charset=utf-8",
dataType: "json",
})
.done(function(data, textStatus, jqXHR) {
if(first_load_success){
linkode_id_val(data.linkode_id);
$("#selectlang").val(text_type);
editor.selectMode();
api_after_post_get(data.linkode_id);
$("#btn-submit").text(text_update_submit);
show_success_noty(data.linkode_id);
}
else{
window.location.replace(URL_BASE + "/#" + data.linkode_id);
}
})
.fail(function(jqXHR, textStatus, errorThrown) {
current_retry = current_retry ? current_retry : 0;
if (current_retry < RETRY_TIMES && jqXHR.status != 404 && jqXHR.status != 413){
var retry_delay = RETRY_DELAYS[current_retry];
current_retry++;
show_retry_noty(retry_delay);
setTimeout(function(){
api_post(current_retry);
}, retry_delay);
}
else{
show_error_noty(jqXHR.status, true, api_post, []);
}
});
}

/**
Expand All @@ -129,21 +132,49 @@ var linkode = (function (){
*/
function api_after_post_get(linkode_id){
var api_get_url = API_URL + linkode_id;
// TODO: use the API V2 URL
return $.get(api_get_url)
.done(function(data) {
node_list = data.tree;
$("#tree-toggle-panel").show();
if (node_list !== false) {
$(".klk-tree").empty();
create_tree(linkode_id);
if(node_list.children){
toggleTree(true);
}
}
//$("#tree-toggle-panel").show();
fetch_and_render_tree(linkode_id, data.root_id);
set_timestamp(data.timestamp);
});
}


function fetch_and_render_tree(linkode_id, root_id) {
$.ajax({
url: TREE_URL + root_id,
type: "GET"
})
.done(function(data) {
$(".klk-tree").empty();

if (data !== false) {
$(".klk-tree").empty();
display_tree(linkode_id, data);
$("#tree-toggle-panel").show();

if(data.children.length > 0){
// Open only if there are children in the tree
toggleTree(true);
}
}

})
.fail(function() {
$(".klk-tree").empty();
toggleTree(true);
toggleTree();
new Noty({
type: 'warning',
text: "Tree not available. Try again.",
killer: true
}).show();
});


}
/**
* Get the linkode
* @param {string}
Expand All @@ -157,21 +188,11 @@ var linkode = (function (){
.done(function(data) {
load_linkode(data.content, data.text_type, data.timestamp);
if(include_tree){
node_list = data.tree;
if (node_list !== false) {
$(".klk-tree").empty();
create_tree(linkode_id);
$("#tree-toggle-panel").show();

// Only if nodes >= 2
if(node_list.children){
toggleTree();
}
}
}
else{
fetch_and_render_tree(linkode_id, data.root_id);
} else {
color_node(linkode_id);
}

if(!first_load){
linkode_id_val(linkode_id);
}
Expand All @@ -187,7 +208,7 @@ var linkode = (function (){
else{
current_retry = current_retry ? current_retry : 0;
if (current_retry < RETRY_TIMES){
retry_delay = RETRY_DELAYS[current_retry];
var retry_delay = RETRY_DELAYS[current_retry];
current_retry++;
show_retry_noty(retry_delay);
setTimeout(function(){
Expand Down Expand Up @@ -262,9 +283,10 @@ var linkode = (function (){

/**
* Generate the Tree Node
* @param {string}
* @param {string} linkode_id, to paint the proper node
* @param {string} data, with all the nodes
*/
function create_tree(linkode_id){
function display_tree(linkode_id, data){
var tree_size = {};
var layout_size = {};
tree_size.width = 200;
Expand All @@ -274,12 +296,9 @@ var linkode = (function (){

var tree = d3.layout.tree()
.sort(null)
.size([tree_size.width, tree_size.height])
.children(function(d){
return (!d.contents || d.contents.length === 0) ? null : d.contents;
});
.size([tree_size.width, tree_size.height]);

var nodes = tree.nodes(node_list);
var nodes = tree.nodes(data);
var links = tree.links(nodes);


Expand Down Expand Up @@ -482,7 +501,8 @@ var linkode = (function (){

// constants
var URL_BASE = window.location.protocol + "//" + window.location.host;
var API_URL = URL_BASE + "/api/1/linkodes/";
var API_URL = URL_BASE + "/api/2/linkode/";
var TREE_URL = URL_BASE + "/api/2/tree/";
var RETRY_TIMES = 3;
var RETRY_DELAYS = [2000, 10000, 30000]; // in miliseconds

Expand Down
8 changes: 6 additions & 2 deletions tests/test_views_v2.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,22 +118,26 @@ def test_get_tree_happy_path(self):
assert response.json == {
"linkode_id": parent.linkode_id,
"timestamp": str(parent.timestamp),
"order": 1,
"children": [
{
"linkode_id": child_1.linkode_id,
"timestamp": str(child_1.timestamp),
"order": 2,
"children": [
{
"linkode_id": grandchild.linkode_id,
"timestamp": str(grandchild.timestamp),
"children": []
"children": [],
"order": 4,
}
],
},
{
"linkode_id": child_2.linkode_id,
"timestamp": str(child_2.timestamp),
"children": []
"children": [],
"order": 3,
}
]
}
Expand Down