From f76ec56f3d70da6359905e9b9666f581599edd4f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 21 Apr 2016 18:02:31 -0400 Subject: fix issue with single input fields, store image width/height --- examples/db.json | 24 ++++++++++++++++++++++- examples/index.js | 6 ++++++ package.json | 4 ++-- themes/okadmin/public/css/main.css | 4 +++- themes/okadmin/public/js/app.js | 26 ++++++++++++++++--------- themes/okadmin/templates/partials/inputs.liquid | 18 +++++++++++++++-- 6 files changed, 67 insertions(+), 15 deletions(-) diff --git a/examples/db.json b/examples/db.json index 8805342..401bf26 100644 --- a/examples/db.json +++ b/examples/db.json @@ -153,6 +153,13 @@ "id": "red", "title": "Red", "media": [ + { + "uri": "https://ltho.s3.amazonaws.com/okcms-example/a91c4210-080c-11e6-8a7d-f30231d4ec26.png", + "width": "800", + "height": "800", + "caption": "", + "type": "image" + }, { "uri": "http://asdf.us/", "caption": "ASDF", @@ -160,7 +167,8 @@ } ], "__index": 0, - "dateCreated": "Mon, 28 Mar 2016 23:02:45 GMT" + "dateCreated": "Mon, 28 Mar 2016 23:02:45 GMT", + "flagged": false }, { "id": "blue", @@ -210,5 +218,19 @@ ], "flagged": true } + ], + "flour": [ + { + "id": "test", + "title": "TEST", + "image": { + "uri": "https://ltho.s3.amazonaws.com/okcms-example/7be163d0-080b-11e6-8a7d-f30231d4ec26.png", + "caption": "", + "width": "800", + "height": "800" + }, + "__index": 0, + "dateCreated": "Thu, 21 Apr 2016 21:52:44 GMT" + } ] } \ No newline at end of file diff --git a/examples/index.js b/examples/index.js index efbfc38..341a50b 100644 --- a/examples/index.js +++ b/examples/index.js @@ -29,6 +29,11 @@ var app = okcms.createApp({ title: {type: 'string'}, flagged: {type: 'flag'}, media: {type: 'media-list'}, + }, + flour: { + id: {type: 'string', hidden: true}, + title: {type: 'string'}, + image: {type: 'image'}, } }, @@ -37,6 +42,7 @@ var app = okcms.createApp({ { type: 'page', static: {id: 'contact'}}, { type: 'bread' }, { type: 'test' }, + { type: 'flour' }, ], services: { diff --git a/package.json b/package.json index 619b1c8..971efed 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "okcms", - "version": "0.1.33", - "description": "great", + "version": "0.1.34", + "description": "The dopest CMS on the planet.", "main": "app/index.js", "scripts": { "postinstall": "./install.sh", diff --git a/themes/okadmin/public/css/main.css b/themes/okadmin/public/css/main.css index 15b8781..e539a71 100644 --- a/themes/okadmin/public/css/main.css +++ b/themes/okadmin/public/css/main.css @@ -291,7 +291,9 @@ button, input[type=submit] { height: 7em; } .main.resource form img { - width: 10em; + width: auto; + height: auto; + max-width: 10em; max-height: 6em; border: 0; } diff --git a/themes/okadmin/public/js/app.js b/themes/okadmin/public/js/app.js index 59fc6ae..578d99f 100644 --- a/themes/okadmin/public/js/app.js +++ b/themes/okadmin/public/js/app.js @@ -9,8 +9,10 @@ var OKAdmin = function(){ var url = media.url var imageTemplate = $(".image-template", parent).html() var $el = $(imageTemplate) - $el.find(".uri").val(url) - $el.find("img").attr("src", url) + $el.find(".uri").val(media.url) + $el.find(".image-width").val(media.width) + $el.find(".image-height").val(media.height) + $el.find("img").attr("src", media.url) $("ol", parent).prepend($el) } }) @@ -44,8 +46,10 @@ var OKAdmin = function(){ var url = media.url var imageTemplate = $(".image-template", parent).html() var $el = $(imageTemplate) - $el.find(".uri").val(url) - $el.find("img").attr("src", url) + $el.find(".uri").val(media.url) + $el.find(".image-width").val(media.width) + $el.find(".image-height").val(media.height) + $el.find("img").attr("src", media.url) $("ol", parent).prepend($el) } uploader.addMedia = function(media){ @@ -103,11 +107,13 @@ var OKAdmin = function(){ var $el = $(this) var uploader = new OKUpload () uploader.bind( this ) - uploader.add = function(url){ - console.log(url) - $el.find(".uri").val(url) + uploader.add = function(media){ + console.log(media) + $el.find(".uri").val(media.url) $el.find(".caption").val("") - $el.find("img").attr("src", url).show() + $el.find(".image-width").val(media.width) + $el.find(".image-height").val(media.height) + $el.find("img").attr("src", media.url).show() $el.addClass("loaded") } }) @@ -117,6 +123,8 @@ var OKAdmin = function(){ var $el = $(this).closest(".image") $el.removeClass('loaded') $el.find(".uri").val("") + $el.find(".image-width").val("") + $el.find(".image-height").val("") $el.find(".caption").val("") $el.find("img").attr("src", "") } @@ -141,7 +149,7 @@ var OKAdmin = function(){ $el.parent().addClass("loaded") $el.parent().find(".video-type").val( media.type ) $el.parent().find(".video-token").val( media.token ) - $el.parent().find(".video-uri").val( media.uri ) + $el.parent().find(".video-uri").val( media.url ) $el.parent().find(".video-title").val( media.title ) $el.parent().find(".video-thumb").val( media.thumbnail ) $el.parent().find(".video-width").val( media.width ) diff --git a/themes/okadmin/templates/partials/inputs.liquid b/themes/okadmin/templates/partials/inputs.liquid index 373e580..e71f4ad 100644 --- a/themes/okadmin/templates/partials/inputs.liquid +++ b/themes/okadmin/templates/partials/inputs.liquid @@ -48,6 +48,8 @@
+ + {{spec.value.caption | escape}}
@@ -154,6 +156,8 @@ + + @@ -165,8 +169,8 @@ - - + + @@ -249,6 +253,8 @@
  • + + {{image.caption | strip_html}} @@ -271,6 +277,8 @@