Skip to content

[4.0] [WIP] Joomla Installation: multiple corrections when installing languages and more#32601

Closed
infograf768 wants to merge 3 commits intojoomla:4.0-devfrom
infograf768:4.0-installation_languages
Closed

[4.0] [WIP] Joomla Installation: multiple corrections when installing languages and more#32601
infograf768 wants to merge 3 commits intojoomla:4.0-devfrom
infograf768:4.0-installation_languages

Conversation

@infograf768
Copy link
Member

Summary of Changes

Preventing installing languages after "installation" folder is deleted.
Display "Congratulations! Your Joomla site is ready." after installing and set languages after deleting installation folder.
Add to the string displayed next to the Remove "installation folder when using the beta version
Added conditional and new string to be used when J4 version will be stable.

Testing Instructions

Install a clean Joomla dev. Use NPM.
Click the "Install Additional Languages" button.
Select between French (fr-FR), German (de-DE), Persian (fa-IR).
Click Next.
Select a language
Click "Set Default Languages" button

Click again the "Install Additional Languages" button and Next.
Select a language
Click "Set Default Languages" button

Click on the Remove "installation" folder

Patch and redo a new installation with the same steps. Use npm

Actual result BEFORE applying this Pull Request

Error if trying to set again a default language after deleting the installation folder

secondsetdefaultlanguage_error

after installing and set languages after deleting installation folder we get only "Congratulations"

Screen Shot 2021-03-07 at 09 00 35

the string displayed next to the Remove "installation" folder when using the beta version just states the development status

Screen Shot 2021-03-07 at 09 58 07

Expected result AFTER applying this Pull Request

No more possibility of setting default language after deleting the "installation" folder.
"Congratulations! Your Joomla site is ready." is displayed

Screen Shot 2021-03-07 at 09 12 05

When in development mode, the string is now:

Screen Shot 2021-03-07 at 08 53 37

If we set version.php to stable, we will get

Screen Shot 2021-03-07 at 08 56 37

Documentation Changes Required

None

Notes

  1. I found out that if we wait too much to install again some languages after already setting default languages, we may get

Screen Shot 2021-03-07 at 08 58 56

  1. In the remove/default.php, we have a supplementary fieldset which is never displayed although its active state is toggled in the js

Screen Shot 2021-03-07 at 09 15 07

		<fieldset id="installFinal" class="j-install-step">
			<legend class="j-install-step-header">
				<span class="icon-joomla" aria-hidden="true"></span> <?php echo Text::_('INSTL_COMPLETE_FINAL'); ?>
			</legend>
			<div class="j-install-step-form">
				<p><?php echo Text::_('INSTL_COMPLETE_FINAL_DESC'); ?></p>
			</div>
		</fieldset>

I guess we can safely delete that fieldset and relative js and lang strings.

  1. I have not yet tested with RTL and I have not normalised yet the use of tabs instead of dots in the js as well as the correct alignment in the php.
    This should be done in another PR

  2. As I added longer texts next to the Remove "installation" folder, the css may need some tweeks. I think this also could be done in another PR.

@joomla-cms-bot joomla-cms-bot added Language Change This is for Translators NPM Resource Changed This Pull Request can't be tested by Patchtester PR-4.0-dev labels Mar 7, 2021
<?php endif; ?>
<div class="alert flex-column mb-1" id="removeInstallationTab">
<?php if ($this->development) : ?>
<span class="mb-1 font-weight-bold"><?php echo Text::sprintf('INSTL_SITE_DEVMODE_LABEL', 'installation'); ?></span>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know this was present before BUT the class font-weight-bold should be avoided in this case. It is being used as a visual indication of importance but as it is just css it has no semantic meaning. Instead it should be either an appropriate heading or the semantic "strong"

Copy link
Member Author

@infograf768 infograf768 Mar 7, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

so, what precisely do you suggest? Modifying both strings to add <strong> in the values?
In any case this is epiphenomenic in this PR and I will wait for real full tests

