1 
  2 /**
  3  * @class Monk.component.ChunkViewerComponent
  4  * @description A {@link Worbench.component.Component} for viewing text chunks.
  5  * @extends Workbench.component.Component
  6  * @author Stéfan Sinclair
  7  * @version 0.1
  8  * @since Monk 0.1
  9  */
 10 Monk.component.ChunkViewerComponent = function(args) {
 11     
 12     // track the currently loaded chunk
 13     this.currentChunk = null;
 14     
 15     this.viewport = new Ext.Viewport({
 16         id: 'viewport',
 17         layout: 'fit',
 18         renderTo: 'component',
 19         items: {
 20             id: 'viewContainer',
 21             tbar: new Ext.Toolbar(),
 22             autoScroll: true,
 23             html: '<div id="view"></div>'
 24         }
 25     });
 26     
 27     this.chunkHistory = new Ext.data.SimpleStore({
 28         id: 0,
 29         fields: ['id', 'corpus', 'text', 'chunkType']
 30     });
 31     
 32     this.getChunk = function(record) {
 33         var text = record.get('text');
 34         this.notify(new Monk.event.chunk.ChunkSelected({
 35                 label: 'Text workpart selected: '+'"'+text+'"'
 36             }),{
 37                 id: record.get('id'),
 38                 corpus: record.get('corpus'),
 39                 text: text,
 40                 chunkType: record.get('chunkType')
 41         });
 42     }
 43     
 44     var tbar = Ext.getCmp('viewContainer').getTopToolbar();
 45     tbar.addSpacer();
 46     tbar.addDom('<div id="chunkLabel" class="bookIcon"> </div>');
 47     tbar.addFill();
 48     tbar.addButton({
 49         icon: 'page-prev.gif',
 50         tooltip: 'Previous',
 51         minWidth: 20,
 52         handler: function() {
 53             var index = this.chunkHistory.indexOfId(this.currentChunk.id);
 54             var prev = this.chunkHistory.getAt(index-1);
 55             if (prev) this.getChunk(prev);
 56         },
 57         scope: this
 58     });
 59     var combo = new Ext.form.ComboBox({
 60         id: 'chunkHistory',
 61         emptyText: 'History',
 62         displayField: 'text',
 63         valueField: 'id',
 64         store: this.chunkHistory,
 65         mode: 'local',
 66         triggerAction: 'all',
 67         listeners: {
 68             select: {fn: function(combo, record, index){
 69                 this.getChunk(record);
 70             }, scope: this}
 71         }
 72     });
 73     tbar.addField(combo);
 74     tbar.addButton({
 75         icon: 'page-next.gif',
 76         tooltip: 'Next',
 77         minWidth: 20,
 78         handler: function() {
 79             var index = this.chunkHistory.indexOfId(this.currentChunk.id);
 80             var next = this.chunkHistory.getAt(index+1);
 81             if (next) this.getChunk(next);
 82         },
 83         scope: this
 84     });
 85     tbar.addSpacer();
 86     
 87     Monk.component.ChunkViewerComponent.superclass.constructor.call(this, args);
 88 };
 89 
 90 Workbench.extend(Monk.component.ChunkViewerComponent, Workbench.component.Component, {
 91 
 92     label : "Text Viewer",
 93     description : "For Viewing A Text.",
 94     "window" : this.window,
 95     
 96     handle : function(monkEvent, data){
 97         if (monkEvent.instanceOf(Workbench.event.ComponentLoaded) && monkEvent.component == this) {
 98             this.currentChunk = Monk.component.dataManager.getCurrentChunk();
 99             if (this.currentChunk != null) {
100                 this.notify(
101                     new Monk.event.chunk.ChunkSelected({
102                         label: 'Text chunk selected: '+'"'+this.currentChunk.text+'"'
103                     }), {id:this.currentChunk,label:this.currentChunk,displayText:true}
104                 );
105             }
106         } else if (monkEvent.instanceOf(Monk.event.chunk.ChunkSelected)) {
107         	if (this.hasFocusPriority()) {
108 			    Workbench.component.manager.handleFocus(this);
109                 if(data.displayText==true){
110                 Ext.get('view').mask('Loading text...');
111                 this.currentChunk = data;
112                 
113                 
114                 if (this.chunkHistory.getById(this.currentChunk.id) == null) {
115                     this.chunkHistory.loadData([[
116                         this.currentChunk.id,
117                         this.currentChunk.corpus,
118                         this.currentChunk.text,
119                         this.currentChunk.chunkType
120                     ]], true);
121                 }
122 			    Monk.data.chunk.retrieveChunkContents(data);
123                 }
124             }
125         } else if (monkEvent.instanceOf(Monk.event.chunk.ChunkContentsRetrieved)) {
126             if (this.hasFocusPriority()) {
127 				this.showText(data);
128                 var view = Ext.get('view');
129 //                var firstElement = Ext.DomQuery.selectNode('span', view.dom);
130 //                if (firstElement) firstElement.scrollIntoView(view, false);
131                 view.unmask();
132                 
133                 var features = Monk.component.dataManager.getTermsForChunk(this.currentChunk.id);
134                 if (features != null) {
135                     for (var i = 0, length = features.length; i < length; i++) {
136 						this.highlightString(features[i],(i>0 && i<7 ? 'hi'+i : null));
137                     }
138                 }
139             }
140         } else if (monkEvent.instanceOf(Monk.event.chunk.ChunkContentsRetrievedWithFeatures)) {
141             var text = Ext.get('chunkText').dom;
142             var fontNodes = Ext.DomQuery.select('font[color!=#999999]', text);
143             for (var i = 0; i < fontNodes.length; i++) {
144                 var node = fontNodes[i];
145                 var color = node.getAttribute('color');
146                 Ext.DomHelper.applyStyles(node, {'background-color':color});
147                 Ext.DomHelper.applyStyles(node, {padding:'1px 3px'});
148                 Ext.DomHelper.applyStyles(node, {color:'#ffffff'});
149             }
150             
151             var view = Ext.get('view');
152 //            var firstElement = Ext.DomQuery.selectNode('span', view.dom);
153 //            if (firstElement) firstElement.scrollIntoView(view, false);
154             view.unmask();
155         } else if (monkEvent.instanceOf(Monk.event.workbench.SimpleSearchQuery)) {
156 //            if (this.hasFocus) {
157 				this.clearHighlights();
158                 var query = data.featureValue.split(' (*)')[0];
159 				this.highlightString(query);
160 //            }
161         }
162     },
163 	
164 	showText : function(data) {
165         Ext.get('chunkLabel').update(data.text);
166         Ext.get('view').update(data.html);
167 	},
168 	
169 	highlightString : function(string,cls) {
170 		this.highlightRegex(new RegExp("\\b("+string+")\\b","gi"),cls);
171 	},
172 	
173 	highlightRegex : function(re,cls) {
174 		var view = document.getElementById("view");
175 		view.innerHTML = view.innerHTML.replace(re,"<span class='hi"+(cls ? ' '+cls : '')+"'>$1</span>");
176 	},
177 	
178 	clearHighlights : function() {
179 		var view = document.getElementById("view");
180 		view.innerHTML = view.innerHTML.replace(/<span class=['"]hi.+?>(.*?)<\/span>/g,"$1");
181 	},
182 	
183 	handleHistory : function(id) {
184 		for (var i=0;i<this.chunkHistory.length;i++) {
185 			if (id==this.chunkHistory[i].id) {
186                 Monk.data.chunk.retrieveChunkContents(this.chunkHistory[i]);
187 				return;
188 			}
189 		}
190 		alert("Unable to find the requested chunk.")
191 		
192 	},
193     
194     hasFocusPriority : function() {
195         var focusHistory = Workbench.component.manager.focusHistory;
196         var focusHistoryIds = [];
197         var hasFocusPriority = false;
198         
199         var thisId = null;
200         
201         // get the ids for the components in focus history
202         for (var i = 0; i < focusHistory.length; i++) {
203             var historyItem = focusHistory[i];
204             this.getFeature().toolWindowRegistry.find(function(item, key) {
205                 if (item.window == historyItem.window) {
206                     var id = key.split('-window')[0];
207                     focusHistoryIds.push(id);
208                     if (historyItem.window == this.window) {
209                         thisId = id;
210                     }
211                     return true;
212                 } else {
213                     return false;
214                 }
215             }, this);
216         }
217         
218         if (thisId == null) {
219             // if the id is still null, the this component isn't in the focus history
220             return false;
221         } else {
222             // figure out the id for the duplicate component
223             var duplicateId = thisId.indexOf('-clone') > -1 ? thisId.split('-clone')[0] : thisId + '-clone';
224             
225             // check which id is closer to the beginning of the array
226             if (focusHistoryIds.indexOf(duplicateId) > -1) {
227                 if (focusHistoryIds.indexOf(duplicateId) < focusHistoryIds.indexOf(thisId)) {
228                     hasFocusPriority = false;
229                 }
230             } else {
231                 hasFocusPriority = true;
232             }
233             return hasFocusPriority;
234         }
235     }
236 });
237