From 3a38506c177b8a3743717862741cc9e0f07a9447 Mon Sep 17 00:00:00 2001 From: jamesjara Date: Tue, 31 Jan 2017 14:38:53 +0000 Subject: [PATCH] web screenshot plugin --- web-screenshots/app.js | 78 ++++++++++++++++++++++++++++++++++++++ web-screenshots/index.html | 30 +++++++++++++++ 2 files changed, 108 insertions(+) create mode 100644 web-screenshots/app.js create mode 100644 web-screenshots/index.html diff --git a/web-screenshots/app.js b/web-screenshots/app.js new file mode 100644 index 0000000..98e175b --- /dev/null +++ b/web-screenshots/app.js @@ -0,0 +1,78 @@ +Ext.Loader.setConfig({enabled: true}); + +Ext.Loader.setPath('Ext.ux.DataView', 'http://examples.sencha.com/extjs/5.1.0/examples/ux/DataView/'); + +Ext.require([ + 'Ext.data.*', + 'Ext.util.*', + 'Ext.view.View', + 'Ext.ux.DataView.DragSelector', + 'Ext.ux.DataView.LabelEditor' +]); + +Ext.onReady(function(){ + ImageModel = Ext.define('ImageModel', { + extend: 'Ext.data.Model', + fields: [ + {name: 'name'}, + {name: 'url'}, + {name: 'size', type: 'float'}, + {name:'lastmod', type:'date', dateFormat:'timestamp'} + ] + }); + + var store = Ext.create('Ext.data.Store', { + id: 'viewStore', + model: 'ImageModel', + proxy: { + type: 'memory', + reader: { + type: 'json', + rootProperty: 'images' + } + } + }); + + Ext.create('Ext.Panel', { + id: 'images-view', + frame: true, + renderTo: 'dataview', + title: 'Web screenshot netdb.io (0 items selected)', + items: Ext.create('Ext.view.View', { + store: store, + tpl: [ + '', + '
', + '
', + '{ip:htmlEncode} - {product:htmlEncode}', + '
', + '
', + '
' + ], + multiSelect: true, + trackOver: true, + overItemCls: 'x-item-over', + itemSelector: 'div.thumb-wrap', + emptyText: 'No images to display', + plugins: [ + Ext.create('Ext.ux.DataView.DragSelector', {}), + Ext.create('Ext.ux.DataView.LabelEditor', {dataIndex: 'name'}) + ], + prepareData: function(data) { + Ext.apply(data, { + shortName: Ext.util.Format.ellipsis(data.name, 15), + sizeString: Ext.util.Format.fileSize(data.size), + dateString: Ext.util.Format.date(data.lastmod, "m/d/Y g:i a") + }); + return data; + }, + listeners: { + selectionchange: function(dv, nodes ){ + var l = nodes.length, + s = l !== 1 ? 's' : ''; + this.up('panel').setTitle('Web screenshot netdb.io (' + l + ' item' + s + ' selected)'); + } + } + }) + }); +}); diff --git a/web-screenshots/index.html b/web-screenshots/index.html new file mode 100644 index 0000000..4163011 --- /dev/null +++ b/web-screenshots/index.html @@ -0,0 +1,30 @@ + + + + + + + + + + + + +
+ + + +