<?php endif; ?>
<div class="alert flex-column mb-1" id="removeInstallationTab">
<?php if ($this->development) : ?>
<span class="mb-1 font-weight-bold"><?php echo Text::sprintf('INSTL_SITE_DEVMODE_LABEL', 'installation'); ?></span>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<span class="mb-1 font-weight-bold"><?php echo Text::sprintf('INSTL_SITE_DEVMODE_LABEL', 'installation'); ?></span>
<span class="mb-1"><strong><?php echo Text::sprintf('INSTL_SITE_DEVMODE_LABEL', 'installation'); ?></strong></span>

Why would you want to change a language string to add html markup

@dgrammatiko
Copy link
Contributor

dgrammatiko commented Mar 7, 2021

@infograf768 please don't re introduce the remove folder button. We can do this step automatically. I'll post some code in a bit

Try these:
default.php.v2.txt
remove.js.v2.txt

@infograf768
Copy link
Member Author

My understanding of what you want to do is, when version is Stable, to automatically delete the Installation folder as soon as one clicks on one of the buttons Complete and open ...

I tested your files without installing extra languages and setting version.php to stable
It does not work

Uncaught TypeError: document.querySelectorAll(...).map is not a function remove.js:33:56

@dgrammatiko
Copy link
Contributor

I can’t work in rn but this or as is shouldn’t be merged as it messes up ux. You don’t need extra button for normal installations they are confusing just use the 2 existing ones

@infograf768
Copy link
Member Author

Setting this to WIP as the part concerning

Preventing installing languages after "installation" folder is deleted.
Display "Congratulations! Your Joomla site is ready." after installing and set languages after deleting installation folder.

is still correct.

@infograf768 infograf768 marked this pull request as draft March 7, 2021 17:15
@infograf768 infograf768 changed the title [4.0] Joomla Installation: multiple corrections when installing languages and more [4.0] [WIP] Joomla Installation: multiple corrections when installing languages and more Mar 7, 2021
@infograf768
Copy link
Member Author

@dgrammatiko

You don’t need extra button for normal installations they are confusing just use the 2 existing ones

I am sure you understand that this j4 installation code has been failing on many points since the beginning as it is extremely complex for little gain vs j3.
I am willing to help correct obvious bugs, but learning only at this stage that your original intention was to get rid of the "red" button when the version is stable is extremely frustrating as I have no crystal ball (understatement).

@joomdonation
Copy link
Contributor

@infograf768 I haven't tested the change but look like there is a small bug in the propose code by @dgrammatiko. Could you please try to replace the code:

