This commit is contained in:
@@ -70,17 +70,17 @@ CURRENT TODOs
|
||||
|
||||
todo: Fix the above, then retest on all devices locally to ensure it's working properly
|
||||
|
||||
todo: Picture input in attachments
|
||||
https://rockfish.ayanova.com/default.htm#!/rfcaseEdit/2080
|
||||
https://w3c.github.io/html-media-capture/#examples
|
||||
todo: attachment reveal button looks weird below wiki reveal button when read-write
|
||||
- open read only see if it looks better if they're teh same and make it so with wiki or
|
||||
- make the attach like the wiki
|
||||
- Buttons would be more compact and share the title area so maybe that's teh way to go
|
||||
|
||||
todo: have a look at ordering the file list in attachments
|
||||
- people might want to see them in order or not.
|
||||
- when doing an image the ipad just calls it image.jpg, could be more than one how to find in the list
|
||||
(or they should just make a note maybe)
|
||||
|
||||
todo: rotate photos? how to handle? (user figure out kind of thing, like always have the camera tilted x way or something?)
|
||||
|
||||
|
||||
todo: User options input photo?
|
||||
- and show the photo on the list menu and in internal message etc?
|
||||
- Not critical but flashy for sure
|
||||
@@ -91,10 +91,7 @@ todo: have a look at this: devices and sensors specs
|
||||
https://www.w3.org/wiki/DAS/Implementations
|
||||
https://wpt.fyi/results/?label=experimental&label=master&aligned
|
||||
|
||||
todo: attachment reveal button looks weird below wiki reveal button when read-write
|
||||
- open read only see if it looks better if they're teh same and make it so with wiki or
|
||||
- make the attach like the wiki
|
||||
- Buttons would be more compact and share the title area so maybe that's teh way to go
|
||||
|
||||
|
||||
todo: Look at attachment saving code on server, should it zip?
|
||||
|
||||
|
||||
@@ -1,327 +1,317 @@
|
||||
<template>
|
||||
<div class="mt-6">
|
||||
<template v-if="readonly">
|
||||
<div>
|
||||
<v-btn depressed tile @click="switchView()">
|
||||
Wiki<v-icon right>{{ switchViewIcon() }}</v-icon></v-btn
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<v-btn depressed tile @click="toggleReveal">
|
||||
Wiki<v-icon v-text="reveal ? 'fa-eye-slash' : 'fa-eye'" right></v-icon
|
||||
></v-btn>
|
||||
</div>
|
||||
<template v-if="reveal">
|
||||
<template v-if="!readonly">
|
||||
<div class="mt-2">
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.WIKI_VIEW"
|
||||
@click="currentView = view.WIKI_VIEW"
|
||||
>
|
||||
<v-icon>fa-eye</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.DESIGN_VIEW"
|
||||
@click="currentView = view.DESIGN_VIEW"
|
||||
>
|
||||
<v-icon>fa-edit</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.SPLIT_VIEW"
|
||||
@click="currentView = view.SPLIT_VIEW"
|
||||
>
|
||||
<v-icon>fa-columns</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
</template>
|
||||
<v-sheet
|
||||
v-if="currentView != this.view.HIDDEN_VIEW"
|
||||
elevation="2"
|
||||
class="aywiki pa-2 pa-sm-6 mt-2"
|
||||
>
|
||||
<v-row v-resize="onResize">
|
||||
<!-- BUTTONS -->
|
||||
<v-col v-if="showDesigner()" :cols="12">
|
||||
<div>
|
||||
<v-btn depressed tile @click="editClick('bold')">
|
||||
<v-icon>fa-bold</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('italic')">
|
||||
<v-icon>fa-italic</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('strike')">
|
||||
<v-icon>fa-strikethrough</v-icon></v-btn
|
||||
>
|
||||
|
||||
<!-- HEADINGS -->
|
||||
<v-menu offset-y>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn depressed tile v-on="on">
|
||||
<v-icon>fa-heading</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list>
|
||||
<v-list-item @click="editClick('heading', 1)">
|
||||
<v-list-item-title
|
||||
><h1>{{ $ay.t("Heading") }} 1</h1></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 2)">
|
||||
<v-list-item-title
|
||||
><h2>{{ $ay.t("Heading") }} 2</h2></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 3)">
|
||||
<v-list-item-title
|
||||
><h3>{{ $ay.t("Heading") }} 3</h3></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 4)">
|
||||
<v-list-item-title
|
||||
><h4>{{ $ay.t("Heading") }} 4</h4></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 5)">
|
||||
<v-list-item-title
|
||||
><h5>{{ $ay.t("Heading") }} 5</h5></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 6)">
|
||||
<v-list-item-title
|
||||
><h6>{{ $ay.t("Heading") }} 6</h6></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
<!-- /HEADINGS -->
|
||||
|
||||
<!-- MORE BUTTONS -->
|
||||
<v-btn depressed tile class="ml-1" @click="editClick('line')">
|
||||
<v-icon>fa-minus</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('quote')">
|
||||
<v-icon>fa-quote-left</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('ul')">
|
||||
<v-icon>fa-list-ul</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('ol')">
|
||||
<v-icon>fa-list-ol</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('task')">
|
||||
<v-icon>fa-check-square</v-icon></v-btn
|
||||
>
|
||||
|
||||
<!-- TABLES -->
|
||||
<v-menu
|
||||
v-model="tableMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn depressed tile class="ml-1" v-on="on">
|
||||
<v-icon>fa-table</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-card width="300">
|
||||
<v-card-title>{{ $ay.t("Table") }}</v-card-title>
|
||||
|
||||
<div class="ma-8">
|
||||
<v-slider
|
||||
thumb-size="24"
|
||||
thumb-label="always"
|
||||
v-model="tableMenuColumns"
|
||||
min="1"
|
||||
max="10"
|
||||
prepend-icon="fa-arrows-alt-h"
|
||||
></v-slider>
|
||||
|
||||
<v-slider
|
||||
prepend-icon="fa-arrows-alt-v"
|
||||
class="mt-8"
|
||||
thumb-size="24"
|
||||
thumb-label="always"
|
||||
v-model="tableMenuRows"
|
||||
min="1"
|
||||
max="15"
|
||||
></v-slider>
|
||||
</div>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
|
||||
<v-btn text @click="tableMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn color="primary" text @click="editClick('table')">{{
|
||||
$ay.t("OK")
|
||||
}}</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
<!-- /TABLES -->
|
||||
|
||||
<!-- LINK -->
|
||||
<v-btn depressed tile @click="openLinkMenu">
|
||||
<v-icon>fa-link</v-icon>
|
||||
</v-btn>
|
||||
<v-menu
|
||||
min-width="300"
|
||||
v-model="linkMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
:position-x="menuX"
|
||||
:position-y="menuY"
|
||||
absolute
|
||||
>
|
||||
<v-card width="300">
|
||||
<v-card-title>{{ $ay.t("InsertLink") }}</v-card-title>
|
||||
|
||||
<div class="ma-8">
|
||||
<v-text-field
|
||||
v-model="linkUrl"
|
||||
:label="$ay.t('LinkUrl')"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
v-model="linkText"
|
||||
:label="$ay.t('LinkText')"
|
||||
></v-text-field>
|
||||
</div>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
|
||||
<v-btn text @click="linkMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn color="primary" text @click="editClick('link')">{{
|
||||
$ay.t("OK")
|
||||
}}</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
<!-- /LINKS -->
|
||||
|
||||
<!-- IMAGE -->
|
||||
|
||||
<v-btn depressed tile @click="openImageMenu">
|
||||
<v-icon>fa-image</v-icon>
|
||||
</v-btn>
|
||||
<v-menu
|
||||
min-width="360"
|
||||
v-model="imageMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
:position-x="menuX"
|
||||
:position-y="menuY"
|
||||
absolute
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>{{ $ay.t("InsertImage") }}</v-card-title>
|
||||
<div>
|
||||
<v-tabs v-model="imageTab" grow color="primary">
|
||||
<v-tab key="url">URL</v-tab>
|
||||
<v-tab key="file">{{ $ay.t("Attachments") }}</v-tab>
|
||||
<v-tabs-items v-model="imageTab">
|
||||
<v-tab-item key="url"
|
||||
><div class="ma-6">
|
||||
<v-text-field
|
||||
v-model="imageUrl"
|
||||
:label="$ay.t('ImageUrl')"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
v-model="imageText"
|
||||
:label="$ay.t('ImageDescription')"
|
||||
></v-text-field></div
|
||||
></v-tab-item>
|
||||
<v-tab-item key="file"
|
||||
><div class="ma-6">
|
||||
<v-select
|
||||
@click="getAttachments"
|
||||
:label="$ay.t('Attachments')"
|
||||
v-model="selectedImageAttachment"
|
||||
:items="attachments"
|
||||
item-text="name"
|
||||
item-value="id"
|
||||
return-object
|
||||
></v-select>
|
||||
|
||||
<v-text-field
|
||||
v-model="imageText"
|
||||
:label="$ay.t('ImageDescription')"
|
||||
></v-text-field></div
|
||||
></v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-tabs>
|
||||
</div>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn text @click="imageMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
text
|
||||
@click="editClick('image', imageTab)"
|
||||
>{{ $ay.t("OK") }}</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
|
||||
<!-- /IMAGE -->
|
||||
|
||||
<!-- CODE -->
|
||||
<v-btn depressed tile class="ml-1" @click="editClick('code')">
|
||||
<v-icon>fa-code</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('codeblock')">
|
||||
<v-icon>fa-square-full</v-icon></v-btn
|
||||
>
|
||||
<!-- END OF BUTTONS -->
|
||||
</div>
|
||||
</v-col>
|
||||
<!-- DESIGNER -->
|
||||
<v-col
|
||||
v-if="showDesigner()"
|
||||
:cols="currentView == view.SPLIT_VIEW ? 6 : 12"
|
||||
>
|
||||
<div :style="editStyle()">
|
||||
<v-textarea
|
||||
v-cloak
|
||||
@drop.prevent="onDrop"
|
||||
@dragover.prevent
|
||||
solo
|
||||
no-resize
|
||||
:height="editAreaHeight"
|
||||
ref="editArea"
|
||||
@input="handleInput"
|
||||
@dblclick="handleDoubleClick"
|
||||
v-model="localVal"
|
||||
></v-textarea>
|
||||
</div>
|
||||
</v-col>
|
||||
<!-- WIKI auto-grow-->
|
||||
<v-col
|
||||
v-if="showWiki()"
|
||||
:cols="currentView == view.SPLIT_VIEW ? 6 : 12"
|
||||
>
|
||||
<div
|
||||
:style="wikiStyle()"
|
||||
class="markdown-body"
|
||||
v-html="compiledOutput()"
|
||||
></div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-sheet>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class="v-label v-label--active theme--light">
|
||||
Wiki
|
||||
</span>
|
||||
<div class="mt-2">
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.HIDDEN_VIEW"
|
||||
@click="currentView = view.HIDDEN_VIEW"
|
||||
>
|
||||
<v-icon>fa-eye-slash</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.WIKI_VIEW"
|
||||
@click="currentView = view.WIKI_VIEW"
|
||||
>
|
||||
<v-icon>fa-eye</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.DESIGN_VIEW"
|
||||
@click="currentView = view.DESIGN_VIEW"
|
||||
>
|
||||
<v-icon>fa-edit</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
:outlined="currentView == view.SPLIT_VIEW"
|
||||
@click="currentView = view.SPLIT_VIEW"
|
||||
>
|
||||
<v-icon>fa-columns</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
</template>
|
||||
<v-sheet
|
||||
v-if="currentView != this.view.HIDDEN_VIEW"
|
||||
elevation="2"
|
||||
class="aywiki pa-2 pa-sm-6 mt-2"
|
||||
>
|
||||
<v-row v-resize="onResize">
|
||||
<!-- BUTTONS -->
|
||||
<v-col v-if="showDesigner()" :cols="12">
|
||||
<div>
|
||||
<v-btn depressed tile @click="editClick('bold')">
|
||||
<v-icon>fa-bold</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('italic')">
|
||||
<v-icon>fa-italic</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('strike')">
|
||||
<v-icon>fa-strikethrough</v-icon></v-btn
|
||||
>
|
||||
|
||||
<!-- HEADINGS -->
|
||||
<v-menu offset-y>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn depressed tile v-on="on">
|
||||
<v-icon>fa-heading</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list>
|
||||
<v-list-item @click="editClick('heading', 1)">
|
||||
<v-list-item-title
|
||||
><h1>{{ $ay.t("Heading") }} 1</h1></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 2)">
|
||||
<v-list-item-title
|
||||
><h2>{{ $ay.t("Heading") }} 2</h2></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 3)">
|
||||
<v-list-item-title
|
||||
><h3>{{ $ay.t("Heading") }} 3</h3></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 4)">
|
||||
<v-list-item-title
|
||||
><h4>{{ $ay.t("Heading") }} 4</h4></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 5)">
|
||||
<v-list-item-title
|
||||
><h5>{{ $ay.t("Heading") }} 5</h5></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-list-item @click="editClick('heading', 6)">
|
||||
<v-list-item-title
|
||||
><h6>{{ $ay.t("Heading") }} 6</h6></v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
<!-- /HEADINGS -->
|
||||
|
||||
<!-- MORE BUTTONS -->
|
||||
<v-btn depressed tile class="ml-1" @click="editClick('line')">
|
||||
<v-icon>fa-minus</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('quote')">
|
||||
<v-icon>fa-quote-left</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('ul')">
|
||||
<v-icon>fa-list-ul</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('ol')">
|
||||
<v-icon>fa-list-ol</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('task')">
|
||||
<v-icon>fa-check-square</v-icon></v-btn
|
||||
>
|
||||
|
||||
<!-- TABLES -->
|
||||
<v-menu
|
||||
v-model="tableMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn depressed tile class="ml-1" v-on="on">
|
||||
<v-icon>fa-table</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-card width="300">
|
||||
<v-card-title>{{ $ay.t("Table") }}</v-card-title>
|
||||
|
||||
<div class="ma-8">
|
||||
<v-slider
|
||||
thumb-size="24"
|
||||
thumb-label="always"
|
||||
v-model="tableMenuColumns"
|
||||
min="1"
|
||||
max="10"
|
||||
prepend-icon="fa-arrows-alt-h"
|
||||
></v-slider>
|
||||
|
||||
<v-slider
|
||||
prepend-icon="fa-arrows-alt-v"
|
||||
class="mt-8"
|
||||
thumb-size="24"
|
||||
thumb-label="always"
|
||||
v-model="tableMenuRows"
|
||||
min="1"
|
||||
max="15"
|
||||
></v-slider>
|
||||
</div>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
|
||||
<v-btn text @click="tableMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn color="primary" text @click="editClick('table')">{{
|
||||
$ay.t("OK")
|
||||
}}</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
<!-- /TABLES -->
|
||||
|
||||
<!-- LINK -->
|
||||
<v-btn depressed tile @click="openLinkMenu">
|
||||
<v-icon>fa-link</v-icon>
|
||||
</v-btn>
|
||||
<v-menu
|
||||
min-width="300"
|
||||
v-model="linkMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
:position-x="menuX"
|
||||
:position-y="menuY"
|
||||
absolute
|
||||
>
|
||||
<v-card width="300">
|
||||
<v-card-title>{{ $ay.t("InsertLink") }}</v-card-title>
|
||||
|
||||
<div class="ma-8">
|
||||
<v-text-field
|
||||
v-model="linkUrl"
|
||||
:label="$ay.t('LinkUrl')"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
v-model="linkText"
|
||||
:label="$ay.t('LinkText')"
|
||||
></v-text-field>
|
||||
</div>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
|
||||
<v-btn text @click="linkMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn color="primary" text @click="editClick('link')">{{
|
||||
$ay.t("OK")
|
||||
}}</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
<!-- /LINKS -->
|
||||
|
||||
<!-- IMAGE -->
|
||||
|
||||
<v-btn depressed tile @click="openImageMenu">
|
||||
<v-icon>fa-image</v-icon>
|
||||
</v-btn>
|
||||
<v-menu
|
||||
min-width="360"
|
||||
v-model="imageMenu"
|
||||
:close-on-content-click="false"
|
||||
offset-y
|
||||
:position-x="menuX"
|
||||
:position-y="menuY"
|
||||
absolute
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>{{ $ay.t("InsertImage") }}</v-card-title>
|
||||
<div>
|
||||
<v-tabs v-model="imageTab" grow color="primary">
|
||||
<v-tab key="url">URL</v-tab>
|
||||
<v-tab key="file">{{ $ay.t("Attachments") }}</v-tab>
|
||||
<v-tabs-items v-model="imageTab">
|
||||
<v-tab-item key="url"
|
||||
><div class="ma-6">
|
||||
<v-text-field
|
||||
v-model="imageUrl"
|
||||
:label="$ay.t('ImageUrl')"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
v-model="imageText"
|
||||
:label="$ay.t('ImageDescription')"
|
||||
></v-text-field></div
|
||||
></v-tab-item>
|
||||
<v-tab-item key="file"
|
||||
><div class="ma-6">
|
||||
<v-select
|
||||
@click="getAttachments"
|
||||
:label="$ay.t('Attachments')"
|
||||
v-model="selectedImageAttachment"
|
||||
:items="attachments"
|
||||
item-text="name"
|
||||
item-value="id"
|
||||
return-object
|
||||
></v-select>
|
||||
|
||||
<v-text-field
|
||||
v-model="imageText"
|
||||
:label="$ay.t('ImageDescription')"
|
||||
></v-text-field></div
|
||||
></v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-tabs>
|
||||
</div>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn text @click="imageMenu = false">{{
|
||||
$ay.t("Cancel")
|
||||
}}</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
text
|
||||
@click="editClick('image', imageTab)"
|
||||
>{{ $ay.t("OK") }}</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
|
||||
<!-- /IMAGE -->
|
||||
|
||||
<!-- CODE -->
|
||||
<v-btn depressed tile class="ml-1" @click="editClick('code')">
|
||||
<v-icon>fa-code</v-icon></v-btn
|
||||
>
|
||||
<v-btn depressed tile @click="editClick('codeblock')">
|
||||
<v-icon>fa-square-full</v-icon></v-btn
|
||||
>
|
||||
<!-- END OF BUTTONS -->
|
||||
</div>
|
||||
</v-col>
|
||||
<!-- DESIGNER -->
|
||||
<v-col
|
||||
v-if="showDesigner()"
|
||||
:cols="currentView == view.SPLIT_VIEW ? 6 : 12"
|
||||
>
|
||||
<div :style="editStyle()">
|
||||
<v-textarea
|
||||
v-cloak
|
||||
@drop.prevent="onDrop"
|
||||
@dragover.prevent
|
||||
solo
|
||||
no-resize
|
||||
:height="editAreaHeight"
|
||||
ref="editArea"
|
||||
@input="handleInput"
|
||||
@dblclick="handleDoubleClick"
|
||||
v-model="localVal"
|
||||
></v-textarea>
|
||||
</div>
|
||||
</v-col>
|
||||
<!-- WIKI auto-grow-->
|
||||
<v-col
|
||||
v-if="showWiki()"
|
||||
:cols="currentView == view.SPLIT_VIEW ? 6 : 12"
|
||||
>
|
||||
<div
|
||||
:style="wikiStyle()"
|
||||
class="markdown-body"
|
||||
v-html="compiledOutput()"
|
||||
></div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-sheet>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -356,6 +346,7 @@ export default {
|
||||
return {
|
||||
localVal: this.value,
|
||||
currentView: 0,
|
||||
reveal: false,
|
||||
selection: {
|
||||
start: 0,
|
||||
end: 0,
|
||||
@@ -415,6 +406,9 @@ export default {
|
||||
// this.editAreaHeight = window.innerHeight / 2;
|
||||
this.editAreaHeight = window.innerHeight * 0.8;
|
||||
},
|
||||
toggleReveal() {
|
||||
this.reveal = !this.reveal;
|
||||
},
|
||||
editStyle() {
|
||||
if (this.currentView == this.view.SPLIT_VIEW) {
|
||||
return "height: " + this.editAreaHeight + "px;";
|
||||
|
||||
Reference in New Issue
Block a user