From feb9f89a34fc0e92ccb0d9d1e47d9aeae89aa162 Mon Sep 17 00:00:00 2001 From: Arnaud Levy <contact@arnaudlevy.com> Date: Wed, 1 Feb 2023 17:56:56 +0100 Subject: [PATCH] ready, waiting for api key to finalize --- .../communication/photo_import/pexels.png | Bin 0 -> 4592 bytes .../photo_import/_selector.html.erb | 64 ++++++++++++++++++ .../photo_import/pexels.json.jbuilder | 7 +- .../photo_import/pexels/_photo.json.jbuilder | 6 -- .../photo_import/unsplash.json.jbuilder | 7 +- .../unsplash/_photo.json.jbuilder | 6 -- 6 files changed, 76 insertions(+), 14 deletions(-) create mode 100644 app/assets/images/communication/photo_import/pexels.png delete mode 100644 app/views/admin/communication/photo_import/pexels/_photo.json.jbuilder delete mode 100644 app/views/admin/communication/photo_import/unsplash/_photo.json.jbuilder diff --git a/app/assets/images/communication/photo_import/pexels.png b/app/assets/images/communication/photo_import/pexels.png new file mode 100644 index 0000000000000000000000000000000000000000..0fdda8d646eaefdee64a9275b0e5c523f5db2946 GIT binary patch literal 4592 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 NMh^nhdaGd{`X3wWX>R}k literal 0 HcmV?d00001 diff --git a/app/views/admin/communication/photo_import/_selector.html.erb b/app/views/admin/communication/photo_import/_selector.html.erb index a1ea39fea..7d1af9a6d 100644 --- a/app/views/admin/communication/photo_import/_selector.html.erb +++ b/app/views/admin/communication/photo_import/_selector.html.erb @@ -92,6 +92,36 @@ pexels_path = admin_communication_pexels_path(website_id: nil, format: :json) </div> </div> </div> + <div class="col-md-6"> + <div class="row pure__row--small" ref="results"> + <p v-if="pexels.data.results.length === 0 || !pexels.data" > + <%= t 'photo_import.nothing' %> + </p> + <div v-for="image in pexels.data.results" class="col-6 col-lg-4"> + <img + :src="image.thumb" + :alt="image.alt" + v-on:click="select(image)" + class="img-fluid img-thumbnail mb-3" + :class="image === selected ? 'bg-secondary' : ''"> + </div> + </div> + <div class="row"> + <div class="col-lg-5"> + <a href="#" v-if="pexels.page > 1" v-on:click="pexels.page = pexels.page - 1" class="btn btn-light btn-sm"> + <%= t 'photo_import.previous' %> + </a> + </div> + <div class="col-lg-2 text-center"> + <%= image_tag 'communication/photo_import/pexels.png', width: 100, alt: 'Unsplash' %> + </div> + <div class="col-lg-5 text-end"> + <a href="#" v-if="pexels.page < pexels.data.total_pages" v-on:click="pexels.page = pexels.page + 1" class="btn btn-light btn-sm"> + <%= t 'photo_import.next' %> + </a> + </div> + </div> + </div> </div> </div> </div> @@ -121,6 +151,14 @@ pexels_path = admin_communication_pexels_path(website_id: nil, format: :json) total: 0 } }, + pexels: { + url: '<%= pexels_path %>', + page: 1, + data: { + results: [], + total: 0 + } + }, targets: { image: '<%= about_featured_image_image %> img', imageContainer: '<%= about_featured_image_image %> .sdfi-deletable-file__preview', @@ -157,12 +195,17 @@ pexels_path = admin_communication_pexels_path(website_id: nil, format: :json) watch: { 'unsplash.page': function(newVal, oldVal) { this.searchUnsplash(); + }, + 'pexels.page': function(newVal, oldVal) { + this.searchPexels(); } }, methods: { research() { this.unsplash.page = 1; + this.pexels.page = 1; this.searchUnsplash(); + this.searchPexels(); }, searchUnsplash() { if (!this.query) { @@ -185,6 +228,27 @@ pexels_path = admin_communication_pexels_path(website_id: nil, format: :json) false ); xmlHttp.send( null ); }, + searchPexels() { + if (!this.query) { + return null; + } + + var xmlHttp = new XMLHttpRequest(); + xmlHttp.onreadystatechange = function() { + if (xmlHttp.readyState == 4 && xmlHttp.status == 200) { + this.pexels.data = JSON.parse(xmlHttp.responseText); + } + }.bind(this); + + xmlHttp.open( "GET", + this.pexels.url + + '?query=' + this.query + + '&per_page=' + this.parameters.per_page + + '&page=' + this.pexels.page + + '&lang=' + this.parameters.lang, + false ); + xmlHttp.send( null ); + }, select(image) { var inputImage = document.querySelector(this.targets.image), inputImageContainer = document.querySelector(this.targets.imageContainer), diff --git a/app/views/admin/communication/photo_import/pexels.json.jbuilder b/app/views/admin/communication/photo_import/pexels.json.jbuilder index 5491f6229..ad0ef5a83 100644 --- a/app/views/admin/communication/photo_import/pexels.json.jbuilder +++ b/app/views/admin/communication/photo_import/pexels.json.jbuilder @@ -1,5 +1,10 @@ json.total @total json.total_pages @total_pages json.results @search do |photo| - json.partial! 'admin/communication/photo_import/unsplash/photo', photo: photo + json.id photo['id'] + json.filename "#{photo['id']}.jpg" + json.alt photo['alt_description'] + json.credit "Photo by <a href=\"https://www.pexels.com/@daria\">Daria</a> on <a href=\"https://www.pexels.com\">Pexels</a>" + json.thumb photo['urls']['small'] + json.preview photo['urls']['regular'] end diff --git a/app/views/admin/communication/photo_import/pexels/_photo.json.jbuilder b/app/views/admin/communication/photo_import/pexels/_photo.json.jbuilder deleted file mode 100644 index 34175cfbd..000000000 --- a/app/views/admin/communication/photo_import/pexels/_photo.json.jbuilder +++ /dev/null @@ -1,6 +0,0 @@ -json.id photo['id'] -json.filename "#{photo['id']}.jpg" -json.alt photo['alt_description'] -json.credit "Photo by <a href=\"https://unsplash.com/@#{ photo['user']['username'] }?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\"> #{ photo['user']['name'] }</a> on <a href=\"https://unsplash.com/?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\">Unsplash</a>" -json.thumb photo['urls']['thumb'] -json.preview photo['urls']['regular'] diff --git a/app/views/admin/communication/photo_import/unsplash.json.jbuilder b/app/views/admin/communication/photo_import/unsplash.json.jbuilder index 5491f6229..59eeb59df 100644 --- a/app/views/admin/communication/photo_import/unsplash.json.jbuilder +++ b/app/views/admin/communication/photo_import/unsplash.json.jbuilder @@ -1,5 +1,10 @@ json.total @total json.total_pages @total_pages json.results @search do |photo| - json.partial! 'admin/communication/photo_import/unsplash/photo', photo: photo + json.id photo['id'] + json.filename "#{photo['id']}.jpg" + json.alt photo['alt_description'] + json.credit "Photo by <a href=\"https://unsplash.com/@#{ photo['user']['username'] }?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\"> #{ photo['user']['name'] }</a> on <a href=\"https://unsplash.com/?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\">Unsplash</a>" + json.thumb photo['urls']['small'] + json.preview photo['urls']['regular'] end diff --git a/app/views/admin/communication/photo_import/unsplash/_photo.json.jbuilder b/app/views/admin/communication/photo_import/unsplash/_photo.json.jbuilder deleted file mode 100644 index 1dc8aac83..000000000 --- a/app/views/admin/communication/photo_import/unsplash/_photo.json.jbuilder +++ /dev/null @@ -1,6 +0,0 @@ -json.id photo['id'] -json.filename "#{photo['id']}.jpg" -json.alt photo['alt_description'] -json.credit "Photo by <a href=\"https://unsplash.com/@#{ photo['user']['username'] }?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\"> #{ photo['user']['name'] }</a> on <a href=\"https://unsplash.com/?utm_source=#{ Unsplash.configuration.utm_source }&utm_medium=referral\">Unsplash</a>" -json.thumb photo['urls']['small'] -json.preview photo['urls']['regular'] -- GitLab