document.querySelectorAll('.removeInstallationFolder').map(function(el) {

with

[].slice.call(document.querySelectorAll('.removeInstallationFolder')).forEach(function (el) {

I think it will fix the error you mentioned.

@infograf768
Copy link
Member Author

@joomdonation
testing now.

@infograf768
Copy link
Member Author

works without installing languages :)
Now testing with languages and will modify my pr.

@infograf768
Copy link
Member Author

infograf768 commented Mar 8, 2021

If version is stable, then It works, but if version is dev (even when not installing languages), the Remove installation folder button has no effect and I can't see any error in console.

Maybe we need to add back the old code as a supplement to the modified one to take care of that aspect?
What do you think?

I mean adding back this deleted part

-if (document.getElementById('removeInstallationFolder')) {
-	document.getElementById('removeInstallationFolder')
-		.addEventListener('click', function (e) {
-			e.preventDefault();
-			let confirm = window.confirm(Joomla.Text._('INSTL_REMOVE_INST_FOLDER').replace('%s', 'installation'));
-			if (confirm) {
-				Joomla.request({
-					method: "POST",
-					url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
-					perform: true,
-					token: true,
-					headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-					onSuccess: function () {
-						const customInstallation = document.getElementById('customInstallation');
-						customInstallation.parentNode.removeChild(customInstallation);
-						const removeInstallationTab = document.getElementById('removeInstallationTab');
-						removeInstallationTab.parentNode.removeChild(removeInstallationTab);
-					},
-					onError: function (xhr) {
-            Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
-					}
-					}
-				);
-			}
-		}
-		);
-}

EDIT:
in fact looks like new code is confusing as it uses
if (e.target.dataset.isDev) { return; }

@infograf768
Copy link
Member Author

It works if I do

[].slice.call(document.querySelectorAll('.removeInstallationFolder')).forEach(function (el) {
  el.addEventListener('click', function (e) {
      e.preventDefault();
      // We skip removing data for dev setups on the redirect buttons, unless someone clicks on the extra red button
      if (e.target.dataset.isDev) {
      	let confirm = window.confirm(Joomla.Text._('INSTL_REMOVE_INST_FOLDER').replace('%s', 'installation'));
      	if (confirm) {
      		Joomla.request({
					method: "POST",
					url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
					perform: true,
					token: true,
					headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
					onSuccess: function () {
						const customInstallation = document.getElementById('customInstallation');
						customInstallation.parentNode.removeChild(customInstallation);
						const removeInstallationTab = document.getElementById('removeInstallationTab');
						removeInstallationTab.parentNode.removeChild(removeInstallationTab);
					},
					onError: function (xhr) {
						Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
					}
					}
				);
			}
		 } else {
        Joomla.request({
            method: "POST",
            url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
            perform: true,
            token: true,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
            onSuccess: function () {
              const customInstallation = document.getElementById('customInstallation');
              customInstallation.parentNode.removeChild(customInstallation);
              const removeInstallationTab = document.getElementById('removeInstallationTab');
              removeInstallationTab.parentNode.removeChild(removeInstallationTab);
              window.location.href = e.target.dataset.redirectTo;
            },
            onError: function (xhr) {
              Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
            }
          }
        );
      }
    }
  );
});

@joomdonation @dgrammatiko

Are you OK with this? If yes I can correct tabs/dots and other cs and modify my PR or make a new one.

@dgrammatiko
Copy link
Contributor

dgrammatiko commented Mar 8, 2021

@infograf768 You don't need the extra if/lse with the same code could be :

[].slice.call(document.querySelectorAll('.removeInstallationFolder')).forEach(function (el) {
  el.addEventListener('click', function (e) {
      e.preventDefault();
        Joomla.request({
            method: "POST",
            url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
            perform: true,
            token: true,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
            onSuccess: function () {
              const customInstallation = document.getElementById('customInstallation');
              customInstallation.parentNode.removeChild(customInstallation);
              const removeInstallationTab = document.getElementById('removeInstallationTab');
              removeInstallationTab.parentNode.removeChild(removeInstallationTab);
      // We skip removing data for dev setups on the redirect buttons, unless someone clicks on the extra red button
              let confirm =(e.target.dataset.isDev) ? window.confirm(Joomla.Text._('INSTL_REMOVE_INST_FOLDER').replace('%s', 'installation')) : undefined;
              if (!confirm) { window.location.href = e.target.dataset.redirectTo; }
            },
            onError: function (xhr) {
              Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
            }
      });
    }
  });
});

@infograf768
Copy link
Member Author

Uncaught SyntaxError: missing ) after argument list 56:2

here is line 56
Screen Shot 2021-03-08 at 10 47 35

@dgrammatiko
Copy link
Contributor

@infograf768 my bad remove the } on line 55

@infograf768
Copy link
Member Author

not there yet.
Status: development
The alert is displayed after clicking on the Complete & Open... when not using the delete folder button although the installation folder is already deleted.

@infograf768
Copy link
Member Author

html code is
Screen Shot 2021-03-08 at 11 41 52

@infograf768
Copy link
Member Author

Also, if I use the Remove folder button and then click on cancel, it deletes the installation and open admin login...

@dgrammatiko
Copy link
Contributor

Also, if I use the Remove folder button and then click on cancel, it deletes the installation and open admin login...

Where is this cancel button?

html code is

			<div class="alert flex-column mb-1" id="removeInstallationTab">
				<?php if ($this->development) : ?>
					<span class="mb-1 font-weight-bold"><?php echo Text::sprintf('INSTL_SITE_DEVMODE_LABEL', 'installation'); ?></span>
					<button class="btn btn-danger mb-1 removeInstallationFolder" data-is-dev="false" data-redirect-to="<?php echo Uri::root(); ?>administrator"><?php echo Text::sprintf('INSTL_COMPLETE_REMOVE_FOLDER', 'installation'); ?></button>
				<?php endif; ?>
			</div>
			<?php echo HTMLHelper::_('form.token'); ?>

			<div class="form-group j-install-last-step d-grid gap-2">
				<button class="btn btn-primary w-100 removeInstallationFolder" data-is-dev="<?php echo (bool) $this->development; ?>" data-redirect-to="<?php echo Uri::root(); ?>"><span class="icon-eye" aria-hidden="true"></span> <?php echo Text::_('INSTL_COMPLETE_SITE_BTN'); ?></button>
				<button class="btn btn-primary w-100 removeInstallationFolder" data-is-dev="<?php echo (bool) $this->development; ?>" data-redirect-to="<?php echo Uri::root(); ?>administrator"><span class="icon-lock" aria-hidden="true"></span> <?php echo Text::_('INSTL_COMPLETE_ADMIN_BTN'); ?></button>
			</div>

