save file

Author: javascript-2020

utils/editors/markdown-editor/html/main-menu/main-menu.html

@@ -0,0 +1,165 @@
+
+
+
+<main-menu v2.0 style='position:relative'>
+
+      <template shadowrootmode=open>
+      
+            <style>
+            
+  #icon
+    {padding:3px;width:20px;background:buttonface}
+  
+  .menu
+    {position:absolute;left:0;top:35px;}
+            
+            </style>
+            
+            <img id=icon class=icon src='data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAAAt1BMVEVHcEwbmPYcgfMchvQbsfkay/wbtvkbnfccefMayfwbmfYch/QchvQbtfkbmfYa1P0ddfIcivQcl/Ycj/Ubp/gcmfYdbPEbrvkazPwcmfYbqfgayfwayPwbv/sbvvobsvkazPwbqvga0fwbvPobtvocjvUbofcbpvccfPMcgPMcgvMdafAdbfEckfUbtvka0PwcfPIaxvsbwfsbvPodb/EcnPYclvYckfUbpvccjPQdd/IbofcbrPiPy8D0AAAAMHRSTlMAA/79/v7+5ycVZ3Y3h0xhu9jp8kFeF9OkVfQOrZi+Mh1z/iUJQ+/dx4fOYq7hybzs5xU1AAABIklEQVQ4y+2Ux3aDMBBFpTR6M92AwYB7S6EG/v+7MsJJnBBKVsnGdwHozT1HQgxC6MrfEkiSM+Y4khSgUxhazLDHWGF4QveAO2gyLnGQ9QS4wcDaXGJYiPGegVnU50UzUvdgTsd7AfrMaEaqXvO+sfAAHP0uzz+SmhCfR7FwB5gdpm+SyoeHEJ5P67o2tbanmRBP5/iSgFkUxaplaisIv3kAu6yqihK/RiIF0ZJtT6NTaZpS9iWwm0D/uXB7kmXZ5LOgN0O7ayvEQ57nKtssCbMqDA5i9+YulLIsVQ5MzKnwqCz6Phev3AIcxhy5K3x/A/DbG2CzIdctP9RS9PrxnTU92KOYll8bZHqs7Wk5AcY9hIx9kuyN3/xuxm5nXA+df+cNJSAgjMbiFSoAAAAASUVORK5CYII='>
+            
+            <div class=menu style='display:none'>      
+                  <div id=new class=menu-opt>new</div>
+                  <div id=fork class=menu-opt>fork</div>
+                  <div class=menu-sep></div>
+                  <div id=ex-1 class=menu-opt>example 1</div>
+                  <div class=menu-sep></div>
+                  <div id=source class=menu-opt>markdown editor source code</div>
+            </div>
+            
+      </template>
+
+
+
+      <script>
+        
+(function main_menu({mod,dom,host}){
+
+  var obj   = {
+        version   : 'v2.0',
+  };
+
+  
+        var $,menu,editor
+        ;
+        
+        obj.initmod   = function(params){
+          
+              $         = params.$;
+              editor    = params.editor;
+              menu      = params.menu;
+              
+        }//initmod
+  
+      
+  //vars:-
+  
+  
+        var click   = {};
+        
+        
+  //:
+
+  
+        obj.init    = function(){
+        }//init
+
+      
+  //:
+
+  
+        obj.initdom   = function(rootnode){
+        
+              var shadow                    = host.shadowRoot;
+  
+              var style                     = $(shadow,'style');
+              $.stylesheet.copyrule('#page-inline','.icon',style);
+              
+              menu.add.style(shadow);
+              
+              
+              var card                      = $(shadow,'.menu');
+              $(shadow,'#icon').onclick     = menu.click(card,false,false,click.menu);
+  
+  
+        }//initdom
+
+
+  //:
+
+
+        click.menu    = function(type,opt){
+  
+              if(type=='opt'){
+                    click.menu[opt.id]();
+              }
+  
+        }//menu
+  
+  
+        click.menu.new    = function(){
+  
+              var win   = window.open('');
+              return win;
+  
+        }//new
+  
+  
+        click.menu.fork   = function(){
+  
+              var win   = menu.new();
+              var txt   = editor.getValue();
+              win.postMessage({txt},'*');
+  
+        }//fork
+  
+  
+        click.menu.source   = function(){
+        
+              window.open('https://github.com/javascript-2020/javascript-2020.github.io/tree/main/utils/editors/markdown-editor');
+              
+        }//source
+      
+      
+        click.menu['ex-1']    = async function(){
+
+              var url   = 'https://raw.githubusercontent.com/javascript-2020/javascript-2020.github.io/main/utils/editors/markdown-editor/examples/example-1.md';          
+              var err;
+              try{
+              
+                    var res   = await fetch(url);
+                    
+              }//try
+              catch(err2){
+              
+                    err   = err2;
+                    
+              }//catch
+              if(err){
+                                                                                console.error(err);
+                    return;
+              }
+              if(!res.ok){
+                                                                                console.log('failed to load example 1',res.status);
+                    return;
+              }
+              
+              var txt   = await res.text();
+              editor.setValue(txt);
+              
+        }//ex-1
+      
+
+
+      
+  return obj;
+  
+})//main_menu
+                  
+        
+      </script>
+
+
+</main-menu>
+        
+        
+