mirror of
https://github.com/alchemy-fr/Phraseanet.git
synced 2025-10-09 19:13:26 +00:00
Refactor admin javascript to backbone application
This commit is contained in:
Nicolas Le Goff
@@ -8,202 +8,64 @@
|
|||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block stylesheet %}
|
{% block stylesheet %}
|
||||||
<link type="text/css" rel="stylesheet" href="{{ path('minifier', { 'f' : 'include/jslibs/jquery-treeview/jquery.treeview.css,include/jslibs/jquery.contextmenu.css,skins/common/main.css,skins/admin/css/Main.css,skins/admin/css/Bases.css,skins/admin/css/Tables.css,skins/admin/css/fields.css,skins/geonames/geonames.css,assets/jquery-file-upload/jquery.fileupload-ui.css' }) }}" />
|
<link type="text/css" rel="stylesheet" href="{{ path('minifier', { 'f' : 'assets/jquery.treeview/jquery.treeview.css,include/jslibs/jquery.contextmenu.css,skins/common/main.css,skins/admin/css/Main.css,skins/admin/css/Bases.css,skins/admin/css/Tables.css,skins/admin/css/fields.css,skins/geonames/geonames.css,assets/jquery-file-upload/jquery.fileupload-ui.css' }) }}" />
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
||||||
{% block javascript %}
|
{% block javascript %}
|
||||||
{% include "common/templates.html.twig" %}
|
{% include "common/templates.html.twig" %}
|
||||||
{# note: Tinymce must be include here without minify else URL resolution for tinymce plugins will fail #}
|
{# note: Tinymce must be include here without minify else URL resolution for tinymce plugins will fail #}
|
||||||
<script type="text/javascript" src="/assets/tinymce/tinymce.js"></script>
|
<script type="text/javascript" src="/assets/tinymce/tinymce.js"></script>
|
||||||
<script type="text/javascript" src="{{ path('minifier', { 'g' : 'admin' }) }}"></script>
|
<script type="text/javascript" src="{{ path('minifier', { 'g' : 'admin' }) }}"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var p4 = p4 || {};
|
var p4 = p4 || {};
|
||||||
p4.users = {sel:[]};
|
p4.users = {sel:[]};
|
||||||
var bodySize = {x:0,y:0};
|
|
||||||
|
|
||||||
var language = {
|
var bodySize = {x:0,y:0};
|
||||||
serverName: '{{ app['conf'].get('servername') | e('js') }}',
|
|
||||||
serverError: '{{ 'phraseanet::erreur: Une erreur est survenue, si ce probleme persiste, contactez le support technique' | trans | e('js') }}',
|
|
||||||
serverTimeout: '{{ 'phraseanet::erreur: La connection au serveur Phraseanet semble etre indisponible' | trans | e('js') }}',
|
|
||||||
serverDisconnected: '{{ 'phraseanet::erreur: Votre session est fermee, veuillez vous re-authentifier' | trans | e('js') }}',
|
|
||||||
check_all : '{{ 'Cocher toute la colonne' | trans | e('js') }}',
|
|
||||||
uncheck_all : '{{ 'Decocher toute la colonne' | trans | e('js') }}',
|
|
||||||
create_template : '{{ 'Creer un model' | trans | e('js') }}',
|
|
||||||
create_user : '{{ 'Creer un utilisateur' | trans | e('js') }}',
|
|
||||||
annuler : '{{ 'boutton::annuler' | trans | e('js') }}',
|
|
||||||
errorFileApiTooBig : '{{ 'This file is too big' | trans | e('js') }}',
|
|
||||||
requiredValue: '{{ 'This field is required' | trans | e('js') }}',
|
|
||||||
attention: '{{ 'Attention' | trans | e('js') }}',
|
|
||||||
reset_template_do_reset_apply_button: '{{ 'Reset and apply' | trans | e('js') }}',
|
|
||||||
reset_template_confirm_dialog_title: '{{ 'Confirm reset users rights before applying template' | trans | e('js') }}',
|
|
||||||
reset_template_do_confirm_choice: '{{ 'Rights will be erased before applying template, do you confirm?' | trans | e('js') }}',
|
|
||||||
reset_template_do_reset_button: '{{ 'Reset and apply template' | trans | e('js') }}',
|
|
||||||
reset_template_do_not_reset_button: '{{ 'Apply template' | trans | e('js') }}',
|
|
||||||
reset_template_dialog_title: '{{ 'Reset rights before applying template?' | trans | e('js') }}',
|
|
||||||
reset_template_ask_choice: '{{ 'Would you like to reset rights before applying the template?' | trans | e('js') }}',
|
|
||||||
reset_template_ask_choice: '{{ 'Would you like to reset rights before applying the template?' | trans | e('js') }}'
|
|
||||||
};
|
|
||||||
|
|
||||||
function sessionactive(){
|
var resize = function() {
|
||||||
$.ajax({
|
bodySize.y = $(window).height() - $('#mainMenu').outerHeight();
|
||||||
type: "POST",
|
bodySize.x = $(window).width();
|
||||||
url: "/session/update/",
|
|
||||||
dataType: 'json',
|
|
||||||
data: {
|
|
||||||
module : 3,
|
|
||||||
usr : {{ app['authentication'].getUser().getId() }}
|
|
||||||
},
|
|
||||||
error: function(){
|
|
||||||
window.setTimeout("sessionactive();", 10000);
|
|
||||||
},
|
|
||||||
timeout: function(){
|
|
||||||
window.setTimeout("sessionactive();", 10000);
|
|
||||||
},
|
|
||||||
success: function(data){
|
|
||||||
if(data)
|
|
||||||
manageSession(data);
|
|
||||||
var t = 120000;
|
|
||||||
if(data.apps && parseInt(data.apps)>1)
|
|
||||||
t = Math.round((Math.sqrt(parseInt(data.apps)-1) * 1.3 * 120000));
|
|
||||||
window.setTimeout("sessionactive();", t);
|
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
function enableForms(forms) {
|
var language = {
|
||||||
forms.bind('submit', function(event){
|
serverName: '{{ app['conf'].get('servername') | e('js') }}',
|
||||||
var method = $(this).attr('method');
|
serverError: '{{ 'phraseanet::erreur: Une erreur est survenue, si ce probleme persiste, contactez le support technique' | trans | e('js') }}',
|
||||||
var url = $(this).attr('action');
|
serverTimeout: '{{ 'phraseanet::erreur: La connection au serveur Phraseanet semble etre indisponible' | trans | e('js') }}',
|
||||||
var datas = $(this).serializeArray();
|
serverDisconnected: '{{ 'phraseanet::erreur: Votre session est fermee, veuillez vous re-authentifier' | trans | e('js') }}',
|
||||||
|
check_all : '{{ 'Cocher toute la colonne' | trans | e('js') }}',
|
||||||
|
uncheck_all : '{{ 'Decocher toute la colonne' | trans | e('js') }}',
|
||||||
|
create_template : '{{ 'Creer un model' | trans | e('js') }}',
|
||||||
|
create_user : '{{ 'Creer un utilisateur' | trans | e('js') }}',
|
||||||
|
annuler : '{{ 'boutton::annuler' | trans | e('js') }}',
|
||||||
|
errorFileApiTooBig : '{{ 'This file is too big' | trans | e('js') }}',
|
||||||
|
requiredValue: '{{ 'This field is required' | trans | e('js') }}',
|
||||||
|
attention: '{{ 'Attention' | trans | e('js') }}',
|
||||||
|
reset_template_do_reset_apply_button: '{{ 'Reset and apply' | trans | e('js') }}',
|
||||||
|
reset_template_confirm_dialog_title: '{{ 'Confirm reset users rights before applying template' | trans | e('js') }}',
|
||||||
|
reset_template_do_confirm_choice: '{{ 'Rights will be erased before applying template, do you confirm?' | trans | e('js') }}',
|
||||||
|
reset_template_do_reset_button: '{{ 'Reset and apply template' | trans | e('js') }}',
|
||||||
|
reset_template_do_not_reset_button: '{{ 'Apply template' | trans | e('js') }}',
|
||||||
|
reset_template_dialog_title: '{{ 'Reset rights before applying template?' | trans | e('js') }}',
|
||||||
|
reset_template_ask_choice: '{{ 'Would you like to reset rights before applying the template?' | trans | e('js') }}',
|
||||||
|
reset_template_ask_choice: '{{ 'Would you like to reset rights before applying the template?' | trans | e('js') }}'
|
||||||
|
};
|
||||||
|
|
||||||
if(!method) {
|
$(document).ready(function(){
|
||||||
method = 'GET';
|
$(window).bind('resize',function(){resize();});
|
||||||
}
|
resize();
|
||||||
$('#right-ajax').empty().addClass('loading');
|
|
||||||
if(url) {
|
|
||||||
$.ajax({
|
|
||||||
type: method,
|
|
||||||
url: url,
|
|
||||||
data: datas,
|
|
||||||
success: enableFormsCallback
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
function enableFormsCallback(datas)
|
|
||||||
{
|
|
||||||
$('#right-ajax').removeClass('loading').html(datas);
|
|
||||||
enableForms($('#right-ajax form:not(.no-ajax)'));
|
|
||||||
|
|
||||||
$.each($('#right-ajax a:not(.no-ajax)'),function(i, el){
|
|
||||||
enableLink($(el));
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
function enableLink(link) {
|
|
||||||
$(link).bind('click',function(event){
|
|
||||||
var dest = link.attr('href');
|
|
||||||
var method = link.attr("method");
|
|
||||||
|
|
||||||
if(dest && dest.indexOf('#') !== 0) {
|
|
||||||
loadRightAjax(dest, method || "GET");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadRightAjax(url, method)
|
|
||||||
{
|
|
||||||
$('#right-ajax').empty().addClass('loading').parent().show();
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
type: method,
|
|
||||||
url: url,
|
|
||||||
success: function(data) {
|
|
||||||
enableFormsCallback(data);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function activeTree(click)
|
|
||||||
{
|
|
||||||
$('#FNDR').treeview({
|
|
||||||
collapsed: true,
|
|
||||||
animated: "medium"
|
|
||||||
});
|
|
||||||
|
|
||||||
$.each($('#tree a[target=right]'),function(){
|
|
||||||
var dest = $(this).attr('href');
|
|
||||||
|
|
||||||
$(this).bind('click',function(){
|
|
||||||
|
|
||||||
loadRightAjax(dest);
|
|
||||||
$('#tree .selected').removeClass('selected');
|
|
||||||
$(this).parent().addClass('selected');
|
|
||||||
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
$(this).removeAttr('target');
|
|
||||||
});
|
|
||||||
if(click === true)
|
|
||||||
{
|
|
||||||
if($('#tree .selected').length > 0)
|
|
||||||
$('#tree .selected a').trigger('click');
|
|
||||||
else
|
|
||||||
$('.zone_online_users').trigger('click');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).ready(
|
|
||||||
function(){
|
|
||||||
resize();
|
|
||||||
setTimeout('sessionactive();',15000);
|
|
||||||
activeTree(true);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
function resize()
|
|
||||||
{
|
|
||||||
bodySize.y = $(window).height() - $('#mainMenu').outerHeight();
|
|
||||||
bodySize.x = $(window).width();
|
|
||||||
}
|
|
||||||
|
|
||||||
$(window).bind('resize',function(){resize();});
|
|
||||||
|
|
||||||
function reloadTree(position, click){
|
|
||||||
$.ajax({
|
|
||||||
type: "GET",
|
|
||||||
url: "/admin/tree/",
|
|
||||||
data: {
|
|
||||||
position : position
|
|
||||||
},
|
|
||||||
success: function(datas){
|
|
||||||
$('#FNDR').empty().append(datas);
|
|
||||||
activeTree(click);
|
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<script type="text/javascript" src="{{ path('minifier', { 'f' : '/assets/requirejs/require.js' }) }}"></script>
|
<script type="text/javascript" src="{{ path('minifier', { 'f' : '/assets/requirejs/require.js' }) }}"></script>
|
||||||
<script type="text/javascript" src="{{ path('minifier', { 'f' : '/scripts/apps/admin/main/main.js' }) }}"></script>
|
<script type="text/javascript" src="{{ path('minifier', { 'f' : '/scripts/apps/admin/main/main.js' }) }}"></script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div id="left" class="PNB" style="width:250px;right:auto;" data-websocket="{{ "ws://" ~ app["conf"].get(["main" ,"websocket-server", "host"]) ~ "/" ~ app["conf"].get(["main" ,"websocket-server", "port"]) }}">
|
<div id="admin-app" data-usr="{{ app['authentication'].getUser().getId() }}">
|
||||||
|
<div id="left" class="PNB left-view" style="width:250px;right:auto;" data-websocket="{{ "ws://" ~ app["conf"].get(["main" ,"websocket-server", "host"]) ~ ":" ~ app["conf"].get(["main" ,"websocket-server", "port"]) ~ "/websockets" }}">
|
||||||
<div class="PNB10" style="right:0">
|
<div class="PNB10" style="right:0">
|
||||||
<div id="FNDR">
|
<div id="FNDR">
|
||||||
{% include 'admin/tree.html.twig' %}
|
{% include 'admin/tree.html.twig' %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -217,7 +79,7 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="right PNB" style="left:250px;overflow:auto;">
|
<div class="right PNB" style="left:250px;overflow:auto;">
|
||||||
<div id="right-ajax" class="PNB10"></div>
|
<div id="right-ajax" class="PNB10 right-view"></div>
|
||||||
</div>
|
</div>
|
||||||
<div id="quotas_dialog"></div>
|
<div id="quotas_dialog"></div>
|
||||||
<div id="masks_dialog"></div>
|
<div id="masks_dialog"></div>
|
||||||
@@ -245,4 +107,5 @@
|
|||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div id="DIALOG" style="color:white;"></div>
|
<div id="DIALOG" style="color:white;"></div>
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|||||||
81
www/scripts/apps/admin/main/app.js
Normal file
81
www/scripts/apps/admin/main/app.js
Normal file
@@ -0,0 +1,81 @@
|
|||||||
|
/*
|
||||||
|
* This file is part of Phraseanet
|
||||||
|
*
|
||||||
|
* (c) 2005-2014 Alchemy
|
||||||
|
*
|
||||||
|
* For the full copyright and license information, please view the LICENSE
|
||||||
|
* file that was distributed with this source code.
|
||||||
|
*/
|
||||||
|
|
||||||
|
define([
|
||||||
|
"jquery",
|
||||||
|
"underscore",
|
||||||
|
"backbone",
|
||||||
|
"common/websockets/connection",
|
||||||
|
"apps/admin/main/views/leftPanel",
|
||||||
|
"apps/admin/main/views/rightPanel"
|
||||||
|
], function ($, _, Backbone, WSConnection, LeftPanel, RightPanel) {
|
||||||
|
window.AdminApp = {
|
||||||
|
$scope: $("#admin-app"),
|
||||||
|
$leftView : $(".left-view", this.$scope),
|
||||||
|
$rightView : $(".right-view", this.$scope),
|
||||||
|
eventManager: _.extend({}, Backbone.Events)
|
||||||
|
};
|
||||||
|
|
||||||
|
var sessionActive = function() {
|
||||||
|
$.ajax({
|
||||||
|
type: "POST",
|
||||||
|
url: "/session/update/",
|
||||||
|
dataType: 'json',
|
||||||
|
data: {
|
||||||
|
module : 3,
|
||||||
|
usr : AdminApp.$scope.data("usr")
|
||||||
|
},
|
||||||
|
error: function(){
|
||||||
|
window.setTimeout(function() {sessionActive();}, 10000);
|
||||||
|
},
|
||||||
|
timeout: function(){
|
||||||
|
window.setTimeout(function() {sessionActive();}, 10000);
|
||||||
|
},
|
||||||
|
success: function(data){
|
||||||
|
if(data) {
|
||||||
|
manageSession(data);
|
||||||
|
var t = 120000;
|
||||||
|
if(data.apps && parseInt(data.apps)>1) {
|
||||||
|
t = Math.round((Math.sqrt(parseInt(data.apps)-1) * 1.3 * 120000));
|
||||||
|
}
|
||||||
|
window.setTimeout(function() {sessionActive();}, t);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
var initialize = function (options) {
|
||||||
|
if (false === "wsurl" in options) {
|
||||||
|
throw "You must define a websocket url";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (false === WSConnection.hasSession()) {
|
||||||
|
WSConnection.connect(options.wsurl);
|
||||||
|
}
|
||||||
|
|
||||||
|
AdminApp.LeftView = new LeftPanel({
|
||||||
|
el: AdminApp.$leftView,
|
||||||
|
eventManager: AdminApp.eventManager
|
||||||
|
});
|
||||||
|
|
||||||
|
AdminApp.RightView = new RightPanel({
|
||||||
|
el: AdminApp.$rightView,
|
||||||
|
eventManager: AdminApp.eventManager
|
||||||
|
});
|
||||||
|
|
||||||
|
AdminApp.LeftView.activeTree();
|
||||||
|
AdminApp.LeftView.clickSelected();
|
||||||
|
|
||||||
|
window.setTimeout(function() {sessionActive();}, 15000);
|
||||||
|
};
|
||||||
|
|
||||||
|
return {
|
||||||
|
initialize: initialize
|
||||||
|
};
|
||||||
|
});
|
||||||
56
www/scripts/apps/admin/main/main.js
Normal file
56
www/scripts/apps/admin/main/main.js
Normal file
@@ -0,0 +1,56 @@
|
|||||||
|
/*
|
||||||
|
* This file is part of Phraseanet
|
||||||
|
*
|
||||||
|
* (c) 2005-2014 Alchemy
|
||||||
|
*
|
||||||
|
* For the full copyright and license information, please view the LICENSE
|
||||||
|
* file that was distributed with this source code.
|
||||||
|
*/
|
||||||
|
|
||||||
|
// configure AMD loading
|
||||||
|
require.config({
|
||||||
|
baseUrl: "/scripts",
|
||||||
|
paths: {
|
||||||
|
jquery: "../assets/jquery/jquery",
|
||||||
|
"jquery.ui": "../assets/jquery.ui/jquery-ui",
|
||||||
|
underscore: "../assets/underscore-amd/underscore",
|
||||||
|
backbone: "../assets/backbone-amd/backbone",
|
||||||
|
"jquery.ui.widget": "../assets/jquery-file-upload/jquery.ui.widget",
|
||||||
|
"jquery.cookie": "../assets/jquery.cookie/jquery.cookie",
|
||||||
|
"jquery.treeview": "../assets/jquery.treeview/jquery.treeview",
|
||||||
|
"jquery.tooltip": "../assets/jquery.tooltip/jquery.tooltip",
|
||||||
|
"blueimp.loadimage" : "../assets/blueimp-load-image/load-image",
|
||||||
|
"jfu.iframe-transport": "../assets/jquery-file-upload/jquery.iframe-transport",
|
||||||
|
"jfu.fileupload": "../assets/jquery-file-upload/jquery.fileupload"
|
||||||
|
},
|
||||||
|
shim: {
|
||||||
|
"jquery.treeview": {
|
||||||
|
deps: ['jquery', 'jquery.cookie'],
|
||||||
|
exports: '$.fn.treeview'
|
||||||
|
},
|
||||||
|
"jquery.cookie": {
|
||||||
|
deps: ["jquery"],
|
||||||
|
exports: '$.fn.cookie'
|
||||||
|
},
|
||||||
|
"jquery.tooltip": {
|
||||||
|
deps: ["jquery"],
|
||||||
|
exports: '$.fn.tooltip'
|
||||||
|
},
|
||||||
|
"jquery.ui": {
|
||||||
|
deps: ["jquery"]
|
||||||
|
},
|
||||||
|
"jquery.ui.widget": {
|
||||||
|
deps: ["jquery"]
|
||||||
|
},
|
||||||
|
"jfu.fileupload": {
|
||||||
|
deps: ["jquery.ui.widget"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// launch application
|
||||||
|
require(["jquery", "apps/admin/main/app"], function ($, App) {
|
||||||
|
App.initialize({
|
||||||
|
"wsurl": $("#left").data("websocket")
|
||||||
|
});
|
||||||
|
});
|
||||||
106
www/scripts/apps/admin/main/views/leftPanel.js
Normal file
106
www/scripts/apps/admin/main/views/leftPanel.js
Normal file
@@ -0,0 +1,106 @@
|
|||||||
|
/*
|
||||||
|
* This file is part of Phraseanet
|
||||||
|
*
|
||||||
|
* (c) 2005-2014 Alchemy
|
||||||
|
*
|
||||||
|
* For the full copyright and license information, please view the LICENSE
|
||||||
|
* file that was distributed with this source code.
|
||||||
|
*/
|
||||||
|
|
||||||
|
define([
|
||||||
|
"jquery",
|
||||||
|
"underscore",
|
||||||
|
"backbone",
|
||||||
|
"common/websockets/subscriberManager",
|
||||||
|
"jquery.treeview"
|
||||||
|
], function ($, _, Backbone, SubscriberManager) {
|
||||||
|
var LeftPanelView = Backbone.View.extend({
|
||||||
|
initialize: function (options) {
|
||||||
|
if (false === "eventManager" in options) {
|
||||||
|
throw "You must set en event manager";
|
||||||
|
}
|
||||||
|
this.delegateEvents(this.events);
|
||||||
|
this.eventManager = options.eventManager;
|
||||||
|
this.$treeview = $("#FNDR", this.$el);
|
||||||
|
|
||||||
|
var $this = this;
|
||||||
|
this.eventManager.on("panel:left:success", function(data, click) {
|
||||||
|
$this.render.append(data);
|
||||||
|
$this.activeTree();
|
||||||
|
if (click) {
|
||||||
|
$this.clickSelected();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
render : function(data) {
|
||||||
|
this.$treeview.empty().append(data);
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
"click a[target=right]": "clickAction"
|
||||||
|
},
|
||||||
|
activeTree: function() {
|
||||||
|
// tree view jquery module is not loaded as a module
|
||||||
|
this.$treeview.treeview({
|
||||||
|
collapsed: true,
|
||||||
|
animated: "medium"
|
||||||
|
});
|
||||||
|
},
|
||||||
|
clickSelected: function () {
|
||||||
|
if($('.selected', this.$el).length > 0) {
|
||||||
|
$('.selected a', this.$el).trigger('click');
|
||||||
|
} else {
|
||||||
|
$('.zone_online_users', this.$el).trigger('click');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
reloadTree: function (position, click) {
|
||||||
|
var $this = this;
|
||||||
|
$.ajax({
|
||||||
|
type: "GET",
|
||||||
|
url: "/admin/tree/",
|
||||||
|
data: {position : position},
|
||||||
|
success: function(data){
|
||||||
|
$this.eventManager.trigger('panel:left:success', data , click)
|
||||||
|
},
|
||||||
|
beforeSend: function(){
|
||||||
|
$this.eventManager.trigger('panel:left:beforeSend');
|
||||||
|
},
|
||||||
|
complete: function(){
|
||||||
|
$this.eventManager.trigger('panel:left:complete');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
clickAction: function(event) {
|
||||||
|
event.preventDefault();
|
||||||
|
var $this = this;
|
||||||
|
var link = $(event.currentTarget);
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
type: "GET",
|
||||||
|
url: link.attr('href'),
|
||||||
|
success: function(data) {
|
||||||
|
$this.eventManager.trigger('panel:right:success', data);
|
||||||
|
},
|
||||||
|
beforeSend: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:beforeSend');
|
||||||
|
},
|
||||||
|
complete: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:complete');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if ("undefined" !== typeof link.data("ws-topic")) {
|
||||||
|
console.log(link.data("ws-topic"));
|
||||||
|
SubscriberManager.register(link.data("ws-topic"));
|
||||||
|
}
|
||||||
|
|
||||||
|
$this.selectLink(link);
|
||||||
|
link.removeAttr('target');
|
||||||
|
},
|
||||||
|
selectLink: function(link) {
|
||||||
|
$('.selected', this.$el).removeClass('selected');
|
||||||
|
link.parent().addClass('selected');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return LeftPanelView;
|
||||||
|
});
|
||||||
104
www/scripts/apps/admin/main/views/rightPanel.js
Normal file
104
www/scripts/apps/admin/main/views/rightPanel.js
Normal file
@@ -0,0 +1,104 @@
|
|||||||
|
/*
|
||||||
|
* This file is part of Phraseanet
|
||||||
|
*
|
||||||
|
* (c) 2005-2014 Alchemy
|
||||||
|
*
|
||||||
|
* For the full copyright and license information, please view the LICENSE
|
||||||
|
* file that was distributed with this source code.
|
||||||
|
*/
|
||||||
|
|
||||||
|
define([
|
||||||
|
"jquery",
|
||||||
|
"underscore",
|
||||||
|
"backbone",
|
||||||
|
"jquery.tooltip",
|
||||||
|
"blueimp.loadimage",
|
||||||
|
"jfu.iframe-transport",
|
||||||
|
"jfu.fileupload",
|
||||||
|
"jquery.ui"
|
||||||
|
], function ($, _, Backbone) {
|
||||||
|
var RightPanelView = Backbone.View.extend({
|
||||||
|
initialize: function (options) {
|
||||||
|
if (false === "eventManager" in options) {
|
||||||
|
throw "You must set en event manager";
|
||||||
|
}
|
||||||
|
this.delegateEvents(this.events);
|
||||||
|
this.eventManager = options.eventManager;
|
||||||
|
|
||||||
|
var $this = this;
|
||||||
|
this.eventManager.on("panel:right:beforeSend", function() {
|
||||||
|
$this.$el.empty();
|
||||||
|
$this.loadingState(true);
|
||||||
|
});
|
||||||
|
this.eventManager.on("panel:right:complete", function() {
|
||||||
|
$this.loadingState(false);
|
||||||
|
});
|
||||||
|
this.eventManager.on("panel:right:success", function(data) {
|
||||||
|
$this.render(data);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
"submit form:not(.no-ajax)": "submitAction",
|
||||||
|
"click a:not(.no-ajax)": "clickAction"
|
||||||
|
},
|
||||||
|
render: function (data) {
|
||||||
|
this.$el.html(data);
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
clickAction: function(event) {
|
||||||
|
event.preventDefault();
|
||||||
|
var $this = this;
|
||||||
|
var link = $(event.currentTarget);
|
||||||
|
var url = link.attr('href');
|
||||||
|
|
||||||
|
if(url && url.indexOf('#') !== 0) {
|
||||||
|
$.ajax({
|
||||||
|
type: link.attr("method") || "GET",
|
||||||
|
url: url,
|
||||||
|
success: function(data) {
|
||||||
|
$this.eventManager.trigger('panel:right:success', data);
|
||||||
|
},
|
||||||
|
beforeSend: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:beforeSend');
|
||||||
|
},
|
||||||
|
complete: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:complete');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
submitAction: function(event) {
|
||||||
|
event.preventDefault();
|
||||||
|
var $this = this;
|
||||||
|
var link = $(event.currentTarget);
|
||||||
|
var url = link.attr('action') || 'GET';
|
||||||
|
|
||||||
|
if(url) {
|
||||||
|
$.ajax({
|
||||||
|
type: link.attr('method'),
|
||||||
|
url: url,
|
||||||
|
data: link.serializeArray(),
|
||||||
|
success: function (data) {
|
||||||
|
$this.eventManager.trigger("panel:right:success", data);
|
||||||
|
},
|
||||||
|
beforeSend: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:beforeSend');
|
||||||
|
},
|
||||||
|
complete: function(){
|
||||||
|
$this.eventManager.trigger('panel:right:complete');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loadingState: function(state) {
|
||||||
|
if (state) {
|
||||||
|
this.$el.addClass("loading");
|
||||||
|
} else {
|
||||||
|
this.$el.removeClass("loading");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return RightPanelView;
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user