import streamlit as st
import numpy as np
import pandas as pd
from sklearn.datasets import fetch_openml
import matplotlib.pyplot as plt
import matplotlib as mpl
import scipy.ndimage.interpolation as ndi_int

# Streamlit App title
st.title("Image Shifting with MNIST Dataset")

# Load the MNIST dataset
st.write("Loading the MNIST dataset...")
mnist = fetch_openml('mnist_784', version=1)

# Separate the data and target variables
X, y = mnist["data"], mnist["target"].astype(int)

# Select a sample digit to display
st.sidebar.write("## Shift the Image")
digit_index = st.sidebar.slider("Select a digit index", 0, X.shape[0] - 1, 0)
digit = X.iloc[digit_index, :].values
digit_img = digit.reshape(28, 28)

# Display original digit image
st.write("### Original Image")
fig, ax = plt.subplots()
ax.imshow(digit_img, cmap=mpl.cm.binary)
ax.axis("off")
st.pyplot(fig)

# Function to shift the image
def shift_image(digit_img, x_shift, y_shift):
    return ndi_int.shift(digit_img, [x_shift, y_shift])

# Input for shifting the image
x_shift = st.sidebar.slider("Shift in X (horizontal)", -10, 10, 0)
y_shift = st.sidebar.slider("Shift in Y (vertical)", -10, 10, 0)

# Shift the image based on user input
shifted_image = shift_image(digit_img, x_shift, y_shift)

# Display shifted image
st.write("### Shifted Image")
fig_shifted, ax_shifted = plt.subplots()
ax_shifted.imshow(shifted_image, cmap=mpl.cm.binary)
ax_shifted.axis("off")
st.pyplot(fig_shifted)