|
@@ -0,0 +1,158 @@
|
|
|
|
+//特殊标识模块
|
|
|
|
+var specialTag = function(option, success) {
|
|
|
|
+ var object = new SpecialTag(option);
|
|
|
|
+ success();
|
|
|
|
+ return object;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+function SpecialTag(option) {
|
|
|
|
+ this.markControl = option.markControl;
|
|
|
|
+ this.maxWidth = option.width != undefined ? option.width : 200;
|
|
|
|
+ this.show = false;
|
|
|
|
+ this.tagName = undefined;
|
|
|
|
+ this.init();
|
|
|
|
+ this.markControl.on('task.get.before', this, function(event, context, eventObject) {
|
|
|
|
+ this.task = undefined;
|
|
|
|
+ this.reset();
|
|
|
|
+ });
|
|
|
|
+ this.markControl.on('task.get.success', this, function(event, context, eventObject) {
|
|
|
|
+ this.task = context.task;
|
|
|
|
+ if(this.task.tagList==undefined){
|
|
|
|
+ this.task.tagList=[];
|
|
|
|
+ }
|
|
|
|
+ this.markControl.trigger('special.tag.disable');
|
|
|
|
+ });
|
|
|
|
+ this.markControl.on('task.get.none', this, function(event, context, eventObject) {
|
|
|
|
+ this.task = undefined;
|
|
|
|
+ });
|
|
|
|
+ this.markControl.on('image.click.event', this, function(event, context, eventObject) {
|
|
|
|
+ if(this.task!=undefined && this.tagName!=undefined && this.show==true){
|
|
|
|
+ var specialTag = {
|
|
|
|
+ tagName : this.tagName,
|
|
|
|
+ positionX : eventObject.positionX,
|
|
|
|
+ positionY : eventObject.positionY
|
|
|
|
+ }
|
|
|
|
+ this.task.tagList.push(specialTag);
|
|
|
|
+ this.markControl.trigger('mark.tag.show', {
|
|
|
|
+ content: specialTag.tagName,
|
|
|
|
+ positionX: specialTag.positionX,
|
|
|
|
+ positionY: specialTag.positionY
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ //图片重新加载后,恢复显示所有标记
|
|
|
|
+ this.markControl.on('image.reload.event', this, function(event, context, eventObject) {
|
|
|
|
+ if(this.task != undefined){
|
|
|
|
+ for(var i = 0; i <this.task.tagList.length; i++) {
|
|
|
|
+ this.markControl.trigger('mark.tag.show', {
|
|
|
|
+ content: this.task.tagList[i].tagName,
|
|
|
|
+ positionX: this.task.tagList[i].positionX,
|
|
|
|
+ positionY: this.task.tagList[i].positionY
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.init = function() {
|
|
|
|
+ var self = this;
|
|
|
|
+ this.container = getDom(this.container_dom, this.markControl).appendTo(this.markControl.container);
|
|
|
|
+ this.container.width(this.maxWidth);
|
|
|
|
+ this.container.offset({
|
|
|
|
+ top: 100,
|
|
|
|
+ left: 800
|
|
|
|
+ });
|
|
|
|
+ this.container.header = getDom(this.container_header_dom, this.markControl).appendTo(this.container);
|
|
|
|
+ this.container.header.width('100%');
|
|
|
|
+
|
|
|
|
+ this.container.content = getDom(this.container_content_dom, this.markControl).appendTo(this.container);
|
|
|
|
+ this.container.content.width('100%');
|
|
|
|
+
|
|
|
|
+ this.onclickList = this.container.content.find('#problem-list');
|
|
|
|
+
|
|
|
|
+ this.container.draggable({
|
|
|
|
+ containment: "window"
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ this.onclickList.find('a').click(function () {
|
|
|
|
+ self.tagName = undefined;
|
|
|
|
+ if(self.task!=undefined){
|
|
|
|
+ if($(this).hasClass('selected')){
|
|
|
|
+ self.tagName = undefined;
|
|
|
|
+ $(this).removeClass('selected');
|
|
|
|
+ }else{
|
|
|
|
+ self.tagName = $(this).attr('value');
|
|
|
|
+ self.onclickList.find('a').removeClass('selected');
|
|
|
|
+ $(this).addClass('selected');
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ if(self.tagName != undefined){
|
|
|
|
+ self.markControl.trigger('special.tag.enable');
|
|
|
|
+ }else{
|
|
|
|
+ self.markControl.trigger('special.tag.disable');
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ });
|
|
|
|
+ this.container.find('#undo-button').click(function(){
|
|
|
|
+ if(self.task!=undefined){
|
|
|
|
+ self.task.tagList.pop();
|
|
|
|
+ self.markControl.trigger('mark.tag.clear');
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ this.container.find('#clear-button').click(function(){
|
|
|
|
+ if(self.task!=undefined){
|
|
|
|
+ self.task.tagList=[];
|
|
|
|
+ self.markControl.trigger('mark.tag.clear');
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ this.container.header.find('#close-button').click(function() {
|
|
|
|
+ self.toggle(false);
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ this.control = getDom(this.control_dom, this.markControl).appendTo(this.markControl.container.assistant);
|
|
|
|
+ this.control.find('#show-SpecialTag-button').click(function() {
|
|
|
|
+ self.markControl.container.assistant.hide();
|
|
|
|
+ self.toggle(true);
|
|
|
|
+ });
|
|
|
|
+ this.control.find('#hide-SpecialTag-button').click(function() {
|
|
|
|
+ self.markControl.container.assistant.hide();
|
|
|
|
+ self.toggle(false);
|
|
|
|
+ });
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.toggle = function(show) {
|
|
|
|
+ if (show == true) {
|
|
|
|
+ this.show = true;
|
|
|
|
+ this.container.show();
|
|
|
|
+ } else {
|
|
|
|
+ this.show = false;
|
|
|
|
+ this.markControl.trigger('special.tag.disable')
|
|
|
|
+ this.container.hide();
|
|
|
|
+ this.onclickList.find('a').removeClass('selected');
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.reset = function() {
|
|
|
|
+ this.tagName = $(this).attr('value');
|
|
|
|
+ this.onclickList.find('a').removeClass('selected');
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.container_dom = '<div class="score-board score-board-popover" style="display:none"></div>';
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.container_header_dom = '<div class="header" style="border-radius: 15px 15px 0px 0px;">\
|
|
|
|
+<p class="fl" id="header">特殊标记</p>\
|
|
|
|
+<a class="header-close" id="close-button" href="#"><img src="{staticServer}/images/close.png"></a>\
|
|
|
|
+</div>';
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.container_content_dom = '<div class="content popover-content" style="padding:4px;border-radius: 0px 0px 15px 15px;">\
|
|
|
|
+<p id="problem-list" class="popover-list buttonCss">\
|
|
|
|
+ <a href="#" value="√">√</a>\
|
|
|
|
+ <a href="#" value="X">×</a>\
|
|
|
|
+ <a href="#" value="乄">乄</a></p>\
|
|
|
|
+<p><a href="#" id="undo-button" style="margin-left: 20px;">回 退</a>\
|
|
|
|
+<a href="#" id="clear-button">全部清除</a></p></div>';
|
|
|
|
+
|
|
|
|
+SpecialTag.prototype.control_dom = '<h3 class="popover-title">特殊标记</h3>\
|
|
|
|
+<div class="popover-content"><p id="problem-list" class="popover-list">\
|
|
|
|
+<a href="#" id="show-SpecialTag-button">打开</a><a href="#" id="hide-SpecialTag-button">关闭</a>\
|
|
|
|
+</p></div>';
|