You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@openmeetings.apache.org by so...@apache.org on 2017/04/02 12:24:13 UTC
svn commit: r1789878 - in
/openmeetings/application/trunk/openmeetings-web/src/main:
java/org/apache/openmeetings/web/room/wb/ webapp/css/
Author: solomax
Date: Sun Apr 2 12:24:13 2017
New Revision: 1789878
URL: http://svn.apache.org/viewvc?rev=1789878&view=rev
Log:
[OPENMEETINGS-551] add/remove readOnly is added to WB
Modified:
openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html
openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.java
openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js
openmeetings/application/trunk/openmeetings-web/src/main/webapp/css/room.css
Modified: openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html
URL: http://svn.apache.org/viewvc/openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html?rev=1789878&r1=1789877&r2=1789878&view=diff
==============================================================================
--- openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html (original)
+++ openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html Sun Apr 2 12:24:13 2017
@@ -22,23 +22,26 @@
<wicket:panel>
<div class="tabs">
<div class="wb-tabbar ui-corner-all ui-widget-header">
- <div class="add clickable om-icon big"></div>
- <div class="prev clickable om-icon big"></div>
<div class="scroll-container"><ul class="scrollable"></ul></div>
- <div class="next clickable om-icon big"></div>
</div>
</div>
<div style="display:none;">
+ <div id="wb-tabbar-ctrls-left">
+ <div class="add clickable om-icon big"></div>
+ <div class="prev clickable om-icon big"></div>
+ </div>
+ <div id="wb-tabbar-ctrls-right">
+ <div class="next clickable om-icon big"></div>
+ </div>
<ul><li id="wb-area-tab">
<a>[title]</a>
- <button type="button" class="ui-button ui-corner-all ui-widget ui-button-icon-only ui-dialog-titlebar-close" wicket:message="title:85">
- <span class="ui-button-icon ui-icon ui-icon-closethick"></span>
- <span class="ui-button-icon-space"> </span>
- <wicket:message key="85"/>
- </button>
</li></ul>
-
+ <button id="wb-tab-close" type="button" class="ui-button ui-corner-all ui-widget ui-button-icon-only ui-dialog-titlebar-close" wicket:message="title:85">
+ <span class="ui-button-icon ui-icon ui-icon-closethick"></span>
+ <span class="ui-button-icon-space"> </span>
+ <wicket:message key="85"/>
+ </button>
<div id="wb-area-cliparts" class="btn-group" style="float: left;">
<a class="dropdown-toggle" data-toggle="dropdown" wicket:message="title:1323"></a>
<ul class="dropdown-menu om-left">
@@ -48,54 +51,57 @@
</li>
</ul>
</div>
-
<div id="wb-area">
<div class="scroll-container">
<div class="canvases"></div>
</div>
- <div class="tools ui-state-active vertical clear" style="position: absolute; top: 20px; right: 0px;">
- <div class="bumper"></div>
- <div wicket:message="title:72" class="ui-widget-header clickable om-icon big pointer"></div>
- <div wicket:message="title:557" class="ui-widget-header clickable om-icon big apointer"></div>
- <div wicket:message="title:73" class="ui-widget-header clickable om-icon big text"></div>
- <div wicket:message="title:74" class="ui-widget-header clickable om-icon big paint"></div>
- <div wicket:message="title:75" class="ui-widget-header clickable om-icon big line"></div>
- <div wicket:message="title:76" class="ui-widget-header clickable om-icon big uline"></div>
- <div wicket:message="title:77" class="ui-widget-header clickable om-icon big rect"></div>
- <div wicket:message="title:78" class="ui-widget-header clickable om-icon big ellipse"></div>
- <div wicket:message="title:79" class="ui-widget-header clickable om-icon big arrow"></div>
- <div wicket:message="title:4" class="ui-widget-header clickable om-icon big settings"></div>
+ </div>
+ <div id="wb-tools" class="tools ui-state-active vertical clear" style="position: absolute; top: 20px; right: 0px;">
+ <div class="bumper"></div>
+ <div wicket:message="title:72" class="ui-widget-header clickable om-icon big pointer"></div>
+ <div wicket:message="title:557" class="ui-widget-header clickable om-icon big apointer"></div>
+ <div wicket:message="title:73" class="ui-widget-header clickable om-icon big text"></div>
+ <div wicket:message="title:74" class="ui-widget-header clickable om-icon big paint"></div>
+ <div wicket:message="title:75" class="ui-widget-header clickable om-icon big line"></div>
+ <div wicket:message="title:76" class="ui-widget-header clickable om-icon big uline"></div>
+ <div wicket:message="title:77" class="ui-widget-header clickable om-icon big rect"></div>
+ <div wicket:message="title:78" class="ui-widget-header clickable om-icon big ellipse"></div>
+ <div wicket:message="title:79" class="ui-widget-header clickable om-icon big arrow"></div>
+ <div wicket:message="title:4" class="ui-widget-header clickable om-icon big settings"></div>
+ </div>
+ <div id="wb-tools-readonly" class="tools readonly ui-state-active vertical clear" style="position: absolute; top: 20px; right: 0px;">
+ <div class="bumper"></div>
+ <div wicket:message="title:557" class="ui-widget-header clickable om-icon big apointer"></div>
+ </div>
+ <div id="wb-settings" class="wb-settings ui-corner-all ui-widget-content" style="display: none; bottom: 100px; right: 100px;">
+ <div wicket:message="title:843" class="header ui-dialog-titlebar ui-corner-all ui-widget-header ui-helper-clearfix ui-draggable-handle">
+ <span class="ui-dialog-title"><wicket:message key="843"/></span>
+ <button type="button" class="ui-button ui-corner-all ui-widget ui-button-icon-only ui-dialog-titlebar-close" wicket:message="title:85">
+ <span class="ui-button-icon ui-icon ui-icon-closethick"></span>
+ <span class="ui-button-icon-space"> </span>
+ <wicket:message key="85"/>
+ </button>
</div>
- <div class="wb-settings ui-corner-all ui-widget-content" style="display: none; bottom: 100px; right: 100px;">
- <div wicket:message="title:843" class="header ui-dialog-titlebar ui-corner-all ui-widget-header ui-helper-clearfix ui-draggable-handle">
- <span class="ui-dialog-title"><wicket:message key="843"/></span>
- <button type="button" class="ui-button ui-corner-all ui-widget ui-button-icon-only ui-dialog-titlebar-close" wicket:message="title:85">
- <span class="ui-button-icon ui-icon ui-icon-closethick"></span>
- <span class="ui-button-icon-space"> </span>
- <wicket:message key="85"/>
- </button>
+ <div class="tab props">
+ <div class="prop-row">
+ <div class="block lbl" wicket:message="title:546"><wicket:message key="545"/></div>
+ <div class="block input"><input class="wb-dim-x" type="text" maxlength="4" readonly="readonly"/></div>
+ <div class="block lbl" wicket:message="title:550"><wicket:message key="549"/></div>
+ <div class="block input"><input class="wb-dim-w" type="text" maxlength="4" readonly="readonly"/></div>
+ <div class="block input" style="width: 2em;"><input class="wb-prop-color" type="color" value="#ff6600" wicket:message="title:424"/></div>
+ <div class="block but"><button class="wb-prop-lock-color" wicket:message="title:426"> </button></div>
+ <div class="block input"><input class="wb-prop-width" type="number" min="1" max="100" value="2" wicket:message="title:429"/></div>
+ <div class="block but"><button class="wb-prop-i" wicket:message="title:86">I</button></div>
</div>
- <div class="tab props">
- <div class="prop-row">
- <div class="block lbl" wicket:message="title:546"><wicket:message key="545"/></div>
- <div class="block input"><input class="wb-dim-x" type="text" maxlength="4" readonly="readonly"/></div>
- <div class="block lbl" wicket:message="title:550"><wicket:message key="549"/></div>
- <div class="block input"><input class="wb-dim-w" type="text" maxlength="4" readonly="readonly"/></div>
- <div class="block input" style="width: 2em;"><input class="wb-prop-color" type="color" value="#ff6600" wicket:message="title:424"/></div>
- <div class="block but"><button class="wb-prop-lock-color" wicket:message="title:426"> </button></div>
- <div class="block input"><input class="wb-prop-width" type="number" min="1" max="100" value="2" wicket:message="title:429"/></div>
- <div class="block but"><button class="wb-prop-i" wicket:message="title:86">I</button></div>
- </div>
- <div class="prop-row">
- <div class="block lbl" wicket:message="title:548"><wicket:message key="547"/></div>
- <div class="block input"><input class="wb-dim-y" type="text" maxlength="4" readonly="readonly"/></div>
- <div class="block lbl" wicket:message="title:552"><wicket:message key="551"/></div>
- <div class="block input"><input class="wb-dim-h" type="text" maxlength="4" readonly="readonly"/></div>
- <div class="block input" style="width: 2em;"><input class="wb-prop-fill" type="color" value="#ffff33" wicket:message="title:427"/></div>
- <div class="block but"><button class="wb-prop-lock-fill" wicket:message="title:428"> </button></div>
- <div class="block input"><input class="wb-prop-opacity" type="number" min="1" max="100" value="100" wicket:message="title:553"/></div>
- <div class="block but"><button class="wb-prop-b" wicket:message="title:87">B</button></div>
- </div>
+ <div class="prop-row">
+ <div class="block lbl" wicket:message="title:548"><wicket:message key="547"/></div>
+ <div class="block input"><input class="wb-dim-y" type="text" maxlength="4" readonly="readonly"/></div>
+ <div class="block lbl" wicket:message="title:552"><wicket:message key="551"/></div>
+ <div class="block input"><input class="wb-dim-h" type="text" maxlength="4" readonly="readonly"/></div>
+ <div class="block input" style="width: 2em;"><input class="wb-prop-fill" type="color" value="#ffff33" wicket:message="title:427"/></div>
+ <div class="block but"><button class="wb-prop-lock-fill" wicket:message="title:428"> </button></div>
+ <div class="block input"><input class="wb-prop-opacity" type="number" min="1" max="100" value="100" wicket:message="title:553"/></div>
+ <div class="block but"><button class="wb-prop-b" wicket:message="title:87">B</button></div>
</div>
</div>
</div>
Modified: openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.java
URL: http://svn.apache.org/viewvc/openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.java?rev=1789878&r1=1789877&r2=1789878&view=diff
==============================================================================
--- openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.java (original)
+++ openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.java Sun Apr 2 12:24:13 2017
@@ -272,7 +272,7 @@ public class WbPanel extends Panel {
public WbPanel update(IPartialPageRequestHandler handler) {
readOnly = !rp.getClient().hasRight(Right.whiteBoard);
if (handler != null) {
- handler.appendJavaScript("setRoomSizes();");
+ handler.appendJavaScript(String.format("setRoomSizes();WbArea.setReadOnly(%s);", readOnly));
}
return this;
}
Modified: openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js
URL: http://svn.apache.org/viewvc/openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js?rev=1789878&r1=1789877&r2=1789878&view=diff
==============================================================================
--- openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js (original)
+++ openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js Sun Apr 2 12:24:13 2017
@@ -484,10 +484,10 @@ var Wb = function() {
const ACTIVE = 'active';
const BUMPER = 100;
var wb = {id: -1}, a, t, s, canvases = [], mode, slide = 0, width = 0, height = 0
- , minWidth = 0, minHeight = 0;
+ , minWidth = 0, minHeight = 0, readOnly = null;
function getBtn(m) {
- return t.find(".om-icon." + (m || mode));
+ return !!t ? t.find(".om-icon." + (m || mode)) : null;
}
function initToolBtn(m, def, obj) {
var btn = getBtn(m);
@@ -530,7 +530,7 @@ var Wb = function() {
initToolBtn(cur.data('mode'), false, Clipart(wb, cur));
});
}
- function internalInit(t) {
+ function internalInit() {
t.draggable({
snap: "parent"
, containment: "parent"
@@ -544,88 +544,92 @@ var Wb = function() {
}
}
});
- initToolBtn('pointer', true, Pointer(wb, s));
- initToolBtn('apointer', false, APointer(wb));
- initToolBtn('text', false, Text(wb, s));
- initToolBtn('paint', false, Paint(wb, s));
- initToolBtn('line', false, Line(wb, s));
- initToolBtn('uline', false, ULine(wb, s));
- initToolBtn('rect', false, Rect(wb, s));
- initToolBtn('ellipse', false, Ellipse(wb, s));
- initToolBtn('arrow', false, Arrow(wb, s));
- initCliparts();
- t.find(".om-icon.settings").click(function() {
- s.show();
- });
- s.find('.wb-prop-b, .wb-prop-i')
- .button()
- .click(function() {
- $(this).toggleClass('ui-state-active selected');
- });
- s.find('.wb-prop-lock-color, .wb-prop-lock-fill')
- .button({icon: 'ui-icon-locked', showLabel: false})
- .click(function() {
- var btn = getBtn();
- var isColor = $(this).hasClass('wb-prop-lock-color');
- var c = s.find(isColor ? '.wb-prop-color' : '.wb-prop-fill');
- var enabled = $(this).button('option', 'icon') == 'ui-icon-locked';
- $(this).button('option', 'icon', enabled ? 'ui-icon-unlocked' : 'ui-icon-locked');
- c.prop('disabled', !enabled);
- btn.data('obj')[isColor ? 'stroke' : 'fill'].enabled = enabled;
+ if (readOnly) {
+ initToolBtn('apointer', true, APointer(wb));
+ } else {
+ initToolBtn('pointer', true, Pointer(wb, s));
+ initToolBtn('apointer', false, APointer(wb));
+ initToolBtn('text', false, Text(wb, s));
+ initToolBtn('paint', false, Paint(wb, s));
+ initToolBtn('line', false, Line(wb, s));
+ initToolBtn('uline', false, ULine(wb, s));
+ initToolBtn('rect', false, Rect(wb, s));
+ initToolBtn('ellipse', false, Ellipse(wb, s));
+ initToolBtn('arrow', false, Arrow(wb, s));
+ initCliparts();
+ t.find(".om-icon.settings").click(function() {
+ s.show();
});
- s.find('.wb-prop-color').change(function() {
- var btn = getBtn();
- if (btn.length == 1) {
- var v = $(this).val();
- btn.data('obj').stroke.color = v;
- if ('paint' == mode) {
- wb.eachCanvas(function(canvas) {
- canvas.freeDrawingBrush.color = v;
- });
+ s.find('.wb-prop-b, .wb-prop-i')
+ .button()
+ .click(function() {
+ $(this).toggleClass('ui-state-active selected');
+ });
+ s.find('.wb-prop-lock-color, .wb-prop-lock-fill')
+ .button({icon: 'ui-icon-locked', showLabel: false})
+ .click(function() {
+ var btn = getBtn();
+ var isColor = $(this).hasClass('wb-prop-lock-color');
+ var c = s.find(isColor ? '.wb-prop-color' : '.wb-prop-fill');
+ var enabled = $(this).button('option', 'icon') == 'ui-icon-locked';
+ $(this).button('option', 'icon', enabled ? 'ui-icon-unlocked' : 'ui-icon-locked');
+ c.prop('disabled', !enabled);
+ btn.data('obj')[isColor ? 'stroke' : 'fill'].enabled = enabled;
+ });
+ s.find('.wb-prop-color').change(function() {
+ var btn = getBtn();
+ if (btn.length == 1) {
+ var v = $(this).val();
+ btn.data('obj').stroke.color = v;
+ if ('paint' == mode) {
+ wb.eachCanvas(function(canvas) {
+ canvas.freeDrawingBrush.color = v;
+ });
+ }
}
- }
- });
- s.find('.wb-prop-width').change(function() {
- var btn = getBtn();
- if (btn.length == 1) {
- var v = 1 * $(this).val();
- btn.data('obj').stroke.width = v;
- if ('paint' == mode) {
- wb.eachCanvas(function(canvas) {
- canvas.freeDrawingBrush.width = v;
- });
+ });
+ s.find('.wb-prop-width').change(function() {
+ var btn = getBtn();
+ if (btn.length == 1) {
+ var v = 1 * $(this).val();
+ btn.data('obj').stroke.width = v;
+ if ('paint' == mode) {
+ wb.eachCanvas(function(canvas) {
+ canvas.freeDrawingBrush.width = v;
+ });
+ }
}
- }
- });
- s.find('.wb-prop-opacity').change(function() {
- var btn = getBtn();
- if (btn.length == 1) {
- var v = (1 * $(this).val()) / 100;
- btn.data('obj').opacity = v;
- if ('paint' == mode) {
- wb.eachCanvas(function(canvas) {
- canvas.freeDrawingBrush.opacity = v;
- });
+ });
+ s.find('.wb-prop-opacity').change(function() {
+ var btn = getBtn();
+ if (btn.length == 1) {
+ var v = (1 * $(this).val()) / 100;
+ btn.data('obj').opacity = v;
+ if ('paint' == mode) {
+ wb.eachCanvas(function(canvas) {
+ canvas.freeDrawingBrush.opacity = v;
+ });
+ }
}
- }
- });
- s.find('.ui-dialog-titlebar-close').click(function() {
- s.hide();
- });
- s.draggable({
- scroll: false
- , containment: "body"
- , start: function(event, ui) {
- if (!!s.css("bottom")) {
- s.css("bottom", "").css("right", "");
+ });
+ s.find('.ui-dialog-titlebar-close').click(function() {
+ s.hide();
+ });
+ s.draggable({
+ scroll: false
+ , containment: "body"
+ , start: function(event, ui) {
+ if (!!s.css("bottom")) {
+ s.css("bottom", "").css("right", "");
+ }
}
- }
- , drag: function(event, ui) {
- if (s.position().x + s.width() >= s.parent().width()) {
- return false;
+ , drag: function(event, ui) {
+ if (s.position().x + s.width() >= s.parent().width()) {
+ return false;
+ }
}
- }
- });
+ });
+ }
}
function _findObject(o) {
var _o = {};
@@ -756,6 +760,34 @@ var Wb = function() {
o.path.slide = this.slide;
wbObjCreatedHandler(o.path);
};
+ function scrollHandler(e) {
+ $(this).find('.canvas-container').each(function(idx) {
+ var h = $(this).height(), pos = $(this).position();
+ if (slide != idx &&pos.top > BUMPER - h && pos.top < BUMPER) {
+ //TODO FIXME might be done without iterating
+ //console.log("Found:", idx);
+ slide = idx;
+ wbAction('setSlide', JSON.stringify({
+ wbId: wb.id
+ , slide: idx
+ }));
+ return false;
+ }
+ });
+ }
+ function showCurentSlide() {
+ a.find('.scroll-container .canvas-container').each(function(idx) {
+ if (readOnly) {
+ if (idx == slide) {
+ $(this).show();
+ } else {
+ $(this).hide();
+ }
+ } else {
+ $(this).show();
+ }
+ });
+ }
/*TODO interactive text chage
var textEditedHandler = function (e) {
var obj = e.target;
@@ -766,45 +798,75 @@ var Wb = function() {
console.log('Text Changed', obj);
};*/
function addCanvas() {
- var slide = canvases.length;
- var c = $('<canvas></canvas>').attr('id', 'can-' + a.attr('id') + '-slide-' + slide);
+ var sl = canvases.length;
+ var cid = 'can-' + a.attr('id') + '-slide-' + sl;
+ var c = $('<canvas></canvas>').attr('id', cid);
a.find('.canvases').append(c);
var canvas = new fabric.Canvas(c.attr('id'));
canvas.wbId = wb.id;
- canvas.slide = slide;
- //TODO create via WS canvas:cleared
- canvas.on({
- 'object:added': objAddedHandler
- , 'object:modified': objModifiedHandler
- , 'object:selected': objSelectedHandler
- , 'path:created': pathCreatedHandler
- //, 'text:editing:exited': textEditedHandler
- //, 'text:changed': textChangedHandler
- , 'wb:object:created': wbObjCreatedHandler
- });
+ canvas.slide = sl;
canvases.push(canvas);
+ //TODO create via WS canvas:cleared
+ if (readOnly) {
+ canvas.off({
+ 'object:added': objAddedHandler
+ , 'object:modified': objModifiedHandler
+ , 'object:selected': objSelectedHandler
+ , 'path:created': pathCreatedHandler
+ //, 'text:editing:exited': textEditedHandler
+ //, 'text:changed': textChangedHandler
+ , 'wb:object:created': wbObjCreatedHandler
+ });
+ } else {
+ canvas.on({
+ 'object:added': objAddedHandler
+ , 'object:modified': objModifiedHandler
+ , 'object:selected': objSelectedHandler
+ , 'path:created': pathCreatedHandler
+ //, 'text:editing:exited': textEditedHandler
+ //, 'text:changed': textChangedHandler
+ , 'wb:object:created': wbObjCreatedHandler
+ });
+ }
+ var cc = $('#' + cid).closest('.canvas-container');
+ if (readOnly) {
+ if (sl == slide) {
+ cc.show();
+ } else {
+ cc.hide();
+ }
+ }
}
- wb.init = function(_wbId, tid) {
+ wb.setReadOnly = function(ro) {
+ if (readOnly != ro) {
+ var btn = getBtn();
+ if (!!btn && btn.length == 1) {
+ btn.data().deactivate();
+ }
+ a.find('.tools').remove();
+ a.find('.wb-settings').remove();
+ readOnly = ro;
+ var sc = a.find('.scroll-container');
+ if (readOnly) {
+ t = $('#wb-tools-readonly').clone().attr('id', '');
+ a.append(t);
+ sc.off('scroll', scrollHandler);
+ } else {
+ t = $('#wb-tools').clone().attr('id', '');
+ s = $("#wb-settings").clone().attr('id', '');
+ a.append(t).append(s);
+ sc.on('scroll', scrollHandler);
+ }
+ showCurentSlide();
+ t = a.find('.tools'), s = a.find(".wb-settings");
+ internalInit();
+ }
+ };
+ wb.init = function(_wbId, tid, ro) {
wb.id = _wbId;
a = $('#' + tid);
- t = a.find('.tools'), s = a.find(".wb-settings");
+ wb.setReadOnly(ro);
addCanvas();
- internalInit(t);
- a.find('.scroll-container').on('scroll', function(e) {
- $(this).find('.canvas-container').each(function(idx) {
- var h = $(this).height(), pos = $(this).position();
- if (slide != idx &&pos.top > BUMPER - h && pos.top < BUMPER) {
- //TODO FIXME might be done without iterating
- //console.log("Found:", idx);
- slide = idx;
- wbAction('setSlide', JSON.stringify({
- wbId: wb.id
- , slide: idx
- }));
- return false;
- }
- });
- });
};
wb.resize = function(w, h) {
if (t.position().left + t.width() > a.width()) {
@@ -826,7 +888,11 @@ var Wb = function() {
};
wb.setSlide = function(_sl) {
slide = _sl;
- a.find('.scroll-container .canvas-container')[slide].scrollIntoView();
+ if (readOnly) {
+ showCurentSlide();
+ } else {
+ a.find('.scroll-container .canvas-container')[slide].scrollIntoView();
+ }
};
wb.createObj = function(o) {
switch(o.type) {
@@ -882,7 +948,7 @@ var Wb = function() {
return wb;
};
var WbArea = (function() {
- var container, area, tabs, scroll, self = {};
+ var container, area, tabs, scroll, readOnly = true, self = {};
function refreshTabs() {
tabs.tabs("refresh").find('ul').removeClass('ui-corner-all').removeClass('ui-widget-header');
@@ -961,31 +1027,61 @@ var WbArea = (function() {
self.getCanvas = function(id) {
return self.getWb(id).getCanvas();
};
+ self.setReadOnly = function(ro) {
+ readOnly = ro;
+ tabs.find(".ui-tabs-nav").sortable(readOnly ? "disable" : "enable");
+ var prev = tabs.find('.prev.om-icon'), next = tabs.find('.next.om-icon');
+ if (readOnly) {
+ if (prev.length > 0) {
+ prev.parent().remove();
+ next.parent().remove();
+ }
+ $(window).off('keyup', deleteHandler);
+ } else {
+ if (prev.length == 0) {
+ var cc = tabs.find('.wb-tabbar .scroll-container')
+ , left = $('#wb-tabbar-ctrls-left').clone().attr('id', '')
+ , right = $('#wb-tabbar-ctrls-right').clone().attr('id', '');
+ cc.before(left).after(right);
+ tabs.find('.add.om-icon').click(function() {
+ wbAction('createWb');
+ });
+ tabs.find('.prev.om-icon').click(function() {
+ scroll.scrollLeft(scroll.scrollLeft() - 30);
+ });
+ tabs.find('.next.om-icon').click(function() {
+ scroll.scrollLeft(scroll.scrollLeft() + 30);
+ });
+ $(window).keyup(deleteHandler);
+ }
+ }
+ tabs.find(".ui-tabs-panel").each(function(idx) {
+ $(this).data().setReadOnly(readOnly);
+ });
+ }
self.init = function() {
container = $(".room.wb.area");
tabs = container.find('.tabs').tabs({
- activate: function(event, ui) {
+ beforeActivate: function(e, ui) {
+ var res = true;
+ if (e.originalEvent && e.originalEvent.type === 'click') {
+ res = !readOnly;
+ }
+ return res;
+ }
+ , activate: function(e, ui) {
wbAction('activeWb', JSON.stringify({id: ui.newTab.data('wb-id')}));
}
});
scroll = tabs.find('.scroll-container');
+ area = container.find(".wb-area");
tabs.find(".ui-tabs-nav").sortable({
axis: "x"
, stop: function() {
refreshTabs();
}
});
- tabs.find('.add.om-icon').click(function() {
- wbAction('createWb');
- });
- tabs.find('.prev.om-icon').click(function() {
- scroll.scrollLeft(scroll.scrollLeft() - 30);
- });
- tabs.find('.next.om-icon').click(function() {
- scroll.scrollLeft(scroll.scrollLeft() + 30);
- });
- area = container.find(".wb-area");
- $(window).keyup(deleteHandler);
+ self.setReadOnly(readOnly);
};
self.destroy = function() {
$(window).off('keyup', deleteHandler);
@@ -995,9 +1091,12 @@ var WbArea = (function() {
, li = $('#wb-area-tab').clone().attr('id', '').data('wb-id', obj.id)
, wb = $('#wb-area').clone().attr('id', tid);
li.find('a').text(obj.name).attr('title', obj.name).attr('href', "#" + tid);
- li.find('button').click(function() {
- wbAction('removeWb', JSON.stringify({id: obj.id}));
- });
+ if (!readOnly) {
+ li.append($('#wb-tab-close').clone().attr('id', ''));
+ li.find('button').click(function() {
+ wbAction('removeWb', JSON.stringify({id: obj.id}));
+ });
+ }
tabs.find(".ui-tabs-nav").append(li);
tabs.append(wb);
@@ -1005,7 +1104,7 @@ var WbArea = (function() {
var wbo = Wb();
wb.data(wbo);
- wbo.init(obj.id, tid);
+ wbo.init(obj.id, tid, readOnly);
_resizeWbs();
}
self.add = function(obj) {
Modified: openmeetings/application/trunk/openmeetings-web/src/main/webapp/css/room.css
URL: http://svn.apache.org/viewvc/openmeetings/application/trunk/openmeetings-web/src/main/webapp/css/room.css?rev=1789878&r1=1789877&r2=1789878&view=diff
==============================================================================
--- openmeetings/application/trunk/openmeetings-web/src/main/webapp/css/room.css (original)
+++ openmeetings/application/trunk/openmeetings-web/src/main/webapp/css/room.css Sun Apr 2 12:24:13 2017
@@ -139,10 +139,18 @@
width: 38px;
height: 420px;
}
+.room.wb.area .tools.readonly.vertical {
+ width: 38px;
+ height: 60px;
+}
.room.wb.area .tools.horisontal {
width: 420px;
height: 38px;
}
+.room.wb.area .tools.readonly.horisontal {
+ width: 60px;
+ height: 38px;
+}
.room.wb.area .tools .om-icon.big {
float: left;
vertical-align: top;