zeus
4 years ago
9 changed files with 454 additions and 17 deletions
File diff suppressed because one or more lines are too long
@ -1 +1 @@ |
|||||
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Vue App</title><link href="/css/app.cfbfbafa.css" rel="preload" as="style"><link href="/css/chunk-vendors.8f6b4875.css" rel="preload" as="style"><link href="/js/app.eeab6a61.js" rel="preload" as="script"><link href="/js/chunk-vendors.07104166.js" rel="preload" as="script"><link href="/css/chunk-vendors.8f6b4875.css" rel="stylesheet"><link href="/css/app.cfbfbafa.css" rel="stylesheet"></head><body><div id="app"></div><script src="/js/chunk-vendors.07104166.js"></script><script src="/js/app.eeab6a61.js"></script></body></html> |
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Vue App</title><link href="/css/app.6543e159.css" rel="preload" as="style"><link href="/css/chunk-vendors.8f6b4875.css" rel="preload" as="style"><link href="/js/app.d3524308.js" rel="preload" as="script"><link href="/js/chunk-vendors.07104166.js" rel="preload" as="script"><link href="/css/chunk-vendors.8f6b4875.css" rel="stylesheet"><link href="/css/app.6543e159.css" rel="stylesheet"></head><body><div id="app"></div><script src="/js/chunk-vendors.07104166.js"></script><script src="/js/app.d3524308.js"></script></body></html> |
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,348 @@ |
|||||
|
<template> |
||||
|
<card class="card-user" style="max-height:100%"> |
||||
|
<div class="author"> |
||||
|
<img class="avatar border-white" src="@/assets/img/code-128.png" alt="..."> |
||||
|
</div> |
||||
|
<b-container fluid class="bv-example-row"> |
||||
|
<div class=" col text-center"> |
||||
|
<v-wait for="myRunInstance1"> |
||||
|
<template slot="waiting"> |
||||
|
<div> |
||||
|
<img src="@/assets/loading.gif" width="50" height="50" /> |
||||
|
Lab_Instance... |
||||
|
</div> |
||||
|
</template> |
||||
|
</v-wait> |
||||
|
<button type="button" |
||||
|
round |
||||
|
class="btn btn-outline-danger btn-sm" |
||||
|
v-if="extenderror" |
||||
|
@click="runextenderror()"> |
||||
|
Error: max depth exceeded</button> |
||||
|
<button type="button" |
||||
|
round |
||||
|
class="btn btn-outline-warning btn-sm" |
||||
|
v-if="tryConsole" |
||||
|
@click="clear()"> |
||||
|
Clear</button> |
||||
|
<button type="button" |
||||
|
round |
||||
|
class="btn btn-outline-info btn-sm" |
||||
|
disabled |
||||
|
> |
||||
|
Console</button> |
||||
|
<button type="button" |
||||
|
round |
||||
|
class="btn btn-outline-info btn-sm" |
||||
|
v-if="cmOptions.keyMap == 'sublime'" |
||||
|
@click="infoFilter"> |
||||
|
i</button> |
||||
|
|
||||
|
</div> |
||||
|
<div class="codemirror" > |
||||
|
<codemirror |
||||
|
ref="myCm" |
||||
|
:value="code" |
||||
|
:options="cmOptions" |
||||
|
@cursorActivity="onCmCursorActivity" |
||||
|
@ready="onCmReady" |
||||
|
@focus="onCmFocus" |
||||
|
@input="onCmCodeChange" |
||||
|
></codemirror> |
||||
|
</div> |
||||
|
</b-col> |
||||
|
</b-row> |
||||
|
</b-container> |
||||
|
|
||||
|
|
||||
|
</card> |
||||
|
</template> |
||||
|
<script> |
||||
|
import {mapState, mapGetters, mapActions,dispatch} from 'vuex' |
||||
|
import Vue from 'vue' |
||||
|
import store from '@/store/index' |
||||
|
|
||||
|
|
||||
|
import { codemirror } from 'vue-codemirror' |
||||
|
import JSZip from 'jszip'; |
||||
|
import FileSaver from 'file-saver'; |
||||
|
import 'codemirror/lib/codemirror.css' |
||||
|
import 'codemirror/theme/mdn-like.css' |
||||
|
import card from '@/components/Card.vue' |
||||
|
import 'codemirror/theme/idea.css' |
||||
|
import'codemirror/addon/selection/active-line.js' |
||||
|
|
||||
|
import'codemirror/addon/hint/show-hint.js' |
||||
|
import'codemirror/addon/hint/show-hint.css' |
||||
|
import'codemirror/addon/hint/javascript-hint.js' |
||||
|
import'codemirror/addon/selection/active-line.js' |
||||
|
import'codemirror/addon/scroll/annotatescrollbar.js' |
||||
|
import'codemirror/addon/search/matchesonscrollbar.js' |
||||
|
import'codemirror/addon/search/searchcursor.js' |
||||
|
import'codemirror/addon/search/match-highlighter.js' |
||||
|
|
||||
|
import'codemirror/mode/shell/shell.js' |
||||
|
import'codemirror/addon/edit/matchbrackets.js' |
||||
|
import'codemirror/addon/comment/comment.js' |
||||
|
import'codemirror/addon/dialog/dialog.js' |
||||
|
import'codemirror/addon/dialog/dialog.css' |
||||
|
import'codemirror/addon/search/searchcursor.js' |
||||
|
import'codemirror/addon/search/search.js' |
||||
|
import'codemirror/keymap/sublime.js' |
||||
|
import'codemirror/keymap/vim.js' |
||||
|
|
||||
|
import'codemirror/addon/fold/foldgutter.css' |
||||
|
import'codemirror/addon/fold/brace-fold.js' |
||||
|
import'codemirror/addon/fold/comment-fold.js' |
||||
|
import'codemirror/addon/fold/foldcode.js' |
||||
|
import'codemirror/addon/fold/foldgutter.js' |
||||
|
import'codemirror/addon/fold/indent-fold.js' |
||||
|
import'codemirror/addon/fold/markdown-fold.js' |
||||
|
import'codemirror/addon/fold/xml-fold.js' |
||||
|
import 'codemirror/lib/codemirror'; |
||||
|
import 'codemirror/addon/display/placeholder'; |
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
card, |
||||
|
codemirror |
||||
|
}, |
||||
|
data () { |
||||
|
return { |
||||
|
socketonline:false, |
||||
|
extenderror:false, |
||||
|
tryConsole:false, |
||||
|
ssl:{}, |
||||
|
getinfo:'', |
||||
|
token:'', |
||||
|
swarmlabname:'', |
||||
|
|
||||
|
code: '', |
||||
|
editchoice: '', |
||||
|
optionsedit: [ |
||||
|
{ text: 'code', value: 'code' }, |
||||
|
{ text: 'text', value: 'text' } |
||||
|
], |
||||
|
llodesc:[{ |
||||
|
llo_url : '', |
||||
|
llo_name : '', |
||||
|
llo_author : '', |
||||
|
llo_intro : '' |
||||
|
}], |
||||
|
llo:[{ |
||||
|
id : 0, |
||||
|
rm : false, |
||||
|
data_info : 'Asciidoc \n', |
||||
|
data_code : '#Your source code', |
||||
|
data_service : '', |
||||
|
code_datafile : 'url', |
||||
|
code_name : '', |
||||
|
code_exec : '', |
||||
|
code_options : '', |
||||
|
code_mime : '', |
||||
|
code_info : '', |
||||
|
code_code : '', |
||||
|
code_codeout : '', |
||||
|
code_codeoutput : 'console', |
||||
|
points : '', |
||||
|
challenge_question : '', |
||||
|
code_challenge_question : '', |
||||
|
challenge_answer : '', |
||||
|
challenge_answer_hint : '', |
||||
|
code_challenge_answer_hint : '', |
||||
|
challenge_answer_source : '', |
||||
|
challenge_answer_code_out : '', |
||||
|
challenge_answer_code : '', |
||||
|
code_challenge_answer_code : '' |
||||
|
}], |
||||
|
searchLLO: [], |
||||
|
searchLLOactive : false, |
||||
|
ADOC_html_code:'', |
||||
|
challenge:[], |
||||
|
action:'', |
||||
|
tryLLO:[], |
||||
|
service:'os2', |
||||
|
active:0, |
||||
|
activecount:0, |
||||
|
remove:'', |
||||
|
activeField:'', |
||||
|
bootstrap:false, |
||||
|
firstbootstrap:0, |
||||
|
htmlasciitmp:'', |
||||
|
datafile: 'https://git.swarmlab.io:3000/labs/examples-mpi2/raw/branch/master/0_netstat/data', |
||||
|
datadir: '0_netstat/data', |
||||
|
LearningObject:'', |
||||
|
showllo:true, |
||||
|
showlloedit:true, |
||||
|
selected: 'sublime', |
||||
|
options: [ |
||||
|
{ text: 'vim', value: 'vim' }, |
||||
|
{ text: 'sublime', value: 'sublime' } |
||||
|
], |
||||
|
optionsmime: [ |
||||
|
{ text: 'sh', value: 'bash' }, |
||||
|
{ text: 'javascript', value: 'javascript' }, |
||||
|
{ text: 'python', value: 'python' }, |
||||
|
{ text: 'php', value: 'php' }, |
||||
|
{ text: 'sql', value: 'sq;' }, |
||||
|
{ text: 'xml', value: 'xml' }, |
||||
|
{ text: 'c', value: 'c' } |
||||
|
], |
||||
|
pValidate: false, |
||||
|
cmOptions: { |
||||
|
tabSize: 2, |
||||
|
styleActiveLine: true, |
||||
|
lineNumbers: false, |
||||
|
lineSeparator:'\n', |
||||
|
line: true, |
||||
|
foldGutter: true, |
||||
|
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"], |
||||
|
highlightSelectionMatches: { showToken: /\w/, annotateScrollbar: true }, |
||||
|
styleSelectedText: true, |
||||
|
mode: 'shell', |
||||
|
hintOptions:{ |
||||
|
completeSingle: false |
||||
|
}, |
||||
|
keyMap: "sublime", |
||||
|
//keyMap: "vim", |
||||
|
matchBrackets: true, |
||||
|
showCursorWhenSelecting: true, |
||||
|
indentUnit:this.ADOC_html_code, |
||||
|
lineWrapping: true, |
||||
|
theme: 'idea', |
||||
|
//theme: 'mdn-like', |
||||
|
refresh:true, |
||||
|
readOnly: true, |
||||
|
autofocus: false, |
||||
|
extraKeys: { "Ctrl": "autocomplete" } |
||||
|
}, |
||||
|
ADOC_html:[] |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
clear () { |
||||
|
this.tryConsole = false |
||||
|
this.code = '' |
||||
|
}, |
||||
|
async getdata () { |
||||
|
|
||||
|
var field = this.getinfo |
||||
|
var log = await store.dispatch("pipelineLLO/get_data",{ |
||||
|
code:field |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
async showactive(index) { |
||||
|
this.topwindow(index) |
||||
|
}, |
||||
|
onCmReady(cm) { |
||||
|
cm.on('change', (cm, chg) => { |
||||
|
}), |
||||
|
cm.on('keypress', () => { |
||||
|
cm.showHint({completeSingle:false}) |
||||
|
}) |
||||
|
}, |
||||
|
onCmCursorActivity(a, b, c) { |
||||
|
}, |
||||
|
onCmFocus(cm) { |
||||
|
}, |
||||
|
onCmCodeChange(newCode) { |
||||
|
this.code = newCode |
||||
|
//this.$root.$emit('socket_add',this.code) |
||||
|
}, |
||||
|
handleChange() { |
||||
|
}, |
||||
|
setKeymap () { |
||||
|
this.cmOptions.keyMap = this.selected |
||||
|
}, |
||||
|
infoFilter() { |
||||
|
var title1='<h3>Playbook Images</h3>' |
||||
|
var winfop='<table class="table table-striped table-sm ">'+ |
||||
|
'<tr><td class="text-left">Shift-Tab</td> <td class="text-left">indentLess</td></tr>'+ |
||||
|
'<tr><td class="text-left">Alt-Q</td> <td class="text-left">wrapLines</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-Up</td> <td class="text-left">scrollLineUp</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-Down</td> <td class="text-left">scrollLineDown</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-L</td> <td class="text-left">selectLine</td></tr>'+ |
||||
|
'<tr><td class="text-left">Esc</td> <td class="text-left">singleSelectionTop</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-Enter</td> <td class="text-left">insertLineAfter</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-D</td> <td class="text-left">selectNextOccurrence</td></tr>'+ |
||||
|
'<tr><td class="text-left">Shift-Ctrl-Space</td> <td class="text-left">selectScope</td></tr>'+ |
||||
|
'<tr><td class="text-left">Shift-Ctrl-M</td> <td class="text-left">selectBetweenBrackets</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-M</td> <td class="text-left">goToBracket</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-Y</td> <td class="text-left">sublimeYank</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-C</td> <td class="text-left">showInCenter</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-G</td> <td class="text-left">clearBookmarks</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-Backspace</td> <td class="text-left">delLineLeft</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-0</td> <td class="text-left">unfoldAll</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-K Ctrl-J</td> <td class="text-left">unfoldAll</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-Alt-Up</td> <td class="text-left">addCursorToPrevLine</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-Alt-Down</td> <td class="text-left">addCursorToNextLine</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-F3</td> <td class="text-left">findUnder</td></tr>'+ |
||||
|
'<tr><td class="text-left">Shift-Ctrl-F3</td> <td class="text-left">findUnderPrevious</td></tr>'+ |
||||
|
'<tr><td class="text-left">Shift-Ctrl-[</td> <td class="text-left">fold</td></tr>'+ |
||||
|
'<tr><td class="text-left">Shift-Ctrl-]</td> <td class="text-left">unfold</td></tr>'+ |
||||
|
'<tr><td class="text-left">Ctrl-F</td> <td class="text-left">find</td></tr>'+ |
||||
|
'</table>' |
||||
|
|
||||
|
var title1='' |
||||
|
var winfo='' |
||||
|
this.$swal({ |
||||
|
title: '<strong>Key bindings</strong>', |
||||
|
type: 'info', |
||||
|
html: winfop+title1+winfo, |
||||
|
showCloseButton: true, |
||||
|
showLoaderOnConfirm: false, |
||||
|
allowOutsideClick: false |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
computed: { |
||||
|
codemirror() { |
||||
|
return this.$refs.myCm.codemirror |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
mounted() { |
||||
|
// from runLLO |
||||
|
this.$root.$on('hybrid_server_log_status', (v) => { |
||||
|
this.$nextTick(function () { |
||||
|
if(v == 'off'){ |
||||
|
this.socketonline = false |
||||
|
}else if(v == 'on'){ |
||||
|
this.socketonline = true |
||||
|
} |
||||
|
}) |
||||
|
}) |
||||
|
// from runLLO |
||||
|
this.$root.$on('hybrid_server_log_in', (log) => { |
||||
|
console.log('logsemiton '+JSON.stringify(log)) |
||||
|
this.code += log |
||||
|
this.code += "\n" |
||||
|
this.tryConsole=true |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
beforeDestroy () { |
||||
|
this.$root.$off('hybrid_server_log_status') |
||||
|
this.$root.$off('hybrid_server_log_in') |
||||
|
}, |
||||
|
|
||||
|
created () { |
||||
|
this.token = new URL(location.href).searchParams.get('token'); |
||||
|
this.swarmlabname = new URL(location.href).searchParams.get('pipelinename'); |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
.CodeMirror { |
||||
|
|
||||
|
|
||||
|
font-family: monospace; |
||||
|
height: 350px; |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue