raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-31 21:37:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

add wrapper to show/hide loading spinner

Browse Source
This commit is contained in:
Jean-Baptiste Bellet
2021-01-11 16:23:22 +01:00
parent 544a7407e3
commit e34050f7cb
4 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/javascripts/templates/admin/modals/image_upload.html.haml
View File

@@ -3,7 +3,8 @@
%form#image_upload{ name: 'form', novalidate: true, enctype: 'multipart/form-data', multipart: true, ng: { controller: "ProductImageCtrl" } }
%div.image-preview
%img.spinner{ src: "/assets/spinning-circles.svg", ng: { hide: "!imageUploader.isUploading" }}
%div{ng: {hide: "!imageUploader.isUploading", cloak: true}}
%ng-include{src: "'components/loading'"}
%img.preview{ng: {src: "{{imagePreview}}", class: "{'faded': imageUploader.isUploading}"}}
%label{for: 'image-upload', class: 'button'} {{ 'admin.products.index.upload_an_image' | t }}

3
app/views/admin/enterprises/form/_primary_details.html.haml
View File

@@ -59,7 +59,8 @@
.six.columns
= f.text_field :permalink, { 'ng-model' => "Enterprise.permalink", placeholder: "eg. your-shop-name", 'ng-model-options' => "{ updateOn: 'default blur', debounce: {'default': 300, 'blur': 0} }" }
.two.columns.omega
%img.spinner{ src: image_path("spinning-circles.svg"), width: "30px", ng: { show: "checking" } }
%div{ng: {show: "checking", cloak: true}, style: "width: 30px; height: 30px;"}
= render partial: "components/loading"
%span{ ng: { class: 'availability.toLowerCase()', hide: "checking" } }
{{ availability }}
%i{ ng: { class: "{'icon-ok-sign': availability == 'Available', 'icon-remove-sign': availability == 'Unavailable'}" } }

3
app/views/shops/_hubs.html.haml
View File

@@ -26,7 +26,8 @@
%a{href: "", "ng-click" => "showDistanceMatches()"}
= t :hubs_distance_filter, location: "{{ nameMatchesFiltered[0].name }}"
.more-controls
%img.spinner.text-center{ng: {show: "closed_shops_loading"}, src: image_path("spinning-circles.svg") }
%span{ng: {show: "closed_shops_loading", cloak: true}}
= render partial: "components/loading"
%span{ng: {if: "!show_closed", cloak: true}}
%a.button{href: "", ng: {click: "showClosedShops()"}}
= t '.show_closed_shops'

3
app/views/spree/admin/orders/index.html.haml
View File

@@ -81,7 +81,8 @@
%span{'ng-bind-html' => 'order.display_total'}
%td.actions
%div.row-loading-icons
%img.spinner{src: image_path("spinning-circles.svg"), ng: {show: 'rowStatus[order.id] == "loading"'} }
%span{ng: {show: 'rowStatus[order.id] == "loading"', cloak: true}}
= render partial: "components/loading"
%i.success.icon-ok-sign{ng: {show: 'rowStatus[order.id] == "success"'} }
%i.error.icon-remove-sign.with-tip{ng: {show: 'rowStatus[order.id] == "error"'}, 'ofn-with-tip' => t('.order_not_updated')}
%a.icon_link.with-tip.icon-edit.no-text{'ng-href' => '{{order.edit_path}}', 'data-action' => 'edit', 'ofn-with-tip' => t('.edit')}