oauth: Replace VDOMView with HTMLView

This commit is contained in:
JC Brand 2020-01-30 12:57:21 +01:00
parent 8b5227761e
commit fef92ad99e
3 changed files with 18 additions and 20 deletions

View File

@ -4,12 +4,11 @@
* @license Mozilla Public License (MPLv2) * @license Mozilla Public License (MPLv2)
*/ */
import { Collection } from "skeletor.js/src/collection"; import { Collection } from "skeletor.js/src/collection";
import { HTMLView } from 'skeletor.js/src/htmlview.js';
import { Model } from 'skeletor.js/src/model.js'; import { Model } from 'skeletor.js/src/model.js';
import converse from "@converse/headless/converse-core"; import converse from "@converse/headless/converse-core";
import hello from "hellojs"; import hello from "hellojs";
import tpl_oauth_providers from "templates/oauth_providers.html"; import tpl_oauth_providers from "templates/oauth_providers.js";
const { _, Backbone } = converse.env;
// The following line registers your plugin. // The following line registers your plugin.
@ -91,17 +90,12 @@ converse.plugins.add("converse-oauth", {
_converse.oauth_providers = new _converse.OAuthProviders(); _converse.oauth_providers = new _converse.OAuthProviders();
_converse.OAuthProvidersView = Backbone.VDOMView.extend({ _converse.OAuthProvidersView = HTMLView.extend({
'events': {
'click .oauth-login': 'oauthLogin'
},
toHTML () { toHTML () {
return tpl_oauth_providers( return tpl_oauth_providers(
Object.assign({ Object.assign({
'_': _, 'providers': this.model.toJSON(),
'__': _converse.__, 'oauthLogin': ev => this.oauthLogin(ev)
'providers': this.model.toJSON()
})); }));
}, },

View File

@ -1,9 +0,0 @@
<fieldset class="oauth-providers">
{[ o._.forEach(o.providers, function (provider) { ]}
<p class="oauth-provider">
<a class="oauth-login" href="#" data-id="{{provider.id}}">
<i class="fa {{ provider.class}}"></i>{{provider.login_text}}
</a>
</p>
{[ }); ]}
</fieldset>

View File

@ -0,0 +1,13 @@
const tpl_provider = (o) => html`
<p class="oauth-provider">
<a @click=${o.oauthLogin} class="oauth-login" data-id="${provider.id}">
<i class="fa ${provider.class}"></i>${provider.login_text}
</a>
</p>
`;
export default (o) => html`
<fieldset class="oauth-providers">
${ o.providers.map(provider => tpl_provider(o)) }
</fieldset>
`;