zavan - Technical Training

awesome_clicker/static/src/clicker_systray/clicker_systray_item.js

@@ -0,0 +1,53 @@
+import { Component, useExternalListener } from "@odoo/owl";
+import { registry } from "@web/core/registry";
+import { useService } from "@web/core/utils/hooks";
+import { useClicker } from "../utility";
+import { ClickerValue } from "../clicker_value/clicker_value";
+import { DropdownItem } from "@web/core/dropdown/dropdown_item";
+import { Dropdown } from "@web/core/dropdown/dropdown"
+import { treeTypes } from "../models/clicker_model";
+
+export class ClickerSystrayItem extends Component {
+    static template = "awesome_clicker.ClickerSystrayItem";
+
+    static components = {
+        ClickerValue,
+        Dropdown,
+        DropdownItem
+    }
+
+    setup() {
+        this.clicker = useClicker();
+        this.actionService = useService("action");
+
+        useExternalListener(document, "click", this.increment, {capture: true})
+    }
+
+    bigIncrement() {
+        this.clicker.increment(10);
+    }
+
+    increment(ev) {
+        if(ev.target.closest("#clicker-big-increment-button")) return;
+
+        this.clicker.increment(1);
+    }
+
+    openClientAction() {
+        this.actionService.doAction({
+            type: 'ir.actions.client',
+            tag: 'awesome_clicker.client_action',
+            target: 'new',
+            name: 'Clicker'
+        })
+    }
+
+    getTreeTypes() {
+        return treeTypes;
+    }
+}
+
+registry.category("systray").add("awesome_clicker.client_action", {
+    Component: ClickerSystrayItem,
+    sequence: 1
+});

awesome_clicker/static/src/clicker_systray/clicker_systray_item.scss

@@ -0,0 +1,3 @@
+.clicker-systray-separator {
+    margin: 0 0.2rem
+}

awesome_clicker/static/src/clicker_systray/clicker_systray_item.xml

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates xml:space="preserve">
+
+    <t t-name="awesome_clicker.ClickerSystrayItem">
+        <Dropdown>
+            <p>
+                <ClickerValue name='' value="clicker.clicks"/>
+                <i class="fa fa-arrow-up"></i>
+                <span class="clicker-systray-separator">,</span>
+                <ClickerValue name='' value="clicker.getAllTreesCount()"/>
+                <i class="fa fa-tree"/>
+                <span class="clicker-systray-separator">,</span>
+                <ClickerValue name='' value="clicker.getAllFruitsCount()"/>
+                <i class="fa fa-apple"/>
+            </p>
+
+            <t t-set-slot="content">
+                <DropdownItem onSelected="() => this.openClientAction()">
+                    Open the clicker game
+                </DropdownItem>
+                <DropdownItem onSelected="() => this.clicker.buyClickBot()">
+                    Buy a Clickbot
+                </DropdownItem>
+                <p t-foreach="getTreeTypes()" t-as="t" t-key="t">
+                    <t t-esc="clicker.getTreeCount(t) + 'x ' + t + ' tree'"/>
+                </p>
+                <p t-foreach="getTreeTypes()" t-as="t" t-key="t">
+                    <t t-esc="clicker.getFruitCount(t) + 'x ' + t"/>
+                </p>
+            </t>
+        </Dropdown>
+    </t>
+
+</templates>

awesome_clicker/static/src/clicker_value/clicker_value.js

@@ -0,0 +1,15 @@
+import { Component } from "@odoo/owl";
+import { humanNumber } from "@web/core/utils/numbers"
+
+export class ClickerValue extends Component {
+    static template = "awesome_clicker.ClientValue";
+
+    static props = {
+        name: String,
+        value: Number
+    }
+
+    getValue() {
+        return humanNumber(this.props.value)
+    }
+}

awesome_clicker/static/src/clicker_value/clicker_value.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates xml:space="preserve">
+    <t t-name="awesome_clicker.ClientValue">
+        <span t-att-data-tooltip="props.value"><t t-esc="props.name"/><t t-esc="getValue()"/></span>
+    </t>
+</templates>

awesome_clicker/static/src/client_action/client_action.js

