These are chat archives for locomotivecms/v3

15th
Jun 2017
Frank Rykena
@rykena_twitter
Jun 15 10:04
@manuchap your demo is great how can i update_entry with current_account user when i sign_in i want to update a profil-image (avatar)
Martin Berggren
@marthings
Jun 15 10:20
@rykena_twitter I got that to work yesterday with the account name at least (heavily inspired by manuchap). I had to add the account slug i params. I dont know how to update a file filed though. But maybe there is one step closer to a solution.
# In my me.liquid form
<input type="hidden" name="slug" value="{{ current_account._slug }}" />
# In my update_account.liquid
{% capture account_slug %}{{ params.slug }}{% endcapture %}
{% action "editAccount" %}

  setProp("account", "{{account_slug}}");
  var params = getProp('params');
  var account = getProp('account');
  update_account = updateEntry('accounts', account, { name: params.name });

  redirectTo('me');

{% endaction %}
Martin Berggren
@marthings
Jun 15 10:28
Hmm by reading again i could be way off from your question but... I was testing the auth demo and wanted to try to update current_account when logged in and got that to work by looking at manuchaps code.
Nikolay Bonev
@DonKoko
Jun 15 12:22
@rykena_twitter create a feild for the file. Make sure multipart is enabled on your form
@marthings yes it is possible to do that
did it work?
Guys, i already massively exploited actions when they were still in beta and I have already tested a lot of cases and have a lot of code snippets i could share. Unfortunately i cant fully open source the project. If you have some case with actions you are struggling with, just give me shout, maybe i already did it
Sander Schekman
@SuperSchek
Jun 15 12:29
Allright @DonKoko maybe you can answer a question then. It is currently not possible to execute an action on command (like a normal function) instead of when the page loads correct?
Nikolay Bonev
@DonKoko
Jun 15 12:34
yes
Sander Schekman
@SuperSchek
Jun 15 12:34
Hmmm, good to know. Thanks.
Nikolay Bonev
@DonKoko
Jun 15 12:35
however
you can somehow make it feel like just the same page is reloading and not going to another page
create a default response page, where you will have a case statement with all your actions. All your forms redirect to that page and based on some params, you activate a specific action. In the end of the action you redirect back to the page the user came from(basically a callback).
and then in the response page, you can put some type of loading animation.
and create the feeling that the page just reloaded, not that a different page was loaded.
or
just put your action on top of the page you are currently in(your edit view) for example
Sander Schekman
@SuperSchek
Jun 15 12:38
Yeah, it works fine for most use-cases. But with something like a modal that interaction is kind of weird.
I would expect it to just close the modal
But that’s currently not possible.
Nikolay Bonev
@DonKoko
Jun 15 12:39
yeah, it is :)
you just need to write some extra jquery
it will be kinda tricky but it should work
Martin Berggren
@marthings
Jun 15 12:40
@DonKoko Did you mean its possible to add current_user to the with_scope-question :)? Now its a string i guess. Could you show a quick example? Do I need to assign current_user first or something?
Sander Schekman
@SuperSchek
Jun 15 12:40
Well how? submit form > load actions page > redirect to page with modal open > close modal
Something like that?
Nikolay Bonev
@DonKoko
Jun 15 12:41
@SuperSchek yeah, something like that
Sander Schekman
@SuperSchek
Jun 15 12:41
Hmm
Nikolay Bonev
@DonKoko
Jun 15 12:41
also i advice you
for create to just use the model_form
Sander Schekman
@SuperSchek
Jun 15 12:41
I’m a bit sceptical tbh
Nikolay Bonev
@DonKoko
Jun 15 12:41
it works better and you can use ajax to send the info
so you dont need to reload the page
Sander Schekman
@SuperSchek
Jun 15 12:41
But sounds like a cool thing to try this weekend
Nikolay Bonev
@DonKoko
Jun 15 12:42
the actions are super useful for doing edit, more specific and complicated filtering and ordering
sending email, etc
Sander Schekman
@SuperSchek
Jun 15 12:43
Yeah, but that's the thing. I have a contact form, but I don’t want it to just create a content_entry in messages of something like that. I also want it to send an email.
Nikolay Bonev
@DonKoko
Jun 15 12:43
my experience showed me that for create the model_form works better
well in that case I would submit the form and reload the page, so the action that sends the email gets triggered
Sander Schekman
@SuperSchek
Jun 15 12:45
Yeah, I figured.
Best option is to just ditch the modal then I guess
Nikolay Bonev
@DonKoko
Jun 15 12:46
maybe, not necesarrily
i think with some smooth transitions, you can make it feel as if you are not changing page
// Ajax form submit plugin
$.fn.submitAjaxForm = function() {
  this.on('submit', function(e) {
    e.preventDefault();
    var form = $(this);

    var payload = form.serialize();

    var xhr = $.ajax({
      type: 'POST',
      url: form.attr('action'),
      data: payload,
      dataType: 'json'
    });

    // var response = this.response;

    xhr.done(function(d) {
      showSuccess(form);
    });

    xhr.fail(function(d) {
      // console.log(response);
      showError(form);
    });
  });
};
this is the plugin I use for submitting my ajax forms
here is an example of how i use it with a modal
but i am not sending an email here
.reveal#openEveningModal{ data: { reveal: true } }
  %h4.text-black
    {{ open_evening_modal_text }}
  %hr
  .open-evening-form-wrapper.m-t-20
    {% model_form 'event_registrations', id: 'openEveningForm', json: true %}
    {% csrf_param %}
    {% include form_messages %}

    %label.required
      %span Naam
      %input.m-b-20{ type: "text", name: "content[name]", value: "{{ event_registration.name }}", required: true, placeholder: 'Jan Fransen' }
    %label.required
      %span E-mailadres
      %input.m-b-20{ type: "email", name: "content[email]", value: "{{ event_registration.email }}", required: true, placeholder: 'jan.fransen@gmail.com' }
    %label
      %span Gewenste datum
      %select{name: 'content[event]', value: "{{ event_registration.event }}"}
        {% for option in contents.event_registrations.event_options %}
        %option{ value: "{{ option }}" } {{ option }}
        {% endfor %}
    %input.button{ type: "submit", value: 'Inschrijven' }
    {% endmodel_form %}
    %button{ class: "close-button", data: {close: true}, aria: { label: "Modal sluiten" }, type: "button"}
      %span{ aria: { hidden: true }} &times;
