delete composition ajax link is working !
This commit is contained in:
Bachir Soussi Chiadmi
@@ -77,11 +77,36 @@
|
||||
function initAjaxCompoLinks(){
|
||||
console.log('studio initAjaxCompoLinks');
|
||||
$('.new-composition-link:not(.ajax-enabled)')
|
||||
.addClass('ajax-enabled')
|
||||
.on('click', onClickNewCompoLink);
|
||||
$('.composition-link:not(.ajax-enabled)')
|
||||
.addClass('ajax-enabled')
|
||||
.on('click', onClickCompoLink);
|
||||
$('.delete-composition-link:not(.ajax-enabled)')
|
||||
.addClass('ajax-enabled')
|
||||
.on('click', onClickDeleteCompoLink);
|
||||
};
|
||||
|
||||
|
||||
|
||||
// ___ ___
|
||||
// / _ \ _ __ ___ _ _ / __|___ _ __ _ __ ___
|
||||
// | (_) | '_ \/ -_) ' \ | (__/ _ \ ' \| '_ \/ _ \
|
||||
// \___/| .__/\___|_||_| \___\___/_|_|_| .__/\___/
|
||||
// |_| |_|
|
||||
function onClickCompoLink(e){
|
||||
e.preventDefault();
|
||||
console.log('onClickCompoLink');
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
// _ _ _____ __ __ __ ___ _ __ _ __ ___
|
||||
// | ' \/ -_) V V / / _/ _ \ ' \| '_ \/ _ \
|
||||
// |_||_\___|\_/\_/ \__\___/_|_|_| .__/\___/
|
||||
// |_|
|
||||
|
||||
function onClickNewCompoLink(e){
|
||||
e.preventDefault();
|
||||
setInputForNewCompoName($(this));
|
||||
return false;
|
||||
@@ -141,6 +166,43 @@
|
||||
};
|
||||
|
||||
|
||||
// ___ _ _
|
||||
// | \ ___| |___| |_ ___ __ ___ _ __ _ __ ___
|
||||
// | |) / -_) / -_) _/ -_) / _/ _ \ ' \| '_ \/ _ \
|
||||
// |___/\___|_\___|\__\___| \__\___/_|_|_| .__/\___/
|
||||
// |_|
|
||||
function onClickDeleteCompoLink(e){
|
||||
e.preventDefault();
|
||||
// TODO: confirm
|
||||
deleteCompo($(this));
|
||||
return false;
|
||||
};
|
||||
function deleteCompo($link){
|
||||
var ajax_path = $link.attr('data-drupal-link-system-path');
|
||||
var path = window.location.origin + Drupal.url(ajax_path);
|
||||
$link.parents('li').addClass('ajax-loading');
|
||||
$.getJSON(path, {})
|
||||
.done(function(data){
|
||||
onDeleteCompoDone(data, $link);
|
||||
})
|
||||
.fail(function(jqxhr, textStatus, error){
|
||||
onErrorDeleteCompo(jqxhr, textStatus, error, $link);
|
||||
});
|
||||
};
|
||||
function onDeleteCompoDone(data, $link, $form){
|
||||
console.log('onDeleteCompoDone',data);
|
||||
if(data.status == "ok"){
|
||||
$link.parents('li').remove();
|
||||
}else{
|
||||
console.warn(data.message);
|
||||
}
|
||||
};
|
||||
function onErrorDeleteCompo(jqxhr, textStatus, error, $link){
|
||||
$link.parents('li').removeClass('ajax-loading');
|
||||
console.warn('delete compo load failed : '+error, jqxhr.responseText);
|
||||
};
|
||||
|
||||
|
||||
// ___ _ _ _ _
|
||||
// / __| |_ _ _ __| (_)___ ___ _ _(_)
|
||||
// \__ \ _| || / _` | / _ \___| || | |
|
||||
|
||||
@@ -11,20 +11,41 @@ function template_preprocess_edlp_compositions_list(&$vars){
|
||||
);
|
||||
foreach($vars['composition_entities'] as $entity){
|
||||
// get the url
|
||||
$url = Url::fromRoute('entity.composition.canonical', ['composition' => $entity->id()], ['absolute' => TRUE]);
|
||||
$url = Url::fromRoute('entity.composition.canonical',
|
||||
['composition' => $entity->id()], ['absolute' => TRUE]);
|
||||
// get the delete url
|
||||
$delete_url = Url::fromRoute('edlp_studio.composition_controller_action_ajax',
|
||||
['action' => 'delete', 'cid'=>$entity->id()], ['absolute' => TRUE]);
|
||||
|
||||
$title = $entity->getName();
|
||||
|
||||
$vars['compositions']['#items'][] = array(
|
||||
'#title' => $title,
|
||||
'#type' => 'link',
|
||||
'#url' => $url,
|
||||
'#options'=>array(
|
||||
'attributes' => array(
|
||||
'data-drupal-link-system-path' => $url->getInternalPath(),
|
||||
'nid' => $entity->id(),
|
||||
'class' => ['composition-link'],
|
||||
'title'=>$title,
|
||||
'compo_link' => array(
|
||||
'#title' => $title,
|
||||
'#type' => 'link',
|
||||
'#url' => $url,
|
||||
'#options'=>array(
|
||||
'attributes' => array(
|
||||
'data-drupal-link-system-path' => $url->getInternalPath(),
|
||||
'nid' => $entity->id(),
|
||||
'class' => ['composition-link'],
|
||||
'title'=>$title,
|
||||
),
|
||||
),
|
||||
),
|
||||
'delete_link' => array(
|
||||
'#title' => "delete",
|
||||
'#type' => 'link',
|
||||
'#url' => $delete_url,
|
||||
'#options'=>array(
|
||||
'attributes' => array(
|
||||
'data-drupal-link-system-path' => $delete_url->getInternalPath(),
|
||||
'nid' => $entity->id(),
|
||||
'class' => ['delete-composition-link'],
|
||||
'title'=> t('Delete @title', array('@title'=>$title)),
|
||||
),
|
||||
),
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -61,9 +61,13 @@ class CompositionController extends ControllerBase {
|
||||
$this->error_message = t("Composition creation needs a name as query paramater!");
|
||||
}
|
||||
break;
|
||||
// case 'delete':
|
||||
//
|
||||
// break;
|
||||
case 'delete':
|
||||
if($cid){
|
||||
$this->deleteComposition($cid);
|
||||
}else{
|
||||
$this->error_message = t("Composition deletion needs a cid as url paramater!");
|
||||
}
|
||||
break;
|
||||
// case 'rename':
|
||||
//
|
||||
// break;
|
||||
@@ -71,39 +75,46 @@ class CompositionController extends ControllerBase {
|
||||
|
||||
if($this->error_message){
|
||||
$status = 'error';
|
||||
}
|
||||
|
||||
if($status == 'error'){
|
||||
$message = $this->error_message;
|
||||
}else{
|
||||
$url = Url::fromRoute('entity.composition.canonical', ['composition' => $this->compo->id()], ['absolute' => TRUE]);
|
||||
$title = $this->compo->getName();
|
||||
$new_link_build = array(
|
||||
'#title' => $title,
|
||||
'#type' => 'link',
|
||||
'#url' => $url,
|
||||
'#options'=>array(
|
||||
'attributes' => array(
|
||||
'data-drupal-link-system-path' => $url->getInternalPath(),
|
||||
'nid' => $this->compo->id(),
|
||||
'class' => ['composition-link'],
|
||||
'title'=>$title,
|
||||
),
|
||||
),
|
||||
);
|
||||
$new_link = render($new_link_build);
|
||||
}
|
||||
|
||||
|
||||
// JSON
|
||||
$response = new JsonResponse();
|
||||
$data = array(
|
||||
'action' => $action,
|
||||
'status' => $status,
|
||||
'message' => $this->error_message,
|
||||
'new_name' => $request->query->get('new_name'),
|
||||
'new_link' => $new_link,
|
||||
'message' => $this->error_message
|
||||
);
|
||||
if($status == 'ok'){
|
||||
switch ($action) {
|
||||
case 'create':
|
||||
$url = Url::fromRoute('entity.composition.canonical', ['composition' => $this->compo->id()], ['absolute' => TRUE]);
|
||||
$title = $this->compo->getName();
|
||||
$new_link_build = array(
|
||||
'#title' => $title,
|
||||
'#type' => 'link',
|
||||
'#url' => $url,
|
||||
'#options'=>array(
|
||||
'attributes' => array(
|
||||
'data-drupal-link-system-path' => $url->getInternalPath(),
|
||||
'nid' => $this->compo->id(),
|
||||
'class' => ['composition-link'],
|
||||
'title'=>$title,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
$data += array(
|
||||
'new_name' => $title,
|
||||
'new_link' => render($new_link_build),
|
||||
);
|
||||
break;
|
||||
// case 'delete':
|
||||
// # code...
|
||||
// break;
|
||||
}
|
||||
}
|
||||
|
||||
$response->setData($data);
|
||||
return $response;
|
||||
|
||||
@@ -124,4 +135,8 @@ class CompositionController extends ControllerBase {
|
||||
$this->compo->save();
|
||||
}
|
||||
|
||||
private function deleteComposition($cid){
|
||||
$this->compo = entity_load('composition', $cid);
|
||||
$this->compo->delete();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 2.6458333 2.6458334"><g fill="none"><g stroke="#000" stroke-width=".726"><path d="M.182.182l2.282 2.282M.182 2.464L2.464.182" stroke-width=".41561322"/></g><path style="isolation:auto;mix-blend-mode:normal" d="M1.883 0H.763A.76.76 0 0 0 0 .762v1.121c0 .423.34.763.762.763h1.121a.76.76 0 0 0 .763-.763V.763A.76.76 0 0 0 1.883 0z" color="#000" overflow="visible"/></g></svg>
|
||||
|
After Width: | Height: | Size: 448 B |
@@ -1659,8 +1659,33 @@ main[role="main"] span.close-col-btn {
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
overflow-y: auto; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list li {
|
||||
opacity: 1;
|
||||
-webkit-transition: opacity 0.3s ease-in-out;
|
||||
transition: opacity 0.3s ease-in-out; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list li:hover a.delete-composition-link {
|
||||
opacity: 1; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list li.ajax-loading {
|
||||
opacity: 0.4; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list a {
|
||||
font-size: 0.756em; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list a.composition-link {
|
||||
display: inline-block;
|
||||
width: calc(100% - 14px); }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list a.delete-composition-link {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
margin-left: 5px;
|
||||
text-indent: 300px;
|
||||
overflow: hidden;
|
||||
background-image: url("../img/delete.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.3s ease-in-out;
|
||||
transition: opacity 0.3s ease-in-out; }
|
||||
#studio-ui .composition_ui > .wrapper .compositions-list a.new-composition-link {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
@@ -0,0 +1,78 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="10"
|
||||
height="10"
|
||||
viewBox="0 0 2.6458333 2.6458334"
|
||||
version="1.1"
|
||||
id="svg18014"
|
||||
inkscape:version="0.92.2 2405546, 2018-03-11"
|
||||
sodipodi:docname="delete.svg">
|
||||
<defs
|
||||
id="defs18008" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="63.356767"
|
||||
inkscape:cx="0.51510874"
|
||||
inkscape:cy="5.3735394"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="g5677-6"
|
||||
showgrid="false"
|
||||
units="px"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1025"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="28"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata18011">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Calque 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(0,-294.35415)">
|
||||
<g
|
||||
style="display:inline"
|
||||
transform="matrix(0.57246602,0,0,0.57246602,-27.152497,260.5372)"
|
||||
id="g5677-6">
|
||||
<path
|
||||
style="fill:none;stroke:#000000;stroke-width:0.72608751;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 47.749012,59.390676 3.985308,3.985307"
|
||||
id="path5673-2"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path5675-7"
|
||||
d="M 47.749012,63.375983 51.73432,59.390676"
|
||||
style="fill:none;stroke:#000000;stroke-width:0.72608751;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
|
||||
</g>
|
||||
<path
|
||||
style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
|
||||
d="M 1.8834657,294.35415 H 0.7623677 C 0.340016,294.35415 0,294.69418 0,295.11654 v 1.1211 c 0,0.42234 0.340016,0.76235 0.7623677,0.76235 h 1.121098 c 0.4223516,0 0.7623677,-0.34001 0.7623677,-0.76235 v -1.1211 c 0,-0.42236 -0.3400161,-0.76239 -0.7623677,-0.76239 z"
|
||||
id="rect18590"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
@@ -549,8 +549,37 @@ main[role="main"]{
|
||||
.compositions-list{
|
||||
width:30%; height:100%;
|
||||
overflow-y: auto;
|
||||
li{
|
||||
opacity: 1;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
&:hover{
|
||||
a.delete-composition-link{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.ajax-loading{
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
a{
|
||||
font-size: 0.756em;
|
||||
$s:7px; $m:5px;
|
||||
&.composition-link{
|
||||
display: inline-block;
|
||||
width: calc(100% - #{$s +$m +2});
|
||||
}
|
||||
&.delete-composition-link{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
$s:7px; width:$s; height:$s;
|
||||
margin-left: $m;
|
||||
text-indent: 300px; overflow: hidden;
|
||||
background-image: url('../img/delete.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
}
|
||||
&.new-composition-link{
|
||||
// padding-left: 1em;
|
||||
&:before{
|
||||
|
||||
Reference in New Issue
Block a user