@@ -0,0 +1,46 @@
+import { Component } from "@odoo/owl";
+import { registry } from "@web/core/registry";
+import { useClicker } from "../utility";
+import { ClickerValue } from "../clicker_value/clicker_value";
+import { treeTypes } from "../models/clicker_model";
+import { Notebook } from "@web/core/notebook/notebook";
+
+
+export class ClientAction extends Component {
+    static template = "awesome_clicker.ClientAction";
+
+    static components = {
+        ClickerValue,
+        Notebook
+    }
+
+    setup() {
+        this.clicker = useClicker();
+    }
+
+    bigIncrement() {
+        this.clicker.increment(100_000);
+    }
+
+    buyClickBot() {
+        this.clicker.buyClickBot();
+    }
+
+    buyBigClickBot() {
+        this.clicker.buyBigClickBot();
+    }
+
+    buyPower() {
+        this.clicker.buyPower();
+    }
+
+    buyTree(fruitName) {
+        this.clicker.buyTree(fruitName);
+    }
+
+    getTreeTypes() {
+        return treeTypes;
+    }
+}
+
+registry.category("actions").add("awesome_clicker.client_action", ClientAction)

awesome_clicker/static/src/client_action/client_action.xml

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates xml:space="preserve">
+
+    <t t-name="awesome_clicker.ClientAction">
+        <div>
+            <ClickerValue name="'Clicks : '" value="clicker.clicks"/>
+            <button id="clicker-big-increment-button" class="btn btn-primary" t-on-click="bigIncrement">Increment</button>
+        </div>
+        <Notebook>
+            <t t-set-slot="page_1" title="'Clicks'" isVisible="true">
+                <h2>Bots</h2>
+                <p>
+                    <t t-esc="clicker.clickBots"/>x ClickBots (10 clicks/second)
+                </p>
+                <button class="btn btn-primary" t-on-click="buyClickBot" t-att-disabled="clicker.clicks &lt; 1000">Buy ClickBot (1000 clicks)</button>
+                <p>
+                    <t t-esc="clicker.bigClickBots"/>x BigClickBots (100 clicks/second)
+                </p>
+                <button class="btn btn-primary" t-on-click="buyBigClickBot" t-att-disabled="clicker.clicks &lt; 5000">Buy BigClickBot (5000 clicks)</button>
+
+                <h2>Power</h2>
+                <p>
+                    <t t-esc="clicker.power"/>Power
+                </p>
+                <button class="btn btn-primary" t-on-click="buyPower" t-att-disabled="clicker.clicks &lt; 100000">Buy Power (100 000 clicks)</button>
+            </t>
+
+            <t t-set-slot="page_2" title="'Trees and Fruits'" isVisible="true">
+                <h2>Trees</h2>
+                <div t-foreach="getTreeTypes()" t-as="t" t-key="t">
+                    <p>
+                        <t t-esc="clicker.getTreeCount(t)"/><t t-esc="t + ' tree'"/>
+                    </p>
+                    <button class="btn btn-primary" t-on-click="() => this.buyTree(t)" t-att-disabled="clicker.clicks &lt; 1000000">Buy Tree (1 000 000 clicks)</button>
+                </div>
+
+                <h2>Fruits</h2>
+                <p t-foreach="getTreeTypes()" t-as="t" t-key="t">
+                    <t t-esc="clicker.getFruitCount(t)"/><span>x </span><t t-esc="t"/>
+                </p>
+            </t>
+        </Notebook>
+    </t>
+</templates>

awesome_clicker/static/src/models/clicker_migration.js

@@ -0,0 +1,27 @@
+export const currentVersion = 1;
+
+const migrations = [
+    {
+        fromVersion: 1,
+        toVersion: 2,
+        apply(clicker) {
+            clicker.trees.push(0);
+            clicker.fruits.push(0);
+        }
+    }
+]
+
+export function migrate(clicker) {
+    let didMigrate = false;
+
+    for(let migration of migrations) {
+        if(migration.fromVersion === clicker.version) {
+            migration.apply(clicker);
+            clicker.version = migration.toVersion;
+
+            didMigrate = true;
+        }
+    }
+
+    return didMigrate;
+}