:javascript
  document.addEventListener("DOMContentLoaded", function(){
    $('#openEveningForm').submitAjaxForm();
  });
Sander Schekman
@SuperSchek
Jun 15 12:49
Intersting. going to play around with it for sure.
Going to try to load the same page and have the modal be open based on a param
My guess is it’ll be quite iffy because of the reload. But i’ll let you know :thumbsup:
Nikolay Bonev
@DonKoko
Jun 15 12:52
another thing you can do is store in a session something like "awaiting_email"
and reload the page on modal.close
and based on that session, send the email
Sander Schekman
@SuperSchek
Jun 15 12:53
Yeah, i guess that could work. Would have to work around users closing the client with the modal still open tough.
Nikolay Bonev
@DonKoko
Jun 15 12:57
yep, you are corrent
correct
so that is not really an option, just brainstorming here, spamming the community :see_no_evil:
Sander Schekman
@SuperSchek
Jun 15 13:01
Anyway, would be awesome to somehow delay exeuting an action :p
Nikolay Bonev
@DonKoko
Jun 15 13:07
if you ask me, the most awesome would be to be able o put the loco action within the action attribute in the form
and always have a redirect in the end of the action
so it kinda works like rails actions
Nikolay Bonev
@DonKoko
Jun 15 15:34
@SuperSchek bro, i think this might help you. Jorre found it because of a project we are doing http://barbajs.org/how-it-works.html
I never heard of this, but it sounds lit :fire: