My-Dream-Factory/index.html at main · ufuayk/My-Dream-Factory · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Dream Factory - Enhanced Edition</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
    <link rel="stylesheet" href="styles.css">
    <link rel="icon" href="img/favicon.ico">
</head>
<body>
    <div class="container">
        <div class="header">
            <h3><i class="fas fa-industry"></i> My Dream Factory</h3>
        </div>

        <div class="stats">
            <div class="stat-box">
                <i class="fas fa-coins"></i>
                <div>Capital</div>
                <div id="money">$500</div>
            </div>
            <div class="stat-box">
                <i class="fas fa-star"></i>
                <div>Brand Value</div>
                <div id="brand">0</div>
            </div>
            <div class="stat-box">
                <i class="fas fa-cogs"></i>
                <div>Production</div>
                <div id="production-rate">1.0/s</div>
            </div>
            <div class="stat-box">
                <i class="fas fa-percentage"></i>
                <div>Efficiency</div>
                <div id="efficiency">100%</div>
            </div>
        </div>

        <div class="main-grid">
            <div class="actions">
                <div class="inventory">
                    <h4><i class="fas fa-warehouse"></i> Inventory</h4>
                    <div>Raw Materials: <span id="raw-materials">0</span> / <span id="max-storage">100</span></div>
                    <div class="progress-bar">
                        <div class="progress-bar-fill" id="raw-materials-bar"></div>
                    </div>
                    <div>Products: <span id="products">0</span> / <span id="max-products">100</span></div>
                    <div class="progress-bar">
                        <div class="progress-bar-fill" id="products-bar"></div>
                    </div>

                    <div class="raw-materials-buttons">
                        <button class="action-btn" onclick="buyRawMaterials(10)">
                            <i class="fas fa-shopping-cart"></i> Buy 10 ($50)
                        </button>
                        <button class="action-btn" onclick="buyRawMaterials(50)">
                            <i class="fas fa-shopping-cart"></i> Buy 50 ($250)
                        </button>
                        <button class="action-btn" onclick="buyRawMaterials(100)">
                            <i class="fas fa-shopping-cart"></i> Buy 100 ($500)
                        </button>
                    </div>
                </div>

                <button class="action-btn" onclick="sellProducts()">
                    <i class="fas fa-dollar-sign"></i> Sell Products
                </button>
                <button class="action-btn" onclick="hireWorker()">
                    <i class="fas fa-user-plus"></i> Hire Worker ($200)
                </button>
                <button class="action-btn" onclick="hireMarketer()">
                    <i class="fas fa-bullhorn"></i> Hire Marketer ($300)
                </button>
                <button class="action-btn" onclick="hireSalesman()">
                    <i class="fas fa-user-tie"></i> Hire Salesman ($400)
                </button>
                <button class="action-btn" onclick="runAdvertising()">
                    <i class="fas fa-ad"></i> Run Advertising ($100)
                </button>
                <button class="action-btn" onclick="upgradeFactory()">
                    <i class="fas fa-industry"></i> Upgrade Factory ($1000)
                </button>
                <button class="action-btn" onclick="upgradeStorage()">
                    <i class="fas fa-warehouse"></i> Upgrade Storage ($500)
                </button>
                <button class="action-btn" onclick="motivateEmployees()">
                    <i class="fas fa-heart"></i> Motivate Employees ($100)
                </button>
            </div>

            <div>
                <div class="employees">
                    <h4><i class="fas fa-users"></i> Employees</h4>
                    <div id="employees-list"></div>
                </div>

                <div class="bank">
                    <h4><i class="fas fa-university"></i> Bank</h4>
                    <div>Available Credit: $<span id="available-credit">5000</span></div>
                    <div>Current Debt: $<span id="current-credit">0</span></div>
                    <div>Interest Rate: <span id="interest-rate">10</span>%</div>
                    <button class="action-btn" onclick="takeCredit()">
                        <i class="fas fa-hand-holding-usd"></i> Take Credit ($1000)
                    </button>
                    <button class="action-btn" onclick="payCredit()">
                        <i class="fas fa-money-bill-wave"></i> Pay Credit ($100)
                    </button>
                </div>
            </div>
        </div>

        <div class="achievements">
            <h4><i class="fas fa-trophy"></i> Achievements</h4>
            <div id="achievements-list"></div>
        </div>

        <div style="text-align: center; margin-top: 20px;">
            <button class="action-btn" onclick="githubLink()">
                <i class="fab fa-github"></i> View Developer on GitHub
            </button>
        </div>
    </div>

    <div id="notification" class="notification"></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="general.js"></script>
</body>
</html>