Egalware/NKC
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Altro test con generazione dinamica CSS + lettura svg e inlining

Browse Source
This commit is contained in:
Samuele E. Locatelli
2019-09-16 12:39:56 +02:00
parent 43903e0883
commit e037b2b184
11 changed files with 212 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
NKC_WF/Content/SheetColor.css
+18 -19
View File
@@ -7,25 +7,11 @@
#IT000002 {
fill: green;
}
#IT000003 {
fill: yellow;
stroke: blue;
/* Safari 4.0 - 8.0 */
-webkit-animation-name: blueFlash;
-webkit-animation-duration: 0.5s;
-webkit-animation-timing-function: linear;
-webkit-animation-delay: 0s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
/* Standard syntax */
animation-name: blueFlash;
animation-duration: 0.5s;
animation-timing-function: linear;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-direction: alternate;
stroke-width: 2px !important;
}
/*#IT000003 {
fill: orange;
.flashStroke;
.strokeThick;
}*/
#IT000004 {
fill: #FF6969;
/*.flashStroke;
@@ -34,6 +20,19 @@
#IT000005 {
fill: #0033FF;
}
/*#IT000006 {
fill: orange;
}*/
#IT000007 {
fill: #AACCFF;
}
#IT000008 {
fill: #2288FF;
}
.tableSvg {
background: url(../Images/test.svg) no-repeat top left;
background-size: contain;
}
.fVerde {
fill: green;
}
NKC_WF/Content/SheetColor.less
+19 -3
View File
@@ -10,11 +10,11 @@
fill: green;
}
#IT000003 {
fill: yellow;
/*#IT000003 {
fill: orange;
.flashStroke;
.strokeThick;
}
}*/
#IT000004 {
fill: #FF6969;
@@ -27,6 +27,22 @@
fill: #0033FF;
}
/*#IT000006 {
fill: orange;
}*/
#IT000007 {
fill: #AACCFF;
}
#IT000008 {
fill: #2288FF;
}
.tableSvg {
background: url(../Images/test.svg) no-repeat top left;
background-size: contain;
}
.fVerde {
fill: green;
NKC_WF/Content/SheetColor.min.css
Vendored
+1 -1
View File
@@ -1 +1 @@
rect{transform:rotate(90deg);}#IT000001{fill:#fa5;}#IT000002{fill:green;}#IT000003{fill:yellow;stroke:blue;-webkit-animation-name:blueFlash;-webkit-animation-duration:.5s;-webkit-animation-timing-function:linear;-webkit-animation-delay:0s;-webkit-animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-name:blueFlash;animation-duration:.5s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:alternate;stroke-width:2px !important;}#IT000004{fill:#ff6969;}#IT000005{fill:#03f;}.fVerde{fill:green;}.fBlu{fill:blue;}.strokeThick{stroke-width:2px !important;}.flashStroke{stroke:blue;-webkit-animation-name:blueFlash;-webkit-animation-duration:.5s;-webkit-animation-timing-function:linear;-webkit-animation-delay:0s;-webkit-animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-name:blueFlash;animation-duration:.5s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:alternate;}@-webkit-keyframes blueFlash{0%{stroke:#c4dbff;}25%{stroke:#9dc4ff;}50%{stroke:#5ca5ff;}75%{stroke:#1b82ff;}100%{stroke:#005ccc;}}
rect{transform:rotate(90deg);}#IT000001{fill:#fa5;}#IT000002{fill:green;}#IT000004{fill:#ff6969;}#IT000005{fill:#03f;}#IT000007{fill:#acf;}#IT000008{fill:#28f;}.tableSvg{background:url(../Images/test.svg) no-repeat top left;background-size:contain;}.fVerde{fill:green;}.fBlu{fill:blue;}.strokeThick{stroke-width:2px !important;}.flashStroke{stroke:blue;-webkit-animation-name:blueFlash;-webkit-animation-duration:.5s;-webkit-animation-timing-function:linear;-webkit-animation-delay:0s;-webkit-animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-name:blueFlash;animation-duration:.5s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:alternate;}@-webkit-keyframes blueFlash{0%{stroke:#c4dbff;}25%{stroke:#9dc4ff;}50%{stroke:#5ca5ff;}75%{stroke:#1b82ff;}100%{stroke:#005ccc;}}
NKC_WF/Images/test.svg
+3 -3
View File
@@ -31,14 +31,14 @@
/>
<path id="IT000005"
d="m 34.773809,29.392856 21.922618,5.291666 8.315478,12.851191 -2.267857,28.726191 c 0,0 -12.851191,34.017856 -16.630954,30.994046 -3.779761,-3.02381 -15.875,-9.82738 -15.875,-9.82738 l 3.779763,-43.089284 z"
fill="#DEDEFF" />
/>
<path id="IT000004"
d="m 81.642856,31.660713 2.267858,37.041667 43.845236,4.535714 42.33333,-6.047618 9.07143,-34.017857 -65.76785,-12.095238 z" fill="#DEFFDE" />
d="m 81.642856,31.660713 2.267858,37.041667 43.845236,4.535714 42.33333,-6.047618 9.07143,-34.017857 -65.76785,-12.095238 z" />
<path id="IT000003"
d="m 80.130951,98.184522 31.749999,-3.023809 22.67857,12.095237 40.82143,-9.82738 v 37.04167 l -52.91667,30.23809 -42.333329,-27.97024 z" />
<path id="IT000002"
d="m 35.52976,126.91071 27.970239,3.77977 3.779761,123.22023 -34.773809,2.26786 z" />
<path id="IT00000111"
<path id="IT000001"
d="m 89.958332,174.53571 35.529758,24.19048 38.55357,-24.19048 5.29167,72.57143 -64.25595,8.31548 z"
/>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

NKC_WF/MachineUnload.aspx
+43 -13
View File
@@ -1,18 +1,48 @@
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="MachineUnload.aspx.cs" Inherits="NKC_WF.MachineUnload" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<%-- <link href="Content/SheetColor.css" rel="stylesheet" />
<div style="width: 200px; height: 200px;">
<svg viewBox='0 0 105 93' xmlns='http://www.w3.org/2000/svg'>
<path id="IT000002" d='M66,0h39v93zM38,0h-38v93zM52,35l25,58h-16l-8-18h-18z' fill='#ED1C24' />
</svg>
</div>
<svg>
<rect x="10" y="10" width="50" height="50" fill="blue" id="IT000003" />
<rect x="25" y="25" width="50" height="50" fill="orange" id="IT000004" />
</svg>--%>
<div style="width: 100%">
<object type="image/svg+xml" data="Images/test.svg">
</object>
<asp:UpdatePanel runat="server" ID="uplTavola">
<ContentTemplate>
<asp:Timer runat="server" ID="timReloadCss" Interval="1000" ></asp:Timer>
<link href="getDynCss" rel="stylesheet" />
</ContentTemplate>
</asp:UpdatePanel>
<%--
<div id="uplTavola">
<link href="getDynCss" rel="stylesheet" id="dynCss" />
</div>
<script type="text/javascript">
setInterval("my_function();", 1000);
function my_function() {
$('#uplTavola').load(location.href + ' #dynCss');
}
</script>--%>
<asp:UpdatePanel runat="server" ID="upnlDrawings">
<ContentTemplate>
<div class="row">
<div class="col-2">
<div style="width: 200px; height: 200px;">
<svg viewBox='0 0 105 93' xmlns='http://www.w3.org/2000/svg'>
<path id="IT000006" d='M66,0h39v93zM38,0h-38v93zM52,35l25,58h-16l-8-18h-18z' fill='#ED1C24' />
</svg>
</div>
</div>
<div class="col-8">
<svg viewBox='0 0 1000 1000' xmlns='http://www.w3.org/2000/svg' runat="server" id="svgTable">
</svg>
<%--<object type="image/svg+xml" data="Images/test.svg">
</object>--%>
</div>
<div class="col-2">
<%--<svg>
<rect x="10" y="10" width="50" height="50" fill="blue" id="IT000007" />
<rect x="25" y="25" width="50" height="50" fill="orange" id="IT000008" />
</svg>--%>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
NKC_WF/MachineUnload.aspx.cs
+8 -5
View File
@@ -1,15 +1,18 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
namespace NKC_WF
{
public partial class MachineUnload : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string filename = Server.MapPath("~/Images/test.svg");
string answ = File.ReadAllText(filename);
svgTable.InnerHtml = answ;
}
protected void timReloadCss_Tick(object sender, EventArgs e)
{
}
NKC_WF/MachineUnload.aspx.designer.cs
Generated
+36
View File
@@ -11,5 +11,41 @@ namespace NKC_WF {
public partial class MachineUnload {
/// <summary>
/// Controllo uplTavola.
/// </summary>
/// <remarks>
/// Campo generato automaticamente.
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
/// </remarks>
protected global::System.Web.UI.UpdatePanel uplTavola;
/// <summary>
/// Controllo timReloadCss.
/// </summary>
/// <remarks>
/// Campo generato automaticamente.
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
/// </remarks>
protected global::System.Web.UI.Timer timReloadCss;
/// <summary>
/// Controllo upnlDrawings.
/// </summary>
/// <remarks>
/// Campo generato automaticamente.
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
/// </remarks>
protected global::System.Web.UI.UpdatePanel upnlDrawings;
/// <summary>
/// Controllo svgTable.
/// </summary>
/// <remarks>
/// Campo generato automaticamente.
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
/// </remarks>
protected global::System.Web.UI.HtmlControls.HtmlGenericControl svgTable;
}
}
NKC_WF/NKC_WF.csproj
+8
View File
@@ -173,6 +173,7 @@
<DependentUpon>SheetColor.css</DependentUpon>
</Content>
<Content Include="DevUtils.aspx" />
<Content Include="getDynCss.aspx" />
<Content Include="Images\test.backup.svg" />
<Content Include="Images\test.svg" />
<Content Include="MachineLoad.aspx" />
@@ -339,6 +340,13 @@
<Compile Include="DevUtils.aspx.designer.cs">
<DependentUpon>DevUtils.aspx</DependentUpon>
</Compile>
<Compile Include="getDynCss.aspx.cs">
<DependentUpon>getDynCss.aspx</DependentUpon>
<SubType>ASPXCodeBehind</SubType>
</Compile>
<Compile Include="getDynCss.aspx.designer.cs">
<DependentUpon>getDynCss.aspx</DependentUpon>
</Compile>
<Compile Include="Global.asax.cs">
<DependentUpon>Global.asax</DependentUpon>
</Compile>
NKC_WF/getDynCss.aspx
+16
View File
@@ -0,0 +1,16 @@
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="getDynCss.aspx.cs" Inherits="NKC_WF.getDynCss" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
NKC_WF/getDynCss.aspx.cs
+34
View File
@@ -0,0 +1,34 @@
using System;
using System.IO;
namespace NKC_WF
{
public partial class getDynCss : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
// retitusico un CSS continuamente aggiornato...
Response.Clear();
string filename = Server.MapPath("~/Content/SheetColor.css");
string answ = File.ReadAllText(filename);
// rendo dinamico in base al secondo pari/dispari il mio #IT00006
int secondi = DateTime.Now.Second;
if (secondi % 2 == 0)
{
answ += "#IT000006 {fill: orange;}";
answ += "#IT000003 {fill: orange; .flashStroke; .strokeThick;}";
}
else
{
answ += "#IT000006 {fill: blue;}";
answ += "#IT000003 {fill: blue; .flashStroke; .strokeThick;}";
}
Response.ContentType = "text/css";
Response.Write(answ);
Response.Flush();
Response.End();
}
}
}
NKC_WF/getDynCss.aspx.designer.cs
Generated
+26
View File
@@ -0,0 +1,26 @@
//------------------------------------------------------------------------------
// <auto-generated>
// Codice generato da uno strumento.
//
// Le modifiche a questo file possono causare un comportamento non corretto e verranno perse se
// il codice viene rigenerato.
// </auto-generated>
//------------------------------------------------------------------------------
namespace NKC_WF
{
public partial class getDynCss
{
/// <summary>
/// Controllo form1.
/// </summary>
/// <remarks>
/// Campo generato automaticamente.
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
/// </remarks>
protected global::System.Web.UI.HtmlControls.HtmlForm form1;
}
}