@infograf768
Copy link
Member Author

infograf768 commented Mar 8, 2021

The js alert to confirm deleting the folder

@dgrammatiko
Copy link
Contributor

dgrammatiko commented Mar 8, 2021

Why do you get an alert in the first place? This seems wrong

can you add console.log(xhr) and share the data? You shouldn't have an error there

@infograf768
Copy link
Member Author

INSTL_REMOVE_INST_FOLDER="Are you sure you want to delete? Confirming will permanently delete the \"%s\" folder."

where do you want me to add console.log(xhr)?

@dgrammatiko
Copy link
Contributor

            onError: function (xhr) {
console.log(xhr)
              Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
            }

@infograf768
Copy link
Member Author

No result using
console.log(xhr);
Installation folder is immediately deleted before clicking on OK. Evidently Cancel is no use.

install

@dgrammatiko
Copy link
Contributor

dgrammatiko commented Mar 8, 2021

@infograf768 who added this confirm thing? This is totally wrong

Edit: I see, you did that, please remove it. You don't have to ask, the installation folder NEEDS to be removed on the normal installations and for devs there's an extra button saying Remove Installation folder. It's obvious what will happen if you press the button no need for confirmation. Please don't add friction on the UX, do what needs to be done with sensible defaults

@infograf768
Copy link
Member Author

Edit: I see, you did that, please remove it.

You are joking I hope!! It was you, before and after your proposal above.

and it was there before you posted
#32601 (comment)

and it was working before as you deleted the old code

-if (document.getElementById('removeInstallationFolder')) {
-	document.getElementById('removeInstallationFolder')
-		.addEventListener('click', function (e) {
-			e.preventDefault();
-			let confirm = window.confirm(Joomla.Text._('INSTL_REMOVE_INST_FOLDER').replace('%s', 'installation'));
-			if (confirm) {
-				Joomla.request({
-					method: "POST",
-					url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
-					perform: true,
-					token: true,
-					headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-					onSuccess: function () {
-						const customInstallation = document.getElementById('customInstallation');
-						customInstallation.parentNode.removeChild(customInstallation);
-						const removeInstallationTab = document.getElementById('removeInstallationTab');
-						removeInstallationTab.parentNode.removeChild(removeInstallationTab);
-					},
-					onError: function (xhr) {
-            Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
-					}
-					}
-				);
-			}
-		}
-		);
-}

@dgrammatiko
Copy link
Contributor

I just copy/pasted the thing you provided that was repeating 20 lines of code for no reason. I didn't really process your code!!!

@infograf768
Copy link
Member Author

infograf768 commented Mar 8, 2021

This is what we have now in 4.0-dev. No comment. it is obvioulsy NOT my code.

if (document.getElementById('removeInstallationFolder')) {
document.getElementById('removeInstallationFolder')
.addEventListener('click', function (e) {
e.preventDefault();
let confirm = window.confirm(Joomla.Text._('INSTL_REMOVE_INST_FOLDER').replace('%s', 'installation'));
if (confirm) {
Joomla.request({
method: "POST",
url: Joomla.installationBaseUrl + '?task=installation.removeFolder&format=json',
perform: true,
token: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
onSuccess: function () {
const customInstallation = document.getElementById('customInstallation');
customInstallation.parentNode.removeChild(customInstallation);
const removeInstallationTab = document.getElementById('removeInstallationTab');
removeInstallationTab.parentNode.removeChild(removeInstallationTab);
},
onError: function (xhr) {
Joomla.renderMessages({ error: [xhr] }, '#system-message-container');
}
}
);
}
}
);
}

