Add trophy badge rendering
authorJoshua Rüsweg <josh@bastelstu.be>
Mon, 3 Jul 2017 20:11:17 +0000 (22:11 +0200)
committerJoshua Rüsweg <josh@bastelstu.be>
Mon, 3 Jul 2017 20:12:44 +0000 (22:12 +0200)
See #2315

wcfsetup/install/files/acp/templates/trophyBadge.tpl [new file with mode: 0644]
wcfsetup/install/files/lib/data/trophy/Trophy.class.php
wcfsetup/install/files/style/ui/trophy.scss [new file with mode: 0644]
wcfsetup/setup/db/install.sql
wcfsetup/setup/template/trophyBadge.tpl [new file with mode: 0644]

diff --git a/wcfsetup/install/files/acp/templates/trophyBadge.tpl b/wcfsetup/install/files/acp/templates/trophyBadge.tpl
new file mode 100644 (file)
index 0000000..6e305d1
--- /dev/null
@@ -0,0 +1,6 @@
+<span 
+       class="icon icon{$size} fa-{$trophy->iconName} trophyIcon jsTooltip" 
+       style="color: {$trophy->iconColor}; background-color: {$trophy->badgeColor}"
+       data-trophy-id="{$trophy->trophyID}"
+       title="{$trophy->getTitle()}"
+></span>
index a19ce19f84c55d2da53dc5ac7de13fe5ee2d1988..28f3c5553293529f50868cb9718151c958aa9286 100644 (file)
@@ -23,14 +23,11 @@ use wcf\util\StringUtil;
  * @property-read      string          $title                          the trophy title
  * @property-read      integer         $description                    the trophy description
  * @property-read      integer         $categoryID                     the categoryID of the trophy
- * @property-read      integer         $sidebarSize                    the trophy size in the message sidebar
  * @property-read      integer         $type                           the trophy type
  * @property-read      string          $iconFile                       the file location of the icon
  * @property-read      string          $iconName                       the icon name
  * @property-read      string          $iconColor                      the icon color
- * @property-read      string          $badgeName                      the icon badge name
  * @property-read      string          $badgeColor                     the icon badge color
- * @property-read      string          $customClassName                a custom class for the icon
  * @property-read      integer         $isDisabled                     `1` if the trophy is disabled
  * @property-read      integer         $awardAutomatically             `1` if the trophy is awarded automatically
  */
@@ -42,10 +39,15 @@ class Trophy extends DatabaseObject implements ITitledLinkObject, IRouteControll
        const TYPE_IMAGE = 1;
        
        /**
-        * The type value, if this trophy is a icon trophy (based on CSS icons).
+        * The type value, if this trophy is a badge trophy (based on CSS icons).
         * @var integer
         */
-       const TYPE_FA = 2;
+       const TYPE_BADGE = 2;
+       
+       /**
+        * The default icon size. 
+        */
+       const DEFAULT_SIZE = 32;
        
        /**
         * @inheritDoc
@@ -70,10 +72,7 @@ class Trophy extends DatabaseObject implements ITitledLinkObject, IRouteControll
         * @param       integer         $size
         * @return      string
         */
-       public function renderTrophy($size = null) {
-               if ($size === null) {
-                       $size = $this->sidebarSize;
-               }
+       public function renderTrophy($size = self::DEFAULT_SIZE) {
                
                switch ($this->type) {
                        case self::TYPE_IMAGE: {
@@ -81,8 +80,11 @@ class Trophy extends DatabaseObject implements ITitledLinkObject, IRouteControll
                                break;
                        }
                        
-                       case self::TYPE_FA:
-                               // @TODO
+                       case self::TYPE_BADGE:
+                               return WCF::getTPL()->fetch('trophyBadge', 'wcf', [
+                                       'size' => $size,
+                                       'trophy' => $this
+                               ], true);
                        break;
                        
                        default: 
diff --git a/wcfsetup/install/files/style/ui/trophy.scss b/wcfsetup/install/files/style/ui/trophy.scss
new file mode 100644 (file)
index 0000000..6c7bb4c
--- /dev/null
@@ -0,0 +1,21 @@
+.trophyIcon {
+       display: inline-block;
+       border-radius: 50%;
+       
+       /* Factor: 0.5625 */
+       &.icon16 {
+               font-size: 9px;
+       }
+       
+       &.icon32 {
+               font-size: 18px;
+       }
+       
+       &.icon64 {
+               font-size: 36px;
+       }
+       
+       &.icon144 {
+               font-size: 81px;
+       }
+}
index 01f2167b37cbc87e732dfeffb1da59567051de7b..fd46701326c83a0df9da6a5c54f869dd57008696 100644 (file)
@@ -1322,14 +1322,11 @@ CREATE TABLE wcf1_trophy(
        title VARCHAR(255),
        description MEDIUMTEXT, 
        categoryID INT(10) NOT NULL,
-       sidebarSize SMALLINT(2),
        type SMALLINT(1) DEFAULT 1,
        iconFile MEDIUMTEXT, 
        iconName VARCHAR(255),
        iconColor VARCHAR(255),
-       badgeName VARCHAR(255),
        badgeColor VARCHAR(255),
-       customClassName VARCHAR(255),   
        isDisabled TINYINT(1) NOT NULL DEFAULT 0,
        awardAutomatically TINYINT(1) NOT NULL DEFAULT 1,
        KEY(categoryID)
diff --git a/wcfsetup/setup/template/trophyBadge.tpl b/wcfsetup/setup/template/trophyBadge.tpl
new file mode 100644 (file)
index 0000000..6e305d1
--- /dev/null
@@ -0,0 +1,6 @@
+<span 
+       class="icon icon{$size} fa-{$trophy->iconName} trophyIcon jsTooltip" 
+       style="color: {$trophy->iconColor}; background-color: {$trophy->badgeColor}"
+       data-trophy-id="{$trophy->trophyID}"
+       title="{$trophy->getTitle()}"
+></span>