-
+
{% block pMainHeader %}
{% endblock %}
-
+
{% block pMainContent %}
{% endblock %}
diff --git a/datamodels/2.x/itop-portal-base/portal/web/css/portal.css b/datamodels/2.x/itop-portal-base/portal/web/css/portal.css
index 2202bb4e1c..a9337da095 100644
--- a/datamodels/2.x/itop-portal-base/portal/web/css/portal.css
+++ b/datamodels/2.x/itop-portal-base/portal/web/css/portal.css
@@ -638,18 +638,6 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{
bottom: 0px;
height: 0px;
}
-#drag_overlay.drag_in{
- animation: show-drop-zone 0.3s ease-out forwards;
- -webkit-animation: show-drop-zone 0.3s ease-out forwards;
- -moz-animation: show-drop-zone 0.3s ease-out forwards;
- -ms-animation: show-drop-zone 0.3s ease-out forwards;
-}
-#drag_overlay.drag_out{
- animation: hide-drop-zone 0.3s ease-out forwards;
- -webkit-animation: hide-drop-zone 0.3s ease-out forwards;
- -moz-animation: hide-drop-zone 0.3s ease-out forwards;
- -ms-animation: hide-drop-zone 0.3s ease-out forwards;
-}
#drag_overlay .overlay_content{
margin-top: 5em;
width: 100%;
@@ -661,56 +649,71 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{
#drag_overlay .overlay_content .message{
font-size: 1.5em;
}
-@keyframes show-drop-zone{
- 100% {
- height: 20%;
+/* Attachments drag & drop zone, only for none mobile devices */
+@media (min-width: 768px){
+ #drag_overlay.drag_in{
+ animation: show-drop-zone 0.3s ease-out forwards;
+ -webkit-animation: show-drop-zone 0.3s ease-out forwards;
+ -moz-animation: show-drop-zone 0.3s ease-out forwards;
+ -ms-animation: show-drop-zone 0.3s ease-out forwards;
}
-}
-@-webkit-keyframes show-drop-zone{
- 100% {
- height: 20%;
+ #drag_overlay.drag_out{
+ animation: hide-drop-zone 0.3s ease-out forwards;
+ -webkit-animation: hide-drop-zone 0.3s ease-out forwards;
+ -moz-animation: hide-drop-zone 0.3s ease-out forwards;
+ -ms-animation: hide-drop-zone 0.3s ease-out forwards;
}
-}
-@-moz-keyframes show-drop-zone{
- 100% {
- height: 20%;
+ @keyframes show-drop-zone{
+ 100% {
+ height: 20%;
+ }
}
-}
-@-ms-keyframes show-drop-zone{
- 100% {
- height: 20%;
+ @-webkit-keyframes show-drop-zone{
+ 100% {
+ height: 20%;
+ }
}
-}
-@keyframes hide-drop-zone{
- 0% {
- height: 20%;
+ @-moz-keyframes show-drop-zone{
+ 100% {
+ height: 20%;
+ }
}
- 100% {
- height: 0%;
+ @-ms-keyframes show-drop-zone{
+ 100% {
+ height: 20%;
+ }
}
-}
-@-webkit-keyframes hide-drop-zone{
- 0% {
- height: 20%;
+ @keyframes hide-drop-zone{
+ 0% {
+ height: 20%;
+ }
+ 100% {
+ height: 0%;
+ }
}
- 100% {
- height: 0%;
+ @-webkit-keyframes hide-drop-zone{
+ 0% {
+ height: 20%;
+ }
+ 100% {
+ height: 0%;
+ }
}
-}
-@-moz-keyframes hide-drop-zone{
- 0% {
- height: 20%;
+ @-moz-keyframes hide-drop-zone{
+ 0% {
+ height: 20%;
+ }
+ 100% {
+ height: 0%;
+ }
}
- 100% {
- height: 0%;
- }
-}
-@-ms-keyframes hide-drop-zone{
- 0% {
- height: 20%;
- }
- 100% {
- height: 0%;
+ @-ms-keyframes hide-drop-zone{
+ 0% {
+ height: 20%;
+ }
+ 100% {
+ height: 0%;
+ }
}
}
@@ -726,6 +729,9 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{
.form_buttons .form_btn_transitions{
margin-bottom: 20px;
}
+.form_btn_regular.sticky{
+ display: none;
+}
@media (min-width: 768px){
.form_buttons .form_btn_transitions{
float: left !important;
@@ -736,6 +742,40 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{
.form_buttons .form_btn_regular btn{
width: inherit;
}
+ /* Making regular button sticky */
+ .form_btn_regular.sticky{
+ display: block;
+ position: fixed;
+ bottom: 0px;
+ padding: 15px;
+ background-color: #FFF; /* TODO : SASS this to panel bg */
+ border: 1px solid #DDD; /* TODO : SASS this to panel border */
+ border-radius: 4px; /* TODO : SASS this to panel border */
+ transition: bottom 0.3s;
+ }
+ .form_btn_regular.sticky.closed{
+ bottom: -80px;
+ }
+ /* - For regular layout */
+ #main-content .form_btn_regular.sticky{
+ right: 15px; /* TODO : SASS this to col-xs-12 padding */
+ }
+ /* - For modal layout */
+ .modal.in .form_btn_regular.sticky{
+ margin-left: 61%;
+ }
+}
+@media (min-width: 992px) {
+ /* - For modal layout */
+ .modal.in .form_btn_regular.sticky{
+ margin-left: 70%;
+ }
+}
+@media (min-width: 1200px) {
+ /* - For modal layout */
+ .modal.in .form_btn_regular.sticky{
+ margin-left: 73%;
+ }
}
/* CKEditor : Adding BS error feedback */
diff --git a/datamodels/2.x/itop-portal-base/portal/web/index.php b/datamodels/2.x/itop-portal-base/portal/web/index.php
index 78eaecad9a..6cf2dd4233 100644
--- a/datamodels/2.x/itop-portal-base/portal/web/index.php
+++ b/datamodels/2.x/itop-portal-base/portal/web/index.php
@@ -65,7 +65,7 @@ $oApp->register(new Silex\Provider\TwigServiceProvider(), array(
));
// Configuring Silex application
-$oApp['debug'] = false;
+$oApp['debug'] = true;
$oApp['combodo.absolute_url'] = utils::GetAbsoluteUrlAppRoot();
$oApp['combodo.portal.base.absolute_url'] = utils::GetAbsoluteUrlAppRoot() . 'env-' . utils::GetCurrentEnvironment() . '/itop-portal-base/portal/web/';
$oApp['combodo.portal.instance.absolute_url'] = utils::GetAbsoluteUrlAppRoot() . 'env-' . utils::GetCurrentEnvironment() . '/' . PORTAL_MODULE_ID . '/';
diff --git a/datamodels/2.x/itop-portal-base/portal/web/js/portal_form_handler.js b/datamodels/2.x/itop-portal-base/portal/web/js/portal_form_handler.js
index fc91c61f74..eb2c8316b3 100644
--- a/datamodels/2.x/itop-portal-base/portal/web/js/portal_form_handler.js
+++ b/datamodels/2.x/itop-portal-base/portal/web/js/portal_form_handler.js
@@ -125,59 +125,67 @@ $(function()
// Scrolling to top so the user can see messages
$('body').scrollTop(0);
- }
- // If everything is okay, we close the form and reload it.
- if(oValidation.valid)
- {
- if(me.options.is_modal)
+ // If everything is okay, we close the form and reload it.
+ if(oValidation.valid)
{
- me.element.closest('.modal').modal('hide');
- }
-
- // Checking if we have to redirect to another page
- if(oValidation.redirection !== undefined)
- {
- var oRedirection = oValidation.redirection;
- var bRedirectionAjax = (oRedirection.ajax !== undefined) ? oRedirection.ajax : false;
- var sUrl = null;
-
- // URL priority order :
- // redirection.url > me.option.submit_url > redirection.alternative_url
- if(oRedirection.url !== undefined)
+ if(me.options.is_modal)
{
- sUrl = oRedirection.url;
+ me.element.closest('.modal').modal('hide');
+ }
+
+ // Checking if we have to redirect to another page
+ if(oValidation.redirection !== undefined)
+ {
+ var oRedirection = oValidation.redirection;
+ var bRedirectionAjax = (oRedirection.ajax !== undefined) ? oRedirection.ajax : false;
+ var sUrl = null;
+
+ // URL priority order :
+ // redirection.url > me.option.submit_url > redirection.alternative_url
+ if(oRedirection.url !== undefined)
+ {
+ sUrl = oRedirection.url;
+ }
+ else if(me.options.submit_url !== null)
+ {
+ sUrl = me.options.submit_url;
+ }
+ else if(oRedirection.alternative_url !== undefined)
+ {
+ sUrl = oRedirection.alternative_url;
+ }
+
+ if(sUrl !== null)
+ {
+ if(bRedirectionAjax)
+ {
+ // Creating a new modal
+ var oModalElem = $('#modal-for-all').clone();
+ oModalElem.attr('id', '').appendTo('body');
+ // Loading content
+ oModalElem.find('.modal-content').html($('#page_overlay .overlay_content').html());
+ oModalElem.find('.modal-content').load(sUrl);
+ oModalElem.modal('show');
+ }
+ else
+ {
+ // Showing loader while redirecting, otherwise user tend to click somewhere in the page.
+ // Note : We use a timeout because .always() is called right after here and will hide the loader
+ setTimeout(function(){ me._disableFormBeforeLoading(); }, 50);
+ // Redirecting after a few ms so the user can see what happend
+ setTimeout(function() { location.href = sUrl; }, 400);
+ }
+ }
}
else if(me.options.submit_url !== null)
{
- sUrl = me.options.submit_url;
+ // Showing loader while redirecting, otherwise user tend to click somewhere in the page.
+ // Note : We use a timeout because .always() is called right after here and will hide the loader
+ setTimeout(function(){ me._disableFormBeforeLoading(); }, 50);
+ // Redirecting after a few ms so the user can see what happend
+ setTimeout(function() { location.href = me.options.submit_url; }, 400);
}
- else if(oRedirection.alternative_url !== undefined)
- {
- sUrl = oRedirection.alternative_url;
- }
-
- if(sUrl !== null)
- {
- if(bRedirectionAjax)
- {
- // Creating a new modal
- var oModalElem = $('#modal-for-all').clone();
- oModalElem.attr('id', '').appendTo('body');
- // Loading content
- oModalElem.find('.modal-content').html($('#page_overlay .overlay_content').html());
- oModalElem.find('.modal-content').load(sUrl);
- oModalElem.modal('show');
- }
- else
- {
- setTimeout(function() { location.href = sUrl; }, 400);
- }
- }
- }
- else if(me.options.submit_url !== null)
- {
- setTimeout(function() { location.href = me.options.submit_url; }, 400);
}
}
}
diff --git a/datamodels/2.x/itop-portal-base/portal/web/lib/jquery-visible/js/jquery.visible.min.js b/datamodels/2.x/itop-portal-base/portal/web/lib/jquery-visible/js/jquery.visible.min.js
new file mode 100644
index 0000000000..417039c38a
--- /dev/null
+++ b/datamodels/2.x/itop-portal-base/portal/web/lib/jquery-visible/js/jquery.visible.min.js
@@ -0,0 +1 @@
+!function(t){var i=t(window);t.fn.visible=function(t,e,o){if(!(this.length<1)){var r=this.length>1?this.eq(0):this,n=r.get(0),f=i.width(),h=i.height(),o=o?o:"both",l=e===!0?n.offsetWidth*n.offsetHeight:!0;if("function"==typeof n.getBoundingClientRect){var g=n.getBoundingClientRect(),u=g.top>=0&&g.top0&&g.bottom<=h,c=g.left>=0&&g.left0&&g.right<=f,v=t?u||s:u&&s,b=t?c||a:c&&a;if("both"===o)return l&&v&&b;if("vertical"===o)return l&&v;if("horizontal"===o)return l&&b}else{var d=i.scrollTop(),p=d+h,w=i.scrollLeft(),m=w+f,y=r.offset(),z=y.top,B=z+r.height(),C=y.left,R=C+r.width(),j=t===!0?B:z,q=t===!0?z:B,H=t===!0?R:C,L=t===!0?C:R;if("both"===o)return!!l&&p>=q&&j>=d&&m>=L&&H>=w;if("vertical"===o)return!!l&&p>=q&&j>=d;if("horizontal"===o)return!!l&&m>=L&&H>=w}}}}(jQuery);