@dgrammatiko
Copy link
Contributor

Correct, also it was you that introduced this crap: 7162ed4

Please remove it, you're adding friction whenever you ask users anything. Just do the right thing, by default! Also for dev env, you don't even need a button, just say Hey you're on dev, we are no deleting the installation folder. There's no dev out there that cannot delete a folder manually if they need to (although if you're in dev mode you never need to do so). In short, you're massively complicating what should be a straight forward behaviour

@infograf768
Copy link
Member Author

What I added concerned the string itself and has no impact on your failing code. That's where is the main "crap" as you nicely say.
The button is very useful for people who test on remote. I guess that's the reason you added it originally.
I close this PR as obviously the installation code is a full failure. I quit trying to help on this.

@infograf768 infograf768 closed this Mar 8, 2021
@richard67
Copy link
Member

Do we need an issue for the remaining things? As I remember we had only a comment in #32516 .

@infograf768
Copy link
Member Author

@richard67 Just look at the description of this PR and you will see what I tried to correct., specially the part concerning the languages.

@joomdonation
Copy link
Contributor

@infograf768 Instead of closing the PR, maybe leave it as how it is and let us know the bugs which need to be fixed so that we can try to get it sorted?

@dgrammatiko
Copy link
Contributor

The button is very useful for people who test on remote. I guess that's the reason you added it originally.

@infograf768 I never implemented the removal of the installation, it was done here: #26276

So I apologise for the crap as it wasn't really you!

That said the whole concept I had for the installation was simplification, ask only what needs to be answered. The way the removal of the installation was implemented is totally against that idea and frankly unacceptable. You don;t need to ask obvious things...

@infograf768
Copy link
Member Author

There is no major bug in the PR itself except the will to suddenly change the way to delete the installation folder directly using the "complete & open...' buttons when version is stable.
In that case, as it modifies the js drastically and we still have a Delete folder button to obviously add security when people test on remote, the proposal above #32601 (comment) (corrected) just fails and its failure prevents the other stuff I was trying to solve to be solved.

@infograf768
Copy link
Member Author

I totally disagree with the statement "You don't need to ask obvious things..."
It is only obvious for matured code people.

@dgrammatiko
Copy link
Contributor

It is only obvious for matured code people.

A dev using the git version of Joomla needs to answer a question if they are sure that they want to delete the installation folder?

Well, obviously, we see the world from different lenses

@infograf768
Copy link
Member Author

infograf768 commented Mar 8, 2021

We do NOT have only matured devs testing. Many testers use the patched ready to go install pack provided when a PR is ready. These people do not use git or ide.

@dgrammatiko
Copy link
Contributor

These people do not use git or ide.

Even so, what are the expectation when clicking on the button Remove Installation Folder? To order coffee from Starbucks?
Let's be realistic here, a red BIG button with a very clearly defined message is enough. Anyways since this thing is only affecting the dev I guess you can make their life more miserable by asking one more question. Do it your way

@brianteeman
Copy link
Contributor

@dgrammatiko Please remember that you are debating with someone who believes that.... Oh forget it. Not worth the aggro

@Stuartemk
Copy link

Relax there is a lot of stress because it is urgent to launch Joomla 4, it is years behind schedule and the worst thing is that the community is weakening because it already seems like a utopia to think that it will be released.
The worst mistake has been the philosophy of saying it will be ready when it is ready. People are abandoning the project.
If the basics are released people will quickly switch to Joomla 4 and cheer up or contribute or else Joomla could become a wasteland.

@infograf768
Copy link
Member Author

@Quy
afaik, this is still a release blocker as no solution is provided when installing a non-beta version and we still have issue concerning preventing installing languages after "installation" folder is deleted. Thus why @wilsonge tagged it as release blocker.

@brianteeman
Copy link
Contributor

@infograf768 I assume that @Quy removed the release blocker tag because this is closed. Probably best to create a new issue outlining the problems (again) and then tagging that as a release blocker.

(far too many release blockers have simply been resolved by removing the tag 😭 )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Language Change This is for Translators NPM Resource Changed This Pull Request can't be tested by Patchtester

Projects

None yet

Development

Successfully merging this pull request may close these issues.

9 participants