[Common] Add help button to window component
This commit is contained in:
parent
a5f0371a9e
commit
d53ae5fab9
|
@ -152,6 +152,7 @@ define([
|
||||||
alias: 'Window',
|
alias: 'Window',
|
||||||
cls: '',
|
cls: '',
|
||||||
toolclose: 'close',
|
toolclose: 'close',
|
||||||
|
help: false,
|
||||||
maxwidth: undefined,
|
maxwidth: undefined,
|
||||||
maxheight: undefined,
|
maxheight: undefined,
|
||||||
minwidth: 0,
|
minwidth: 0,
|
||||||
|
@ -162,9 +163,14 @@ define([
|
||||||
var template = '<div class="asc-window<%= modal?" modal":"" %><%= cls?" "+cls:"" %>" id="<%= id %>" style="width:<%= width %>px;">' +
|
var template = '<div class="asc-window<%= modal?" modal":"" %><%= cls?" "+cls:"" %>" id="<%= id %>" style="width:<%= width %>px;">' +
|
||||||
'<% if (header==true) { %>' +
|
'<% if (header==true) { %>' +
|
||||||
'<div class="header">' +
|
'<div class="header">' +
|
||||||
|
'<div class="tools">' +
|
||||||
'<% if (closable!==false) %>' +
|
'<% if (closable!==false) %>' +
|
||||||
'<div class="tool close img-commonctrl"></div>' +
|
'<div class="tool close img-commonctrl"></div>' +
|
||||||
'<% %>' +
|
'<% %>' +
|
||||||
|
'<% if (help===true) %>' +
|
||||||
|
'<div class="tool help">?</div>' +
|
||||||
|
'<% %>' +
|
||||||
|
'</div>' +
|
||||||
'<div class="title"><%= title %></div> ' +
|
'<div class="title"><%= title %></div> ' +
|
||||||
'</div>' +
|
'</div>' +
|
||||||
'<% } %>' +
|
'<% } %>' +
|
||||||
|
@ -284,7 +290,7 @@ define([
|
||||||
|
|
||||||
/* window drag's functions */
|
/* window drag's functions */
|
||||||
function _dragstart(event) {
|
function _dragstart(event) {
|
||||||
if ( $(event.target).hasClass('close') ) return;
|
if ( $(event.target).hasClass('close') || $(event.target).hasClass('help') ) return;
|
||||||
Common.UI.Menu.Manager.hideAll();
|
Common.UI.Menu.Manager.hideAll();
|
||||||
var zoom = (event instanceof jQuery.Event) ? Common.Utils.zoom() : 1;
|
var zoom = (event instanceof jQuery.Event) ? Common.Utils.zoom() : 1;
|
||||||
this.dragging.enabled = true;
|
this.dragging.enabled = true;
|
||||||
|
@ -635,8 +641,13 @@ define([
|
||||||
else
|
else
|
||||||
(this.initConfig.toolclose=='hide') ? this.hide() : this.close();
|
(this.initConfig.toolclose=='hide') ? this.hide() : this.close();
|
||||||
};
|
};
|
||||||
|
var dohelp = function() {
|
||||||
|
if ( this.$window.find('.tool.help').hasClass('disabled') ) return;
|
||||||
|
this.fireEvent('help',this);
|
||||||
|
};
|
||||||
this.$window.find('.header').on('mousedown', this.binding.dragStart);
|
this.$window.find('.header').on('mousedown', this.binding.dragStart);
|
||||||
this.$window.find('.tool.close').on('click', _.bind(doclose, this));
|
this.$window.find('.tool.close').on('click', _.bind(doclose, this));
|
||||||
|
this.$window.find('.tool.help').on('click', _.bind(dohelp, this));
|
||||||
|
|
||||||
if (!this.initConfig.modal)
|
if (!this.initConfig.modal)
|
||||||
Common.Gateway.on('processmouse', _.bind(_onProcessMouse, this));
|
Common.Gateway.on('processmouse', _.bind(_onProcessMouse, this));
|
||||||
|
|
|
@ -59,6 +59,12 @@
|
||||||
|
|
||||||
cursor: move;
|
cursor: move;
|
||||||
|
|
||||||
|
.tools {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
padding-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
.tool {
|
.tool {
|
||||||
float: right;
|
float: right;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
|
@ -80,6 +86,25 @@
|
||||||
cursor: default;
|
cursor: default;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.help {
|
||||||
|
width: 20px;
|
||||||
|
margin-right:0;
|
||||||
|
line-height: 14px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #444;
|
||||||
|
opacity: 0.7;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
opacity: 0.3;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.resizing {
|
&.resizing {
|
||||||
|
|
Loading…
Reference in a new issue