import os
import numpy as np
import torch
import torch.nn as nn
import gradio as gr
from torchvision.models import efficientnet_v2_m, EfficientNet_V2_M_Weights
from torchvision.ops import nms, box_iou
import torch.nn.functional as F
from torchvision import transforms
from PIL import Image, ImageDraw, ImageFont, ImageFilter
from data_manager import get_dog_description, UserPreferences, get_breed_recommendations, format_recommendation_html
from urllib.parse import quote
from ultralytics import YOLO
import asyncio
import traceback
model_yolo = YOLO('yolov8l.pt')
dog_breeds = ["Afghan_Hound", "African_Hunting_Dog", "Airedale", "American_Staffordshire_Terrier",
"Appenzeller", "Australian_Terrier", "Bedlington_Terrier", "Bernese_Mountain_Dog",
"Blenheim_Spaniel", "Border_Collie", "Border_Terrier", "Boston_Bull", "Bouvier_Des_Flandres",
"Brabancon_Griffon", "Brittany_Spaniel", "Cardigan", "Chesapeake_Bay_Retriever",
"Chihuahua", "Dandie_Dinmont", "Doberman", "English_Foxhound", "English_Setter",
"English_Springer", "EntleBucher", "Eskimo_Dog", "French_Bulldog", "German_Shepherd",
"German_Short-Haired_Pointer", "Gordon_Setter", "Great_Dane", "Great_Pyrenees",
"Greater_Swiss_Mountain_Dog", "Ibizan_Hound", "Irish_Setter", "Irish_Terrier",
"Irish_Water_Spaniel", "Irish_Wolfhound", "Italian_Greyhound", "Japanese_Spaniel",
"Kerry_Blue_Terrier", "Labrador_Retriever", "Lakeland_Terrier", "Leonberg", "Lhasa",
"Maltese_Dog", "Mexican_Hairless", "Newfoundland", "Norfolk_Terrier", "Norwegian_Elkhound",
"Norwich_Terrier", "Old_English_Sheepdog", "Pekinese", "Pembroke", "Pomeranian",
"Rhodesian_Ridgeback", "Rottweiler", "Saint_Bernard", "Saluki", "Samoyed",
"Scotch_Terrier", "Scottish_Deerhound", "Sealyham_Terrier", "Shetland_Sheepdog",
"Shih-Tzu", "Siberian_Husky", "Staffordshire_Bullterrier", "Sussex_Spaniel",
"Tibetan_Mastiff", "Tibetan_Terrier", "Walker_Hound", "Weimaraner",
"Welsh_Springer_Spaniel", "West_Highland_White_Terrier", "Yorkshire_Terrier",
"Affenpinscher", "Basenji", "Basset", "Beagle", "Black-and-Tan_Coonhound", "Bloodhound",
"Bluetick", "Borzoi", "Boxer", "Briard", "Bull_Mastiff", "Cairn", "Chow", "Clumber",
"Cocker_Spaniel", "Collie", "Curly-Coated_Retriever", "Dhole", "Dingo",
"Flat-Coated_Retriever", "Giant_Schnauzer", "Golden_Retriever", "Groenendael", "Keeshond",
"Kelpie", "Komondor", "Kuvasz", "Malamute", "Malinois", "Miniature_Pinscher",
"Miniature_Poodle", "Miniature_Schnauzer", "Otterhound", "Papillon", "Pug", "Redbone",
"Schipperke", "Silky_Terrier", "Soft-Coated_Wheaten_Terrier", "Standard_Poodle",
"Standard_Schnauzer", "Toy_Poodle", "Toy_Terrier", "Vizsla", "Whippet",
"Wire-Haired_Fox_Terrier"]
class MultiHeadAttention(nn.Module):
def __init__(self, in_dim, num_heads=8):
super().__init__()
self.num_heads = num_heads
self.head_dim = max(1, in_dim // num_heads)
self.scaled_dim = self.head_dim * num_heads
self.fc_in = nn.Linear(in_dim, self.scaled_dim)
self.query = nn.Linear(self.scaled_dim, self.scaled_dim)
self.key = nn.Linear(self.scaled_dim, self.scaled_dim)
self.value = nn.Linear(self.scaled_dim, self.scaled_dim)
self.fc_out = nn.Linear(self.scaled_dim, in_dim)
def forward(self, x):
N = x.shape[0]
x = self.fc_in(x)
q = self.query(x).view(N, self.num_heads, self.head_dim)
k = self.key(x).view(N, self.num_heads, self.head_dim)
v = self.value(x).view(N, self.num_heads, self.head_dim)
energy = torch.einsum("nqd,nkd->nqk", [q, k])
attention = F.softmax(energy / (self.head_dim ** 0.5), dim=2)
out = torch.einsum("nqk,nvd->nqd", [attention, v])
out = out.reshape(N, self.scaled_dim)
out = self.fc_out(out)
return out
class BaseModel(nn.Module):
def __init__(self, num_classes, device='cuda' if torch.cuda.is_available() else 'cpu'):
super().__init__()
self.device = device
self.backbone = efficientnet_v2_m(weights=EfficientNet_V2_M_Weights.IMAGENET1K_V1)
self.feature_dim = self.backbone.classifier[1].in_features
self.backbone.classifier = nn.Identity()
self.num_heads = max(1, min(8, self.feature_dim // 64))
self.attention = MultiHeadAttention(self.feature_dim, num_heads=self.num_heads)
self.classifier = nn.Sequential(
nn.LayerNorm(self.feature_dim),
nn.Dropout(0.3),
nn.Linear(self.feature_dim, num_classes)
)
self.to(device)
def forward(self, x):
x = x.to(self.device)
features = self.backbone(x)
attended_features = self.attention(features)
logits = self.classifier(attended_features)
return logits, attended_features
num_classes = 120
device = torch.device('cuda' if torch.cuda.is_available() else 'cpu')
model = BaseModel(num_classes=num_classes, device=device)
checkpoint = torch.load('best_model_81_dog.pth', map_location=torch.device('cpu'))
model.load_state_dict(checkpoint['model_state_dict'])
# evaluation mode
model.eval()
# Image preprocessing function
def preprocess_image(image):
# If the image is numpy.ndarray turn into PIL.Image
if isinstance(image, np.ndarray):
image = Image.fromarray(image)
# Use torchvision.transforms to process images
transform = transforms.Compose([
transforms.Resize((224, 224)),
transforms.ToTensor(),
transforms.Normalize(mean=[0.485, 0.456, 0.406], std=[0.229, 0.224, 0.225]),
])
return transform(image).unsqueeze(0)
def get_akc_breeds_link(breed):
base_url = "https://www.akc.org/dog-breeds/"
breed_url = breed.lower().replace('_', '-')
return f"{base_url}{breed_url}/"
async def predict_single_dog(image):
image_tensor = preprocess_image(image)
with torch.no_grad():
output = model(image_tensor)
logits = output[0] if isinstance(output, tuple) else output
probabilities = F.softmax(logits, dim=1)
topk_probs, topk_indices = torch.topk(probabilities, k=3)
top1_prob = topk_probs[0][0].item()
topk_breeds = [dog_breeds[idx.item()] for idx in topk_indices[0]]
# Calculate relative probabilities for display
raw_probs = [prob.item() for prob in topk_probs[0]]
sum_probs = sum(raw_probs)
relative_probs = [f"{(prob/sum_probs * 100):.2f}%" for prob in raw_probs]
return top1_prob, topk_breeds, relative_probs
async def detect_multiple_dogs(image, conf_threshold=0.3, iou_threshold=0.45):
results = model_yolo(image, conf=conf_threshold, iou=iou_threshold)[0]
dogs = []
boxes = []
for box in results.boxes:
if box.cls == 16: # COCO dataset class for dog is 16
xyxy = box.xyxy[0].tolist()
confidence = box.conf.item()
boxes.append((xyxy, confidence))
if not boxes:
dogs.append((image, 1.0, [0, 0, image.width, image.height]))
else:
nms_boxes = non_max_suppression(boxes, iou_threshold)
for box, confidence in nms_boxes:
x1, y1, x2, y2 = box
w, h = x2 - x1, y2 - y1
x1 = max(0, x1 - w * 0.05)
y1 = max(0, y1 - h * 0.05)
x2 = min(image.width, x2 + w * 0.05)
y2 = min(image.height, y2 + h * 0.05)
cropped_image = image.crop((x1, y1, x2, y2))
dogs.append((cropped_image, confidence, [x1, y1, x2, y2]))
return dogs
def non_max_suppression(boxes, iou_threshold):
keep = []
boxes = sorted(boxes, key=lambda x: x[1], reverse=True)
while boxes:
current = boxes.pop(0)
keep.append(current)
boxes = [box for box in boxes if calculate_iou(current[0], box[0]) < iou_threshold]
return keep
def calculate_iou(box1, box2):
x1 = max(box1[0], box2[0])
y1 = max(box1[1], box2[1])
x2 = min(box1[2], box2[2])
y2 = min(box1[3], box2[3])
intersection = max(0, x2 - x1) * max(0, y2 - y1)
area1 = (box1[2] - box1[0]) * (box1[3] - box1[1])
area2 = (box2[2] - box2[0]) * (box2[3] - box2[1])
iou = intersection / float(area1 + area2 - intersection)
return iou
async def process_single_dog(image):
top1_prob, topk_breeds, relative_probs = await predict_single_dog(image)
# Case 1: Low confidence - unclear image or breed not in dataset
if top1_prob < 0.2:
error_message = '''
⚠️
The image is unclear or the breed is not in the dataset. Please upload a clearer image of a dog.
'''
initial_state = {
"explanation": error_message,
"image": None,
"is_multi_dog": False
}
return error_message, None, initial_state
breed = topk_breeds[0]
# Case 2: High confidence - single breed result
if top1_prob >= 0.45:
description = get_dog_description(breed)
formatted_description = format_description_html(description, breed) # 使用 format_description_html
html_content = f'''
'''
initial_state = {
"explanation": html_content,
"image": image,
"is_multi_dog": False
}
return html_content, image, initial_state
# Case 3: Medium confidence - show top 3 breeds with relative probabilities
else:
breeds_html = ""
for i, (breed, prob) in enumerate(zip(topk_breeds, relative_probs)):
description = get_dog_description(breed)
formatted_description = format_description_html(description, breed) # 使用 format_description_html
breeds_html += f'''
'''
initial_state = {
"explanation": breeds_html,
"image": image,
"is_multi_dog": False
}
return breeds_html, image, initial_state
def create_breed_comparison(breed1: str, breed2: str) -> dict:
"""比較兩個狗品種的特性"""
breed1_info = get_dog_description(breed1)
breed2_info = get_dog_description(breed2)
# 標準化數值轉換
value_mapping = {
'Size': {'Small': 1, 'Medium': 2, 'Large': 3, 'Giant': 4},
'Exercise_Needs': {'Low': 1, 'Moderate': 2, 'High': 3, 'Very High': 4},
'Care_Level': {'Low': 1, 'Moderate': 2, 'High': 3},
'Grooming_Needs': {'Low': 1, 'Moderate': 2, 'High': 3}
}
comparison_data = {
breed1: {},
breed2: {}
}
for breed, info in [(breed1, breed1_info), (breed2, breed2_info)]:
comparison_data[breed] = {
'Size': value_mapping['Size'].get(info['Size'], 2), # 預設 Medium
'Exercise_Needs': value_mapping['Exercise_Needs'].get(info['Exercise Needs'], 2), # 預設 Moderate
'Care_Level': value_mapping['Care_Level'].get(info['Care Level'], 2),
'Grooming_Needs': value_mapping['Grooming_Needs'].get(info['Grooming Needs'], 2),
'Good_with_Children': info['Good with Children'] == 'Yes',
'Original_Data': info
}
return comparison_data
async def predict(image):
if image is None:
return "Please upload an image to start.", None, None
try:
if isinstance(image, np.ndarray):
image = Image.fromarray(image)
dogs = await detect_multiple_dogs(image)
# 更新顏色組合
single_dog_color = '#34C759' # 清爽的綠色作為單狗顏色
color_list = [
'#FF5733', # 珊瑚紅
'#28A745', # 深綠色
'#3357FF', # 寶藍色
'#FF33F5', # 粉紫色
'#FFB733', # 橙黃色
'#33FFF5', # 青藍色
'#A233FF', # 紫色
'#FF3333', # 紅色
'#33FFB7', # 青綠色
'#FFE033' # 金黃色
]
annotated_image = image.copy()
draw = ImageDraw.Draw(annotated_image)
try:
font = ImageFont.truetype("arial.ttf", 24)
except:
font = ImageFont.load_default()
dogs_info = ""
for i, (cropped_image, detection_confidence, box) in enumerate(dogs):
color = single_dog_color if len(dogs) == 1 else color_list[i % len(color_list)]
# 優化圖片上的標記
draw.rectangle(box, outline=color, width=4)
label = f"Dog {i+1}"
label_bbox = draw.textbbox((0, 0), label, font=font)
label_width = label_bbox[2] - label_bbox[0]
label_height = label_bbox[3] - label_bbox[1]
label_x = box[0] + 5
label_y = box[1] + 5
draw.rectangle(
[label_x - 2, label_y - 2, label_x + label_width + 4, label_y + label_height + 4],
fill='white',
outline=color,
width=2
)
draw.text((label_x, label_y), label, fill=color, font=font)
top1_prob, topk_breeds, relative_probs = await predict_single_dog(cropped_image)
combined_confidence = detection_confidence * top1_prob
# 開始資訊卡片
dogs_info += f''
if combined_confidence < 0.2:
dogs_info += f'''
⚠️
The image is unclear or the breed is not in the dataset. Please upload a clearer image.
'''
elif top1_prob >= 0.45:
breed = topk_breeds[0]
description = get_dog_description(breed)
dogs_info += f'''
📋 BASIC INFORMATION
📏
Size:
ⓘ
Size Categories:
• Small: Under 20 pounds
• Medium: 20-60 pounds
• Large: Over 60 pounds
• Giant: Over 100 pounds
• Varies: Depends on variety
{description['Size']}
⏳
Lifespan:
ⓘ
Average Lifespan:
• Short: 6-8 years
• Average: 10-15 years
• Long: 12-20 years
• Varies by size: Larger breeds typically have shorter lifespans
{description['Lifespan']}
🐕 TEMPERAMENT & PERSONALITY
{description['Temperament']}
ⓘ
Temperament Guide:
• Describes the dog's natural behavior and personality
• Important for matching with owner's lifestyle
• Can be influenced by training and socialization
💪 CARE REQUIREMENTS
🏃
Exercise:
ⓘ
Exercise Needs:
• Low: Short walks and play sessions
• Moderate: 1-2 hours of daily activity
• High: Extensive exercise (2+ hours/day)
• Very High: Constant activity and mental stimulation needed
{description['Exercise Needs']}
✂️
Grooming:
ⓘ
Grooming Requirements:
• Low: Basic brushing, occasional baths
• Moderate: Weekly brushing, occasional grooming
• High: Daily brushing, frequent professional grooming needed
• Professional care recommended for all levels
{description['Grooming Needs']}
⭐
Care Level:
ⓘ
Care Level Explained:
• Low: Basic care and attention needed
• Moderate: Regular care and routine needed
• High: Significant time and attention needed
• Very High: Extensive care, training and attention required
{description['Care Level']}
👨👩👧👦 FAMILY COMPATIBILITY
Good with Children:
ⓘ
Child Compatibility:
• Yes: Excellent with kids, patient and gentle
• Moderate: Good with older children
• No: Better suited for adult households
{description['Good with Children']}
📝 DESCRIPTION
{description.get('Description', '')}
'''
else:
dogs_info += f'''
ℹ️
Note: The model is showing some uncertainty in its predictions.
Here are the most likely breeds based on the available visual features.
'''
for j, (breed, prob) in enumerate(zip(topk_breeds, relative_probs)):
description = get_dog_description(breed)
dogs_info += f'''
{format_description_html(description, breed)}
'''
dogs_info += '
'
dogs_info += '
'
html_output = f"""
{dogs_info}
"""
initial_state = {
"dogs_info": dogs_info,
"image": annotated_image,
"is_multi_dog": len(dogs) > 1,
"html_output": html_output
}
return html_output, annotated_image, initial_state
except Exception as e:
error_msg = f"An error occurred: {str(e)}\n\nTraceback:\n{traceback.format_exc()}"
print(error_msg)
return error_msg, None, None
def show_details_html(choice, previous_output, initial_state):
if not choice:
return previous_output, gr.update(visible=True), initial_state
try:
breed = choice.split("More about ")[-1]
description = get_dog_description(breed)
formatted_description = format_description_html(description, breed)
html_output = f"""
{breed}
{formatted_description}
"""
initial_state["current_description"] = html_output
initial_state["original_buttons"] = initial_state.get("buttons", [])
return html_output, gr.update(visible=True), initial_state
except Exception as e:
error_msg = f"An error occurred while showing details: {e}"
print(error_msg)
return f"{error_msg}
", gr.update(visible=True), initial_state
def format_description_html(description, breed):
html = ""
if isinstance(description, dict):
for key, value in description.items():
if key != "Breed": # 跳過重複的品種顯示
if key == "Size":
html += f'''
-
{key}:
ⓘ
Size Categories:
• Small: Under 20 pounds
• Medium: 20-60 pounds
• Large: Over 60 pounds
{value}
'''
elif key == "Exercise Needs":
html += f'''
-
{key}:
ⓘ
Exercise Needs:
• High: 2+ hours of daily exercise
• Moderate: 1-2 hours of daily activity
• Low: Short walks and play sessions
{value}
'''
elif key == "Grooming Needs":
html += f'''
-
{key}:
ⓘ
Grooming Requirements:
• High: Daily brushing, regular professional care
• Moderate: Weekly brushing, occasional grooming
• Low: Minimal brushing, basic maintenance
{value}
'''
elif key == "Care Level":
html += f'''
-
{key}:
ⓘ
Care Level Explained:
• High: Needs significant training and attention
• Moderate: Regular care and routine needed
• Low: More independent, basic care sufficient
{value}
'''
elif key == "Good with Children":
html += f'''
-
{key}:
ⓘ
Child Compatibility:
• Yes: Excellent with kids, patient and gentle
• Moderate: Good with older children
• No: Better suited for adult households
{value}
'''
elif key == "Lifespan":
html += f'''
-
{key}:
ⓘ
Average Lifespan:
• Short: 6-8 years
• Average: 10-15 years
• Long: 12-20 years
{value}
'''
elif key == "Temperament":
html += f'''
-
{key}:
ⓘ
Temperament Guide:
• Describes the dog's natural behavior
• Important for matching with owner
{value}
'''
else:
# 其他欄位保持原樣顯示
html += f"- {key}: {value}
"
else:
html += f"- {description}
"
html += "
"
# 添加AKC連結
html += f'''
'''
return html
with gr.Blocks(css="""
.dog-info-card {
border: 1px solid #e1e4e8;
margin: 40px 0; /* 增加卡片間距 */
padding: 0;
border-radius: 12px;
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
overflow: hidden;
transition: all 0.3s ease;
background: white;
}
.dog-info-card:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.dog-info-header {
padding: 24px 28px; /* 增加內距 */
margin: 0;
font-size: 22px;
font-weight: bold;
border-bottom: 1px solid #e1e4e8;
}
.breed-info {
padding: 28px; /* 增加整體內距 */
line-height: 1.6;
}
.section-title {
font-size: 1.3em;
font-weight: 700;
color: #2c3e50;
margin: 32px 0 20px 0;
padding: 12px 0;
border-bottom: 2px solid #e1e4e8;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
gap: 8px;
position: relative;
}
.icon {
font-size: 1.2em;
display: inline-flex;
align-items: center;
justify-content: center;
}
.info-section, .care-section, .family-section {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 28px; /* 增加底部間距 */
padding: 20px; /* 增加內距 */
background: #f8f9fa;
border-radius: 12px;
border: 1px solid #e1e4e8; /* 添加邊框 */
}
.info-item {
background: white; /* 改為白色背景 */
padding: 14px 18px; /* 增加內距 */
border-radius: 8px;
display: flex;
align-items: center;
gap: 10px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
border: 1px solid #e1e4e8;
flex: 1 1 auto;
min-width: 200px;
}
.label {
color: #666;
font-weight: 600;
font-size: 1.1rem;
}
.value {
color: #2c3e50;
font-weight: 500;
font-size: 1.1rem;
}
.temperament-section {
background: #f8f9fa;
padding: 20px; /* 增加內距 */
border-radius: 12px;
margin-bottom: 28px; /* 增加間距 */
color: #444;
border: 1px solid #e1e4e8; /* 添加邊框 */
}
.description-section {
background: #f8f9fa;
padding: 24px; /* 增加內距 */
border-radius: 12px;
margin: 28px 0; /* 增加上下間距 */
line-height: 1.8;
color: #444;
border: 1px solid #e1e4e8; /* 添加邊框 */
fontsize: 1.1rem;
}
.description-section p {
margin: 0;
padding: 0;
text-align: justify; /* 文字兩端對齊 */
word-wrap: break-word; /* 確保長單字會換行 */
white-space: pre-line; /* 保留換行但合併空白 */
max-width: 100%; /* 確保不會超出容器 */
}
.action-section {
margin-top: 24px;
text-align: center;
}
.akc-button,
.breed-section .akc-link,
.breed-option .akc-link {
display: inline-flex;
align-items: center;
padding: 14px 28px;
background: linear-gradient(145deg, #00509E, #003F7F);
color: white;
border-radius: 12px; /* 增加圓角 */
text-decoration: none;
gap: 12px; /* 增加圖標和文字間距 */
transition: all 0.3s ease;
font-weight: 600;
font-size: 1.1em;
box-shadow:
0 2px 4px rgba(0,0,0,0.1),
inset 0 1px 1px rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.1);
}
.akc-button:hover,
.breed-section .akc-link:hover,
.breed-option .akc-link:hover {
background: linear-gradient(145deg, #003F7F, #00509E);
transform: translateY(-2px);
color: white;
box-shadow:
0 6px 12px rgba(0,0,0,0.2),
inset 0 1px 1px rgba(255,255,255,0.2);
border: 1px solid rgba(255,255,255,0.2);
}
.icon {
font-size: 1.3em;
filter: drop-shadow(0 1px 1px rgba(0,0,0,0.2));
}
.warning-message {
display: flex;
align-items: center;
gap: 8px;
color: #ff3b30;
font-weight: 500;
margin: 0;
padding: 16px;
background: #fff5f5;
border-radius: 8px;
}
.model-uncertainty-note {
display: flex;
align-items: center;
gap: 12px;
padding: 16px;
background-color: #f8f9fa;
border-left: 4px solid #6c757d;
margin-bottom: 20px;
color: #495057;
border-radius: 4px;
}
.breeds-list {
display: flex;
flex-direction: column;
gap: 20px;
}
.breed-option {
background: white;
border: 1px solid #e1e4e8;
border-radius: 8px;
overflow: hidden;
}
.breed-header {
display: flex;
align-items: center;
padding: 16px;
background: #f8f9fa;
gap: 12px;
border-bottom: 1px solid #e1e4e8;
}
.option-number {
font-weight: 600;
color: #666;
padding: 4px 8px;
background: #e1e4e8;
border-radius: 4px;
}
.breed-name {
font-size: 1.5em;
font-weight: bold;
color: #2c3e50;
flex-grow: 1;
}
.confidence-badge {
padding: 4px 12px;
border-radius: 20px;
font-size: 0.9em;
font-weight: 500;
}
.breed-content {
padding: 20px;
}
.breed-content li {
margin-bottom: 8px;
display: flex;
align-items: flex-start; /* 改為頂部對齊 */
gap: 8px;
flex-wrap: wrap; /* 允許內容換行 */
}
.breed-content li strong {
flex: 0 0 auto; /* 不讓標題縮放 */
min-width: 100px; /* 給標題一個固定最小寬度 */
}
ul {
padding-left: 0;
margin: 0;
list-style-type: none;
}
li {
margin-bottom: 8px;
display: flex;
align-items: center;
gap: 8px;
}
.akc-link {
color: white;
text-decoration: none;
font-weight: 600;
font-size: 1.1em;
transition: all 0.3s ease;
}
.akc-link:hover {
text-decoration: underline;
color: #D3E3F0;
}
.tooltip {
position: relative;
display: inline-flex;
align-items: center;
gap: 4px;
cursor: help;
}
.tooltip .tooltip-icon {
font-size: 14px;
color: #666;
}
.tooltip .tooltip-text {
visibility: hidden;
width: 250px;
background-color: rgba(44, 62, 80, 0.95);
color: white;
text-align: left;
border-radius: 8px;
padding: 8px 10px;
position: absolute;
z-index: 100;
bottom: 150%;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: all 0.3s ease;
font-size: 14px;
line-height: 1.3;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
border: 1px solid rgba(255, 255, 255, 0.1)
margin-bottom: 10px;
}
.tooltip.tooltip-left .tooltip-text {
left: 0;
transform: translateX(0);
}
.tooltip.tooltip-right .tooltip-text {
left: auto;
right: 0;
transform: translateX(0);
}
.tooltip-text strong {
color: white !important;
background-color: transparent !important;
display: block; /* 讓標題獨立一行 */
margin-bottom: 2px; /* 增加標題下方間距 */
padding-bottom: 2px; /* 加入小間距 */
border-bottom: 1px solid rgba(255,255,255,0.2);
}
.tooltip-text {
font-size: 13px; /* 稍微縮小字體 */
}
/* 調整列表符號和文字的間距 */
.tooltip-text ul {
margin: 0;
padding-left: 15px; /* 減少列表符號的縮進 */
}
.tooltip-text li {
margin-bottom: 1px; /* 減少列表項目間的間距 */
}
.tooltip-text br {
line-height: 1.2; /* 減少行距 */
}
.tooltip .tooltip-text::after {
content: "";
position: absolute;
top: 100%;
left: 20%; /* 調整箭頭位置 */
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: rgba(44, 62, 80, 0.95) transparent transparent transparent;
}
.tooltip-left .tooltip-text::after {
left: 20%;
}
/* 右側箭頭 */
.tooltip-right .tooltip-text::after {
left: 80%;
}
.tooltip:hover .tooltip-text {
visibility: visible;
opacity: 1;
}
.tooltip .tooltip-text::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
border-width: 8px;
border-style: solid;
border-color: rgba(44, 62, 80, 0.95) transparent transparent transparent;
}
.uncertainty-mode .tooltip .tooltip-text {
position: absolute;
left: 100%;
bottom: auto;
top: 50%;
transform: translateY(-50%);
margin-left: 10px;
z-index: 1000; /* 確保提示框在最上層 */
}
.uncertainty-mode .tooltip .tooltip-text::after {
content: "";
position: absolute;
top: 50%;
right: 100%;
transform: translateY(-50%);
border-width: 5px;
border-style: solid;
border-color: transparent rgba(44, 62, 80, 0.95) transparent transparent;
}
.uncertainty-mode .breed-content {
font-size: 1.1rem; /* 增加字體大小 */
}
.description-section,
.description-section p,
.temperament-section,
.temperament-section .value,
.info-item,
.info-item .value,
.breed-content {
font-size: 1.1rem !important; /* 使用 !important 確保覆蓋其他樣式 */
}
.recommendation-card {
margin-bottom: 40px;
}
.compatibility-scores {
background: #f8f9fa;
padding: 24px;
border-radius: 12px;
margin: 20px 0;
}
.score-item {
margin: 15px 0;
}
.progress-bar {
height: 12px;
background-color: #e9ecef;
border-radius: 6px;
overflow: hidden;
margin: 8px 0;
}
.progress {
height: 100%;
background: linear-gradient(90deg, #34C759, #30B350);
border-radius: 6px;
transition: width 0.6s ease;
}
.percentage {
float: right;
color: #34C759;
font-weight: 600;
}
.breed-details-section {
margin: 30px 0;
}
.subsection-title {
font-size: 1.2em;
color: #2c3e50;
margin-bottom: 20px;
display: flex;
align-items: center;
gap: 8px;
}
.details-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;
background: #f8f9fa;
padding: 20px;
border-radius: 12px;
border: 1px solid #e1e4e8;
}
.detail-item {
background: white;
padding: 15px;
border-radius: 8px;
border: 1px solid #e1e4e8;
}
.description-text {
line-height: 1.8;
color: #444;
margin: 0;
padding: 24px 30px; /* 調整內部間距,從 20px 改為 24px 30px */
background: #f8f9fa;
border-radius: 12px;
border: 1px solid #e1e4e8;
text-align: justify; /* 添加文字對齊 */
word-wrap: break-word; /* 確保長文字會換行 */
word-spacing: 1px; /* 加入字間距 */
}
/* 工具提示改進 */
.tooltip {
position: relative;
display: inline-flex;
align-items: center;
gap: 4px;
cursor: help;
padding: 5px 0;
}
.tooltip .tooltip-text {
visibility: hidden;
width: 280px;
background-color: rgba(44, 62, 80, 0.95);
color: white;
text-align: left;
border-radius: 8px;
padding: 12px 15px;
position: absolute;
z-index: 1000;
bottom: calc(100% + 15px);
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: all 0.3s ease;
font-size: 14px;
line-height: 1.4;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
white-space: normal;
}
.tooltip:hover .tooltip-text {
visibility: visible;
opacity: 1;
}
.score-badge {
background-color: #34C759;
color: white;
padding: 6px 12px;
border-radius: 20px;
font-size: 0.9em;
margin-left: 10px;
font-weight: 500;
box-shadow: 0 2px 4px rgba(52, 199, 89, 0.2);
}
""") as iface:
gr.HTML("""
""")
# 使用 Tabs 來分隔兩個功能
with gr.Tabs():
# 第一個 Tab:原有的辨識功能
with gr.TabItem("Breed Detection"):
gr.HTML("Upload a picture of a dog, and the model will predict its breed and provide detailed information!
")
gr.HTML("Note: The model's predictions may not always be 100% accurate, and it is recommended to use the results as a reference.
")
with gr.Row():
input_image = gr.Image(label="Upload a dog image", type="pil")
output_image = gr.Image(label="Annotated Image")
output = gr.HTML(label="Prediction Results")
initial_state = gr.State()
input_image.change(
predict,
inputs=input_image,
outputs=[output, output_image, initial_state]
)
gr.Examples(
examples=['Border_Collie.jpg',
'Golden_Retriever.jpeg',
'Saint_Bernard.jpeg',
'Samoyed.jpg',
'French_Bulldog.jpeg'],
inputs=input_image
)
# 第二個 Tab:品種比較功能
with gr.TabItem("Breed Comparison"):
gr.HTML("Select two dog breeds to compare their characteristics and care requirements.
")
with gr.Row():
breed1_dropdown = gr.Dropdown(
choices=dog_breeds,
label="Select First Breed",
value="Golden_Retriever"
)
breed2_dropdown = gr.Dropdown(
choices=dog_breeds,
label="Select Second Breed",
value="Border_Collie"
)
compare_btn = gr.Button("Compare Breeds")
comparison_output = gr.HTML(label="Comparison Results")
def show_comparison(breed1, breed2):
if not breed1 or not breed2:
return "Please select two breeds to compare"
breed1_info = get_dog_description(breed1)
breed2_info = get_dog_description(breed2)
html_output = f"""
🐕 {breed1.replace('_', ' ')}
📏
Size:
{breed1_info['Size']}
🏃
Exercise Needs:
{breed1_info['Exercise Needs']}
✂️
Grooming:
{breed1_info['Grooming Needs']}
👨👩👧👦
Good with Children:
{breed1_info['Good with Children']}
🐕 {breed2.replace('_', ' ')}
📏
Size:
{breed2_info['Size']}
🏃
Exercise Needs:
{breed2_info['Exercise Needs']}
✂️
Grooming:
{breed2_info['Grooming Needs']}
👨👩👧👦
Good with Children:
{breed2_info['Good with Children']}
"""
return html_output
compare_btn.click(
show_comparison,
inputs=[breed1_dropdown, breed2_dropdown],
outputs=comparison_output
)
# 第三個 Tab:品種推薦功能
with gr.TabItem("Breed Recommendation"):
gr.HTML("Tell us about your lifestyle, and we'll recommend the perfect dog breeds for you!
")
with gr.Row():
with gr.Column():
living_space = gr.Radio(
choices=["apartment", "house_small", "house_large"],
label="What type of living space do you have?",
info="Choose your current living situation",
value="apartment"
)
exercise_time = gr.Slider(
minimum=0,
maximum=180,
value=60,
label="Daily exercise time (minutes)",
info="Consider walks, play time, and training"
)
grooming_commitment = gr.Radio(
choices=["low", "medium", "high"],
label="Grooming commitment level",
info="Low: monthly, Medium: weekly, High: daily",
value="medium"
)
with gr.Column():
experience_level = gr.Radio(
choices=["beginner", "intermediate", "advanced"],
label="Dog ownership experience",
info="Be honest - this helps find the right match",
value="beginner"
)
has_children = gr.Checkbox(
label="Have children at home",
info="Helps recommend child-friendly breeds"
)
noise_tolerance = gr.Radio(
choices=["low", "medium", "high"],
label="Noise tolerance level",
info="Some breeds are more vocal than others",
value="medium"
)
# 設置按鈕的點擊事件
get_recommendations_btn = gr.Button("Find My Perfect Match! 🔍", variant="primary")
recommendation_output = gr.HTML(label="Breed Recommendations")
def process_recommendations(living_space, exercise_time, grooming_commitment,
experience_level, has_children, noise_tolerance):
try:
user_prefs = UserPreferences(
living_space=living_space,
exercise_time=exercise_time,
grooming_commitment=grooming_commitment,
experience_level=experience_level,
has_children=has_children,
noise_tolerance=noise_tolerance,
space_for_play=True if living_space != "apartment" else False,
other_pets=False,
climate="moderate"
)
recommendations = get_breed_recommendations(user_prefs)
return format_recommendation_html(recommendations)
except Exception as e:
print(f"Error in process_recommendations: {str(e)}")
return f"An error occurred: {str(e)}"
# 這行是關鍵 - 確保按鈕點擊事件有正確連接到處理函數
get_recommendations_btn.click(
fn=process_recommendations, # 處理函數
inputs=[
living_space,
exercise_time,
grooming_commitment,
experience_level,
has_children,
noise_tolerance
],
outputs=recommendation_output # 輸出結果的位置
)
gr.HTML('For more details on this project and other work, feel free to visit my GitHub Dog Breed Classifier')
if __name__ == "__main__":
iface.launch(share=True)