save file

Author: javascript-2020

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

@@ -0,0 +1,192 @@
+
+
+
+<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=clear class=menu-opt>clear</div>
+                  <div id=new class=menu-opt>new</div>
+                  <div id=fork class=menu-opt>fork</div>
+                  <div class=menu-sep></div>
+                  <div id=source class=menu-opt>html editor source code</div>
+                  <div class=menu-sep></div>
+                  <div id=create-html-icon class=menu-opt>create html icon</div>
+            </div>
+            
+      </template>
+
+
+
+      <script>
+        
+(function main_menu({mod,dom,host}){
+
+  var obj   = {
+        version   : 'v2.0',
+  };
+
+      var df=true
+      ;
+      
+      var $,editor,menu,filemod
+      ;
+      
+      obj.initmod   = function(params){
+        
+            $         = params.$;
+            editor    = params.editor;
+            menu      = params.menu;
+            filemod   = params.filemod;
+            
+      }//initomd
+
+      
+  //vars:-
+  
+  
+      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);
+
+
+      }//initdom
+
+
+//:
+
+
+      function click(type,opt){
+
+            if(type=='opt'){
+                  click[opt.id]();
+            }
+
+      }//menu
+
+
+      click.clear    = function(){
+        
+            filemod.clear();
+            editor.clear();
+            editor.filename.clear();
+            
+      }//clear
+      
+      
+      click.new    = function(){
+
+            var url       = window.location.toString();
+            var search    = window.location.search;
+            if(search){
+                  url     = url.slice(0,-search.length);
+            }
+
+            var win   = window.open(url);
+            return win;
+
+      }//new
+
+
+      click.fork   = function(){
+
+            var win   = newwin();
+            var txt   = editor.getValue();
+            win.postMessage({txt},'*');
+
+      }//fork
+
+
+      click.trim   = function(){
+
+            var pos     = editor.getCursorPosition();
+            var txt     = editor.getValue();
+            var lines   = txt.split('\n');
+            lines       = lines.map(line=>line.trimEnd());
+            txt         = lines.join('\n');
+            editor.setValue(txt,-1);
+            editor.gotoLine(pos.row,pos.column);
+
+      }//trim
+      
+      
+      click['create-html-icon']    = async function(){
+      
+            var err;
+            try{
+            
+                  var url   = 'https://raw.githubusercontent.com/javascript-2020/javascript-2020.github.io/main/utils/html-editor/mods/create-html-icon/create-html-icon.html';
+                  var res   = await fetch(url);
+                  
+            }
+            catch(err2){
+            
+                  err   = err2;
+                  
+            }
+            if(err){
+                  log.error(err);
+                  return;
+            }
+            
+            var txt   = await res.text();
+            if(!res.ok){
+                  log.red(txt);
+                  return;
+            }
+
+            editor.set(txt);
+            
+      }//create-html-icon
+      
+      
+      click.source   = function(){
+      
+            window.open('https://github.com/javascript-2020/javascript-2020.github.io/tree/main/utils/html-editor');
+            
+      }//source
+
+
+
+      
+  return obj;
+  
+})//main_menu
+                  
+        
+      </script>
+
+
+</main-menu>
+        
+        
+