diff --git a/kano_profile_gui/ProgressDot.py b/kano_profile_gui/ProgressDot.py
index 7ec2e66f..a25570dd 100644
--- a/kano_profile_gui/ProgressDot.py
+++ b/kano_profile_gui/ProgressDot.py
@@ -45,19 +45,30 @@ def __init__(self, filled=False, color="orange"):
tick_background = Gtk.EventBox()
tick_background.get_style_context().add_class("transparent")
- self._tick = Gtk.Image()
- tick_background.add(self._tick)
- self.put(tick_background, 10, 0)
- tick_file = os.path.join(
- image_dir, "quests/{}-tick-stylised.svg".format(color)
- )
+ self.put(tick_background, 5, 0)
if filled:
- tick_pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size(
- tick_file, 50, 50
- )
- self._tick.set_from_pixbuf(tick_pixbuf)
+ self._tick = Tick(50, 50)
+ tick_background.add(self._tick)
@property
def tick(self):
return self._tick
+
+
+class Tick(Gtk.Image):
+ def __init__(self, width, height, color="orange", bold=True):
+ Gtk.Image.__init__(self)
+
+ if bold:
+ tick_file = os.path.join(
+ image_dir, "quests/{}-tick.svg".format(color)
+ )
+ else:
+ tick_file = os.path.join(
+ image_dir, "quests/{}-tick-stylised.svg".format(color)
+ )
+ pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size(
+ tick_file, width, height
+ )
+ self.set_from_pixbuf(pixbuf)
diff --git a/kano_profile_gui/QuestInfo.py b/kano_profile_gui/QuestInfo.py
index 205f937c..cbde9c66 100644
--- a/kano_profile_gui/QuestInfo.py
+++ b/kano_profile_gui/QuestInfo.py
@@ -133,70 +133,16 @@ def create_reward_section(self):
def create_reward(self, title, icon):
return RewardItem(title, icon)
- # Currently not used
- '''
- def create_quest_description(self):
- sw = ScrolledWindow()
- sw.apply_styling_to_widget()
- sw.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC)
- sw.set_size_request(200, 150)
- sw.get_style_context().add_class("quest_section")
-
- desc_background = Gtk.EventBox()
- desc_background.set_margin_top(10)
- desc_background.set_margin_left(10)
- sw.add(desc_background)
-
- title_label = Gtk.Label("Quest Info")
- title_label.get_style_context().add_class("quest_info_title")
- title_label.set_alignment(xalign=0, yalign=0.5)
-
- desc_label = Gtk.Label(self.quest._description)
- desc_label.get_style_context().add_class("quest_info_description")
- desc_label.set_alignment(xalign=0, yalign=0)
- desc_label.set_line_wrap(True)
-
- vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL)
- desc_background.add(vbox)
-
- vbox.pack_start(title_label, False, False, 0)
- vbox.pack_start(desc_label, False, False, 0)
-
- return sw
-
- def _create_bottom_navigation_bar(self):
- navigation_bar = Gtk.EventBox()
- navigation_bar.get_style_context().add_class("quest_section")
- bottom_bar = Gtk.ButtonBox()
- navigation_bar.add(bottom_bar)
-
- # Do we show these and navigate between the quests this way?
- self.next_button = create_navigation_button(_("Next page").upper(),
- "next")
- # self.next_button.connect("clicked", self._load_page_wrapper, 1)
-
- self.prev_button = create_navigation_button(_("Previous").upper(),
- "previous")
- # self.prev_button.connect("clicked", self._load_page_wrapper, -1)
-
- quest_button = create_navigation_button(_("Back to quests").upper(),
- "middle")
-
- bottom_bar.pack_start(self.prev_button, False, False, 0)
- bottom_bar.pack_start(quest_button, False, False, 0)
- bottom_bar.pack_end(self.next_button, False, False, 0)
-
- return navigation_bar
- '''
-
class RewardItem(Gtk.EventBox):
+ width = 190
height = 140
- width = 140
+ img_width = 100
+ img_height = 100
def __init__(self, title, path):
Gtk.EventBox.__init__(self)
- self.set_size_request(self.height, self.width)
+ self.set_size_request(self.width, self.height)
self.connect("enter-notify-event", self.hover_over_effect)
self.connect("leave-notify-event", self.remove_hover_over)
self.title = title
@@ -207,17 +153,21 @@ def __init__(self, title, path):
self.fixed.add(vbox)
if path and os.path.exists(path):
- img_height = self.height - 40
- img_width = self.width - 40
pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size(
- path, img_height, img_width
+ path, self.img_height, self.img_width
)
+
+ margin_top = (self.height - self.img_height) / 2
+ margin_bottom = margin_top
+ margin_left = (self.width - self.img_width) / 2
+ margin_right = margin_left
+
image = Gtk.Image.new_from_pixbuf(pixbuf)
- image.set_margin_top(20)
- image.set_margin_bottom(20)
- image.set_margin_right(20)
- image.set_margin_left(20)
- vbox.pack_start(image, False, False, 5)
+ image.set_margin_top(margin_top)
+ image.set_margin_bottom(margin_bottom)
+ image.set_margin_right(margin_right)
+ image.set_margin_left(margin_left)
+ vbox.pack_start(image, False, False, 0)
def hover_over_effect(self, widget, event):
label = Gtk.Label(self.title)
diff --git a/kano_profile_gui/QuestList.py b/kano_profile_gui/QuestList.py
index 88e25355..89536104 100644
--- a/kano_profile_gui/QuestList.py
+++ b/kano_profile_gui/QuestList.py
@@ -13,6 +13,7 @@
from kano_profile_gui.paths import css_dir
from kano.gtk3.apply_styles import apply_styling_to_screen
from kano_profile_gui.QuestInfo import QuestInfo
+from kano_profile_gui.ProgressDot import Tick
class QuestList(Gtk.EventBox):
@@ -104,8 +105,8 @@ def __init__(self, win, quest_info):
# Get text for the reward_list_widget
reward_text = "Rewards: "
- rewards_box = Gtk.Box()
- rewards_box.set_margin_right(20)
+ tick_box = Gtk.Box()
+ tick_box.set_margin_right(30)
for reward in self.quest_info.rewards:
reward_text += reward.title
@@ -113,9 +114,28 @@ def __init__(self, win, quest_info):
if not reward == self.quest_info.rewards[-1]:
reward_text += ", "
- reward_pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size(reward.icon, 60, 60)
- reward_image = Gtk.Image.new_from_pixbuf(reward_pixbuf)
- rewards_box.pack_start(reward_image, False, False, 5)
+ # reward_pixbuf = GdkPixbuf.Pixbuf.new_from_file_at_size(reward.icon, 60, 60)
+ # reward_image = Gtk.Image.new_from_pixbuf(reward_pixbuf)
+ # rewards_box.pack_start(reward_image, False, False, 5)
+
+ tick_width = 30
+ tick_height = 30
+ for step in self.quest_info.steps:
+
+ # If the whole quest has been completed,
+ # make all the ticks gold
+ if self.quest_info.is_completed():
+ tick = Tick(width=tick_width, height=tick_height, color="gold")
+
+ # If the individual step has been completed,
+ # make all tick orange
+ elif step.is_fulfilled():
+ tick = Tick(width=tick_width, height=tick_height, color="orange")
+
+ # uncompleted steps should have a grey tick
+ else:
+ tick = Tick(width=tick_width, height=tick_height, color="grey")
+ tick_box.pack_start(tick, False, False, 5)
self.reward_list_label = Gtk.Label(reward_text)
self.reward_list_label.set_alignment(xalign=0, yalign=0)
@@ -136,7 +156,7 @@ def __init__(self, win, quest_info):
else:
self.connect("button-release-event", self.go_to_quest_info)
- hbox.pack_end(rewards_box, False, False, 0)
+ hbox.pack_end(tick_box, False, False, 0)
def hover_over_effect(self, widget, event, hover):
diff --git a/media/images/quests/gold-tick.svg b/media/images/quests/gold-tick.svg
new file mode 100644
index 00000000..c78144c4
--- /dev/null
+++ b/media/images/quests/gold-tick.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/media/images/quests/grey-tick.svg b/media/images/quests/grey-tick.svg
new file mode 100644
index 00000000..4d3bd8cd
--- /dev/null
+++ b/media/images/quests/grey-tick.svg
@@ -0,0 +1,12 @@
+
+
+
diff --git a/media/images/quests/orange-tick.svg b/media/images/quests/orange-tick.svg
new file mode 100644
index 00000000..0a12d11c
--- /dev/null
+++ b/media/images/quests/orange-tick.svg
@@ -0,0 +1,18 @@
+
+
+