TC
/
arozos


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
							<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="ArozOS Photo" />
    <title>Photo</title>
    <link rel="stylesheet" href="../script/semantic/semantic.min.css">
    <script src="../script/alpine.min.js"></script>
    <script src="../script/jquery.min.js"></script>
    <script src="../script/semantic/semantic.min.js"></script>
    <script src="../script/ao_module.js"></script>
    <script src="photo.js"></script>
    <style>
 
    </style>
    
</head>
<body>

    <div class="ui left vertical menu" id="menu">
        <div class="item">
            <img class="ui fluid image" src="img/banner.png">
        </div>
        <div class="item">
            Browse Photos
            <div class="menu">
                <a class="active item">user:/</a>
            </div>
        </div>

        <div class="item">
            Tags by AI
            <div class="menu">
                <a class="active item">#a</a>
                <a class="item">#b</a>
                <a class="item">#c</a>
                <a class="item">See More</a>
            </div>
        </div>
       
        
    </div>

    <div class="ui segment" x-data='folderObject()' x-init="init()">
        <div class="ui six cards viewbox">
            <template x-for="image in images">
                <div class="ui small card" x-on:click="showImage($el);" :filedata="encodeURIComponent(JSON.stringify({'filename':image.split('/').pop(),'filepath':image}))"> 
                    <a class="image" >
                        <img :src="'../system/file_system/loadThumbnail?bytes=true&vpath=' + image">
                    </a>
                </div>
            </template>
        </div>
        <button x-on:click="updateRenderingPath('user:/Photo/油圖/*.jpg');">Click Me</button>
    </div>
    <script>
        $(window).on("resize", function(){
            if (window.innerWidth < 500){
                $(".viewbox").attr("class", "ui three cards viewbox");
            }else if (window.innerWidth < 800){
                $(".viewbox").attr("class", "ui four cards viewbox");
            }else if (window.innerWidth < 1200){
                $(".viewbox").attr("class", "ui six cards viewbox");
            }else{
                $(".viewbox").attr("class", "ui ten cards viewbox");
            }
        });
    </script>
</body>
</html>