git_sitools_idoc / szcluster-db / workspace / client-public / js / feedsReader / atom1FeedsReader.js @ 2830ca05
1 | dbbd9d34 | Alessandro_N | /***************************************
|
---|---|---|---|
2 | * Copyright 2010-2014 CNES - CENTRE NATIONAL d'ETUDES SPATIALES
|
||
3 | *
|
||
4 | * This file is part of SITools2.
|
||
5 | *
|
||
6 | * SITools2 is free software: you can redistribute it and/or modify
|
||
7 | * it under the terms of the GNU General Public License as published by
|
||
8 | * the Free Software Foundation, either version 3 of the License, or
|
||
9 | * (at your option) any later version.
|
||
10 | *
|
||
11 | * SITools2 is distributed in the hope that it will be useful,
|
||
12 | * but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
13 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
14 | * GNU General Public License for more details.
|
||
15 | *
|
||
16 | * You should have received a copy of the GNU General Public License
|
||
17 | * along with SITools2. If not, see <http://www.gnu.org/licenses/>.
|
||
18 | ***************************************/
|
||
19 | /*global Ext, sitools, i18n,document*/
|
||
20 | Ext.namespace('sitools.widget');
|
||
21 | |||
22 | /**
|
||
23 | * Displays a grid of atom1 format feeds
|
||
24 | * @class sitools.widget.atom1FeedReader
|
||
25 | * @extends Ext.grid.GridPanel
|
||
26 | * @cfg {string} datasetId The Dataset id,
|
||
27 | * @cfg {string} urlFeed The url to request feed
|
||
28 | * @cfg {string} datasetName The dataset name
|
||
29 | * @cfg {string} feedSource
|
||
30 | * @cfg {boolean} autoLoad store configuration
|
||
31 | */
|
||
32 | sitools.widget.atom1FeedReader = function (config) { |
||
33 | Ext.apply(this);
|
||
34 | this.layout = "fit"; |
||
35 | this.storeFeedsRecords = new Ext.data.Store({ |
||
36 | autoLoad : true, |
||
37 | sortInfo : {field : 'pubDate', direction : "DESC"}, |
||
38 | proxy : new Ext.data.HttpProxy({ |
||
39 | url : config.urlFeed,
|
||
40 | restful : true, |
||
41 | listeners : {
|
||
42 | scope : this, |
||
43 | exception : onRequestFeedException
|
||
44 | } |
||
45 | // url : 'http://extjs.com/forum/external.php?type=RSS2'
|
||
46 | }), |
||
47 | reader : new Ext.data.XmlReader({ |
||
48 | record : 'entry' |
||
49 | }, [ 'title',
|
||
50 | { |
||
51 | name : 'author', |
||
52 | mapping : "author.name" |
||
53 | }, { |
||
54 | name : 'pubDate', |
||
55 | mapping : 'updated', |
||
56 | type : 'date' |
||
57 | }, { |
||
58 | name : 'link', |
||
59 | mapping: "link@href" |
||
60 | }, |
||
61 | { |
||
62 | name : 'description', |
||
63 | mapping : 'content' |
||
64 | }, |
||
65 | 'content',
|
||
66 | { |
||
67 | name : 'imageUrl', |
||
68 | createAccessor : function (data, field) { |
||
69 | var q = Ext.DomQuery;
|
||
70 | // select node link with attribute type like image%
|
||
71 | var node = q.selectNode("link[type^=image]", data); |
||
72 | var result = {};
|
||
73 | if (Ext.isEmpty(node)) {
|
||
74 | return result;
|
||
75 | } |
||
76 | Ext.each(node.attributes, function (attribute) {
|
||
77 | result[attribute.name] = attribute.value; |
||
78 | }); |
||
79 | return result;
|
||
80 | } |
||
81 | } |
||
82 | ]) |
||
83 | |||
84 | }); |
||
85 | |||
86 | var columns = [ {
|
||
87 | id : 'image', |
||
88 | header : "Image", |
||
89 | dataIndex : 'imageUrl', |
||
90 | sortable : false, |
||
91 | width : 120 |
||
92 | , |
||
93 | renderer : this.imageRenderer |
||
94 | }, { |
||
95 | id : 'title', |
||
96 | header : "Title", |
||
97 | dataIndex : 'title', |
||
98 | sortable : true, |
||
99 | width : 460, |
||
100 | scope : this, |
||
101 | renderer : this.formatTitle |
||
102 | }, { |
||
103 | header : "Author", |
||
104 | dataIndex : 'author', |
||
105 | width : 100, |
||
106 | hidden : true, |
||
107 | sortable : true |
||
108 | }, { |
||
109 | id : 'last', |
||
110 | header : "Date", |
||
111 | dataIndex : 'pubDate', |
||
112 | width : 150, |
||
113 | renderer : this.formatDate, |
||
114 | sortable : true, |
||
115 | hidden : true |
||
116 | } ]; |
||
117 | |||
118 | sitools.widget.atom1FeedReader.superclass.constructor.call(this, {
|
||
119 | // height : 300,
|
||
120 | columns : columns,
|
||
121 | store : this.storeFeedsRecords, |
||
122 | loadMask : {
|
||
123 | msg : i18n.get("label.loadingFeed") |
||
124 | }, |
||
125 | sm : new Ext.grid.RowSelectionModel({ |
||
126 | singleSelect : true |
||
127 | }), |
||
128 | autoExpandColumn : 'title', |
||
129 | hideHeaders : true, |
||
130 | viewConfig : {
|
||
131 | forceFit : true, |
||
132 | enableRowBody : true, |
||
133 | showPreview : true, |
||
134 | getRowClass : this.applyRowClass |
||
135 | }, |
||
136 | listeners : config.listeners
|
||
137 | }); |
||
138 | }; |
||
139 | |||
140 | Ext.extend(sitools.widget.atom1FeedReader, Ext.grid.GridPanel, { |
||
141 | /**
|
||
142 | * Load the feeds with the given url
|
||
143 | * @param {string} url
|
||
144 | */
|
||
145 | loadFeed : function (url) { |
||
146 | this.store.baseParams = {
|
||
147 | feed : url
|
||
148 | }; |
||
149 | this.store.load();
|
||
150 | }, |
||
151 | |||
152 | /**
|
||
153 | * switch from preview to complete view
|
||
154 | * @param {boolean} show
|
||
155 | */
|
||
156 | togglePreview : function (show) { |
||
157 | this.view.showPreview = show;
|
||
158 | this.view.refresh();
|
||
159 | }, |
||
160 | |||
161 | /**
|
||
162 | * override the method getRowClass
|
||
163 | * @param {Record} record The {@link Ext.data.Record} corresponding to the current row.
|
||
164 | * @param {Number} index The row index.
|
||
165 | * @param {Object} rowParams A config object that is passed to the row template during rendering that allows
|
||
166 | * customization of various aspects of a grid row.
|
||
167 | * <p>If {@link #enableRowBody} is configured <b><tt></tt>true</b>, then the following properties may be set
|
||
168 | * by this function, and will be used to render a full-width expansion row below each grid row:</p>
|
||
169 | * <ul>
|
||
170 | * <li><code>body</code> : String <div class="sub-desc">An HTML fragment to be used as the expansion row's body content (defaults to '').</div></li>
|
||
171 | * <li><code>bodyStyle</code> : String <div class="sub-desc">A CSS style specification that will be applied to the expansion row's <tr> element. (defaults to '').</div></li>
|
||
172 | * </ul>
|
||
173 | * The following property will be passed in, and may be appended to:
|
||
174 | * <ul>
|
||
175 | * <li><code>tstyle</code> : String <div class="sub-desc">A CSS style specification that willl be applied to the <table> element which encapsulates
|
||
176 | * both the standard grid row, and any expansion row.</div></li>
|
||
177 | * </ul>
|
||
178 | * @param {Store} store The {@link Ext.data.Store} this grid is bound to
|
||
179 | */
|
||
180 | applyRowClass : function (record, rowIndex, p, ds) { |
||
181 | if (this.showPreview) { |
||
182 | var xf = Ext.util.Format;
|
||
183 | if (record.data.summary != "" && record.data.summary != undefined){ |
||
184 | p.body = '<p class=sous-titre-flux>' + xf.ellipsis(xf.stripTags(record.data.summary), 300) + '</p>'; |
||
185 | return 'x-grid3-row-expanded'; |
||
186 | } |
||
187 | } |
||
188 | return 'x-grid3-row-collapsed'; |
||
189 | }, |
||
190 | |||
191 | /**
|
||
192 | * Custom date format
|
||
193 | * @param {Date} date the input date
|
||
194 | * @return {String} the date formated
|
||
195 | */
|
||
196 | formatDate : function (date) { |
||
197 | if (!date) {
|
||
198 | return ''; |
||
199 | } |
||
200 | var now = new Date(); |
||
201 | var d = now.clearTime(true); |
||
202 | if (date instanceof Date){ |
||
203 | var notime = date.clearTime(true).getTime(); |
||
204 | if (notime == d.getTime()) {
|
||
205 | return 'Today ' + date.dateFormat('g:i a'); |
||
206 | } |
||
207 | d = d.add('d', -6); |
||
208 | if (d.getTime() <= notime) {
|
||
209 | //return date.dateFormat('D g:i a');
|
||
210 | return date.dateFormat('d/m/Y'); |
||
211 | } |
||
212 | //return date.dateFormat('n/j g:i a');
|
||
213 | return date.dateFormat('d/m/Y'); |
||
214 | } |
||
215 | else {
|
||
216 | return date;
|
||
217 | } |
||
218 | }, |
||
219 | |||
220 | /**
|
||
221 | * Custom renderer for title columns
|
||
222 | * @param {} value the value to format
|
||
223 | * @param {} p
|
||
224 | * @param {Ext.data.Record} record
|
||
225 | * @return {String} The title value formatted.
|
||
226 | */
|
||
227 | formatTitle : function (value, p, record) { |
||
228 | var author = (record.data.author.name !== undefined) ? record.data.author.name : ""; |
||
229 | var link = record.data.link;
|
||
230 | var xf = Ext.util.Format;
|
||
231 | var dateFormat = this.formatDate(record.data.updated); |
||
232 | var author = (record.data.author.name !== undefined) ? record.data.author.name : ""; |
||
233 | var authorEmail = (record.data.author.email !== undefined) ? record.data.author.email : ""; |
||
234 | var res = ""; |
||
235 | if (link !== undefined && link !== "") { |
||
236 | res = String.format('<div class="topic"><a href="{0}" title="{1}" target="_blank"><span class="rss_feed_title">{2}</span></a><br/><span class="author">{3}</span></div>', link, value,
|
||
237 | xf.ellipsis(xf.stripTags(value), 50), author);
|
||
238 | } else {
|
||
239 | res = String.format('<div class="topic"><span class="rss_feed_title">{0}</span><br/><span class="author">{1}</span></div>', xf.ellipsis(xf.stripTags(value), 50), author); |
||
240 | } |
||
241 | if (dateFormat != "" && dateFormat != undefined ){ |
||
242 | res += String.format('<p id="feeds-date">{0}</p>', dateFormat);
|
||
243 | } |
||
244 | return res;
|
||
245 | |||
246 | }, |
||
247 | imageRenderer : function (value, p, record) { |
||
248 | if (Ext.isEmpty(value) || Ext.isEmpty(value.href)) {
|
||
249 | return ""; |
||
250 | } |
||
251 | if (value.type.substr(0, 5) != "image") { |
||
252 | return ""; |
||
253 | } |
||
254 | return String.format('<img src="{0}" width="50px">', value.href); |
||
255 | }, |
||
256 | |||
257 | sortByDate : function (direction){ |
||
258 | this.storeFeedsRecords.sort('pubDate', direction); |
||
259 | } |
||
260 | |||
261 | }); |