Spaces:
Sleeping
Sleeping
import streamlit as st | |
import io | |
from streamlit_ace import st_ace | |
from utils import convert_file | |
# Language dictionary | |
LANG = { | |
'en': { | |
'title': "📊 Jupytext Demo App", | |
'info': "This app demonstrates the main features of Jupytext. " | |
"You can convert between Python (.py), Jupyter Notebook (.ipynb), and Markdown (.md) files. " | |
"Try different conversion options to experience the flexibility of Jupytext.", | |
'upload_header': "📁 File Upload", | |
'upload_label': "Choose a file to convert", | |
'file_uploaded': "✅ File successfully uploaded!", | |
'conversion_options': "🛠️ Conversion Options", | |
'output_format': "Output Format", | |
'py_format': "Python File Format", | |
'py_format_help': "percent: Use Jupyter cell markers, light: Simple markers, nomarker: No markers", | |
'comment_magics': "Comment out magic commands", | |
'comment_magics_help': "Only applies to Python output", | |
'convert_button': "🔄 Convert", | |
'conversion_success': "✅ Conversion successful!", | |
'download_button': "📥 Download Converted File", | |
'preview_header': "👀 Conversion Result Preview", | |
'conversion_error': "❌ An error occurred during conversion: ", | |
'about_header': "ℹ️ About Jupytext", | |
'about_text': ("Jupytext is a tool for converting between Jupyter Notebooks and various text-based formats " | |
"(Python scripts, Markdown documents, etc.). Main features include:\n\n" | |
"- Read and write Jupyter Notebooks (.ipynb).\n" | |
"- Read and write Python scripts (.py) in Jupyter Notebook format.\n" | |
"- Read and write Markdown files (.md) in Jupyter Notebook format.\n" | |
"- Support multiple Python script formats (percent, light, nomarker, etc.).\n" | |
"- Advanced conversion options like magic command processing and metadata retention.\n\n" | |
"This demo app lets you experience Jupytext's basic conversion features. For more detailed information " | |
"and advanced usage, please refer to the " | |
"<a href='https://jupytext.readthedocs.io/' target='_blank'>official Jupytext documentation</a>."), | |
'usage_header': "📝 How to Use", | |
'usage_text': """ | |
1. Upload a file (.py, .ipynb, .md) you want to convert. | |
2. Select the desired output format. | |
3. For Python files, choose the format (percent, light, nomarker). | |
4. Set additional options if needed. | |
5. Click the "Convert" button. | |
6. Download the converted file or check the content in the preview. | |
Try various input files and settings to explore Jupytext's capabilities! | |
""" | |
}, | |
'ja': { | |
'title': "📊 Jupytext デモアプリ", | |
'info': "このアプリは Jupytext の主要な機能をデモンストレーションします。" | |
"Python (.py)、Jupyter Notebook (.ipynb)、Markdown (.md) ファイルを相互に変換できます。" | |
"さまざまな変換オプションを試して、Jupytext の柔軟性を体験してください。", | |
'upload_header': "📁 ファイルアップロード", | |
'upload_label': "変換するファイルを選択してください", | |
'file_uploaded': "✅ ファイルが正常にアップロードされました!", | |
'conversion_options': "🛠️ 変換オプション", | |
'output_format': "出力形式", | |
'py_format': "Python ファイルの形式", | |
'py_format_help': "percent: Jupyter の cell マーカーを使用, light: シンプルなマーカー, nomarker: マーカーなし", | |
'comment_magics': "マジックコマンドをコメントアウト", | |
'comment_magics_help': "Python出力の場合のみ適用されます", | |
'convert_button': "🔄 変換", | |
'conversion_success': "✅ 変換が成功しました!", | |
'download_button': "📥 変換されたファイルをダウンロード", | |
'preview_header': "👀 変換結果プレビュー", | |
'conversion_error': "❌ 変換中にエラーが発生しました: ", | |
'about_header': "ℹ️ Jupytext について", | |
'about_text': ("Jupytext は Jupyter Notebooks と様々なテキストベースの形式(Python スクリプト、Markdown ドキュメントなど)の間で" | |
"変換を行うツールです。主な特徴は以下の通りです:\n\n" | |
"- Jupyter Notebooks (.ipynb) を読み書きできます。\n" | |
"- Python スクリプト (.py) を Jupyter Notebooks 形式で読み書きできます。\n" | |
"- Markdown ファイル (.md) を Jupyter Notebooks 形式で読み書きできます。\n" | |
"- 複数の Python スクリプト形式をサポートしています(percent、light、nomarker など)。\n" | |
"- マジックコマンドの処理やメタデータの保持など、高度な変換オプションを提供します。\n\n" | |
"このデモアプリでは、Jupytext の基本的な変換機能を体験できます。より詳細な情報や高度な使用方法については、" | |
"<a href='https://jupytext.readthedocs.io/' target='_blank'>Jupytext の公式ドキュメント</a> を参照してください。"), | |
'usage_header': "📝 使用方法", | |
'usage_text': """ | |
1. 変換したいファイル (.py, .ipynb, .md) をアップロードします。 | |
2. 目的の出力形式を選択します。 | |
3. Python ファイルの場合、形式(percent、light、nomarker)を選択します。 | |
4. 必要に応じて、追加のオプションを設定します。 | |
5. 「変換」ボタンをクリックします。 | |
6. 変換されたファイルをダウンロードするか、プレビューで内容を確認します。 | |
さまざまな入力ファイルと設定を試して、Jupytext の機能を探索してください! | |
""" | |
} | |
} | |
# ページ設定 | |
st.set_page_config(page_title="Jupytext Demo App", page_icon="📊", layout="wide") | |
# スタイルシートの読み込み | |
with open('style.css') as f: | |
st.markdown(f'<style>{f.read()}</style>', unsafe_allow_html=True) | |
# 言語選択 | |
lang = st.selectbox("Language / 言語", ["English", "日本語"]) | |
lang_code = 'en' if lang == "English" else 'ja' | |
# メインアプリ | |
st.markdown(f"<h1 class='main-header'>{LANG[lang_code]['title']}</h1>", unsafe_allow_html=True) | |
st.markdown(f""" | |
<div class="info-box"> | |
{LANG[lang_code]['info']} | |
</div> | |
""", unsafe_allow_html=True) | |
st.markdown(f"<h2 class='sub-header'>{LANG[lang_code]['upload_header']}</h2>", unsafe_allow_html=True) | |
col1, col2 = st.columns([2, 1]) | |
with col1: | |
uploaded_file = st.file_uploader(LANG[lang_code]['upload_label'], type=["py", "ipynb", "md"]) | |
with col2: | |
st.markdown("<br>", unsafe_allow_html=True) # 空白を追加してアライメントを調整 | |
if uploaded_file is not None: | |
st.markdown(f"<div class='success-box'>{LANG[lang_code]['file_uploaded']}</div>", unsafe_allow_html=True) | |
if uploaded_file is not None: | |
st.markdown(f"<h2 class='sub-header'>{LANG[lang_code]['conversion_options']}</h2>", unsafe_allow_html=True) | |
col1, col2, col3 = st.columns(3) | |
with col1: | |
output_format = st.selectbox( | |
LANG[lang_code]['output_format'], | |
["py", "ipynb", "md"], | |
format_func=lambda x: f".{x}" | |
) | |
with col2: | |
py_format = st.selectbox( | |
LANG[lang_code]['py_format'], | |
["percent", "light", "nomarker"], | |
help=LANG[lang_code]['py_format_help'] | |
) | |
with col3: | |
comment_magics = st.checkbox(LANG[lang_code]['comment_magics'], value=True, help=LANG[lang_code]['comment_magics_help']) | |
config = { | |
"py_format": py_format, | |
"comment_magics": comment_magics | |
} | |
if st.button(LANG[lang_code]['convert_button'], key="convert_button"): | |
try: | |
converted_content, output_filename = convert_file(uploaded_file, output_format, config) | |
st.markdown(f"<div class='success-box'>{LANG[lang_code]['conversion_success']}</div>", unsafe_allow_html=True) | |
st.download_button( | |
label=LANG[lang_code]['download_button'], | |
data=converted_content, | |
file_name=output_filename, | |
mime="application/octet-stream" | |
) | |
st.markdown(f"<h2 class='sub-header'>{LANG[lang_code]['preview_header']}</h2>", unsafe_allow_html=True) | |
preview = io.StringIO(converted_content.decode('utf-8')).getvalue() | |
# エディタでプレビューを表示 | |
st_ace(value=preview, language=output_format, theme="tomorrow", key="preview_editor") | |
except Exception as e: | |
st.markdown(f"<div class='error-box'>{LANG[lang_code]['conversion_error']}{str(e)}</div>", unsafe_allow_html=True) | |
st.markdown(f"<h2 class='sub-header'>{LANG[lang_code]['about_header']}</h2>", unsafe_allow_html=True) | |
st.markdown(f""" | |
<div class="info-box"> | |
{LANG[lang_code]['about_text']} | |
</div> | |
""", unsafe_allow_html=True) | |
st.markdown(f"<h2 class='sub-header'>{LANG[lang_code]['usage_header']}</h2>", unsafe_allow_html=True) | |
st.markdown(LANG[lang_code]['usage_text']) | |