Я хотел бы иметь возможность легко создавать «виджеты» ajax, поддерживаемые хамелеоном и пирамидой на стороне сервера.
Предоставляет ли Pyramid какой-либо программный код, облегчающий написание виджетов?
Мой текущий подход заключается в том, что у меня есть домашний вид, который использует home.pt в качестве средства визуализации. home.pt использует макрос base.pt, который определяет структуру страницы и предоставляет слот для заполнения home.pt. base.pt также использует макрос «виджета» входа, который я написал (см.: account_login_widget.pt ниже).
Теоретически все это звучит великолепно... У меня есть многоразовый виджет входа в систему, который я могу использовать на многих страницах, но мой текущий подход работает не очень хорошо. Мой виджет входа в систему использует такие переменные, как ${username} в своем рендерере (который должен определить сервер). Я хочу, чтобы виджет входа в систему и его рендеринг были максимально независимыми. Но с моим нынешним способом ведения дел код домашнего просмотра должен знать о потребностях виджета входа и предоставлять имя пользователя, форму и другие переменные в словаре. Однозначно не хорошо...
Я чувствую, что я близок к правильной идее, но упускаю некоторые вещи...
Есть предположения?
база.pt:
<html>
<head></head>
<body>
<div id="container">
<div id="header">
<span metal:use-macro="load: account_login_widget.pt"></span>
</div>
<div id="middle">
<span metal:define-slot="content"></span>
</div>
<div id="footer"></div>
</div>
</body>
</html>
дом.pt:
<div metal:use-macro="load: base.pt">
<span metal:fill-slot="content">
<div>my stuff</div>
</span>
</div>
account_login_widget.pt:
<span metal:define-macro="account_login_widget">
<script type="text/javascript">
(function($) {
$.fn.my_function = function() {
$('#login_form').submit(function(e) {
e.preventDefault();
// ajax call
$.post(some_url, some_data, function(response) {
$('#account_login_widget').html(response);
});
};
return this;
};
})(jQuery);
// Define the entry point
$(document).ready(function() {
$(document).my_function();
});
</script>
<div id="account_login_widget">
<div id="login_bar" tal:condition="not username">
${form_renderer.begin(...)}
... my form ...
${form_renderer.end()}
<span tal:condition="login_failed">Login failed</span>
<div id="forgot_password_link"><a href="#">Forgot Password?</a></div>
<div id="create_account_link"><a href="${signup_url}">Create Account</a></div>
</div>
<div tal:condition="username">
Welcome <strong>${username}</strong>! <a href="${logout_url}">Logout</a>
</div>
</div>
</span>