企业官网网站建设,网站开发成本,江阴房产网510房产网,企业网站做优化模板
您应用的templates/文件夹将包含显示给玩家的HTML模板。 模板语法
变量
您可以显示如下变量#xff1a; 模板中提供以下变量#xff1a;
player#xff1a;当前正在查看该页面的玩家group#xff1a;当前玩家所属的组subsession#xff1a;当前玩家所属的子游戏p…模板
您应用的templates/文件夹将包含显示给玩家的HTML模板。 模板语法
变量
您可以显示如下变量 模板中提供以下变量
player当前正在查看该页面的玩家group当前玩家所属的组subsession当前玩家所属的子游戏participant当前玩家所属的参与者session当前的会议Constants在 models.py定义的常量使用vars_for_template传递的任何变量。
条件“if” 使用else子句 循环“for” 方法调用
要从您的某个模型调用方法请确保省略括号与常规Python代码不同。 访问列表或字典中的项目
而在Python代码中您执行my_list [0]和my_dict [foo]在模板中您可以执行{{my_list.0}}和{{my_dict.foo}}。
评论 模板过滤器
除了Django的模板语言提供的过滤器之外oTree还有过滤器它等同于函数。 例如显示为。
此外过滤器允许您获取绝对值。 所以做会输出。
如果您收到“无效过滤器”错误请确保模板顶部有。
你不能做的事
模板语言旨在简单地显示和循环值。大多数其他东西都不受支持; 例如你不能做数学*/-或者如果你需要做的是你应该这样做否则修改的数字列表字符串等vars_for_template 。 模板如何工作一个例子 oTree模板混合使用2种语言
HTML使用this和括号一样的尖括号/this。Django模板标签 使用大括号和{% this %}{{ this }}
以下是两种语言如何协同工作的示例。在这个例子中假设您的模板如下所示 第1步oTree扫描Django标签生成HTML又名“服务器端”
oTree使用变量的当前值由vars_for_template提供将上面的Django代码转换为纯HTML如下所示 第2步浏览器扫描HTML标签生成一个网页又名“客户端”
然后oTree服务器将此HTML发送到用户的计算机其中Web浏览器可以读取代码并将其显示为格式化的Web页面 请注意浏览器永远不会看到Django标记。 关键点
您可以从此示例中获得的主要见解是如果您的某个页面看起来不像您想要的那样则可以隔离上述哪些步骤出错。在浏览器中右键单击并“查看源代码”。注意“查看源”可能无法在分屏模式下工作。
然后您可以看到生成的纯HTML以及任何JavaScript或CSS。
如果HTML代码看起来不像您期望的那样那么服务器端就出现了问题。查找您vars_for_template 或您的Django模板标签中的错误。如果生成HTML代码没有错误那么可能是您使用HTML或JavaScript语法的问题。尝试将HTML中有问题的部分粘贴回模板而不使用Django标记并编辑它直到它产生正确的输出。然后重新放入Django标签使其再次动态化。 模板块
而不是编写页面的完整HTML例如 您定义了2个块 图像视频CSSJavaScript等静态文件
以下是如何在页面中包含静态文件.png.jpg.mp4.css.js等。
_static/项目文件夹中有一个文件夹。创建一个包含所需名称的子文件夹或使用现有的global/子文件夹并将文件放在那里。
然后在模板中显示_static/my_app/my_image.png使用 如果文件在_static/global/my_image.png你会这样做 如果您愿意还可以将静态文件放在app文件夹中在名为的子文件夹中static/your_app_name。
如果静态文件在更改后仍未更新则这是因为您的浏览器缓存了该文件。整页重新加载通常是Ctrl F5
动态图像
如果图像/视频路径是可变的如每轮显示不同的图像您可以构建它pages.py并将其传递给模板例如 然后在模板中 JavaScript和放置JavaScript / CSS代码的位置 这取决于您是希望将JS / CSS代码全局应用ab仅应用于一个应用程序还是c仅应用于一个页面。
全局
要将样式或脚本应用于所有游戏中的所有页面请修改模板_templates/global/Page.html。把任何脚本里面了里面的任何样式。{% block global_scripts %}...{% endblock %}{% block global_styles %}...{% endblock %}
对于一个应用程序
要将样式或脚本应用于一个应用程序中的所有页面请为应用程序中的所有模板创建基本模板并将块调用app_styles或app_scripts放入此基本模板中。
例如如果您的应用程序名称是public_goods那么您将创建一个名为的文件public_goods/templates/public_goods/Page.html并将其放入其中 然后每个public_goods模板将从此模板继承 只有一页
如果你有JavaScript和/或仅仅适用于单个页面的CSS代码你可以把它直接在content块或更好地组织把它称为块scripts和styles。它们应该位于content块之外如下所示 这不是必须的但是
它使您的代码井井有条它确保以正确的顺序加载内容CSS然后是页面内容然后是JavaScript。
自定义主题
如果要自定义oTree元素的外观请参阅CSS选择器列表 例如要更改页面宽度请将CSS放在基本模板中如下所示 要获取更多信息请在浏览器中右键单击要修改的元素然后选择“检查”。然后您可以导航以查看不同的元素并尝试修改其样式
如果可能请使用上面的官方选择器之一。不要使用开头的任何选择_otree并根据自举类如不选择 btn-primary或card因为这些都是不稳定的。
将数据从Python传递到JavaScriptjson
如果您需要将变量插入到JavaScript代码中请将其写为而不仅仅是。{{ my_variable|json }}{{ my_variable }}
例如如果您需要将播放器的支付传递给脚本请按以下方式编写 如果您不使用|json则该变量可能不是有效的JavaScript。例子 |json可用于简单的值如1字典和列表等嵌套等等。{a: [1,2]}
|json 转换为JSON并将数据标记为安全可信以便Django不会自动转义它。
如上表所示|json将自动在字符串周围加上引号因此您无需手动添加它们 如果您收到“无效过滤器”错误请确保您 位于模板顶部。{% load otree %}
注意|json模板过滤器替换旧safe_json 功能。但是safe_json仍然有效。只使用一个或另一个而不是两者。 关于PyCharm Professional的注意事项 如果您使用的是常规版PyCharmCommunity Edition请考虑升级到PyCharm Professional Edition因为它提供了Django模板和JavaScript的语法高亮显示。
如果您是学生教师或教授PyCharm Professional是免费的。
安装专业版后在设置中导航到LanguagesFrameworks - Django选中“启用Django支持”并使用manage.py和settings.py将您的oTree文件夹设置为Django项目根目录。
