diff --git a/package.json b/package.json index 3c72e32..b4d8b1b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "eruda", - "version": "0.1.2", + "version": "0.2.0", "description": "Console for mobile JavaScript", "main": "index.js", "scripts": { diff --git a/src/Elements/Elements.es6 b/src/Elements/Elements.es6 index 2ec72d4..9600f5f 100644 --- a/src/Elements/Elements.es6 +++ b/src/Elements/Elements.es6 @@ -131,12 +131,11 @@ export default class Elements extends Tool var { className, id, - childNodes, attributes, tagName } = el; - ret.children = formatChildNodes(childNodes); + ret.children = formatChildNodes(el.childNodes); ret.attributes = formatAttr(attributes); ret.name = formatElName({tagName, id, className, attributes}); diff --git a/src/Resources/Resources.es6 b/src/Resources/Resources.es6 index ea1a134..d97a1a5 100644 --- a/src/Resources/Resources.es6 +++ b/src/Resources/Resources.es6 @@ -163,6 +163,29 @@ export default class Resources extends Tool util.cookie.remove(key); self.refreshCookie()._render(); + }).on('click', '.img-link', function () + { + var src = util.$(this).attr('src'); + + var img = new Image(); + + img.onload = function () + { + var sources = parent.get('sources'); + + sources.set({ + type: 'img', + val: { + width: this.width, + height: this.height, + src: src + } + }); + + parent.showTool('sources'); + }; + + img.src = src; }).on('click', '.css-link', linkFactory('css')) .on('click', '.js-link', linkFactory('js')); diff --git a/src/Resources/Resources.hbs b/src/Resources/Resources.hbs index cae311f..77095e0 100644 --- a/src/Resources/Resources.hbs +++ b/src/Resources/Resources.hbs @@ -101,9 +101,7 @@ {{#if imageData}} {{#each imageData}}
  • - - - +
  • {{/each}} {{else}} diff --git a/src/Sources/Sources.es6 b/src/Sources/Sources.es6 index f3ad01d..2ba054a 100644 --- a/src/Sources/Sources.es6 +++ b/src/Sources/Sources.es6 @@ -63,6 +63,7 @@ export default class Sources extends Tool _loadTpl() { this._codeTpl = require('./code.hbs'); + this._imgTpl = require('./image.hbs'); } _render() { @@ -76,8 +77,14 @@ export default class Sources extends Tool case 'js': case 'css': return this._renderCode(); + case 'img': + return this._renderImg(); } } + _renderImg() + { + this._$el.html(this._imgTpl(this._data.val)); + } _renderCode() { var data = this._data; diff --git a/src/Sources/Sources.scss b/src/Sources/Sources.scss index d84b0a8..3fda306 100644 --- a/src/Sources/Sources.scss +++ b/src/Sources/Sources.scss @@ -10,5 +10,20 @@ overflow-x: auto; min-height: 100%; } + .image { + padding: $common-padding; + .img-container { + text-align: center; + img { + max-width: 100%; + box-shadow: $box-shadow; + } + } + .img-info { + text-align: center; + margin-top: 20px; + color: $gray; + } + } } } } \ No newline at end of file diff --git a/src/Sources/image.hbs b/src/Sources/image.hbs new file mode 100644 index 0000000..0a2c180 --- /dev/null +++ b/src/Sources/image.hbs @@ -0,0 +1,6 @@ +
    +
    + +
    +
    {{width}}px * {{height}}px
    +
    \ No newline at end of file diff --git a/test/index.html b/test/index.html index 504b2a3..4711272 100644 --- a/test/index.html +++ b/test/index.html @@ -17,6 +17,9 @@ This is a very long text! This is a very long text! +
    + +