src/cm/media/js/client/c_addcomment_form.js
changeset 341 053551f213fb
parent 0 40c8f766c9b8
child 382 a3eaeeed9c6e
equal deleted inserted replaced
340:9e2b9e568e42 341:053551f213fb
     1 gICommentForm = null ;
     1 gICommentForm = null ;
     2 
     2 
     3 instanciateICommentForm = function() {
     3 instanciateICommentForm = function() {
     4 	gICommentForm = {
     4   gICommentForm = {
     5 			'position':[CY.WidgetPositionExt.LC, CY.WidgetPositionExt.LC],
     5       'position':[CY.WidgetPositionExt.LC, CY.WidgetPositionExt.LC],
     6 			'formId':CY.guid(),
     6       'formId':CY.guid(),
     7 			'formTitleId':CY.guid(),
     7       'formTitleId':CY.guid(),
     8 			'titleInputId':CY.guid(),
     8       'titleInputId':CY.guid(),
     9 			'contentInputId':CY.guid(),
     9       'contentInputId':CY.guid(),
    10 			'tagsInputId':CY.guid(),
    10       'tagsInputId':CY.guid(),
    11 			'formatInputId':CY.guid(),
    11       'formatInputId':CY.guid(),
    12 			'startWrapperInputId':CY.guid(),
    12       'startWrapperInputId':CY.guid(),
    13 			'endWrapperInputId':CY.guid(),
    13       'endWrapperInputId':CY.guid(),
    14 			'startOffsetInputId':CY.guid(),
    14       'startOffsetInputId':CY.guid(),
    15 			'endOffsetInputId':CY.guid(),
    15       'endOffsetInputId':CY.guid(),
    16 			'selectionPlaceId':CY.guid(),
    16       'selectionPlaceId':CY.guid(),
    17 			'keyId':CY.guid(),
    17       'keyId':CY.guid(),
    18 			'currentSelId':CY.guid(),
    18       'currentSelId':CY.guid(),
    19 			'currentSelIdI':CY.guid(),
    19       'currentSelIdI':CY.guid(),
    20 			'addBtnId':CY.guid(),
    20       'addBtnId':CY.guid(),
    21 			'cancelBtnId':CY.guid(),
    21       'cancelBtnId':CY.guid(),
    22 			'closeBtnId':CY.guid()
    22       'closeBtnId':CY.guid()
    23 	} ;
    23   } ;
    24 	
    24   
    25 	if (!sv_loggedIn) {
    25   if (!sv_loggedIn) {
    26 		gICommentForm ['nameInputId'] = CY.guid() ;
    26     gICommentForm ['nameInputId'] = CY.guid() ;
    27 		gICommentForm ['emailInputId'] = CY.guid() ;
    27     gICommentForm ['emailInputId'] = CY.guid() ;
    28 	}
    28   }
    29 	
    29   
    30 	var overlayHtml = getHtml(gICommentForm) ;
    30   var overlayHtml = getHtml(gICommentForm) ;
    31 	
    31   
    32 	var width = gLayout.getTopICommentsWidth() ;
    32   var width = gLayout.getTopICommentsWidth() ;
    33 	
    33   
    34 	var overlay = new CY.Overlay( {
    34   var overlay = new CY.Overlay( {
    35 		zIndex :3,
    35     zIndex :3,
    36 		shim :false, // until we really need it, no shim 
    36     shim :false, // until we really need it, no shim 
    37 		visible :false,
    37     visible :false,
    38 		headerContent :overlayHtml['headerContent'],
    38     headerContent :overlayHtml['headerContent'],
    39 		bodyContent :overlayHtml['bodyContent'],
    39     bodyContent :overlayHtml['bodyContent'],
    40 		xy :[10,10],
    40     xy :[10,10],
    41 		width : width
    41     width : width
    42 	});
    42   });
    43 	overlay.get('contentBox').addClass("c-newcomment") ;
    43   overlay.get('contentBox').addClass("c-newcomment") ;
    44 	
    44   
    45 	// attach to DOM
    45   // attach to DOM
    46 	overlay.render('#leftcolumn');
    46   overlay.render('#leftcolumn');
    47 	
    47   
    48 	if (!sv_loggedIn) {
    48   if (!sv_loggedIn) {
    49 		CY.get("#"+gICommentForm['nameInputId']).set('value',gPrefs.get("user","name")) ;
    49     CY.get("#"+gICommentForm['nameInputId']).set('value',gPrefs.get("user","name")) ;
    50 		CY.get("#"+gICommentForm['emailInputId']).set('value',gPrefs.get("user","email")) ;
    50     CY.get("#"+gICommentForm['emailInputId']).set('value',gPrefs.get("user","email")) ;
    51 	}
    51   }
    52 		
    52     
    53 	CY.get("#"+gICommentForm['formTitleId']).set('innerHTML', gettext('New comment')) ;
    53   CY.get("#"+gICommentForm['formTitleId']).set('innerHTML', gettext('New comment')) ;
    54 	CY.get("#"+gICommentForm['formatInputId']).set('value',gConf['defaultCommentFormat']) ;
    54   CY.get("#"+gICommentForm['formatInputId']).set('value',gConf['defaultCommentFormat']) ;
    55 	
    55   
    56 	CY.on("click", onSubmitICommentFormClick, "#"+gICommentForm['addBtnId']);
    56   CY.on("click", onSubmitICommentFormClick, "#"+gICommentForm['addBtnId']);
    57 	CY.on("click", onCancelICommentFormClick, "#"+gICommentForm['cancelBtnId']);
    57   CY.on("click", onCancelICommentFormClick, "#"+gICommentForm['cancelBtnId']);
    58 	CY.on("click", onCancelICommentFormClick, "#"+gICommentForm['closeBtnId']);
    58   CY.on("click", onCancelICommentFormClick, "#"+gICommentForm['closeBtnId']);
    59 	
    59   
    60 	gICommentForm['overlay'] = overlay ;
    60   gICommentForm['overlay'] = overlay ;
    61 	
    61   
    62 	var animationHide = null ;
    62   var animationHide = null ;
    63 	animationHide = new CY.Anim({
    63   animationHide = new CY.Anim({
    64         node: overlay.get('boundingBox'),
    64         node: overlay.get('boundingBox'),
    65         duration: .3, //gPrefs['general']['animduration'],
    65         duration: .3, //gPrefs['general']['animduration'],
    66         easing: CY.Easing.easeOut
    66         easing: CY.Easing.easeOut
    67     });		
    67     });   
    68 	gICommentForm['animationHide'] = animationHide ; 
    68   gICommentForm['animationHide'] = animationHide ; 
    69 	animationHide.set('to', { opacity: 0});// height : 0 doesn't work
    69   animationHide.set('to', { opacity: 0});// height : 0 doesn't work
    70 	gICommentForm['animationHide-handle'] = animationHide.on('end', onICommentFormHideAnimEnd, gICommentForm);
    70   gICommentForm['animationHide-handle'] = animationHide.on('end', onICommentFormHideAnimEnd, gICommentForm);
    71 
    71 
    72 	var animationShow = null ;
    72   var animationShow = null ;
    73 	animationShow = new CY.Anim({
    73   animationShow = new CY.Anim({
    74         node: overlay.get('boundingBox'),
    74         node: overlay.get('boundingBox'),
    75         duration: .3, //gPrefs['general']['animduration'],
    75         duration: .3, //gPrefs['general']['animduration'],
    76         easing: CY.Easing.easeOut
    76         easing: CY.Easing.easeOut
    77     });		
    77     });   
    78 	gICommentForm['animationShow'] = animationShow ; 
    78   gICommentForm['animationShow'] = animationShow ; 
    79 	animationShow.set('to', { opacity: 1});
    79   animationShow.set('to', { opacity: 1});
    80 	gICommentForm['animationShow-handle'] = animationShow.on('end', onICommentFormShowAnimEnd, gICommentForm);
    80   gICommentForm['animationShow-handle'] = animationShow.on('end', onICommentFormShowAnimEnd, gICommentForm);
    81 	
    81   
    82 	changeFormFieldsWidth(gICommentForm['formId'], width) ;
    82   changeFormFieldsWidth(gICommentForm['formId'], width) ;
    83 }
    83 }
    84 
    84 
    85 cleanICommentForm = function() {
    85 cleanICommentForm = function() {
    86 	CY.get("#"+gICommentForm['currentSelIdI']).set('innerHTML', gNoSelectionYet) ;
    86   CY.get("#"+gICommentForm['currentSelIdI']).set('innerHTML', gNoSelectionYet) ;
    87 
    87 
    88     var hostNode = gICommentForm['overlay'].getStdModNode(CY.WidgetStdMod.BODY) ;
    88     var hostNode = gICommentForm['overlay'].getStdModNode(CY.WidgetStdMod.BODY) ;
    89     hostNode.queryAll(".comment_input").set('value', "") ;
    89     hostNode.queryAll(".comment_input").set('value', "") ;
    90 	
    90   
    91 	CY.get("#"+gICommentForm['formatInputId']).set('value',gConf['defaultCommentFormat']) ;// for now ...
    91   CY.get("#"+gICommentForm['formatInputId']).set('value',gConf['defaultCommentFormat']) ;// for now ...
    92 	
    92   
    93 	if (!sv_loggedIn) {
    93   if (!sv_loggedIn) {
    94 		hostNode.queryAll(".user_input").set('value', "") ;
    94     hostNode.queryAll(".user_input").set('value', "") ;
    95 	}
    95   }
    96 }
    96 }
    97 
    97 
    98 onICommentFormHideAnimEnd = function() {
    98 onICommentFormHideAnimEnd = function() {
    99 //	iComment['overlay'].blur() ;
    99 //  iComment['overlay'].blur() ;
   100 	this.overlay.hide() ;
   100   this.overlay.hide() ;
   101 	gSync.resume() ; 		
   101   gSync.resume() ;    
   102 }
   102 }
   103 
   103 
   104 onICommentFormShowAnimEnd = function() {
   104 onICommentFormShowAnimEnd = function() {
   105 	gSync.resume() ; 		
   105   gSync.resume() ;    
   106 }
   106 }
   107 
   107 
   108 onSubmitICommentFormClick = function() {
   108 onSubmitICommentFormClick = function() {
   109 	if (!sv_loggedIn) {
   109   if (!sv_loggedIn) {
   110 		var name = CY.get("#"+gICommentForm['nameInputId']).get('value') ;
   110     var name = CY.get("#"+gICommentForm['nameInputId']).get('value') ;
   111 		gPrefs.persist("user", "name", name) ;	
   111     gPrefs.persist("user", "name", name) ;  
   112 	
   112   
   113 		var email = CY.get("#"+gICommentForm['emailInputId']).get('value') ;
   113     var email = CY.get("#"+gICommentForm['emailInputId']).get('value') ;
   114 		gPrefs.persist("user", "email", email) ;
   114     gPrefs.persist("user", "email", email) ;
   115 	}
   115   }
   116 	gSync.saveComment(gICommentForm['formId']) ;
   116   gSync.saveComment(gICommentForm['formId']) ;
   117 }
   117 }
   118 
   118 
   119 onCancelICommentFormClick = function() {
   119 onCancelICommentFormClick = function() {
   120 	gSync.cancelICommentForm() ;
   120   gSync.cancelICommentForm() ;
   121 }
   121 }
   122 
   122 
   123 // record selection info in hidden form fields
   123 // record selection info in hidden form fields
   124 _updateICommentFormSelection = function(ids, displayedText, csStartSelection, csEndSelection) {
   124 _updateICommentFormSelection = function(ids, displayedText, csStartSelection, csEndSelection) {
   125 	var node = CY.Node.get('#'+ids['currentSelIdI']) ;
   125   var node = CY.Node.get('#'+ids['currentSelIdI']) ;
   126 	if (node != null)
   126   if (node != null)
   127 		node.set('innerHTML', displayedText) ;
   127     node.set('innerHTML', displayedText) ;
   128 	
   128   
   129     node = CY.get('#'+ids['startWrapperInputId']) ;
   129     node = CY.get('#'+ids['startWrapperInputId']) ;
   130 	if (node != null)
   130   if (node != null)
   131 		node.set('value', csStartSelection['elt'].id.substring("sv_".length)) ;
   131     node.set('value', csStartSelection['elt'].id.substring("sv_".length)) ;
   132     node = CY.get('#'+ids['startOffsetInputId']) ;
   132     node = CY.get('#'+ids['startOffsetInputId']) ;
   133 	if (node != null)
   133   if (node != null)
   134 		node.set('value', csStartSelection['offset']) ;
   134     node.set('value', csStartSelection['offset']) ;
   135     node = CY.get('#'+ids['endWrapperInputId']) ;
   135     node = CY.get('#'+ids['endWrapperInputId']) ;
   136 	if (node != null)
   136   if (node != null)
   137 		node.set('value', csEndSelection['elt'].id.substring("sv_".length)) ;
   137     node.set('value', csEndSelection['elt'].id.substring("sv_".length)) ;
   138     node = CY.get('#'+ids['endOffsetInputId']) ;
   138     node = CY.get('#'+ids['endOffsetInputId']) ;
   139 	if (node != null)
   139   if (node != null)
   140 		node.set('value', csEndSelection['offset']) ;
   140     node.set('value', csEndSelection['offset']) ;
   141 }
   141 }
   142 
   142 
   143 updateICommentFormSelection = function(selection) {
   143 updateICommentFormSelection = function(selection) {
   144 	var text = (selection == null) ? "" : selection['text'] ;
   144   var text = (selection == null) ? "" : selection['text'] ;
   145 	if (text != "") {
   145   if (text != "") {
   146 		// display text to be commented 
   146     // display text to be commented 
   147 		var displayedText = text ; 
   147     var displayedText = text ; 
   148 		var maxLength = 100 ; // even number only
   148     var maxLength = 100 ; // even number only
   149 		if (text.length > maxLength ) {
   149     if (text.length > maxLength ) {
   150 			var start = text.substring(0, (text.substring(0, maxLength/2)).lastIndexOf(" ")) ;
   150       var start = text.substring(0, (text.substring(0, maxLength/2)).lastIndexOf(" ")) ;
   151 			var endPart = text.substring(text.length - maxLength/2) ;
   151       var endPart = text.substring(text.length - maxLength/2) ;
   152 			var end = endPart.substring(endPart.indexOf(" ")) ;
   152       var end = endPart.substring(endPart.indexOf(" ")) ;
   153 			displayedText = start + " ... " + end ;
   153       displayedText = start + " ... " + end ;
   154 		}
   154     }
   155         var csStartSelection = _convertSelectionFromCCToCS(selection['start']) ;
   155         var csStartSelection = _convertSelectionFromCCToCS(selection['start']) ;
   156         var csEndSelection = _convertSelectionFromCCToCS(selection['end']) ;
   156         var csEndSelection = _convertSelectionFromCCToCS(selection['end']) ;
   157 
   157 
   158         _updateICommentFormSelection(gICommentForm, displayedText, csStartSelection, csEndSelection);
   158         _updateICommentFormSelection(gICommentForm, displayedText, csStartSelection, csEndSelection);
   159         if (gEdit != null)
   159         if (gEdit != null)
   160         	_updateICommentFormSelection(gEdit['ids'], displayedText, csStartSelection, csEndSelection);
   160           _updateICommentFormSelection(gEdit['ids'], displayedText, csStartSelection, csEndSelection);
   161     	positionICommentForm() ;
   161       positionICommentForm() ;
   162 	}
   162   }
   163 }
   163 }
   164 
   164 
   165 showICommentForm= function () {
   165 showICommentForm= function () {
   166 	removeFormErrMsg(gICommentForm['formId']) ;
   166   removeFormErrMsg(gICommentForm['formId']) ;
   167 	if (!sv_loggedIn) {
   167   if (!sv_loggedIn) {
   168 		if (CY.get("#"+gICommentForm['nameInputId']).get('value') == '') 
   168     if (CY.get("#"+gICommentForm['nameInputId']).get('value') == '') 
   169 			CY.get("#"+gICommentForm['nameInputId']).set('value', gPrefs.get('user','name')) ;
   169       CY.get("#"+gICommentForm['nameInputId']).set('value', gPrefs.get('user','name')) ;
   170 		if (CY.get("#"+gICommentForm['emailInputId']).get('value') == '') 
   170     if (CY.get("#"+gICommentForm['emailInputId']).get('value') == '') 
   171 			CY.get("#"+gICommentForm['emailInputId']).set('value', gPrefs.get('user','email')) ;
   171       CY.get("#"+gICommentForm['emailInputId']).set('value', gPrefs.get('user','email')) ;
   172 	}
   172   }
   173 	gIComments.hide() ;
   173   gIComments.hide() ;
   174 	positionICommentForm() ;
   174   positionICommentForm() ;
   175 	gICommentForm['overlay'].show() ;
   175   gICommentForm['overlay'].show() ;
   176 	CY.get("#"+gICommentForm['titleInputId']).focus() ;
   176   CY.get("#"+gICommentForm['titleInputId']).focus() ;
   177 }
   177 }
   178 
   178 
   179 isICommentFormVisible = function () {
   179 isICommentFormVisible = function () {
   180 	if (gICommentForm != null)
   180   if (gICommentForm != null)
   181 		return gICommentForm['overlay'].get('visible') ;
   181     return gICommentForm['overlay'].get('visible') ;
   182 	return false ;
   182   return false ;
   183 }
   183 }
   184 
   184 
   185 positionICommentForm = function () {
   185 positionICommentForm = function () {
   186 	if (gICommentForm != null) { 
   186   if (gICommentForm != null) { 
   187 		var overlay = gICommentForm['overlay'] ;
   187     var overlay = gICommentForm['overlay'] ;
   188 		var boundingBox = overlay.get('boundingBox') ;
   188     var boundingBox = overlay.get('boundingBox') ;
   189 
   189 
   190 		var commentFormHeight = boundingBox.get('offsetHeight') ;
   190     var commentFormHeight = boundingBox.get('offsetHeight') ;
   191 		var windowHeight = boundingBox.get('winHeight') ;
   191     var windowHeight = boundingBox.get('winHeight') ;
   192 
   192 
   193 		var pos = gICommentForm['position'] ;
   193     var pos = gICommentForm['position'] ;
   194 		if (commentFormHeight > windowHeight) // trying to have save comment visible ... :
   194     if (commentFormHeight > windowHeight) // trying to have save comment visible ... :
   195 			pos = [CY.WidgetPositionExt.BL, CY.WidgetPositionExt.BL] ;
   195       pos = [CY.WidgetPositionExt.BL, CY.WidgetPositionExt.BL] ;
   196 		
   196     
   197 		overlay.set("align", {points:pos});
   197     overlay.set("align", {points:pos});
   198 		boundingBox.setX(boundingBox.getX() + gConf['iCommentLeftPadding']);
   198     boundingBox.setX(boundingBox.getX() + gConf['iCommentLeftPadding']);
   199 	}
   199   }
   200 }
   200 }